chore(login): more refactor

Author: mperdomo-bc

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

@@ -46,7 +46,7 @@ export function getMobileLoginStarted(state: RootState): AuthStateType['mobileLo
   return state.auth.mobileLoginStarted
 }
 
-export function getMagicLinkData(state: RootState) {
+export function getMagicLinkData(state: RootState): AuthStateType['magicLinkData'] {
   return state.auth.magicLinkData
 }
 

packages/blockchain-wallet-v4-frontend/src/data/cache/selectors.ts

@@ -1,10 +1,11 @@
-import { path, prop } from 'ramda'
+import { path } from 'ramda'
 
 import { crypto as wCrypto } from '@core'
+import { RootState } from 'data/rootReducer'
 
 export const getLastAnnouncementState = (state): object | undefined =>
   path(['cache', 'announcements'], state)
-export const getCache = (state) => prop('cache', state)
+export const getCache = (state: RootState) => state.cache
 export const getEmail = (state): string | undefined => path(['cache', 'lastEmail'], state)
 export const getExchangeEmail = (state): string | undefined =>
   path(['cache', 'exchangeEmail'], state)

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

@@ -26,16 +26,11 @@ const LoginWrapper = styled(Wrapper)`
 `
 
 const EnterEmail = (props: Props) => {
-  const { busy, formValues, invalid, isMobilePlatform, submitting, walletTabClicked } = props
+  const { busy, formValues, invalid, isMobilePlatform, submitting } = props
 
   return (
     <LoginWrapper>
-      <ProductTabMenu
-        active={ProductAuthOptions.EXCHANGE}
-        onWalletTabClick={walletTabClicked}
-        isMobilePlatform={isMobilePlatform}
-        product={ProductAuthOptions.EXCHANGE}
-      />
+      <ProductTabMenu isMobilePlatform={isMobilePlatform} product={ProductAuthOptions.EXCHANGE} />
       <WrapperWithPadding>
         <FormGroup>
           <FormItem style={{ marginTop: '40px' }}>

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

@@ -38,8 +38,7 @@ const EnterPasswordExchange = (props: Props) => {
     invalid,
     isMobilePlatform,
     productAuthMetadata,
-    submitting,
-    walletTabClicked
+    submitting
   } = props
 
   const dispatch = useDispatch()
@@ -61,20 +60,14 @@ const EnterPasswordExchange = (props: Props) => {
 
   return (
     <LoginWrapper>
-      <ProductTabMenu
-        active={ProductAuthOptions.EXCHANGE}
-        onWalletTabClick={walletTabClicked}
-        isMobilePlatform={isMobilePlatform}
-        product={ProductAuthOptions.EXCHANGE}
-      />
+      <ProductTabMenu isMobilePlatform={isMobilePlatform} product={ProductAuthOptions.EXCHANGE} />
       <WrapperWithPadding>
         <BackArrowHeader
           formValues={formValues}
           handleBackArrowClick={handleBackArrowClickExchange}
           hideGuid
           marginTop='28px'
           hideBackArrow={isMobilePlatform}
-          product={ProductAuthOptions.EXCHANGE}
         />
         <FormGroup>
           <FormItem>

packages/blockchain-wallet-v4-frontend/src/scenes/Login/Sofi/Success/index.tsx

@@ -1,11 +1,11 @@
 import React from 'react'
 import { FormattedMessage } from 'react-intl'
 import { useDispatch } from 'react-redux'
+import { push } from 'connected-react-router'
 import styled from 'styled-components'
 
 import { Button, Image, Text } from 'blockchain-info-components'
 import { Wrapper } from 'components/Public'
-import { actions } from 'data'
 import { isBrowserAndroid, isBrowserIOS } from 'services/browser'
 import { isMobile } from 'services/styles'
 
@@ -21,7 +21,7 @@ const SofiSuccess = () => {
   // Add check here to make sure that there is wallet data
   // route should navigate to login if there's no wallet data
   const sofiWalletRedirect = () => {
-    dispatch(actions.router.push('/home'))
+    dispatch(push('/home'))
   }
   const APP_URL = 'https://blockchainwallet.page.link/dashboard'
 

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

@@ -3,18 +3,17 @@ import React from 'react'
 import { getAuthorizeVerifyDevice } from 'data/auth/selectors'
 import { useRemote } from 'hooks'
 
-import { Props } from '..'
 import Error from './template.error'
 import Loading from './template.loading'
 import Success from './template.success'
 
-const VerifyMagicLink = (props: Props) => {
+const VerifyMagicLink = () => {
   const { data, error, isLoading, isNotAsked } = useRemote(getAuthorizeVerifyDevice)
 
   if (isLoading || isNotAsked) return <Loading />
 
   if (error) return <Error error={error} />
-  return <Success {...props} {...data} />
+  return <Success {...data} />
 }
 
 export default VerifyMagicLink

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

@@ -85,11 +85,7 @@ const CheckEmail = (props: Props) => {
   return (
     <LoginWrapper>
       <WrapperWithPadding>
-        <BackArrowHeader
-          formValues={props.formValues}
-          handleBackArrowClick={handleBackClick}
-          product={props.productAuthMetadata.product}
-        />
+        <BackArrowHeader formValues={props.formValues} handleBackArrowClick={handleBackClick} />
         <FormBody>
           <CircleBackground color='blue600'>
             <Icon name='computer' color='white' size='24px' />

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

@@ -9,7 +9,6 @@ import FormGroup from 'components/Form/FormGroup'
 import FormItem from 'components/Form/FormItem'
 import TextBox from 'components/Form/TextBox'
 import { Wrapper } from 'components/Public'
-import { ProductAuthOptions } from 'data/types'
 import { required, validWalletIdOrEmail } from 'services/forms'
 import { removeWhitespace } from 'services/forms/normalizers'
 import { media } from 'services/styles'
@@ -29,20 +28,12 @@ const LoginWrapper = styled(Wrapper)`
 `
 
 const EnterEmailOrGuid = (props: Props) => {
-  const {
-    busy,
-    exchangeTabClicked,
-    formValues,
-    invalid,
-    isMobilePlatform,
-    submitting,
-    walletError
-  } = props
+  const { busy, formValues, invalid, isMobilePlatform, submitting, walletError } = props
   const guidError = walletError?.toLowerCase().includes('unknown wallet id')
 
   return (
     <LoginWrapper>
-      <ProductTabMenu active={ProductAuthOptions.WALLET} onExchangeTabClick={exchangeTabClicked} />
+      <ProductTabMenu />
       <WrapperWithPadding>
         <FormGroup>
           <FormItem style={{ marginTop: '40px' }}>

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

@@ -76,7 +76,6 @@ const SettingsGoalText = styled.div`
 const EnterPasswordWallet = (props: OwnProps) => {
   const {
     busy,
-    exchangeTabClicked,
     formValues,
     handleBackArrowClickWallet,
     invalid,
@@ -103,12 +102,7 @@ const EnterPasswordWallet = (props: OwnProps) => {
   return (
     <OuterWrapper>
       <FormWrapper>
-        {!settingsRedirect && !isSofi && (
-          <ProductTabMenu
-            active={ProductAuthOptions.WALLET}
-            onExchangeTabClick={exchangeTabClicked}
-          />
-        )}
+        {!settingsRedirect && !isSofi && <ProductTabMenu />}
         <WrapperWithPadding>
           {!settingsRedirect && (
             <BackArrowHeader

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

@@ -98,7 +98,6 @@ const TwoFAWallet = (props: Props) => {
           handleBackArrowClick={handleBackArrowClickWallet}
           marginTop='28px'
           hideBackArrow={isMobilePlatform}
-          product={props.productAuthMetadata.product}
         />
         {twoFAType && (
           <FormGroup>