From acbeb1b60b2fcdc9f16a5197044af7f03ff71a91 Mon Sep 17 00:00:00 2001 From: Manan Jadhav Date: Fri, 17 May 2024 23:10:28 +0530 Subject: [PATCH 1/7] fix: select first item in list --- .../workspace/accounting/xero/advanced/XeroAdvancedPage.tsx | 2 +- .../accounting/xero/export/XeroExportConfigurationPage.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/workspace/accounting/xero/advanced/XeroAdvancedPage.tsx b/src/pages/workspace/accounting/xero/advanced/XeroAdvancedPage.tsx index de6e62b4baa3..1fe445ea2fe6 100644 --- a/src/pages/workspace/accounting/xero/advanced/XeroAdvancedPage.tsx +++ b/src/pages/workspace/accounting/xero/advanced/XeroAdvancedPage.tsx @@ -28,7 +28,7 @@ function XeroAdvancedPage({policy}: WithPolicyConnectionsProps) { const getSelectedAccountName = useMemo( () => (accountID: string) => { const selectedAccount = (bankAccounts ?? []).find((bank) => bank.id === accountID); - return selectedAccount?.name ?? ''; + return selectedAccount?.name ?? bankAccounts?.[0]?.name ?? ''; }, [bankAccounts], ); diff --git a/src/pages/workspace/accounting/xero/export/XeroExportConfigurationPage.tsx b/src/pages/workspace/accounting/xero/export/XeroExportConfigurationPage.tsx index fd0213ed0f89..487001f69332 100644 --- a/src/pages/workspace/accounting/xero/export/XeroExportConfigurationPage.tsx +++ b/src/pages/workspace/accounting/xero/export/XeroExportConfigurationPage.tsx @@ -26,7 +26,7 @@ function XeroExportConfigurationPage({policy}: WithPolicyConnectionsProps) { const {bankAccounts} = policy?.connections?.xero?.data ?? {}; const selectedBankAccountName = useMemo(() => { const selectedAccount = (bankAccounts ?? []).find((bank) => bank.id === exportConfiguration?.nonReimbursableAccount); - return selectedAccount?.name ?? ''; + return selectedAccount?.name ?? bankAccounts?.[0]?.name ?? ''; }, [bankAccounts, exportConfiguration?.nonReimbursableAccount]); const currentXeroOrganizationName = useMemo(() => getCurrentXeroOrganizationName(policy ?? undefined), [policy]); From 89a68ba0af446ff37a6fd9a3427582e0bfedd2fc Mon Sep 17 00:00:00 2001 From: Manan Jadhav Date: Fri, 17 May 2024 23:10:44 +0530 Subject: [PATCH 2/7] fix: default select first item --- .../xero/export/XeroBankAccountSelectPage.tsx | 20 +++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/src/pages/workspace/accounting/xero/export/XeroBankAccountSelectPage.tsx b/src/pages/workspace/accounting/xero/export/XeroBankAccountSelectPage.tsx index 897ed0b37d78..96ad0a904645 100644 --- a/src/pages/workspace/accounting/xero/export/XeroBankAccountSelectPage.tsx +++ b/src/pages/workspace/accounting/xero/export/XeroBankAccountSelectPage.tsx @@ -22,16 +22,16 @@ function XeroBankAccountSelectPage({policy}: WithPolicyConnectionsProps) { const {nonReimbursableAccount: nonReimbursableAccountID} = policy?.connections?.xero?.config.export ?? {}; - const xeroSelectorOptions = useMemo( - () => - (bankAccounts ?? []).map(({id, name}) => ({ - value: id, - text: name, - keyForList: id, - isSelected: nonReimbursableAccountID === id, - })), - [nonReimbursableAccountID, bankAccounts], - ); + const xeroSelectorOptions = useMemo(() => { + const isMatchFound = bankAccounts?.some(({id}) => id === nonReimbursableAccountID); + + return (bankAccounts ?? []).map(({id, name}, index) => ({ + value: id, + text: name, + keyForList: id, + isSelected: isMatchFound ? nonReimbursableAccountID === id : index === 0, + })); + }, [nonReimbursableAccountID, bankAccounts]); const listHeaderComponent = useMemo( () => ( From 77cedd2da7b8cfa3187f8f054cbad6ea90ca344e Mon Sep 17 00:00:00 2001 From: Manan Jadhav Date: Fri, 17 May 2024 23:14:25 +0530 Subject: [PATCH 3/7] fix: default select first item --- .../XeroBillPaymentAccountSelectorPage.tsx | 20 +++++++++---------- .../XeroInvoiceAccountSelectorPage.tsx | 20 +++++++++---------- 2 files changed, 20 insertions(+), 20 deletions(-) diff --git a/src/pages/workspace/accounting/xero/advanced/XeroBillPaymentAccountSelectorPage.tsx b/src/pages/workspace/accounting/xero/advanced/XeroBillPaymentAccountSelectorPage.tsx index 11ac106f516c..3c7ad124b8d1 100644 --- a/src/pages/workspace/accounting/xero/advanced/XeroBillPaymentAccountSelectorPage.tsx +++ b/src/pages/workspace/accounting/xero/advanced/XeroBillPaymentAccountSelectorPage.tsx @@ -22,16 +22,16 @@ function XeroBillPaymentAccountSelectorPage({policy}: WithPolicyConnectionsProps const {reimbursementAccountID, syncReimbursedReports} = policy?.connections?.xero?.config.sync ?? {}; - const xeroSelectorOptions = useMemo( - () => - (bankAccounts ?? []).map(({id, name}) => ({ - value: id, - text: name, - keyForList: id, - isSelected: reimbursementAccountID === id, - })), - [reimbursementAccountID, bankAccounts], - ); + const xeroSelectorOptions = useMemo(() => { + const isMatchFound = bankAccounts?.some(({id}) => id === reimbursementAccountID); + + return (bankAccounts ?? []).map(({id, name}, index) => ({ + value: id, + text: name, + keyForList: id, + isSelected: isMatchFound ? reimbursementAccountID === id : index === 0, + })); + }, [reimbursementAccountID, bankAccounts]); const listHeaderComponent = useMemo( () => ( diff --git a/src/pages/workspace/accounting/xero/advanced/XeroInvoiceAccountSelectorPage.tsx b/src/pages/workspace/accounting/xero/advanced/XeroInvoiceAccountSelectorPage.tsx index ba7749fef4f2..86a627e74bfe 100644 --- a/src/pages/workspace/accounting/xero/advanced/XeroInvoiceAccountSelectorPage.tsx +++ b/src/pages/workspace/accounting/xero/advanced/XeroInvoiceAccountSelectorPage.tsx @@ -22,16 +22,16 @@ function XeroInvoiceAccountSelectorPage({policy}: WithPolicyConnectionsProps) { const {invoiceCollectionsAccountID, syncReimbursedReports} = policy?.connections?.xero?.config.sync ?? {}; - const xeroSelectorOptions = useMemo( - () => - (bankAccounts ?? []).map(({id, name}) => ({ - value: id, - text: name, - keyForList: id, - isSelected: invoiceCollectionsAccountID === id, - })), - [invoiceCollectionsAccountID, bankAccounts], - ); + const xeroSelectorOptions = useMemo(() => { + const isMatchFound = bankAccounts?.some(({id}) => id === invoiceCollectionsAccountID); + + return (bankAccounts ?? []).map(({id, name}, index) => ({ + value: id, + text: name, + keyForList: id, + isSelected: isMatchFound ? invoiceCollectionsAccountID === id : index === 0, + })); + }, [invoiceCollectionsAccountID, bankAccounts]); const listHeaderComponent = useMemo( () => ( From f3cbb216531481749a9683aa69ba4998e21504be Mon Sep 17 00:00:00 2001 From: Manan Jadhav Date: Tue, 21 May 2024 14:05:14 +0530 Subject: [PATCH 4/7] refactor: move bank selection to utils --- src/libs/PolicyUtils.ts | 14 ++++++++++++++ .../XeroBillPaymentAccountSelectorPage.tsx | 16 +++------------- 2 files changed, 17 insertions(+), 13 deletions(-) diff --git a/src/libs/PolicyUtils.ts b/src/libs/PolicyUtils.ts index 6a26b1a6cfc2..17202662e769 100644 --- a/src/libs/PolicyUtils.ts +++ b/src/libs/PolicyUtils.ts @@ -7,6 +7,7 @@ import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type {Policy, PolicyCategories, PolicyEmployeeList, PolicyTagList, PolicyTags, TaxRate} from '@src/types/onyx'; import type {PolicyFeatureName, Rate, Tenant} from '@src/types/onyx/Policy'; +import type {SelectorType} from '@components/SelectionScreen'; import type PolicyEmployee from '@src/types/onyx/PolicyEmployee'; import type {EmptyObject} from '@src/types/utils/EmptyObject'; import {isEmptyObject} from '@src/types/utils/EmptyObject'; @@ -408,6 +409,18 @@ function getCurrentXeroOrganizationName(policy: Policy | undefined): string | un return findCurrentXeroOrganization(getXeroTenants(policy), policy?.connections?.xero?.config?.tenantID)?.name; } +function getXeroBankAccountsWithDefaultSelect(policy: Policy | undefined, selectedBankAccountId: string | undefined): SelectorType[] { + const bankAccounts = policy?.connections?.xero?.data?.bankAccounts ?? []; + const isMatchFound = bankAccounts?.some(({id}) => id === selectedBankAccountId); + + return (bankAccounts ?? []).map(({id, name}, index) => ({ + value: id, + text: name, + keyForList: id, + isSelected: isMatchFound ? selectedBankAccountId === id : index === 0, + })); +} + export { canEditTaxRate, extractPolicyIDFromPath, @@ -456,6 +469,7 @@ export { getXeroTenants, findCurrentXeroOrganization, getCurrentXeroOrganizationName, + getXeroBankAccountsWithDefaultSelect }; export type {MemberEmailsToAccountIDs}; diff --git a/src/pages/workspace/accounting/xero/advanced/XeroBillPaymentAccountSelectorPage.tsx b/src/pages/workspace/accounting/xero/advanced/XeroBillPaymentAccountSelectorPage.tsx index 3c7ad124b8d1..3b61c74067b0 100644 --- a/src/pages/workspace/accounting/xero/advanced/XeroBillPaymentAccountSelectorPage.tsx +++ b/src/pages/workspace/accounting/xero/advanced/XeroBillPaymentAccountSelectorPage.tsx @@ -12,26 +12,16 @@ import type {WithPolicyConnectionsProps} from '@pages/workspace/withPolicyConnec import withPolicyConnections from '@pages/workspace/withPolicyConnections'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; +import { getXeroBankAccountsWithDefaultSelect } from '@libs/PolicyUtils'; function XeroBillPaymentAccountSelectorPage({policy}: WithPolicyConnectionsProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); const policyID = policy?.id ?? ''; - const {bankAccounts} = policy?.connections?.xero?.data ?? {}; - + const {reimbursementAccountID, syncReimbursedReports} = policy?.connections?.xero?.config.sync ?? {}; - - const xeroSelectorOptions = useMemo(() => { - const isMatchFound = bankAccounts?.some(({id}) => id === reimbursementAccountID); - - return (bankAccounts ?? []).map(({id, name}, index) => ({ - value: id, - text: name, - keyForList: id, - isSelected: isMatchFound ? reimbursementAccountID === id : index === 0, - })); - }, [reimbursementAccountID, bankAccounts]); + const xeroSelectorOptions = useMemo(() => getXeroBankAccountsWithDefaultSelect(policy ?? undefined, reimbursementAccountID), [reimbursementAccountID, policy]); const listHeaderComponent = useMemo( () => ( From e143cfb8ad36c09dd7a18667a6db0177f88b6c47 Mon Sep 17 00:00:00 2001 From: Manan Jadhav Date: Tue, 21 May 2024 14:06:48 +0530 Subject: [PATCH 5/7] refactor: replace with utils --- .../advanced/XeroInvoiceAccountSelectorPage.tsx | 14 ++------------ 1 file changed, 2 insertions(+), 12 deletions(-) diff --git a/src/pages/workspace/accounting/xero/advanced/XeroInvoiceAccountSelectorPage.tsx b/src/pages/workspace/accounting/xero/advanced/XeroInvoiceAccountSelectorPage.tsx index 86a627e74bfe..cca34a8e9cc0 100644 --- a/src/pages/workspace/accounting/xero/advanced/XeroInvoiceAccountSelectorPage.tsx +++ b/src/pages/workspace/accounting/xero/advanced/XeroInvoiceAccountSelectorPage.tsx @@ -12,26 +12,16 @@ import type {WithPolicyConnectionsProps} from '@pages/workspace/withPolicyConnec import withPolicyConnections from '@pages/workspace/withPolicyConnections'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; +import { getXeroBankAccountsWithDefaultSelect } from '@libs/PolicyUtils'; function XeroInvoiceAccountSelectorPage({policy}: WithPolicyConnectionsProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); const policyID = policy?.id ?? ''; - const {bankAccounts} = policy?.connections?.xero?.data ?? {}; const {invoiceCollectionsAccountID, syncReimbursedReports} = policy?.connections?.xero?.config.sync ?? {}; - - const xeroSelectorOptions = useMemo(() => { - const isMatchFound = bankAccounts?.some(({id}) => id === invoiceCollectionsAccountID); - - return (bankAccounts ?? []).map(({id, name}, index) => ({ - value: id, - text: name, - keyForList: id, - isSelected: isMatchFound ? invoiceCollectionsAccountID === id : index === 0, - })); - }, [invoiceCollectionsAccountID, bankAccounts]); + const xeroSelectorOptions = useMemo(() => getXeroBankAccountsWithDefaultSelect(policy ?? undefined, invoiceCollectionsAccountID), [invoiceCollectionsAccountID, policy]); const listHeaderComponent = useMemo( () => ( From 92cd9c6d3601d5e853067700b4dd6a83ed6b2b80 Mon Sep 17 00:00:00 2001 From: Manan Jadhav Date: Tue, 21 May 2024 14:08:02 +0530 Subject: [PATCH 6/7] refactor: replace with utils --- .../xero/export/XeroBankAccountSelectPage.tsx | 16 +++------------- 1 file changed, 3 insertions(+), 13 deletions(-) diff --git a/src/pages/workspace/accounting/xero/export/XeroBankAccountSelectPage.tsx b/src/pages/workspace/accounting/xero/export/XeroBankAccountSelectPage.tsx index 96ad0a904645..e35468e0848e 100644 --- a/src/pages/workspace/accounting/xero/export/XeroBankAccountSelectPage.tsx +++ b/src/pages/workspace/accounting/xero/export/XeroBankAccountSelectPage.tsx @@ -12,26 +12,16 @@ import type {WithPolicyConnectionsProps} from '@pages/workspace/withPolicyConnec import withPolicyConnections from '@pages/workspace/withPolicyConnections'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; +import { getXeroBankAccountsWithDefaultSelect } from '@libs/PolicyUtils'; function XeroBankAccountSelectPage({policy}: WithPolicyConnectionsProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); const policyID = policy?.id ?? ''; - const {bankAccounts} = policy?.connections?.xero?.data ?? {}; - + const {nonReimbursableAccount: nonReimbursableAccountID} = policy?.connections?.xero?.config.export ?? {}; - - const xeroSelectorOptions = useMemo(() => { - const isMatchFound = bankAccounts?.some(({id}) => id === nonReimbursableAccountID); - - return (bankAccounts ?? []).map(({id, name}, index) => ({ - value: id, - text: name, - keyForList: id, - isSelected: isMatchFound ? nonReimbursableAccountID === id : index === 0, - })); - }, [nonReimbursableAccountID, bankAccounts]); + const xeroSelectorOptions = useMemo(() => getXeroBankAccountsWithDefaultSelect(policy ?? undefined, nonReimbursableAccountID), [nonReimbursableAccountID, policy]); const listHeaderComponent = useMemo( () => ( From a66f8cbbe7cd82e6a080058c704f5dae4452efb8 Mon Sep 17 00:00:00 2001 From: Manan Jadhav Date: Tue, 21 May 2024 14:09:26 +0530 Subject: [PATCH 7/7] refactor: lint fixes --- src/libs/PolicyUtils.ts | 6 +++--- .../xero/advanced/XeroBillPaymentAccountSelectorPage.tsx | 4 ++-- .../xero/advanced/XeroInvoiceAccountSelectorPage.tsx | 2 +- .../accounting/xero/export/XeroBankAccountSelectPage.tsx | 6 +++--- 4 files changed, 9 insertions(+), 9 deletions(-) diff --git a/src/libs/PolicyUtils.ts b/src/libs/PolicyUtils.ts index 17202662e769..227e86d6a031 100644 --- a/src/libs/PolicyUtils.ts +++ b/src/libs/PolicyUtils.ts @@ -2,12 +2,12 @@ import Str from 'expensify-common/lib/str'; import type {OnyxCollection, OnyxEntry} from 'react-native-onyx'; import Onyx from 'react-native-onyx'; import type {ValueOf} from 'type-fest'; +import type {SelectorType} from '@components/SelectionScreen'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type {Policy, PolicyCategories, PolicyEmployeeList, PolicyTagList, PolicyTags, TaxRate} from '@src/types/onyx'; import type {PolicyFeatureName, Rate, Tenant} from '@src/types/onyx/Policy'; -import type {SelectorType} from '@components/SelectionScreen'; import type PolicyEmployee from '@src/types/onyx/PolicyEmployee'; import type {EmptyObject} from '@src/types/utils/EmptyObject'; import {isEmptyObject} from '@src/types/utils/EmptyObject'; @@ -419,7 +419,7 @@ function getXeroBankAccountsWithDefaultSelect(policy: Policy | undefined, select keyForList: id, isSelected: isMatchFound ? selectedBankAccountId === id : index === 0, })); -} +} export { canEditTaxRate, @@ -469,7 +469,7 @@ export { getXeroTenants, findCurrentXeroOrganization, getCurrentXeroOrganizationName, - getXeroBankAccountsWithDefaultSelect + getXeroBankAccountsWithDefaultSelect, }; export type {MemberEmailsToAccountIDs}; diff --git a/src/pages/workspace/accounting/xero/advanced/XeroBillPaymentAccountSelectorPage.tsx b/src/pages/workspace/accounting/xero/advanced/XeroBillPaymentAccountSelectorPage.tsx index 3b61c74067b0..baeab09cac29 100644 --- a/src/pages/workspace/accounting/xero/advanced/XeroBillPaymentAccountSelectorPage.tsx +++ b/src/pages/workspace/accounting/xero/advanced/XeroBillPaymentAccountSelectorPage.tsx @@ -8,18 +8,18 @@ import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import * as Connections from '@libs/actions/connections'; import Navigation from '@libs/Navigation/Navigation'; +import {getXeroBankAccountsWithDefaultSelect} from '@libs/PolicyUtils'; import type {WithPolicyConnectionsProps} from '@pages/workspace/withPolicyConnections'; import withPolicyConnections from '@pages/workspace/withPolicyConnections'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; -import { getXeroBankAccountsWithDefaultSelect } from '@libs/PolicyUtils'; function XeroBillPaymentAccountSelectorPage({policy}: WithPolicyConnectionsProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); const policyID = policy?.id ?? ''; - + const {reimbursementAccountID, syncReimbursedReports} = policy?.connections?.xero?.config.sync ?? {}; const xeroSelectorOptions = useMemo(() => getXeroBankAccountsWithDefaultSelect(policy ?? undefined, reimbursementAccountID), [reimbursementAccountID, policy]); diff --git a/src/pages/workspace/accounting/xero/advanced/XeroInvoiceAccountSelectorPage.tsx b/src/pages/workspace/accounting/xero/advanced/XeroInvoiceAccountSelectorPage.tsx index cca34a8e9cc0..4ef071cd54b5 100644 --- a/src/pages/workspace/accounting/xero/advanced/XeroInvoiceAccountSelectorPage.tsx +++ b/src/pages/workspace/accounting/xero/advanced/XeroInvoiceAccountSelectorPage.tsx @@ -8,11 +8,11 @@ import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import * as Connections from '@libs/actions/connections'; import Navigation from '@libs/Navigation/Navigation'; +import {getXeroBankAccountsWithDefaultSelect} from '@libs/PolicyUtils'; import type {WithPolicyConnectionsProps} from '@pages/workspace/withPolicyConnections'; import withPolicyConnections from '@pages/workspace/withPolicyConnections'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; -import { getXeroBankAccountsWithDefaultSelect } from '@libs/PolicyUtils'; function XeroInvoiceAccountSelectorPage({policy}: WithPolicyConnectionsProps) { const styles = useThemeStyles(); diff --git a/src/pages/workspace/accounting/xero/export/XeroBankAccountSelectPage.tsx b/src/pages/workspace/accounting/xero/export/XeroBankAccountSelectPage.tsx index e35468e0848e..138ca8fa3800 100644 --- a/src/pages/workspace/accounting/xero/export/XeroBankAccountSelectPage.tsx +++ b/src/pages/workspace/accounting/xero/export/XeroBankAccountSelectPage.tsx @@ -8,20 +8,20 @@ import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import * as Connections from '@libs/actions/connections'; import Navigation from '@libs/Navigation/Navigation'; +import {getXeroBankAccountsWithDefaultSelect} from '@libs/PolicyUtils'; import type {WithPolicyConnectionsProps} from '@pages/workspace/withPolicyConnections'; import withPolicyConnections from '@pages/workspace/withPolicyConnections'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; -import { getXeroBankAccountsWithDefaultSelect } from '@libs/PolicyUtils'; function XeroBankAccountSelectPage({policy}: WithPolicyConnectionsProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); const policyID = policy?.id ?? ''; - + const {nonReimbursableAccount: nonReimbursableAccountID} = policy?.connections?.xero?.config.export ?? {}; - const xeroSelectorOptions = useMemo(() => getXeroBankAccountsWithDefaultSelect(policy ?? undefined, nonReimbursableAccountID), [nonReimbursableAccountID, policy]); + const xeroSelectorOptions = useMemo(() => getXeroBankAccountsWithDefaultSelect(policy ?? undefined, nonReimbursableAccountID), [nonReimbursableAccountID, policy]); const listHeaderComponent = useMemo( () => (