[VIP][Travel] View trip details and authenticate to travelDot

src/CONST.ts

@@ -3306,6 +3306,7 @@ const CONST = {
 
     CONCIERGE_TRAVEL_URL: 'https://community.expensify.com/discussion/7066/introducing-concierge-travel',
     BOOK_TRAVEL_DEMO_URL: 'https://calendly.com/d/ck2z-xsh-q97/expensify-travel-demo-travel-page',
+    TRIP_ID_URL: (tripID: string, isProduction: boolean) => (isProduction ? `https://travel.expensify.com/trips/${tripID}` : `https://staging.travel.expensify.com/trips/${tripID}`),
     SCREEN_READER_STATES: {
         ALL: 'all',
         ACTIVE: 'active',

src/components/ReportActionItem/MoneyRequestView.tsx

@@ -1,9 +1,10 @@
 import React, {useCallback, useMemo} from 'react';
-import {View} from 'react-native';
+import {Linking, View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
 import ConfirmedRoute from '@components/ConfirmedRoute';
 import * as Expensicons from '@components/Icon/Expensicons';
+import MenuItem from '@components/MenuItem';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import {useSession} from '@components/OnyxProvider';
@@ -12,6 +13,7 @@ import ReceiptEmptyState from '@components/ReceiptEmptyState';
 import Switch from '@components/Switch';
 import Text from '@components/Text';
 import ViolationMessages from '@components/ViolationMessages';
+import useEnvironment from '@hooks/useEnvironment';
 import useLocalize from '@hooks/useLocalize';
 import useNetwork from '@hooks/useNetwork';
 import usePermissions from '@hooks/usePermissions';
@@ -99,6 +101,8 @@ function MoneyRequestView({
     const session = useSession();
     const {isOffline} = useNetwork();
     const {translate, toLocaleDigit} = useLocalize();
+    const {isProduction} = useEnvironment();
+
     const parentReportAction = parentReportActions?.[report.parentReportActionID ?? ''] ?? null;
     const isTrackExpense = ReportUtils.isTrackExpenseReport(report);
     const {canUseViolations, canUseP2PDistanceRequests} = usePermissions(isTrackExpense ? CONST.IOU.TYPE.TRACK : undefined);
@@ -171,6 +175,15 @@ function MoneyRequestView({
     const shouldShowBillable = isPolicyExpenseChat && (!!transactionBillable || !(policy?.disabledFields?.defaultBillable ?? true));
 
     const shouldShowTax = isTaxTrackingEnabled(isPolicyExpenseChat, policy, isDistanceRequest);
+    const shouldShowViewTripDetails = TransactionUtils.hasReservationList(transaction);
+    const tripID = ReportUtils.getTripIDFromTransactionParentReport(parentReport);
+
+    const navigateToTripID = () => {
+        if (!tripID) {
+            return;
+        }
+        Linking.openURL(CONST.TRIP_ID_URL(tripID, isProduction));
+    };
 
     const {getViolationsForField} = useViolations(transactionViolations ?? []);
     const hasViolations = useCallback(
@@ -549,6 +562,15 @@ function MoneyRequestView({
                         />
                     </OfflineWithFeedback>
                 )}
+                {shouldShowViewTripDetails && tripID && (
+                    <MenuItem
+                        title="View trip details"
+                        icon={Expensicons.Suitcase}
+                        iconRight={Expensicons.NewWindow}
+                        shouldShowRightIcon
+                        onPress={navigateToTripID}
+                    />
+                )}
                 {shouldShowBillable && (
                     <View style={[styles.flexRow, styles.optionRow, styles.justifyContentBetween, styles.alignItemsCenter, styles.ml5, styles.mr8]}>
                         <View>

src/libs/ReportUtils.ts

@@ -6638,6 +6638,10 @@ function getTripTransactions(tripRoomReportID: string | undefined): Transaction[
     return tripTransactionReportIDs.flatMap((reportID) => TransactionUtils.getAllReportTransactions(reportID));
 }
 
+function getTripIDFromTransactionParentReport(transactionParentReport: OnyxEntry<Report> | undefined | null): string | undefined {
+    return getReport(transactionParentReport?.parentReportID)?.tripData?.tripID;
+}
+
 /**
  * Checks if report contains actions with errors
  */
@@ -7075,6 +7079,7 @@ export {
     updateReportPreview,
     temporary_getMoneyRequestOptions,
     getTripTransactions,
+    getTripIDFromTransactionParentReport,
     buildOptimisticInvoiceReport,
     getInvoiceChatByParticipants,
     shouldShowMerchantColumn,

src/types/onyx/Report.ts

@@ -203,6 +203,13 @@ type Report = OnyxCommon.OnyxValueWithOfflineFeedback<
         fieldList?: Record<string, PolicyReportField>;
 
         permissions?: Array<ValueOf<typeof CONST.REPORT.PERMISSIONS>>;
+
+        /** The trip data for a trip room */
+        tripData?: {
+            startDate: string;
+            endDate: string;
+            tripID: string;
+        };
     },
     PolicyReportField['fieldID']
 >;