From 3d9c90af74221f7d0c874548f2278b3641706fa1 Mon Sep 17 00:00:00 2001 From: Hans Date: Thu, 14 Nov 2024 15:24:13 +0700 Subject: [PATCH 1/9] Improve switch to Expensify Classic flow --- src/CONST.ts | 6 ++ src/ROUTES.ts | 1 + src/SCREENS.ts | 1 + src/languages/en.ts | 12 +++ src/languages/es.ts | 12 +++ .../ModalStackNavigators/index.tsx | 1 + src/libs/Navigation/linkingConfig/config.ts | 3 + src/libs/Navigation/types.ts | 1 + .../ExitSurvey/ExitSurveyBookCall.tsx | 83 +++++++++++++++++++ .../ExitSurvey/ExitSurveyConfirmPage.tsx | 12 ++- src/pages/settings/InitialSettingsPage.tsx | 12 ++- src/styles/index.ts | 8 ++ 12 files changed, 146 insertions(+), 6 deletions(-) create mode 100644 src/pages/settings/ExitSurvey/ExitSurveyBookCall.tsx diff --git a/src/CONST.ts b/src/CONST.ts index 4b2b66ab5a2d..5eeba1d6a546 100755 --- a/src/CONST.ts +++ b/src/CONST.ts @@ -5848,6 +5848,12 @@ const CONST = { DONT_UNDERSTAND: 'dontUnderstand', PREFER_CLASSIC: 'preferClassic', }, + BENEFIT: { + CHATTING_DIRECTLY: 'chattingDirectly', + EVERYTHING_MOBILE: 'everythingMobile', + TRAVEL_EXPENSE: 'travelExpense', + }, + BOOK_MEETING_LINK: 'https://calendly.com/d/cqsm-2gm-fxr/expensify-product-team', }, SESSION_STORAGE_KEYS: { diff --git a/src/ROUTES.ts b/src/ROUTES.ts index 103c4b2c3125..82b2d075bd69 100644 --- a/src/ROUTES.ts +++ b/src/ROUTES.ts @@ -257,6 +257,7 @@ const ROUTES = { }, SETTINGS_EXIT_SURVEY_REASON: 'settings/exit-survey/reason', + SETTINGS_EXIT_SURVERY_BOOK_CALL: 'settings/exit-survey/book-call', SETTINGS_EXIT_SURVEY_RESPONSE: { route: 'settings/exit-survey/response', getRoute: (reason?: ValueOf, backTo?: string) => diff --git a/src/SCREENS.ts b/src/SCREENS.ts index 9b8fe54111cf..1d0d4be0cfee 100644 --- a/src/SCREENS.ts +++ b/src/SCREENS.ts @@ -116,6 +116,7 @@ const SCREENS = { }, EXIT_SURVEY: { + BOOK_CALL: 'Settings_ExitSurvey_Book_Call', REASON: 'Settings_ExitSurvey_Reason', RESPONSE: 'Settings_ExitSurvey_Response', CONFIRM: 'Settings_ExitSurvey_Confirm', diff --git a/src/languages/en.ts b/src/languages/en.ts index d13cf61957ea..4a44320e4720 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -4928,6 +4928,18 @@ const translations = { offlineTitle: "Looks like you're stuck here...", offline: "You appear to be offline. Unfortunately, Expensify Classic doesn't work offline, but New Expensify does. If you prefer to use Expensify Classic, try again when you have an internet connection.", + quickTip: 'Quick tip...', + quickTipSubTitle: 'You can go straight to Expensify Classic by visiting expensify.com. Bookmark it for an easy shortcut!', + bookACall: 'Book a call', + noThanks: 'No thanks', + bookACallTitle: 'Would you like to speak to a product manager?', + benefits: { + [CONST.EXIT_SURVEY.BENEFIT.CHATTING_DIRECTLY]: 'Chatting directly on expenses and reports', + [CONST.EXIT_SURVEY.BENEFIT.EVERYTHING_MOBILE]: 'Ability to do everything on mobile', + [CONST.EXIT_SURVEY.BENEFIT.TRAVEL_EXPENSE]: 'Travel and expense at the speed of chat', + }, + bookACallTextTop: 'By switching to Expensify Classic, you will miss out on:', + bookACallTextBottom: 'We’d be excited to get on a call with you to understand why. You can book a call with one of our senior product managers to discuss your needs.', }, listBoundary: { errorMessage: 'An error occurred while loading more messages.', diff --git a/src/languages/es.ts b/src/languages/es.ts index d0ca8bc173bd..c04406f07ac7 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -5442,6 +5442,18 @@ const translations = { offlineTitle: 'Parece que estás atrapado aquí...', offline: 'Parece que estás desconectado. Desafortunadamente, Expensify Classic no funciona sin conexión, pero New Expensify sí. Si prefieres utilizar Expensify Classic, inténtalo de nuevo cuando tengas conexión a internet.', + quickTip: 'Consejo rápido...', + quickTipSubTitle: 'Puedes ir directamente a Expensify Classic visitando expensify.com. Márcalo como favorito para tener un acceso directo fácil.', + bookACall: 'Reservar una llamada', + noThanks: 'No, gracias', + bookACallTitle: '¿Desea hablar con un responsable de producto?', + benefits: { + [CONST.EXIT_SURVEY.BENEFIT.CHATTING_DIRECTLY]: 'Charla directa sobre gastos e informes', + [CONST.EXIT_SURVEY.BENEFIT.EVERYTHING_MOBILE]: 'Posibilidad de hacerlo todo desde el móvil', + [CONST.EXIT_SURVEY.BENEFIT.TRAVEL_EXPENSE]: 'Viajes y gastos a la velocidad del chat', + }, + bookACallTextTop: 'Al cambiar a Expensify Classic, se perderá:', + bookACallTextBottom: 'Nos encantaría hablar con usted para entender por qué. Puede concertar una llamada con uno de nuestros jefes de producto para hablar de sus necesidades.', }, listBoundary: { errorMessage: 'Se ha producido un error al cargar más mensajes.', diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx index 8a64424c8f7d..9f19c01fcdf8 100644 --- a/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx +++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx @@ -373,6 +373,7 @@ const SettingsModalStackNavigator = createModalStackNavigator require('../../../../pages/settings/Wallet/ReportCardLostPage').default, [SCREENS.KEYBOARD_SHORTCUTS]: () => require('../../../../pages/KeyboardShortcutsPage').default, [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: () => require('../../../../pages/settings/ExitSurvey/ExitSurveyReasonPage').default, + [SCREENS.SETTINGS.EXIT_SURVEY.BOOK_CALL]: () => require('../../../../pages/settings/ExitSurvey/ExitSurveyBookCall').default, [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: () => require('../../../../pages/settings/ExitSurvey/ExitSurveyResponsePage').default, [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: () => require('../../../../pages/settings/ExitSurvey/ExitSurveyConfirmPage').default, [SCREENS.WORKSPACE.ACCOUNTING.QUICKBOOKS_ONLINE_IMPORT]: () => require('../../../../pages/workspace/accounting/qbo/import/QuickbooksImportPage').default, diff --git a/src/libs/Navigation/linkingConfig/config.ts b/src/libs/Navigation/linkingConfig/config.ts index 7a5b31489764..72cc4bca036e 100644 --- a/src/libs/Navigation/linkingConfig/config.ts +++ b/src/libs/Navigation/linkingConfig/config.ts @@ -878,6 +878,9 @@ const config: LinkingOptions['config'] = { [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: { path: ROUTES.SETTINGS_EXIT_SURVEY_REASON, }, + [SCREENS.SETTINGS.EXIT_SURVEY.BOOK_CALL]: { + path: ROUTES.SETTINGS_EXIT_SURVERY_BOOK_CALL, + }, [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: { path: ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.route, }, diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts index fc9601424080..32f9003c777d 100644 --- a/src/libs/Navigation/types.ts +++ b/src/libs/Navigation/types.ts @@ -777,6 +777,7 @@ type SettingsNavigatorParamList = { }; [SCREENS.KEYBOARD_SHORTCUTS]: undefined; [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: undefined; + [SCREENS.SETTINGS.EXIT_SURVEY.BOOK_CALL]: undefined; [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: { [EXIT_SURVEY_REASON_FORM_INPUT_IDS.REASON]: ValueOf; backTo: Routes; diff --git a/src/pages/settings/ExitSurvey/ExitSurveyBookCall.tsx b/src/pages/settings/ExitSurvey/ExitSurveyBookCall.tsx new file mode 100644 index 000000000000..e268e53c87eb --- /dev/null +++ b/src/pages/settings/ExitSurvey/ExitSurveyBookCall.tsx @@ -0,0 +1,83 @@ +import React from 'react'; +import {View} from 'react-native'; +import Button from '@components/Button'; +import FixedFooter from '@components/FixedFooter'; +import HeaderWithBackButton from '@components/HeaderWithBackButton'; +import ScreenWrapper from '@components/ScreenWrapper'; +import Text from '@components/Text'; +import useLocalize from '@hooks/useLocalize'; +import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; +import Navigation from '@navigation/Navigation'; +import * as Link from '@userActions/Link'; +import * as Expensicons from '@src/components/Icon/Expensicons'; +import CONST from '@src/CONST'; +import ROUTES from '@src/ROUTES'; +import ExitSurveyOffline from './ExitSurveyOffline'; + +function ExitSurveyBookCallPage() { + const {translate} = useLocalize(); + const {isOffline} = useNetwork(); + const styles = useThemeStyles(); + + return ( + + Navigation.goBack()} + /> + + {isOffline && } + {!isOffline && ( + <> + {translate('exitSurvey.bookACallTitle')} + {translate('exitSurvey.bookACallTextTop')} + + {Object.values(CONST.EXIT_SURVEY.BENEFIT).map((value) => { + return ( + + + {translate(`exitSurvey.benefits.${value}`)} + + ); + })} + + {translate('exitSurvey.bookACallTextBottom')} + + )} + + +