Merge pull request #32541 from Expensify/yuwen-editSplitBillCategory

[CP Staging] Make sure that split bills follow the correct routes for editing category/tag

(cherry picked from commit e349d69)

src/components/MoneyRequestConfirmationList.js

@@ -699,7 +699,13 @@ function MoneyRequestConfirmationList(props) {
                             title={props.iouCategory}
                             description={translate('common.category')}
                             numberOfLinesTitle={2}
-                            onPress={() => Navigation.navigate(ROUTES.MONEY_REQUEST_CATEGORY.getRoute(props.iouType, props.reportID))}
+                            onPress={() => {
+                                if (props.isEditingSplitBill) {
+                                    Navigation.navigate(ROUTES.EDIT_SPLIT_BILL.getRoute(props.reportID, props.reportActionID, CONST.EDIT_REQUEST_FIELD.CATEGORY));
+                                    return;
+                                }
+                                Navigation.navigate(ROUTES.MONEY_REQUEST_CATEGORY.getRoute(props.iouType, props.reportID));
+                            }}
                             style={[styles.moneyRequestMenuItem]}
                             titleStyle={styles.flex1}
                             disabled={didConfirm}
@@ -713,7 +719,13 @@ function MoneyRequestConfirmationList(props) {
                             title={props.iouTag}
                             description={policyTagListName}
                             numberOfLinesTitle={2}
-                            onPress={() => Navigation.navigate(ROUTES.MONEY_REQUEST_TAG.getRoute(props.iouType, props.reportID))}
+                            onPress={() => {
+                                if (props.isEditingSplitBill) {
+                                    Navigation.navigate(ROUTES.EDIT_SPLIT_BILL.getRoute(props.reportID, props.reportActionID, CONST.EDIT_REQUEST_FIELD.TAG));
+                                    return;
+                                }
+                                Navigation.navigate(ROUTES.MONEY_REQUEST_TAG.getRoute(props.iouType, props.reportID));
+                            }}
                             style={[styles.moneyRequestMenuItem]}
                             disabled={didConfirm}
                             interactive={!props.isReadOnly}

src/pages/EditSplitBillPage.js

@@ -13,9 +13,12 @@ import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import EditRequestAmountPage from './EditRequestAmountPage';
+import EditRequestCategoryPage from './EditRequestCategoryPage';
 import EditRequestCreatedPage from './EditRequestCreatedPage';
 import EditRequestDescriptionPage from './EditRequestDescriptionPage';
 import EditRequestMerchantPage from './EditRequestMerchantPage';
+import EditRequestTagPage from './EditRequestTagPage';
+import reportPropTypes from './reportPropTypes';
 
 const propTypes = {
     /** Route from navigation */
@@ -38,13 +41,16 @@ const propTypes = {
 
     /** The draft transaction that holds data to be persisted on the current transaction */
     draftTransaction: transactionPropTypes,
+
+    /** The report currently being used */
+    report: reportPropTypes.isRequired,
 };
 
 const defaultProps = {
     draftTransaction: undefined,
 };
 
-function EditSplitBillPage({route, transaction, draftTransaction}) {
+function EditSplitBillPage({route, transaction, draftTransaction, report}) {
     const fieldToEdit = lodashGet(route, ['params', 'field'], '');
     const reportID = lodashGet(route, ['params', 'reportID'], '');
     const reportActionID = lodashGet(route, ['params', 'reportActionID'], '');
@@ -55,6 +61,8 @@ function EditSplitBillPage({route, transaction, draftTransaction}) {
         comment: transactionDescription,
         merchant: transactionMerchant,
         created: transactionCreated,
+        category: transactionCategory,
+        tag: transactionTag,
     } = draftTransaction ? ReportUtils.getTransactionDetails(draftTransaction) : ReportUtils.getTransactionDetails(transaction);
 
     const defaultCurrency = lodashGet(route, 'params.currency', '') || transactionCurrency;
@@ -130,6 +138,30 @@ function EditSplitBillPage({route, transaction, draftTransaction}) {
         );
     }
 
+    if (fieldToEdit === CONST.EDIT_REQUEST_FIELD.CATEGORY) {
+        return (
+            <EditRequestCategoryPage
+                defaultCategory={transactionCategory}
+                policyID={lodashGet(report, 'policyID', '')}
+                onSubmit={(transactionChanges) => {
+                    setDraftSplitTransaction({category: transactionChanges.category.trim()});
+                }}
+            />
+        );
+    }
+
+    if (fieldToEdit === CONST.EDIT_REQUEST_FIELD.TAG) {
+        return (
+            <EditRequestTagPage
+                defaultTag={transactionTag}
+                policyID={lodashGet(report, 'policyID', '')}
+                onSubmit={(transactionChanges) => {
+                    setDraftSplitTransaction({tag: transactionChanges.tag.trim()});
+                }}
+            />
+        );
+    }
+
     return <FullPageNotFoundView shouldShow />;
 }
 
@@ -142,6 +174,9 @@ export default compose(
             key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${route.params.reportID}`,
             canEvict: false,
         },
+        report: {
+            key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT}${route.params.reportID}`,
+        },
     }),
     // eslint-disable-next-line rulesdir/no-multiple-onyx-in-file
     withOnyx({