From 05f8b0507022cebd21d0727e220e4f2b0819a40b Mon Sep 17 00:00:00 2001 From: Wes Risenmay Date: Mon, 24 Aug 2026 10:14:05 -0600 Subject: [PATCH 1/3] refactor(manualaccountmenu): changing manual account menu to use MUI list instead of kyper --- package-lock.json | 55 +------------------ src/views/manualAccount/ManualAccountMenu.js | 44 +++++++++------ .../ManualAccountMenu.module.css | 3 + ...nu-test.tsx => ManualAccountMenu.test.tsx} | 0 4 files changed, 30 insertions(+), 72 deletions(-) create mode 100644 src/views/manualAccount/ManualAccountMenu.module.css rename src/views/manualAccount/{__tests__/manualAccountMenu-test.tsx => ManualAccountMenu.test.tsx} (100%) diff --git a/package-lock.json b/package-lock.json index 23aa82ad55..9983e6587b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -865,7 +865,6 @@ "cpu": [ "ppc64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -882,7 +881,6 @@ "cpu": [ "arm" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -899,7 +897,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -916,7 +913,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -933,7 +929,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "darwin" @@ -949,7 +944,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -966,7 +960,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -983,7 +976,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1000,7 +992,6 @@ "cpu": [ "arm" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1017,7 +1008,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1034,7 +1024,6 @@ "cpu": [ "ia32" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1051,7 +1040,6 @@ "cpu": [ "loong64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1068,7 +1056,6 @@ "cpu": [ "mips64el" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1085,7 +1072,6 @@ "cpu": [ "ppc64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1102,7 +1088,6 @@ "cpu": [ "riscv64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1119,7 +1104,6 @@ "cpu": [ "s390x" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1136,7 +1120,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1153,7 +1136,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1170,7 +1152,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1187,7 +1168,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1204,7 +1184,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1221,7 +1200,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1238,7 +1216,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1255,7 +1232,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1272,7 +1248,6 @@ "cpu": [ "ia32" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1289,7 +1264,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3349,7 +3323,6 @@ "cpu": [ "arm" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3363,7 +3336,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3377,7 +3349,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3391,7 +3362,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3405,7 +3375,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3419,7 +3388,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3433,7 +3401,6 @@ "cpu": [ "arm" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3447,7 +3414,6 @@ "cpu": [ "arm" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3461,7 +3427,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3475,7 +3440,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3489,7 +3453,6 @@ "cpu": [ "loong64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3503,7 +3466,6 @@ "cpu": [ "loong64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3517,7 +3479,6 @@ "cpu": [ "ppc64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3531,7 +3492,6 @@ "cpu": [ "ppc64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3545,7 +3505,6 @@ "cpu": [ "riscv64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3559,7 +3518,6 @@ "cpu": [ "riscv64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3573,7 +3531,6 @@ "cpu": [ "s390x" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3587,7 +3544,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3601,7 +3557,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3615,7 +3570,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3629,7 +3583,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3643,7 +3596,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3657,7 +3609,6 @@ "cpu": [ "ia32" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3671,7 +3622,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -3685,7 +3635,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -8391,7 +8340,6 @@ "version": "2.3.3", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==", - "dev": true, "hasInstallScript": true, "optional": true, "os": [ @@ -9965,7 +9913,6 @@ "version": "2.6.1", "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.6.1.tgz", "integrity": "sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==", - "dev": true, "optional": true, "bin": { "jiti": "lib/jiti-cli.mjs" @@ -17829,7 +17776,7 @@ "version": "2.8.3", "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.3.tgz", "integrity": "sha512-AvbaCLOO2Otw/lW5bmh9d/WEdcDFdQp2Z2ZUH3pX9U2ihyUY0nvLv7J6TrWowklRGPYbB/IuIMfYgxaCPg5Bpg==", - "dev": true, + "devOptional": true, "license": "ISC", "bin": { "yaml": "bin.mjs" diff --git a/src/views/manualAccount/ManualAccountMenu.js b/src/views/manualAccount/ManualAccountMenu.js index 7849c7ba6c..2f9b8238a7 100644 --- a/src/views/manualAccount/ManualAccountMenu.js +++ b/src/views/manualAccount/ManualAccountMenu.js @@ -1,11 +1,15 @@ import React, { useEffect } from 'react' import PropTypes from 'prop-types' import { __ } from 'src/utilities/Intl' - import { Icon, Text } from '@mxenabled/mxui' -import { UtilityRow } from '@kyper/utilityrow' - -import { fadeOut } from 'src/utilities/Animation' +import { + List, + ListItem, + ListItemAvatar, + ListItemButton, + ListItemIcon, + ListItemText, +} from '@mui/material' import { SlideDown } from 'src/components/SlideDown' @@ -14,6 +18,7 @@ import { focusElement } from 'src/utilities/Accessibility' import { AccountTypeNames, AccountTypes } from 'src/views/manualAccount/constants' import { StyledAccountTypeIcon } from 'src/components/StyledAccountTypeIcon' import { Stack } from '@mui/material' +import styles from 'src/views/manualAccount/ManualAccountMenu.module.css' export const ManualAccountMenu = React.forwardRef((props, ref) => { const getNextDelay = getDelay() @@ -85,22 +90,25 @@ export const ManualAccountMenu = React.forwardRef((props, ref) => { - + {typeList.map((account_type, i) => ( - - fadeOut(ref.current, 'up', 300).then(props.handleAccountTypeSelect(account_type)) - } - rightChildren={} - title={AccountTypeNames[account_type]()} - /> + + props.handleAccountTypeSelect(account_type)} + > + + {getIcon[account_type]} + + + + + + + ))} - + ) diff --git a/src/views/manualAccount/ManualAccountMenu.module.css b/src/views/manualAccount/ManualAccountMenu.module.css new file mode 100644 index 0000000000..8d77932f76 --- /dev/null +++ b/src/views/manualAccount/ManualAccountMenu.module.css @@ -0,0 +1,3 @@ +.listItemAvatar:global(.MuiListItemAvatar-root) { + height: unset; +} diff --git a/src/views/manualAccount/__tests__/manualAccountMenu-test.tsx b/src/views/manualAccount/ManualAccountMenu.test.tsx similarity index 100% rename from src/views/manualAccount/__tests__/manualAccountMenu-test.tsx rename to src/views/manualAccount/ManualAccountMenu.test.tsx From a2da76d99601532f17b5c97bf4b3a986f8883d10 Mon Sep 17 00:00:00 2001 From: Wes Risenmay Date: Tue, 25 Aug 2026 10:05:14 -0600 Subject: [PATCH 2/3] fix styling of the manual account menu and add tests --- src/ConnectedTokenProvider.tsx | 41 +++++++++++ src/views/manualAccount/ManualAccountMenu.js | 73 ++++++++++--------- .../ManualAccountMenu.module.css | 3 - .../manualAccount/ManualAccountMenu.test.tsx | 31 ++++---- 4 files changed, 96 insertions(+), 52 deletions(-) delete mode 100644 src/views/manualAccount/ManualAccountMenu.module.css diff --git a/src/ConnectedTokenProvider.tsx b/src/ConnectedTokenProvider.tsx index ee8bfc8404..fa0fca15c5 100644 --- a/src/ConnectedTokenProvider.tsx +++ b/src/ConnectedTokenProvider.tsx @@ -21,6 +21,8 @@ declare module '@mui/material/styles' { } } +const listItemButtonPadding = 12 + const connectThemeOverrides = (palette: Theme['palette']) => ({ components: { MuiTypography: { @@ -78,6 +80,13 @@ const connectThemeOverrides = (palette: Theme['palette']) => ({ }, }, }, + MuiDivider: { + styleOverrides: { + root: { + height: 'unset', + }, + }, + }, MuiFormLabel: { styleOverrides: { asterisk: { @@ -144,6 +153,38 @@ const connectThemeOverrides = (palette: Theme['palette']) => ({ }, }, }, + MuiList: { + styleOverrides: { + root: { + marginLeft: -1 * listItemButtonPadding, + marginRight: -1 * listItemButtonPadding, + }, + }, + }, + MuiListItemAvatar: { + styleOverrides: { + root: { + height: undefined, + marginRight: 12, + minWidth: 'unset', + width: undefined, + '& .MuiAvatar-root': { + height: undefined, + width: undefined, + }, + }, + }, + }, + + MuiListItemButton: { + styleOverrides: { + root: { + borderRadius: 8, + paddingLeft: listItemButtonPadding, + paddingRight: listItemButtonPadding, + }, + }, + }, }, // TODO: Remove this custom spacing scale once we are on MXUI v2. spacing: (factor: number) => `${factor * 8}px`, diff --git a/src/views/manualAccount/ManualAccountMenu.js b/src/views/manualAccount/ManualAccountMenu.js index 2f9b8238a7..c81eae9a50 100644 --- a/src/views/manualAccount/ManualAccountMenu.js +++ b/src/views/manualAccount/ManualAccountMenu.js @@ -1,4 +1,4 @@ -import React, { useEffect } from 'react' +import React, { Fragment, useEffect } from 'react' import PropTypes from 'prop-types' import { __ } from 'src/utilities/Intl' import { Icon, Text } from '@mxenabled/mxui' @@ -18,7 +18,6 @@ import { focusElement } from 'src/utilities/Accessibility' import { AccountTypeNames, AccountTypes } from 'src/views/manualAccount/constants' import { StyledAccountTypeIcon } from 'src/components/StyledAccountTypeIcon' import { Stack } from '@mui/material' -import styles from 'src/views/manualAccount/ManualAccountMenu.module.css' export const ManualAccountMenu = React.forwardRef((props, ref) => { const getNextDelay = getDelay() @@ -41,19 +40,21 @@ export const ManualAccountMenu = React.forwardRef((props, ref) => { AccountTypes.UNKNOWN, ] + const iconSize = 24 + const getIcon = { - [AccountTypes.CHECKING]: , - [AccountTypes.SAVINGS]: , - [AccountTypes.LOAN]: , - [AccountTypes.CREDIT_CARD]: , - [AccountTypes.INVESTMENT]: , - [AccountTypes.LINE_OF_CREDIT]: , - [AccountTypes.MORTGAGE]: , - [AccountTypes.PROPERTY]: , - [AccountTypes.CASH]: , - [AccountTypes.INSURANCE]: , - [AccountTypes.PREPAID]: , - [AccountTypes.UNKNOWN]: , + [AccountTypes.CHECKING]: , + [AccountTypes.SAVINGS]: , + [AccountTypes.LOAN]: , + [AccountTypes.CREDIT_CARD]: , + [AccountTypes.INVESTMENT]: , + [AccountTypes.LINE_OF_CREDIT]: , + [AccountTypes.MORTGAGE]: , + [AccountTypes.PROPERTY]: , + [AccountTypes.CASH]: , + [AccountTypes.INSURANCE]: , + [AccountTypes.PREPAID]: , + [AccountTypes.UNKNOWN]: , } useEffect(() => { @@ -69,7 +70,7 @@ export const ManualAccountMenu = React.forwardRef((props, ref) => { - + { > {__("Track accounts, assets, and other things that don't have a live connection.")} + + {typeList.map((account_type) => ( + + + props.handleAccountTypeSelect(account_type)} + > + {getIcon[account_type]} + + {AccountTypeNames[account_type]()} + + + + + + + + ))} + - - - {typeList.map((account_type, i) => ( - - props.handleAccountTypeSelect(account_type)} - > - - {getIcon[account_type]} - - - - - - - - ))} - - ) }) diff --git a/src/views/manualAccount/ManualAccountMenu.module.css b/src/views/manualAccount/ManualAccountMenu.module.css deleted file mode 100644 index 8d77932f76..0000000000 --- a/src/views/manualAccount/ManualAccountMenu.module.css +++ /dev/null @@ -1,3 +0,0 @@ -.listItemAvatar:global(.MuiListItemAvatar-root) { - height: unset; -} diff --git a/src/views/manualAccount/ManualAccountMenu.test.tsx b/src/views/manualAccount/ManualAccountMenu.test.tsx index f7e1ce38fb..a999e8e436 100644 --- a/src/views/manualAccount/ManualAccountMenu.test.tsx +++ b/src/views/manualAccount/ManualAccountMenu.test.tsx @@ -2,22 +2,27 @@ import React from 'react' import { screen, render } from 'src/utilities/testingLibrary' -import { ManualAccountMenu } from 'src/views/manualAccount/ManualAccountMenu' - -const handleAccountTypeSelect = vi.fn() - -const accountMenuProps = { - handleAccountTypeSelect, - availableAccountTypes: [], -} +import { ManualAccountConnect } from 'src/views/manualAccount/ManualAccountConnect' describe('manualAccountMenu', () => { - it('renders manual account menu and clicks on a checking account', async () => { - const ref = React.createRef() + it.each([ + 'Checking', + 'Savings', + 'Loan', + 'Credit Card', + 'Investment', + 'Line of Credit', + 'Mortgage', + 'Property', + 'Cash', + 'Insurance', + 'Prepaid', + 'Other', + ])('shows the %s form when the %s menu button is clicked', async (formType) => { + const { user } = render() - const { user } = render() + await user.click(await screen.findByRole('button', { name: formType })) - await user.click(await screen.findByRole('button', { name: 'Checking' })) - expect(handleAccountTypeSelect).toHaveBeenCalled() + expect(await screen.findByTestId('manual-account-form-header')).toHaveTextContent(formType) }) }) From 4af778861553567478b18ea4c3eba93f5b241a5d Mon Sep 17 00:00:00 2001 From: Wes Risenmay Date: Tue, 25 Aug 2026 13:15:45 -0600 Subject: [PATCH 3/3] convert to typescript --- src/views/manualAccount/ManualAccountMenu.js | 123 ----------------- src/views/manualAccount/ManualAccountMenu.tsx | 124 ++++++++++++++++++ 2 files changed, 124 insertions(+), 123 deletions(-) delete mode 100644 src/views/manualAccount/ManualAccountMenu.js create mode 100644 src/views/manualAccount/ManualAccountMenu.tsx diff --git a/src/views/manualAccount/ManualAccountMenu.js b/src/views/manualAccount/ManualAccountMenu.js deleted file mode 100644 index c81eae9a50..0000000000 --- a/src/views/manualAccount/ManualAccountMenu.js +++ /dev/null @@ -1,123 +0,0 @@ -import React, { Fragment, useEffect } from 'react' -import PropTypes from 'prop-types' -import { __ } from 'src/utilities/Intl' -import { Icon, Text } from '@mxenabled/mxui' -import { - List, - ListItem, - ListItemAvatar, - ListItemButton, - ListItemIcon, - ListItemText, -} from '@mui/material' - -import { SlideDown } from 'src/components/SlideDown' - -import { getDelay } from 'src/utilities/getDelay' -import { focusElement } from 'src/utilities/Accessibility' -import { AccountTypeNames, AccountTypes } from 'src/views/manualAccount/constants' -import { StyledAccountTypeIcon } from 'src/components/StyledAccountTypeIcon' -import { Stack } from '@mui/material' - -export const ManualAccountMenu = React.forwardRef((props, ref) => { - const getNextDelay = getDelay() - - const typeList = - props.availableAccountTypes?.length !== 0 - ? props.availableAccountTypes - : [ - AccountTypes.CHECKING, - AccountTypes.SAVINGS, - AccountTypes.LOAN, - AccountTypes.CREDIT_CARD, - AccountTypes.INVESTMENT, - AccountTypes.LINE_OF_CREDIT, - AccountTypes.MORTGAGE, - AccountTypes.PROPERTY, - AccountTypes.CASH, - AccountTypes.INSURANCE, - AccountTypes.PREPAID, - AccountTypes.UNKNOWN, - ] - - const iconSize = 24 - - const getIcon = { - [AccountTypes.CHECKING]: , - [AccountTypes.SAVINGS]: , - [AccountTypes.LOAN]: , - [AccountTypes.CREDIT_CARD]: , - [AccountTypes.INVESTMENT]: , - [AccountTypes.LINE_OF_CREDIT]: , - [AccountTypes.MORTGAGE]: , - [AccountTypes.PROPERTY]: , - [AccountTypes.CASH]: , - [AccountTypes.INSURANCE]: , - [AccountTypes.PREPAID]: , - [AccountTypes.UNKNOWN]: , - } - - useEffect(() => { - const timer = setTimeout(() => { - focusElement(document.querySelector('[data-test="back-button"]:first-of-type')) - }, 300) - - return () => clearTimeout(timer) - }, []) - - return ( -
- - - - - - {__('Add account manually')} - - - {__("Track accounts, assets, and other things that don't have a live connection.")} - - - {typeList.map((account_type) => ( - - - props.handleAccountTypeSelect(account_type)} - > - {getIcon[account_type]} - - {AccountTypeNames[account_type]()} - - - - - - - - ))} - - - - -
- ) -}) - -ManualAccountMenu.propTypes = { - availableAccountTypes: PropTypes.array, - handleAccountTypeSelect: PropTypes.func.isRequired, -} - -ManualAccountMenu.displayName = 'ManualAccountMenu' diff --git a/src/views/manualAccount/ManualAccountMenu.tsx b/src/views/manualAccount/ManualAccountMenu.tsx new file mode 100644 index 0000000000..098b54a972 --- /dev/null +++ b/src/views/manualAccount/ManualAccountMenu.tsx @@ -0,0 +1,124 @@ +import React, { Fragment, useEffect } from 'react' +import { __ } from 'src/utilities/Intl' +import { Icon, Text } from '@mxenabled/mxui' +import { + List, + ListItem, + ListItemAvatar, + ListItemButton, + ListItemIcon, + ListItemText, +} from '@mui/material' + +import { SlideDown } from 'src/components/SlideDown' + +import { getDelay } from 'src/utilities/getDelay' +import { focusElement } from 'src/utilities/Accessibility' +import { AccountTypeNames, AccountTypes } from 'src/views/manualAccount/constants' +import { StyledAccountTypeIcon } from 'src/components/StyledAccountTypeIcon' +import { Stack } from '@mui/material' + +interface ManualAccountMenuProps { + availableAccountTypes?: number[] + handleAccountTypeSelect: (accountType: number) => void +} + +export const ManualAccountMenu = React.forwardRef( + (props, ref) => { + const getNextDelay = getDelay() + + const typeList = + props.availableAccountTypes?.length !== 0 + ? props.availableAccountTypes + : [ + AccountTypes.CHECKING, + AccountTypes.SAVINGS, + AccountTypes.LOAN, + AccountTypes.CREDIT_CARD, + AccountTypes.INVESTMENT, + AccountTypes.LINE_OF_CREDIT, + AccountTypes.MORTGAGE, + AccountTypes.PROPERTY, + AccountTypes.CASH, + AccountTypes.INSURANCE, + AccountTypes.PREPAID, + AccountTypes.UNKNOWN, + ] + + const iconSize = 24 + + const getIcon: { [key: number]: React.ReactElement } = { + [AccountTypes.CHECKING]: , + [AccountTypes.SAVINGS]: , + [AccountTypes.LOAN]: , + [AccountTypes.CREDIT_CARD]: , + [AccountTypes.INVESTMENT]: , + [AccountTypes.LINE_OF_CREDIT]: , + [AccountTypes.MORTGAGE]: , + [AccountTypes.PROPERTY]: , + [AccountTypes.CASH]: , + [AccountTypes.INSURANCE]: , + [AccountTypes.PREPAID]: , + [AccountTypes.UNKNOWN]: , + } + + useEffect(() => { + const timer = setTimeout(() => { + focusElement(document.querySelector('[data-test="back-button"]:first-of-type')) + }, 300) + + return () => clearTimeout(timer) + }, []) + + return ( +
+ + + + + + {__('Add account manually')} + + + {__("Track accounts, assets, and other things that don't have a live connection.")} + + + {typeList?.map((account_type) => ( + + + props.handleAccountTypeSelect(account_type)} + > + {getIcon[account_type]} + + {AccountTypeNames[account_type]()} + + + + + + + + ))} + + + + +
+ ) + }, +) + +ManualAccountMenu.displayName = 'ManualAccountMenu'