"has no funds" case

src/js/controllers/walletToWalletController.js

@@ -1,14 +1,23 @@
 'use strict';
 
-angular.module('copayApp.controllers').controller('walletToWalletController', function($scope, $rootScope, $log, profileService, configService) {
+angular.module('copayApp.controllers').controller('walletToWalletController', function($scope, $rootScope, $log, configService, gettextCatalog, profileService) {
-
-  // TODO: change according to which screen this is, origin/destination
-  $scope.headerTitle = gettextCatalog.getString('Choose your origin wallet');
-  $scope.headerSubtitle = gettextCatalog.getString('This is where the Bitcoin will be taken out from.');
 
   $scope.$on("$ionicView.enter", function(event, data) {
-    $scope.walletsBch = profileService.getWallets({coin: 'bch'});
+    $scope.type = 'origin';
-    $scope.walletsBtc = profileService.getWallets({coin: 'btc'});
+    $scope.coin = 'bch';
+    $scope.walletsEmpty = [];
+    $scope.isPaymentRequest = true;
+
+    if ($scope.type === 'origin') {
+      $scope.headerTitle = gettextCatalog.getString('Choose a wallet to send from');
+      $scope.walletsEmpty = profileService.getWallets({coin: $scope.coin, hasNoFunds: true});
+    } else if ($scope.type === 'destination') {
+      $scope.headerTitle = gettextCatalog.getString('Choose a wallet to send to');
+    }
+
+    $scope.walletsBch = profileService.getWallets({coin: 'bch', hasFunds: $scope.type==='origin'});
+    $scope.walletsBtc = profileService.getWallets({coin: 'btc', hasFunds: $scope.type==='origin'});
+
     configService.whenAvailable(function(config) {
       $scope.selectedPriceDisplay = config.wallet.settings.priceDisplay;
     });
@@ -17,5 +26,4 @@ angular.module('copayApp.controllers').controller('walletToWalletController', fu
   $scope.useWallet = function(wallet) {
       // Do something with selected wallet
   };
-
 });

src/js/services/profileService.js

@@ -847,6 +847,13 @@ angular.module('copayApp.services')
         });
       }
 
+      if (opts.hasNoFunds) {
+        ret = lodash.filter(ret, function(w) {
+          if (!w.status) return;
+          return (w.status.availableBalanceSat === 0);
+        });
+      }
+
       if (opts.minAmount) {
         ret = lodash.filter(ret, function(w) {
           if (!w.status) return;

src/sass/views/wallet-to-wallet-transfer.scss

@@ -1,18 +1,71 @@
 #wallet-to-wallet-transfer {
-  .header, .list {
+  .header--request {
+    padding: 30px 24px;
+    width: 100%;
+    height: 139px;
+    background-color: #fff;
+    &__title {
+      width: 46px;
+      height: 20px;
+      font-size: 16px;
+      font-weight: 600;
+      letter-spacing: -0.4px;
+      color: #000000;
+    }
+    &__amount {
+      font-size: 29px;
+      font-weight: 600;
+      letter-spacing: -0.7px;
+      color: #000000;
+      margin: 11px 0 2px;
+    }
+    &__amount-alt {
+      opacity: 0.45;
+      font-size: 16px;
+      font-weight: 600;
+      letter-spacing: -0.4px;
+      color: #000000;
+    }
+  }
+  .wallets-header {
     font-size: 12px;
-    margin: 20px 14px;
+    margin: 20px 14px 0px;
 
     .title {
-      font-size: 20px;
+      font-size: 16px;
       font-weight: bold;
       color: $v-dark-gray;
+      margin-bottom: -12px;
     }
-    .subtitle {
+  }
-      font-size: 12px;
+  .card {
-      line-height: 1.5em;
+    font-size: 12px;
-      font-weight: 300;
+    margin: 20px 14px 0px;
-      color: $v-dark-gray;
+
+    .item-heading {
+      font-weight: 600;
+    }
+
+    &-insufficient {
+      .wallet {
+        opacity: 0.4;
+
+      }
+      .item-heading {
+        font-size: 12px;
+        >div {
+          display: inline-block;
+          vertical-align: text-bottom;
+        }
+      }
+      &__dot {
+        display: inline-block;
+        width: 16px;
+        height: 16px;
+        background-color: #ec5959;
+        border-radius: 8px;
+        margin: 2px 6px 2px 2px;
+      }
     }
   }
 }

www/views/wallet-to-wallet-transfer.html

@@ -3,13 +3,15 @@
     <ion-nav-title>{{'Wallet to wallet transfer' | translate}}</ion-nav-title>
   </ion-nav-bar>
   <ion-content>
-    <div class="header">
+    <div class="header--request" ng-if="isPaymentRequest">
+      <div class="header--request__title" translate>Paying</div>
+      <div class="header--request__amount" translate>$37.42 USD</div>
+      <div class="header--request__amount-alt" translate>0.04580000 BCH</div>
+    </div>
+    <div class="wallets-header">
       <div class="title">
         {{headerTitle}}
       </div>
-      <div class="subtitle">
-        {{headerSubtitle}}
-      </div>
     </div>
     <div class="list card">
       <div class="item item-icon-right item-heading">
@@ -25,7 +27,7 @@
       </div>
     </div>
 
-    <div class="list card">
+    <div class="list card" ng-if="walletsBtc.length > 0">
       <div class="item item-icon-right item-heading">
         <div translate>Bitcoin Core (BTC)</div>
       </div>
@@ -37,5 +39,17 @@
         </a>
       </div>
     </div>
+
+    <div class="list card card-insufficient" ng-if="walletsEmpty.length > 0">
+      <div class="item item-icon-right item-heading">
+        <span class="card-insufficient__dot"></span><div translate>Insufficient funds</div>
+      </div>
+      <div>
+        <a ng-repeat="wallet in walletsEmpty track by $index"
+           class="item item-sub item-icon-left item-big-icon-left item-icon-right wallet">
+          <span ng-include="'views/includes/walletList.html'"></span>
+        </a>
+      </div>
+    </div>
   </ion-content>
 </ion-view>