Fix UX for address book view

src/js/controllers/addressbookView.js

@@ -1,6 +1,6 @@
 'use strict';
 
-angular.module('copayApp.controllers').controller('addressbookViewController', function($scope, $state, $timeout, $stateParams, lodash, addressbookService, popupService, $ionicHistory, platformInfo) {
+angular.module('copayApp.controllers').controller('addressbookViewController', function($scope, $state, $timeout, $stateParams, lodash, addressbookService, popupService, $ionicHistory, platformInfo, gettextCatalog) {
   $scope.isChromeApp = platformInfo.isChromeApp;
   $scope.addressbookEntry = {};
   $scope.addressbookEntry.name = $stateParams.name;
@@ -20,13 +20,18 @@ angular.module('copayApp.controllers').controller('addressbookViewController', f
   };
 
   $scope.remove = function(addr) {
-    addressbookService.remove(addr, function(err, ab) {
-      if (err) {
-        popupService.showAlert(gettextCatalog.getString('Error'), err);
-        return;
-      }
-      $ionicHistory.goBack();
-    });
+    var title = gettextCatalog.getString('Warning!');
+    var message = gettextCatalog.getString('Are you sure you want to delete this contact?');
+    popupService.showConfirm(title, message, null, null, function(res) {
+      if (!res) return;
+      addressbookService.remove(addr, function(err, ab) {
+        if (err) {
+          popupService.showAlert(gettextCatalog.getString('Error'), err);
+          return;
+        }
+        $ionicHistory.goBack();
+      });
+    }); 
   };
 
 });

src/sass/views/address-book.scss

@@ -114,6 +114,9 @@
 }
 
 #address-book-view {
+  .has-click {
+    cursor: pointer;
+  }
   .bar.bar-royal {
     border: 0 transparent;
   }

www/views/addressbook.view.html

@@ -5,11 +5,6 @@
     <ion-nav-title>
       <span>{{addressbookEntry.name}}</span>
     </ion-nav-title>
-    <ion-nav-buttons side="secondary">
-      <button class="button back-button" ng-click="remove(addressbookEntry.address)">
-        Remove
-      </button>
-    </ion-nav-buttons>
   </ion-nav-bar>
   <ion-content scroll="false">
     <div class="gravatar-content">
@@ -27,13 +22,19 @@
         <span class="address-book-field-label" translate>Email</span>
         <span>{{addressbookEntry.email}}</span>
       </div>
-      <div class="item item-text-wrap">
-        <span class="address-book-field-label" copy-to-clipboard="addressbookEntry.address" translate>Address</span>
+      <div class="item item-text-wrap" copy-to-clipboard="addressbookEntry.address">
+        <span class="address-book-field-label" translate>Address</span>
         <span>{{addressbookEntry.address}}</span>
       </div>
-    </div>
-    <button class="button button-standard button-primary" ng-click="sendTo()" translate>
-      Send Money
-    </button>
+      <div class="item item-divider"></div>
+      <div class="item item-icon-right has-click" ng-click="sendTo()">
+        <span class="positive" translate>Send Money</span>
+        <i class="icon bp-arrow-right"></i>
+      </div>
+      <div class="item item-divider"></div>
+      <div class="item has-click" ng-click="remove(addressbookEntry.address)">
+        <span class="assertive" translate>Remove</span>
+      </div>
+    </div> 
   </ion-content>
 </ion-view>