Coinbase connection issues and logout from tab-setting

src/js/controllers/modals/coinbaseConfirmation.js

@@ -1,20 +0,0 @@
-'use strict';
-
-angular.module('copayApp.controllers').controller('coinbaseConfirmationController', function($scope, $timeout, coinbaseService, applicationService) {
-
-  $scope.ok = function() {
-
-    coinbaseService.logout($scope.network, function() {
-
-      $timeout(function() {
-        applicationService.restart();
-      }, 1000);
-    });
-    $scope.cancel();
-  };
-
-  $scope.cancel = function() {
-    $scope.coinbaseConfirmationModal.hide();
-  };
-
-});

src/js/controllers/preferencesCoinbase.js

@@ -1,18 +1,42 @@
 'use strict';
 
-angular.module('copayApp.controllers').controller('preferencesCoinbaseController',
+angular.module('copayApp.controllers').controller('preferencesCoinbaseController', function($scope, $timeout, $state, $ionicHistory, lodash, ongoingProcess, popupService, coinbaseService) {
-  function($scope, $timeout, $ionicModal, applicationService, coinbaseService) {
 
-    this.revokeToken = function(testnet) {
+  $scope.revokeToken = function() {
-      $scope.network = testnet ? 'testnet' : 'livenet';
+    popupService.showConfirm('Coinbase', 'Are you sure you would like to log out of your Coinbase account?', null, null, function(res) {
-
+      if (res) {
-      $ionicModal.fromTemplateUrl('views/modals/coinbase-confirmation.html', {
+        coinbaseService.logout(function() {
-        scope: $scope,
+          $ionicHistory.clearHistory();
-        animation: 'slide-in-up'
+          $timeout(function() {
-      }).then(function(modal) {
+            $state.go('tabs.home');
-        $scope.coinbaseConfirmationModal = modal;
+          }, 100);
-        $scope.coinbaseConfirmationModal.show();
+        });
+      }
     });
   };
 
+  $scope.$on("$ionicView.enter", function(event, data){
+    coinbaseService.setCredentials();
+    $scope.network = coinbaseService.getEnvironment();
+    ongoingProcess.set('connectingCoinbase', true);
+    coinbaseService.init($scope.accessToken, function(err, data) {
+      ongoingProcess.set('connectingCoinbase', false);
+      if (err || lodash.isEmpty(data)) {
+        ongoingProcess.set('connectingCoinbase', false);
+        if (err) {
+          popupService.showAlert(gettextCatalog.getString('Error'), err);
+        }
+        return;
+      }
+      var accessToken = data.accessToken;
+      var accountId = data.accountId;
+      coinbaseService.getAccount(accessToken, accountId, function(err, account) {
+        $scope.coinbaseAccount = account.data;
+      });
+      coinbaseService.getCurrentUser(accessToken, function(err, user) {
+        $scope.coinbaseUser = user.data;
+      });
+    });
+  });
+
 });

src/js/controllers/tab-settings.js

@@ -1,6 +1,6 @@
 'use strict';
 
-angular.module('copayApp.controllers').controller('tabSettingsController', function($scope, appConfigService, $ionicModal, $log, lodash, uxLanguage, platformInfo, profileService, feeService, configService, externalLinkService, bitpayCardService, storageService, glideraService, gettextCatalog) {
+angular.module('copayApp.controllers').controller('tabSettingsController', function($scope, appConfigService, $window, $log, lodash, uxLanguage, platformInfo, profileService, feeService, configService, externalLinkService, bitpayCardService, storageService, glideraService, coinbaseService, gettextCatalog) {
 
   var updateConfig = function() {
     var isCordova = platformInfo.isCordova;
@@ -26,6 +26,7 @@ angular.module('copayApp.controllers').controller('tabSettingsController', funct
 
       $scope.bitpayCardEnabled = config.bitpayCard.enabled;
       $scope.glideraEnabled = config.glidera.enabled && !isWindowsPhoneApp;
+      $scope.coinbaseEnabled = config.coinbase.enabled && !isWindowsPhoneApp;
 
       if ($scope.bitpayCardEnabled) {
         bitpayCardService.getBitpayDebitCards(function(err, cards) {
@@ -41,6 +42,14 @@ angular.module('copayApp.controllers').controller('tabSettingsController', funct
         });
       }
 
+      if ($scope.coinbaseEnabled) {
+        coinbaseService.setCredentials();
+        storageService.getCoinbaseToken(coinbaseService.getEnvironment(), function(err, token) {
+          if (err) $log.error(err);
+          $scope.coinbaseToken = token;
+        });
+      }
+
     });
   };
 

src/js/routes.js

@@ -936,13 +936,14 @@ angular.module('copayApp').config(function(historicLogProvider, $provide, $logPr
         }
       }
     })
-      .state('tabs.buyandsell.coinbase.preferences', {
+    .state('tabs.preferences.coinbase', {
-        url: '/preferences',
+      url: '/coinbase',
-        'tab-home@tabs': {
+      views: {
+        'tab-settings@tabs': {
           controller: 'preferencesCoinbaseController',
-          controllerAs: 'coinbase',
           templateUrl: 'views/preferencesCoinbase.html'
         }
+      }
     })
       .state('tabs.buyandsell.coinbase.buy', {
         url: '/buy',

src/js/services/coinbaseService.js

@@ -176,10 +176,13 @@ angular.module('copayApp.services').factory('coinbaseService', function($http, $
               storageService.getCoinbaseRefreshToken(credentials.NETWORK, function(err, refreshToken) {
                 if (err) return cb(err);
                 _refreshToken(refreshToken, function(err, newToken) {
+                  if (err) return cb(err);
+                  _getMainAccountId(newToken, function(err, accountId) {
                     if (err) return cb(err);
                     return cb(null, {accessToken: newToken, accountId: accountId});
                   });
                 });
+              });
             } else {
               return cb(err);
             }

www/views/coinbase.html

@@ -3,11 +3,6 @@
     <ion-nav-back-button>
     </ion-nav-back-button>
     <ion-nav-title>Coinbase</ion-nav-title>
-    <ion-nav-buttons side="secondary">
-      <button ng-show="accountId" class="button no-border" ui-sref="tabs.buyandsell.coinbase.preferences">
-        <i class="icon ion-ios-settings"></i>
-      </button>
-    </ion-nav-buttons>
   </ion-nav-bar>
 
   <ion-content>

www/views/modals/coinbase-confirmation.html

@@ -1,18 +0,0 @@
-<ion-modal-view ng-controller="coinbaseConfirmationController">
-  <div class="m20tp text-center">
-    <div class="row">
-    <h1 class="text-center m20b p20h">Are you sure you would like to log out of your Coinbase account?</h1>
-    <p class="text-gray p20h">You will need to log back in to buy or sell bitcoin in Copay.</p>
-    <div class="large-6 medium-6 small-6 columns">
-      <button class="button light-gray expand outline round" ng-click="cancel()">
-        <i class="fi-arrow-left"></i> <span class="tu">Back</span>
-      </button>
-    </div>
-    <div class="large-6 medium-6 small-6 columns">
-      <button class="button warning expand round" ng-click="ok()">
-        <span>Log out</span>
-      </button>
-    </div>
-    </div>
-  </div>
-</ion-modal-view>

www/views/preferencesCoinbase.html

@@ -1,60 +1,62 @@
-<div
+<ion-view>
-  class="topbar-container"
+  <ion-nav-bar class="bar-royal">
-  ng-include="'views/includes/topbar.html'"
+    <ion-nav-back-button>
-  ng-init="titleSection='Preferences'; goBackToState = 'coinbase'; noColor = true">
+    </ion-nav-back-button>
+    <ion-nav-title>Preferences</ion-nav-title>
+  </ion-nav-bar>
+
+  <ion-content>
+
+    <ul ng-if="coinbaseAccount && !error" class="list">
+      <div class="item item-divider">
+        Account
       </div>
-
+      <li class="item">
-<div class="content coinbase-preferences" ng-controller="preferencesCoinbaseController as coinbase">
-
-  <ul ng-if="index.coinbaseAccount && !index.coinbaseError" class="no-bullet m0">
-    <h4 class="title m0">Account</h4>
-    <li>
         <span>ID</span>
-    <span class="right text-gray enable_text_select">
+        <span class="item-note">
-      {{index.coinbaseAccount.id}}
+          {{coinbaseAccount.id}}
         </span>
       </li>
-    <li>
+      <li class="item">
         <span>Name</span>
-    <span class="right text-gray">
+        <span class="item-note">
-      {{index.coinbaseAccount.name}}
+          {{coinbaseAccount.name}}
         </span>
       </li>
-    <li>
+      <li class="item">
         <span>Balance</span>
-    <span class="right text-gray">
+        <span class="item-note">
-      {{index.coinbaseAccount.balance.amount}} {{index.coinbaseAccount.balance.currency}}
+          {{coinbaseAccount.balance.amount}} {{coinbaseAccount.balance.currency}}
         </span>
       </li>
-    <li>
+      <li class="item">
         <span>Native Balance</span>
-    <span class="right text-gray">
+        <span class="item-note">
-      {{index.coinbaseAccount.native_balance.amount}} {{index.coinbaseAccount.native_balance.currency}}
+          {{coinbaseAccount.native_balance.amount}} {{coinbaseAccount.native_balance.currency}}
         </span>
       </li>
 
-    <h4 class="title m0">User Information</h4>
+      <div class="item item-divider">
-    <li>
+        User Information
-    <span>ID</span>
-    <span class="right text-gray enable_text_select">
-      {{index.coinbaseUser.id}}
-    </span>
-    </li>
-    <li>
-    <span>Email</span>
-    <span class="right text-gray">
-      {{index.coinbaseUser.email}}
-    </span>
-    </li>
-  </ul>
-  <ul class="no-bullet m0">
-    <h4></h4>
-    <li ng-click="coinbase.revokeToken(index.coinbaseTestnet)">
-      <i class="icon-arrow-right3 size-24 right text-gray"></i>
-      <span class="text-warning">Log out</span>
-    </li>
-  </ul>
-  <h4></h4>
-
       </div>
-<div class="extra-margin-bottom"></div>
+      <li class="item">
+        <span>ID</span>
+        <span class="item-note">
+          {{coinbaseUser.id}}
+        </span>
+      </li>
+      <li class="item">
+        <span>Email</span>
+        <span class="item-note">
+          {{coinbaseUser.email}}
+        </span>
+      </li>
+
+      <div class="item item-divider"></div>
+      <li class="item" ng-click="revokeToken()">
+        <span>Log out</span>
+      </li>
+    </ul>
+
+  </ion-content>
+</ion-view>

www/views/tab-settings.html

@@ -133,6 +133,13 @@
         <i class="icon bp-arrow-right"></i>
       </a>
 
+      <a class="item item-icon-right"
+         ng-if="coinbaseEnabled && coinbaseToken"
+         ui-sref="tabs.preferences.coinbase">
+        <img src="img/coinbase-logo.png" width="90"/>
+        <i class="icon bp-arrow-right"></i>
+      </a>
+
       <div class="item item-divider"></div>
 
       <a class="item item-icon-right item-icon-left" href ui-sref="tabs.advanced">