diff --git a/src/pages/workspace/accounting/PolicyAccountingPage.tsx b/src/pages/workspace/accounting/PolicyAccountingPage.tsx index 5586bad6f179..7aef46167d5d 100644 --- a/src/pages/workspace/accounting/PolicyAccountingPage.tsx +++ b/src/pages/workspace/accounting/PolicyAccountingPage.tsx @@ -62,6 +62,7 @@ type RouteParams = { function PolicyAccountingPage({policy}: PolicyAccountingPageProps) { const [connectionSyncProgress] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CONNECTION_SYNC_PROGRESS}${policy?.id}`); + const [cardSettings] = useOnyx(`${ONYXKEYS.COLLECTION.PRIVATE_EXPENSIFY_CARD_SETTINGS}${policy?.workspaceAccountID ?? -1}`); const theme = useTheme(); const styles = useThemeStyles(); const {translate, datetimeToRelative: getDatetimeToRelative} = useLocalize(); @@ -104,6 +105,7 @@ function PolicyAccountingPage({policy}: PolicyAccountingPageProps) { const currentXeroOrganization = findCurrentXeroOrganization(tenants, policy?.connections?.xero?.config?.tenantID); const shouldShowSynchronizationError = !!synchronizationError; const shouldShowReinstallConnectorMenuItem = shouldShowSynchronizationError && connectedIntegration === CONST.POLICY.CONNECTIONS.NAME.QBD; + const shouldShowCardReconciliationOption = policy?.areExpensifyCardsEnabled && cardSettings?.paymentBankAccountID; const overflowMenu: ThreeDotsMenuProps['menuItems'] = useMemo( () => [ @@ -306,14 +308,18 @@ function PolicyAccountingPage({policy}: PolicyAccountingPageProps) { brickRoadIndicator: areSettingsInErrorFields(integrationData?.subscribedExportSettings, integrationData?.errorFields) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined, pendingAction: settingsPendingAction(integrationData?.subscribedExportSettings, integrationData?.pendingFields), }, - { - icon: Expensicons.ExpensifyCard, - iconRight: Expensicons.ArrowRight, - shouldShowRightIcon: true, - title: translate('workspace.accounting.cardReconciliation'), - wrapperStyle: [styles.sectionMenuItemTopDescription], - onPress: integrationData?.onCardReconciliationPagePress, - }, + ...(shouldShowCardReconciliationOption + ? [ + { + icon: Expensicons.ExpensifyCard, + iconRight: Expensicons.ArrowRight, + shouldShowRightIcon: true, + title: translate('workspace.accounting.cardReconciliation'), + wrapperStyle: [styles.sectionMenuItemTopDescription], + onPress: integrationData?.onCardReconciliationPagePress, + }, + ] + : []), { icon: Expensicons.Gear, iconRight: Expensicons.ArrowRight, @@ -326,10 +332,6 @@ function PolicyAccountingPage({policy}: PolicyAccountingPageProps) { }, ]; - if (!policy?.areExpensifyCardsEnabled) { - configurationOptions.splice(2, 1); - } - return [ { ...iconProps, @@ -394,6 +396,7 @@ function PolicyAccountingPage({policy}: PolicyAccountingPageProps) { startIntegrationFlow, popoverAnchorRefs, canUseNetSuiteUSATax, + shouldShowCardReconciliationOption, ]); const otherIntegrationsItems = useMemo(() => { diff --git a/src/pages/workspace/accounting/reconciliation/CardReconciliationPage.tsx b/src/pages/workspace/accounting/reconciliation/CardReconciliationPage.tsx index 6dc6cd9ebcdb..4eaa300d8f8c 100644 --- a/src/pages/workspace/accounting/reconciliation/CardReconciliationPage.tsx +++ b/src/pages/workspace/accounting/reconciliation/CardReconciliationPage.tsx @@ -43,6 +43,7 @@ function CardReconciliationPage({policy, route}: CardReconciliationPageProps) { const {connection} = route.params; const connectionName = AccountingUtils.getConnectionNameFromRouteParam(connection) as ConnectionName; const autoSync = !!policy?.connections?.[connectionName]?.config?.autoSync?.enabled; + const shouldShow = policy?.areExpensifyCardsEnabled && cardSettings?.paymentBankAccountID; const toggleContinuousReconciliation = (value: boolean) => { Card.toggleContinuousReconciliation(workspaceAccountID, value, connectionName, currentConnectionName); @@ -75,6 +76,7 @@ function CardReconciliationPage({policy, route}: CardReconciliationPageProps) { policyID={policyID} accessVariants={[CONST.POLICY.ACCESS_VARIANTS.ADMIN, CONST.POLICY.ACCESS_VARIANTS.PAID]} featureName={CONST.POLICY.MORE_FEATURES.ARE_CONNECTIONS_ENABLED} + shouldBeBlocked={!shouldShow} >