Merge pull request #457 from NastiaS/polish

BUG double request to confirm the address on the device in prod

src/components/DeviceCheckAddress.js

@@ -1,75 +0,0 @@
-// @flow
-
-import { PureComponent } from 'react'
-import type { Account } from '@ledgerhq/live-common/lib/types'
-import type { Device } from 'types/common'
-
-import getAddress from 'commands/getAddress'
-
-type Props = {
-  onCheck: boolean => void,
-  render: ({ isVerified?: ?boolean }) => *,
-  account: Account,
-  device: Device,
-}
-
-type State = {
-  isVerified: null | boolean,
-}
-
-class CheckAddress extends PureComponent<Props, State> {
-  state = {
-    isVerified: null,
-  }
-
-  componentDidMount() {
-    const { device, account } = this.props
-    this.verifyAddress({ device, account })
-  }
-
-  componentWillUnmount() {
-    this._isUnmounted = true
-  }
-
-  _isUnmounted = false
-
-  safeSetState = (...args: *) => {
-    if (this._isUnmounted) {
-      return
-    }
-    this.setState(...args)
-  }
-
-  verifyAddress = async ({ device, account }: { device: Device, account: Account }) => {
-    try {
-      const { address } = await getAddress
-        .send({
-          currencyId: account.currency.id,
-          devicePath: device.path,
-          path: account.freshAddressPath,
-          segwit: !!account.isSegwit,
-          verify: true,
-        })
-        .toPromise()
-
-      if (address !== account.freshAddress) {
-        throw new Error('Confirmed address is different')
-      }
-
-      this.safeSetState({ isVerified: true })
-      this.props.onCheck(true)
-    } catch (err) {
-      this.safeSetState({ isVerified: false })
-      this.props.onCheck(false)
-    }
-  }
-
-  render() {
-    const { render } = this.props
-    const { isVerified } = this.state
-
-    return render({ isVerified })
-  }
-}
-
-export default CheckAddress

src/components/modals/Receive/03-step-confirm-address.js

@@ -9,7 +9,6 @@ import type { Device, T } from 'types/common'
 import Box from 'components/base/Box'
 import CurrentAddressForAccount from 'components/CurrentAddressForAccount'
 import DeviceConfirm from 'components/DeviceConfirm'
-import DeviceCheckAddress from 'components/DeviceCheckAddress'
 
 const Container = styled(Box).attrs({
   alignItems: 'center',
@@ -34,7 +33,6 @@ type Props = {
   account: ?Account,
   addressVerified: ?boolean,
   device: ?Device,
-  onCheck: Function,
   t: T,
 }
 
@@ -52,16 +50,7 @@ export default (props: Props) => (
         <Text>{props.t('receive:steps.confirmAddress.text')}</Text>
         {props.account && <CurrentAddressForAccount account={props.account} />}
         {props.device &&
-          props.account && (
-            <Box mb={2} mt={-1}>
-              <DeviceCheckAddress
-                account={props.account}
-                device={props.device}
-                onCheck={props.onCheck}
-                render={({ isVerified }) => <DeviceConfirm error={isVerified === false} />}
-              />
-            </Box>
-          )}
+          props.account && <DeviceConfirm mb={2} mt={-1} error={props.addressVerified === false} />}
       </Fragment>
     )}
   </Container>

src/components/modals/Receive/index.js

@@ -8,6 +8,8 @@ import type { T, Device } from 'types/common'
 
 import { MODAL_RECEIVE } from 'config/constants'
 
+import getAddress from 'commands/getAddress'
+
 import Box from 'components/base/Box'
 import Breadcrumb from 'components/Breadcrumb'
 import Button from 'components/base/Button'
@@ -108,6 +110,11 @@ class ReceiveModal extends PureComponent<Props, State> {
       return
     }
     this.setState({ stepIndex: stepIndex + 1 })
+
+    // TODO: do that better
+    if (stepIndex === 1) {
+      this.verifyAddress()
+    }
   }
 
   handlePrevStep = () => {
@@ -154,12 +161,16 @@ class ReceiveModal extends PureComponent<Props, State> {
     }
   }
 
-  handleRetryCheckAddress = () =>
+  handleRetryCheckAddress = () => {
     this.setState({
       addressVerified: null,
       stepsErrors: [],
     })
 
+    // TODO: do that better
+    this.verifyAddress()
+  }
+
   handleChangeAmount = amount => this.setState({ amount })
 
   handleBeforeOpenModal = ({ data }) => {
@@ -180,6 +191,33 @@ class ReceiveModal extends PureComponent<Props, State> {
       stepIndex: this._steps.length - 1, // last step
     })
 
+  verifyAddress = async () => {
+    const { account, deviceSelected: device } = this.state
+    try {
+      if (account && device) {
+        const { address } = await getAddress
+          .send({
+            currencyId: account.currency.id,
+            devicePath: device.path,
+            path: account.freshAddressPath,
+            segwit: !!account.isSegwit,
+            verify: true,
+          })
+          .toPromise()
+
+        if (address !== account.freshAddress) {
+          throw new Error('Confirmed address is different')
+        }
+
+        this.setState({ addressVerified: true, stepIndex: 3 })
+      } else {
+        this.setState({ addressVerified: false })
+      }
+    } catch (err) {
+      this.setState({ addressVerified: false })
+    }
+  }
+
   renderStep = () => {
     const { account, amount, addressVerified, deviceSelected, stepIndex } = this.state
     const { t } = this.props