Merge pull request #89208 from Expensify/lucien/fix-thirdParty-connectionFlow

lakchote · web-flow · commit 442336b85b16 · 2026-05-05T10:04:57.000+02:00
Update 3rd Party Connection Flow
diff --git a/src/CONST/index.ts b/src/CONST/index.ts
@@ -4145,8 +4145,6 @@ const CONST = {
             AMEX_CUSTOM_FEED: 'AmexCustomFeed',
             SELECT_COUNTRY: 'SelectCountry',
             PLAID_CONNECTION: 'PlaidConnection',
-            SELECT_STATEMENT_CLOSE_DATE: 'SelectStatementCloseDate',
-            SELECT_DIRECT_STATEMENT_CLOSE_DATE: 'SelectDirectStatementCloseDate',
             IMPORT_FROM_FILE: 'ImportFromFile',
         },
         CARD_TYPE: {
diff --git a/src/hooks/useAssignCard.ts b/src/hooks/useAssignCard.ts
@@ -175,7 +175,7 @@ function useInitialAssignCardStep({policyID, selectedFeed}: UseInitialAssignCard
         // Refetch plaid card list
         if (!isFeedExpired && plaidAccessToken && !hasImportedPlaidAccounts.current) {
             const country = feedData?.country ?? '';
-            importPlaidAccounts('', selectedFeed, '', country, getDomainNameForPolicy(policyID), '', undefined, undefined, plaidAccessToken);
+            importPlaidAccounts('', selectedFeed, '', country, getDomainNameForPolicy(policyID), '', plaidAccessToken);
             hasImportedPlaidAccounts.current = true;
         }
 
diff --git a/src/hooks/useCardFeeds.tsx b/src/hooks/useCardFeeds.tsx
@@ -20,8 +20,10 @@ import useWorkspaceAccountID from './useWorkspaceAccountID';
  *     1. Combined workspace and domain card feeds specific to the given policyID (or `undefined` if unavailable).
  *     2. The result metadata from the Onyx collection fetch.
  *     3. Card feeds specific to the given policyID (or `undefined` if unavailable).
+ *     4. Card feed status by domain ID.
+ *     5. Workspace account ID for the policy.
  */
-const useCardFeeds = (policyID: string | undefined): [CombinedCardFeeds | undefined, ResultMetadata<OnyxCollection<CardFeeds>>, CardFeeds | undefined, CardFeedsStatusByDomainID] => {
+const useCardFeeds = (policyID: string | undefined): [CombinedCardFeeds | undefined, ResultMetadata<OnyxCollection<CardFeeds>>, CardFeeds | undefined, CardFeedsStatusByDomainID, number] => {
     const workspaceAccountID = useWorkspaceAccountID(policyID);
     const [allFeeds, allFeedsResult] = useOnyx(ONYXKEYS.COLLECTION.SHARED_NVP_PRIVATE_DOMAIN_MEMBER);
     const feedKeysWithCards = useFeedKeysWithAssignedCards();
@@ -61,7 +63,7 @@ const useCardFeeds = (policyID: string | undefined): [CombinedCardFeeds | undefi
 
     const workspaceCardFeedsStatus = getWorkspaceCardFeedsStatus(allFeeds);
 
-    return [workspaceFeeds, allFeedsResult, defaultFeed, workspaceCardFeedsStatus];
+    return [workspaceFeeds, allFeedsResult, defaultFeed, workspaceCardFeedsStatus, workspaceAccountID];
 };
 
 export default useCardFeeds;
diff --git a/src/hooks/useImportPlaidAccounts.ts b/src/hooks/useImportPlaidAccounts.ts
@@ -13,13 +13,11 @@ export default function useImportPlaidAccounts(policyID?: string) {
     const plaidFeedName = addNewCard?.data?.plaidConnectedFeedName ?? assignCard?.cardToAssign?.plaidConnectedFeedName;
     const plaidAccounts = addNewCard?.data?.plaidAccounts ?? assignCard?.cardToAssign?.plaidAccounts;
     const country = addNewCard?.data?.selectedCountry;
-    const statementPeriodEnd = addNewCard?.data?.statementPeriodEnd;
-    const statementPeriodEndDay = addNewCard?.data?.statementPeriodEndDay;
 
     return useCallback(() => {
         if (!policyID || !plaidToken || !plaidFeed || !plaidFeedName || !country || !plaidAccounts?.length) {
             return;
         }
-        importPlaidAccounts(plaidToken, plaidFeed, plaidFeedName, country, getDomainNameForPolicy(policyID), JSON.stringify(plaidAccounts), statementPeriodEnd, statementPeriodEndDay, '');
-    }, [statementPeriodEnd, statementPeriodEndDay, country, plaidAccounts, plaidFeed, plaidFeedName, plaidToken, policyID]);
+        importPlaidAccounts(plaidToken, plaidFeed, plaidFeedName, country, getDomainNameForPolicy(policyID), JSON.stringify(plaidAccounts), '');
+    }, [country, plaidAccounts, plaidFeed, plaidFeedName, plaidToken, policyID]);
 }
diff --git a/src/hooks/useIsBlockedToAddFeed.ts b/src/hooks/useIsBlockedToAddFeed.ts
@@ -19,7 +19,7 @@ import usePolicy from './usePolicy';
  */
 function useIsBlockedToAddFeed(policyID?: string) {
     const policy = usePolicy(policyID);
-    const [cardFeeds, allFeedsResult, defaultFeed] = useCardFeeds(policyID);
+    const [cardFeeds, allFeedsResult, defaultFeed, , workspaceAccountID] = useCardFeeds(policyID);
     const companyFeeds = getCompanyFeeds(cardFeeds, true);
     const isCollect = isCollectPolicy(policy);
     const isAllFeedsResultLoading = isLoadingOnyxValue(allFeedsResult);
@@ -39,6 +39,8 @@ function useIsBlockedToAddFeed(policyID?: string) {
     return {
         isBlockedToAddNewFeeds: isCollect && !isLoading && prevCompanyFeedsLength >= 1,
         isAllFeedsResultLoading: isCollect && (isLoading || isAllFeedsResultLoading),
+        cardFeeds,
+        workspaceAccountID,
     };
 }
 
diff --git a/src/libs/API/parameters/ImportPlaidAccountsParams.ts b/src/libs/API/parameters/ImportPlaidAccountsParams.ts
@@ -1,14 +1,10 @@
-import type {StatementPeriodEnd, StatementPeriodEndDay} from '@src/types/onyx/CardFeeds';
-
 type ImportPlaidAccountsParams = {
     publicToken: string;
     feed: string;
     feedName: string;
     country: string;
     domainName: string;
     plaidAccounts: string;
-    statementPeriodEnd?: StatementPeriodEnd;
-    statementPeriodEndDay?: StatementPeriodEndDay;
     plaidAccessToken?: string;
 };
 
diff --git a/src/libs/API/parameters/RequestFeedSetupParams.ts b/src/libs/API/parameters/RequestFeedSetupParams.ts
@@ -1,11 +1,7 @@
-import type {StatementPeriodEnd, StatementPeriodEndDay} from '@src/types/onyx/CardFeeds';
-
 type RequestFeedSetupParams = {
     policyID: string;
     feedDetails: string;
     feedType: string;
-    statementPeriodEnd?: StatementPeriodEnd;
-    statementPeriodEndDay?: StatementPeriodEndDay;
 };
 
 export default RequestFeedSetupParams;
diff --git a/src/libs/actions/CompanyCards.ts b/src/libs/actions/CompanyCards.ts
@@ -180,8 +180,6 @@ function addNewCompanyCardsFeed(
     cardFeed: CompanyCardFeed,
     feedDetails: CardFeedDetails,
     cardFeeds: OnyxEntry<CombinedCardFeeds>,
-    statementPeriodEnd: StatementPeriodEnd | undefined,
-    statementPeriodEndDay: StatementPeriodEndDay | undefined,
     lastSelectedFeed?: CompanyCardFeedWithDomainID,
 ) {
     if (!policyID) {
@@ -205,7 +203,6 @@ function addNewCompanyCardsFeed(
                 settings: {
                     companyCards: {
                         [feedType]: {
-                            statementPeriodEndDay: statementPeriodEndDay ?? statementPeriodEnd ?? null,
                             errors: null,
                         },
                     },
@@ -252,8 +249,6 @@ function addNewCompanyCardsFeed(
                   .map(([key, value]) => `${key}: ${value}`)
                   .join(', ')
             : '',
-        statementPeriodEnd,
-        statementPeriodEndDay,
     };
 
     API.write(WRITE_COMMANDS.REQUEST_FEED_SETUP, parameters, {optimisticData, failureData, finallyData});
diff --git a/src/libs/actions/Plaid.ts b/src/libs/actions/Plaid.ts
@@ -7,7 +7,7 @@ import {getCompanyCardFeed} from '@libs/CardUtils';
 import getPlaidLinkTokenParameters from '@libs/getPlaidLinkTokenParameters';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
-import type {CardFeedWithDomainID, CardFeedWithNumber, CompanyCardFeedWithDomainID, StatementPeriodEnd, StatementPeriodEndDay} from '@src/types/onyx/CardFeeds';
+import type {CardFeedWithDomainID, CardFeedWithNumber, CompanyCardFeedWithDomainID} from '@src/types/onyx/CardFeeds';
 
 /**
  * Gets the Plaid Link token used to initialize the Plaid SDK
@@ -147,8 +147,6 @@ function importPlaidAccounts(
     country: string,
     domainName: string,
     plaidAccounts: string,
-    statementPeriodEnd: StatementPeriodEnd | undefined,
-    statementPeriodEndDay: StatementPeriodEndDay | undefined,
     plaidAccessToken: string | undefined,
 ) {
     const parameters: ImportPlaidAccountsParams = {
@@ -158,8 +156,6 @@ function importPlaidAccounts(
         country,
         domainName,
         plaidAccounts,
-        statementPeriodEnd,
-        statementPeriodEndDay,
         plaidAccessToken,
     };
 
diff --git a/src/pages/workspace/companyCards/BankConnection/index.native.tsx b/src/pages/workspace/companyCards/BankConnection/index.native.tsx
@@ -143,15 +143,9 @@ function BankConnection({policyID: policyIDFromProps, feed, route, title}: BankC
                 updateSelectedFeed(newFeed, policyID);
             }
 
-            // Direct feeds (except those added via Plaid) are created with default statement period end date.
-            // Redirect the user to set a custom date.
-            if (policyID && !isPlaid) {
-                setAddNewCompanyCardStepAndData({
-                    step: CONST.COMPANY_CARDS.STEP.SELECT_DIRECT_STATEMENT_CLOSE_DATE,
-                });
-            } else {
-                Navigation.goBack(ROUTES.WORKSPACE_COMPANY_CARDS.getRoute(policyID));
-            }
+            Navigation.closeRHPFlow();
+            Navigation.navigate(ROUTES.WORKSPACE_COMPANY_CARDS.getRoute(policyID), {forceReplace: true});
+            return;
         }
         if (isPlaid) {
             onImportPlaidAccounts();
diff --git a/src/pages/workspace/companyCards/BankConnection/index.tsx b/src/pages/workspace/companyCards/BankConnection/index.tsx
@@ -156,16 +156,8 @@ function BankConnection({policyID: policyIDFromProps, feed, route, title}: BankC
                 updateSelectedFeed(newFeed, policyID);
             }
 
-            // Direct feeds (except those added via Plaid) are created with default statement period end date.
-            // Redirect the user to set a custom date.
-            if (policyID && !isPlaid) {
-                setAddNewCompanyCardStepAndData({
-                    step: CONST.COMPANY_CARDS.STEP.SELECT_DIRECT_STATEMENT_CLOSE_DATE,
-                });
-            } else {
-                Navigation.closeRHPFlow();
-                Navigation.navigate(ROUTES.WORKSPACE_COMPANY_CARDS.getRoute(policyID), {forceReplace: true});
-            }
+            Navigation.closeRHPFlow();
+            Navigation.navigate(ROUTES.WORKSPACE_COMPANY_CARDS.getRoute(policyID), {forceReplace: true});
             return;
         }
         if (!shouldBlockWindowOpen) {
diff --git a/src/pages/workspace/companyCards/addNew/AddNewCardPage.tsx b/src/pages/workspace/companyCards/addNew/AddNewCardPage.tsx
@@ -11,7 +11,6 @@ import useIsBlockedToAddFeed from '@hooks/useIsBlockedToAddFeed';
 import useLocalize from '@hooks/useLocalize';
 import useOnyx from '@hooks/useOnyx';
 import useThemeStyles from '@hooks/useThemeStyles';
-import useWorkspaceAccountID from '@hooks/useWorkspaceAccountID';
 import {navigateToConciergeChat} from '@libs/actions/Report';
 import type {SkeletonSpanReasonAttributes} from '@libs/telemetry/useSkeletonSpan';
 import Navigation from '@navigation/Navigation';
@@ -29,21 +28,18 @@ import CardInstructionsStep from './CardInstructionsStep';
 import CardNameStep from './CardNameStep';
 import CardTypeStep from './CardTypeStep';
 import DetailsStep from './DetailsStep';
-import DirectStatementCloseDateStep from './DirectStatementCloseDatePage';
 import ImportFromFileStep from './ImportFromFileStep';
 import PlaidConnectionStep from './PlaidConnectionStep';
 import SelectBankStep from './SelectBankStep';
 import SelectCountryStep from './SelectCountryStep';
 import SelectFeedType from './SelectFeedType';
-import StatementCloseDateStep from './StatementCloseDateStep';
 
 function AddNewCardPage({policy}: WithPolicyAndFullscreenLoadingProps) {
     const policyID = policy?.id;
     const styles = useThemeStyles();
-    const workspaceAccountID = useWorkspaceAccountID(policyID);
     const [addNewCardFeed, addNewCardFeedMetadata] = useOnyx(ONYXKEYS.ADD_NEW_COMPANY_CARD);
     const {currentStep} = addNewCardFeed ?? {};
-    const {isBlockedToAddNewFeeds, isAllFeedsResultLoading} = useIsBlockedToAddFeed(policyID);
+    const {isBlockedToAddNewFeeds, isAllFeedsResultLoading, cardFeeds, workspaceAccountID} = useIsBlockedToAddFeed(policyID);
     const [isModalVisible, setIsModalVisible] = useState(false);
     const {translate} = useLocalize();
     const [conciergeReportID] = useOnyx(ONYXKEYS.CONCIERGE_REPORT_ID);
@@ -121,24 +117,19 @@ function AddNewCardPage({policy}: WithPolicyAndFullscreenLoadingProps) {
             CurrentStep = <CardNameStep />;
             break;
         case CONST.COMPANY_CARDS.STEP.CARD_DETAILS:
-            CurrentStep = <DetailsStep />;
-            break;
-        case CONST.COMPANY_CARDS.STEP.AMEX_CUSTOM_FEED:
-            CurrentStep = <AmexCustomFeed />;
-            break;
-        case CONST.COMPANY_CARDS.STEP.PLAID_CONNECTION:
-            CurrentStep = <PlaidConnectionStep onExit={() => setIsModalVisible(true)} />;
-            break;
-        case CONST.COMPANY_CARDS.STEP.SELECT_STATEMENT_CLOSE_DATE:
             CurrentStep = (
-                <StatementCloseDateStep
+                <DetailsStep
                     policyID={policyID}
+                    cardFeeds={cardFeeds}
                     workspaceAccountID={workspaceAccountID}
                 />
             );
             break;
-        case CONST.COMPANY_CARDS.STEP.SELECT_DIRECT_STATEMENT_CLOSE_DATE:
-            CurrentStep = <DirectStatementCloseDateStep policyID={policyID} />;
+        case CONST.COMPANY_CARDS.STEP.AMEX_CUSTOM_FEED:
+            CurrentStep = <AmexCustomFeed />;
+            break;
+        case CONST.COMPANY_CARDS.STEP.PLAID_CONNECTION:
+            CurrentStep = <PlaidConnectionStep onExit={() => setIsModalVisible(true)} />;
             break;
         case CONST.COMPANY_CARDS.STEP.IMPORT_FROM_FILE:
             CurrentStep = <ImportFromFileStep />;
diff --git a/src/pages/workspace/companyCards/addNew/DetailsStep.tsx b/src/pages/workspace/companyCards/addNew/DetailsStep.tsx
@@ -10,43 +10,61 @@ import Text from '@components/Text';
 import TextInput from '@components/TextInput';
 import TextLink from '@components/TextLink';
 import useAutoFocusInput from '@hooks/useAutoFocusInput';
+import type {CombinedCardFeeds} from '@hooks/useCardFeeds';
 import {useMemoizedLazyExpensifyIcons} from '@hooks/useLazyAsset';
 import useLocalize from '@hooks/useLocalize';
 import useOnyx from '@hooks/useOnyx';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
+import {addNewCompanyCardsFeed} from '@libs/actions/CompanyCards';
+import {getBankName} from '@libs/CardUtils';
+import Navigation from '@libs/Navigation/Navigation';
 import {getFieldRequiredErrors} from '@libs/ValidationUtils';
 import variables from '@styles/variables';
 import {setAddNewCompanyCardStepAndData} from '@userActions/CompanyCards';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import ROUTES from '@src/ROUTES';
 import INPUT_IDS from '@src/types/form/AddNewCardFeedForm';
 
-function DetailsStep() {
+type DetailsStepProps = {
+    /** ID of the current policy */
+    policyID?: string;
+
+    /** Existing card feeds for the current policy */
+    cardFeeds?: CombinedCardFeeds;
+
+    /** Workspace account ID of the current policy */
+    workspaceAccountID: number;
+};
+
+function DetailsStep({policyID, cardFeeds, workspaceAccountID}: DetailsStepProps) {
     const {translate} = useLocalize();
     const theme = useTheme();
     const styles = useThemeStyles();
     const {inputCallbackRef} = useAutoFocusInput();
     const icons = useMemoizedLazyExpensifyIcons(['QuestionMark']);
 
     const [addNewCard] = useOnyx(ONYXKEYS.ADD_NEW_COMPANY_CARD);
+    const [lastSelectedFeed] = useOnyx(`${ONYXKEYS.COLLECTION.LAST_SELECTED_FEED}${policyID}`);
 
     const feedProvider = addNewCard?.data?.feedType;
     const isStripeFeedProvider = feedProvider === CONST.COMPANY_CARD.FEED_BANK_NAME.STRIPE;
     const bank = addNewCard?.data?.selectedBank;
     const isOtherBankSelected = bank === CONST.COMPANY_CARDS.BANKS.OTHER;
 
     const submit = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.ADD_NEW_CARD_FEED_FORM>) => {
-        if (!addNewCard?.data) {
+        if (!addNewCard?.data?.feedType) {
             return;
         }
 
         const feedDetails = {
             ...values,
-            bankName: addNewCard.data.bankName ?? 'Amex',
+            bankName: addNewCard.data.bankName ?? getBankName(addNewCard.data.feedType),
         };
 
-        setAddNewCompanyCardStepAndData({step: CONST.COMPANY_CARDS.STEP.SELECT_STATEMENT_CLOSE_DATE, data: {feedDetails}});
+        addNewCompanyCardsFeed(policyID, workspaceAccountID, addNewCard.data.feedType, feedDetails, cardFeeds, lastSelectedFeed);
+        Navigation.goBack(ROUTES.WORKSPACE_COMPANY_CARDS.getRoute(policyID));
     };
 
     const handleBackButtonPress = () => {
diff --git a/src/pages/workspace/companyCards/addNew/DirectStatementCloseDatePage.tsx b/src/pages/workspace/companyCards/addNew/DirectStatementCloseDatePage.tsx
diff --git a/src/pages/workspace/companyCards/addNew/PlaidConnectionStep.tsx b/src/pages/workspace/companyCards/addNew/PlaidConnectionStep.tsx
diff --git a/src/pages/workspace/companyCards/addNew/StatementCloseDateStep.tsx b/src/pages/workspace/companyCards/addNew/StatementCloseDateStep.tsx
diff --git a/src/types/onyx/CardFeeds.ts b/src/types/onyx/CardFeeds.ts

Original file line number	Diff line number	Diff line change
`@@ -175,7 +175,7 @@ function useInitialAssignCardStep({policyID, selectedFeed}: UseInitialAssignCard`
`175`	`175`	`// Refetch plaid card list`
`176`	`176`	`if (!isFeedExpired && plaidAccessToken && !hasImportedPlaidAccounts.current) {`
`177`	`177`	`const country = feedData?.country ?? '';`
`178`		`- importPlaidAccounts('', selectedFeed, '', country, getDomainNameForPolicy(policyID), '', undefined, undefined, plaidAccessToken);`
	`178`	`+ importPlaidAccounts('', selectedFeed, '', country, getDomainNameForPolicy(policyID), '', plaidAccessToken);`
`179`	`179`	`hasImportedPlaidAccounts.current = true;`
`180`	`180`	`}`
`181`	`181`