From 6d25f1a88219a6dfdfb89857ddcac98a8d936b60 Mon Sep 17 00:00:00 2001
From: gijoe0295 <153004152+gijoe0295@users.noreply.github.com>
Date: Sun, 27 Jul 2025 00:37:52 +0700
Subject: [PATCH 1/5] do not allow updating card assignee from members page

---
 src/CONST/index.ts                            |  1 +
 .../WorkspaceExpensifyCardBankAccounts.tsx    |  3 +-
 .../WorkspaceExpensifyCardListPage.tsx        |  2 +
 .../expensifyCard/issueNew/AssigneeStep.tsx   | 12 ++++--
 .../expensifyCard/issueNew/CardNameStep.tsx   | 12 ++++--
 .../expensifyCard/issueNew/CardTypeStep.tsx   | 20 ++++++++--
 .../issueNew/ConfirmationStep.tsx             | 15 ++++++--
 .../issueNew/IssueNewCardPage.tsx             | 38 +++++++++++++++----
 .../expensifyCard/issueNew/LimitStep.tsx      | 12 ++++--
 .../expensifyCard/issueNew/LimitTypeStep.tsx  | 12 ++++--
 .../members/WorkspaceMemberDetailsPage.tsx    |  1 +
 .../members/WorkspaceMemberNewCardPage.tsx    |  1 +
 src/types/onyx/Card.ts                        |  3 ++
 13 files changed, 104 insertions(+), 28 deletions(-)

diff --git a/src/CONST/index.ts b/src/CONST/index.ts
index a2029dd35303..2e755a6ef0dd 100755
--- a/src/CONST/index.ts
+++ b/src/CONST/index.ts
@@ -3172,6 +3172,7 @@ const CONST = {
         },
         LIMIT_VALUE: 21474836,
         STEP_NAMES: ['1', '2', '3', '4', '5', '6'],
+        ASSIGNEE_EXCLUDED_STEP_NAMES: ['1', '2', '3', '4', '5'],
         STEP: {
             ASSIGNEE: 'Assignee',
             CARD_TYPE: 'CardType',
diff --git a/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardBankAccounts.tsx b/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardBankAccounts.tsx
index 6e912362cd4a..270c3b959ab8 100644
--- a/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardBankAccounts.tsx
+++ b/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardBankAccounts.tsx
@@ -25,7 +25,7 @@ import Navigation from '@navigation/Navigation';
 import type {SettingsNavigatorParamList} from '@navigation/types';
 import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper';
 import variables from '@styles/variables';
-import {configureExpensifyCardsForPolicy} from '@userActions/Card';
+import {configureExpensifyCardsForPolicy, setIssueNewCardStepAndData} from '@userActions/Card';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
@@ -161,6 +161,7 @@ function WorkspaceExpensifyCardBankAccounts({route}: WorkspaceExpensifyCardBankA
                             pressOnEnter
                             onPress={() => {
                                 Navigation.dismissModal();
+                                setIssueNewCardStepAndData({policyID, data: {isFromWorkspaceMembersPage: false}});
                                 Navigation.navigate(ROUTES.WORKSPACE_EXPENSIFY_CARD_ISSUE_NEW.getRoute(policyID));
                             }}
                         />
diff --git a/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardListPage.tsx b/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardListPage.tsx
index 5c9709059bb9..b032f92c6f2e 100644
--- a/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardListPage.tsx
+++ b/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardListPage.tsx
@@ -28,6 +28,7 @@ import useResponsiveLayout from '@hooks/useResponsiveLayout';
 import useSearchResults from '@hooks/useSearchResults';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
+import {setIssueNewCardStepAndData} from '@libs/actions/Card';
 import {clearDeletePaymentMethodError} from '@libs/actions/PaymentMethods';
 import {filterCardsByPersonalDetails, getCardsByCardholderName, sortCardsByCardholderName} from '@libs/CardUtils';
 import type {PlatformStackRouteProp} from '@libs/Navigation/PlatformStackNavigation/types';
@@ -102,6 +103,7 @@ function WorkspaceExpensifyCardListPage({route, cardsList, fundID}: WorkspaceExp
             return;
         }
         const activeRoute = Navigation.getActiveRoute();
+        setIssueNewCardStepAndData({policyID, data: {isFromWorkspaceMembersPage: false}});
         Navigation.navigate(ROUTES.WORKSPACE_EXPENSIFY_CARD_ISSUE_NEW.getRoute(policyID, activeRoute));
     };
 
diff --git a/src/pages/workspace/expensifyCard/issueNew/AssigneeStep.tsx b/src/pages/workspace/expensifyCard/issueNew/AssigneeStep.tsx
index 701ce3221995..864ac179c2d3 100644
--- a/src/pages/workspace/expensifyCard/issueNew/AssigneeStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/AssigneeStep.tsx
@@ -27,9 +27,15 @@ const MINIMUM_MEMBER_TO_SHOW_SEARCH = 8;
 type AssigneeStepProps = {
     // The policy that the card will be issued under
     policy: OnyxEntry<OnyxTypes.Policy>;
+
+    /** Array of step names */
+    stepNames?: readonly string[];
+
+    /** Start from step index */
+    startFrom?: number;
 };
 
-function AssigneeStep({policy}: AssigneeStepProps) {
+function AssigneeStep({policy, stepNames, startFrom}: AssigneeStepProps) {
     const {translate, formatPhoneNumber} = useLocalize();
     const styles = useThemeStyles();
     const {isOffline} = useNetwork();
@@ -139,8 +145,8 @@ function AssigneeStep({policy}: AssigneeStepProps) {
             shouldEnableMaxHeight
             headerTitle={translate('workspace.card.issueCard')}
             handleBackButtonPress={handleBackButtonPress}
-            startStepIndex={0}
-            stepNames={CONST.EXPENSIFY_CARD.STEP_NAMES}
+            startStepIndex={startFrom}
+            stepNames={stepNames}
             enableEdgeToEdgeBottomSafeAreaPadding
         >
             <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mv3]}>{translate('workspace.card.issueNewCard.whoNeedsCard')}</Text>
diff --git a/src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx b/src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx
index 3cc992b129ab..d3ec4fa7d4bb 100644
--- a/src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx
@@ -21,9 +21,15 @@ import INPUT_IDS from '@src/types/form/IssueNewExpensifyCardForm';
 type CardNameStepProps = {
     /** ID of the policy */
     policyID: string | undefined;
+
+    /** Array of step names */
+    stepNames?: readonly string[];
+
+    /** Start from step index */
+    startFrom?: number;
 };
 
-function CardNameStep({policyID}: CardNameStepProps) {
+function CardNameStep({policyID, stepNames, startFrom}: CardNameStepProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const {inputCallbackRef} = useAutoFocusInput();
@@ -73,8 +79,8 @@ function CardNameStep({policyID}: CardNameStepProps) {
             shouldEnableMaxHeight
             headerTitle={translate('workspace.card.issueCard')}
             handleBackButtonPress={handleBackButtonPress}
-            startStepIndex={4}
-            stepNames={CONST.EXPENSIFY_CARD.STEP_NAMES}
+            startStepIndex={startFrom}
+            stepNames={stepNames}
             enableEdgeToEdgeBottomSafeAreaPadding
         >
             <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mv3]}>{translate('workspace.card.issueNewCard.giveItName')}</Text>
diff --git a/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx b/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
index 8d53ddb21846..29e4b9cb7e62 100644
--- a/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
@@ -8,17 +8,24 @@ import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
 import useOnyx from '@hooks/useOnyx';
 import useThemeStyles from '@hooks/useThemeStyles';
-import {setIssueNewCardStepAndData} from '@libs/actions/Card';
+import {clearIssueNewCardFlow, setIssueNewCardStepAndData} from '@libs/actions/Card';
 import variables from '@styles/variables';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import Navigation from '@libs/Navigation/Navigation';
 
 type CardTypeStepProps = {
     /** ID of the policy */
     policyID: string | undefined;
+
+    /** Array of step names */
+    stepNames?: readonly string[];
+
+    /** Start from step index */
+    startFrom?: number;
 };
 
-function CardTypeStep({policyID}: CardTypeStepProps) {
+function CardTypeStep({policyID, stepNames, startFrom}: CardTypeStepProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const [issueNewCard] = useOnyx(`${ONYXKEYS.COLLECTION.ISSUE_NEW_EXPENSIFY_CARD}${policyID}`);
@@ -41,6 +48,11 @@ function CardTypeStep({policyID}: CardTypeStepProps) {
             setIssueNewCardStepAndData({step: CONST.EXPENSIFY_CARD.STEP.CONFIRMATION, isEditing: false, policyID});
             return;
         }
+        if (issueNewCard?.data?.isFromWorkspaceMembersPage === true) {
+            Navigation.goBack();
+            clearIssueNewCardFlow(policyID);
+            return;
+        }
         setIssueNewCardStepAndData({step: CONST.EXPENSIFY_CARD.STEP.ASSIGNEE, policyID});
     };
 
@@ -52,8 +64,8 @@ function CardTypeStep({policyID}: CardTypeStepProps) {
             offlineIndicatorStyle={styles.mtAuto}
             headerTitle={translate('workspace.card.issueCard')}
             handleBackButtonPress={handleBackButtonPress}
-            startStepIndex={1}
-            stepNames={CONST.EXPENSIFY_CARD.STEP_NAMES}
+            startStepIndex={startFrom}
+            stepNames={stepNames}
             enableEdgeToEdgeBottomSafeAreaPadding
         >
             <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mv3]}>{translate('workspace.card.issueNewCard.chooseCardType')}</Text>
diff --git a/src/pages/workspace/expensifyCard/issueNew/ConfirmationStep.tsx b/src/pages/workspace/expensifyCard/issueNew/ConfirmationStep.tsx
index 37768790ccde..babd66b93352 100644
--- a/src/pages/workspace/expensifyCard/issueNew/ConfirmationStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/ConfirmationStep.tsx
@@ -31,9 +31,15 @@ type ConfirmationStepProps = {
 
     /** Route to navigate to */
     backTo?: Route;
+
+    /** Array of step names */
+    stepNames?: readonly string[];
+
+    /** Start from step index */
+    startFrom?: number;
 };
 
-function ConfirmationStep({policyID, backTo}: ConfirmationStepProps) {
+function ConfirmationStep({policyID, backTo, stepNames, startFrom}: ConfirmationStepProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const {isOffline} = useNetwork();
@@ -90,8 +96,8 @@ function ConfirmationStep({policyID, backTo}: ConfirmationStepProps) {
             shouldEnableMaxHeight
             headerTitle={translate('workspace.card.issueCard')}
             handleBackButtonPress={handleBackButtonPress}
-            startStepIndex={5}
-            stepNames={CONST.EXPENSIFY_CARD.STEP_NAMES}
+            startStepIndex={startFrom}
+            stepNames={stepNames}
             enableEdgeToEdgeBottomSafeAreaPadding
         >
             <ScrollView
@@ -104,7 +110,8 @@ function ConfirmationStep({policyID, backTo}: ConfirmationStepProps) {
                 <MenuItemWithTopDescription
                     description={translate('workspace.card.issueNewCard.cardholder')}
                     title={getUserNameByEmail(data?.assigneeEmail ?? '', 'displayName')}
-                    shouldShowRightIcon
+                    shouldShowRightIcon={!data?.isFromWorkspaceMembersPage}
+                    interactive={!data?.isFromWorkspaceMembersPage}
                     onPress={() => editStep(CONST.EXPENSIFY_CARD.STEP.ASSIGNEE)}
                 />
                 <MenuItemWithTopDescription
diff --git a/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx b/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx
index aa2a58226875..655cfb7fa1cf 100644
--- a/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx
@@ -1,4 +1,5 @@
-import React, {useEffect} from 'react';
+import React, {useEffect, useMemo} from 'react';
+import type { OnyxEntry } from 'react-native-onyx';
 import DelegateNoAccessWrapper from '@components/DelegateNoAccessWrapper';
 import ScreenWrapper from '@components/ScreenWrapper';
 import useInitial from '@hooks/useInitial';
@@ -13,6 +14,7 @@ import withPolicyAndFullscreenLoading from '@pages/workspace/withPolicyAndFullsc
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type SCREENS from '@src/SCREENS';
+import type {IssueNewCard, IssueNewCardStep} from '@src/types/onyx/Card';
 import AssigneeStep from './AssigneeStep';
 import CardNameStep from './CardNameStep';
 import CardTypeStep from './CardTypeStep';
@@ -22,6 +24,24 @@ import LimitTypeStep from './LimitTypeStep';
 
 type IssueNewCardPageProps = WithPolicyAndFullscreenLoadingProps & PlatformStackScreenProps<SettingsNavigatorParamList, typeof SCREENS.WORKSPACE.EXPENSIFY_CARD_ISSUE_NEW>;
 
+function getStartStepIndex(issueNewCard: OnyxEntry<IssueNewCard>): number {
+    if (!issueNewCard) {
+        return 0;
+    }
+
+    const STEP_INDEXES: Record<IssueNewCardStep, number> = {
+        [CONST.EXPENSIFY_CARD.STEP.ASSIGNEE]: 0,
+        [CONST.EXPENSIFY_CARD.STEP.CARD_TYPE]: 1,
+        [CONST.EXPENSIFY_CARD.STEP.LIMIT_TYPE]: 2,
+        [CONST.EXPENSIFY_CARD.STEP.LIMIT]: 3,
+        [CONST.EXPENSIFY_CARD.STEP.CARD_NAME]: 4,
+        [CONST.EXPENSIFY_CARD.STEP.CONFIRMATION]: 5,
+    };
+
+    const stepIndex = STEP_INDEXES[issueNewCard.currentStep];
+    return issueNewCard.data?.isFromWorkspaceMembersPage ? stepIndex - 1 : stepIndex;
+}
+
 function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
     const policyID = policy?.id;
     const [issueNewCard] = useOnyx(`${ONYXKEYS.COLLECTION.ISSUE_NEW_EXPENSIFY_CARD}${policyID}`, {canBeMissing: true});
@@ -30,6 +50,8 @@ function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
     const firstAssigneeEmail = useInitial(issueNewCard?.data?.assigneeEmail);
     const shouldUseBackToParam = !firstAssigneeEmail || firstAssigneeEmail === issueNewCard?.data?.assigneeEmail;
     const [isActingAsDelegate] = useOnyx(ONYXKEYS.ACCOUNT, {selector: (account) => !!account?.delegatedAccess?.delegate, canBeMissing: true});
+    const stepNames = issueNewCard?.data?.isFromWorkspaceMembersPage ? CONST.EXPENSIFY_CARD.ASSIGNEE_EXCLUDED_STEP_NAMES : CONST.EXPENSIFY_CARD.STEP_NAMES;
+    const startFrom = useMemo(() => getStartStepIndex(issueNewCard), [issueNewCard]);
 
     useEffect(() => {
         startIssueNewCardFlow(policyID);
@@ -38,24 +60,26 @@ function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
     const getCurrentStep = () => {
         switch (currentStep) {
             case CONST.EXPENSIFY_CARD.STEP.ASSIGNEE:
-                return <AssigneeStep policy={policy} />;
+                return <AssigneeStep policy={policy} stepNames={stepNames} startFrom={startFrom} />;
             case CONST.EXPENSIFY_CARD.STEP.CARD_TYPE:
-                return <CardTypeStep policyID={policyID} />;
+                return <CardTypeStep policyID={policyID} stepNames={stepNames} startFrom={startFrom} />;
             case CONST.EXPENSIFY_CARD.STEP.LIMIT_TYPE:
-                return <LimitTypeStep policy={policy} />;
+                return <LimitTypeStep policy={policy} stepNames={stepNames} startFrom={startFrom} />;
             case CONST.EXPENSIFY_CARD.STEP.LIMIT:
-                return <LimitStep policyID={policyID} />;
+                return <LimitStep policyID={policyID} stepNames={stepNames} startFrom={startFrom} />;
             case CONST.EXPENSIFY_CARD.STEP.CARD_NAME:
-                return <CardNameStep policyID={policyID} />;
+                return <CardNameStep policyID={policyID} stepNames={stepNames} startFrom={startFrom} />;
             case CONST.EXPENSIFY_CARD.STEP.CONFIRMATION:
                 return (
                     <ConfirmationStep
                         policyID={policyID}
                         backTo={shouldUseBackToParam ? backTo : undefined}
+                        stepNames={stepNames}
+                        startFrom={startFrom}
                     />
                 );
             default:
-                return <AssigneeStep policy={policy} />;
+                return <AssigneeStep policy={policy} stepNames={stepNames} startFrom={startFrom} />;
         }
     };
 
diff --git a/src/pages/workspace/expensifyCard/issueNew/LimitStep.tsx b/src/pages/workspace/expensifyCard/issueNew/LimitStep.tsx
index 59d1386fa3a5..82a69868571c 100644
--- a/src/pages/workspace/expensifyCard/issueNew/LimitStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/LimitStep.tsx
@@ -19,9 +19,15 @@ import INPUT_IDS from '@src/types/form/IssueNewExpensifyCardForm';
 type LimitStepProps = {
     /** ID of the policy */
     policyID: string | undefined;
+
+    /** Array of step names */
+    stepNames?: readonly string[];
+
+    /** Start from step index */
+    startFrom?: number;
 };
 
-function LimitStep({policyID}: LimitStepProps) {
+function LimitStep({policyID, stepNames, startFrom}: LimitStepProps) {
     const {translate} = useLocalize();
     const {inputCallbackRef} = useAutoFocusInput();
     const styles = useThemeStyles();
@@ -75,8 +81,8 @@ function LimitStep({policyID}: LimitStepProps) {
             shouldEnableMaxHeight
             headerTitle={translate('workspace.card.issueCard')}
             handleBackButtonPress={handleBackButtonPress}
-            startStepIndex={3}
-            stepNames={CONST.EXPENSIFY_CARD.STEP_NAMES}
+            startStepIndex={startFrom}
+            stepNames={stepNames}
             enableEdgeToEdgeBottomSafeAreaPadding
         >
             <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mv3]}>{translate('workspace.card.issueNewCard.setLimit')}</Text>
diff --git a/src/pages/workspace/expensifyCard/issueNew/LimitTypeStep.tsx b/src/pages/workspace/expensifyCard/issueNew/LimitTypeStep.tsx
index 67e13e0090ab..bcb6d350d8a0 100644
--- a/src/pages/workspace/expensifyCard/issueNew/LimitTypeStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/LimitTypeStep.tsx
@@ -17,9 +17,15 @@ import type * as OnyxTypes from '@src/types/onyx';
 type LimitTypeStepProps = {
     // The policy that the card will be issued under
     policy: OnyxEntry<OnyxTypes.Policy>;
+
+    /** Start from step index */
+    startFrom?: number;
+
+    /** Array of step names */
+    stepNames?: readonly string[];
 };
 
-function LimitTypeStep({policy}: LimitTypeStepProps) {
+function LimitTypeStep({policy, stepNames, startFrom}: LimitTypeStepProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const policyID = policy?.id;
@@ -89,8 +95,8 @@ function LimitTypeStep({policy}: LimitTypeStepProps) {
             shouldEnableMaxHeight
             headerTitle={translate('workspace.card.issueCard')}
             handleBackButtonPress={handleBackButtonPress}
-            startStepIndex={2}
-            stepNames={CONST.EXPENSIFY_CARD.STEP_NAMES}
+            startStepIndex={startFrom}
+            stepNames={stepNames}
             enableEdgeToEdgeBottomSafeAreaPadding
         >
             <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mv3]}>{translate('workspace.card.issueNewCard.chooseLimitType')}</Text>
diff --git a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx
index 7414b74c9c34..0c0404f37cfc 100644
--- a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx
+++ b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx
@@ -249,6 +249,7 @@ function WorkspaceMemberDetailsPage({personalDetails, policy, route}: WorkspaceM
             step: CONST.EXPENSIFY_CARD.STEP.CARD_TYPE,
             data: {
                 assigneeEmail: memberLogin,
+                isFromWorkspaceMembersPage: true,
             },
             isEditing: false,
             policyID,
diff --git a/src/pages/workspace/members/WorkspaceMemberNewCardPage.tsx b/src/pages/workspace/members/WorkspaceMemberNewCardPage.tsx
index ffff569fd4f7..96ed586efb84 100644
--- a/src/pages/workspace/members/WorkspaceMemberNewCardPage.tsx
+++ b/src/pages/workspace/members/WorkspaceMemberNewCardPage.tsx
@@ -88,6 +88,7 @@ function WorkspaceMemberNewCardPage({route, personalDetails}: WorkspaceMemberNew
                 step: CONST.EXPENSIFY_CARD.STEP.CARD_TYPE,
                 data: {
                     assigneeEmail: memberLogin,
+                    isFromWorkspaceMembersPage: true,
                 },
                 isEditing: false,
                 policyID,
diff --git a/src/types/onyx/Card.ts b/src/types/onyx/Card.ts
index 1ddcd51a9f68..124708efb828 100644
--- a/src/types/onyx/Card.ts
+++ b/src/types/onyx/Card.ts
@@ -223,6 +223,9 @@ type IssueNewCardData = {
 
     /** Name of the card */
     cardTitle: string;
+
+    /** Whether the flow is triggered from workspace members page */
+    isFromWorkspaceMembersPage: boolean;
 };
 
 /** Model of Issue new card flow */

From f522e9adcaea397139ec2310c1d27f2eec775e03 Mon Sep 17 00:00:00 2001
From: gijoe0295 <153004152+gijoe0295@users.noreply.github.com>
Date: Sun, 27 Jul 2025 00:43:56 +0700
Subject: [PATCH 2/5] fix canBeMissing lint

---
 src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx  | 2 +-
 src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx  | 2 +-
 src/pages/workspace/expensifyCard/issueNew/LimitStep.tsx     | 2 +-
 src/pages/workspace/expensifyCard/issueNew/LimitTypeStep.tsx | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx b/src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx
index d3ec4fa7d4bb..eb6f4f99d020 100644
--- a/src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx
@@ -33,7 +33,7 @@ function CardNameStep({policyID, stepNames, startFrom}: CardNameStepProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const {inputCallbackRef} = useAutoFocusInput();
-    const [issueNewCard] = useOnyx(`${ONYXKEYS.COLLECTION.ISSUE_NEW_EXPENSIFY_CARD}${policyID}`);
+    const [issueNewCard] = useOnyx(`${ONYXKEYS.COLLECTION.ISSUE_NEW_EXPENSIFY_CARD}${policyID}`, {canBeMissing: true});
 
     const isEditing = issueNewCard?.isEditing;
     const data = issueNewCard?.data;
diff --git a/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx b/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
index 29e4b9cb7e62..402e9c585f47 100644
--- a/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
@@ -28,7 +28,7 @@ type CardTypeStepProps = {
 function CardTypeStep({policyID, stepNames, startFrom}: CardTypeStepProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
-    const [issueNewCard] = useOnyx(`${ONYXKEYS.COLLECTION.ISSUE_NEW_EXPENSIFY_CARD}${policyID}`);
+    const [issueNewCard] = useOnyx(`${ONYXKEYS.COLLECTION.ISSUE_NEW_EXPENSIFY_CARD}${policyID}`, {canBeMissing: true});
 
     const isEditing = issueNewCard?.isEditing;
 
diff --git a/src/pages/workspace/expensifyCard/issueNew/LimitStep.tsx b/src/pages/workspace/expensifyCard/issueNew/LimitStep.tsx
index 82a69868571c..99dee660fa9e 100644
--- a/src/pages/workspace/expensifyCard/issueNew/LimitStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/LimitStep.tsx
@@ -31,7 +31,7 @@ function LimitStep({policyID, stepNames, startFrom}: LimitStepProps) {
     const {translate} = useLocalize();
     const {inputCallbackRef} = useAutoFocusInput();
     const styles = useThemeStyles();
-    const [issueNewCard] = useOnyx(`${ONYXKEYS.COLLECTION.ISSUE_NEW_EXPENSIFY_CARD}${policyID}`);
+    const [issueNewCard] = useOnyx(`${ONYXKEYS.COLLECTION.ISSUE_NEW_EXPENSIFY_CARD}${policyID}`, {canBeMissing: true});
     const isEditing = issueNewCard?.isEditing;
 
     const submit = useCallback(
diff --git a/src/pages/workspace/expensifyCard/issueNew/LimitTypeStep.tsx b/src/pages/workspace/expensifyCard/issueNew/LimitTypeStep.tsx
index bcb6d350d8a0..f6211917e41c 100644
--- a/src/pages/workspace/expensifyCard/issueNew/LimitTypeStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/LimitTypeStep.tsx
@@ -29,7 +29,7 @@ function LimitTypeStep({policy, stepNames, startFrom}: LimitTypeStepProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const policyID = policy?.id;
-    const [issueNewCard] = useOnyx(`${ONYXKEYS.COLLECTION.ISSUE_NEW_EXPENSIFY_CARD}${policyID}`);
+    const [issueNewCard] = useOnyx(`${ONYXKEYS.COLLECTION.ISSUE_NEW_EXPENSIFY_CARD}${policyID}`, {canBeMissing: true});
 
     const areApprovalsConfigured = getApprovalWorkflow(policy) !== CONST.POLICY.APPROVAL_MODE.OPTIONAL;
     const defaultType = areApprovalsConfigured ? CONST.EXPENSIFY_CARD.LIMIT_TYPES.SMART : CONST.EXPENSIFY_CARD.LIMIT_TYPES.MONTHLY;

From 897ba6e5ad8f1ed04017c24729587875fee831f5 Mon Sep 17 00:00:00 2001
From: gijoe0295 <153004152+gijoe0295@users.noreply.github.com>
Date: Sun, 27 Jul 2025 00:45:20 +0700
Subject: [PATCH 3/5] prettier

---
 .../expensifyCard/issueNew/CardTypeStep.tsx   |  2 +-
 .../issueNew/IssueNewCardPage.tsx             | 50 ++++++++++++++++---
 2 files changed, 44 insertions(+), 8 deletions(-)

diff --git a/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx b/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
index 402e9c585f47..f24b0c5aeda1 100644
--- a/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
@@ -9,10 +9,10 @@ import useLocalize from '@hooks/useLocalize';
 import useOnyx from '@hooks/useOnyx';
 import useThemeStyles from '@hooks/useThemeStyles';
 import {clearIssueNewCardFlow, setIssueNewCardStepAndData} from '@libs/actions/Card';
+import Navigation from '@libs/Navigation/Navigation';
 import variables from '@styles/variables';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
-import Navigation from '@libs/Navigation/Navigation';
 
 type CardTypeStepProps = {
     /** ID of the policy */
diff --git a/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx b/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx
index 655cfb7fa1cf..bb0616da6991 100644
--- a/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx
@@ -1,5 +1,5 @@
 import React, {useEffect, useMemo} from 'react';
-import type { OnyxEntry } from 'react-native-onyx';
+import type {OnyxEntry} from 'react-native-onyx';
 import DelegateNoAccessWrapper from '@components/DelegateNoAccessWrapper';
 import ScreenWrapper from '@components/ScreenWrapper';
 import useInitial from '@hooks/useInitial';
@@ -60,15 +60,45 @@ function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
     const getCurrentStep = () => {
         switch (currentStep) {
             case CONST.EXPENSIFY_CARD.STEP.ASSIGNEE:
-                return <AssigneeStep policy={policy} stepNames={stepNames} startFrom={startFrom} />;
+                return (
+                    <AssigneeStep
+                        policy={policy}
+                        stepNames={stepNames}
+                        startFrom={startFrom}
+                    />
+                );
             case CONST.EXPENSIFY_CARD.STEP.CARD_TYPE:
-                return <CardTypeStep policyID={policyID} stepNames={stepNames} startFrom={startFrom} />;
+                return (
+                    <CardTypeStep
+                        policyID={policyID}
+                        stepNames={stepNames}
+                        startFrom={startFrom}
+                    />
+                );
             case CONST.EXPENSIFY_CARD.STEP.LIMIT_TYPE:
-                return <LimitTypeStep policy={policy} stepNames={stepNames} startFrom={startFrom} />;
+                return (
+                    <LimitTypeStep
+                        policy={policy}
+                        stepNames={stepNames}
+                        startFrom={startFrom}
+                    />
+                );
             case CONST.EXPENSIFY_CARD.STEP.LIMIT:
-                return <LimitStep policyID={policyID} stepNames={stepNames} startFrom={startFrom} />;
+                return (
+                    <LimitStep
+                        policyID={policyID}
+                        stepNames={stepNames}
+                        startFrom={startFrom}
+                    />
+                );
             case CONST.EXPENSIFY_CARD.STEP.CARD_NAME:
-                return <CardNameStep policyID={policyID} stepNames={stepNames} startFrom={startFrom} />;
+                return (
+                    <CardNameStep
+                        policyID={policyID}
+                        stepNames={stepNames}
+                        startFrom={startFrom}
+                    />
+                );
             case CONST.EXPENSIFY_CARD.STEP.CONFIRMATION:
                 return (
                     <ConfirmationStep
@@ -79,7 +109,13 @@ function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
                     />
                 );
             default:
-                return <AssigneeStep policy={policy} stepNames={stepNames} startFrom={startFrom} />;
+                return (
+                    <AssigneeStep
+                        policy={policy}
+                        stepNames={stepNames}
+                        startFrom={startFrom}
+                    />
+                );
         }
     };
 

From a714b4d5c73afe068840f2c6d23c181cf24ef482 Mon Sep 17 00:00:00 2001
From: gijoe0295 <153004152+gijoe0295@users.noreply.github.com>
Date: Thu, 31 Jul 2025 08:19:40 +0700
Subject: [PATCH 4/5] rename isFromWorkspaceMembersPage to
 isChangeAssigneeDisable and refactor

---
 src/libs/actions/Card.ts                                    | 6 +++++-
 .../expensifyCard/WorkspaceExpensifyCardBankAccounts.tsx    | 2 +-
 .../expensifyCard/WorkspaceExpensifyCardListPage.tsx        | 2 +-
 src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx | 2 +-
 .../workspace/expensifyCard/issueNew/ConfirmationStep.tsx   | 4 ++--
 .../workspace/expensifyCard/issueNew/IssueNewCardPage.tsx   | 4 ++--
 src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx  | 2 +-
 src/pages/workspace/members/WorkspaceMemberNewCardPage.tsx  | 2 +-
 src/types/onyx/Card.ts                                      | 6 +++---
 9 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/src/libs/actions/Card.ts b/src/libs/actions/Card.ts
index d147406c6490..a70180185d20 100644
--- a/src/libs/actions/Card.ts
+++ b/src/libs/actions/Card.ts
@@ -40,6 +40,9 @@ type IssueNewCardFlowData = {
 
     /** ID of the policy */
     policyID: string | undefined;
+
+    /** Whether the changing assignee is disabled. E.g., The assignee is auto selected from workspace members page */
+    isChangeAssigneeDisabled?: boolean;
 };
 
 function reportVirtualExpensifyCardFraud(card: Card, validateCode: string) {
@@ -363,12 +366,13 @@ function getCardDefaultName(userName?: string) {
     return `${userName}'s Card`;
 }
 
-function setIssueNewCardStepAndData({data, isEditing, step, policyID}: IssueNewCardFlowData) {
+function setIssueNewCardStepAndData({data, isEditing, step, policyID, isChangeAssigneeDisabled}: IssueNewCardFlowData) {
     Onyx.merge(`${ONYXKEYS.COLLECTION.ISSUE_NEW_EXPENSIFY_CARD}${policyID}`, {
         data,
         isEditing,
         currentStep: step,
         errors: null,
+        isChangeAssigneeDisabled,
     });
 }
 
diff --git a/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardBankAccounts.tsx b/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardBankAccounts.tsx
index 270c3b959ab8..d41b03a4b2ed 100644
--- a/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardBankAccounts.tsx
+++ b/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardBankAccounts.tsx
@@ -160,8 +160,8 @@ function WorkspaceExpensifyCardBankAccounts({route}: WorkspaceExpensifyCardBankA
                             style={[styles.m5, bottomSafeAreaPaddingStyle]}
                             pressOnEnter
                             onPress={() => {
+                                setIssueNewCardStepAndData({policyID, isChangeAssigneeDisabled: false});
                                 Navigation.dismissModal();
-                                setIssueNewCardStepAndData({policyID, data: {isFromWorkspaceMembersPage: false}});
                                 Navigation.navigate(ROUTES.WORKSPACE_EXPENSIFY_CARD_ISSUE_NEW.getRoute(policyID));
                             }}
                         />
diff --git a/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardListPage.tsx b/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardListPage.tsx
index 5d726431093c..003ed2c91bc2 100644
--- a/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardListPage.tsx
+++ b/src/pages/workspace/expensifyCard/WorkspaceExpensifyCardListPage.tsx
@@ -103,7 +103,7 @@ function WorkspaceExpensifyCardListPage({route, cardsList, fundID}: WorkspaceExp
             return;
         }
         const activeRoute = Navigation.getActiveRoute();
-        setIssueNewCardStepAndData({policyID, data: {isFromWorkspaceMembersPage: false}});
+        setIssueNewCardStepAndData({policyID, isChangeAssigneeDisabled: false});
         Navigation.navigate(ROUTES.WORKSPACE_EXPENSIFY_CARD_ISSUE_NEW.getRoute(policyID, activeRoute));
     };
 
diff --git a/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx b/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
index f24b0c5aeda1..f00ef8a194cf 100644
--- a/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
@@ -48,7 +48,7 @@ function CardTypeStep({policyID, stepNames, startFrom}: CardTypeStepProps) {
             setIssueNewCardStepAndData({step: CONST.EXPENSIFY_CARD.STEP.CONFIRMATION, isEditing: false, policyID});
             return;
         }
-        if (issueNewCard?.data?.isFromWorkspaceMembersPage === true) {
+        if (issueNewCard?.isChangeAssigneeDisabled) {
             Navigation.goBack();
             clearIssueNewCardFlow(policyID);
             return;
diff --git a/src/pages/workspace/expensifyCard/issueNew/ConfirmationStep.tsx b/src/pages/workspace/expensifyCard/issueNew/ConfirmationStep.tsx
index babd66b93352..44501308036a 100644
--- a/src/pages/workspace/expensifyCard/issueNew/ConfirmationStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/ConfirmationStep.tsx
@@ -110,8 +110,8 @@ function ConfirmationStep({policyID, backTo, stepNames, startFrom}: Confirmation
                 <MenuItemWithTopDescription
                     description={translate('workspace.card.issueNewCard.cardholder')}
                     title={getUserNameByEmail(data?.assigneeEmail ?? '', 'displayName')}
-                    shouldShowRightIcon={!data?.isFromWorkspaceMembersPage}
-                    interactive={!data?.isFromWorkspaceMembersPage}
+                    shouldShowRightIcon={!issueNewCard?.isChangeAssigneeDisabled}
+                    interactive={!issueNewCard?.isChangeAssigneeDisabled}
                     onPress={() => editStep(CONST.EXPENSIFY_CARD.STEP.ASSIGNEE)}
                 />
                 <MenuItemWithTopDescription
diff --git a/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx b/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx
index bb0616da6991..76073b74bd5a 100644
--- a/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx
@@ -39,7 +39,7 @@ function getStartStepIndex(issueNewCard: OnyxEntry<IssueNewCard>): number {
     };
 
     const stepIndex = STEP_INDEXES[issueNewCard.currentStep];
-    return issueNewCard.data?.isFromWorkspaceMembersPage ? stepIndex - 1 : stepIndex;
+    return issueNewCard.isChangeAssigneeDisabled ? stepIndex - 1 : stepIndex;
 }
 
 function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
@@ -50,7 +50,7 @@ function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
     const firstAssigneeEmail = useInitial(issueNewCard?.data?.assigneeEmail);
     const shouldUseBackToParam = !firstAssigneeEmail || firstAssigneeEmail === issueNewCard?.data?.assigneeEmail;
     const [isActingAsDelegate] = useOnyx(ONYXKEYS.ACCOUNT, {selector: (account) => !!account?.delegatedAccess?.delegate, canBeMissing: true});
-    const stepNames = issueNewCard?.data?.isFromWorkspaceMembersPage ? CONST.EXPENSIFY_CARD.ASSIGNEE_EXCLUDED_STEP_NAMES : CONST.EXPENSIFY_CARD.STEP_NAMES;
+    const stepNames = issueNewCard?.isChangeAssigneeDisabled ? CONST.EXPENSIFY_CARD.ASSIGNEE_EXCLUDED_STEP_NAMES : CONST.EXPENSIFY_CARD.STEP_NAMES;
     const startFrom = useMemo(() => getStartStepIndex(issueNewCard), [issueNewCard]);
 
     useEffect(() => {
diff --git a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx
index cffe506a0b0f..2b6416ebaee9 100644
--- a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx
+++ b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx
@@ -250,9 +250,9 @@ function WorkspaceMemberDetailsPage({personalDetails, policy, route}: WorkspaceM
             step: CONST.EXPENSIFY_CARD.STEP.CARD_TYPE,
             data: {
                 assigneeEmail: memberLogin,
-                isFromWorkspaceMembersPage: true,
             },
             isEditing: false,
+            isChangeAssigneeDisabled: true,
             policyID,
         });
         Navigation.navigate(ROUTES.WORKSPACE_EXPENSIFY_CARD_ISSUE_NEW.getRoute(policyID, activeRoute));
diff --git a/src/pages/workspace/members/WorkspaceMemberNewCardPage.tsx b/src/pages/workspace/members/WorkspaceMemberNewCardPage.tsx
index 96ed586efb84..c2d4418975a1 100644
--- a/src/pages/workspace/members/WorkspaceMemberNewCardPage.tsx
+++ b/src/pages/workspace/members/WorkspaceMemberNewCardPage.tsx
@@ -88,9 +88,9 @@ function WorkspaceMemberNewCardPage({route, personalDetails}: WorkspaceMemberNew
                 step: CONST.EXPENSIFY_CARD.STEP.CARD_TYPE,
                 data: {
                     assigneeEmail: memberLogin,
-                    isFromWorkspaceMembersPage: true,
                 },
                 isEditing: false,
+                isChangeAssigneeDisabled: true,
                 policyID,
             });
             Navigation.navigate(ROUTES.WORKSPACE_EXPENSIFY_CARD_ISSUE_NEW.getRoute(policyID, ROUTES.WORKSPACE_MEMBER_DETAILS.getRoute(policyID, accountID)));
diff --git a/src/types/onyx/Card.ts b/src/types/onyx/Card.ts
index 124708efb828..55308ad81fb9 100644
--- a/src/types/onyx/Card.ts
+++ b/src/types/onyx/Card.ts
@@ -223,9 +223,6 @@ type IssueNewCardData = {
 
     /** Name of the card */
     cardTitle: string;
-
-    /** Whether the flow is triggered from workspace members page */
-    isFromWorkspaceMembersPage: boolean;
 };
 
 /** Model of Issue new card flow */
@@ -239,6 +236,9 @@ type IssueNewCard = {
     /** Whether the user is editing step */
     isEditing: boolean;
 
+    /** Whether the changing assignee is disabled. E.g., The assignee is auto selected from workspace members page */
+    isChangeAssigneeDisabled: boolean;
+
     /** Whether the request is being processed */
     isLoading?: boolean;
 

From 7cb95e06bbda74757ba192549a2a4a2839d22425 Mon Sep 17 00:00:00 2001
From: gijoe0295 <153004152+gijoe0295@users.noreply.github.com>
Date: Thu, 31 Jul 2025 08:22:06 +0700
Subject: [PATCH 5/5] rename startFrom to startStepIndex

---
 .../expensifyCard/issueNew/AssigneeStep.tsx      |  8 ++++----
 .../expensifyCard/issueNew/CardNameStep.tsx      |  8 ++++----
 .../expensifyCard/issueNew/CardTypeStep.tsx      |  8 ++++----
 .../expensifyCard/issueNew/ConfirmationStep.tsx  |  8 ++++----
 .../expensifyCard/issueNew/IssueNewCardPage.tsx  | 16 ++++++++--------
 .../expensifyCard/issueNew/LimitStep.tsx         |  8 ++++----
 .../expensifyCard/issueNew/LimitTypeStep.tsx     |  8 ++++----
 7 files changed, 32 insertions(+), 32 deletions(-)

diff --git a/src/pages/workspace/expensifyCard/issueNew/AssigneeStep.tsx b/src/pages/workspace/expensifyCard/issueNew/AssigneeStep.tsx
index fe8252ee3ec3..8e8a9874b14d 100644
--- a/src/pages/workspace/expensifyCard/issueNew/AssigneeStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/AssigneeStep.tsx
@@ -29,13 +29,13 @@ type AssigneeStepProps = {
     policy: OnyxEntry<OnyxTypes.Policy>;
 
     /** Array of step names */
-    stepNames?: readonly string[];
+    stepNames: readonly string[];
 
     /** Start from step index */
-    startFrom?: number;
+    startStepIndex: number;
 };
 
-function AssigneeStep({policy, stepNames, startFrom}: AssigneeStepProps) {
+function AssigneeStep({policy, stepNames, startStepIndex}: AssigneeStepProps) {
     const {translate, formatPhoneNumber, localeCompare} = useLocalize();
     const styles = useThemeStyles();
     const {isOffline} = useNetwork();
@@ -145,7 +145,7 @@ function AssigneeStep({policy, stepNames, startFrom}: AssigneeStepProps) {
             shouldEnableMaxHeight
             headerTitle={translate('workspace.card.issueCard')}
             handleBackButtonPress={handleBackButtonPress}
-            startStepIndex={startFrom}
+            startStepIndex={startStepIndex}
             stepNames={stepNames}
             enableEdgeToEdgeBottomSafeAreaPadding
         >
diff --git a/src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx b/src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx
index eb6f4f99d020..73dc495cee3c 100644
--- a/src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/CardNameStep.tsx
@@ -23,13 +23,13 @@ type CardNameStepProps = {
     policyID: string | undefined;
 
     /** Array of step names */
-    stepNames?: readonly string[];
+    stepNames: readonly string[];
 
     /** Start from step index */
-    startFrom?: number;
+    startStepIndex: number;
 };
 
-function CardNameStep({policyID, stepNames, startFrom}: CardNameStepProps) {
+function CardNameStep({policyID, stepNames, startStepIndex}: CardNameStepProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const {inputCallbackRef} = useAutoFocusInput();
@@ -79,7 +79,7 @@ function CardNameStep({policyID, stepNames, startFrom}: CardNameStepProps) {
             shouldEnableMaxHeight
             headerTitle={translate('workspace.card.issueCard')}
             handleBackButtonPress={handleBackButtonPress}
-            startStepIndex={startFrom}
+            startStepIndex={startStepIndex}
             stepNames={stepNames}
             enableEdgeToEdgeBottomSafeAreaPadding
         >
diff --git a/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx b/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
index f00ef8a194cf..18060016de44 100644
--- a/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/CardTypeStep.tsx
@@ -19,13 +19,13 @@ type CardTypeStepProps = {
     policyID: string | undefined;
 
     /** Array of step names */
-    stepNames?: readonly string[];
+    stepNames: readonly string[];
 
     /** Start from step index */
-    startFrom?: number;
+    startStepIndex: number;
 };
 
-function CardTypeStep({policyID, stepNames, startFrom}: CardTypeStepProps) {
+function CardTypeStep({policyID, stepNames, startStepIndex}: CardTypeStepProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const [issueNewCard] = useOnyx(`${ONYXKEYS.COLLECTION.ISSUE_NEW_EXPENSIFY_CARD}${policyID}`, {canBeMissing: true});
@@ -64,7 +64,7 @@ function CardTypeStep({policyID, stepNames, startFrom}: CardTypeStepProps) {
             offlineIndicatorStyle={styles.mtAuto}
             headerTitle={translate('workspace.card.issueCard')}
             handleBackButtonPress={handleBackButtonPress}
-            startStepIndex={startFrom}
+            startStepIndex={startStepIndex}
             stepNames={stepNames}
             enableEdgeToEdgeBottomSafeAreaPadding
         >
diff --git a/src/pages/workspace/expensifyCard/issueNew/ConfirmationStep.tsx b/src/pages/workspace/expensifyCard/issueNew/ConfirmationStep.tsx
index 44501308036a..50542a23c9a1 100644
--- a/src/pages/workspace/expensifyCard/issueNew/ConfirmationStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/ConfirmationStep.tsx
@@ -33,13 +33,13 @@ type ConfirmationStepProps = {
     backTo?: Route;
 
     /** Array of step names */
-    stepNames?: readonly string[];
+    stepNames: readonly string[];
 
     /** Start from step index */
-    startFrom?: number;
+    startStepIndex: number;
 };
 
-function ConfirmationStep({policyID, backTo, stepNames, startFrom}: ConfirmationStepProps) {
+function ConfirmationStep({policyID, backTo, stepNames, startStepIndex}: ConfirmationStepProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const {isOffline} = useNetwork();
@@ -96,7 +96,7 @@ function ConfirmationStep({policyID, backTo, stepNames, startFrom}: Confirmation
             shouldEnableMaxHeight
             headerTitle={translate('workspace.card.issueCard')}
             handleBackButtonPress={handleBackButtonPress}
-            startStepIndex={startFrom}
+            startStepIndex={startStepIndex}
             stepNames={stepNames}
             enableEdgeToEdgeBottomSafeAreaPadding
         >
diff --git a/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx b/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx
index 76073b74bd5a..9aa83113150c 100644
--- a/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/IssueNewCardPage.tsx
@@ -51,7 +51,7 @@ function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
     const shouldUseBackToParam = !firstAssigneeEmail || firstAssigneeEmail === issueNewCard?.data?.assigneeEmail;
     const [isActingAsDelegate] = useOnyx(ONYXKEYS.ACCOUNT, {selector: (account) => !!account?.delegatedAccess?.delegate, canBeMissing: true});
     const stepNames = issueNewCard?.isChangeAssigneeDisabled ? CONST.EXPENSIFY_CARD.ASSIGNEE_EXCLUDED_STEP_NAMES : CONST.EXPENSIFY_CARD.STEP_NAMES;
-    const startFrom = useMemo(() => getStartStepIndex(issueNewCard), [issueNewCard]);
+    const startStepIndex = useMemo(() => getStartStepIndex(issueNewCard), [issueNewCard]);
 
     useEffect(() => {
         startIssueNewCardFlow(policyID);
@@ -64,7 +64,7 @@ function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
                     <AssigneeStep
                         policy={policy}
                         stepNames={stepNames}
-                        startFrom={startFrom}
+                        startStepIndex={startStepIndex}
                     />
                 );
             case CONST.EXPENSIFY_CARD.STEP.CARD_TYPE:
@@ -72,7 +72,7 @@ function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
                     <CardTypeStep
                         policyID={policyID}
                         stepNames={stepNames}
-                        startFrom={startFrom}
+                        startStepIndex={startStepIndex}
                     />
                 );
             case CONST.EXPENSIFY_CARD.STEP.LIMIT_TYPE:
@@ -80,7 +80,7 @@ function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
                     <LimitTypeStep
                         policy={policy}
                         stepNames={stepNames}
-                        startFrom={startFrom}
+                        startStepIndex={startStepIndex}
                     />
                 );
             case CONST.EXPENSIFY_CARD.STEP.LIMIT:
@@ -88,7 +88,7 @@ function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
                     <LimitStep
                         policyID={policyID}
                         stepNames={stepNames}
-                        startFrom={startFrom}
+                        startStepIndex={startStepIndex}
                     />
                 );
             case CONST.EXPENSIFY_CARD.STEP.CARD_NAME:
@@ -96,7 +96,7 @@ function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
                     <CardNameStep
                         policyID={policyID}
                         stepNames={stepNames}
-                        startFrom={startFrom}
+                        startStepIndex={startStepIndex}
                     />
                 );
             case CONST.EXPENSIFY_CARD.STEP.CONFIRMATION:
@@ -105,7 +105,7 @@ function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
                         policyID={policyID}
                         backTo={shouldUseBackToParam ? backTo : undefined}
                         stepNames={stepNames}
-                        startFrom={startFrom}
+                        startStepIndex={startStepIndex}
                     />
                 );
             default:
@@ -113,7 +113,7 @@ function IssueNewCardPage({policy, route}: IssueNewCardPageProps) {
                     <AssigneeStep
                         policy={policy}
                         stepNames={stepNames}
-                        startFrom={startFrom}
+                        startStepIndex={startStepIndex}
                     />
                 );
         }
diff --git a/src/pages/workspace/expensifyCard/issueNew/LimitStep.tsx b/src/pages/workspace/expensifyCard/issueNew/LimitStep.tsx
index 99dee660fa9e..abf002f35125 100644
--- a/src/pages/workspace/expensifyCard/issueNew/LimitStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/LimitStep.tsx
@@ -21,13 +21,13 @@ type LimitStepProps = {
     policyID: string | undefined;
 
     /** Array of step names */
-    stepNames?: readonly string[];
+    stepNames: readonly string[];
 
     /** Start from step index */
-    startFrom?: number;
+    startStepIndex: number;
 };
 
-function LimitStep({policyID, stepNames, startFrom}: LimitStepProps) {
+function LimitStep({policyID, stepNames, startStepIndex}: LimitStepProps) {
     const {translate} = useLocalize();
     const {inputCallbackRef} = useAutoFocusInput();
     const styles = useThemeStyles();
@@ -81,7 +81,7 @@ function LimitStep({policyID, stepNames, startFrom}: LimitStepProps) {
             shouldEnableMaxHeight
             headerTitle={translate('workspace.card.issueCard')}
             handleBackButtonPress={handleBackButtonPress}
-            startStepIndex={startFrom}
+            startStepIndex={startStepIndex}
             stepNames={stepNames}
             enableEdgeToEdgeBottomSafeAreaPadding
         >
diff --git a/src/pages/workspace/expensifyCard/issueNew/LimitTypeStep.tsx b/src/pages/workspace/expensifyCard/issueNew/LimitTypeStep.tsx
index f6211917e41c..da8b2f6011a5 100644
--- a/src/pages/workspace/expensifyCard/issueNew/LimitTypeStep.tsx
+++ b/src/pages/workspace/expensifyCard/issueNew/LimitTypeStep.tsx
@@ -19,13 +19,13 @@ type LimitTypeStepProps = {
     policy: OnyxEntry<OnyxTypes.Policy>;
 
     /** Start from step index */
-    startFrom?: number;
+    startStepIndex: number;
 
     /** Array of step names */
-    stepNames?: readonly string[];
+    stepNames: readonly string[];
 };
 
-function LimitTypeStep({policy, stepNames, startFrom}: LimitTypeStepProps) {
+function LimitTypeStep({policy, stepNames, startStepIndex}: LimitTypeStepProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const policyID = policy?.id;
@@ -95,7 +95,7 @@ function LimitTypeStep({policy, stepNames, startFrom}: LimitTypeStepProps) {
             shouldEnableMaxHeight
             headerTitle={translate('workspace.card.issueCard')}
             handleBackButtonPress={handleBackButtonPress}
-            startStepIndex={startFrom}
+            startStepIndex={startStepIndex}
             stepNames={stepNames}
             enableEdgeToEdgeBottomSafeAreaPadding
         >
