Add parameter to customize Wait screen copy.

Author: valentinewallace

src/action/index-mobile.js

@@ -49,12 +49,12 @@ export const ipc = sinon.createStubInstance(IpcAction); // STUB DURING DEVELOPME
 export const log = new LogAction(store, ipc, false);
 export const nav = new NavAction(store, NavigationActions, StackActions);
 export const notify = new NotificationAction(store, nav);
-export const wallet = new WalletAction(store, grpc, db, nav, notify);
+export const payment = new PaymentAction(store, grpc, nav, notify, Clipboard);
+export const wallet = new WalletAction(store, grpc, db, nav, notify, payment);
 export const info = new InfoAction(store, grpc, nav, notify);
 export const transaction = new TransactionAction(store, grpc, nav, notify);
 export const channel = new ChannelAction(store, grpc, nav, notify);
 export const invoice = new InvoiceAction(store, grpc, nav, notify, Clipboard);
-export const payment = new PaymentAction(store, grpc, nav, notify, Clipboard);
 export const setting = new SettingAction(store, wallet, db, ipc);
 export const auth = new AuthAction(
   store,

src/action/index.js

@@ -35,12 +35,12 @@ export const log = new LogAction(store, ipc);
 export const nav = new NavAction(store);
 export const grpc = new GrpcAction(store, ipc);
 export const notify = new NotificationAction(store, nav);
-export const wallet = new WalletAction(store, grpc, db, nav, notify);
+export const payment = new PaymentAction(store, grpc, nav, notify, Clipboard);
+export const wallet = new WalletAction(store, grpc, db, nav, notify, payment);
 export const info = new InfoAction(store, grpc, nav, notify);
 export const transaction = new TransactionAction(store, grpc, nav, notify);
 export const channel = new ChannelAction(store, grpc, nav, notify);
 export const invoice = new InvoiceAction(store, grpc, nav, notify, Clipboard);
-export const payment = new PaymentAction(store, grpc, nav, notify, Clipboard);
 export const setting = new SettingAction(store, wallet, db, ipc);
 export const autopilot = new AtplAction(store, grpc, db, notify);
 

src/action/payment.js

@@ -259,7 +259,7 @@ class PaymentAction {
         msg: 'Sending transaction timed out!',
       });
     }, PAYMENT_TIMEOUT);
-    this._nav.goWait();
+    this.initWaitScreen({ copy: 'Sending payment...' });
     try {
       await this._sendPayment();
       this._nav.goPayBitcoinDone();
@@ -295,7 +295,7 @@ class PaymentAction {
       this._nav.goPaymentFailed();
     }, PAYMENT_TIMEOUT);
     try {
-      this._nav.goWait();
+      this.initWaitScreen({ copy: 'Sending payment...' });
       const invoice = this._store.payment.address;
       const stream = this._grpc.sendStreamCommand('sendPayment');
       await new Promise((resolve, reject) => {
@@ -319,6 +319,17 @@ class PaymentAction {
       clearTimeout(timeout);
     }
   }
+
+  /**
+   * Initialize the Wait screen with copy appropriate for what the user is
+   * waiting on.
+   * @param {string} copy Copy to display.
+   * @return {undefined}
+   */
+  initWaitScreen({ copy = 'Loading network...' }) {
+    this._store.waitScreenCopy = copy;
+    this._nav.goWait();
+  }
 }
 
 export default PaymentAction;

src/action/wallet.js

@@ -14,12 +14,13 @@ import { when } from 'mobx';
 import * as log from './log';
 
 class WalletAction {
-  constructor(store, grpc, db, nav, notification) {
+  constructor(store, grpc, db, nav, notification, payment) {
     this._store = store;
     this._grpc = grpc;
     this._db = db;
     this._nav = nav;
     this._notification = notification;
+    this._payment = payment;
   }
 
   //
@@ -245,7 +246,7 @@ class WalletAction {
       this.initResetPassword();
       return this._notification.display({ msg: errorMsg });
     }
-    this._nav.goWait();
+    this._payment.initWaitScreen({ copy: 'Updating password...' });
     await this.resetPassword({
       currentPassword: password,
       newPassword: newPassword,
@@ -394,7 +395,7 @@ class WalletAction {
    */
   async unlockWallet({ walletPassword }) {
     try {
-      this._nav.goWait();
+      this._payment.initWaitScreen({});
       await this._grpc.sendUnlockerCommand('UnlockWallet', {
         walletPassword: toBuffer(walletPassword),
         recoveryWindow: this._store.settings.restoring ? 250 : 0,
@@ -463,7 +464,7 @@ class WalletAction {
     if (this._store.walletAddress) {
       this._nav.goNewAddress();
     } else {
-      this._nav.goWait();
+      this._payment.initWaitScreen({});
       when(() => this._store.walletAddress, () => this._nav.goNewAddress());
     }
   }

src/store.js

@@ -85,6 +85,7 @@ export class Store {
       notifications: [],
       unseenNtfnCount: 0,
       logs: '',
+      waitScreenCopy: 'Loading network...',
 
       // Persistent data
       settings: {

src/view/main-mobile.js

@@ -95,7 +95,7 @@ const Password = () => <PinView store={store} auth={auth} />;
 
 const LoaderSyncing = () => <LoaderSyncingView store={store} />;
 
-const Wait = () => <WaitView />;
+const Wait = () => <WaitView store={store} />;
 
 const Home = () => (
   <HomeView

src/view/main.js

@@ -99,7 +99,7 @@ class MainView extends Component {
           <NewAddress store={store} invoice={invoice} info={info} />
         )}
         {route === 'LoaderSyncing' && <LoaderSyncing store={store} />}
-        {route === 'Wait' && <Wait />}
+        {route === 'Wait' && <Wait store={store} />}
         {route === 'Home' && (
           <Home
             store={store}

src/view/wait-mobile.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import { StyleSheet, ActivityIndicator } from 'react-native';
+import PropTypes from 'prop-types';
 import Background from '../component/background';
 import MainContent from '../component/main-content';
 import Text from '../component/text';
@@ -19,17 +20,21 @@ const styles = StyleSheet.create({
   },
 });
 
-const WaitView = () => (
+const WaitView = ({ store }) => (
   <Background color={color.blackDark}>
     <MainContent style={styles.content}>
       <ActivityIndicator
         size="large"
         color={color.lightPurple}
         style={styles.spinner}
       />
-      <Text style={styles.copy}>Loading network...</Text>
+      <Text style={styles.copy}>{store.waitScreenCopy}</Text>
     </MainContent>
   </Background>
 );
 
+WaitView.propTypes = {
+  store: PropTypes.object.isRequired,
+};
+
 export default WaitView;

src/view/wait.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import { StyleSheet } from 'react-native';
+import PropTypes from 'prop-types';
 import Background from '../component/background';
 import MainContent from '../component/main-content';
 import { color } from '../component/style';
@@ -11,12 +12,16 @@ const styles = StyleSheet.create({
   },
 });
 
-const WaitView = () => (
+const WaitView = ({ store }) => (
   <Background color={color.blackDark}>
     <MainContent style={styles.content}>
-      <ContinuousLoadNetworkSpinner msg="Loading network..." />
+      <ContinuousLoadNetworkSpinner msg={store.waitScreenCopy} />
     </MainContent>
   </Background>
 );
 
+WaitView.propTypes = {
+  store: PropTypes.object.isRequired,
+};
+
 export default WaitView;

stories/screen-story.js

@@ -92,7 +92,13 @@ const ipc = sinon.createStubInstance(IpcAction);
 const grpc = sinon.createStubInstance(GrpcAction);
 const info = sinon.createStubInstance(InfoAction);
 const notify = sinon.createStubInstance(NotificationAction);
-const wallet = new WalletAction(store, grpc, db, nav, notify);
+const payment = new PaymentAction(store, grpc, nav, notify);
+sinon.stub(payment, 'checkType');
+sinon.stub(payment, 'payBitcoin');
+sinon.stub(payment, 'toggleMax');
+sinon.stub(payment, 'payLightning');
+sinon.stub(payment, 'initPayBitcoinConfirm');
+const wallet = new WalletAction(store, grpc, db, nav, notify, payment);
 const setting = new SettingAction(store, wallet, db, ipc);
 const autopilot = sinon.createStubInstance(AtplAction);
 sinon.stub(wallet, 'update');
@@ -104,12 +110,6 @@ const transaction = new TransactionAction(store, grpc, nav, notify);
 sinon.stub(transaction, 'update');
 const invoice = new InvoiceAction(store, grpc, nav, notify, Clipboard);
 sinon.stub(invoice, 'generateUri');
-const payment = new PaymentAction(store, grpc, nav, notify);
-sinon.stub(payment, 'checkType');
-sinon.stub(payment, 'payBitcoin');
-sinon.stub(payment, 'toggleMax');
-sinon.stub(payment, 'payLightning');
-sinon.stub(payment, 'initPayBitcoinConfirm');
 const channel = new ChannelAction(store, grpc, nav, notify);
 sinon.stub(channel, 'update');
 sinon.stub(channel, 'connectAndOpen');
@@ -178,8 +178,8 @@ storiesOf('Screens', module)
   .add('Loader - Syncing Chain (Mobile)', () => (
     <LoaderSyncingMobile store={store} />
   ))
-  .add('Wait', () => <Wait />)
-  .add('Wait (Mobile)', () => <WaitMobile />)
+  .add('Wait', () => <Wait store={store} />)
+  .add('Wait (Mobile)', () => <WaitMobile store={store} />)
   .add('Home', () => (
     <Home
       store={store}

test/integration/action/action-integration.spec.js

@@ -162,11 +162,11 @@ describe('Action Integration Tests', function() {
     ipc1 = new IpcAction(ipcRendererStub1);
     grpc1 = new GrpcAction(store1, ipc1);
     info1 = new InfoAction(store1, grpc1, nav1, notify1);
-    wallet1 = new WalletAction(store1, grpc1, db1, nav1, notify1);
+    payments1 = new PaymentAction(store1, grpc1, nav1, notify1);
+    wallet1 = new WalletAction(store1, grpc1, db1, nav1, notify1, payments1);
     transactions1 = new TransactionAction(store1, grpc1, nav1, notify1);
     channels1 = new ChannelAction(store1, grpc1, nav1, notify1);
     invoice1 = new InvoiceAction(store1, grpc1, nav1, notify1);
-    payments1 = new PaymentAction(store1, grpc1, nav1, notify1);
     autopilot1 = new AtplAction(store1, grpc1, db1, notify1);
 
     db2 = sinon.createStubInstance(AppStorage);
@@ -175,11 +175,11 @@ describe('Action Integration Tests', function() {
     ipc2 = new IpcAction(ipcRendererStub2);
     grpc2 = new GrpcAction(store2, ipc2);
     info2 = new InfoAction(store2, grpc2, nav2, notify2);
-    wallet2 = new WalletAction(store2, grpc2, db2, nav2, notify2);
+    payments2 = new PaymentAction(store2, grpc2, nav2, notify2);
+    wallet2 = new WalletAction(store2, grpc2, db2, nav2, notify2, payments2);
     transactions2 = new TransactionAction(store2, grpc2, nav2, notify2);
     channels2 = new ChannelAction(store2, grpc2, nav2, notify2);
     invoice2 = new InvoiceAction(store2, grpc2, nav2, notify2);
-    payments2 = new PaymentAction(store2, grpc2, nav2, notify2);
     autopilot2 = new AtplAction(store2, grpc2, db2, notify2);
 
     sandbox.stub(autopilot1, 'updateNodeScores').resolves(true);

test/unit/action/payment.spec.js

@@ -453,4 +453,18 @@ describe('Action Payments Unit Tests', () => {
       expect(nav.goPayLightningDone, 'was not called');
     });
   });
+
+  describe('initWaitScreen', () => {
+    it('should set the wait screen copy and go to wait page', () => {
+      const testCopy = 'foobar';
+      payment.initWaitScreen({ copy: testCopy });
+      expect(store.waitScreenCopy, 'to be', testCopy);
+    });
+
+    it('should set default copy if not specified', () => {
+      const defaultCopy = 'Loading network...';
+      payment.initWaitScreen({});
+      expect(store.waitScreenCopy, 'to be', defaultCopy);
+    });
+  });
 });

test/unit/action/wallet.spec.js

@@ -5,6 +5,7 @@ import WalletAction from '../../../src/action/wallet';
 import NavAction from '../../../src/action/nav';
 import NavActionMobile from '../../../src/action/nav-mobile';
 import NotificationAction from '../../../src/action/notification';
+import PaymentAction from '../../../src/action/payment';
 import * as logger from '../../../src/action/log';
 import nock from 'nock';
 import 'isomorphic-fetch';
@@ -18,6 +19,7 @@ describe('Action Wallet Unit Tests', () => {
   let wallet;
   let nav;
   let notification;
+  let payment;
 
   beforeEach(() => {
     sandbox = sinon.createSandbox({});
@@ -30,7 +32,8 @@ describe('Action Wallet Unit Tests', () => {
     db = sinon.createStubInstance(AppStorage);
     notification = sinon.createStubInstance(NotificationAction);
     nav = sinon.createStubInstance(NavAction);
-    wallet = new WalletAction(store, grpc, db, nav, notification);
+    payment = sinon.createStubInstance(PaymentAction);
+    wallet = new WalletAction(store, grpc, db, nav, notification, payment);
   });
 
   afterEach(() => {
@@ -325,7 +328,7 @@ describe('Action Wallet Unit Tests', () => {
 
     it('should navigate to seed intro on mobile', () => {
       nav = sinon.createStubInstance(NavActionMobile);
-      wallet = new WalletAction(store, grpc, db, nav, notification);
+      wallet = new WalletAction(store, grpc, db, nav, notification, payment);
       wallet.initSeed();
       expect(nav.goSeedIntro, 'was called once');
     });
@@ -437,15 +440,15 @@ describe('Action Wallet Unit Tests', () => {
       store.walletAddress = 'non-null-addr';
       wallet.initInitialDeposit();
       expect(nav.goNewAddress, 'was called once');
-      expect(nav.goWait, 'was not called');
+      expect(payment.initWaitScreen, 'was not called');
     });
 
     it('should stay on wait screen until address is non-null', async () => {
       store.walletAddress = null;
       wallet.initInitialDeposit();
       expect(nav.goNewAddress, 'was not called');
       store.walletAddress = 'non-null-addr';
-      expect(nav.goWait, 'was called once');
+      expect(payment.initWaitScreen, 'was called once');
       expect(nav.goNewAddress, 'was called once');
     });
   });
@@ -510,7 +513,7 @@ describe('Action Wallet Unit Tests', () => {
       expect(grpc.sendUnlockerCommand, 'was called with', 'UnlockWallet', {
         walletPassword: Buffer.from('baz', 'utf8'),
       });
-      expect(nav.goWait, 'was called once');
+      expect(payment.initWaitScreen, 'was called once');
       expect(nav.goHome, 'was not called');
       store.lndReady = true;
       store.walletAddress = 'some-address';
@@ -525,7 +528,7 @@ describe('Action Wallet Unit Tests', () => {
         .rejects(new Error('Boom!'));
       await wallet.unlockWallet({ walletPassword: 'baz' });
       expect(notification.display, 'was called once');
-      expect(nav.goWait, 'was called once');
+      expect(payment.initWaitScreen, 'was called once');
       expect(store.walletUnlocked, 'to be', false);
       expect(store.wallet.password, 'to be', '');
       expect(nav.goPassword, 'was called once');