Merge pull request Expensify#64131 from nyomanjyotisa/issue-63842

flodnv · web-flow · commit 18bd290dbce0 · 2025-07-29T11:02:47.000-04:00
diff --git a/src/ROUTES.ts b/src/ROUTES.ts
@@ -1393,11 +1393,11 @@ const ROUTES = {
     },
     WORKSPACE_ACCOUNTING_RECONCILIATION_ACCOUNT_SETTINGS: {
         route: 'workspaces/:policyID/accounting/:connection/card-reconciliation/account',
-        getRoute: (policyID: string | undefined, connection?: ValueOf<typeof CONST.POLICY.CONNECTIONS.ROUTE>) => {
+        getRoute: (policyID: string | undefined, connection?: ValueOf<typeof CONST.POLICY.CONNECTIONS.ROUTE>, backTo?: string) => {
             if (!policyID) {
                 Log.warn('Invalid policyID is used to build the WORKSPACE_ACCOUNTING_RECONCILIATION_ACCOUNT_SETTINGS route');
             }
-            return `workspaces/${policyID}/accounting/${connection as string}/card-reconciliation/account` as const;
+            return getUrlWithBackToParam(`workspaces/${policyID}/accounting/${connection as string}/card-reconciliation/account` as const, backTo);
         },
     },
     WORKSPACE_CATEGORIES: {
diff --git a/src/libs/actions/connections/index.ts b/src/libs/actions/connections/index.ts
@@ -14,7 +14,10 @@ import {isEmptyObject} from '@src/types/utils/EmptyObject';
 
 type ConnectionNameExceptNetSuite = Exclude<ConnectionName, typeof CONST.POLICY.CONNECTIONS.NAME.NETSUITE>;
 
-function removePolicyConnection(policyID: string, connectionName: PolicyConnectionName) {
+function removePolicyConnection(policy: Policy, connectionName: PolicyConnectionName) {
+    const policyID = policy.id;
+    const workspaceAccountID = policy?.workspaceAccountID ?? CONST.DEFAULT_NUMBER_ID;
+
     const optimisticData: OnyxUpdate[] = [
         {
             onyxMethod: Onyx.METHOD.MERGE,
@@ -30,13 +33,20 @@ function removePolicyConnection(policyID: string, connectionName: PolicyConnecti
             key: `${ONYXKEYS.COLLECTION.POLICY_CONNECTION_SYNC_PROGRESS}${policyID}`,
             value: null,
         },
+        {
+            onyxMethod: Onyx.METHOD.SET,
+            key: `${ONYXKEYS.COLLECTION.EXPENSIFY_CARD_CONTINUOUS_RECONCILIATION_CONNECTION}${workspaceAccountID}`,
+            value: null,
+        },
+        {
+            onyxMethod: Onyx.METHOD.SET,
+            key: `${ONYXKEYS.COLLECTION.EXPENSIFY_CARD_USE_CONTINUOUS_RECONCILIATION}${workspaceAccountID}`,
+            value: null,
+        },
     ];
 
     const successData: OnyxUpdate[] = [];
     const failureData: OnyxUpdate[] = [];
-    // This will be fixed as part of https://github.com/Expensify/Expensify/issues/507850
-    // eslint-disable-next-line deprecation/deprecation
-    const policy = PolicyUtils.getPolicy(policyID);
     const supportedConnections: PolicyConnectionName[] = [CONST.POLICY.CONNECTIONS.NAME.QBO, CONST.POLICY.CONNECTIONS.NAME.XERO];
 
     if (PolicyUtils.isCollectPolicy(policy) && supportedConnections.includes(connectionName)) {
diff --git a/src/pages/workspace/accounting/AccountingContext.tsx b/src/pages/workspace/accounting/AccountingContext.tsx
@@ -1,4 +1,4 @@
-import type {MutableRefObject, RefObject} from 'react';
+import type {RefObject} from 'react';
 import React, {useContext, useMemo, useRef, useState} from 'react';
 import type {View} from 'react-native';
 import type {OnyxEntry} from 'react-native-onyx';
@@ -30,15 +30,15 @@ type AccountingContextType = {
     /*
      * This stores refs to integration buttons, so the PopoverMenu can be positioned correctly
      */
-    popoverAnchorRefs: RefObject<Record<string, MutableRefObject<View | null>>>;
+    popoverAnchorRefs: RefObject<Record<string, RefObject<View | null>>>;
 };
 
 const popoverAnchorRefsInitialValue = Object.values(CONST.POLICY.CONNECTIONS.NAME).reduce(
     (acc, key) => {
         acc[key] = {current: null};
         return acc;
     },
-    {} as Record<ConnectionName, MutableRefObject<View | null>>,
+    {} as Record<ConnectionName, RefObject<View | null>>,
 );
 
 const defaultAccountingContext = {
@@ -56,7 +56,7 @@ type AccountingContextProviderProps = ChildrenProps & {
 };
 
 function AccountingContextProvider({children, policy}: AccountingContextProviderProps) {
-    const popoverAnchorRefs = useRef<Record<string, MutableRefObject<View | null>>>(defaultAccountingContext.popoverAnchorRefs.current);
+    const popoverAnchorRefs = useRef<Record<string, RefObject<View | null>>>(defaultAccountingContext.popoverAnchorRefs.current);
     const [activeIntegration, setActiveIntegration] = useState<ActiveIntegrationState>();
     const {translate} = useLocalize();
     const policyID = policy?.id;
@@ -139,7 +139,7 @@ function AccountingContextProvider({children, policy}: AccountingContextProvider
                         if (!policyID || !activeIntegration?.integrationToDisconnect) {
                             return;
                         }
-                        removePolicyConnection(policyID, activeIntegration?.integrationToDisconnect);
+                        removePolicyConnection(policy, activeIntegration?.integrationToDisconnect);
                         closeConfirmationModal();
                     }}
                     integrationToConnect={activeIntegration?.name}
diff --git a/src/pages/workspace/accounting/PolicyAccountingPage.tsx b/src/pages/workspace/accounting/PolicyAccountingPage.tsx
@@ -630,7 +630,7 @@ function PolicyAccountingPage({policy}: PolicyAccountingPageProps) {
                     isVisible={isDisconnectModalOpen}
                     onConfirm={() => {
                         if (connectedIntegration && policyID) {
-                            removePolicyConnection(policyID, connectedIntegration);
+                            removePolicyConnection(policy, connectedIntegration);
                         }
                         setIsDisconnectModalOpen(false);
                     }}
diff --git a/src/pages/workspace/accounting/reconciliation/CardReconciliationPage.tsx b/src/pages/workspace/accounting/reconciliation/CardReconciliationPage.tsx
@@ -1,4 +1,4 @@
-import React, {useCallback, useMemo} from 'react';
+import React, {useCallback, useEffect, useMemo} from 'react';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import ScreenWrapper from '@components/ScreenWrapper';
@@ -10,6 +10,7 @@ import useLocalize from '@hooks/useLocalize';
 import useOnyx from '@hooks/useOnyx';
 import useThemeStyles from '@hooks/useThemeStyles';
 import {getConnectionNameFromRouteParam} from '@libs/AccountingUtils';
+import {openPolicyAccountingPage} from '@libs/actions/PolicyConnections';
 import {isExpensifyCardFullySetUp} from '@libs/CardUtils';
 import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types';
 import Navigation from '@navigation/Navigation';
@@ -107,6 +108,20 @@ function CardReconciliationPage({policy, route}: CardReconciliationPageProps) {
         }
     }, [connection, policyID]);
 
+    const fetchPolicyAccountingData = useCallback(() => {
+        if (!policyID) {
+            return;
+        }
+        openPolicyAccountingPage(policyID);
+    }, [policyID]);
+
+    useEffect(() => {
+        if (isContinuousReconciliationOn !== undefined) {
+            return;
+        }
+        fetchPolicyAccountingData();
+    }, [isContinuousReconciliationOn, fetchPolicyAccountingData]);
+
     return (
         <AccessOrNotFoundWrapper
             policyID={policyID}
diff --git a/src/pages/workspace/accounting/reconciliation/ReconciliationAccountSettingsPage.tsx b/src/pages/workspace/accounting/reconciliation/ReconciliationAccountSettingsPage.tsx
@@ -1,4 +1,4 @@
-import React, {useMemo} from 'react';
+import React, {useCallback, useMemo} from 'react';
 import ConnectionLayout from '@components/ConnectionLayout';
 import SelectionList from '@components/SelectionList';
 import RadioListItem from '@components/SelectionList/RadioListItem';
@@ -19,22 +19,28 @@ import {updateSettlementAccount} from '@userActions/Card';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
+import type {Route} from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
 
 type ReconciliationAccountSettingsPageProps = PlatformStackScreenProps<SettingsNavigatorParamList, typeof SCREENS.WORKSPACE.ACCOUNTING.RECONCILIATION_ACCOUNT_SETTINGS>;
 
+type ReconciliationAccountSettingsPageRouteParams = {
+    backTo?: Route;
+};
+
 function ReconciliationAccountSettingsPage({route}: ReconciliationAccountSettingsPageProps) {
     const {policyID, connection} = route.params;
+    const {backTo} = route.params as ReconciliationAccountSettingsPageRouteParams;
 
     const styles = useThemeStyles();
     const {translate} = useLocalize();
 
     const connectionName = getConnectionNameFromRouteParam(connection);
     const defaultFundID = useDefaultFundID(policyID);
 
-    const [bankAccountList] = useOnyx(ONYXKEYS.BANK_ACCOUNT_LIST);
-    const [cardSettings] = useOnyx(`${ONYXKEYS.COLLECTION.PRIVATE_EXPENSIFY_CARD_SETTINGS}${defaultFundID}`);
+    const [bankAccountList] = useOnyx(ONYXKEYS.BANK_ACCOUNT_LIST, {canBeMissing: true});
+    const [cardSettings] = useOnyx(`${ONYXKEYS.COLLECTION.PRIVATE_EXPENSIFY_CARD_SETTINGS}${defaultFundID}`, {canBeMissing: true});
     const paymentBankAccountID = cardSettings?.paymentBankAccountID;
 
     const selectedBankAccount = useMemo(() => bankAccountList?.[paymentBankAccountID?.toString() ?? ''], [paymentBankAccountID, bankAccountList]);
@@ -58,9 +64,13 @@ function ReconciliationAccountSettingsPage({route}: ReconciliationAccountSetting
         return [{data}];
     }, [bankAccountList, paymentBankAccountID]);
 
+    const goBack = useCallback(() => {
+        Navigation.goBack(backTo ?? ROUTES.WORKSPACE_ACCOUNTING_CARD_RECONCILIATION.getRoute(policyID, connection));
+    }, [policyID, backTo, connection]);
+
     const selectBankAccount = (newBankAccountID?: number) => {
         updateSettlementAccount(domainName, defaultFundID, policyID, newBankAccountID, paymentBankAccountID);
-        Navigation.goBack(ROUTES.WORKSPACE_ACCOUNTING_CARD_RECONCILIATION.getRoute(policyID, connection));
+        goBack();
     };
 
     return (
@@ -73,7 +83,7 @@ function ReconciliationAccountSettingsPage({route}: ReconciliationAccountSetting
             contentContainerStyle={[styles.flex1, styles.pb2]}
             connectionName={connectionName}
             shouldUseScrollView={false}
-            onBackButtonPress={() => Navigation.goBack(ROUTES.WORKSPACE_ACCOUNTING_CARD_RECONCILIATION.getRoute(policyID, connection))}
+            onBackButtonPress={goBack}
         >
             <Text style={[styles.textNormal, styles.mb5, styles.ph5]}>{translate('workspace.accounting.chooseReconciliationAccount.chooseBankAccount')}</Text>
             <Text style={[styles.textNormal, styles.mb6, styles.ph5]}>
diff --git a/src/pages/workspace/expensifyCard/WorkspaceSettlementAccountPage.tsx b/src/pages/workspace/expensifyCard/WorkspaceSettlementAccountPage.tsx
@@ -1,4 +1,4 @@
-import React, {useMemo} from 'react';
+import React, {useCallback, useEffect, useMemo} from 'react';
 import {View} from 'react-native';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import Icon from '@components/Icon';
@@ -14,6 +14,7 @@ import useLocalize from '@hooks/useLocalize';
 import useOnyx from '@hooks/useOnyx';
 import useThemeStyles from '@hooks/useThemeStyles';
 import {getRouteParamForConnection} from '@libs/AccountingUtils';
+import {openPolicyAccountingPage} from '@libs/actions/PolicyConnections';
 import {getLastFourDigits} from '@libs/BankAccountUtils';
 import {getEligibleBankAccountsForCard} from '@libs/CardUtils';
 import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types';
@@ -38,6 +39,7 @@ function WorkspaceSettlementAccountPage({route}: WorkspaceSettlementAccountPageP
     const policyID = route.params?.policyID;
     const defaultFundID = useDefaultFundID(policyID);
 
+    const [policy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, {canBeMissing: true});
     const [bankAccountsList] = useOnyx(ONYXKEYS.BANK_ACCOUNT_LIST, {canBeMissing: true});
     const [cardSettings] = useOnyx(`${ONYXKEYS.COLLECTION.PRIVATE_EXPENSIFY_CARD_SETTINGS}${defaultFundID}`, {canBeMissing: true});
     const [isUsingContinuousReconciliation] = useOnyx(`${ONYXKEYS.COLLECTION.EXPENSIFY_CARD_USE_CONTINUOUS_RECONCILIATION}${defaultFundID}`, {canBeMissing: true});
@@ -55,6 +57,22 @@ function WorkspaceSettlementAccountPage({route}: WorkspaceSettlementAccountPageP
 
     const domainName = cardSettings?.domainName ?? getDomainNameForPolicy(policyID);
 
+    const hasActiveAccountingConnection = !!(policy?.connections && Object.keys(policy.connections).length > 0);
+
+    const fetchPolicyAccountingData = useCallback(() => {
+        if (!policyID) {
+            return;
+        }
+        openPolicyAccountingPage(policyID);
+    }, [policyID]);
+
+    useEffect(() => {
+        if (!cardSettings || !hasActiveAccountingConnection || isUsingContinuousReconciliation !== undefined || reconciliationConnection !== undefined) {
+            return;
+        }
+        fetchPolicyAccountingData();
+    }, [cardSettings, hasActiveAccountingConnection, isUsingContinuousReconciliation, reconciliationConnection, fetchPolicyAccountingData]);
+
     const data = useMemo(() => {
         const options = eligibleBankAccounts.map((bankAccount) => {
             const bankName = (bankAccount.accountData?.addressName ?? '') as BankName;
@@ -142,11 +160,11 @@ function WorkspaceSettlementAccountPage({route}: WorkspaceSettlementAccountPageP
                     listHeaderContent={
                         <>
                             <Text style={[styles.mh5, styles.mv4]}>{translate('workspace.expensifyCard.settlementAccountDescription')}</Text>
-                            {!!isUsingContinuousReconciliation && (
+                            {!!isUsingContinuousReconciliation && !!connectionParam && hasActiveAccountingConnection && (
                                 <View style={[styles.renderHTML, styles.mh5, styles.mb6]}>
                                     <RenderHTML
                                         html={translate('workspace.expensifyCard.settlementAccountInfo', {
-                                            reconciliationAccountSettingsLink: `${environmentURL}/${ROUTES.WORKSPACE_ACCOUNTING_RECONCILIATION_ACCOUNT_SETTINGS.getRoute(policyID, connectionParam)}`,
+                                            reconciliationAccountSettingsLink: `${environmentURL}/${ROUTES.WORKSPACE_ACCOUNTING_RECONCILIATION_ACCOUNT_SETTINGS.getRoute(policyID, connectionParam, Navigation.getActiveRoute())}`,
                                             accountNumber: `${CONST.MASKED_PAN_PREFIX}${getLastFourDigits(paymentBankAccountNumber)}`,
                                         })}
                                     />

Original file line number	Diff line number	Diff line change
`@@ -630,7 +630,7 @@ function PolicyAccountingPage({policy}: PolicyAccountingPageProps) {`
`630`	`630`	`isVisible={isDisconnectModalOpen}`
`631`	`631`	`onConfirm={() => {`
`632`	`632`	`if (connectedIntegration && policyID) {`
`633`		`- removePolicyConnection(policyID, connectedIntegration);`
	`633`	`+ removePolicyConnection(policy, connectedIntegration);`
`634`	`634`	`}`
`635`	`635`	`setIsDisconnectModalOpen(false);`
`636`	`636`	`}}`