chore(merge): merge updated changes

packages/blockchain-wallet-v4-frontend/src/data/auth/slice.ts

@@ -86,7 +86,7 @@ const authSlice = createSlice({
       state.login = Remote.NotAsked
       state.exchangeAuth.exchangeLogin = Remote.NotAsked
     },
-    continueLoginProcess: () => {},
+    continueLoginProcess: (state, action) => {},
     exchangeLogin: (state, action: PayloadAction<ExchangeLoginType>) => {},
     exchangeLoginFailure: (state, action: PayloadAction<ExchangeLoginFailureType>) => {
       state.exchangeAuth.exchangeLogin = Remote.Failure(action.payload)

packages/blockchain-wallet-v4-frontend/src/data/auth/types.ts

@@ -66,12 +66,13 @@ export type LoginPayloadType = {
 }
 
 export type ExchangeLoginType = {
-  code: string
-  password: string
+  code?: string
+  password?: string
   username: string
 }
 
 export type LoginFormType = {
+  code?: string
   email: string
   emailToken?: string
   exchangePassword?: string
@@ -81,6 +82,7 @@ export type LoginFormType = {
   password?: string
   step?: LoginSteps
   twoFA?: number | string
+  upgradePassword?: string
 }
 
 export enum UserType {

packages/blockchain-wallet-v4-frontend/src/scenes/Login/AccountUnification/MergeAccountConfirm/index.tsx

@@ -23,15 +23,7 @@ const TextStack = styled.div`
 `
 
 const MergeAccountConfirm = (props: Props) => {
-  const { accountUnificationFlow, authActions, cacheActions, formActions, initCaptcha, setStep } =
-    props
-  const handleBackArrowClick = () => {
-    cacheActions.removedStoredLogin()
-    formActions.destroy(LOGIN_FORM_NAME)
-    setStep(LoginSteps.ENTER_EMAIL_GUID)
-    authActions.clearLoginError()
-    initCaptcha()
-  }
+  const { accountUnificationFlow, authActions, handleBackArrowClick, setStep } = props
 
   const handleUpgradeAccountClick = () => {
     if (accountUnificationFlow === AccountUnificationFlows.EXCHANGE_UPGRADE) {

packages/blockchain-wallet-v4-frontend/src/scenes/Login/AccountUnification/UpgradePassword/index.tsx

@@ -31,7 +31,9 @@ const UpgradePassword = (props: Props) => {
           validate={[required, validStrongPassword]}
           component={PasswordBox}
           showPasswordScore
-          passwordScore={has('zxcvbn', window) ? window.zxcvbn(props.upgradePassword).score : 0}
+          passwordScore={
+            has('zxcvbn', window) ? window.zxcvbn(props.formValues.upgradePassword).score : 0
+          }
         />
       </FormGroup>
       <FormGroup>

packages/blockchain-wallet-v4-frontend/src/scenes/Login/Exchange/EnterEmail/index.tsx

@@ -20,7 +20,7 @@ import {
 const isSupportedBrowser = isBrowserSupported()
 
 const EnterEmail = (props: Props) => {
-  const { authActions, busy, guidOrEmail, invalid, submitting } = props
+  const { authActions, busy, formValues, invalid, submitting } = props
   return (
     <>
       <FormGroup>
@@ -49,7 +49,7 @@ const EnterEmail = (props: Props) => {
           nature='primary'
           fullwidth
           height='48px'
-          disabled={submitting || invalid || busy || !guidOrEmail}
+          disabled={submitting || invalid || busy || !formValues?.guidOrEmail}
           data-e2e='loginButton'
           style={{ marginBottom: '16px' }}
         >

packages/blockchain-wallet-v4-frontend/src/scenes/Login/Exchange/EnterPasswordExchange/index.tsx

@@ -4,7 +4,7 @@ import { Field } from 'redux-form'
 
 import { HeartbeatLoader, Text } from 'blockchain-info-components'
 import { FormError, FormGroup, FormItem, FormLabel, PasswordBox, TextBox } from 'components/Form'
-import { ExchangeErrorCodes, LoginSteps } from 'data/types'
+import { ExchangeErrorCodes } from 'data/types'
 import { isBrowserSupported } from 'services/browser'
 import { required } from 'services/forms'
 
@@ -25,26 +25,16 @@ const EnterPasswordExchange = (props: Props) => {
   const {
     authActions,
     busy,
-    cacheActions,
     exchangeError,
-    exchangePassword,
-    formActions,
-    initCaptcha,
+    formValues,
+    handleBackArrowClick,
     invalid,
-    setStep,
     submitting
   } = props
   const passwordError = exchangeError && exchangeError === ExchangeErrorCodes.INVALID_CREDENTIALS
   const twoFactorRequired = exchangeError && exchangeError === ExchangeErrorCodes.BAD_2FA
   const twoFactorError = exchangeError && exchangeError === ExchangeErrorCodes.WRONG_2FA
 
-  const handleBackArrowClick = () => {
-    cacheActions.removedStoredLogin()
-    formActions.destroy(LOGIN_FORM_NAME)
-    setStep(LoginSteps.ENTER_EMAIL_GUID)
-    authActions.clearLoginError()
-    initCaptcha()
-  }
   return (
     <>
       <BackArrowFormHeader {...props} handleBackArrowClick={handleBackArrowClick} hideGuid />
@@ -72,17 +62,7 @@ const EnterPasswordExchange = (props: Props) => {
                 id='scenes.login.exchange.wrong_password'
                 defaultMessage='Login failed - invalid credentials.'
               />
-              {/* some sort of prompts to reset password?
-               {'  '}
-              <LinkContainer to='/recover'>
-                <Link size='12px' data-e2e='loginRecover'>
-                  <FormattedMessage
-                    id='scenes.login.recover_account'
-                    defaultMessage='Recover account'
-                  />
-                  .
-                </Link>
-              </LinkContainer>  */}
+              {/* some sort of prompts to reset password?  */}
             </FormError>
           )}
         </FormItem>
@@ -122,7 +102,7 @@ const EnterPasswordExchange = (props: Props) => {
           nature='primary'
           fullwidth
           height='48px'
-          disabled={submitting || invalid || busy || !exchangePassword}
+          disabled={submitting || invalid || busy || !formValues?.exchangePassword}
           data-e2e='passwordButton'
           style={{ marginBottom: '16px' }}
         >

packages/blockchain-wallet-v4-frontend/src/scenes/Login/Wallet/CheckEmail/index.tsx

@@ -15,16 +15,9 @@ const FormBody = styled.div`
 `
 
 const CheckEmail = (props: Props) => {
-  const handleBackArrowClick = () => {
-    props.cacheActions.removedStoredLogin()
-    props.formActions.destroy(LOGIN_FORM_NAME)
-    props.setStep(LoginSteps.ENTER_EMAIL_GUID)
-    props.authActions.clearLoginError()
-    props.initCaptcha()
-  }
   return (
     <>
-      <BackArrowFormHeader {...props} handleBackArrowClick={handleBackArrowClick} />
+      <BackArrowFormHeader {...props} handleBackArrowClick={props.handleBackArrowClick} />
       <FormBody>
         <CircleBackground color='blue600'>
           <Icon name='computer' color='white' size='24px' />

packages/blockchain-wallet-v4-frontend/src/scenes/Login/Wallet/EnterEmailOrGuid/index.tsx

@@ -21,8 +21,8 @@ import {
 const isSupportedBrowser = isBrowserSupported()
 
 const EnterEmailOrGuid = (props: Props) => {
-  const { authActions, busy, guidOrEmail, invalid, loginError, submitting } = props
-  const guidError = loginError && loginError.toLowerCase().includes('unknown wallet id')
+  const { authActions, busy, formValues, invalid, submitting, walletError } = props
+  const guidError = walletError && walletError.toLowerCase().includes('unknown wallet id')
 
   return (
     <>
@@ -64,7 +64,7 @@ const EnterEmailOrGuid = (props: Props) => {
           nature='primary'
           fullwidth
           height='48px'
-          disabled={submitting || invalid || busy || !guidOrEmail}
+          disabled={submitting || invalid || busy || !formValues?.guidOrEmail}
           data-e2e='loginButton'
           style={{ marginBottom: '16px' }}
         >

packages/blockchain-wallet-v4-frontend/src/scenes/Login/Wallet/EnterPasswordWallet/index.tsx

@@ -1,11 +1,13 @@
 import React from 'react'
 import { FormattedMessage } from 'react-intl'
+import { connect } from 'react-redux'
 import { LinkContainer } from 'react-router-bootstrap'
 import { Field } from 'redux-form'
 
+import { RemoteDataType } from '@core/types'
 import { HeartbeatLoader, Link, Text } from 'blockchain-info-components'
 import { FormError, FormGroup, FormItem, FormLabel, PasswordBox, TextBox } from 'components/Form'
-import { LoginSteps } from 'data/types'
+import { selectors } from 'data'
 import { isBrowserSupported } from 'services/browser'
 import { required } from 'services/forms'
 
@@ -14,7 +16,6 @@ import {
   ActionButton,
   BackArrowFormHeader,
   CenteredColumn,
-  LOGIN_FORM_NAME,
   NeedHelpLink,
   removeWhitespace,
   Row,
@@ -28,37 +29,24 @@ const EnterPasswordWallet = (props: Props) => {
     authActions,
     authType,
     busy,
-    cacheActions,
-    formActions,
     formValues,
-    guid,
-    initCaptcha,
+    handleBackArrowClick,
     invalid,
     isMobileViewLogin,
-    loginError,
-    password,
-    setStep,
-    submitting
+    submitting,
+    walletError
   } = props
-  const passwordError = loginError && loginError.toLowerCase().includes('wrong_wallet_password')
+
+  const passwordError = walletError && walletError.toLowerCase().includes('wrong_wallet_password')
   const accountLocked =
-    loginError &&
-    (loginError.toLowerCase().includes('this account has been locked') ||
-      loginError.toLowerCase().includes('account is locked'))
+    walletError &&
+    (walletError.toLowerCase().includes('this account has been locked') ||
+      walletError.toLowerCase().includes('account is locked'))
 
-  const twoFactorError = loginError && loginError.toLowerCase().includes('authentication code')
+  const twoFactorError = walletError && walletError.toLowerCase().includes('authentication code')
   const handleSmsResend = () => {
-    authActions.resendSmsCode({ email: formValues?.email, guid })
-  }
-
-  const handleBackArrowClick = () => {
-    cacheActions.removedStoredLogin()
-    formActions.destroy(LOGIN_FORM_NAME)
-    setStep(LoginSteps.ENTER_EMAIL_GUID)
-    authActions.clearLoginError()
-    initCaptcha()
+    authActions.resendSmsCode({ email: formValues?.email, guid: formValues?.guid })
   }
-
   return (
     <>
       <BackArrowFormHeader
@@ -103,7 +91,9 @@ const EnterPasswordWallet = (props: Props) => {
               </LinkContainer>
             </FormError>
           )}
-          {accountLocked && <FormError position='relative'>{loginError?.split('.')[0]}.</FormError>}
+          {accountLocked && (
+            <FormError position='relative'>{walletError?.split('.')[0]}.</FormError>
+          )}
         </FormItem>
       </FormGroup>
       {authType > 0 && (
@@ -137,9 +127,9 @@ const EnterPasswordWallet = (props: Props) => {
                 <FormattedMessage id='scenes.login.resendsms' defaultMessage='Resend SMS' />
               </Link>
             )}
-            {twoFactorError && <FormError position='absolute'>{loginError}</FormError>}
+            {twoFactorError && <FormError position='absolute'>{walletError}</FormError>}
             {accountLocked && (
-              <FormError position='absolute'>{loginError?.split('.')[0]}.</FormError>
+              <FormError position='absolute'>{walletError?.split('.')[0]}.</FormError>
             )}
           </FormItem>
           <Row style={{ marginTop: '16px' }}>
@@ -163,7 +153,7 @@ const EnterPasswordWallet = (props: Props) => {
           nature='primary'
           fullwidth
           height='48px'
-          disabled={submitting || invalid || busy || !password}
+          disabled={submitting || invalid || busy || !formValues?.password}
           data-e2e='passwordButton'
           style={{ marginBottom: '16px' }}
         >
@@ -181,4 +171,10 @@ const EnterPasswordWallet = (props: Props) => {
   )
 }
 
-export default EnterPasswordWallet
+const mapStateToProps = (state) => ({
+  walletLoginData: selectors.auth.getLogin(state) as RemoteDataType<any, any>
+})
+
+const connector = connect(mapStateToProps)
+
+export default connector(EnterPasswordWallet)

packages/blockchain-wallet-v4-frontend/src/scenes/Login/Wallet/VerificationMobile/index.tsx

@@ -35,21 +35,13 @@ const LinkRow = styled.div`
 const VerificationMobile = (props: Props) => {
   const {
     authActions,
-    cacheActions,
-    formActions,
+    handleBackArrowClick,
     phonePubKey,
     qrData,
     secureChannelLoginState,
     setStep
   } = props
 
-  const handleBackArrowClick = () => {
-    cacheActions.removedStoredLogin()
-    formActions.destroy(LOGIN_FORM_NAME)
-    setStep(LoginSteps.ENTER_EMAIL_GUID)
-    authActions.clearLoginError()
-  }
-
   const loginWithPasswordClicked = () => {
     authActions.analyticsLoginMethodSelected('PASSWORD')
     setStep(LoginSteps.ENTER_PASSWORD_WALLET)