Merge pull request Expensify#87142 from TaduJR/fix-Add-updated-automatic/scan-flow-to-native-share-sheet-creation-flow

fix: Add updated automatic/scan flow to native share sheet creation flow

Author: marcochavezf

src/pages/Share/SubmitDetailsPage.tsx

@@ -1,7 +1,7 @@
 import type {StackScreenProps} from '@react-navigation/stack';
 import {hasSeenTourSelector} from '@selectors/Onboarding';
 import {validTransactionDraftsSelector} from '@selectors/TransactionDraft';
-import React, {useEffect, useState} from 'react';
+import React, {useCallback, useEffect, useMemo, useState} from 'react';
 import {View} from 'react-native';
 import type {OnyxEntry} from 'react-native-onyx';
 import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView';
@@ -11,6 +11,7 @@ import MoneyRequestConfirmationList from '@components/MoneyRequestConfirmationLi
 import ScreenWrapper from '@components/ScreenWrapper';
 import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails';
 import useLocalize from '@hooks/useLocalize';
+import useNetwork from '@hooks/useNetwork';
 import useOnyx from '@hooks/useOnyx';
 import usePermissions from '@hooks/usePermissions';
 import usePersonalPolicy from '@hooks/usePersonalPolicy';
@@ -19,7 +20,15 @@ import useReportAttributes from '@hooks/useReportAttributes';
 import useReportIsArchived from '@hooks/useReportIsArchived';
 import useThemeStyles from '@hooks/useThemeStyles';
 import type {GpsPoint} from '@libs/actions/IOU';
-import {getIOURequestPolicyID, getMoneyRequestParticipantsFromReport, initMoneyRequest, updateLastLocationPermissionPrompt} from '@libs/actions/IOU';
+import {
+    getIOURequestPolicyID,
+    getMoneyRequestParticipantsFromReport,
+    initMoneyRequest,
+    setMoneyRequestBillable,
+    setMoneyRequestReimbursable,
+    updateLastLocationPermissionPrompt,
+} from '@libs/actions/IOU';
+import {setMoneyRequestReceipt} from '@libs/actions/IOU/Receipt';
 import {requestMoney, trackExpense} from '@libs/actions/IOU/TrackExpense';
 import DateUtils from '@libs/DateUtils';
 import {getFileName, readFileAsync} from '@libs/fileDownload/FileUtils';
@@ -30,10 +39,11 @@ import navigateAfterInteraction from '@libs/Navigation/navigateAfterInteraction'
 import Navigation from '@libs/Navigation/Navigation';
 import type {ShareNavigatorParamList} from '@libs/Navigation/types';
 import {getParticipantsOption, getReportOption} from '@libs/OptionsListUtils';
-import {hasOnlyPersonalPolicies as hasOnlyPersonalPoliciesUtil} from '@libs/PolicyUtils';
+import {hasOnlyPersonalPolicies as hasOnlyPersonalPoliciesUtil, isPaidGroupPolicy} from '@libs/PolicyUtils';
 import {shouldValidateFile} from '@libs/ReceiptUtils';
 import {getReportOrDraftReport, isSelfDM} from '@libs/ReportUtils';
 import {getDefaultTaxCode, getTaxValue} from '@libs/TransactionUtils';
+import DraftWorkspaceOpener from '@pages/iou/request/step/confirmation/DraftWorkspaceOpener';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type SCREENS from '@src/SCREENS';
@@ -107,7 +117,7 @@ function SubmitDetailsPage({
             reportID: reportOrAccountID,
             policy,
             personalPolicy,
-            currentIouRequestType: CONST.IOU.REQUEST_TYPE.SCAN,
+            currentIouRequestType: transaction?.iouRequestType,
             newIouRequestType: CONST.IOU.REQUEST_TYPE.SCAN,
             report,
             parentReport,
@@ -120,13 +130,53 @@ function SubmitDetailsPage({
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [reportOrAccountID, policy, personalPolicy, report, parentReport, currentDate, currentUserPersonalDetails, hasOnlyPersonalPolicies]);
 
+    // Set receipt on the transaction draft so isScanRequest() returns true and
+    // compact mode, "Automatic" labels, and receipt image rendering all work correctly
+    const receiptSource = currentAttachment?.content ?? fileUri;
+    const receiptFileName = getFileName(currentAttachment?.content ?? '') || fileName;
+    const receiptFileType = currentAttachment?.mimeType ?? fileType;
+
+    useEffect(() => {
+        if (!receiptSource) {
+            return;
+        }
+        setMoneyRequestReceipt(CONST.IOU.OPTIMISTIC_TRANSACTION_ID, receiptSource, receiptFileName, true, receiptFileType);
+    }, [receiptSource, receiptFileName, receiptFileType]);
+
     const selectedParticipants = unknownUserDetails ? [unknownUserDetails] : getMoneyRequestParticipantsFromReport(report, currentUserPersonalDetails.accountID);
     const participants = selectedParticipants.map((participant) => {
         const privateIsArchived = privateIsArchivedMap[`${ONYXKEYS.COLLECTION.REPORT_NAME_VALUE_PAIRS}${participant.reportID}`];
         return participant?.accountID
             ? getParticipantsOption(participant, personalDetails)
             : getReportOption(participant, privateIsArchived, policy, personalDetails, conciergeReportID, reportAttributesDerived);
     });
+
+    const isPolicyExpenseChat = useMemo(() => participants?.some((participant) => participant.isPolicyExpenseChat), [participants]);
+    const policyExpenseChatPolicyID = participants?.find((participant) => participant.isPolicyExpenseChat)?.policyID;
+    const senderPolicyID = participants?.find((participant) => !!participant && 'isSender' in participant && participant.isSender)?.policyID;
+    const iouType = isSelfDM(report) ? CONST.IOU.TYPE.TRACK : CONST.IOU.TYPE.SUBMIT;
+    const {isOffline} = useNetwork();
+    const isCreatingTrackExpense = iouType === CONST.IOU.TYPE.TRACK;
+
+    // Initialize billable/reimbursable from policy defaults (mirrors IOURequestStepConfirmation)
+    const defaultBillable = !!policy?.defaultBillable;
+    useEffect(() => {
+        setMoneyRequestBillable(CONST.IOU.OPTIMISTIC_TRANSACTION_ID, defaultBillable);
+    }, [defaultBillable]);
+
+    useEffect(() => {
+        const defaultReimbursable = (isPolicyExpenseChat && isPaidGroupPolicy(policy)) || isCreatingTrackExpense ? (policy?.defaultReimbursable ?? true) : true;
+        setMoneyRequestReimbursable(CONST.IOU.OPTIMISTIC_TRANSACTION_ID, defaultReimbursable);
+    }, [policy, isPolicyExpenseChat, isCreatingTrackExpense]);
+
+    const setBillable = useCallback((billable: boolean) => {
+        setMoneyRequestBillable(CONST.IOU.OPTIMISTIC_TRANSACTION_ID, billable);
+    }, []);
+
+    const setReimbursable = useCallback((reimbursable: boolean) => {
+        setMoneyRequestReimbursable(CONST.IOU.OPTIMISTIC_TRANSACTION_ID, reimbursable);
+    }, []);
+
     const trimmedComment = transaction?.comment?.comment?.trim() ?? '';
     const transactionAmount = transaction?.amount ?? 0;
     const transactionTaxAmount = transaction?.taxAmount ?? 0;
@@ -224,12 +274,7 @@ function SubmitDetailsPage({
         }
     };
 
-    const onSuccess = (file: File, locationPermissionGranted?: boolean) => {
-        const participant = selectedParticipants.at(0);
-        if (!participant) {
-            return;
-        }
-
+    const onSuccess = (participant: Participant, file: File, locationPermissionGranted?: boolean) => {
         const receipt: Receipt = file;
         receipt.state = file && CONST.IOU.RECEIPT_STATE.SCAN_READY;
         if (locationPermissionGranted) {
@@ -250,7 +295,7 @@ function SubmitDetailsPage({
         finishRequestAndNavigate(participant, receipt);
     };
 
-    const onConfirm = (gpsRequired?: boolean) => {
+    const onConfirm = (listOfParticipants?: Participant[], gpsRequired?: boolean) => {
         const shouldStartLocationPermissionFlow =
             gpsRequired &&
             (!lastLocationPermissionPrompt ||
@@ -265,43 +310,64 @@ function SubmitDetailsPage({
             return;
         }
 
+        const participant = listOfParticipants?.at(0) ?? selectedParticipants.at(0);
+        if (!participant) {
+            return;
+        }
+
         readFileAsync(
-            fileUri,
-            fileName,
-            (file) => onSuccess(file, shouldStartLocationPermissionFlow),
+            receiptSource,
+            receiptFileName,
+            (file) => onSuccess(participant, file, shouldStartLocationPermissionFlow),
             () => {},
-            fileType,
+            receiptFileType,
         );
     };
 
     return (
         <ScreenWrapper testID="SubmitDetailsPage">
             <FullPageNotFoundView shouldShow={!reportOrAccountID}>
+                <DraftWorkspaceOpener
+                    isCreatingTrackExpense={isCreatingTrackExpense}
+                    policyID={policy?.id}
+                    policyPendingAction={policy?.pendingAction}
+                    policyExpenseChatPolicyID={policyExpenseChatPolicyID}
+                    senderPolicyID={senderPolicyID}
+                    isOffline={isOffline}
+                />
                 <HeaderWithBackButton
-                    title={translate('common.details')}
+                    title={translate('iou.confirmDetails')}
                     onBackButtonPress={() => Navigation.goBack()}
                 />
                 <LocationPermissionModal
                     startPermissionFlow={startLocationPermissionFlow}
                     resetPermissionFlow={() => setStartLocationPermissionFlow(false)}
-                    onGrant={onConfirm}
+                    onGrant={() => onConfirm(undefined, true)}
                     onDeny={() => {
                         updateLastLocationPermissionPrompt();
                         setStartLocationPermissionFlow(false);
                         navigateAfterInteraction(() => {
-                            onConfirm(false);
+                            onConfirm(undefined, false);
                         });
                     }}
                 />
                 <View style={[styles.containerWithSpaceBetween, styles.pointerEventsBoxNone]}>
                     <MoneyRequestConfirmationList
                         transaction={transaction}
                         selectedParticipants={participants}
-                        onConfirm={() => onConfirm(true)}
-                        receiptPath={fileUri}
-                        receiptFilename={getFileName(fileName)}
+                        iouType={iouType}
+                        onToggleBillable={setBillable}
+                        onToggleReimbursable={setReimbursable}
+                        isPolicyExpenseChat={isPolicyExpenseChat}
+                        policyID={policy?.id}
+                        onConfirm={(updatedParticipants) => onConfirm(updatedParticipants, true)}
+                        receiptPath={receiptSource}
+                        receiptFilename={receiptFileName}
                         reportID={reportOrAccountID}
                         shouldShowSmartScanFields={false}
+                        shouldDisplayReceipt
+                        isReceiptEditable
+                        action={CONST.IOU.ACTION.CREATE}
                         onPDFLoadError={() => {
                             if (errorTitle) {
                                 return;