diff --git a/src/CONST.ts b/src/CONST.ts index 9dd67b77e218..35286ac035fb 100755 --- a/src/CONST.ts +++ b/src/CONST.ts @@ -182,6 +182,8 @@ const CONST = { MERCHANT_NAME_MAX_LENGTH: 255, + MASKED_PAN_PREFIX: 'XXXXXXXXXXXX', + REQUEST_PREVIEW: { MAX_LENGTH: 83, }, @@ -2247,6 +2249,10 @@ const CONST = { PHYSICAL: 'physical', VIRTUAL: 'virtual', }, + FREQUENCY_SETTING: { + DAILY: 'daily', + MONTHLY: 'monthly', + }, }, AVATAR_ROW_SIZE: { DEFAULT: 4, diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts index dd575abd8d5e..6a5a7c48a826 100755 --- a/src/ONYXKEYS.ts +++ b/src/ONYXKEYS.ts @@ -449,10 +449,10 @@ const ONYXKEYS = { */ WORKSPACE_CARDS_LIST: 'card_', - /** The bank account that Expensify Card payments will be reconciled against */ + /** Stores which connection is set up to use Continuous Reconciliation */ SHARED_NVP_EXPENSIFY_CARD_CONTINUOUS_RECONCILIATION_CONNECTION: 'sharedNVP_expensifyCard_continuousReconciliationConnection_', - /** If continuous reconciliation is enabled */ + /** The value that indicates whether Continuous Reconciliation should be used on the domain */ SHARED_NVP_EXPENSIFY_CARD_USE_CONTINUOUS_RECONCILIATION: 'sharedNVP_expensifyCard_useContinuousReconciliation_', }, @@ -707,7 +707,7 @@ type OnyxCollectionValuesMapping = { [ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_USER_BILLING_GRACE_PERIOD_END]: OnyxTypes.BillingGraceEndPeriod; [ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_EXPENSIFY_CARD_SETTINGS]: OnyxTypes.ExpensifyCardSettings; [ONYXKEYS.COLLECTION.WORKSPACE_CARDS_LIST]: OnyxTypes.WorkspaceCardsList; - [ONYXKEYS.COLLECTION.SHARED_NVP_EXPENSIFY_CARD_CONTINUOUS_RECONCILIATION_CONNECTION]: OnyxTypes.BankAccount; + [ONYXKEYS.COLLECTION.SHARED_NVP_EXPENSIFY_CARD_CONTINUOUS_RECONCILIATION_CONNECTION]: OnyxTypes.PolicyConnectionName; [ONYXKEYS.COLLECTION.SHARED_NVP_EXPENSIFY_CARD_USE_CONTINUOUS_RECONCILIATION]: boolean; }; diff --git a/src/ROUTES.ts b/src/ROUTES.ts index c2a484378339..79c91869e5b7 100644 --- a/src/ROUTES.ts +++ b/src/ROUTES.ts @@ -878,6 +878,18 @@ const ROUTES = { route: 'settings/workspaces/:policyID/expensify-card/choose-bank-account', getRoute: (policyID: string) => `settings/workspaces/${policyID}/expensify-card/choose-bank-account` as const, }, + WORKSPACE_EXPENSIFY_CARD_SETTINGS: { + route: 'settings/workspaces/:policyID/expensify-card/settings', + getRoute: (policyID: string) => `settings/workspaces/${policyID}/expensify-card/settings` as const, + }, + WORKSPACE_EXPENSIFY_CARD_SETTINGS_ACCOUNT: { + route: 'settings/workspaces/:policyID/expensify-card/settings/account', + getRoute: (policyID: string) => `settings/workspaces/${policyID}/expensify-card/settings/account` as const, + }, + WORKSPACE_EXPENSIFY_CARD_SETTINGS_FREQUENCY: { + route: 'settings/workspaces/:policyID/expensify-card/settings/frequency', + getRoute: (policyID: string) => `settings/workspaces/${policyID}/expensify-card/settings/frequency` as const, + }, WORKSPACE_DISTANCE_RATES: { route: 'settings/workspaces/:policyID/distance-rates', getRoute: (policyID: string) => `settings/workspaces/${policyID}/distance-rates` as const, diff --git a/src/SCREENS.ts b/src/SCREENS.ts index b1f94880ff2f..00dc785dfe36 100644 --- a/src/SCREENS.ts +++ b/src/SCREENS.ts @@ -353,6 +353,9 @@ const SCREENS = { EXPENSIFY_CARD_ISSUE_NEW: 'Workspace_ExpensifyCard_New', EXPENSIFY_CARD_NAME: 'Workspace_ExpensifyCard_Name', EXPENSIFY_CARD_BANK_ACCOUNT: 'Workspace_ExpensifyCard_BankAccount', + EXPENSIFY_CARD_SETTINGS: 'Workspace_ExpensifyCard_Settings', + EXPENSIFY_CARD_SETTINGS_ACCOUNT: 'Workspace_ExpensifyCard_Settings_Account', + EXPENSIFY_CARD_SETTINGS_FREQUENCY: 'Workspace_ExpensifyCard_Settings_Frequency', BILLS: 'Workspace_Bills', INVOICES: 'Workspace_Invoices', TRAVEL: 'Workspace_Travel', diff --git a/src/components/FormHelpMessage.tsx b/src/components/FormHelpMessage.tsx index 01a5a1eaf3a8..92cdc658b2d7 100644 --- a/src/components/FormHelpMessage.tsx +++ b/src/components/FormHelpMessage.tsx @@ -10,7 +10,7 @@ import Text from './Text'; type FormHelpMessageProps = { /** Error or hint text. Ignored when children is not empty */ - message?: string; + message?: string | React.ReactNode; /** Children to render next to dot indicator */ children?: React.ReactNode; diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index 473806aac3af..f7f8a77018ce 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -160,7 +160,7 @@ type MenuItemBaseProps = { errorTextStyle?: StyleProp; /** Hint to display at the bottom of the component */ - hintText?: string; + hintText?: string | ReactNode; /** Should the error text red dot indicator be shown */ shouldShowRedDotIndicator?: boolean; diff --git a/src/components/SelectionList/RadioListItem.tsx b/src/components/SelectionList/RadioListItem.tsx index 48ca474f6c60..a8ed56269803 100644 --- a/src/components/SelectionList/RadioListItem.tsx +++ b/src/components/SelectionList/RadioListItem.tsx @@ -41,6 +41,7 @@ function RadioListItem({ pendingAction={item.pendingAction} > <> + {!!item.leftElement && item.leftElement} , user: OnyxEntry): string { return user?.isFromPublicDomain ? 'https://' : `https://www.${Str.extractEmailDomain(session?.email ?? '')}`; } -// eslint-disable-next-line import/prefer-default-export -export {getDefaultCompanyWebsite}; + +function getLastFourDigits(bankAccountNumber: string): string { + return bankAccountNumber ? bankAccountNumber.slice(-4) : ''; +} + +export {getDefaultCompanyWebsite, getLastFourDigits}; diff --git a/src/libs/CardUtils.ts b/src/libs/CardUtils.ts index 1f90513ad29d..a5dfe69bf40e 100644 --- a/src/libs/CardUtils.ts +++ b/src/libs/CardUtils.ts @@ -6,7 +6,8 @@ import CONST from '@src/CONST'; import type {TranslationPaths} from '@src/languages/types'; import type {OnyxValues} from '@src/ONYXKEYS'; import ONYXKEYS from '@src/ONYXKEYS'; -import type {Card, CardList} from '@src/types/onyx'; +import type {BankAccountList, Card, CardList} from '@src/types/onyx'; +import {isEmptyObject} from '@src/types/utils/EmptyObject'; import * as Localize from './Localize'; let allCards: OnyxValues[typeof ONYXKEYS.CARD_LIST] = {}; @@ -158,6 +159,13 @@ function getTranslationKeyForLimitType(limitType: ValueOf) { + if (!bankAccountsList || isEmptyObject(bankAccountsList)) { + return []; + } + return Object.values(bankAccountsList).filter((bankAccount) => bankAccount?.accountData?.type === CONST.BANK_ACCOUNT.TYPE.BUSINESS && bankAccount?.accountData?.allowDebit); +} + export { isExpensifyCard, isCorporateCard, @@ -171,4 +179,5 @@ export { hasDetectedFraud, getMCardNumberString, getTranslationKeyForLimitType, + getEligibleBankAccountsForCard, }; diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx index 5be267eb4e4d..b22509e44172 100644 --- a/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx +++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx @@ -414,6 +414,9 @@ const SettingsModalStackNavigator = createModalStackNavigator require('../../../../pages/workspace/taxes/WorkspaceCreateTaxPage').default, [SCREENS.WORKSPACE.TAX_CODE]: () => require('../../../../pages/workspace/taxes/WorkspaceTaxCodePage').default, [SCREENS.WORKSPACE.EXPENSIFY_CARD_ISSUE_NEW]: () => require('../../../../pages/workspace/card/issueNew/IssueNewCardPage').default, + [SCREENS.WORKSPACE.EXPENSIFY_CARD_SETTINGS]: () => require('../../../../pages/workspace/expensifyCard/WorkspaceCardSettingsPage').default, + [SCREENS.WORKSPACE.EXPENSIFY_CARD_SETTINGS_ACCOUNT]: () => require('../../../../pages/workspace/expensifyCard/WorkspaceSettlementAccountPage').default, + [SCREENS.WORKSPACE.EXPENSIFY_CARD_SETTINGS_FREQUENCY]: () => require('../../../../pages/workspace/expensifyCard/WorkspaceSettlementFrequencyPage').default, [SCREENS.WORKSPACE.EXPENSIFY_CARD_BANK_ACCOUNT]: () => require('../../../../pages/workspace/expensifyCard/WorkspaceExpensifyCardBankAccounts').default, [SCREENS.WORKSPACE.EXPENSIFY_CARD_DETAILS]: () => require('../../../../pages/workspace/expensifyCard/WorkspaceExpensifyCardDetailsPage').default, [SCREENS.WORKSPACE.EXPENSIFY_CARD_NAME]: () => require('../../../../pages/workspace/expensifyCard/WorkspaceEditCardNamePage').default, diff --git a/src/libs/Navigation/linkingConfig/FULL_SCREEN_TO_RHP_MAPPING.ts b/src/libs/Navigation/linkingConfig/FULL_SCREEN_TO_RHP_MAPPING.ts index ad149c2af083..0a059407a0cf 100755 --- a/src/libs/Navigation/linkingConfig/FULL_SCREEN_TO_RHP_MAPPING.ts +++ b/src/libs/Navigation/linkingConfig/FULL_SCREEN_TO_RHP_MAPPING.ts @@ -159,6 +159,9 @@ const FULL_SCREEN_TO_RHP_MAPPING: Partial> = { [SCREENS.WORKSPACE.EXPENSIFY_CARD]: [ SCREENS.WORKSPACE.EXPENSIFY_CARD_ISSUE_NEW, SCREENS.WORKSPACE.EXPENSIFY_CARD_BANK_ACCOUNT, + SCREENS.WORKSPACE.EXPENSIFY_CARD_SETTINGS, + SCREENS.WORKSPACE.EXPENSIFY_CARD_SETTINGS_ACCOUNT, + SCREENS.WORKSPACE.EXPENSIFY_CARD_SETTINGS_FREQUENCY, SCREENS.WORKSPACE.EXPENSIFY_CARD_DETAILS, SCREENS.WORKSPACE.EXPENSIFY_CARD_NAME, ], diff --git a/src/libs/Navigation/linkingConfig/config.ts b/src/libs/Navigation/linkingConfig/config.ts index 4b4cc26f4254..e8f73361a8a4 100644 --- a/src/libs/Navigation/linkingConfig/config.ts +++ b/src/libs/Navigation/linkingConfig/config.ts @@ -472,6 +472,15 @@ const config: LinkingOptions['config'] = { [SCREENS.WORKSPACE.EXPENSIFY_CARD_BANK_ACCOUNT]: { path: ROUTES.WORKSPACE_EXPENSIFY_CARD_BANK_ACCOUNT.route, }, + [SCREENS.WORKSPACE.EXPENSIFY_CARD_SETTINGS]: { + path: ROUTES.WORKSPACE_EXPENSIFY_CARD_SETTINGS.route, + }, + [SCREENS.WORKSPACE.EXPENSIFY_CARD_SETTINGS_FREQUENCY]: { + path: ROUTES.WORKSPACE_EXPENSIFY_CARD_SETTINGS_FREQUENCY.route, + }, + [SCREENS.WORKSPACE.EXPENSIFY_CARD_SETTINGS_ACCOUNT]: { + path: ROUTES.WORKSPACE_EXPENSIFY_CARD_SETTINGS_ACCOUNT.route, + }, [SCREENS.WORKSPACE.EXPENSIFY_CARD_DETAILS]: { path: ROUTES.WORKSPACE_EXPENSIFY_CARD_DETAILS.route, }, diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts index bd314023ad4a..2c0c69eebd1f 100644 --- a/src/libs/Navigation/types.ts +++ b/src/libs/Navigation/types.ts @@ -663,6 +663,15 @@ type SettingsNavigatorParamList = { [SCREENS.WORKSPACE.EXPENSIFY_CARD_BANK_ACCOUNT]: { policyID: string; }; + [SCREENS.WORKSPACE.EXPENSIFY_CARD_SETTINGS]: { + policyID: string; + }; + [SCREENS.WORKSPACE.EXPENSIFY_CARD_SETTINGS_ACCOUNT]: { + policyID: string; + }; + [SCREENS.WORKSPACE.EXPENSIFY_CARD_SETTINGS_FREQUENCY]: { + policyID: string; + }; [SCREENS.WORKSPACE.EXPENSIFY_CARD_DETAILS]: { policyID: string; cardID: string; @@ -1082,9 +1091,6 @@ type FullScreenNavigatorParamList = { [SCREENS.WORKSPACE.WORKFLOWS]: { policyID: string; }; - [SCREENS.WORKSPACE.EXPENSIFY_CARD]: { - policyID: string; - }; [SCREENS.WORKSPACE.WORKFLOWS_APPROVER]: { policyID: string; }; diff --git a/src/libs/actions/Card.ts b/src/libs/actions/Card.ts index b23493c08e8e..a0c061324983 100644 --- a/src/libs/actions/Card.ts +++ b/src/libs/actions/Card.ts @@ -1,5 +1,6 @@ import Onyx from 'react-native-onyx'; import type {OnyxUpdate} from 'react-native-onyx'; +import type {ValueOf} from 'type-fest'; import * as API from '@libs/API'; import type {ActivatePhysicalExpensifyCardParams, ReportVirtualExpensifyCardFraudParams, RequestReplacementExpensifyCardParams, RevealExpensifyCardDetailsParams} from '@libs/API/parameters'; import {SIDE_EFFECT_REQUEST_COMMANDS, WRITE_COMMANDS} from '@libs/API/types'; @@ -196,6 +197,102 @@ function revealVirtualCardDetails(cardID: number): Promise }); } +function updateSettlementFrequency(policyID: string, frequency: ValueOf) { + // TODO: remove this code when the API is ready + if (frequency === CONST.EXPENSIFY_CARD.FREQUENCY_SETTING.DAILY) { + Onyx.merge(`${ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_EXPENSIFY_CARD_SETTINGS}${policyID}`, { + monthlySettlementDate: null, + }); + } else { + Onyx.merge(`${ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_EXPENSIFY_CARD_SETTINGS}${policyID}`, { + monthlySettlementDate: new Date(), + }); + } + + // TODO: uncomment this code when the API is ready + // const optimisticData: OnyxUpdate[] = [ + // { + // onyxMethod: Onyx.METHOD.MERGE, + // key: `${ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_EXPENSIFY_CARD_SETTINGS}${policyID}`, + // value: { + // monthlySettlementDate: '', + // }, + // }, + // ]; + // + // const successData: OnyxUpdate[] = [ + // { + // onyxMethod: Onyx.METHOD.MERGE, + // key: `${ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_EXPENSIFY_CARD_SETTINGS}${policyID}`, + // value: { + // monthlySettlementDate: '', + // }, + // }, + // ]; + // + // const failureData: OnyxUpdate[] = [ + // { + // onyxMethod: Onyx.METHOD.MERGE, + // key: `${ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_EXPENSIFY_CARD_SETTINGS}${policyID}`, + // value: { + // monthlySettlementDate: null, + // }, + // }, + // ]; + // + // const parameters = { + // workspaceAccountID: policyID, + // settlementFrequency: frequency, + // }; + // + // API.write(WRITE_COMMANDS.UPDATE_CARD_SETTLEMENT_FREQUENCY, parameters, {optimisticData, successData, failureData}); +} + +function updateSettlementAccount(policyID: string, accountID: number) { + // TODO: remove this code when the API is ready + Onyx.merge(`${ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_EXPENSIFY_CARD_SETTINGS}${policyID}`, { + paymentBankAccountID: accountID, + }); + + // TODO: uncomment this code when the API is ready + // const optimisticData: OnyxUpdate[] = [ + // { + // onyxMethod: Onyx.METHOD.MERGE, + // key: `${ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_EXPENSIFY_CARD_SETTINGS}${policyID}`, + // value: { + // paymentBankAccountID: accountID, + // }, + // }, + // ]; + // + // const successData: OnyxUpdate[] = [ + // { + // onyxMethod: Onyx.METHOD.MERGE, + // key: `${ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_EXPENSIFY_CARD_SETTINGS}${policyID}`, + // value: { + // paymentBankAccountID: accountID, + // }, + // }, + // ]; + // + // const failureData: OnyxUpdate[] = [ + // { + // onyxMethod: Onyx.METHOD.MERGE, + // key: `${ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_EXPENSIFY_CARD_SETTINGS}${policyID}`, + // value: { + // paymentBankAccountID: null, + // }, + // }, + // ]; + // + // const parameters = { + // workspaceAccountID: policyID, + // settlementBankAccountID: accountID, + // }; + // + // API.write(WRITE_COMMANDS.UPDATE_CARD_SETTLEMENT_ACCOUNT, parameters, {optimisticData, successData, failureData}); +} + function setIssueNewCardStepAndData({data, isEditing, step}: IssueNewCardFlowData) { Onyx.merge(ONYXKEYS.ISSUE_NEW_EXPENSIFY_CARD, {data, isEditing, currentStep: step}); } @@ -213,6 +310,8 @@ export { clearCardListErrors, reportVirtualExpensifyCardFraud, revealVirtualCardDetails, + updateSettlementFrequency, + updateSettlementAccount, setIssueNewCardStepAndData, clearIssueNewCardFlow, }; diff --git a/src/pages/workspace/accounting/reconciliation/CardReconciliationPage.tsx b/src/pages/workspace/accounting/reconciliation/CardReconciliationPage.tsx index f6304b7e439a..59ded237355c 100644 --- a/src/pages/workspace/accounting/reconciliation/CardReconciliationPage.tsx +++ b/src/pages/workspace/accounting/reconciliation/CardReconciliationPage.tsx @@ -28,6 +28,11 @@ function CardReconciliationPage({policy, route}: CardReconciliationPageProps) { const [reconciliationConnection] = useOnyx(`${ONYXKEYS.COLLECTION.SHARED_NVP_EXPENSIFY_CARD_CONTINUOUS_RECONCILIATION_CONNECTION}${policy?.id}`); const [isContinuousReconciliationOn] = useOnyx(`${ONYXKEYS.COLLECTION.SHARED_NVP_EXPENSIFY_CARD_USE_CONTINUOUS_RECONCILIATION}${policy?.id}`); + const [bankAccountList] = useOnyx(ONYXKEYS.BANK_ACCOUNT_LIST); + const [cardSettings] = useOnyx(`${ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_EXPENSIFY_CARD_SETTINGS}${policy?.id}`); + + const paymentBankAccountID = cardSettings?.paymentBankAccountID ?? -1; + const bankAccountTitle = bankAccountList?.[paymentBankAccountID]?.title ?? ''; const policyID = policy?.id ?? '-1'; const {connection} = route.params; @@ -99,7 +104,7 @@ function CardReconciliationPage({policy, route}: CardReconciliationPageProps) { {!!reconciliationConnection && ( diff --git a/src/pages/workspace/accounting/reconciliation/ReconciliationAccountSettingsPage.tsx b/src/pages/workspace/accounting/reconciliation/ReconciliationAccountSettingsPage.tsx index 7f0e45678471..7d3ab77230c9 100644 --- a/src/pages/workspace/accounting/reconciliation/ReconciliationAccountSettingsPage.tsx +++ b/src/pages/workspace/accounting/reconciliation/ReconciliationAccountSettingsPage.tsx @@ -23,9 +23,10 @@ function ReconciliationAccountSettingsPage({route}: ReconciliationAccountSetting const {translate} = useLocalize(); const [bankAccountList] = useOnyx(ONYXKEYS.BANK_ACCOUNT_LIST); - const [reconciliationConnection] = useOnyx(`${ONYXKEYS.COLLECTION.SHARED_NVP_EXPENSIFY_CARD_CONTINUOUS_RECONCILIATION_CONNECTION}${policyID}`); + const [cardSettings] = useOnyx(`${ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_EXPENSIFY_CARD_SETTINGS}${policyID}`); + const paymentBankAccountID = cardSettings?.paymentBankAccountID ?? ''; - const selectedBankAccount = useMemo(() => reconciliationConnection ?? Object.values(bankAccountList ?? {})[0], [reconciliationConnection, bankAccountList]); + const selectedBankAccount = useMemo(() => bankAccountList?.[paymentBankAccountID], [paymentBankAccountID, bankAccountList]); const sections = useMemo(() => { const data = Object.values(bankAccountList ?? {}).map((bankAccount) => ({ diff --git a/src/pages/workspace/expensifyCard/WorkspaceCardSettingsPage.tsx b/src/pages/workspace/expensifyCard/WorkspaceCardSettingsPage.tsx new file mode 100644 index 000000000000..399ff41d945b --- /dev/null +++ b/src/pages/workspace/expensifyCard/WorkspaceCardSettingsPage.tsx @@ -0,0 +1,93 @@ +import type {StackScreenProps} from '@react-navigation/stack'; +import React from 'react'; +import {View} from 'react-native'; +import {useOnyx} from 'react-native-onyx'; +import HeaderWithBackButton from '@components/HeaderWithBackButton'; +import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; +import OfflineWithFeedback from '@components/OfflineWithFeedback'; +import ScreenWrapper from '@components/ScreenWrapper'; +import ScrollView from '@components/ScrollView'; +import TextLink from '@components/TextLink'; +import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; +import {getLastFourDigits} from '@libs/BankAccountUtils'; +import Navigation from '@navigation/Navigation'; +import type {SettingsNavigatorParamList} from '@navigation/types'; +import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper'; +import CONST from '@src/CONST'; +import ONYXKEYS from '@src/ONYXKEYS'; +import ROUTES from '@src/ROUTES'; +import type SCREENS from '@src/SCREENS'; + +type WorkspaceCardSettingsPageProps = StackScreenProps; + +function WorkspaceCardSettingsPage({route}: WorkspaceCardSettingsPageProps) { + const styles = useThemeStyles(); + const {translate} = useLocalize(); + const policyID = route.params?.policyID; + + const [bankAccountList] = useOnyx(ONYXKEYS.BANK_ACCOUNT_LIST); + const [cardSettings] = useOnyx(`${ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_EXPENSIFY_CARD_SETTINGS}${policyID}`); + + const paymentBankAccountID = cardSettings?.paymentBankAccountID ?? ''; + // const isMonthlySettlementAllowed = cardSettings?.isMonthlySettlementAllowed ?? true; + const settlementFrequency = cardSettings?.monthlySettlementDate ? CONST.EXPENSIFY_CARD.FREQUENCY_SETTING.MONTHLY : CONST.EXPENSIFY_CARD.FREQUENCY_SETTING.DAILY; + // TODO: replace this line with the following line and uncomment the previous comment + const isSettlementFrequencyBlocked = settlementFrequency === CONST.EXPENSIFY_CARD.FREQUENCY_SETTING.DAILY; + // const isSettlementFrequencyBlocked = !isMonthlySettlementAllowed && settlementFrequency === CONST.EXPENSIFY_CARD.FREQUENCY_SETTING.DAILY; + const bankAccountNumber = bankAccountList?.[paymentBankAccountID]?.accountData?.accountNumber ?? ''; + + return ( + + + + + + + Navigation.navigate(ROUTES.WORKSPACE_EXPENSIFY_CARD_SETTINGS_ACCOUNT.getRoute(policyID))} + /> + + + Navigation.navigate(ROUTES.WORKSPACE_EXPENSIFY_CARD_SETTINGS_FREQUENCY.getRoute(policyID))} + hintText={ + isSettlementFrequencyBlocked ? ( + <> + {translate('workspace.expensifyCard.settlementFrequencyInfo')}{' '} + + {translate('common.learnMore')} + + + ) : undefined + } + /> + + + + + + ); +} + +WorkspaceCardSettingsPage.displayName = 'WorkspaceCardSettingsPage'; + +export default WorkspaceCardSettingsPage; diff --git a/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardBankAccounts.tsx b/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardBankAccounts.tsx index c13820910f8c..e1ca8974a0ee 100644 --- a/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardBankAccounts.tsx +++ b/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardBankAccounts.tsx @@ -10,6 +10,8 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; +import {getLastFourDigits} from '@libs/BankAccountUtils'; +import * as CardUtils from '@libs/CardUtils'; import Navigation from '@navigation/Navigation'; import type {SettingsNavigatorParamList} from '@navigation/types'; import ONYXKEYS from '@src/ONYXKEYS'; @@ -42,7 +44,7 @@ function WorkspaceExpensifyCardBankAccounts({route}: WorkspaceExpensifyCardBankA } // const eligibleBankAccounts = Object.values(bankAccountsList).filter((bankAccount) => bankAccount.accountData.allowDebit || bankAccount.accountData.type === CONST.BANK_ACCOUNT.TYPE.BUSINESS); - const eligibleBankAccounts = Object.values(bankAccountsList); + const eligibleBankAccounts = CardUtils.getEligibleBankAccountsForCard(bankAccountsList); return eligibleBankAccounts.map((bankAccount) => { const bankName = (bankAccount.accountData?.addressName ?? '') as BankName; @@ -53,7 +55,7 @@ function WorkspaceExpensifyCardBankAccounts({route}: WorkspaceExpensifyCardBankA return (