diff --git a/src/components/modals/AddAccounts/steps/03-step-import.js b/src/components/modals/AddAccounts/steps/03-step-import.js index bc411a96..bf894775 100644 --- a/src/components/modals/AddAccounts/steps/03-step-import.js +++ b/src/components/modals/AddAccounts/steps/03-step-import.js @@ -8,11 +8,10 @@ import uniq from 'lodash/uniq' import { getBridgeForCurrency } from 'bridge' import Box from 'components/base/Box' -import FakeLink from 'components/base/FakeLink' import CurrencyBadge from 'components/base/CurrencyBadge' import Button from 'components/base/Button' import AccountsList from 'components/base/AccountsList' -import IconExchange from 'icons/Exchange' +import IconExclamationCircleThin from 'icons/ExclamationCircleThin' import type { StepProps } from '../index' @@ -26,6 +25,11 @@ class StepImport extends PureComponent { if (prevProps.scanStatus !== 'finished' && this.props.scanStatus === 'finished') { this.unsub() } + + // handle case when we click on retry sync + if (prevProps.scanStatus !== 'scanning' && this.props.scanStatus === 'scanning') { + this.startScanAccountsDevice() + } } componentWillUnmount() { @@ -71,8 +75,12 @@ class StepImport extends PureComponent { setState({ scanStatus: 'scanning' }) + this._unsubscribed = false this.scanSubscription = bridge.scanAccountsOnDevice(currency, devicePath, { next: account => { + // FIXME: this is called even if we unsubscribed + if (this._unsubscribed) return + const { scannedAccounts, checkedAccountsIds, existingAccounts } = this.props const hasAlreadyBeenScanned = !!scannedAccounts.find(a => account.id === a.id) const hasAlreadyBeenImported = !!existingAccounts.find(a => account.id === a.id) @@ -87,8 +95,16 @@ class StepImport extends PureComponent { }) } }, - complete: () => setState({ scanStatus: 'finished' }), - error: err => setState({ scanStatus: 'error', err }), + complete: () => { + // FIXME: this is called even if we unsubscribed + if (this._unsubscribed) return + setState({ scanStatus: 'finished' }) + }, + error: err => { + // FIXME: this is called even if we unsubscribed + if (this._unsubscribed) return + setState({ scanStatus: 'error', err }) + }, }) } catch (err) { setState({ scanStatus: 'error', err }) @@ -145,6 +161,17 @@ class StepImport extends PureComponent { handleUnselectAll = () => this.props.setState({ checkedAccountsIds: [] }) + renderError() { + const { err, t } = this.props + invariant(err, 'Trying to render inexisting error') + return ( + + + {t('app:addAccounts.somethingWentWrong')} + + ) + } + render() { const { scanStatus, @@ -156,6 +183,10 @@ class StepImport extends PureComponent { t, } = this.props + if (err) { + return this.renderError() + } + const currencyName = currency ? currency.name : '' const importableAccounts = scannedAccounts.filter(acc => { @@ -208,17 +239,7 @@ class StepImport extends PureComponent { /> - {err && ( - - {err.message} - - - )} + {err && {err.message}} ) } @@ -270,12 +291,21 @@ export const StepImportFooter = ({ return ( {currency && } + {scanStatus === 'error' && ( + + )} {scanStatus === 'scanning' && ( - setState({ scanStatus: 'finished' })}> + )} - diff --git a/static/i18n/en/app.yml b/static/i18n/en/app.yml index b190b2be..3fab9aaa 100644 --- a/static/i18n/en/app.yml +++ b/static/i18n/en/app.yml @@ -149,7 +149,7 @@ addAccounts: title: Create new account noOperationOnLastAccount: You cannot create a new account because your last account has no operations noAccountToCreate: We didnt find any {{currencyName}} account to create. - retrySync: Retry sync + somethingWentWrong: Something went wrong during synchronization. cta: create: 'Create account' import: 'Import account'