diff --git a/assets/images/bed.svg b/assets/images/bed.svg
new file mode 100644
index 000000000000..fd654c036a7c
--- /dev/null
+++ b/assets/images/bed.svg
@@ -0,0 +1 @@
+
diff --git a/assets/images/car-with-key.svg b/assets/images/car-with-key.svg
new file mode 100644
index 000000000000..1586c0dfecfa
--- /dev/null
+++ b/assets/images/car-with-key.svg
@@ -0,0 +1 @@
+
diff --git a/assets/images/plane.svg b/assets/images/plane.svg
new file mode 100644
index 000000000000..bf4d56875239
--- /dev/null
+++ b/assets/images/plane.svg
@@ -0,0 +1 @@
+
diff --git a/assets/images/train.svg b/assets/images/train.svg
new file mode 100644
index 000000000000..9b838708ecdf
--- /dev/null
+++ b/assets/images/train.svg
@@ -0,0 +1 @@
+
diff --git a/src/ROUTES.ts b/src/ROUTES.ts
index 23bb2ee845ad..77f536e0eb10 100644
--- a/src/ROUTES.ts
+++ b/src/ROUTES.ts
@@ -424,6 +424,8 @@ const ROUTES = {
ONBOARD_MANAGE_EXPENSES: 'onboard/manage-expenses',
ONBOARD_EXPENSIFY_CLASSIC: 'onboard/expensify-classic',
+ TRAVEL_DETAILS: 'r/:reportID/trip/:transactionID',
+
TEACHERS_UNITE: 'teachersunite',
I_KNOW_A_TEACHER: 'teachersunite/i-know-a-teacher',
I_AM_A_TEACHER: 'teachersunite/i-am-a-teacher',
diff --git a/src/SCREENS.ts b/src/SCREENS.ts
index ffb18391c980..1fda72dad05b 100644
--- a/src/SCREENS.ts
+++ b/src/SCREENS.ts
@@ -23,6 +23,9 @@ const SCREENS = {
UNLINK_LOGIN: 'UnlinkLogin',
SETTINGS_CENTRAL_PANE: 'SettingsCentralPane',
WORKSPACES_CENTRAL_PANE: 'WorkspacesCentralPane',
+ TRAVEL: {
+ TRIP_DETAILS: 'Trip_Details',
+ },
SETTINGS: {
ROOT: 'Settings_Root',
SHARE_CODE: 'Settings_Share_Code',
@@ -124,6 +127,7 @@ const SCREENS = {
ROOM_INVITE: 'RoomInvite',
REFERRAL: 'Referral',
PROCESS_MONEY_REQUEST_HOLD: 'ProcessMoneyRequestHold',
+ TRIP_DETAILS: 'TripDetails',
},
SIGN_IN_WITH_APPLE_DESKTOP: 'AppleSignInDesktop',
SIGN_IN_WITH_GOOGLE_DESKTOP: 'GoogleSignInDesktop',
@@ -287,6 +291,7 @@ const SCREENS = {
DETAILS_ROOT: 'Details_Root',
PROFILE_ROOT: 'Profile_Root',
PROCESS_MONEY_REQUEST_HOLD_ROOT: 'ProcessMoneyRequestHold_Root',
+ TRIP_DETAILS_ROOT: 'TripDetails_Root',
REPORT_DESCRIPTION_ROOT: 'Report_Description_Root',
REPORT_PARTICIPANTS_ROOT: 'ReportParticipants_Root',
ROOM_MEMBERS_ROOT: 'RoomMembers_Root',
diff --git a/src/components/Icon/Expensicons.ts b/src/components/Icon/Expensicons.ts
index 5191d2012b05..243a3e2a8ff0 100644
--- a/src/components/Icon/Expensicons.ts
+++ b/src/components/Icon/Expensicons.ts
@@ -157,6 +157,10 @@ import Workflows from '@assets/images/workflows.svg';
import Workspace from '@assets/images/workspace-default-avatar.svg';
import Wrench from '@assets/images/wrench.svg';
import Zoom from '@assets/images/zoom.svg';
+import Bed from '@assets/images/bed.svg';
+import CarWithKey from '@assets/images/car-with-key.svg';
+import Plane from '@assets/images/plane.svg';
+import Train from '@assets/images/train.svg';
export {
ActiveRoomAvatar,
@@ -318,4 +322,8 @@ export {
ChatBubbleReply,
Lightbulb,
DocumentPlus,
+ Bed,
+ CarWithKey,
+ Plane,
+ Train,
};
diff --git a/src/components/TripDetailsMenuItem.tsx b/src/components/TripDetailsMenuItem.tsx
new file mode 100644
index 000000000000..d8dde5550253
--- /dev/null
+++ b/src/components/TripDetailsMenuItem.tsx
@@ -0,0 +1,21 @@
+import type {ForwardedRef} from 'react';
+import React, {forwardRef} from 'react';
+import type {View} from 'react-native';
+import MenuItem from './MenuItem';
+import type {MenuItemProps} from './MenuItem';
+
+function TripDetailsMenuItem(props: MenuItemProps, ref: ForwardedRef) {
+ return (
+
+ );
+}
+
+TripDetailsMenuItem.displayName = 'TripDetailsMenuItem';
+
+export default forwardRef(TripDetailsMenuItem);
\ No newline at end of file
diff --git a/src/languages/en.ts b/src/languages/en.ts
index 6a2a0ed45054..5cd505239262 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -2624,6 +2624,13 @@ export default {
mute: 'Mute',
unmute: 'Unmute',
},
+ travel: {
+ flight: 'Flight',
+ hotel: 'Hotel',
+ trip: 'Trip',
+ details: 'Details',
+ tripSupport: 'Trip support'
+ },
exitSurvey: {
header: 'Before you go',
reasonPage: {
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 8167633c2d64..9a5d1356b1db 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -3120,6 +3120,13 @@ export default {
mute: 'Silenciar',
unmute: 'Activar sonido',
},
+ travel: {
+ flight: 'Vuelo',
+ hotel: 'Hotel',
+ trip: 'Viaje',
+ details: 'Detalles',
+ tripSupport: 'Soporte de Viaje'
+ },
exitSurvey: {
header: 'Antes de irte',
reasonPage: {
diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
index 1946c969cdad..cb282ba6a75f 100644
--- a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
+++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
@@ -337,6 +337,10 @@ const ProcessMoneyRequestHoldStackNavigator = createModalStackNavigator({
[SCREENS.PROCESS_MONEY_REQUEST_HOLD_ROOT]: () => require('../../../pages/ProcessMoneyRequestHoldPage').default as React.ComponentType,
});
+const TripDetailsStackNavigator = createModalStackNavigator({
+ [SCREENS.TRIP_DETAILS_ROOT]: () => require('../../../pages/TravelDetails').default as React.ComponentType,
+});
+
export {
AddPersonalBankAccountModalStackNavigator,
DetailsModalStackNavigator,
@@ -366,5 +370,6 @@ export {
TaskModalStackNavigator,
WalletStatementStackNavigator,
ProcessMoneyRequestHoldStackNavigator,
+ TripDetailsStackNavigator,
WorkspaceSettingsModalStackNavigator,
};
diff --git a/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx b/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx
index c421bdc82028..6fe101fa2b6f 100644
--- a/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx
+++ b/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx
@@ -137,6 +137,10 @@ function RightModalNavigator({navigation}: RightModalNavigatorProps) {
name="ProcessMoneyRequestHold"
component={ModalStackNavigators.ProcessMoneyRequestHoldStackNavigator}
/>
+
diff --git a/src/libs/Navigation/linkingConfig/config.ts b/src/libs/Navigation/linkingConfig/config.ts
index c9c5d47a2df3..3ba9fe355e43 100644
--- a/src/libs/Navigation/linkingConfig/config.ts
+++ b/src/libs/Navigation/linkingConfig/config.ts
@@ -585,6 +585,11 @@ const config: LinkingOptions['config'] = {
[SCREENS.PROCESS_MONEY_REQUEST_HOLD_ROOT]: ROUTES.PROCESS_MONEY_REQUEST_HOLD,
},
},
+ [SCREENS.RIGHT_MODAL.TRIP_DETAILS]: {
+ screens: {
+ [SCREENS.TRIP_DETAILS_ROOT]: ROUTES.TRAVEL_DETAILS,
+ }
+ }
},
},
diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts
index 60b2ed63ab49..3036fba61ef8 100644
--- a/src/libs/Navigation/types.ts
+++ b/src/libs/Navigation/types.ts
@@ -523,6 +523,10 @@ type ProcessMoneyRequestHoldNavigatorParamList = {
[SCREENS.PROCESS_MONEY_REQUEST_HOLD_ROOT]: undefined;
};
+type TripDetailsNavigatorParamList = {
+ [SCREENS.TRIP_DETAILS_ROOT]: undefined;
+};
+
type PrivateNotesNavigatorParamList = {
[SCREENS.PRIVATE_NOTES.LIST]: undefined;
[SCREENS.PRIVATE_NOTES.EDIT]: {
@@ -561,6 +565,7 @@ type RightModalNavigatorParamList = {
[SCREENS.RIGHT_MODAL.EDIT_REQUEST]: NavigatorScreenParams;
[SCREENS.RIGHT_MODAL.SIGN_IN]: NavigatorScreenParams;
[SCREENS.RIGHT_MODAL.PROCESS_MONEY_REQUEST_HOLD]: NavigatorScreenParams;
+ [SCREENS.RIGHT_MODAL.TRIP_DETAILS]: NavigatorScreenParams;
[SCREENS.RIGHT_MODAL.REFERRAL]: NavigatorScreenParams;
[SCREENS.RIGHT_MODAL.PRIVATE_NOTES]: NavigatorScreenParams;
};
diff --git a/src/pages/TravelDetails.tsx b/src/pages/TravelDetails.tsx
new file mode 100644
index 000000000000..a1133ea4c143
--- /dev/null
+++ b/src/pages/TravelDetails.tsx
@@ -0,0 +1,41 @@
+import HeaderWithBackButton from '@components/HeaderWithBackButton';
+import MenuItem from '@components/MenuItem';
+import ScreenWrapper from '@components/ScreenWrapper';
+import useLocalize from '@hooks/useLocalize';
+import Navigation from '@libs/Navigation/Navigation';
+import React from 'react';
+import * as Expensicons from '@components/Icon/Expensicons';
+import variables from '@styles/variables';
+import * as Link from '@userActions/Link';
+
+function TravelDetails() {
+ const {translate} = useLocalize();
+
+ return (
+
+ Navigation.goBack()}
+ />
+
+ );
+}
+
+TravelDetails.displayName = 'TravelDetails';
+
+export default TravelDetails;
\ No newline at end of file
diff --git a/src/types/onyx/TripDetails.ts b/src/types/onyx/TripDetails.ts
new file mode 100644
index 000000000000..9b651448338d
--- /dev/null
+++ b/src/types/onyx/TripDetails.ts
@@ -0,0 +1,90 @@
+type DateISO8601 = {
+ iso8601: string;
+};
+
+type BasicTripInfo = {
+ tripId: string;
+ tripName: string;
+ tripDescription: string;
+ applicationId: string;
+ startDate: DateISO8601;
+ endDate: DateISO8601;
+};
+
+type IdType = {
+ id: string;
+};
+
+type EventSummary = {
+ id: string;
+ name: string;
+ description: string;
+ startDateTime: DateISO8601;
+ endDateTime: DateISO8601;
+ location: unknown;
+ contacts: IdType[];
+ documents: unknown[];
+ bookingGuidelines: unknown[];
+ allowedBookingTypes: unknown[];
+ eventUserRsvp: unknown;
+ contactInfoList: unknown;
+ companyId: IdType;
+ runningStatus: string;
+ status: string;
+ isRemovedParticipant: boolean;
+};
+
+type TripStatus =
+ | 'PENDING'
+ | 'CONFIRMED'
+ | 'ACTIVE'
+ | 'COMPLETED'
+ | 'CANCELLED'
+ | 'REFUNDED'
+ | 'VOIDED'
+ | 'PROCESSING'
+ | 'UNCONFIRMED'
+ | 'AIRLINE_CONTROL'
+ | 'PAYMENT_DECLINED'
+ | 'SCHEDULE_CHANGE'
+ | 'UNKNOWN'
+ | 'HOLD'
+ | 'APPROVAL_REQUESTED'
+ | 'APPROVAL_DENIED'
+ | 'CANCELLATION_IN_PROGRESS'
+ | 'INOPERATIVE_STATUS'
+ | 'FLIGHT_UNCONFIRMED_STATUS';
+
+type TripBookingStatus =
+ | 'UNKNOWN_STATUS'
+ | 'PENDING_STATUS'
+ | 'CONFIRMED_STATUS'
+ | 'ACTIVE_STATUS'
+ | 'COMPLETED_STATUS'
+ | 'CANCELLED_STATUS'
+ | 'REFUNDED_STATUS'
+ | 'VOIDED_STATUS'
+ | 'PROCESSING_STATUS'
+ | 'UNCONFIRMED_STATUS'
+ | 'AIRLINE_CONTROL_STATUS'
+ | 'PAYMENT_DECLINED_STATUS'
+ | 'SCHEDULE_CHANGE_STATUS'
+ | 'HOLD_STATUS'
+ | 'APPROVAL_REQUESTED_STATUS'
+ | 'APPROVAL_DENIED_STATUS'
+ | 'CANCELLATION_IN_PROGRESS_STATUS'
+ | 'INOPERATIVE_STATUS'
+ | 'FLIGHT_UNCONFIRMED_STATUS';
+
+type TripDetails = {
+ basicTripInfo: BasicTripInfo;
+ pnrs: unknown[];
+ pendingShellPnrs: unknown[];
+ pendingManualFormPnrs: unknown[];
+ tripStatus: TripStatus;
+ tripBookingStatus: TripBookingStatus;
+ eventSummary: EventSummary;
+ simplePnrs: unknown[];
+};
+
+export type {TripDetails, EventSummary, BasicTripInfo};
\ No newline at end of file