refactor(reactive-list): simple renaming and styling

yannbf · yannbf · commit 0f9f16127f31 · 2018-08-02T21:22:58.000+02:00
diff --git a/src/pages/list/reactive-list-label/list-data.ts b/src/pages/list/reactive-list-label/list-data.ts
@@ -1,5 +1,5 @@
 export interface IDataList {
-  nameProduct: string;
+  productName: string;
   author: string;
   pictureProduct: string;
   category: string;
@@ -9,77 +9,77 @@ export interface IDataList {
 
 export const LIST_DATA: IDataList[] = [
   {
-    nameProduct: `Beneath a Scarlet Sky: A Novel`,
+    productName: `Beneath a Scarlet Sky: A Novel`,
     author: 'Mark Sullivan',
     pictureProduct: './assets/img/reactive-list-labels/beneath _scarlet.jpg',
     category: 'Literature & Fiction',
     price: 5.99
   },
   {
-    nameProduct: `The Orphan's Tale: A Novel`,
+    productName: `The Orphan's Tale: A Novel`,
     author: 'Pam Jenoff',
     pictureProduct: './assets/img/reactive-list-labels/the_orphan_tale.jpg',
     category: 'Literature & Fiction',
     price: 10.37
   },
   {
-    nameProduct: 'All the Light We Cannot See: A Novel',
+    productName: 'All the Light We Cannot See: A Novel',
     author: 'Anthony Doerr',
     pictureProduct: './assets/img/reactive-list-labels/all_light_we_cannot_see.jpeg',
     category: 'Literature & Fiction',
     price: 12.99
   },
   {
-    nameProduct: 'Rules of Civility: A Novel',
+    productName: 'Rules of Civility: A Novel',
     author: 'Rules of Civility: A Novel',
     pictureProduct: './assets/img/reactive-list-labels/rules_civility.jpg',
     category: 'Literature & Fiction',
     price: 11.79
   },
   {
-    nameProduct: 'The Glass Castle: A Memoir',
+    productName: 'The Glass Castle: A Memoir',
     author: 'Jeannette Walls',
     pictureProduct: './assets/img/reactive-list-labels/the_glass_castle.jpg',
     category: 'Biographies & Memoirs',
     price: 5.14
   },
   {
-    nameProduct: 'Born a Crime: Stories from a South African Childhood',
+    productName: 'Born a Crime: Stories from a South African Childhood',
     author: 'Trevor Noah',
     pictureProduct: './assets/img/reactive-list-labels/born_a_crime.jpg',
     category: 'Biographies & Memoirs',
     price: 6.0
   },
   {
-    nameProduct: 'Al Franken, Giant of the Senate',
+    productName: 'Al Franken, Giant of the Senate',
     author: 'Al Franken',
     pictureProduct: './assets/img/reactive-list-labels/giant_of_the_senate.jpg',
     category: 'Biographies & Memoirs',
     price: 6.39
   },
   {
-    nameProduct: 'Pandemic (The Extinction Files Book 1)',
+    productName: 'Pandemic (The Extinction Files Book 1)',
     author: 'A.G. Riddle',
     pictureProduct: './assets/img/reactive-list-labels/pandemic.jpg',
     category: 'Biographies & Memoirs',
     price: 5.47
   },
   {
-    nameProduct: 'Origin: A Novel',
+    productName: 'Origin: A Novel',
     author: 'Dan Brown',
     pictureProduct: './assets/img/reactive-list-labels/origin.jpg',
     category: 'Suspense',
     price: 10.99
   },
   {
-    nameProduct: 'The Rooster Bar',
+    productName: 'The Rooster Bar',
     author: 'John Grisham',
     pictureProduct: './assets/img/reactive-list-labels/the_rooster_bar.jpg',
     category: 'Suspense',
     price: 10.99
   },
   {
-    nameProduct: 'The Life We Bury',
+    productName: 'The Life We Bury',
     author: 'Dan Brown',
     pictureProduct: './assets/img/reactive-list-labels/the_life_we_bury.jpg',
     category: 'Suspense',
diff --git a/src/pages/list/reactive-list-label/reactive-list-label.html b/src/pages/list/reactive-list-label/reactive-list-label.html
@@ -18,13 +18,13 @@
     <button ion-fab> {{ currentCategory }} </button>
   </ion-fab>
   <ion-card is-visible [content]="content" (visible)="itemIsVisible($event, book)" *ngFor="let book of dataList">
-      <img [src]="book.pictureProduct"/>
-      <ion-card-content>
-          <ion-card-title>
-            {{ book.nameProduct }}
-          </ion-card-title>
-          <p> {{ book.author }} </p>
-          <b> {{ book.category }} - {{ book.price | currency:'USD' }}</b>
-      </ion-card-content>
+    <img [src]="book.pictureProduct" />
+    <ion-card-content>
+      <ion-card-title>
+        {{ book.productName }}
+      </ion-card-title>
+      <p> {{ book.author }} </p>
+      <b> {{ book.category }} - {{ book.price | currency:'USD' }}</b>
+    </ion-card-content>
   </ion-card>
 </ion-content>
diff --git a/src/pages/list/reactive-list-label/reactive-list-label.ts b/src/pages/list/reactive-list-label/reactive-list-label.ts
@@ -6,15 +6,17 @@ import { LIST_DATA, IDataList } from './list-data';
 @IonicPage()
 @Component({
   selector: 'page-reactive-list-label',
-  templateUrl: 'reactive-list-label.html',
+  templateUrl: 'reactive-list-label.html'
 })
 export class ReactiveListLabelPage {
-
   public dataList = LIST_DATA;
   public currentCategory: string = '';
 
-  constructor(public navCtrl: NavController, public navParams: NavParams, private ngZone: NgZone) {
-  }
+  constructor(
+    public navCtrl: NavController,
+    public navParams: NavParams,
+    private ngZone: NgZone
+  ) {}
 
   public itemIsVisible($event, book: IDataList) {
     console.log(book, $event);
@@ -26,8 +28,11 @@ export class ReactiveListLabelPage {
     const obj = {};
     let qtdVisibleCategory = 0;
     let higherCategory = '';
-    this.dataList.filter(bk => bk.visible)
-    .forEach(bk => obj[bk.category] = obj[bk.category] ? obj[bk.category] + 1 : 1);
+    this.dataList
+      .filter(bk => bk.visible)
+      .forEach(
+        bk => (obj[bk.category] = obj[bk.category] ? obj[bk.category] + 1 : 1)
+      );
     for (const key in obj) {
       if (obj[key] > qtdVisibleCategory) {
         qtdVisibleCategory = obj[key];
@@ -45,5 +50,4 @@ export class ReactiveListLabelPage {
   ionViewDidLoad() {
     console.log('ionViewDidLoad ReactiveListLabelPage');
   }
-
 }
