From 5ed0bfd6dd4dbccb2625ff19b143a27003cc4f30 Mon Sep 17 00:00:00 2001 From: Sibtain Ali Date: Tue, 9 Dec 2025 03:57:27 +0500 Subject: [PATCH 1/8] add retired page --- assets/images/laptop-on-desk-deprecated.svg | 141 ++++++++++++++++++ src/CONST/index.ts | 2 + src/Expensify.tsx | 6 + .../ErrorBoundary/BaseErrorBoundary.tsx | 12 +- src/components/Icon/Illustrations.ts | 2 + .../Icon/chunks/illustrations.chunk.ts | 2 + src/languages/en.ts | 5 + src/pages/ErrorPage/DesktopAppRetiredPage.tsx | 59 ++++++++ src/styles/index.ts | 9 ++ src/styles/variables.ts | 4 + 10 files changed, 240 insertions(+), 2 deletions(-) create mode 100644 assets/images/laptop-on-desk-deprecated.svg create mode 100644 src/pages/ErrorPage/DesktopAppRetiredPage.tsx diff --git a/assets/images/laptop-on-desk-deprecated.svg b/assets/images/laptop-on-desk-deprecated.svg new file mode 100644 index 000000000000..6dfe39caa10b --- /dev/null +++ b/assets/images/laptop-on-desk-deprecated.svg @@ -0,0 +1,141 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/CONST/index.ts b/src/CONST/index.ts index cdcc879b01f4..302def64faae 100755 --- a/src/CONST/index.ts +++ b/src/CONST/index.ts @@ -1826,6 +1826,8 @@ const CONST = { // The "Upgrade" is intentional as the 426 HTTP code means "Upgrade Required" and sent by the API. We use the "Update" language everywhere else in the front end when this gets returned. UPDATE_REQUIRED: 'Upgrade Required', INTEGRATION_MESSAGE_INVALID_CREDENTIALS: 'Invalid credentials', + + DESKTOP_APP_RETIRED: 'Desktop app retired', }, ERROR_TYPE: { SOCKET: 'Expensify\\Auth\\Error\\Socket', diff --git a/src/Expensify.tsx b/src/Expensify.tsx index 1735bd11f63e..12f65d42d5b5 100644 --- a/src/Expensify.tsx +++ b/src/Expensify.tsx @@ -50,6 +50,7 @@ import './libs/telemetry/TelemetrySynchronizer'; // This lib needs to be imported, but it has nothing to export since all it contains is an Onyx connection import './libs/UnreadIndicatorUpdater'; import Visibility from './libs/Visibility'; +import getPlatform from './libs/getPlatform'; import ONYXKEYS from './ONYXKEYS'; import PopoverReportActionContextMenu from './pages/home/report/ContextMenu/PopoverReportActionContextMenu'; import * as ReportActionContextMenu from './pages/home/report/ContextMenu/ReportActionContextMenu'; @@ -119,6 +120,7 @@ function Expensify() { const [allReports] = useOnyx(ONYXKEYS.COLLECTION.REPORT, {canBeMissing: false}); const [stashedCredentials = CONST.EMPTY_OBJECT] = useOnyx(ONYXKEYS.STASHED_CREDENTIALS, {canBeMissing: true}); const [stashedSession] = useOnyx(ONYXKEYS.STASHED_SESSION, {canBeMissing: true}); + const isDesktop = getPlatform() === CONST.PLATFORM.DESKTOP; useDebugShortcut(); usePriorityMode(); @@ -354,6 +356,10 @@ function Expensify() { return null; } + if (isDesktop) { + throw new Error(CONST.ERROR.DESKTOP_APP_RETIRED) + } + if (updateRequired) { throw new Error(CONST.ERROR.UPDATE_REQUIRED); } diff --git a/src/components/ErrorBoundary/BaseErrorBoundary.tsx b/src/components/ErrorBoundary/BaseErrorBoundary.tsx index 174061679519..90b0caea234a 100644 --- a/src/components/ErrorBoundary/BaseErrorBoundary.tsx +++ b/src/components/ErrorBoundary/BaseErrorBoundary.tsx @@ -3,6 +3,7 @@ import {ErrorBoundary} from 'react-error-boundary'; import BootSplash from '@libs/BootSplash'; import GenericErrorPage from '@pages/ErrorPage/GenericErrorPage'; import UpdateRequiredView from '@pages/ErrorPage/UpdateRequiredView'; +import DesktopAppRetiredView from '@pages/ErrorPage/DesktopAppRetiredPage'; import CONST from '@src/CONST'; import {useSplashScreenStateContext} from '@src/SplashScreenStateContext'; import type {BaseErrorBoundaryProps} from './types'; @@ -23,11 +24,18 @@ function BaseErrorBoundary({logError = () => {}, errorMessage, children}: BaseEr BootSplash.hide().then(() => setSplashScreenState(CONST.BOOT_SPLASH_STATE.HIDDEN)); setErrorContent(errorObject.message); }; - const updateRequired = errorContent === CONST.ERROR.UPDATE_REQUIRED; + + let FallbackComponent = GenericErrorPage; + + if (errorContent === CONST.ERROR.DESKTOP_APP_RETIRED) { + FallbackComponent = DesktopAppRetiredView; + } else if (errorContent === CONST.ERROR.UPDATE_REQUIRED) { + FallbackComponent = UpdateRequiredView; + } return ( {children} diff --git a/src/components/Icon/Illustrations.ts b/src/components/Icon/Illustrations.ts index 0f582cab00b1..e6fbe010585e 100644 --- a/src/components/Icon/Illustrations.ts +++ b/src/components/Icon/Illustrations.ts @@ -65,6 +65,7 @@ import Mailbox from '@assets/images/simple-illustrations/simple-illustration__ma import Pencil from '@assets/images/simple-illustrations/simple-illustration__pencil.svg'; import ExpensifyApprovedLogo from '@assets/images/subscription-details__approvedlogo.svg'; import TurtleInShell from '@assets/images/turtle-in-shell.svg'; +import LaptopOnDeskDeprecated from '@assets/images/laptop-on-desk-deprecated.svg'; export { Encryption, @@ -134,4 +135,5 @@ export { PlaidCompanyCardDetail, EmptyShelves, BlueShield, + LaptopOnDeskDeprecated, }; diff --git a/src/components/Icon/chunks/illustrations.chunk.ts b/src/components/Icon/chunks/illustrations.chunk.ts index d298a21df2f9..61e7ddb06891 100644 --- a/src/components/Icon/chunks/illustrations.chunk.ts +++ b/src/components/Icon/chunks/illustrations.chunk.ts @@ -130,6 +130,7 @@ import VirtualCard from '@assets/images/simple-illustrations/simple-illustration import Workflows from '@assets/images/simple-illustrations/simple-illustration__workflows.svg'; import ExpensifyApprovedLogo from '@assets/images/subscription-details__approvedlogo.svg'; import TurtleInShell from '@assets/images/turtle-in-shell.svg'; +import LaptopOnDeskDeprecated from '@assets/images/laptop-on-desk-deprecated.svg'; // Create the illustrations object with all imported illustrations const Illustrations = { @@ -269,6 +270,7 @@ const Illustrations = { LockOpen, Mailbox, ShieldYellow, + LaptopOnDeskDeprecated, }; /** diff --git a/src/languages/en.ts b/src/languages/en.ts index 7174786dbf1d..71aa177ed9db 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -6657,6 +6657,11 @@ const translations = { }, refresh: 'Refresh', }, + desktopAppRetiredPage: { + title: 'Desktop app has been retired', + body: 'The New Expensify Mac desktop app has been retired. Moving forward, please use the web app to access your account.', + goToWeb: 'Go to web', + }, fileDownload: { success: { title: 'Downloaded!', diff --git a/src/pages/ErrorPage/DesktopAppRetiredPage.tsx b/src/pages/ErrorPage/DesktopAppRetiredPage.tsx new file mode 100644 index 000000000000..207862029593 --- /dev/null +++ b/src/pages/ErrorPage/DesktopAppRetiredPage.tsx @@ -0,0 +1,59 @@ +import React from 'react'; +import {Linking, View} from 'react-native'; +import Button from '@components/Button'; +import Icon from '@components/Icon'; +import Text from '@components/Text'; +import {useMemoizedLazyIllustrations} from '@hooks/useLazyAsset'; +import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; +import variables from '@styles/variables'; +import HeaderGap from '@components/HeaderGap'; +import CONST from '@src/CONST'; +import { useSafeAreaInsets } from 'react-native-safe-area-context'; + +function DesktopAppRetiredPage() { + const styles = useThemeStyles(); + const StyleUtils = useStyleUtils(); + const {translate} = useLocalize(); + const illustrations = useMemoizedLazyIllustrations(['LaptopOnDeskDeprecated'] as const); + const insets = useSafeAreaInsets(); + + return ( + + + + + + + + + {translate('desktopAppRetiredPage.title')} + + + + + {`${translate('desktopAppRetiredPage.body')} `} + + + + +