From 797652eb94557e2f88e4dfd36dff8075f86faa37 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Thu, 24 Jul 2025 15:36:21 +0200 Subject: [PATCH 1/5] feat: change the Bank Account section description --- src/languages/de.ts | 2 +- src/languages/en.ts | 2 +- src/languages/es.ts | 2 +- src/languages/fr.ts | 2 +- src/languages/it.ts | 2 +- src/languages/ja.ts | 2 +- src/languages/nl.ts | 2 +- src/languages/pl.ts | 2 +- src/languages/pt-BR.ts | 2 +- src/languages/zh-hans.ts | 2 +- 10 files changed, 10 insertions(+), 10 deletions(-) diff --git a/src/languages/de.ts b/src/languages/de.ts index 31794ca150112..d1eeff851a62c 100644 --- a/src/languages/de.ts +++ b/src/languages/de.ts @@ -1836,7 +1836,7 @@ const translations = { expensifyWallet: 'Expensify Wallet (Beta)', sendAndReceiveMoney: 'Senden und Empfangen von Geld mit Freunden. Nur US-Bankkonten.', enableWallet: 'Wallet aktivieren', - addBankAccountToSendAndReceive: 'Erhalten Sie eine Rückerstattung für Ausgaben, die Sie an einen Arbeitsbereich einreichen.', + addBankAccountToSendAndReceive: 'Fügen Sie ein Bankkonto hinzu, um Zahlungen zu tätigen oder zu empfangen.', addBankAccount: 'Bankkonto hinzufügen', assignedCards: 'Zugewiesene Karten', assignedCardsDescription: 'Dies sind Karten, die von einem Workspace-Admin zugewiesen wurden, um die Ausgaben des Unternehmens zu verwalten.', diff --git a/src/languages/en.ts b/src/languages/en.ts index 583c5b9c0187e..bb86ed088453e 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -1814,7 +1814,7 @@ const translations = { expensifyWallet: 'Expensify Wallet (Beta)', sendAndReceiveMoney: 'Send and receive money with friends. US bank accounts only.', enableWallet: 'Enable wallet', - addBankAccountToSendAndReceive: 'Get paid back for expenses you submit to a workspace.', + addBankAccountToSendAndReceive: 'Add a bank account to make or receive payments.', addBankAccount: 'Add bank account', assignedCards: 'Assigned cards', assignedCardsDescription: 'These are cards assigned by a workspace admin to manage company spend.', diff --git a/src/languages/es.ts b/src/languages/es.ts index 7848e4cc9a25f..9349b91a2543d 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -1812,7 +1812,7 @@ const translations = { expensifyWallet: 'Billetera Expensify (Beta)', sendAndReceiveMoney: 'Envía y recibe dinero desde tu Billetera Expensify. Solo cuentas bancarias de EE. UU.', enableWallet: 'Habilitar billetera', - addBankAccountToSendAndReceive: 'Recibe el reembolso de los gastos que envíes a un espacio de trabajo.', + addBankAccountToSendAndReceive: 'Agrega una cuenta bancaria para realizar o recibir pagos.', addBankAccount: 'Añadir cuenta bancaria', assignedCards: 'Tarjetas asignadas', assignedCardsDescription: 'Son tarjetas asignadas por un administrador del espacio de trabajo para gestionar los gastos de la empresa.', diff --git a/src/languages/fr.ts b/src/languages/fr.ts index bbbb699037383..2d9d9b57bbf89 100644 --- a/src/languages/fr.ts +++ b/src/languages/fr.ts @@ -1837,7 +1837,7 @@ const translations = { expensifyWallet: 'Expensify Wallet (Bêta)', sendAndReceiveMoney: "Envoyez et recevez de l'argent avec des amis. Comptes bancaires américains uniquement.", enableWallet: 'Activer le portefeuille', - addBankAccountToSendAndReceive: 'Soyez remboursé pour les dépenses que vous soumettez à un espace de travail.', + addBankAccountToSendAndReceive: 'Ajoutez un compte bancaire pour effectuer ou recevoir des paiements.', addBankAccount: 'Ajouter un compte bancaire', assignedCards: 'Cartes assignées', assignedCardsDescription: "Ce sont des cartes attribuées par un administrateur d'espace de travail pour gérer les dépenses de l'entreprise.", diff --git a/src/languages/it.ts b/src/languages/it.ts index 8fe4c992c482c..eff8a44578957 100644 --- a/src/languages/it.ts +++ b/src/languages/it.ts @@ -1830,7 +1830,7 @@ const translations = { expensifyWallet: 'Expensify Wallet (Beta)', sendAndReceiveMoney: 'Invia e ricevi denaro con gli amici. Solo conti bancari statunitensi.', enableWallet: 'Abilita portafoglio', - addBankAccountToSendAndReceive: "Ricevi il rimborso per le spese che invii a un'area di lavoro.", + addBankAccountToSendAndReceive: 'Aggiungi un conto bancario per effettuare o ricevere pagamenti.', addBankAccount: 'Aggiungi conto bancario', assignedCards: 'Carte assegnate', assignedCardsDescription: 'Queste sono carte assegnate da un amministratore del workspace per gestire le spese aziendali.', diff --git a/src/languages/ja.ts b/src/languages/ja.ts index 9a5cff87e45d2..e9f13dbd088f7 100644 --- a/src/languages/ja.ts +++ b/src/languages/ja.ts @@ -1827,7 +1827,7 @@ const translations = { expensifyWallet: 'Expensify Wallet（ベータ版）', sendAndReceiveMoney: '友達とお金を送受信する。米国の銀行口座のみ。', enableWallet: 'ウォレットを有効にする', - addBankAccountToSendAndReceive: 'ワークスペースに提出した経費の払い戻しを受ける。', + addBankAccountToSendAndReceive: '支払いや受け取りを行うために銀行口座を追加してください。', addBankAccount: '銀行口座を追加', assignedCards: '割り当てられたカード', assignedCardsDescription: 'これらは、会社の支出を管理するためにワークスペース管理者によって割り当てられたカードです。', diff --git a/src/languages/nl.ts b/src/languages/nl.ts index 557fe5611513b..1991a587db73b 100644 --- a/src/languages/nl.ts +++ b/src/languages/nl.ts @@ -1830,7 +1830,7 @@ const translations = { expensifyWallet: 'Expensify Wallet (Beta)', sendAndReceiveMoney: 'Stuur en ontvang geld met vrienden. Alleen Amerikaanse bankrekeningen.', enableWallet: 'Portemonnee inschakelen', - addBankAccountToSendAndReceive: 'Word terugbetaald voor uitgaven die je indient bij een werkruimte.', + addBankAccountToSendAndReceive: 'Voeg een bankrekening toe om betalingen te doen of te ontvangen.', addBankAccount: 'Bankrekening toevoegen', assignedCards: 'Toegewezen kaarten', assignedCardsDescription: 'Dit zijn kaarten die door een werkruimtebeheerder zijn toegewezen om de uitgaven van het bedrijf te beheren.', diff --git a/src/languages/pl.ts b/src/languages/pl.ts index ed7359da0fda9..31ed60e55003c 100644 --- a/src/languages/pl.ts +++ b/src/languages/pl.ts @@ -1826,7 +1826,7 @@ const translations = { expensifyWallet: 'Expensify Wallet (Beta)', sendAndReceiveMoney: 'Wysyłaj i odbieraj pieniądze z przyjaciółmi. Tylko konta bankowe w USA.', enableWallet: 'Włącz portfel', - addBankAccountToSendAndReceive: 'Otrzymaj zwrot kosztów za wydatki, które zgłaszasz do przestrzeni roboczej.', + addBankAccountToSendAndReceive: 'Dodaj konto bankowe, aby dokonywać lub otrzymywać płatności.', addBankAccount: 'Dodaj konto bankowe', assignedCards: 'Przypisane karty', assignedCardsDescription: 'Są to karty przypisane przez administratora przestrzeni roboczej do zarządzania wydatkami firmy.', diff --git a/src/languages/pt-BR.ts b/src/languages/pt-BR.ts index 3c3159d29b7d1..4ee3ecf1d2a43 100644 --- a/src/languages/pt-BR.ts +++ b/src/languages/pt-BR.ts @@ -1829,7 +1829,7 @@ const translations = { expensifyWallet: 'Expensify Wallet (Beta)', sendAndReceiveMoney: 'Envie e receba dinheiro com amigos. Apenas contas bancárias dos EUA.', enableWallet: 'Ativar carteira', - addBankAccountToSendAndReceive: 'Receba reembolso pelas despesas que você enviar para um espaço de trabalho.', + addBankAccountToSendAndReceive: 'Adicione uma conta bancária para fazer ou receber pagamentos.', addBankAccount: 'Adicionar conta bancária', assignedCards: 'Cartões atribuídos', assignedCardsDescription: 'Estes são cartões atribuídos por um administrador de espaço de trabalho para gerenciar os gastos da empresa.', diff --git a/src/languages/zh-hans.ts b/src/languages/zh-hans.ts index d53821bf8136b..d2db720813776 100644 --- a/src/languages/zh-hans.ts +++ b/src/languages/zh-hans.ts @@ -1812,7 +1812,7 @@ const translations = { expensifyWallet: 'Expensify Wallet（测试版）', sendAndReceiveMoney: '与朋友发送和接收资金。仅限美国银行账户。', enableWallet: '启用钱包', - addBankAccountToSendAndReceive: '获得报销您提交到工作区的费用。', + addBankAccountToSendAndReceive: '添加银行账户以进行付款或收款。', addBankAccount: '添加银行账户', assignedCards: '已分配的卡片', assignedCardsDescription: '这些是由工作区管理员分配的卡片，用于管理公司支出。', From f45b404aae5c4911191d607ba6a4f8f7bed3a708 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Thu, 24 Jul 2025 17:12:02 +0200 Subject: [PATCH 2/5] feat: add translations for section titles --- src/languages/de.ts | 2 ++ src/languages/en.ts | 2 ++ src/languages/es.ts | 2 ++ src/languages/fr.ts | 2 ++ src/languages/it.ts | 2 ++ src/languages/ja.ts | 2 ++ src/languages/nl.ts | 2 ++ src/languages/pl.ts | 2 ++ src/languages/pt-BR.ts | 2 ++ src/languages/zh-hans.ts | 2 ++ 10 files changed, 20 insertions(+) diff --git a/src/languages/de.ts b/src/languages/de.ts index d1eeff851a62c..8f62430a07639 100644 --- a/src/languages/de.ts +++ b/src/languages/de.ts @@ -1848,6 +1848,8 @@ const translations = { chooseYourBankAccount: 'Wählen Sie Ihr Bankkonto aus', chooseAccountBody: 'Stellen Sie sicher, dass Sie das richtige auswählen.', confirmYourBankAccount: 'Bestätigen Sie Ihr Bankkonto', + personalBankAccounts: 'Persönliche Bankkonten', + businessBankAccounts: 'Geschäftsbankkonten', }, cardPage: { expensifyCard: 'Expensify Card', diff --git a/src/languages/en.ts b/src/languages/en.ts index bb86ed088453e..641314a5f1a22 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -1826,6 +1826,8 @@ const translations = { chooseYourBankAccount: 'Choose your bank account', chooseAccountBody: 'Make sure that you select the right one.', confirmYourBankAccount: 'Confirm your bank account', + personalBankAccounts: 'Personal bank accounts', + businessBankAccounts: 'Business bank accounts', }, cardPage: { expensifyCard: 'Expensify Card', diff --git a/src/languages/es.ts b/src/languages/es.ts index 9349b91a2543d..ffc29a137052c 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -1824,6 +1824,8 @@ const translations = { chooseYourBankAccount: 'Elige tu cuenta bancaria', chooseAccountBody: 'Asegúrese de elegir el adecuado.', confirmYourBankAccount: 'Confirma tu cuenta bancaria', + personalBankAccounts: 'Cuentas bancarias personales', + businessBankAccounts: 'Cuentas bancarias empresariales', }, cardPage: { expensifyCard: 'Tarjeta Expensify', diff --git a/src/languages/fr.ts b/src/languages/fr.ts index 2d9d9b57bbf89..e0d55f21a900d 100644 --- a/src/languages/fr.ts +++ b/src/languages/fr.ts @@ -1849,6 +1849,8 @@ const translations = { chooseYourBankAccount: 'Choisissez votre compte bancaire', chooseAccountBody: 'Assurez-vous de sélectionner le bon.', confirmYourBankAccount: 'Confirmez votre compte bancaire', + personalBankAccounts: 'Comptes bancaires personnels', + businessBankAccounts: 'Comptes bancaires professionnels', }, cardPage: { expensifyCard: 'Expensify Card', diff --git a/src/languages/it.ts b/src/languages/it.ts index eff8a44578957..997722a31439e 100644 --- a/src/languages/it.ts +++ b/src/languages/it.ts @@ -1842,6 +1842,8 @@ const translations = { chooseYourBankAccount: 'Scegli il tuo conto bancario', chooseAccountBody: 'Assicurati di selezionare quello giusto.', confirmYourBankAccount: 'Conferma il tuo conto bancario', + personalBankAccounts: 'Conti bancari personali', + businessBankAccounts: 'Conti bancari aziendali', }, cardPage: { expensifyCard: 'Expensify Card', diff --git a/src/languages/ja.ts b/src/languages/ja.ts index e9f13dbd088f7..8108b9ae06235 100644 --- a/src/languages/ja.ts +++ b/src/languages/ja.ts @@ -1839,6 +1839,8 @@ const translations = { chooseYourBankAccount: '銀行口座を選択してください', chooseAccountBody: '正しいものを選択してください。', confirmYourBankAccount: '銀行口座を確認してください', + personalBankAccounts: '個人銀行口座', + businessBankAccounts: 'ビジネス銀行口座', }, cardPage: { expensifyCard: 'Expensify Card', diff --git a/src/languages/nl.ts b/src/languages/nl.ts index 1991a587db73b..ed52a4aa3f61f 100644 --- a/src/languages/nl.ts +++ b/src/languages/nl.ts @@ -1842,6 +1842,8 @@ const translations = { chooseYourBankAccount: 'Kies uw bankrekening', chooseAccountBody: 'Zorg ervoor dat je de juiste selecteert.', confirmYourBankAccount: 'Bevestig uw bankrekening', + personalBankAccounts: 'Persoonlijke bankrekeningen', + businessBankAccounts: 'Zakelijke bankrekeningen', }, cardPage: { expensifyCard: 'Expensify Card', diff --git a/src/languages/pl.ts b/src/languages/pl.ts index 31ed60e55003c..a6bc335286c10 100644 --- a/src/languages/pl.ts +++ b/src/languages/pl.ts @@ -1838,6 +1838,8 @@ const translations = { chooseYourBankAccount: 'Wybierz swoje konto bankowe', chooseAccountBody: 'Upewnij się, że wybierasz właściwy.', confirmYourBankAccount: 'Potwierdź swoje konto bankowe', + personalBankAccounts: 'Osobiste konta bankowe', + businessBankAccounts: 'Firmowe konta bankowe', }, cardPage: { expensifyCard: 'Expensify Card', diff --git a/src/languages/pt-BR.ts b/src/languages/pt-BR.ts index 4ee3ecf1d2a43..480c8f2702a41 100644 --- a/src/languages/pt-BR.ts +++ b/src/languages/pt-BR.ts @@ -1841,6 +1841,8 @@ const translations = { chooseYourBankAccount: 'Escolha sua conta bancária', chooseAccountBody: 'Certifique-se de selecionar o correto.', confirmYourBankAccount: 'Confirme sua conta bancária', + personalBankAccounts: 'Contas bancárias pessoais', + businessBankAccounts: 'Contas bancárias empresariais', }, cardPage: { expensifyCard: 'Expensify Card', diff --git a/src/languages/zh-hans.ts b/src/languages/zh-hans.ts index d2db720813776..dc41b6f42f23a 100644 --- a/src/languages/zh-hans.ts +++ b/src/languages/zh-hans.ts @@ -1824,6 +1824,8 @@ const translations = { chooseYourBankAccount: '选择您的银行账户', chooseAccountBody: '确保您选择正确的选项。', confirmYourBankAccount: '确认您的银行账户', + personalBankAccounts: '个人银行账户', + businessBankAccounts: '企业银行账户', }, cardPage: { expensifyCard: 'Expensify Card', From fd469b9f08e5a6a9e74f60ec7d5e726594432cfa Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Mon, 28 Jul 2025 17:57:23 +0200 Subject: [PATCH 3/5] feat: show bank account in sections --- .../settings/Wallet/PaymentMethodList.tsx | 129 +++++++++++------- .../settings/Wallet/WalletPage/WalletPage.tsx | 1 + 2 files changed, 84 insertions(+), 46 deletions(-) diff --git a/src/pages/settings/Wallet/PaymentMethodList.tsx b/src/pages/settings/Wallet/PaymentMethodList.tsx index f46ae879eb8d8..aa1091fbb19eb 100644 --- a/src/pages/settings/Wallet/PaymentMethodList.tsx +++ b/src/pages/settings/Wallet/PaymentMethodList.tsx @@ -30,7 +30,7 @@ import variables from '@styles/variables'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; -import type {AccountData, BankAccountList, Card, CardList, CompanyCardFeed} from '@src/types/onyx'; +import type {AccountData, BankAccount, BankAccountList, Card, CardList, CompanyCardFeed} from '@src/types/onyx'; import type {BankIcon} from '@src/types/onyx/Bank'; import type {Errors} from '@src/types/onyx/OnyxCommon'; import type PaymentMethod from '@src/types/onyx/PaymentMethod'; @@ -104,6 +104,9 @@ type PaymentMethodListProps = { /** The policy invoice's transfer bank accountID */ invoiceTransferBankAccountID?: number; + + /** Whether the bank accounts should be displayed in private and business sections */ + shouldShowBankAccountSections?: boolean; }; type PaymentMethodItem = PaymentMethod & { @@ -166,7 +169,10 @@ function isPaymentMethodActive(actionPaymentMethodType: string, activePaymentMet return paymentMethod.accountType === actionPaymentMethodType && paymentMethod.methodID === activePaymentMethodID; } -function keyExtractor(item: PaymentMethod) { +function keyExtractor(item: PaymentMethod | string) { + if (typeof item === 'string') { + return item; + } return item.key ?? ''; } @@ -189,6 +195,7 @@ function PaymentMethodList({ listItemStyle = {}, shouldShowRightIcon = true, invoiceTransferBankAccountID, + shouldShowBankAccountSections = false, }: PaymentMethodListProps) { const styles = useThemeStyles(); const StyleUtils = useStyleUtils(); @@ -410,71 +417,101 @@ function PaymentMethodList({ [shouldShowAddBankAccountButton, onPressItem, translate, onPress, buttonRef, styles.paymentMethod, listItemStyle], ); + const itemsToRender = useMemo(() => { + if (!shouldShowBankAccountSections) { + return filteredPaymentMethods; + } + if ( + filteredPaymentMethods.find((method) => (method as BankAccount).accountData?.type === CONST.BANK_ACCOUNT.TYPE.PERSONAL) && + filteredPaymentMethods.find((method) => (method as BankAccount).accountData?.type === CONST.BANK_ACCOUNT.TYPE.BUSINESS) + ) { + return [ + translate('walletPage.personalBankAccounts'), + ...filteredPaymentMethods.filter((method) => (method as BankAccount).accountData?.type === CONST.BANK_ACCOUNT.TYPE.PERSONAL), + translate('walletPage.businessBankAccounts'), + ...filteredPaymentMethods.filter((method) => (method as BankAccount).accountData?.type === CONST.BANK_ACCOUNT.TYPE.BUSINESS), + ]; + } + return filteredPaymentMethods; + }, [filteredPaymentMethods, shouldShowAssignedCards, translate]); + /** * Create a menuItem for each passed paymentMethod */ const renderItem = useCallback( - ({item}: RenderSuggestionMenuItemProps) => ( - dismissError(item)} - pendingAction={item.pendingAction} - errors={item.errors} - errorRowStyles={styles.ph6} - canDismissError={item.canDismissError} - > - - - ), - + ({item, index}: RenderSuggestionMenuItemProps) => { + if (typeof item === 'string') { + return ( + + {item} + + ); + } + return ( + dismissError(item)} + pendingAction={item.pendingAction} + errors={item.errors} + errorRowStyles={styles.ph6} + canDismissError={item.canDismissError} + > + + + ); + }, [ styles.ph6, styles.paymentMethod, styles.badgeBordered, + styles.textLabel, + styles.colorMuted, + styles.mh8, + styles.mt6, filteredPaymentMethods, invoiceTransferBankAccountID, + userWallet?.walletLinkedAccountID, translate, listItemStyle, shouldShowSelectedState, selectedMethodID, - userWallet?.walletLinkedAccountID, ], ); return ( <> - estimatedItemSize={variables.optionRowHeight} - data={filteredPaymentMethods} + data={itemsToRender} renderItem={renderItem} keyExtractor={keyExtractor} ListEmptyComponent={shouldShowEmptyListMessage ? renderListEmptyComponent : null} diff --git a/src/pages/settings/Wallet/WalletPage/WalletPage.tsx b/src/pages/settings/Wallet/WalletPage/WalletPage.tsx index 5011f46015703..ecf5bb084edbd 100644 --- a/src/pages/settings/Wallet/WalletPage/WalletPage.tsx +++ b/src/pages/settings/Wallet/WalletPage/WalletPage.tsx @@ -443,6 +443,7 @@ function WalletPage({shouldListenForResize = false}: WalletPageProps) { onListContentSizeChange={shouldShowAddPaymentMenu || shouldShowDefaultDeleteMenu ? setMenuPosition : () => {}} style={[styles.mt5, [shouldUseNarrowLayout ? styles.mhn5 : styles.mhn8]]} listItemStyle={shouldUseNarrowLayout ? styles.ph5 : styles.ph8} + shouldShowBankAccountSections /> From 9718a50bc63aeb07c1624f8451f061b9bafa7de4 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Tue, 29 Jul 2025 10:36:49 +0200 Subject: [PATCH 4/5] fix: deps --- src/pages/settings/Wallet/PaymentMethodList.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/settings/Wallet/PaymentMethodList.tsx b/src/pages/settings/Wallet/PaymentMethodList.tsx index 2858bf1ec3fd2..ab0c1c3ac2b11 100644 --- a/src/pages/settings/Wallet/PaymentMethodList.tsx +++ b/src/pages/settings/Wallet/PaymentMethodList.tsx @@ -433,7 +433,7 @@ function PaymentMethodList({ ]; } return filteredPaymentMethods; - }, [filteredPaymentMethods, shouldShowAssignedCards, translate]); + }, [filteredPaymentMethods, shouldShowBankAccountSections, translate]); /** * Create a menuItem for each passed paymentMethod From 83e8136d81f84e7561510526e4e65892965ffa49 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Tue, 29 Jul 2025 17:02:35 +0200 Subject: [PATCH 5/5] fix: apply suggested change Co-authored-by: Dominic <165644294+dominictb@users.noreply.github.com> --- src/languages/es.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/languages/es.ts b/src/languages/es.ts index 49a2282dfba03..4a7972a7e539c 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -1813,7 +1813,7 @@ const translations = { expensifyWallet: 'Billetera Expensify (Beta)', sendAndReceiveMoney: 'Envía y recibe dinero desde tu Billetera Expensify. Solo cuentas bancarias de EE. UU.', enableWallet: 'Habilitar billetera', - addBankAccountToSendAndReceive: 'Agrega una cuenta bancaria para realizar o recibir pagos.', + addBankAccountToSendAndReceive: 'Añade una cuenta bancaria para hacer o recibir pagos.', assignedCards: 'Tarjetas asignadas', assignedCardsDescription: 'Son tarjetas asignadas por un administrador del espacio de trabajo para gestionar los gastos de la empresa.', expensifyCard: 'Tarjeta Expensify',