From b2076fdd20c513414b81fc1509af056efc79d044 Mon Sep 17 00:00:00 2001 From: Mateusz Rajski Date: Mon, 23 Sep 2024 15:46:17 +0200 Subject: [PATCH] Allow classic experience users to use NewDot travel page --- src/ONYXKEYS.ts | 4 ++++ src/libs/actions/Session/index.ts | 3 ++- src/pages/Travel/ManageTrips.tsx | 19 +++++++++++++++---- src/pages/Travel/MyTripsPage.tsx | 18 +++++++++++++++++- 4 files changed, 38 insertions(+), 6 deletions(-) diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts index 68a9ca2f8502..67adae8e5ebc 100755 --- a/src/ONYXKEYS.ts +++ b/src/ONYXKEYS.ts @@ -433,6 +433,9 @@ const ONYXKEYS = { /** Stores recently used currencies */ RECENTLY_USED_CURRENCIES: 'nvp_recentlyUsedCurrencies', + /** Decides if we should return to OldDot after booking */ + SHOULD_RETURN_TO_OLD_DOT_AFTER_BOOKING: 'shouldReturnToClassicExperienceAfterBooking', + /** Collection Keys */ COLLECTION: { DOWNLOAD: 'download_', @@ -996,6 +999,7 @@ type OnyxValuesMapping = { [ONYXKEYS.IMPORTED_SPREADSHEET]: OnyxTypes.ImportedSpreadsheet; [ONYXKEYS.LAST_ROUTE]: string; [ONYXKEYS.NVP_SHOULD_HIDE_SAVED_SEARCH_RENAME_TOOLTIP]: boolean; + [ONYXKEYS.SHOULD_RETURN_TO_OLD_DOT_AFTER_BOOKING]: boolean | undefined; }; type OnyxValues = OnyxValuesMapping & OnyxCollectionValuesMapping & OnyxFormValuesMapping & OnyxFormDraftValuesMapping; diff --git a/src/libs/actions/Session/index.ts b/src/libs/actions/Session/index.ts index ab209e9bf928..6bd805b54c43 100644 --- a/src/libs/actions/Session/index.ts +++ b/src/libs/actions/Session/index.ts @@ -482,7 +482,7 @@ function signUpUser() { function signInAfterTransitionFromOldDot(transitionURL: string) { const [route, queryParams] = transitionURL.split('?'); - const {email, authToken, encryptedAuthToken, accountID, autoGeneratedLogin, autoGeneratedPassword, clearOnyxOnStart} = Object.fromEntries( + const {email, authToken, encryptedAuthToken, accountID, autoGeneratedLogin, autoGeneratedPassword, clearOnyxOnStart, shouldReturnToOldDotAfterBooking} = Object.fromEntries( queryParams.split('&').map((param) => { const [key, value] = param.split('='); return [key, value]; @@ -494,6 +494,7 @@ function signInAfterTransitionFromOldDot(transitionURL: string) { [ONYXKEYS.SESSION]: {email, authToken, encryptedAuthToken: decodeURIComponent(encryptedAuthToken), accountID: Number(accountID)}, [ONYXKEYS.CREDENTIALS]: {autoGeneratedLogin, autoGeneratedPassword}, }).then(App.openApp); + Onyx.set(ONYXKEYS.SHOULD_RETURN_TO_OLD_DOT_AFTER_BOOKING, shouldReturnToOldDotAfterBooking === 'true'); }; if (clearOnyxOnStart === 'true') { diff --git a/src/pages/Travel/ManageTrips.tsx b/src/pages/Travel/ManageTrips.tsx index 0591d8cf2fcf..c157a17e3d26 100644 --- a/src/pages/Travel/ManageTrips.tsx +++ b/src/pages/Travel/ManageTrips.tsx @@ -1,6 +1,6 @@ import {Str} from 'expensify-common'; import React, {useState} from 'react'; -import {Linking, View} from 'react-native'; +import {Linking, NativeModules, View} from 'react-native'; import {useOnyx} from 'react-native-onyx'; import type {FeatureListItem} from '@components/FeatureList'; import FeatureList from '@components/FeatureList'; @@ -12,6 +12,7 @@ import useLocalize from '@hooks/useLocalize'; import usePolicy from '@hooks/usePolicy'; import useResponsiveLayout from '@hooks/useResponsiveLayout'; import useThemeStyles from '@hooks/useThemeStyles'; +import Log from '@libs/Log'; import Navigation from '@libs/Navigation/Navigation'; import colors from '@styles/theme/colors'; import * as Link from '@userActions/Link'; @@ -37,6 +38,7 @@ function ManageTrips() { const {translate} = useLocalize(); const [travelSettings] = useOnyx(ONYXKEYS.NVP_TRAVEL_SETTINGS); const [activePolicyID] = useOnyx(ONYXKEYS.NVP_ACTIVE_POLICY_ID); + const [shouldReturnToOldDotAfterBooking] = useOnyx(ONYXKEYS.SHOULD_RETURN_TO_OLD_DOT_AFTER_BOOKING); const [account] = useOnyx(ONYXKEYS.ACCOUNT); const policy = usePolicy(activePolicyID); @@ -78,9 +80,18 @@ function ManageTrips() { if (ctaErrorMessage) { setCtaErrorMessage(''); } - Link.openTravelDotLink(activePolicyID)?.catch(() => { - setCtaErrorMessage(translate('travel.errorMessage')); - }); + Link.openTravelDotLink(activePolicyID) + ?.then(() => { + if (!NativeModules.HybridAppModule || !shouldReturnToOldDotAfterBooking) { + return; + } + + Log.info('[HybridApp] Returning to OldDot after opening TravelDot'); + NativeModules.HybridAppModule.closeReactNativeApp(false, false); + }) + ?.catch(() => { + setCtaErrorMessage(translate('travel.errorMessage')); + }); }} ctaErrorMessage={ctaErrorMessage} illustration={LottieAnimations.TripsEmptyState} diff --git a/src/pages/Travel/MyTripsPage.tsx b/src/pages/Travel/MyTripsPage.tsx index be29e8dc8c12..565269128708 100644 --- a/src/pages/Travel/MyTripsPage.tsx +++ b/src/pages/Travel/MyTripsPage.tsx @@ -1,14 +1,29 @@ -import React from 'react'; +import React, {useCallback} from 'react'; +import {NativeModules} from 'react-native'; +import {useOnyx} from 'react-native-onyx'; import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; import usePermissions from '@hooks/usePermissions'; +import Log from '@libs/Log'; +import Navigation from '@libs/Navigation/Navigation'; +import ONYXKEYS from '@src/ONYXKEYS'; import ManageTrips from './ManageTrips'; function MyTripsPage() { const {translate} = useLocalize(); const {canUseSpotnanaTravel} = usePermissions(); + const [shouldReturnToOldDotAfterBooking] = useOnyx(ONYXKEYS.SHOULD_RETURN_TO_OLD_DOT_AFTER_BOOKING); + + const onBackButtonPress = useCallback(() => { + if (NativeModules.HybridAppModule && shouldReturnToOldDotAfterBooking) { + Log.info('[HybridApp] Returning to OldDot after closing MyTripsPage'); + NativeModules.HybridAppModule.closeReactNativeApp(false, false); + return; + } + Navigation.goBack(); + }, [shouldReturnToOldDotAfterBooking]); return (