set tx parameters properly - add view on blockchain

src/pages/tx-details/tx-details.html

@@ -21,7 +21,7 @@
       </div>
 
       <div class="amount-str">{{amountStr | toUnit : tx.amount}}</div>
-      <div class="amount-alt-str">{{fiatAmountStr | toFiat : tx.amount}}</div>
+      <div class="amount-alt-str">{{tx.alternativeAmountStr || '...'}}</div>
     </ion-item>
 
     <ion-item>
@@ -29,15 +29,16 @@
         <img src="assets/img/icon-wallet.svg" class="icon-wallet">
       </ion-avatar>
       <h2 translate>To</h2>
-      <p>{{destinationAddress || '...address to send...'}}</p>
+      <p *ngIf="tx.action != 'sent'">{{wallet.name || '...'}}</p>
+      <p *ngIf="tx.action == 'sent'">{{destinationAddress || '...'}}</p>
     </ion-item>
 
-    <ion-item *ngIf="tx.action != 'received'">
+    <ion-item *ngIf="tx.action == 'sent'">
       <ion-avatar item-start>
         <img src="assets/img/icon-wallet.svg" class="icon-wallet">
       </ion-avatar>
       <h2 translate>From</h2>
-      <p>{{destinationAddress || '...address from was sent...'}}</p>
+      <p>{{wallet.name || '...'}}</p>
     </ion-item>
 
     <ion-item>
@@ -54,13 +55,15 @@
 
     <button ion-item (click)="addMemo()" *ngIf="tx.action != 'received'">
       <ion-label>{{'Fee' | translate}}</ion-label>
-      <span>{{tx.message}}</span>
+      <ion-note item-end>
+        {{tx.feeStr}} - {{fiatFee | toFiat: tx.fees || '...'}}
+      </ion-note>
     </button>
 
     <ion-item>
       <ion-label>{{'Confirmations' | translate}}</ion-label>
       <ion-note item-end>
-        {{tx.Confirmations || 'Unconfirmed' | translate}}
+        {{(tx.safeConfirmed || tx.Confirmations) || 'Unconfirmed' | translate}}
       </ion-note>
     </ion-item>
   </ion-list>

src/pages/tx-details/tx-details.ts

@@ -1,6 +1,8 @@
 import { Component } from "@angular/core";
 import { NavParams } from 'ionic-angular';
 import { TxFormatProvider } from '../../providers/tx-format/tx-format';
+import { WalletProvider } from '../../providers/wallet/wallet';
+import { ExternalLinkProvider } from '../../providers/external-link/external-link';
 
 @Component({
   selector: 'page-tx-details',
@@ -9,20 +11,35 @@ import { TxFormatProvider } from '../../providers/tx-format/tx-format';
 export class TxDetailsPage {
   public title: string;
   public tx: any;
-  public fiatAmountStr: string;
+  public destinationAddress: string;
+
+  private wallet: any;
   
   constructor(
     private navParams: NavParams,
     private txFormatProvider: TxFormatProvider,
+    private walletProvider: WalletProvider,
+    private externalLinkProvider: ExternalLinkProvider,
   ) {
+    this.wallet = this.navParams.data.wallet;
     this.tx = this.navParams.data.tx;
-    this.fiatAmountStr = this.txFormatProvider.formatAlternativeStr('btc', this.tx.amount);
   }
 
   ionViewDidEnter() {
     if (this.tx.action == 'sent') this.title = 'Sent Funds';
     if (this.tx.action == 'received') this.title = 'Received Funds';
     if (this.tx.action == 'moved') this.title = 'Moved Funds';
+
+    this.walletProvider.getTx(this.wallet, this.tx.txid).then((tx) => {
+      this.updateTxParams(tx);
+    }).catch((err) => {
+      console.log('ERROR', err);
+    });
+  }
+
+  private updateTxParams(tx: any) {
+    this.tx = tx;
+    this.destinationAddress = tx.addressTo;
   }
 
   addMemo() {
@@ -30,6 +47,7 @@ export class TxDetailsPage {
   }
 
   viewOnBlockchain() {
-    return;
+    const url = 'https://insight.bitpay.com/tx/' + this.tx.txid;
+    this.externalLinkProvider.open(url);
   }
 }

src/pages/wallet-details/wallet-details.scss

@@ -38,6 +38,7 @@ page-wallet-details {
   .detail {
     position: absolute;
     right: 40px;
+    text-align: end;
     .amount {
       color: color($colors, primary);
       font-size: 16px;

src/pages/wallet-details/wallet-details.ts

@@ -1,7 +1,6 @@
 import { Component } from '@angular/core';
 import { NavController, NavParams } from 'ionic-angular';
 import { WalletProvider } from '../../providers/wallet/wallet';
-import { ConfigProvider } from '../../providers/config/config';
 import { TxDetailsPage } from '../../pages/tx-details/tx-details';
 
 @Component({
@@ -10,17 +9,14 @@ import { TxDetailsPage } from '../../pages/tx-details/tx-details';
 })
 export class WalletDetailsPage {
   public wallet: any;
-  public unitCode: string;
   public alternativeBalanceStr: string;
 
   constructor(
     private navCtrl: NavController,
     private navParams: NavParams,
     private walletProvider: WalletProvider,
-    private configProvider: ConfigProvider,
   ) {
     this.wallet = this.navParams.data.wallet;
-    this.unitCode = this.configProvider.get()['wallet']['settings'].unitCode;
   }
   
   ionViewDidEnter() {
@@ -32,7 +28,7 @@ export class WalletDetailsPage {
   }
   
   goToTxDetails(tx: any) {
-    this.navCtrl.push(TxDetailsPage, {tx: tx});
+    this.navCtrl.push(TxDetailsPage, {wallet: this.wallet, tx: tx});
   }
   
   getTxHistory(force?: boolean) {