Display lighting/bitcoin payment confirm in fiat if selected

Author: tanx

src/computed/payment.js

@@ -1,13 +1,23 @@
 import { computed, extendObservable } from 'mobx';
-import { formatNumber } from '../helper';
+import { toSatoshis, toAmountLabel } from '../helper';
 
 const ComputedPayment = store => {
   extendObservable(store, {
-    paymentAmountLabel: computed(() => formatNumber(store.payment.amount)),
-    paymentFeeLabel: computed(() => formatNumber(store.payment.fee)),
+    paymentAmountLabel: computed(() => {
+      const { payment, settings } = store;
+      const satoshis = toSatoshis(payment.amount, settings.unit);
+      return toAmountLabel(satoshis, store.settings);
+    }),
+    paymentFeeLabel: computed(() => {
+      const { payment, settings } = store;
+      const satoshis = toSatoshis(payment.fee, settings.unit);
+      return toAmountLabel(satoshis, store.settings);
+    }),
     paymentTotalLabel: computed(() => {
-      const { payment } = store;
-      return formatNumber(Number(payment.amount) + Number(payment.fee));
+      const { payment, settings } = store;
+      const satAmount = toSatoshis(payment.amount, settings.unit);
+      const satFee = toSatoshis(payment.fee, settings.unit);
+      return toAmountLabel(satAmount + satFee, store.settings);
     }),
   });
 };

src/view/pay-bitcoin-confirm.js

@@ -64,14 +64,14 @@ const PayBitcoinConfirmView = ({ store, nav, payment }) => (
               {store.paymentAmountLabel}
             </BalanceLabelNumeral>
             <BalanceLabelUnit style={styles.unit}>
-              {store.unit}
+              {store.unitLabel}
             </BalanceLabelUnit>
           </BalanceLabel>
           <NamedField name="Fee">
-            {store.paymentFeeLabel} {store.unit}
+            {store.paymentFeeLabel} {store.unitLabel}
           </NamedField>
           <NamedField name="Total" style={styles.totalLbl}>
-            {store.paymentTotalLabel} {store.unit}
+            {store.paymentTotalLabel} {store.unitLabel}
           </NamedField>
         </FormStretcher>
         <PillButton

src/view/pay-lightning-confirm.js

@@ -59,14 +59,14 @@ const PayLightningConfirmView = ({ store, nav, payment }) => (
               {store.paymentAmountLabel}
             </BalanceLabelNumeral>
             <BalanceLabelUnit style={styles.unit}>
-              {store.unit}
+              {store.unitLabel}
             </BalanceLabelUnit>
           </BalanceLabel>
           <NamedField name="Fee">
-            {store.paymentFeeLabel} {store.unit}
+            {store.paymentFeeLabel} {store.unitLabel}
           </NamedField>
           <NamedField name="Total" style={styles.totalLbl}>
-            {store.paymentTotalLabel} {store.unit}
+            {store.paymentTotalLabel} {store.unitLabel}
           </NamedField>
         </FormStretcher>
         <PillButton