Merge pull request #10759 from gabrielbazan7/fix/show-shopping-options

[REF] set integrations
bitpay · Mar 31, 2020 · c5c198f · c5c198f
2 parents a91c449 + f8917ca
commit c5c198f
Show file tree

Hide file tree

Showing 3 changed files with 56 additions and 40 deletions.
diff --git a/src/pages/home/home.html b/src/pages/home/home.html
@@ -113,16 +113,16 @@
     </div>
   </div>
 
-  <ion-list margin-bottom class="bp-list" *ngIf="homeIntegrations && homeIntegrations.length > 0">
-    <ion-item (click)="goToShop()">
+  <ion-list margin-bottom class="bp-list">
+    <ion-item *ngIf="showShoppingOption" (click)="goToShop()">
       <ion-label>
         <div class="services-list-label" translate>Shop</div>
       </ion-label>
       <ion-note item-end>
         <ion-icon class="services-list-arrow" name="ios-arrow-forward-outline" color="light-grey"></ion-icon>
       </ion-note>
     </ion-item>
-    <div class="line-divider"></div>
+    <div *ngIf="showShoppingOption" class="line-divider"></div>
     <ion-item *ngIf="showServicesOption" (click)="goToServices()">
       <ion-label>
         <div class="services-list-label" translate>Services</div>

diff --git a/src/pages/home/home.ts b/src/pages/home/home.ts
@@ -49,7 +49,8 @@ export interface Advertisement {
 export class HomePage {
   public tapped = 0;
   showBuyCryptoOption: boolean;
-  showServicesOption: boolean = false;
+  showShoppingOption: boolean;
+  showServicesOption: boolean;
   @ViewChild('showSurvey')
   showSurvey;
   @ViewChild('showCard')
@@ -106,7 +107,7 @@ export class HomePage {
     const config = this.configProvider.get();
     this.totalBalanceAlternativeIsoCode =
       config.wallet.settings.alternativeIsoCode;
-    this.setAdvertisements();
+    this.setMerchantDirectoryAdvertisement();
     this.showNewDesignSlides();
     this.showSurveyCard();
     this.checkFeedbackInfo();
@@ -124,10 +125,12 @@ export class HomePage {
     this.preFetchWallets();
   }
 
-  private setAdvertisements() {
-    if (this.advertisements.length > 0) return;
-    this.advertisements.push(
-      {
+  private setMerchantDirectoryAdvertisement() {
+    const alreadyVisible = this.advertisements.find(
+      a => a.name === 'merchant-directory'
+    );
+    !alreadyVisible &&
+      this.advertisements.push({
         name: 'merchant-directory',
         title: this.translate.instant('Merchant Directory'),
         body: this.translate.instant(
@@ -138,20 +141,7 @@ export class HomePage {
         link: 'https://bitpay.com/directory/?hideGiftCards=true',
         imgSrc: 'assets/img/icon-merch-dir.svg',
         dismissible: true
-      },
-      {
-        name: 'amazon-gift-cards',
-        title: this.translate.instant('Shop at Amazon'),
-        body: this.translate.instant(
-          'Leverage your crypto with an amazon.com gift card.'
-        ),
-        app: 'bitpay',
-        linkText: this.translate.instant('Buy Now'),
-        link: CardCatalogPage,
-        imgSrc: 'assets/img/amazon.svg',
-        dismissible: true
-      }
-    );
+      });
   }
 
   private getCachedTotalBalance() {
@@ -205,29 +195,55 @@ export class HomePage {
 
   private setIntegrations() {
     // Show integrations
+    this.showBuyCryptoOption = false;
+    this.showShoppingOption = false;
+    this.showServicesOption = false;
     const integrations = this.homeIntegrationsProvider
       .get()
-      .filter(i => i.show)
-      .filter(i => i.name !== 'giftcards' && i.name !== 'debitcard');
-
-    this.homeIntegrations = _.remove(integrations, x => {
-      this.showBuyCryptoOption = x.name == 'simplex' && x.show == true;
-      if (x.name == 'debitcard' && x.linked) return false;
-      else if (x.name == 'coinbase' && (x.show == false || x.linked == true)) {
-        this.showCoinbase = false;
-        return false;
-      } else {
-        if (x.name != 'simplex') {
+      .filter(i => i.show);
+
+    integrations.forEach(x => {
+      switch (x.name) {
+        case 'simplex':
+          this.showBuyCryptoOption = true;
+          break;
+        case 'giftcards':
+          this.showShoppingOption = true;
+          this.setGiftCardAdvertisement();
+          break;
+        case 'shapeshift':
           this.showServicesOption = true;
-        }
-        if (x.name == 'coinbase') {
-          this.showCoinbase = x.show == true && x.linked == false;
+          break;
+        case 'coinbase':
+          this.showCoinbase = x.linked == false;
           this.hasOldCoinbaseSession = x.oldLinked;
           if (this.showCoinbase) this.addCoinbase();
-        }
-        return x;
+          break;
       }
     });
+
+    this.homeIntegrations = integrations.filter(
+      i => i.name == 'shapeshift' || (i.name == 'coinbase' && !i.linked)
+    );
+  }
+
+  private setGiftCardAdvertisement() {
+    const alreadyVisible = this.advertisements.find(
+      a => a.name === 'amazon-gift-cards'
+    );
+    !alreadyVisible &&
+      this.advertisements.unshift({
+        name: 'amazon-gift-cards',
+        title: this.translate.instant('Shop at Amazon'),
+        body: this.translate.instant(
+          'Leverage your crypto with an amazon.com gift card.'
+        ),
+        app: 'bitpay',
+        linkText: this.translate.instant('Buy Now'),
+        link: CardCatalogPage,
+        imgSrc: 'assets/img/amazon.svg',
+        dismissible: true
+      });
   }
 
   private addBitPayCard() {

diff --git a/src/pages/integrations/integrations.html b/src/pages/integrations/integrations.html
@@ -1,7 +1,7 @@
 <wide-header-page title="{{'Services' | translate}}">
   <div page-content>
     <div *ngFor="let service of (homeIntegrations | orderBy: ['name'])" class="card-item sliding-container">
-      <ion-item-sliding class="card-item-sliding" *ngIf="service.name != 'simplex'">
+      <ion-item-sliding class="card-item-sliding">
         <button ion-item (click)="goTo(service.page)" [ngStyle]="{'background': service.background}">
           <img *ngIf="service.showIcon && service.icon" style="margin-right: 8px; width: 32px" src="{{service.icon}}" alt="{{ service.icon }}" />
           <img src="{{service.logo}}" [width]="service.logoWidth ? service.logoWidth : '145'" alt="{{ service.title || service.name }}" />