Merge pull request #1189 from input-output-hk/fix/ddw-503-hide-transa…

…ction-status-and-number-of-confirmations-during-wallet-restoration [DDW-503] Hide transaction status and number of confirmations during wallet restoration
input-output-hk · Nov 22, 2018 · e36639f · e36639f
2 parents 8816fbc + 6b8dc71
commit e36639f
Show file tree

Hide file tree

Showing 7 changed files with 46 additions and 24 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -37,6 +37,7 @@ Changelog
 - Implement design review fixes and improvements ([PR 1090](https://github.com/input-output-hk/daedalus/pull/1090))
 - Pinned eslint-scope version via the yarn resolutions feature ([PR 1017](https://github.com/input-output-hk/daedalus/pull/1017))
 - Prevented wallet data polling during wallet deletion ([PR 996](https://github.com/input-output-hk/daedalus/pull/996))
+- Removed transaction status and number of confirmation during wallet restoration ([PR 1189](https://github.com/input-output-hk/daedalus/pull/1189))
 
 ### Chores
 

diff --git a/source/renderer/app/components/wallet/summary/WalletSummary.js b/source/renderer/app/components/wallet/summary/WalletSummary.js
@@ -34,6 +34,7 @@ type Props = {
   numberOfTransactions: number,
   pendingAmount: UnconfirmedAmount,
   isLoadingTransactions: boolean,
+  isRestoreActive: boolean,
 };
 
 @observer
@@ -49,7 +50,8 @@ export default class WalletSummary extends Component<Props> {
       amount,
       pendingAmount,
       numberOfTransactions,
-      isLoadingTransactions
+      isLoadingTransactions,
+      isRestoreActive,
     } = this.props;
     const { intl } = this.context;
     return (
@@ -60,20 +62,26 @@ export default class WalletSummary extends Component<Props> {
             {amount}
             <SVGInline svg={adaSymbolBig} className={styles.currencySymbolBig} />
           </div>
-          {pendingAmount.incoming.greaterThan(0) &&
-            <div className={styles.pendingConfirmation}>
-              {`${intl.formatMessage(messages.pendingIncomingConfirmationLabel)}`}
-              : {pendingAmount.incoming.toFormat(DECIMAL_PLACES_IN_ADA)}
-              <SVGInline svg={adaSymbolSmallest} className={styles.currencySymbolSmallest} />
-            </div>
-          }
-          {pendingAmount.outgoing.greaterThan(0) &&
-            <div className={styles.pendingConfirmation}>
-              {`${intl.formatMessage(messages.pendingOutgoingConfirmationLabel)}`}
-              : {pendingAmount.outgoing.toFormat(DECIMAL_PLACES_IN_ADA)}
-              <SVGInline svg={adaSymbolSmallest} className={styles.currencySymbolSmallest} />
+
+          {!isRestoreActive ? (
+            <div>
+              {pendingAmount.incoming.greaterThan(0) &&
+                <div className={styles.pendingConfirmation}>
+                  {`${intl.formatMessage(messages.pendingIncomingConfirmationLabel)}`}
+                  : {pendingAmount.incoming.toFormat(DECIMAL_PLACES_IN_ADA)}
+                  <SVGInline svg={adaSymbolSmallest} className={styles.currencySymbolSmallest} />
+                </div>
+              }
+              {pendingAmount.outgoing.greaterThan(0) &&
+                <div className={styles.pendingConfirmation}>
+                  {`${intl.formatMessage(messages.pendingOutgoingConfirmationLabel)}`}
+                  : {pendingAmount.outgoing.toFormat(DECIMAL_PLACES_IN_ADA)}
+                  <SVGInline svg={adaSymbolSmallest} className={styles.currencySymbolSmallest} />
+                </div>
+              }
             </div>
-          }
+          ) : null}
+
           {!isLoadingTransactions ? (
             <div className={styles.numberOfTransactions}>
               {intl.formatMessage(messages.transactionsLabel)}: {numberOfTransactions}

diff --git a/source/renderer/app/components/wallet/transactions/Transaction.js b/source/renderer/app/components/wallet/transactions/Transaction.js
@@ -125,6 +125,7 @@ type Props = {
   data: WalletTransaction,
   state: TransactionState,
   assuranceLevel: string,
+  isRestoreActive: boolean,
   isLastInList: boolean,
   formattedWalletAmount: Function,
   onOpenExternalLink: ?Function,
@@ -160,6 +161,7 @@ export default class Transaction extends Component<Props, State> {
     const {
       data, isLastInList, state, assuranceLevel,
       formattedWalletAmount, onOpenExternalLink,
+      isRestoreActive,
     } = this.props;
     const { isExpanded } = this.state;
     const { intl } = this.context;
@@ -200,6 +202,19 @@ export default class Transaction extends Component<Props, State> {
     const currency = intl.formatMessage(globalMessages.currency);
     const symbol = adaSymbol;
 
+    const transactionStateTag = () => {
+      if (isRestoreActive) return;
+      return (
+        (transactionState === transactionStates.OK) ? (
+          <div className={styles[assuranceLevel]}>{status}</div>
+        ) : (
+          <div className={styles[`${transactionState}Label`]}>
+            {intl.formatMessage(stateTranslations[transactionState])}
+          </div>
+        )
+      );
+    };
+
     return (
       <div
         onClick={this.toggleDetails.bind(this)}
@@ -236,14 +251,7 @@ export default class Transaction extends Component<Props, State> {
                 {intl.formatMessage(messages.type, { currency })}
                 , {moment(data.date).format('hh:mm:ss A')}
               </div>
-
-              {(transactionState === transactionStates.OK) ? (
-                <div className={styles[assuranceLevel]}>{status}</div>
-              ) : (
-                <div className={styles[`${transactionState}Label`]}>
-                  {intl.formatMessage(stateTranslations[transactionState])}
-                </div>
-              )}
+              {transactionStateTag()}
             </div>
           </div>
         </div>
@@ -302,7 +310,7 @@ export default class Transaction extends Component<Props, State> {
 
               <div className={styles.row}>
                 <h2>{intl.formatMessage(messages.assuranceLevel)}</h2>
-                {(transactionState === transactionStates.OK) ? (
+                {!isRestoreActive && (transactionState === transactionStates.OK) ? (
                   <span>
                     <span className={styles.assuranceLevel}>{status}</span>.&nbsp;
                     {data.numberOfConfirmations.toLocaleString()}&nbsp;

diff --git a/source/renderer/app/components/wallet/transactions/WalletTransactionsList.js b/source/renderer/app/components/wallet/transactions/WalletTransactionsList.js
@@ -150,6 +150,7 @@ export default class WalletTransactionsList extends Component<Props> {
                 <div key={`${walletId}-${transaction.id}-${transaction.type}`}>
                   <Transaction
                     data={transaction}
+                    isRestoreActive={isRestoreActive}
                     isLastInList={transactionIndex === group.transactions.length - 1}
                     state={transaction.state}
                     assuranceLevel={transaction.getAssuranceLevelForMode(assuranceMode)}

diff --git a/source/renderer/app/containers/wallet/WalletSummaryPage.js b/source/renderer/app/containers/wallet/WalletSummaryPage.js
@@ -80,6 +80,7 @@ export default class WalletSummaryPage extends Component<Props> {
           numberOfTransactions={totalAvailable}
           pendingAmount={unconfirmedAmount}
           isLoadingTransactions={recentTransactionsRequest.isExecutingFirstTime}
+          isRestoreActive={isRestoreActive}
         />
         {walletTransactions}
       </VerticalFlexContainer>

diff --git a/storybook/stories/WalletScreens.stories.js b/storybook/stories/WalletScreens.stories.js
@@ -78,6 +78,7 @@ storiesOf('WalletScreens', module)
       }}
       numberOfTransactions={number('Number of transactions', 20303585)}
       isLoadingTransactions={boolean('isLoadingTransactions', false)}
+      isRestoreActive={boolean('isRestoreActive', false)}
     />
   ))
 
@@ -131,7 +132,8 @@ storiesOf('WalletScreens', module)
           ),
         ]
       }
-      isLoadingTransactions={false}
+      isLoadingTransactions={boolean('isLoadingTransactions', false)}
+      isRestoreActive={boolean('isRestoreActive', false)}
       hasMoreToLoad={false}
       assuranceMode={{ low: 1, medium: 2 }}
       walletId="test-wallet"

diff --git a/storybook/stories/WalletSummary.stories.js b/storybook/stories/WalletSummary.stories.js
@@ -27,6 +27,7 @@ storiesOf('WalletSummary', module)
         }}
         numberOfTransactions={20303585}
         isLoadingTransactions={false}
+        isRestoreActive={false}
       />
     </div>
   ));