From 6dcc53b9506f77446667e59c3f47b6a3bba803ca Mon Sep 17 00:00:00 2001
From: Juan Cortes Ross <juan@bohem.io>
Date: Fri, 22 Feb 2019 13:52:10 +0100
Subject: [PATCH] Moves logic to currencieStatus selector, prevents continue on
 Send flow

---
 src/components/CurrenciesStatusBanner.js      | 16 ++++----------
 .../modals/Send/steps/01-step-amount.js       | 10 ++++++++-
 src/reducers/currenciesStatus.js              | 21 ++++++++++++++++++-
 3 files changed, 33 insertions(+), 14 deletions(-)

diff --git a/src/components/CurrenciesStatusBanner.js b/src/components/CurrenciesStatusBanner.js
index 2d0b72fd..a208f38f 100644
--- a/src/components/CurrenciesStatusBanner.js
+++ b/src/components/CurrenciesStatusBanner.js
@@ -15,7 +15,6 @@ import IconCross from 'icons/Cross'
 import IconTriangleWarning from 'icons/TriangleWarning'
 import IconChevronRight from 'icons/ChevronRight'
 
-import { listCryptoCurrencies } from 'config/cryptocurrencies'
 import { dismissedBannersSelector } from 'reducers/settings'
 import { currenciesStatusSelector, fetchCurrenciesStatus } from 'reducers/currenciesStatus'
 import { currenciesSelector } from 'reducers/accounts'
@@ -94,16 +93,7 @@ class CurrenciesStatusBanner extends PureComponent<Props> {
   render() {
     const { dismissedBanners, accountsCurrencies, currenciesStatus, t } = this.props
 
-    const currenciesStatusWithTerminated = currenciesStatus.concat(
-      listCryptoCurrencies(true, true).map(coin => ({
-        id: coin.id,
-        nonce: 98,
-        message: t('banners.genericTerminatedCrypto', { coinName: coin.name }),
-        link: (coin.terminated && coin.terminated.link) || '#',
-      })),
-    )
-
-    const filtered = currenciesStatusWithTerminated.filter(
+    const filtered = currenciesStatus.filter(
       item =>
         accountsCurrencies.find(cur => cur.id === item.id) &&
         dismissedBanners.indexOf(getItemKey(item)) === -1,
@@ -112,7 +102,9 @@ class CurrenciesStatusBanner extends PureComponent<Props> {
     if (!filtered.length) return null
     return (
       <Box flow={2} style={styles.container}>
-        {filtered.map(r => <BannerItem key={r.id} t={t} item={r} onItemDismiss={this.dismiss} />)}
+        {filtered.map(r => (
+          <BannerItem key={`{r.id}_${r.nonce}`} t={t} item={r} onItemDismiss={this.dismiss} />
+        ))}
       </Box>
     )
   }
diff --git a/src/components/modals/Send/steps/01-step-amount.js b/src/components/modals/Send/steps/01-step-amount.js
index fd810e9c..4a973332 100644
--- a/src/components/modals/Send/steps/01-step-amount.js
+++ b/src/components/modals/Send/steps/01-step-amount.js
@@ -19,6 +19,7 @@ import RecipientField from '../fields/RecipientField'
 import AmountField from '../fields/AmountField'
 
 import type { StepProps } from '../index'
+import { listCryptoCurrencies } from '../../../../config/cryptocurrencies'
 
 export default ({
   t,
@@ -154,6 +155,9 @@ export class StepAmountFooter extends PureComponent<
   render() {
     const { t, transitionTo, account } = this.props
     const { isSyncing, totalSpent, canNext } = this.state
+    const isTerminated =
+      account && listCryptoCurrencies(true, true).some(coin => coin.name === account.currency.name)
+
     return (
       <Fragment>
         <Box grow>
@@ -190,7 +194,11 @@ export class StepAmountFooter extends PureComponent<
             {isSyncing && <Spinner size={10} />}
           </Box>
         </Box>
-        <Button disabled={!canNext} primary onClick={() => transitionTo('device')}>
+        <Button
+          disabled={!canNext && !!isTerminated}
+          primary
+          onClick={() => transitionTo('device')}
+        >
           {t('common.continue')}
         </Button>
       </Fragment>
diff --git a/src/reducers/currenciesStatus.js b/src/reducers/currenciesStatus.js
index b582fa87..b0a228a6 100644
--- a/src/reducers/currenciesStatus.js
+++ b/src/reducers/currenciesStatus.js
@@ -1,4 +1,5 @@
 // @flow
+import React from 'react'
 
 import { handleActions, createAction } from 'redux-actions'
 import { createSelector } from 'reselect'
@@ -8,7 +9,9 @@ import network from 'api/network'
 import { urls } from 'config/urls'
 import logger from 'logger'
 
+import { Trans } from 'react-i18next'
 import type { State } from './index'
+import { listCryptoCurrencies } from '../config/cryptocurrencies'
 
 export type CurrencyStatus = {
   id: string, // the currency id
@@ -39,8 +42,24 @@ export const fetchCurrenciesStatus = () => async (dispatch: *) => {
       method: 'GET',
       url: process.env.LL_STATUS_ENDPOINT || urls.currenciesStatus,
     })
+
+    const terminatedCurrencies = listCryptoCurrencies(true, true).map(coin => ({
+      id: coin.id,
+      nonce: 98,
+      message: (
+        <Trans
+          i18nKey="banners.genericTerminatedCrypto"
+          values={{ coinName: coin.name }}
+          parent="div"
+        />
+      ),
+      link: (coin.terminated && coin.terminated.link) || '#',
+    }))
+
     if (Array.isArray(data)) {
-      dispatch(setCurrenciesStatus(data))
+      dispatch(setCurrenciesStatus(data.concat(terminatedCurrencies)))
+    } else {
+      setCurrenciesStatus(terminatedCurrencies)
     }
   } catch (err) {
     logger.error(err)