From 8f4e247fca310cf7b9548d65ea8ffd9a62b3b898 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 11:12:18 -0800
Subject: [PATCH 001/305] Remove unnecessary directory

---
 src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx | 2 +-
 src/pages/settings/{AboutPage => }/AboutPage.js           | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)
 rename src/pages/settings/{AboutPage => }/AboutPage.js (99%)

diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
index b0f33af0ce2e..89365d1e0224 100644
--- a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
+++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
@@ -203,7 +203,7 @@ const SettingsModalStackNavigator = createModalStackNavigator<SettingsNavigatorP
     [SCREENS.SETTINGS.PREFERENCES.THEME]: () => require('../../../pages/settings/Preferences/ThemePage').default as React.ComponentType,
     [SCREENS.SETTINGS.CLOSE]: () => require('../../../pages/settings/Security/CloseAccountPage').default as React.ComponentType,
     [SCREENS.SETTINGS.SECURITY]: () => require('../../../pages/settings/Security/SecuritySettingsPage').default as React.ComponentType,
-    [SCREENS.SETTINGS.ABOUT]: () => require('../../../pages/settings/AboutPage/AboutPage').default as React.ComponentType,
+    [SCREENS.SETTINGS.ABOUT]: () => require('../../../pages/settings/AboutPage').default as React.ComponentType,
     [SCREENS.SETTINGS.APP_DOWNLOAD_LINKS]: () => require('../../../pages/settings/AppDownloadLinks').default as React.ComponentType,
     [SCREENS.SETTINGS.LOUNGE_ACCESS]: () => require('../../../pages/settings/Profile/LoungeAccessPage').default as React.ComponentType,
     [SCREENS.SETTINGS.WALLET.ROOT]: () => require('../../../pages/settings/Wallet/WalletPage').default as React.ComponentType,
diff --git a/src/pages/settings/AboutPage/AboutPage.js b/src/pages/settings/AboutPage.js
similarity index 99%
rename from src/pages/settings/AboutPage/AboutPage.js
rename to src/pages/settings/AboutPage.js
index a460c95cdfe6..1ec6c119a5a6 100644
--- a/src/pages/settings/AboutPage/AboutPage.js
+++ b/src/pages/settings/AboutPage.js
@@ -22,7 +22,7 @@ import * as Report from '@userActions/Report';
 import CONST from '@src/CONST';
 import ROUTES from '@src/ROUTES';
 import SCREENS from '@src/SCREENS';
-import pkg from '../../../../package.json';
+import pkg from '../../../package.json';
 
 const propTypes = {
     ...withLocalizePropTypes,

From d9d97caa2e3ceff968449684c43938eafe7fafec Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 11:55:15 -0800
Subject: [PATCH 002/305] Set up pages and navigation

---
 src/ROUTES.ts                                 | 13 ++++++++
 src/SCREENS.ts                                |  6 ++++
 .../AppNavigator/ModalStackNavigators.tsx     |  3 ++
 src/libs/Navigation/linkingConfig.ts          |  9 ++++++
 .../ExitSurvey/ExitSurveyConfirmPage.tsx      | 30 +++++++++++++++++++
 .../ExitSurvey/ExitSurveyReasonPage.tsx       | 27 +++++++++++++++++
 .../ExitSurvey/ExitSurveyResponsePage.tsx     | 27 +++++++++++++++++
 src/pages/settings/InitialSettingsPage.js     |  5 +---
 8 files changed, 116 insertions(+), 4 deletions(-)
 create mode 100644 src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
 create mode 100644 src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
 create mode 100644 src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx

diff --git a/src/ROUTES.ts b/src/ROUTES.ts
index 37003a09a0cd..b59348e5edf9 100644
--- a/src/ROUTES.ts
+++ b/src/ROUTES.ts
@@ -144,6 +144,19 @@ const ROUTES = {
     SETTINGS_STATUS_CLEAR_AFTER_DATE: 'settings/profile/status/clear-after/date',
     SETTINGS_STATUS_CLEAR_AFTER_TIME: 'settings/profile/status/clear-after/time',
 
+    SETTINGS_EXIT_SURVEY_REASON: {
+        route: 'settings/exit-survey/reason',
+        getRoute: (backTo?: string) => getUrlWithBackToParam('settings/exit-survey/reason', backTo),
+    },
+    SETTINGS_EXIT_SURVEY_RESPONSE: {
+        route: 'settings/exit-survey/response',
+        getRoute: (backTo?: string) => getUrlWithBackToParam('settings/exit-survey/response', backTo),
+    },
+    SETTINGS_EXIT_SURVEY_CONFIRM: {
+        route: 'settings/exit-survey/confirm',
+        getRoute: (backTo?: string) => getUrlWithBackToParam('settings/exit-survey/confirm', backTo),
+    },
+
     KEYBOARD_SHORTCUTS: 'keyboard-shortcuts',
 
     NEW: 'new',
diff --git a/src/SCREENS.ts b/src/SCREENS.ts
index 703cb309d641..2b630aab62c8 100644
--- a/src/SCREENS.ts
+++ b/src/SCREENS.ts
@@ -77,6 +77,12 @@ const SCREENS = {
             REPORT_VIRTUAL_CARD_FRAUD: 'Settings_Wallet_ReportVirtualCardFraud',
             CARDS_DIGITAL_DETAILS_UPDATE_ADDRESS: 'Settings_Wallet_Cards_Digital_Details_Update_Address',
         },
+
+        EXIT_SURVEY: {
+            REASON: 'Settings_ExitSurvey_Reason',
+            RESPONSE: 'Settings_ExitSurvey_Response',
+            CONFIRM: 'Settings_ExitSurvey_Confirm',
+        },
     },
     SAVE_THE_WORLD: {
         ROOT: 'SaveTheWorld_Root',
diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
index 89365d1e0224..286ccc07a615 100644
--- a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
+++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
@@ -241,6 +241,9 @@ const SettingsModalStackNavigator = createModalStackNavigator<SettingsNavigatorP
     [SCREENS.SETTINGS.TWO_FACTOR_AUTH]: () => require('../../../pages/settings/Security/TwoFactorAuth/TwoFactorAuthPage').default as React.ComponentType,
     [SCREENS.SETTINGS.REPORT_CARD_LOST_OR_DAMAGED]: () => require('../../../pages/settings/Wallet/ReportCardLostPage').default as React.ComponentType,
     [SCREENS.KEYBOARD_SHORTCUTS]: () => require('../../../pages/KeyboardShortcutsPage').default as React.ComponentType,
+    [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyReasonPage').default as React.ComponentType,
+    [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyResponsePage').default as React.ComponentType,
+    [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyConfirmPage').default as React.ComponentType,
 });
 
 const EnablePaymentsStackNavigator = createModalStackNavigator<EnablePaymentsNavigatorParamList>({
diff --git a/src/libs/Navigation/linkingConfig.ts b/src/libs/Navigation/linkingConfig.ts
index 1a495e92eb80..28955156da05 100644
--- a/src/libs/Navigation/linkingConfig.ts
+++ b/src/libs/Navigation/linkingConfig.ts
@@ -274,6 +274,15 @@ const linkingConfig: LinkingOptions<RootStackParamList> = {
                             [SCREENS.KEYBOARD_SHORTCUTS]: {
                                 path: ROUTES.KEYBOARD_SHORTCUTS,
                             },
+                            [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: {
+                                path: ROUTES.SETTINGS_EXIT_SURVEY_REASON.route,
+                            },
+                            [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: {
+                                path: ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.route,
+                            },
+                            [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: {
+                                path: ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM.route,
+                            },
                         },
                     },
                     [SCREENS.RIGHT_MODAL.PRIVATE_NOTES]: {
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
new file mode 100644
index 000000000000..ff4e39113581
--- /dev/null
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -0,0 +1,30 @@
+import React from 'react';
+import Button from '@components/Button';
+import HeaderWithBackButton from '@components/HeaderWithBackButton';
+import ScreenWrapper from '@components/ScreenWrapper';
+import Text from '@components/Text';
+import Navigation from '@navigation/Navigation';
+import * as Link from '@userActions/Link';
+import CONST from '@src/CONST';
+
+function ExitSurveyReasonPage() {
+    return (
+        <ScreenWrapper testID={ExitSurveyReasonPage.displayName}>
+            <HeaderWithBackButton
+                title="Before you go"
+                onBackButtonPress={() => Navigation.goBack()}
+            />
+            <Text>Confirm page</Text>
+            <Button
+                text="Next"
+                onPress={() => {
+                    Link.openOldDotLink(CONST.OLDDOT_URLS.INBOX);
+                }}
+            />
+        </ScreenWrapper>
+    );
+}
+
+ExitSurveyReasonPage.displayName = 'ExitSurveyReasonPage';
+
+export default ExitSurveyReasonPage;
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
new file mode 100644
index 000000000000..8d6d9289a78d
--- /dev/null
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -0,0 +1,27 @@
+import React from 'react';
+import Button from '@components/Button';
+import HeaderWithBackButton from '@components/HeaderWithBackButton';
+import ScreenWrapper from '@components/ScreenWrapper';
+import Text from '@components/Text';
+import Navigation from '@navigation/Navigation';
+import ROUTES from '@src/ROUTES';
+
+function ExitSurveyReasonPage() {
+    return (
+        <ScreenWrapper testID={ExitSurveyReasonPage.displayName}>
+            <HeaderWithBackButton
+                title="Before you go"
+                onBackButtonPress={() => Navigation.goBack()}
+            />
+            <Text>Reason page</Text>
+            <Button
+                text="Next"
+                onPress={() => Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(ROUTES.SETTINGS))}
+            />
+        </ScreenWrapper>
+    );
+}
+
+ExitSurveyReasonPage.displayName = 'ExitSurveyReasonPage';
+
+export default ExitSurveyReasonPage;
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
new file mode 100644
index 000000000000..f30056b11752
--- /dev/null
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -0,0 +1,27 @@
+import React from 'react';
+import Button from '@components/Button';
+import HeaderWithBackButton from '@components/HeaderWithBackButton';
+import ScreenWrapper from '@components/ScreenWrapper';
+import Text from '@components/Text';
+import Navigation from '@navigation/Navigation';
+import ROUTES from '@src/ROUTES';
+
+function ExitSurveyReasonPage() {
+    return (
+        <ScreenWrapper testID={ExitSurveyReasonPage.displayName}>
+            <HeaderWithBackButton
+                title="Before you go"
+                onBackButtonPress={() => Navigation.goBack()}
+            />
+            <Text>Response page</Text>
+            <Button
+                text="Next"
+                onPress={() => Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM.getRoute(ROUTES.SETTINGS_EXIT_SURVEY_REASON.route))}
+            />
+        </ScreenWrapper>
+    );
+}
+
+ExitSurveyReasonPage.displayName = 'ExitSurveyReasonPage';
+
+export default ExitSurveyReasonPage;
diff --git a/src/pages/settings/InitialSettingsPage.js b/src/pages/settings/InitialSettingsPage.js
index 6e310b9a62bd..239f41321862 100755
--- a/src/pages/settings/InitialSettingsPage.js
+++ b/src/pages/settings/InitialSettingsPage.js
@@ -267,11 +267,8 @@ function InitialSettingsPage(props) {
                 translationKey: 'initialSettingsPage.goToExpensifyClassic',
                 icon: Expensicons.NewExpensify,
                 action: () => {
-                    Link.openOldDotLink(CONST.OLDDOT_URLS.INBOX);
+                    Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_REASON.route);
                 },
-                shouldShowRightIcon: true,
-                iconRight: Expensicons.NewWindow,
-                link: Link.buildOldDotURL(CONST.OLDDOT_URLS.INBOX),
             },
             {
                 translationKey: 'initialSettingsPage.signOut',

From 835c2da71ce6751f5d267d69450424b457f8787e Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 15:27:08 -0800
Subject: [PATCH 003/305] Build basic layout for reason page

---
 src/ONYXKEYS.ts                               |  2 +
 .../ExitSurvey/ExitSurveyReasonPage.tsx       | 61 ++++++++++++++++---
 2 files changed, 56 insertions(+), 7 deletions(-)

diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts
index 40a43d8195de..1ae900283002 100755
--- a/src/ONYXKEYS.ts
+++ b/src/ONYXKEYS.ts
@@ -350,6 +350,8 @@ const ONYXKEYS = {
         REPORT_VIRTUAL_CARD_FRAUD_DRAFT: 'reportVirtualCardFraudFormDraft',
         GET_PHYSICAL_CARD_FORM: 'getPhysicalCardForm',
         GET_PHYSICAL_CARD_FORM_DRAFT: 'getPhysicalCardFormDraft',
+        EXIT_SURVEY_REASON_FORM: 'exitSurveyReasonForm',
+        EXIT_SURVEY_RESPONSE_FORM: 'exitSurveyResponseForm',
     },
 } as const;
 
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index 8d6d9289a78d..057c24892393 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -1,23 +1,70 @@
-import React from 'react';
-import Button from '@components/Button';
+import React, {useMemo, useState} from 'react';
+import FormProvider from '@components/Form/FormProvider';
+import InputWrapper from '@components/Form/InputWrapper';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
+import type {Choice} from '@components/RadioButtons';
+import RadioButtons from '@components/RadioButtons';
 import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
+import useLocalize from '@hooks/useLocalize';
+import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
+import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 
 function ExitSurveyReasonPage() {
+    const {translate} = useLocalize();
+    const styles = useThemeStyles();
+
+    // FIXME: use the reason!
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    const [reason, setReason] = useState<string>();
+
+    const reasons: Choice[] = useMemo(
+        () => [
+            {
+                label: 'Choice A',
+                value: 'choiceA',
+            },
+            {
+                label: 'Choice B',
+                value: 'choiceB',
+            },
+            {
+                label: 'Choice C',
+                value: 'choiceC',
+            },
+        ],
+        [],
+    );
+
     return (
         <ScreenWrapper testID={ExitSurveyReasonPage.displayName}>
             <HeaderWithBackButton
                 title="Before you go"
                 onBackButtonPress={() => Navigation.goBack()}
             />
-            <Text>Reason page</Text>
-            <Button
-                text="Next"
-                onPress={() => Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(ROUTES.SETTINGS))}
-            />
+            {/* @ts-expect-error - FormProvider is not yet migrated to TS */}
+            <FormProvider
+                formID={ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM}
+                style={[styles.flex1, styles.mt3, styles.mh5]}
+                // TODO: validation?
+                validate={() => {}}
+                onSubmit={() => Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(ROUTES.SETTINGS))}
+                submitButtonText={translate('common.next')}
+                shouldValidateOnBlur
+                shouldValidateOnChange
+            >
+                <Text style={styles.headerAnonymousFooter}>Please tell us why you&apos;re leaving</Text>
+                <Text style={styles.mt2}>Before you go, please tell us why you&apos;d like to switch to Expensify Classic</Text>
+                <InputWrapper
+                    // @ts-expect-error - InputWrapper is not yet migrated to TS
+                    InputComponent={RadioButtons}
+                    inputID="reason"
+                    items={reasons}
+                    onPress={(value: string) => setReason(value)}
+                />
+            </FormProvider>
         </ScreenWrapper>
     );
 }

From e77baf791e448c65c1c68af2dcc714714fc2036f Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 15:38:10 -0800
Subject: [PATCH 004/305] Add translations for copy

---
 src/languages/en.ts | 19 +++++++++++++++++++
 src/languages/es.ts | 19 +++++++++++++++++++
 2 files changed, 38 insertions(+)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index b6da38df21a0..17f01c5a7c83 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -2119,4 +2119,23 @@ export default {
         taxRateChanged: 'Tax rate was modified',
         taxRequired: 'Missing tax rate',
     },
+    exitSurvey: {
+        header: 'Before you go',
+        title: 'Before you go, please tell us why you’d like to switch to Expensify Classic.',
+        reasons: {
+            // TODO: use consts for these keys
+            featureNotAvailable: "I need a feature that's only available in Expensify Classic.",
+            dontUnderstand: "I don't understand how to use New Expensify.",
+            preferClassic: 'I understand how to use New Expensify, but I prefer Expensify Classic.',
+        },
+        prompts: {
+            featureNotAvailable: "What feature do you need that isn't available in New Expensify?",
+            dontUnderstand: 'What are you trying to do?',
+            preferClassic: 'Why to you prefer Classic Expensify?',
+        },
+        thankYou: 'Your responses will help us build a better product to get stuff done. Thank you so much!',
+        goToExpensifyClassic: 'Switch to Expensify Classic',
+        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.",
+    },
 } satisfies TranslationBase;
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 2478c8ba8bd2..1b7011a3310b 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2608,4 +2608,23 @@ export default {
         taxRateChanged: 'La tasa de impuesto fue modificada',
         taxRequired: 'Falta tasa de impuesto',
     },
+    exitSurvey: {
+        header: 'Antes de irte',
+        title: 'Antes de irte, por favor dinos por qué te gustaría cambiarte a Expensify Classic.',
+        reasons: {
+            // TODO: use consts for these keys
+            featureNotAvailable: 'Necesito una función que sólo está disponible en Expensify Classic.',
+            dontUnderstand: 'No entiendo cómo usar New Expensify.',
+            preferClassic: 'Entiendo cómo usar New Expensify, pero prefiero Expensify Classic.',
+        },
+        prompts: {
+            featureNotAvailable: '¿Qué función necesitas que no esté disponible en New Expensify?',
+            dontUnderstand: '¿Qué estás tratando de hacer?',
+            preferClassic: '¿Por qué prefieres Expensify Classic?',
+        },
+        thankYou: 'Sus respuestas nos ayudarán a crear un mejor producto para hacer las cosas bien. ¡Muchas gracias!',
+        goToExpensifyClassic: 'Cambiar a Expensify Classic',
+        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.',
+    },
 } satisfies EnglishTranslation;

From a566335f946d3dcbde78b79fe3eb7583f5f2fac4 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 15:41:52 -0800
Subject: [PATCH 005/305] Add constants for reasons

---
 src/CONST.ts        |  6 ++++++
 src/languages/en.ts | 12 ++++++------
 src/languages/es.ts | 12 ++++++------
 3 files changed, 18 insertions(+), 12 deletions(-)

diff --git a/src/CONST.ts b/src/CONST.ts
index accce6e92555..186fafaf4f22 100755
--- a/src/CONST.ts
+++ b/src/CONST.ts
@@ -3131,6 +3131,12 @@ const CONST = {
     },
 
     MINI_CONTEXT_MENU_MAX_ITEMS: 4,
+
+    EXIT_SURVEY_REASONS: {
+        FEATURE_NOT_AVAILABLE: 'featureNotAvailable',
+        DONT_UNDERSTAND: 'dontUnderstand',
+        PREFER_CLASSIC: 'preferClassic',
+    },
 } as const;
 
 export default CONST;
diff --git a/src/languages/en.ts b/src/languages/en.ts
index 17f01c5a7c83..f2881a70551d 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -2124,14 +2124,14 @@ export default {
         title: 'Before you go, please tell us why you’d like to switch to Expensify Classic.',
         reasons: {
             // TODO: use consts for these keys
-            featureNotAvailable: "I need a feature that's only available in Expensify Classic.",
-            dontUnderstand: "I don't understand how to use New Expensify.",
-            preferClassic: 'I understand how to use New Expensify, but I prefer Expensify Classic.',
+            [CONST.EXIT_SURVEY_REASONS.FEATURE_NOT_AVAILABLE]: "I need a feature that's only available in Expensify Classic.",
+            [CONST.EXIT_SURVEY_REASONS.DONT_UNDERSTAND]: "I don't understand how to use New Expensify.",
+            [CONST.EXIT_SURVEY_REASONS.PREFER_CLASSIC]: 'I understand how to use New Expensify, but I prefer Expensify Classic.',
         },
         prompts: {
-            featureNotAvailable: "What feature do you need that isn't available in New Expensify?",
-            dontUnderstand: 'What are you trying to do?',
-            preferClassic: 'Why to you prefer Classic Expensify?',
+            [CONST.EXIT_SURVEY_REASONS.FEATURE_NOT_AVAILABLE]: "What feature do you need that isn't available in New Expensify?",
+            [CONST.EXIT_SURVEY_REASONS.DONT_UNDERSTAND]: 'What are you trying to do?',
+            [CONST.EXIT_SURVEY_REASONS.PREFER_CLASSIC]: 'Why to you prefer Classic Expensify?',
         },
         thankYou: 'Your responses will help us build a better product to get stuff done. Thank you so much!',
         goToExpensifyClassic: 'Switch to Expensify Classic',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 1b7011a3310b..6e20ede364ea 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2613,14 +2613,14 @@ export default {
         title: 'Antes de irte, por favor dinos por qué te gustaría cambiarte a Expensify Classic.',
         reasons: {
             // TODO: use consts for these keys
-            featureNotAvailable: 'Necesito una función que sólo está disponible en Expensify Classic.',
-            dontUnderstand: 'No entiendo cómo usar New Expensify.',
-            preferClassic: 'Entiendo cómo usar New Expensify, pero prefiero Expensify Classic.',
+            [CONST.EXIT_SURVEY_REASONS.FEATURE_NOT_AVAILABLE]: 'Necesito una función que sólo está disponible en Expensify Classic.',
+            [CONST.EXIT_SURVEY_REASONS.DONT_UNDERSTAND]: 'No entiendo cómo usar New Expensify.',
+            [CONST.EXIT_SURVEY_REASONS.PREFER_CLASSIC]: 'Entiendo cómo usar New Expensify, pero prefiero Expensify Classic.',
         },
         prompts: {
-            featureNotAvailable: '¿Qué función necesitas que no esté disponible en New Expensify?',
-            dontUnderstand: '¿Qué estás tratando de hacer?',
-            preferClassic: '¿Por qué prefieres Expensify Classic?',
+            [CONST.EXIT_SURVEY_REASONS.FEATURE_NOT_AVAILABLE]: '¿Qué función necesitas que no esté disponible en New Expensify?',
+            [CONST.EXIT_SURVEY_REASONS.DONT_UNDERSTAND]: '¿Qué estás tratando de hacer?',
+            [CONST.EXIT_SURVEY_REASONS.PREFER_CLASSIC]: '¿Por qué prefieres Expensify Classic?',
         },
         thankYou: 'Sus respuestas nos ayudarán a crear un mejor producto para hacer las cosas bien. ¡Muchas gracias!',
         goToExpensifyClassic: 'Cambiar a Expensify Classic',

From d043c79a5644cad69b5bf8946fe5ca6979ce1f11 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 16:14:54 -0800
Subject: [PATCH 006/305] Use correct reasons from CONST in reasons page

---
 src/ROUTES.ts                                 |  2 +-
 src/libs/Navigation/types.ts                  |  5 +++
 .../ExitSurvey/ExitSurveyReasonPage.tsx       | 37 ++++++++-----------
 3 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/src/ROUTES.ts b/src/ROUTES.ts
index b59348e5edf9..02036e4824d3 100644
--- a/src/ROUTES.ts
+++ b/src/ROUTES.ts
@@ -150,7 +150,7 @@ const ROUTES = {
     },
     SETTINGS_EXIT_SURVEY_RESPONSE: {
         route: 'settings/exit-survey/response',
-        getRoute: (backTo?: string) => getUrlWithBackToParam('settings/exit-survey/response', backTo),
+        getRoute: (reason: ValueOf<typeof CONST.EXIT_SURVEY_REASONS>, backTo?: string) => getUrlWithBackToParam(`settings/exit-survey/response&reason=${encodeURIComponent(reason)}`, backTo),
     },
     SETTINGS_EXIT_SURVEY_CONFIRM: {
         route: 'settings/exit-survey/confirm',
diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts
index a1cbb562997e..6da0bc36d7e0 100644
--- a/src/libs/Navigation/types.ts
+++ b/src/libs/Navigation/types.ts
@@ -124,6 +124,11 @@ type SettingsNavigatorParamList = {
     [SCREENS.SETTINGS.TWO_FACTOR_AUTH]: undefined;
     [SCREENS.SETTINGS.REPORT_CARD_LOST_OR_DAMAGED]: undefined;
     [SCREENS.KEYBOARD_SHORTCUTS]: undefined;
+    [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: () => undefined;
+    [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: () => {
+        reason: ValueOf<typeof CONST.EXIT_SURVEY_REASONS>;
+    };
+    [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: () => undefined;
 };
 
 type NewChatNavigatorParamList = {
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index 057c24892393..a50920e4b994 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -1,4 +1,5 @@
 import React, {useMemo, useState} from 'react';
+import type {ValueOf} from 'type-fest';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
@@ -9,6 +10,7 @@ import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
+import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 
@@ -16,26 +18,14 @@ function ExitSurveyReasonPage() {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
 
-    // FIXME: use the reason!
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    const [reason, setReason] = useState<string>();
-
+    const [reason, setReason] = useState<ValueOf<typeof CONST.EXIT_SURVEY_REASONS>>();
     const reasons: Choice[] = useMemo(
-        () => [
-            {
-                label: 'Choice A',
-                value: 'choiceA',
-            },
-            {
-                label: 'Choice B',
-                value: 'choiceB',
-            },
-            {
-                label: 'Choice C',
-                value: 'choiceC',
-            },
-        ],
-        [],
+        () =>
+            Object.values(CONST.EXIT_SURVEY_REASONS).map((value) => ({
+                value,
+                label: translate(`exitSurvey.reasons.${value}`),
+            })),
+        [translate],
     );
 
     return (
@@ -50,7 +40,12 @@ function ExitSurveyReasonPage() {
                 style={[styles.flex1, styles.mt3, styles.mh5]}
                 // TODO: validation?
                 validate={() => {}}
-                onSubmit={() => Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(ROUTES.SETTINGS))}
+                onSubmit={() => {
+                    if (!reason) {
+                        return;
+                    }
+                    Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(reason, ROUTES.SETTINGS));
+                }}
                 submitButtonText={translate('common.next')}
                 shouldValidateOnBlur
                 shouldValidateOnChange
@@ -62,7 +57,7 @@ function ExitSurveyReasonPage() {
                     InputComponent={RadioButtons}
                     inputID="reason"
                     items={reasons}
-                    onPress={(value: string) => setReason(value)}
+                    onPress={(value: ValueOf<typeof CONST.EXIT_SURVEY_REASONS>) => setReason(value)}
                 />
             </FormProvider>
         </ScreenWrapper>

From f5e2ded82a43357c5c013d0fb7356f3658159299 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 16:31:18 -0800
Subject: [PATCH 007/305] Fix radio button styles

---
 src/components/RadioButtonWithLabel.tsx                | 2 +-
 src/components/RadioButtons.tsx                        | 4 +++-
 src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx | 3 ++-
 3 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/components/RadioButtonWithLabel.tsx b/src/components/RadioButtonWithLabel.tsx
index f4bad4c082a7..03dbda4417ef 100644
--- a/src/components/RadioButtonWithLabel.tsx
+++ b/src/components/RadioButtonWithLabel.tsx
@@ -54,7 +54,7 @@ function RadioButtonWithLabel({LabelComponent, style, label = '', hasError = fal
                     accessible={false}
                     onPress={onPress}
                     style={[styles.flexRow, styles.flexWrap, styles.flexShrink1, styles.alignItemsCenter]}
-                    wrapperStyle={[styles.ml3, styles.pr2, styles.w100]}
+                    wrapperStyle={[styles.flex1, styles.ml3, styles.pr2]}
                     // disable hover style when disabled
                     hoverDimmingValue={0.8}
                     pressDimmingValue={0.5}
diff --git a/src/components/RadioButtons.tsx b/src/components/RadioButtons.tsx
index cb6843af65c0..2f7765484c19 100644
--- a/src/components/RadioButtons.tsx
+++ b/src/components/RadioButtons.tsx
@@ -1,11 +1,13 @@
 import React, {useState} from 'react';
 import {View} from 'react-native';
+import type {StyleProp, ViewStyle} from 'react-native';
 import useThemeStyles from '@hooks/useThemeStyles';
 import RadioButtonWithLabel from './RadioButtonWithLabel';
 
 type Choice = {
     label: string;
     value: string;
+    style?: StyleProp<ViewStyle>;
 };
 
 type RadioButtonsProps = {
@@ -26,7 +28,7 @@ function RadioButtons({items, onPress}: RadioButtonsProps) {
                 <RadioButtonWithLabel
                     key={item.value}
                     isChecked={item.value === checkedValue}
-                    style={styles.mt4}
+                    style={[styles.mt4, item.style]}
                     onPress={() => {
                         setCheckedValue(item.value);
                         return onPress(item.value);
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index a50920e4b994..d93b0d8d6a66 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -24,8 +24,9 @@ function ExitSurveyReasonPage() {
             Object.values(CONST.EXIT_SURVEY_REASONS).map((value) => ({
                 value,
                 label: translate(`exitSurvey.reasons.${value}`),
+                style: styles.mt6,
             })),
-        [translate],
+        [styles, translate],
     );
 
     return (

From 1f1b22fed466b9291f0e3c4117520e33a110ca93 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 16:57:02 -0800
Subject: [PATCH 008/305] Implement validation in reason page

---
 src/components/RadioButtons.tsx               | 38 +++++++++++--------
 src/components/SingleChoiceQuestion.tsx       |  3 +-
 .../ExitSurvey/ExitSurveyReasonPage.tsx       | 14 +++++--
 3 files changed, 35 insertions(+), 20 deletions(-)

diff --git a/src/components/RadioButtons.tsx b/src/components/RadioButtons.tsx
index 2f7765484c19..0055f23ca29d 100644
--- a/src/components/RadioButtons.tsx
+++ b/src/components/RadioButtons.tsx
@@ -2,6 +2,8 @@ import React, {useState} from 'react';
 import {View} from 'react-native';
 import type {StyleProp, ViewStyle} from 'react-native';
 import useThemeStyles from '@hooks/useThemeStyles';
+import type {MaybePhraseKey} from '@libs/Localize';
+import FormHelpMessage from './FormHelpMessage';
 import RadioButtonWithLabel from './RadioButtonWithLabel';
 
 type Choice = {
@@ -16,27 +18,33 @@ type RadioButtonsProps = {
 
     /** Callback to fire when selecting a radio button */
     onPress: (value: string) => void;
+
+    /** Potential error text provided by a form InputWrapper */
+    errorText?: MaybePhraseKey;
 };
 
-function RadioButtons({items, onPress}: RadioButtonsProps) {
+function RadioButtons({items, onPress, errorText}: RadioButtonsProps) {
     const styles = useThemeStyles();
     const [checkedValue, setCheckedValue] = useState('');
 
     return (
-        <View style={styles.mb3}>
-            {items.map((item) => (
-                <RadioButtonWithLabel
-                    key={item.value}
-                    isChecked={item.value === checkedValue}
-                    style={[styles.mt4, item.style]}
-                    onPress={() => {
-                        setCheckedValue(item.value);
-                        return onPress(item.value);
-                    }}
-                    label={item.label}
-                />
-            ))}
-        </View>
+        <>
+            <View style={styles.mb3}>
+                {items.map((item) => (
+                    <RadioButtonWithLabel
+                        key={item.value}
+                        isChecked={item.value === checkedValue}
+                        style={[styles.mt4, item.style]}
+                        onPress={() => {
+                            setCheckedValue(item.value);
+                            return onPress(item.value);
+                        }}
+                        label={item.label}
+                    />
+                ))}
+            </View>
+            {!!errorText && <FormHelpMessage message={errorText} />}
+        </>
     );
 }
 
diff --git a/src/components/SingleChoiceQuestion.tsx b/src/components/SingleChoiceQuestion.tsx
index c8bf783032ad..3ff844dd80e9 100644
--- a/src/components/SingleChoiceQuestion.tsx
+++ b/src/components/SingleChoiceQuestion.tsx
@@ -4,7 +4,6 @@ import React, {forwardRef} from 'react';
 import type {Text as RNText} from 'react-native';
 import useThemeStyles from '@hooks/useThemeStyles';
 import type {MaybePhraseKey} from '@libs/Localize';
-import FormHelpMessage from './FormHelpMessage';
 import type {Choice} from './RadioButtons';
 import RadioButtons from './RadioButtons';
 import Text from './Text';
@@ -32,8 +31,8 @@ function SingleChoiceQuestion({prompt, errorText, possibleAnswers, currentQuesti
                 items={possibleAnswers}
                 key={currentQuestionIndex}
                 onPress={onInputChange}
+                errorText={errorText}
             />
-            <FormHelpMessage message={errorText} />
         </>
     );
 }
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index d93b0d8d6a66..cfd1ccf1ae33 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -14,6 +14,8 @@ import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 
+const REASON_INPUT_ID = 'reason';
+
 function ExitSurveyReasonPage() {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
@@ -39,8 +41,14 @@ function ExitSurveyReasonPage() {
             <FormProvider
                 formID={ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM}
                 style={[styles.flex1, styles.mt3, styles.mh5]}
-                // TODO: validation?
-                validate={() => {}}
+                validate={() => {
+                    if (reason) {
+                        return {};
+                    }
+                    return {
+                        [REASON_INPUT_ID]: translate('common.error.fieldRequired'),
+                    };
+                }}
                 onSubmit={() => {
                     if (!reason) {
                         return;
@@ -56,7 +64,7 @@ function ExitSurveyReasonPage() {
                 <InputWrapper
                     // @ts-expect-error - InputWrapper is not yet migrated to TS
                     InputComponent={RadioButtons}
-                    inputID="reason"
+                    inputID={REASON_INPUT_ID}
                     items={reasons}
                     onPress={(value: ValueOf<typeof CONST.EXIT_SURVEY_REASONS>) => setReason(value)}
                 />

From 6ccfdd802af41bfb44d78c61c6106c9b7ca34495 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 17:03:11 -0800
Subject: [PATCH 009/305] Simplify routes

---
 src/ROUTES.ts                                        | 12 +++---------
 src/libs/Navigation/linkingConfig.ts                 |  4 ++--
 .../settings/ExitSurvey/ExitSurveyReasonPage.tsx     |  2 +-
 .../settings/ExitSurvey/ExitSurveyResponsePage.tsx   |  2 +-
 src/pages/settings/InitialSettingsPage.js            |  2 +-
 5 files changed, 8 insertions(+), 14 deletions(-)

diff --git a/src/ROUTES.ts b/src/ROUTES.ts
index 02036e4824d3..c003c3340951 100644
--- a/src/ROUTES.ts
+++ b/src/ROUTES.ts
@@ -144,18 +144,12 @@ const ROUTES = {
     SETTINGS_STATUS_CLEAR_AFTER_DATE: 'settings/profile/status/clear-after/date',
     SETTINGS_STATUS_CLEAR_AFTER_TIME: 'settings/profile/status/clear-after/time',
 
-    SETTINGS_EXIT_SURVEY_REASON: {
-        route: 'settings/exit-survey/reason',
-        getRoute: (backTo?: string) => getUrlWithBackToParam('settings/exit-survey/reason', backTo),
-    },
+    SETTINGS_EXIT_SURVEY_REASON: 'settings/exit-survey/reason',
     SETTINGS_EXIT_SURVEY_RESPONSE: {
         route: 'settings/exit-survey/response',
-        getRoute: (reason: ValueOf<typeof CONST.EXIT_SURVEY_REASONS>, backTo?: string) => getUrlWithBackToParam(`settings/exit-survey/response&reason=${encodeURIComponent(reason)}`, backTo),
-    },
-    SETTINGS_EXIT_SURVEY_CONFIRM: {
-        route: 'settings/exit-survey/confirm',
-        getRoute: (backTo?: string) => getUrlWithBackToParam('settings/exit-survey/confirm', backTo),
+        getRoute: (reason: ValueOf<typeof CONST.EXIT_SURVEY_REASONS>) => `settings/exit-survey/response?reason=${encodeURIComponent(reason)}` as const,
     },
+    SETTINGS_EXIT_SURVEY_CONFIRM: 'settings/exit-survey/confirm',
 
     KEYBOARD_SHORTCUTS: 'keyboard-shortcuts',
 
diff --git a/src/libs/Navigation/linkingConfig.ts b/src/libs/Navigation/linkingConfig.ts
index 28955156da05..bbb7b58a3121 100644
--- a/src/libs/Navigation/linkingConfig.ts
+++ b/src/libs/Navigation/linkingConfig.ts
@@ -275,13 +275,13 @@ const linkingConfig: LinkingOptions<RootStackParamList> = {
                                 path: ROUTES.KEYBOARD_SHORTCUTS,
                             },
                             [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: {
-                                path: ROUTES.SETTINGS_EXIT_SURVEY_REASON.route,
+                                path: ROUTES.SETTINGS_EXIT_SURVEY_REASON,
                             },
                             [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: {
                                 path: ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.route,
                             },
                             [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: {
-                                path: ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM.route,
+                                path: ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM,
                             },
                         },
                     },
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index cfd1ccf1ae33..2e1be39baa9f 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -53,7 +53,7 @@ function ExitSurveyReasonPage() {
                     if (!reason) {
                         return;
                     }
-                    Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(reason, ROUTES.SETTINGS));
+                    Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(reason));
                 }}
                 submitButtonText={translate('common.next')}
                 shouldValidateOnBlur
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index f30056b11752..4cb40b935c5d 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -16,7 +16,7 @@ function ExitSurveyReasonPage() {
             <Text>Response page</Text>
             <Button
                 text="Next"
-                onPress={() => Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM.getRoute(ROUTES.SETTINGS_EXIT_SURVEY_REASON.route))}
+                onPress={() => Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM)}
             />
         </ScreenWrapper>
     );
diff --git a/src/pages/settings/InitialSettingsPage.js b/src/pages/settings/InitialSettingsPage.js
index 239f41321862..66d2a2b820e5 100755
--- a/src/pages/settings/InitialSettingsPage.js
+++ b/src/pages/settings/InitialSettingsPage.js
@@ -267,7 +267,7 @@ function InitialSettingsPage(props) {
                 translationKey: 'initialSettingsPage.goToExpensifyClassic',
                 icon: Expensicons.NewExpensify,
                 action: () => {
-                    Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_REASON.route);
+                    Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_REASON);
                 },
             },
             {

From 344bd5eb2c17a26aacb7b92ef7e249d5e95d5d26 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 17:10:54 -0800
Subject: [PATCH 010/305] Fix skeletons of response and confirm page

---
 .../settings/ExitSurvey/ExitSurveyConfirmPage.tsx     |  8 ++++----
 .../settings/ExitSurvey/ExitSurveyResponsePage.tsx    | 11 +++++++----
 2 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index ff4e39113581..a0fe2aa845d6 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -7,9 +7,9 @@ import Navigation from '@navigation/Navigation';
 import * as Link from '@userActions/Link';
 import CONST from '@src/CONST';
 
-function ExitSurveyReasonPage() {
+function ExitSurveyConfirmPage() {
     return (
-        <ScreenWrapper testID={ExitSurveyReasonPage.displayName}>
+        <ScreenWrapper testID={ExitSurveyConfirmPage.displayName}>
             <HeaderWithBackButton
                 title="Before you go"
                 onBackButtonPress={() => Navigation.goBack()}
@@ -25,6 +25,6 @@ function ExitSurveyReasonPage() {
     );
 }
 
-ExitSurveyReasonPage.displayName = 'ExitSurveyReasonPage';
+ExitSurveyConfirmPage.displayName = 'ExitSurveyConfirmPage';
 
-export default ExitSurveyReasonPage;
+export default ExitSurveyConfirmPage;
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 4cb40b935c5d..2fbdafdc97dc 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -3,12 +3,15 @@ import Button from '@components/Button';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
+import useLocalize from '@hooks/useLocalize';
 import Navigation from '@navigation/Navigation';
 import ROUTES from '@src/ROUTES';
 
-function ExitSurveyReasonPage() {
+function ExitSurveyResponsePage() {
+    const {translate} = useLocalize();
+
     return (
-        <ScreenWrapper testID={ExitSurveyReasonPage.displayName}>
+        <ScreenWrapper testID={ExitSurveyResponsePage.displayName}>
             <HeaderWithBackButton
                 title="Before you go"
                 onBackButtonPress={() => Navigation.goBack()}
@@ -22,6 +25,6 @@ function ExitSurveyReasonPage() {
     );
 }
 
-ExitSurveyReasonPage.displayName = 'ExitSurveyReasonPage';
+ExitSurveyResponsePage.displayName = 'ExitSurveyResponsePage';
 
-export default ExitSurveyReasonPage;
+export default ExitSurveyResponsePage;

From 138e14c4cc3de9d80da91d8c00b4359161104e45 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 17:12:28 -0800
Subject: [PATCH 011/305] Localize page headers

---
 src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx  | 5 ++++-
 src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx   | 2 +-
 src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx | 2 +-
 3 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index a0fe2aa845d6..a7d2ebad8214 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -3,15 +3,18 @@ import Button from '@components/Button';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
+import useLocalize from '@hooks/useLocalize';
 import Navigation from '@navigation/Navigation';
 import * as Link from '@userActions/Link';
 import CONST from '@src/CONST';
 
 function ExitSurveyConfirmPage() {
+    const {translate} = useLocalize();
+
     return (
         <ScreenWrapper testID={ExitSurveyConfirmPage.displayName}>
             <HeaderWithBackButton
-                title="Before you go"
+                title={translate('exitSurvey.header')}
                 onBackButtonPress={() => Navigation.goBack()}
             />
             <Text>Confirm page</Text>
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index 2e1be39baa9f..efc9c5ffa150 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -34,7 +34,7 @@ function ExitSurveyReasonPage() {
     return (
         <ScreenWrapper testID={ExitSurveyReasonPage.displayName}>
             <HeaderWithBackButton
-                title="Before you go"
+                title={translate('exitSurvey.header')}
                 onBackButtonPress={() => Navigation.goBack()}
             />
             {/* @ts-expect-error - FormProvider is not yet migrated to TS */}
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 2fbdafdc97dc..7dda7a997dbb 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -13,7 +13,7 @@ function ExitSurveyResponsePage() {
     return (
         <ScreenWrapper testID={ExitSurveyResponsePage.displayName}>
             <HeaderWithBackButton
-                title="Before you go"
+                title={translate('exitSurvey.header')}
                 onBackButtonPress={() => Navigation.goBack()}
             />
             <Text>Response page</Text>

From 19991afc128d993f8aa94187fe729cd6f32ba1ae Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 17:30:18 -0800
Subject: [PATCH 012/305] Translate title and subtitle on reason page

---
 src/languages/en.ts                                    | 5 ++++-
 src/languages/es.ts                                    | 5 ++++-
 src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx | 4 ++--
 3 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index f2881a70551d..1242c02a99b1 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -2121,7 +2121,10 @@ export default {
     },
     exitSurvey: {
         header: 'Before you go',
-        title: 'Before you go, please tell us why you’d like to switch to Expensify Classic.',
+        reasonPage: {
+            title: "Please tell us why you're leaving",
+            subtitle: 'Before you go, please tell us why you’d like to switch to Expensify Classic.',
+        },
         reasons: {
             // TODO: use consts for these keys
             [CONST.EXIT_SURVEY_REASONS.FEATURE_NOT_AVAILABLE]: "I need a feature that's only available in Expensify Classic.",
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 6e20ede364ea..722a939c1e93 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2610,7 +2610,10 @@ export default {
     },
     exitSurvey: {
         header: 'Antes de irte',
-        title: 'Antes de irte, por favor dinos por qué te gustaría cambiarte a Expensify Classic.',
+        reasonPage: {
+            title: 'Dinos por qué te vas',
+            subtitle: 'Antes de irte, por favor dinos por qué te gustaría cambiarte a Expensify Classic.',
+        },
         reasons: {
             // TODO: use consts for these keys
             [CONST.EXIT_SURVEY_REASONS.FEATURE_NOT_AVAILABLE]: 'Necesito una función que sólo está disponible en Expensify Classic.',
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index efc9c5ffa150..7f135f5bd347 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -59,8 +59,8 @@ function ExitSurveyReasonPage() {
                 shouldValidateOnBlur
                 shouldValidateOnChange
             >
-                <Text style={styles.headerAnonymousFooter}>Please tell us why you&apos;re leaving</Text>
-                <Text style={styles.mt2}>Before you go, please tell us why you&apos;d like to switch to Expensify Classic</Text>
+                <Text style={styles.headerAnonymousFooter}>{translate('exitSurvey.reasonPage.title')}</Text>
+                <Text style={styles.mt2}>{translate('exitSurvey.reasonPage.subtitle')}</Text>
                 <InputWrapper
                     // @ts-expect-error - InputWrapper is not yet migrated to TS
                     InputComponent={RadioButtons}

From d76486934197f489003cf6e1534249be227dcaa6 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 17:33:20 -0800
Subject: [PATCH 013/305] Implement basic layout of ResponsePage

---
 src/languages/en.ts                           |  3 +-
 src/languages/es.ts                           |  1 +
 src/libs/Navigation/types.ts                  |  6 +--
 .../ExitSurvey/ExitSurveyResponsePage.tsx     | 39 +++++++++++++++----
 4 files changed, 38 insertions(+), 11 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index 1242c02a99b1..7c763dcbd57b 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -2134,8 +2134,9 @@ export default {
         prompts: {
             [CONST.EXIT_SURVEY_REASONS.FEATURE_NOT_AVAILABLE]: "What feature do you need that isn't available in New Expensify?",
             [CONST.EXIT_SURVEY_REASONS.DONT_UNDERSTAND]: 'What are you trying to do?',
-            [CONST.EXIT_SURVEY_REASONS.PREFER_CLASSIC]: 'Why to you prefer Classic Expensify?',
+            [CONST.EXIT_SURVEY_REASONS.PREFER_CLASSIC]: 'Why to you prefer Expensify Classic?',
         },
+        responsePlaceholder: 'Your response',
         thankYou: 'Your responses will help us build a better product to get stuff done. Thank you so much!',
         goToExpensifyClassic: 'Switch to Expensify Classic',
         offline:
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 722a939c1e93..e2f2abd4cedf 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2625,6 +2625,7 @@ export default {
             [CONST.EXIT_SURVEY_REASONS.DONT_UNDERSTAND]: '¿Qué estás tratando de hacer?',
             [CONST.EXIT_SURVEY_REASONS.PREFER_CLASSIC]: '¿Por qué prefieres Expensify Classic?',
         },
+        responsePlaceholder: 'Su respuesta',
         thankYou: 'Sus respuestas nos ayudarán a crear un mejor producto para hacer las cosas bien. ¡Muchas gracias!',
         goToExpensifyClassic: 'Cambiar a Expensify Classic',
         offline:
diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts
index 6da0bc36d7e0..47f53cb6647b 100644
--- a/src/libs/Navigation/types.ts
+++ b/src/libs/Navigation/types.ts
@@ -124,11 +124,11 @@ type SettingsNavigatorParamList = {
     [SCREENS.SETTINGS.TWO_FACTOR_AUTH]: undefined;
     [SCREENS.SETTINGS.REPORT_CARD_LOST_OR_DAMAGED]: undefined;
     [SCREENS.KEYBOARD_SHORTCUTS]: undefined;
-    [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: () => undefined;
-    [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: () => {
+    [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: undefined;
+    [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: {
         reason: ValueOf<typeof CONST.EXIT_SURVEY_REASONS>;
     };
-    [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: () => undefined;
+    [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: undefined;
 };
 
 type NewChatNavigatorParamList = {
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 7dda7a997dbb..a87b0365ba39 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -1,14 +1,27 @@
+import type {StackScreenProps} from '@react-navigation/stack';
 import React from 'react';
-import Button from '@components/Button';
+import FormProvider from '@components/Form/FormProvider';
+import InputWrapper from '@components/Form/InputWrapper';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
+import TextInput from '@components/TextInput';
 import useLocalize from '@hooks/useLocalize';
+import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
+import type {SettingsNavigatorParamList} from '@navigation/types';
+import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
+import type SCREENS from '@src/SCREENS';
 
-function ExitSurveyResponsePage() {
+const RESPONSE_INPUT_ID = 'response';
+
+type ExitSurveyResponsePageProps = StackScreenProps<SettingsNavigatorParamList, typeof SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE>;
+
+function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
     const {translate} = useLocalize();
+    const styles = useThemeStyles();
+    const {reason} = route.params;
 
     return (
         <ScreenWrapper testID={ExitSurveyResponsePage.displayName}>
@@ -16,11 +29,23 @@ function ExitSurveyResponsePage() {
                 title={translate('exitSurvey.header')}
                 onBackButtonPress={() => Navigation.goBack()}
             />
-            <Text>Response page</Text>
-            <Button
-                text="Next"
-                onPress={() => Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM)}
-            />
+            <FormProvider
+                formID={ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM}
+                style={[styles.flex1, styles.mt3, styles.mh5]}
+                onSubmit={() => Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM)}
+                submitButtonText={translate('common.next')}
+                shouldValidateOnBlur
+                shouldValidateOnChange
+            >
+                <Text style={styles.headerAnonymousFooter}>{translate(`exitSurvey.prompts.${reason}`)}</Text>
+                <InputWrapper
+                    InputComponent={TextInput}
+                    inputID={RESPONSE_INPUT_ID}
+                    containerStyles={styles.mt7}
+                    placeholder={translate(`exitSurvey.responsePlaceholder`)}
+                    multiline
+                />
+            </FormProvider>
         </ScreenWrapper>
     );
 }

From 8cceceae99306d89d4112806cb8d4f0106c559b9 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 17:46:12 -0800
Subject: [PATCH 014/305] Style response input better

---
 .../ExitSurvey/ExitSurveyReasonPage.tsx       | 20 +++++++++-------
 .../ExitSurvey/ExitSurveyResponsePage.tsx     | 24 ++++++++++++-------
 2 files changed, 27 insertions(+), 17 deletions(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index 7f135f5bd347..7de412a3a581 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -59,15 +59,17 @@ function ExitSurveyReasonPage() {
                 shouldValidateOnBlur
                 shouldValidateOnChange
             >
-                <Text style={styles.headerAnonymousFooter}>{translate('exitSurvey.reasonPage.title')}</Text>
-                <Text style={styles.mt2}>{translate('exitSurvey.reasonPage.subtitle')}</Text>
-                <InputWrapper
-                    // @ts-expect-error - InputWrapper is not yet migrated to TS
-                    InputComponent={RadioButtons}
-                    inputID={REASON_INPUT_ID}
-                    items={reasons}
-                    onPress={(value: ValueOf<typeof CONST.EXIT_SURVEY_REASONS>) => setReason(value)}
-                />
+                <>
+                    <Text style={styles.headerAnonymousFooter}>{translate('exitSurvey.reasonPage.title')}</Text>
+                    <Text style={styles.mt2}>{translate('exitSurvey.reasonPage.subtitle')}</Text>
+                    <InputWrapper
+                        // @ts-expect-error – InputWrapper is not yet implemented in TS
+                        InputComponent={RadioButtons}
+                        inputID={REASON_INPUT_ID}
+                        items={reasons}
+                        onPress={(value: ValueOf<typeof CONST.EXIT_SURVEY_REASONS>) => setReason(value)}
+                    />
+                </>
             </FormProvider>
         </ScreenWrapper>
     );
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index a87b0365ba39..08754d7601bc 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -10,6 +10,7 @@ import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
 import type {SettingsNavigatorParamList} from '@navigation/types';
+import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
@@ -29,6 +30,7 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
                 title={translate('exitSurvey.header')}
                 onBackButtonPress={() => Navigation.goBack()}
             />
+            {/* @ts-expect-error - FormProvider is not yet migrated to TS */}
             <FormProvider
                 formID={ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM}
                 style={[styles.flex1, styles.mt3, styles.mh5]}
@@ -37,14 +39,20 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
                 shouldValidateOnBlur
                 shouldValidateOnChange
             >
-                <Text style={styles.headerAnonymousFooter}>{translate(`exitSurvey.prompts.${reason}`)}</Text>
-                <InputWrapper
-                    InputComponent={TextInput}
-                    inputID={RESPONSE_INPUT_ID}
-                    containerStyles={styles.mt7}
-                    placeholder={translate(`exitSurvey.responsePlaceholder`)}
-                    multiline
-                />
+                <>
+                    <Text style={styles.headerAnonymousFooter}>{translate(`exitSurvey.prompts.${reason}`)}</Text>
+                    <InputWrapper
+                        // @ts-expect-error – InputWrapper is not yet implemented in TS
+                        InputComponent={TextInput}
+                        inputID={RESPONSE_INPUT_ID}
+                        containerStyles={styles.mt7}
+                        label={translate(`exitSurvey.responsePlaceholder`)}
+                        accessibilityLabel={translate(`exitSurvey.responsePlaceholder`)}
+                        multiline
+                        role={CONST.ROLE.PRESENTATION}
+                        shouldSaveDraft
+                    />
+                </>
             </FormProvider>
         </ScreenWrapper>
     );

From 1063d50c1b5bc4e63ea7c7dab049035966fb6bf2 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 22 Jan 2024 18:02:20 -0800
Subject: [PATCH 015/305] Get multiline styles implemented correctly

---
 .../ExitSurvey/ExitSurveyResponsePage.tsx     | 21 ++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 08754d7601bc..e8a153fcfe0b 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -1,5 +1,5 @@
 import type {StackScreenProps} from '@react-navigation/stack';
-import React from 'react';
+import React, {useRef, useState} from 'react';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
@@ -8,6 +8,7 @@ import Text from '@components/Text';
 import TextInput from '@components/TextInput';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
+import updateMultilineInputRange from '@libs/updateMultilineInputRange';
 import Navigation from '@navigation/Navigation';
 import type {SettingsNavigatorParamList} from '@navigation/types';
 import CONST from '@src/CONST';
@@ -22,8 +23,12 @@ type ExitSurveyResponsePageProps = StackScreenProps<SettingsNavigatorParamList,
 function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
+
     const {reason} = route.params;
 
+    const [response, setResponse] = useState('');
+    const responseInputRef = useRef(null);
+
     return (
         <ScreenWrapper testID={ExitSurveyResponsePage.displayName}>
             <HeaderWithBackButton
@@ -45,11 +50,21 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
                         // @ts-expect-error – InputWrapper is not yet implemented in TS
                         InputComponent={TextInput}
                         inputID={RESPONSE_INPUT_ID}
-                        containerStyles={styles.mt7}
                         label={translate(`exitSurvey.responsePlaceholder`)}
                         accessibilityLabel={translate(`exitSurvey.responsePlaceholder`)}
-                        multiline
                         role={CONST.ROLE.PRESENTATION}
+                        autoGrowHeight
+                        maxLength={CONST.MAX_COMMENT_LENGTH}
+                        ref={(el) => {
+                            if (!el) {
+                                return;
+                            }
+                            responseInputRef.current = el;
+                            updateMultilineInputRange(el);
+                        }}
+                        value={response}
+                        onChangeText={setResponse}
+                        containerStyles={[styles.mt7, styles.autoGrowHeightMultilineInput]}
                         shouldSaveDraft
                     />
                 </>

From 0f1fc6859df6109817858cf925e9d4b178fa02c5 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Tue, 23 Jan 2024 14:50:30 -0800
Subject: [PATCH 016/305] Compute maxHeight for TextInput in component

---
 .../ExitSurvey/ExitSurveyResponsePage.tsx     | 30 +++++++++++++++++--
 1 file changed, 27 insertions(+), 3 deletions(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index e8a153fcfe0b..1f7863e807da 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -1,5 +1,6 @@
 import type {StackScreenProps} from '@react-navigation/stack';
 import React, {useRef, useState} from 'react';
+import {useSafeAreaFrame} from 'react-native-safe-area-context';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
@@ -7,10 +8,12 @@ import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
 import TextInput from '@components/TextInput';
 import useLocalize from '@hooks/useLocalize';
+import useStyleUtils from '@hooks/useStyleUtils';
 import useThemeStyles from '@hooks/useThemeStyles';
 import updateMultilineInputRange from '@libs/updateMultilineInputRange';
 import Navigation from '@navigation/Navigation';
 import type {SettingsNavigatorParamList} from '@navigation/types';
+import variables from '@styles/variables';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
@@ -23,12 +26,33 @@ type ExitSurveyResponsePageProps = StackScreenProps<SettingsNavigatorParamList,
 function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
+    const StyleUtils = useStyleUtils();
+    const {height: safeAreaFrameHeight} = useSafeAreaFrame();
 
     const {reason} = route.params;
 
     const [response, setResponse] = useState('');
     const responseInputRef = useRef(null);
 
+    const formTopPaddingStyle = styles.mt3;
+    const textStyle = styles.headerAnonymousFooter;
+    const baseResponseInputContainerStyle = styles.mt7;
+    const responseInputMaxHeight = Math.floor(
+        // approximation for window height minus safe areas
+        safeAreaFrameHeight -
+            // Minus the height of HeaderWithBackButton
+            variables.contentHeaderHeight -
+            // Minus the top padding on the form
+            formTopPaddingStyle.marginTop -
+            // Minus the height of the text component
+            textStyle.lineHeight -
+            // Minus the response input margins (multiplied by 2 to create the effect of margins on top and bottom).
+            // marginBottom does not work in this case because the TextInput is in a ScrollView and will push the button beneath it out of view,
+            // so it's maxHeight is what dictates space between it and the button.
+            baseResponseInputContainerStyle.marginTop * 2 -
+            // Minus the approximate size of a default button
+            variables.componentSizeLarge,
+    );
     return (
         <ScreenWrapper testID={ExitSurveyResponsePage.displayName}>
             <HeaderWithBackButton
@@ -38,14 +62,14 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
             {/* @ts-expect-error - FormProvider is not yet migrated to TS */}
             <FormProvider
                 formID={ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM}
-                style={[styles.flex1, styles.mt3, styles.mh5]}
+                style={[styles.flex1, styles.mh5, formTopPaddingStyle]}
                 onSubmit={() => Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM)}
                 submitButtonText={translate('common.next')}
                 shouldValidateOnBlur
                 shouldValidateOnChange
             >
                 <>
-                    <Text style={styles.headerAnonymousFooter}>{translate(`exitSurvey.prompts.${reason}`)}</Text>
+                    <Text style={textStyle}>{translate(`exitSurvey.prompts.${reason}`)}</Text>
                     <InputWrapper
                         // @ts-expect-error – InputWrapper is not yet implemented in TS
                         InputComponent={TextInput}
@@ -64,7 +88,7 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
                         }}
                         value={response}
                         onChangeText={setResponse}
-                        containerStyles={[styles.mt7, styles.autoGrowHeightMultilineInput]}
+                        containerStyles={[baseResponseInputContainerStyle, StyleUtils.getMaximumHeight(responseInputMaxHeight)]}
                         shouldSaveDraft
                     />
                 </>

From 14351a7e6666915ecb37afbbffc9243865e4fd4f Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Tue, 23 Jan 2024 15:21:41 -0800
Subject: [PATCH 017/305] Polish response input height

---
 src/libs/NumberUtils.ts                       | 11 +++++--
 .../ExitSurvey/ExitSurveyResponsePage.tsx     | 32 +++++++++++++------
 2 files changed, 31 insertions(+), 12 deletions(-)

diff --git a/src/libs/NumberUtils.ts b/src/libs/NumberUtils.ts
index ddbd42243758..b4574afde51f 100644
--- a/src/libs/NumberUtils.ts
+++ b/src/libs/NumberUtils.ts
@@ -50,7 +50,7 @@ function generateHexadecimalValue(num: number): string {
 /**
  * Clamp a number in a range.
  * This is a worklet so it should be used only from UI thread.
- 
+
  * @returns clamped value between min and max
  */
 function clampWorklet(num: number, min: number, max: number): number {
@@ -81,4 +81,11 @@ function parseFloatAnyLocale(value: string): number {
     return parseFloat(value ? value.replace(',', '.') : value);
 }
 
-export {rand64, generateHexadecimalValue, generateRandomInt, clampWorklet, parseFloatAnyLocale};
+/**
+ * Given an input number q and another number n, returns the largest number x that's less than p and divisible by q.
+ */
+function roundDownToLargestMultiple(p: number, q: number) {
+    return Math.floor(p / q) * q;
+}
+
+export {rand64, generateHexadecimalValue, generateRandomInt, clampWorklet, parseFloatAnyLocale, roundDownToLargestMultiple};
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 1f7863e807da..1c5bc163b593 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -1,6 +1,5 @@
 import type {StackScreenProps} from '@react-navigation/stack';
 import React, {useRef, useState} from 'react';
-import {useSafeAreaFrame} from 'react-native-safe-area-context';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
@@ -8,8 +7,11 @@ import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
 import TextInput from '@components/TextInput';
 import useLocalize from '@hooks/useLocalize';
+import useSafeAreaInsets from '@hooks/useSafeAreaInsets';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useThemeStyles from '@hooks/useThemeStyles';
+import useWindowDimensions from '@hooks/useWindowDimensions';
+import * as NumberUtils from '@libs/NumberUtils';
 import updateMultilineInputRange from '@libs/updateMultilineInputRange';
 import Navigation from '@navigation/Navigation';
 import type {SettingsNavigatorParamList} from '@navigation/types';
@@ -27,23 +29,27 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
-    const {height: safeAreaFrameHeight} = useSafeAreaFrame();
+    const {windowHeight} = useWindowDimensions();
+    const {top: safeAreaInsetsTop} = useSafeAreaInsets();
 
     const {reason} = route.params;
 
     const [response, setResponse] = useState('');
     const responseInputRef = useRef(null);
 
-    const formTopPaddingStyle = styles.mt3;
+    const formTopMarginsStyle = styles.mt3;
     const textStyle = styles.headerAnonymousFooter;
     const baseResponseInputContainerStyle = styles.mt7;
-    const responseInputMaxHeight = Math.floor(
-        // approximation for window height minus safe areas
-        safeAreaFrameHeight -
+    const formMaxHeight = Math.floor(
+        windowHeight -
+            safeAreaInsetsTop -
             // Minus the height of HeaderWithBackButton
             variables.contentHeaderHeight -
-            // Minus the top padding on the form
-            formTopPaddingStyle.marginTop -
+            // Minus the top margins on the form
+            formTopMarginsStyle.marginTop,
+    );
+    const responseInputMaxHeight = NumberUtils.roundDownToLargestMultiple(
+        formMaxHeight -
             // Minus the height of the text component
             textStyle.lineHeight -
             // Minus the response input margins (multiplied by 2 to create the effect of margins on top and bottom).
@@ -51,8 +57,14 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
             // so it's maxHeight is what dictates space between it and the button.
             baseResponseInputContainerStyle.marginTop * 2 -
             // Minus the approximate size of a default button
-            variables.componentSizeLarge,
+            variables.componentSizeLarge -
+            // Minus the vertical margins around the form button
+            40,
+
+        // Round down to the largest number of full lines
+        styles.baseTextInput.lineHeight,
     );
+
     return (
         <ScreenWrapper testID={ExitSurveyResponsePage.displayName}>
             <HeaderWithBackButton
@@ -62,7 +74,7 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
             {/* @ts-expect-error - FormProvider is not yet migrated to TS */}
             <FormProvider
                 formID={ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM}
-                style={[styles.flex1, styles.mh5, formTopPaddingStyle]}
+                style={[styles.flex1, styles.mh5, formTopMarginsStyle, StyleUtils.getMaximumHeight(formMaxHeight)]}
                 onSubmit={() => Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM)}
                 submitButtonText={translate('common.next')}
                 shouldValidateOnBlur

From af1110f9627918d2784de0cbb64e6cb636ea902f Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 24 Jan 2024 18:50:22 -0800
Subject: [PATCH 018/305] Make response required

---
 src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 1c5bc163b593..2e9d5cc4ab26 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -77,6 +77,14 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
                 style={[styles.flex1, styles.mh5, formTopMarginsStyle, StyleUtils.getMaximumHeight(formMaxHeight)]}
                 onSubmit={() => Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM)}
                 submitButtonText={translate('common.next')}
+                validate={() => {
+                    if (response?.trim()) {
+                        return {};
+                    }
+                    return {
+                        [RESPONSE_INPUT_ID]: translate('common.error.fieldRequired'),
+                    };
+                }}
                 shouldValidateOnBlur
                 shouldValidateOnChange
             >

From 21d0449f2267cc9a7e51ffd52a99a67f1a41f475 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 24 Jan 2024 18:55:48 -0800
Subject: [PATCH 019/305] Add mushroom-top-hat illustration asset

---
 .../mushroom-top-hat.svg                      | 73 +++++++++++++++++++
 1 file changed, 73 insertions(+)
 create mode 100644 assets/images/product-illustrations/mushroom-top-hat.svg

diff --git a/assets/images/product-illustrations/mushroom-top-hat.svg b/assets/images/product-illustrations/mushroom-top-hat.svg
new file mode 100644
index 000000000000..f09f7e7378ed
--- /dev/null
+++ b/assets/images/product-illustrations/mushroom-top-hat.svg
@@ -0,0 +1,73 @@
+<svg width="136" height="128" viewBox="0 0 136 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Illustration">
+<path id="Vector" d="M20.9596 119.21C20.9596 119.21 21.6229 120.98 23.2829 120.98C24.9429 120.98 27.3762 121.09 27.3762 121.09L28.9262 122.416C28.9262 122.416 30.1429 126.62 33.4595 126.176C36.7761 125.733 36.5561 123.19 36.5561 123.19C36.5561 123.19 39.4328 122.526 39.8728 120.203C39.8728 120.203 42.5261 119.76 42.7494 117.66C42.7494 117.66 47.2894 119.186 53.2026 116.266C59.1159 113.346 58.0126 107.043 58.0126 107.043C58.0126 107.043 55.5793 100.74 54.8059 100.187C54.0326 99.6332 51.8193 97.7533 51.8193 97.7533L21.9563 89.0167L31.1362 109.92C31.1362 109.92 17.753 110.803 20.9596 119.21Z" fill="#FFFAF0"/>
+<path id="Vector_2" d="M4.70031 76.5168C4.70031 76.5168 4.36697 83.3734 15.7602 87.0234C27.1534 90.6733 49.9365 97.1999 49.9365 97.1999C49.9365 97.1999 66.6364 100.85 69.0697 92.0033C71.503 83.1567 67.1297 80.8901 63.873 78.8434C63.873 78.8434 49.1632 70.7702 33.9 67.2303C18.6368 63.6903 10.7836 63.2503 6.58362 70.1069C5.70029 72.5402 4.59364 75.5267 4.70364 76.5201L4.70031 76.5168Z" fill="#03D47C"/>
+<path id="Vector_3" d="M27.2634 85.3667C30.868 85.3667 33.79 82.4448 33.79 78.8402C33.79 75.2357 30.868 72.3136 27.2634 72.3136C23.6589 72.3136 20.7368 75.2357 20.7368 78.8402C20.7368 82.4448 23.6589 85.3667 27.2634 85.3667Z" fill="#FFFAF0"/>
+<path id="Vector_4" d="M40.5361 89.7899C44.1407 89.7899 47.0627 86.8678 47.0627 83.2633C47.0627 79.6587 44.1407 76.7368 40.5361 76.7368C36.9316 76.7368 34.0095 79.6587 34.0095 83.2633C34.0095 86.8678 36.9316 89.7899 40.5361 89.7899Z" fill="#FFFAF0"/>
+<path id="Vector_5" d="M35.3361 52.187C35.3361 52.187 29.5129 46.5837 24.9396 53.2203C20.3696 59.8569 28.0362 65.3136 28.0362 65.3136L39.6861 69.0003L47.5027 68.4103C47.5027 68.4103 43.0794 65.3136 46.176 62.3636C49.2727 59.4137 51.336 65.167 55.1726 63.397C59.0059 61.627 58.5659 54.4004 54.2893 51.6004L52.666 52.7804L51.7826 7.36076C51.7826 7.36076 50.3093 0.577492 42.9361 1.02082C35.5628 1.46415 35.1195 5.44418 34.6795 9.42747C34.2362 13.4074 35.3428 52.1904 35.3428 52.1904L35.3361 52.187Z" fill="#F68DFE"/>
+<path id="Vector_6" d="M35.3363 52.1869C35.3363 52.1869 35.363 52.207 35.4097 52.247C36.0463 52.7703 40.6796 56.477 44.0729 56.167C47.7229 55.8337 52.1462 52.737 52.1462 52.737L52.3662 47.7604C52.3662 47.7604 44.5129 45.217 35.333 47.6503V52.1837L35.3363 52.1869Z" fill="#E4BC07"/>
+<path id="Vector_7" d="M79.5758 112.793L75.9259 123.19C75.9259 123.19 75.5925 125.07 78.8025 125.07H97.6057C97.6057 125.07 100.369 123.853 100.482 122.083C100.592 120.313 99.819 119.206 99.819 119.206L87.4324 113.233L79.5792 112.79L79.5758 112.793Z" fill="#FED607"/>
+<path id="Vector_8" d="M121.492 111.356V119.1H132.662C132.662 119.1 134.762 117.883 134.762 115.12V98.64C134.762 98.64 133.879 95.3233 131.666 95.1C129.452 94.8766 128.236 96.87 128.236 96.87L121.489 111.36L121.492 111.356Z" fill="#FED607"/>
+<path id="Vector_9" d="M23.54 94.5834L21.0334 89.1267L1.42023 111.1C1.42023 111.1 0.903572 114.86 1.64023 116.41C2.37689 117.96 5.77018 119.36 5.77018 119.36L20.5167 119.213C20.5167 119.213 19.1167 114.566 21.6234 112.873L8.86682 112.726L8.05683 112.283L23.54 94.5866V94.5834Z" fill="#002140"/>
+<path id="Vector_10" d="M46.103 118.62H77.5127L79.4294 112.13L57.3096 112.276C57.3096 112.276 51.263 117.436 49.3463 117.66C47.4297 117.883 46.103 118.62 46.103 118.62Z" fill="#002140"/>
+<path id="Vector_11" d="M87.4287 113.016L99.7053 119.543H120.938C120.938 119.543 121.712 113.35 120.828 111.8H87.5387L87.4287 113.016Z" fill="#002140"/>
+<path id="Vector_12" d="M79.4293 112.13C79.4293 112.13 84.8859 114.01 87.4292 113.013L98.1558 84.3667C98.1558 84.3667 99.8157 78.1734 94.5058 76.8468C89.1958 75.5201 83.0026 83.0401 83.0026 83.0401L58.0061 109.473L57.3062 112.276L67.2961 112.24L85.8759 90.8933C85.8759 90.8933 87.0925 90.34 86.7592 92.11C86.4259 93.8799 79.4226 112.13 79.4226 112.13H79.4293Z" fill="#002140"/>
+<path id="Vector_13" d="M76.3691 88.6834L75.7057 91.3367L80.7924 86.9134L82.3423 82.8201C82.3423 82.8201 80.4624 67.7802 62.5459 65.5669C62.5459 65.5669 60.7759 66.4503 61.2192 69.1069C61.2192 69.1069 76.5157 71.8302 76.3724 88.6834H76.3691Z" fill="#002140"/>
+<path id="Vector_14" d="M51.4826 63.1369C51.4826 63.1369 50.4859 61.4769 48.276 61.5869C46.0626 61.6969 45.2893 63.1368 45.2893 64.0201C45.2893 64.9035 46.616 68.3335 51.3726 69.3302C56.1292 70.3268 60.8825 69.5502 60.8825 69.5502C60.8825 69.5502 60.3292 66.0102 64.4225 64.6835C68.5157 63.3569 73.3057 61.3303 73.3824 60.037C73.4557 58.747 72.499 57.1603 71.3924 57.3837C71.3924 57.3837 72.609 54.8403 70.7291 54.067C68.8491 53.2936 64.9791 54.5104 62.8758 57.827C62.8758 57.827 62.1025 50.417 57.6792 48.867C54.9159 47.6503 54.3625 51.4104 54.3625 51.4104C54.3625 51.4104 61.1092 57.9369 56.4625 62.5802C53.7259 64.6269 51.4859 63.1336 51.4859 63.1336L51.4826 63.1369Z" fill="#FFFAF0"/>
+<path id="Vector_15" d="M41.3093 105.383C41.3093 105.383 40.976 106.71 39.4294 106.046C37.8794 105.383 37.9927 103.503 37.9927 103.503C37.9927 103.503 35.1894 105.053 34.8961 103.283C34.6027 101.513 34.0127 101.733 35.2294 100.52C36.446 99.3064 37.8827 96.9799 37.8827 96.9799C37.8827 96.9799 35.1194 94.9432 33.6794 95.3199C32.2394 95.6966 30.1394 97.6432 30.1394 98.3065C30.1394 98.9699 29.9195 105.606 38.4327 108.04C46.9493 110.473 48.0559 107.706 48.6093 106.38C49.1626 105.053 50.2692 103.726 48.1659 102.73C46.0659 101.733 44.296 101.18 44.296 101.18L41.3093 105.383Z" fill="#002140"/>
+<path id="Vector_16" d="M36.4893 53.0404L38.2592 54.5871L45.2625 46.9939L41.4292 47.5839L36.4893 53.0404Z" fill="#002140"/>
+<path id="Vector_17" d="M41.1362 55.8405L44.5995 55.9904L52.2695 48.0271L49.0995 47.6571L41.1362 55.8405Z" fill="#002140"/>
+<path id="Vector_18" d="M18.5 64.5402C18.5 64.5402 12.3801 65.2769 10.2434 66.6035C10.2434 66.6035 10.3901 74.1236 16.4367 72.2802C22.4833 70.4369 19.3866 64.6137 18.5 64.537V64.5402Z" fill="#002140"/>
+<path id="Vector_19" d="M12.0835 75.3801C12.0835 75.3801 7.14358 75.3802 6.18359 80.1001C6.18359 80.1001 9.06022 84.0801 11.1235 84.8934C11.1235 84.8934 15.1802 84.8201 15.6935 81.2801C16.2102 77.7402 13.7035 75.4568 12.0802 75.3801H12.0835Z" fill="#002140"/>
+<path id="Vector_20" d="M41.5028 69.7037C41.5028 69.7037 33.8362 66.9003 32.5062 66.977C31.1796 67.0503 31.3996 72.6536 35.7495 73.6869C40.0995 74.7202 41.4995 69.707 41.4995 69.707L41.5028 69.7037Z" fill="#002140"/>
+<path id="Vector_21" d="M60.8225 77.6669L53.8925 74.3502C53.8925 74.3502 51.6792 76.3035 51.4592 77.5201C51.2392 78.7368 51.8292 83.0501 55.0725 83.4201C58.3158 83.7901 60.9725 81.0601 60.8225 77.6702V77.6669Z" fill="#002140"/>
+<path id="Vector_22" d="M67.529 82.4601C67.529 82.4601 64.8024 83.1967 64.9491 86.3666C65.0957 89.5366 69.4457 90.1999 69.4457 90.1999C69.4457 90.1999 71.659 84.2266 67.529 82.4567V82.4601Z" fill="#002140"/>
+<path id="Vector_23" d="M54.5525 97.9432L59.4924 98.3865C59.4924 98.3865 62.6624 95.8798 61.9991 93.5199C61.3358 91.1599 59.4191 89.2433 56.3958 89.4633C53.3725 89.6833 52.7592 92.6899 52.6358 93.4432C52.0458 95.4332 54.0358 97.7932 54.5525 97.9399V97.9432Z" fill="#002140"/>
+<path id="Vector_24" d="M34.646 101.703L38.1126 97.1333C38.1126 97.1333 33.7627 93.6667 31.1094 96.9867C28.4561 100.303 32.806 104.95 32.806 104.95C32.806 104.95 38.706 109.3 43.1293 109.447C47.5526 109.593 48.9525 106.13 48.9525 106.13L48.7325 103.55L44.4559 101.043L40.476 106.28C40.476 106.28 39.3693 106.207 38.706 105.987C38.0426 105.767 38.2626 103.333 38.2626 103.333C38.2626 103.333 35.7193 104.253 35.2227 103.757C34.726 103.26 34.6527 101.71 34.6527 101.71L34.646 101.703Z" fill="#002140"/>
+<path id="Vector_25" d="M57.946 98.6066C57.946 98.6066 60.4527 104.063 62.886 104.356L66.7926 100.743L63.476 97.2032L57.946 98.6031V98.6066Z" fill="#002140"/>
+<path id="Vector_26" d="M30.2966 56.5803C30.2966 56.5803 42.6832 66.9769 53.8531 57.7969" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_27" d="M42.9031 70.0703C32.9332 67.1137 11.3667 58.217 5.58345 72.2202C1.86348 81.2234 11.0534 85.6201 18.1367 87.8301C27.7799 90.84 37.4198 93.88 47.1497 96.6C54.6496 98.6933 64.3429 100.733 68.7628 92.3933C69.5195 90.9634 70.0328 89.38 70.0428 87.7633C70.0728 82.0801 63.4162 78.9168 59.1296 76.7202C53.9563 74.0702 48.483 71.7236 42.9031 70.0703Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_28" d="M26.9794 85.7766C30.7662 85.7766 33.836 82.7562 33.836 79.0301C33.836 75.3041 30.7662 72.2834 26.9794 72.2834C23.1926 72.2834 20.1228 75.3041 20.1228 79.0301C20.1228 82.7562 23.1926 85.7766 26.9794 85.7766Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_29" d="M24.2501 78.1835L28.3867 78.4434C28.51 76.0001 27.0634 73.8634 24.9501 73.5268C22.6568 73.1635 20.4535 75.0535 20.0235 77.7468C19.5935 80.4401 21.1068 82.92 23.4001 83.2834C24.7367 83.4967 26.0401 82.9402 26.9801 81.9102L24.2468 78.1835H24.2501Z" fill="#002140"/>
+<path id="Vector_30" d="M40.3959 90.0533C44.1827 90.0533 47.2525 87.0328 47.2525 83.3067C47.2525 79.5807 44.1827 76.5601 40.3959 76.5601C36.6091 76.5601 33.5393 79.5807 33.5393 83.3067C33.5393 87.0328 36.6091 90.0533 40.3959 90.0533Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_31" d="M37.6696 82.4601L41.8062 82.72C41.9296 80.2767 40.4829 78.1401 38.3696 77.8034C36.0763 77.4401 33.873 79.3301 33.443 82.0234C33.0163 84.7167 34.5263 87.1966 36.8196 87.56C38.1563 87.7733 39.4596 87.2166 40.3996 86.1866L37.6663 82.4601H37.6696Z" fill="#002140"/>
+<path id="Vector_32" d="M47.733 68.3403C47.733 68.3403 41.9631 68.9135 39.5198 69.0135" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_33" d="M35.383 52.3771C35.383 52.3771 34.533 11.3774 34.533 10.0274C34.533 8.67739 33.9464 1.39422 42.9063 1.28088C50.4262 1.28088 51.8662 5.37422 51.8662 8.91085C51.7562 10.3475 52.4128 52.817 52.4128 52.817" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_34" d="M35.4932 47.5104C35.4932 47.5104 46.2197 46.2938 51.973 47.6204" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_35" d="M36.3428 53.187L41.946 47.0671" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_36" d="M38.4795 54.5136L45.4894 47.0038" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_37" d="M41.5029 55.547L49.2462 47.2039" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_38" d="M44.4526 56.0638L52.1959 47.7205" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_39" d="M63.9929 60.7804C67.9729 58.5671 72.6928 56.4303 73.5028 58.937C74.3128 61.4436 68.3429 63.7304 64.1396 65.057C59.9363 66.3837 61.3363 69.4803 61.3363 69.4803C61.3363 69.4803 57.3563 70.5136 53.6897 70.0803C51.043 69.7703 47.5697 68.7136 45.8464 66.5237C44.0064 64.1837 46.6764 60.4804 49.4764 61.6671C50.143 61.9504 50.6664 62.4837 51.2564 62.9037C52.7797 63.9837 55.2263 64.3937 56.623 62.9037C59.3463 60.0038 57.7963 53.3837 54.4097 51.597" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_40" d="M71.1423 57.7571C71.1423 57.7571 72.6923 55.6204 71.069 54.2904C69.4457 52.9637 64.6557 54.1437 62.5891 58.7137C63.0524 57.6903 62.3958 55.3437 62.1624 54.3371C61.5224 51.5638 59.6658 48.6171 56.4558 48.7071C54.8192 48.7504 54.1825 50.1305 54.4058 51.6005C52.7459 52.1538 51.4192 55.1404 44.6726 56.0237C37.926 56.9071 35.936 51.7105 31.7327 50.4939C27.5295 49.2772 24.6561 52.4838 23.8628 54.9038C22.8695 57.3104 22.8962 62.4737 28.8961 65.9136" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_41" d="M30.6297 109.776L21.1165 88.7633" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_42" d="M42.6826 117.85C42.6826 117.85 43.8993 118.403 46.5526 118.293C49.2059 118.183 58.0558 116.193 58.0558 108.783C58.0558 101.373 51.5292 97.7233 51.5292 97.7233" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_43" d="M30.2962 100.596C30.2962 100.596 30.7395 104.577 36.7094 107.453C39.5161 108.803 44.686 110.643 47.4793 108.263C48.9693 106.993 49.876 104.123 47.9927 102.81C46.3893 101.693 44.5094 101.066 42.7461 100.24C41.3661 99.5932 40.0261 98.8232 38.9261 97.7532C37.2528 96.1232 34.6095 94.7233 32.2862 95.8899C30.5562 96.7599 30.1028 98.8232 30.2995 100.6L30.2962 100.596Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_44" d="M37.8728 97.2233C37.8728 97.2233 36.4895 99.2698 35.1628 100.93C33.8362 102.59 34.7762 103.42 35.2195 103.75C35.6628 104.083 36.9161 104.45 38.2595 102.55C39.6061 100.65 40.5828 99.2698 40.5828 99.2698" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_45" d="M41.3393 99.7399C40.9226 100.347 39.8493 101.883 38.8093 103.18C37.4827 104.84 38.4226 105.67 38.866 106C39.3093 106.333 40.5626 106.7 41.9059 104.8C43.2526 102.9 44.2293 101.52 44.2293 101.52" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_46" d="M36.4897 123.38C36.4897 123.38 38.3697 123.546 39.3664 122.22C40.363 120.893 39.8097 117.353 35.1631 115.03" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_47" d="M40.016 120.486C40.656 120.416 41.6193 120.17 42.2426 119.343C43.2393 118.016 42.6859 114.476 38.0393 112.153C38.0393 112.153 33.8927 110.163 31.1261 110.163C24.3795 110.163 19.9562 113.04 20.0095 116.8C20.0095 116.8 20.1762 121.28 23.6595 121.17C27.1428 121.06 28.0828 120.95 28.9128 122.22C29.7428 123.493 30.9027 126.533 33.1694 126.533C35.436 126.533 36.266 125.373 36.266 123.656C36.266 121.94 33.4461 118.9 30.9027 117.573" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_48" d="M21.4496 113.04H9.143C8.63634 113.04 8.36301 112.443 8.69634 112.06L23.5529 94.8999" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_49" d="M21.3363 89.15L2.41652 110.343C-0.766781 113.91 1.7632 119.563 6.54648 119.563H20.5063" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_50" d="M79.3291 112.35L57.5027 112.32" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_51" d="M47.3191 118.226L77.6321 118.413" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_52" d="M58.0195 110.257L84.5459 81.8135C84.5459 81.8135 84.5659 81.79 84.5759 81.7767C84.8259 81.4634 88.5592 76.8534 93.1892 76.8534C97.8191 76.8534 99.4891 81.4968 97.9825 85.3335L87.1392 112.913C87.0492 113.14 86.8392 113.296 86.5992 113.316C85.3326 113.42 81.3826 113.65 79.916 112.663C79.6793 112.506 79.596 112.2 79.6893 111.933L86.8826 91.8067C87.1159 91.15 86.2792 90.65 85.8126 91.1633L66.7961 112.103" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_53" d="M79.6888 111.93L76.3055 122.57C76.3055 122.57 75.2722 125.223 78.6655 125.223H96.802C96.802 125.223 100.709 124.853 100.709 121.83C100.709 121.83 100.929 120.356 99.4553 119.323C97.982 118.29 87.1387 112.91 87.1387 112.91" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_54" d="M86.7759 117.406C86.7759 117.406 87.7359 114.68 89.3558 114.236" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_55" d="M91.1255 119.546C91.1255 119.546 92.0855 116.82 93.7055 116.376" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_56" d="M99.9724 119.473C99.9724 119.473 129.465 119.503 132.025 119.503C134.585 119.503 134.679 115.563 134.679 115.563V99.0066C134.679 99.0066 134.309 95.0999 131.285 95.0999C131.285 95.0999 129.812 94.8798 128.779 96.3531C127.745 97.8265 121.206 111.953 121.206 111.953C121.206 111.953 121.942 117.703 121.132 119.4" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_57" d="M126.865 109.033C126.865 109.033 124.139 108.073 123.695 106.453" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_58" d="M129.002 104.683C129.002 104.683 126.275 103.723 125.832 102.103" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_59" d="M87.6592 112.026H121.209" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_60" d="M57.946 98.6798C57.946 98.6798 59.496 103.25 63.3293 104.283" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_61" d="M63.6223 97.5C63.6223 97.5 64.729 99.8598 66.8656 100.596" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_62" d="M61.3359 69.4835C61.3359 69.4835 76.6291 70.8602 76.6291 90.3" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_63" d="M63.4023 65.5004C63.4023 65.5004 82.2921 70.2236 82.2921 84.2302" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_64" d="M54.3392 97.91C53.2292 97.0534 52.5159 95.7099 52.5159 94.1999C52.5159 91.6133 54.6125 89.5167 57.1992 89.5167C59.7858 89.5167 61.8824 91.6133 61.8824 94.1999C61.8824 95.8966 60.9824 97.38 59.6325 98.2033" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_65" d="M69.5392 90.2333C69.3525 90.2599 69.1625 90.2733 68.9692 90.2733C66.7492 90.2733 64.9492 88.4733 64.9492 86.2533C64.9492 84.4567 66.1292 82.9334 67.7592 82.42" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_66" d="M60.6391 77.7201C60.7091 78.0468 60.7491 78.3869 60.7491 78.7369C60.7491 81.3635 58.6191 83.4935 55.9925 83.4935C53.3658 83.4935 51.2358 81.3635 51.2358 78.7369C51.2358 76.8469 52.3392 75.2136 53.9358 74.4469" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_67" d="M6.34354 80.8467C6.31354 80.6267 6.29688 80.4001 6.29688 80.1701C6.29688 77.5434 8.42685 75.4135 11.0535 75.4135C13.6801 75.4135 15.8101 77.5434 15.8101 80.1701C15.8101 82.6534 13.9101 84.69 11.4835 84.9067" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_68" d="M18.9128 64.6603C19.5162 65.4703 19.8762 66.4769 19.8762 67.5636C19.8762 70.2469 17.6995 72.4235 15.0162 72.4235C12.3329 72.4235 10.1562 70.2469 10.1562 67.5636C10.1562 67.2769 10.1829 66.9935 10.2296 66.7202" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_69" d="M41.6829 69.8403C41.2429 72.0703 39.2729 73.7535 36.9129 73.7535C34.2296 73.7535 32.053 71.5768 32.053 68.8935C32.053 68.2402 32.183 67.617 32.4163 67.0503" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

From 93c5a871780ceda39b4c52b816eca8b261840bbe Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 24 Jan 2024 19:14:03 -0800
Subject: [PATCH 020/305] Implement confirm page

---
 src/components/Icon/Illustrations.ts          |  2 ++
 src/languages/en.ts                           |  3 ++-
 src/languages/es.ts                           |  3 ++-
 .../ExitSurvey/ExitSurveyConfirmPage.tsx      | 24 +++++++++++++------
 4 files changed, 23 insertions(+), 9 deletions(-)

diff --git a/src/components/Icon/Illustrations.ts b/src/components/Icon/Illustrations.ts
index 954c8d0392fc..02936225d0c7 100644
--- a/src/components/Icon/Illustrations.ts
+++ b/src/components/Icon/Illustrations.ts
@@ -16,6 +16,7 @@ import Lounge from '@assets/images/product-illustrations/lounge.svg';
 import MagicCode from '@assets/images/product-illustrations/magic-code.svg';
 import MoneyEnvelopeBlue from '@assets/images/product-illustrations/money-envelope--blue.svg';
 import MoneyMousePink from '@assets/images/product-illustrations/money-mouse--pink.svg';
+import MushroomTopHat from '@assets/images/product-illustrations/mushroom-top-hat.svg';
 import PaymentHands from '@assets/images/product-illustrations/payment-hands.svg';
 import ReceiptYellow from '@assets/images/product-illustrations/receipt--yellow.svg';
 import ReceiptsSearchYellow from '@assets/images/product-illustrations/receipts-search--yellow.svg';
@@ -82,6 +83,7 @@ export {
     Mailbox,
     MoneyEnvelopeBlue,
     MoneyMousePink,
+    MushroomTopHat,
     ReceiptsSearchYellow,
     ReceiptYellow,
     RocketBlue,
diff --git a/src/languages/en.ts b/src/languages/en.ts
index f0fbd3a9272c..faf5e6568f81 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -2146,7 +2146,8 @@ export default {
             [CONST.EXIT_SURVEY_REASONS.PREFER_CLASSIC]: 'Why to you prefer Expensify Classic?',
         },
         responsePlaceholder: 'Your response',
-        thankYou: 'Your responses will help us build a better product to get stuff done. Thank you so much!',
+        thankYou: 'Thanks for the feedback!',
+        thankYouSubtitle: 'Your responses will help us build a better product to get stuff done. Thank you so much!',
         goToExpensifyClassic: 'Switch to Expensify Classic',
         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.",
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 5666598880a3..f96f22976d23 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2634,7 +2634,8 @@ export default {
             [CONST.EXIT_SURVEY_REASONS.PREFER_CLASSIC]: '¿Por qué prefieres Expensify Classic?',
         },
         responsePlaceholder: 'Su respuesta',
-        thankYou: 'Sus respuestas nos ayudarán a crear un mejor producto para hacer las cosas bien. ¡Muchas gracias!',
+        thankYou: '¡Gracias por sus comentarios!',
+        thankYouSubtitle: 'Sus respuestas nos ayudarán a crear un mejor producto para hacer las cosas bien. ¡Muchas gracias!',
         goToExpensifyClassic: 'Cambiar a Expensify Classic',
         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.',
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index a7d2ebad8214..284cc88fd015 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -1,15 +1,20 @@
 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 {MushroomTopHat} from '@components/Icon/Illustrations';
 import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
+import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
 import * as Link from '@userActions/Link';
 import CONST from '@src/CONST';
 
 function ExitSurveyConfirmPage() {
     const {translate} = useLocalize();
+    const styles = useThemeStyles();
 
     return (
         <ScreenWrapper testID={ExitSurveyConfirmPage.displayName}>
@@ -17,13 +22,18 @@ function ExitSurveyConfirmPage() {
                 title={translate('exitSurvey.header')}
                 onBackButtonPress={() => Navigation.goBack()}
             />
-            <Text>Confirm page</Text>
-            <Button
-                text="Next"
-                onPress={() => {
-                    Link.openOldDotLink(CONST.OLDDOT_URLS.INBOX);
-                }}
-            />
+            <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter, styles.p5]}>
+                <MushroomTopHat />
+                <Text style={[styles.headerAnonymousFooter, styles.mt5]}>{translate('exitSurvey.thankYou')}</Text>
+                <Text style={[styles.mt2]}>{translate('exitSurvey.thankYouSubtitle')}</Text>
+            </View>
+            <FixedFooter>
+                <Button
+                    success
+                    text={translate('exitSurvey.goToExpensifyClassic')}
+                    onPress={() => Link.openOldDotLink(CONST.OLDDOT_URLS.INBOX)}
+                />
+            </FixedFooter>
         </ScreenWrapper>
     );
 }

From 3035ce05bef77f5f4ad6a966035940f43488dccc Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 24 Jan 2024 20:08:03 -0800
Subject: [PATCH 021/305] Add Onyx types for forms

---
 src/CONST.ts                                         | 12 ++++++++----
 src/ONYXKEYS.ts                                      |  6 ++++++
 src/ROUTES.ts                                        |  2 +-
 src/languages/en.ts                                  | 12 ++++++------
 src/languages/es.ts                                  | 12 ++++++------
 src/libs/Navigation/types.ts                         |  2 +-
 .../settings/ExitSurvey/ExitSurveyReasonPage.tsx     | 12 +++++-------
 .../settings/ExitSurvey/ExitSurveyResponsePage.tsx   |  6 ++----
 8 files changed, 35 insertions(+), 29 deletions(-)

diff --git a/src/CONST.ts b/src/CONST.ts
index 13599172a902..8b757e51ceae 100755
--- a/src/CONST.ts
+++ b/src/CONST.ts
@@ -3165,10 +3165,14 @@ const CONST = {
 
     REPORT_FIELD_TITLE_FIELD_ID: 'text_title',
 
-    EXIT_SURVEY_REASONS: {
-        FEATURE_NOT_AVAILABLE: 'featureNotAvailable',
-        DONT_UNDERSTAND: 'dontUnderstand',
-        PREFER_CLASSIC: 'preferClassic',
+    EXIT_SURVEY: {
+        REASONS: {
+            FEATURE_NOT_AVAILABLE: 'featureNotAvailable',
+            DONT_UNDERSTAND: 'dontUnderstand',
+            PREFER_CLASSIC: 'preferClassic',
+        },
+        REASON_INPUT_ID: 'reason',
+        RESPONSE_INPUT_ID: 'response',
     },
 } as const;
 
diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts
index c16a9972820e..82bfb3847896 100755
--- a/src/ONYXKEYS.ts
+++ b/src/ONYXKEYS.ts
@@ -542,6 +542,12 @@ type OnyxValues = {
     [ONYXKEYS.FORMS.GET_PHYSICAL_CARD_FORM_DRAFT]: OnyxTypes.Form | undefined;
     [ONYXKEYS.FORMS.POLICY_REPORT_FIELD_EDIT_FORM]: OnyxTypes.Form;
     [ONYXKEYS.FORMS.POLICY_REPORT_FIELD_EDIT_FORM_DRAFT]: OnyxTypes.Form | undefined;
+    [ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM]: OnyxTypes.Form & {
+        [CONST.EXIT_SURVEY.REASON_INPUT_ID]: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
+    };
+    [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM]: OnyxTypes.Form & {
+        [CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]: string;
+    };
 };
 
 type OnyxKeyValue<TOnyxKey extends (OnyxKey | OnyxCollectionKey) & keyof OnyxValues> = OnyxEntry<OnyxValues[TOnyxKey]>;
diff --git a/src/ROUTES.ts b/src/ROUTES.ts
index f9c79e729161..0a9e81d7326b 100644
--- a/src/ROUTES.ts
+++ b/src/ROUTES.ts
@@ -152,7 +152,7 @@ const ROUTES = {
     SETTINGS_EXIT_SURVEY_REASON: 'settings/exit-survey/reason',
     SETTINGS_EXIT_SURVEY_RESPONSE: {
         route: 'settings/exit-survey/response',
-        getRoute: (reason: ValueOf<typeof CONST.EXIT_SURVEY_REASONS>) => `settings/exit-survey/response?reason=${encodeURIComponent(reason)}` as const,
+        getRoute: (reason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>) => `settings/exit-survey/response?reason=${encodeURIComponent(reason)}` as const,
     },
     SETTINGS_EXIT_SURVEY_CONFIRM: 'settings/exit-survey/confirm',
 
diff --git a/src/languages/en.ts b/src/languages/en.ts
index faf5e6568f81..7a8c6272addc 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -2136,14 +2136,14 @@ export default {
         },
         reasons: {
             // TODO: use consts for these keys
-            [CONST.EXIT_SURVEY_REASONS.FEATURE_NOT_AVAILABLE]: "I need a feature that's only available in Expensify Classic.",
-            [CONST.EXIT_SURVEY_REASONS.DONT_UNDERSTAND]: "I don't understand how to use New Expensify.",
-            [CONST.EXIT_SURVEY_REASONS.PREFER_CLASSIC]: 'I understand how to use New Expensify, but I prefer Expensify Classic.',
+            [CONST.EXIT_SURVEY.REASONS.FEATURE_NOT_AVAILABLE]: "I need a feature that's only available in Expensify Classic.",
+            [CONST.EXIT_SURVEY.REASONS.DONT_UNDERSTAND]: "I don't understand how to use New Expensify.",
+            [CONST.EXIT_SURVEY.REASONS.PREFER_CLASSIC]: 'I understand how to use New Expensify, but I prefer Expensify Classic.',
         },
         prompts: {
-            [CONST.EXIT_SURVEY_REASONS.FEATURE_NOT_AVAILABLE]: "What feature do you need that isn't available in New Expensify?",
-            [CONST.EXIT_SURVEY_REASONS.DONT_UNDERSTAND]: 'What are you trying to do?',
-            [CONST.EXIT_SURVEY_REASONS.PREFER_CLASSIC]: 'Why to you prefer Expensify Classic?',
+            [CONST.EXIT_SURVEY.REASONS.FEATURE_NOT_AVAILABLE]: "What feature do you need that isn't available in New Expensify?",
+            [CONST.EXIT_SURVEY.REASONS.DONT_UNDERSTAND]: 'What are you trying to do?',
+            [CONST.EXIT_SURVEY.REASONS.PREFER_CLASSIC]: 'Why to you prefer Expensify Classic?',
         },
         responsePlaceholder: 'Your response',
         thankYou: 'Thanks for the feedback!',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index f96f22976d23..0dedfe8c4af3 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2624,14 +2624,14 @@ export default {
         },
         reasons: {
             // TODO: use consts for these keys
-            [CONST.EXIT_SURVEY_REASONS.FEATURE_NOT_AVAILABLE]: 'Necesito una función que sólo está disponible en Expensify Classic.',
-            [CONST.EXIT_SURVEY_REASONS.DONT_UNDERSTAND]: 'No entiendo cómo usar New Expensify.',
-            [CONST.EXIT_SURVEY_REASONS.PREFER_CLASSIC]: 'Entiendo cómo usar New Expensify, pero prefiero Expensify Classic.',
+            [CONST.EXIT_SURVEY.REASONS.FEATURE_NOT_AVAILABLE]: 'Necesito una función que sólo está disponible en Expensify Classic.',
+            [CONST.EXIT_SURVEY.REASONS.DONT_UNDERSTAND]: 'No entiendo cómo usar New Expensify.',
+            [CONST.EXIT_SURVEY.REASONS.PREFER_CLASSIC]: 'Entiendo cómo usar New Expensify, pero prefiero Expensify Classic.',
         },
         prompts: {
-            [CONST.EXIT_SURVEY_REASONS.FEATURE_NOT_AVAILABLE]: '¿Qué función necesitas que no esté disponible en New Expensify?',
-            [CONST.EXIT_SURVEY_REASONS.DONT_UNDERSTAND]: '¿Qué estás tratando de hacer?',
-            [CONST.EXIT_SURVEY_REASONS.PREFER_CLASSIC]: '¿Por qué prefieres Expensify Classic?',
+            [CONST.EXIT_SURVEY.REASONS.FEATURE_NOT_AVAILABLE]: '¿Qué función necesitas que no esté disponible en New Expensify?',
+            [CONST.EXIT_SURVEY.REASONS.DONT_UNDERSTAND]: '¿Qué estás tratando de hacer?',
+            [CONST.EXIT_SURVEY.REASONS.PREFER_CLASSIC]: '¿Por qué prefieres Expensify Classic?',
         },
         responsePlaceholder: 'Su respuesta',
         thankYou: '¡Gracias por sus comentarios!',
diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts
index 24504fccb3f8..5d02ad1f44c9 100644
--- a/src/libs/Navigation/types.ts
+++ b/src/libs/Navigation/types.ts
@@ -126,7 +126,7 @@ type SettingsNavigatorParamList = {
     [SCREENS.KEYBOARD_SHORTCUTS]: undefined;
     [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: undefined;
     [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: {
-        reason: ValueOf<typeof CONST.EXIT_SURVEY_REASONS>;
+        reason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
     };
     [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: undefined;
 };
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index 7de412a3a581..dcf7fb839290 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -14,16 +14,14 @@ import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 
-const REASON_INPUT_ID = 'reason';
-
 function ExitSurveyReasonPage() {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
 
-    const [reason, setReason] = useState<ValueOf<typeof CONST.EXIT_SURVEY_REASONS>>();
+    const [reason, setReason] = useState<ValueOf<typeof CONST.EXIT_SURVEY.REASONS>>();
     const reasons: Choice[] = useMemo(
         () =>
-            Object.values(CONST.EXIT_SURVEY_REASONS).map((value) => ({
+            Object.values(CONST.EXIT_SURVEY.REASONS).map((value) => ({
                 value,
                 label: translate(`exitSurvey.reasons.${value}`),
                 style: styles.mt6,
@@ -46,7 +44,7 @@ function ExitSurveyReasonPage() {
                         return {};
                     }
                     return {
-                        [REASON_INPUT_ID]: translate('common.error.fieldRequired'),
+                        [CONST.EXIT_SURVEY.REASON_INPUT_ID]: translate('common.error.fieldRequired'),
                     };
                 }}
                 onSubmit={() => {
@@ -65,9 +63,9 @@ function ExitSurveyReasonPage() {
                     <InputWrapper
                         // @ts-expect-error – InputWrapper is not yet implemented in TS
                         InputComponent={RadioButtons}
-                        inputID={REASON_INPUT_ID}
+                        inputID={CONST.EXIT_SURVEY.REASON_INPUT_ID}
                         items={reasons}
-                        onPress={(value: ValueOf<typeof CONST.EXIT_SURVEY_REASONS>) => setReason(value)}
+                        onPress={(value: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>) => setReason(value)}
                     />
                 </>
             </FormProvider>
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 2e9d5cc4ab26..cc1b6ed237c7 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -21,8 +21,6 @@ import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
 
-const RESPONSE_INPUT_ID = 'response';
-
 type ExitSurveyResponsePageProps = StackScreenProps<SettingsNavigatorParamList, typeof SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE>;
 
 function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
@@ -82,7 +80,7 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
                         return {};
                     }
                     return {
-                        [RESPONSE_INPUT_ID]: translate('common.error.fieldRequired'),
+                        [CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]: translate('common.error.fieldRequired'),
                     };
                 }}
                 shouldValidateOnBlur
@@ -93,7 +91,7 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
                     <InputWrapper
                         // @ts-expect-error – InputWrapper is not yet implemented in TS
                         InputComponent={TextInput}
-                        inputID={RESPONSE_INPUT_ID}
+                        inputID={CONST.EXIT_SURVEY.RESPONSE_INPUT_ID}
                         label={translate(`exitSurvey.responsePlaceholder`)}
                         accessibilityLabel={translate(`exitSurvey.responsePlaceholder`)}
                         role={CONST.ROLE.PRESENTATION}

From b83bdef31f75d7a6bcf64813e7921f09dc6a493a Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 24 Jan 2024 20:09:58 -0800
Subject: [PATCH 022/305] Fix route type

---
 src/libs/Navigation/types.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts
index 5d02ad1f44c9..dfea45e1a796 100644
--- a/src/libs/Navigation/types.ts
+++ b/src/libs/Navigation/types.ts
@@ -126,7 +126,7 @@ type SettingsNavigatorParamList = {
     [SCREENS.KEYBOARD_SHORTCUTS]: undefined;
     [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: undefined;
     [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: {
-        reason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
+        [CONST.EXIT_SURVEY.REASON_INPUT_ID]: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
     };
     [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: undefined;
 };

From 733dd6ac4e232a27724afcf4608ad0dc8def619a Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 24 Jan 2024 20:17:47 -0800
Subject: [PATCH 023/305] Add obligatory draft keys for forms

---
 src/ONYXKEYS.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts
index 82bfb3847896..02d3b77b8986 100755
--- a/src/ONYXKEYS.ts
+++ b/src/ONYXKEYS.ts
@@ -359,7 +359,9 @@ const ONYXKEYS = {
         POLICY_REPORT_FIELD_EDIT_FORM: 'policyReportFieldEditForm',
         POLICY_REPORT_FIELD_EDIT_FORM_DRAFT: 'policyReportFieldEditFormDraft',
         EXIT_SURVEY_REASON_FORM: 'exitSurveyReasonForm',
+        EXIT_SURVEY_REASON_FORM_DRAFT: 'exitSurveyReasonFormDraft',
         EXIT_SURVEY_RESPONSE_FORM: 'exitSurveyResponseForm',
+        EXIT_SURVEY_RESPONSE_FORM_DRAFT: 'exitSurveyResponseFormDraft',
     },
 } as const;
 
@@ -545,9 +547,11 @@ type OnyxValues = {
     [ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM]: OnyxTypes.Form & {
         [CONST.EXIT_SURVEY.REASON_INPUT_ID]: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
     };
+    [ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM_DRAFT]: OnyxTypes.Form;
     [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM]: OnyxTypes.Form & {
         [CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]: string;
     };
+    [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM_DRAFT]: OnyxTypes.Form;
 };
 
 type OnyxKeyValue<TOnyxKey extends (OnyxKey | OnyxCollectionKey) & keyof OnyxValues> = OnyxEntry<OnyxValues[TOnyxKey]>;

From 85f2c65924e1940ad29c9736a9e2963960faebe2 Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Thu, 25 Jan 2024 23:41:03 +0700
Subject: [PATCH 024/305] fix logic get document from native

---
 .../AttachmentPicker/index.native.js          | 27 +++++++++++++------
 1 file changed, 19 insertions(+), 8 deletions(-)

diff --git a/src/components/AttachmentPicker/index.native.js b/src/components/AttachmentPicker/index.native.js
index 59928b80c4b1..8a60a46e2855 100644
--- a/src/components/AttachmentPicker/index.native.js
+++ b/src/components/AttachmentPicker/index.native.js
@@ -57,11 +57,22 @@ const getImagePickerOptions = (type) => {
 };
 
 /**
- * See https://github.com/rnmods/react-native-document-picker#options for DocumentPicker configuration options
+ * Return documentPickerOptions based on the type
+ * @param {String} type
+ * @returns {Object}
  */
-const documentPickerOptions = {
-    type: [RNDocumentPicker.types.allFiles],
-    copyTo: 'cachesDirectory',
+
+const getDocumentPickerOptions = (type) => {
+    if (type === CONST.ATTACHMENT_PICKER_TYPE.IMAGE) {
+        return {
+            type: [RNDocumentPicker.types.allFiles],
+            copyTo: 'cachesDirectory',
+        };
+    }
+    return {
+        type: [RNDocumentPicker.types.images],
+        copyTo: 'cachesDirectory',
+    };
 };
 
 /**
@@ -158,7 +169,7 @@ function AttachmentPicker({type, children, shouldHideCameraOption}) {
      */
     const showDocumentPicker = useCallback(
         () =>
-            RNDocumentPicker.pick(documentPickerOptions).catch((error) => {
+            RNDocumentPicker.pick(getDocumentPickerOptions(type)).catch((error) => {
                 if (RNDocumentPicker.isCancel(error)) {
                     return;
                 }
@@ -166,7 +177,7 @@ function AttachmentPicker({type, children, shouldHideCameraOption}) {
                 showGeneralAlert(error.message);
                 throw error;
             }),
-        [showGeneralAlert],
+        [showGeneralAlert, type],
     );
 
     const menuItemData = useMemo(() => {
@@ -181,7 +192,7 @@ function AttachmentPicker({type, children, shouldHideCameraOption}) {
                 textTranslationKey: 'attachmentPicker.chooseFromGallery',
                 pickAttachment: () => showImagePicker(launchImageLibrary),
             },
-            type !== CONST.ATTACHMENT_PICKER_TYPE.IMAGE && {
+            {
                 icon: Expensicons.Paperclip,
                 textTranslationKey: 'attachmentPicker.chooseDocument',
                 pickAttachment: showDocumentPicker,
@@ -189,7 +200,7 @@ function AttachmentPicker({type, children, shouldHideCameraOption}) {
         ]);
 
         return data;
-    }, [showDocumentPicker, showImagePicker, type, shouldHideCameraOption]);
+    }, [showDocumentPicker, showImagePicker, shouldHideCameraOption]);
 
     const [focusedIndex, setFocusedIndex] = useArrowKeyFocusManager({initialFocusedIndex: -1, maxIndex: menuItemData.length - 1, isActive: isVisible});
 

From ca73fcf60201b19cdbd19fbfbe6c86eb3ba61e18 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 26 Jan 2024 09:35:51 -0800
Subject: [PATCH 025/305] Make spanish copy informal

---
 src/languages/es.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/languages/es.ts b/src/languages/es.ts
index 0dedfe8c4af3..a7a51de6ff67 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2634,7 +2634,7 @@ export default {
             [CONST.EXIT_SURVEY.REASONS.PREFER_CLASSIC]: '¿Por qué prefieres Expensify Classic?',
         },
         responsePlaceholder: 'Su respuesta',
-        thankYou: '¡Gracias por sus comentarios!',
+        thankYou: '¡Gracias por tus comentarios!',
         thankYouSubtitle: 'Sus respuestas nos ayudarán a crear un mejor producto para hacer las cosas bien. ¡Muchas gracias!',
         goToExpensifyClassic: 'Cambiar a Expensify Classic',
         offline:

From 99b780944dca5639f33e5c9ee0039b5b5a45edb4 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 26 Jan 2024 17:10:57 -0800
Subject: [PATCH 026/305] Hook up with API

---
 src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx  | 6 +++++-
 src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx   | 2 ++
 src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx | 6 +++++-
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index 284cc88fd015..e03515ab3742 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -9,6 +9,7 @@ import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
+import * as ExitSurvey from '@userActions/ExitSurvey';
 import * as Link from '@userActions/Link';
 import CONST from '@src/CONST';
 
@@ -31,7 +32,10 @@ function ExitSurveyConfirmPage() {
                 <Button
                     success
                     text={translate('exitSurvey.goToExpensifyClassic')}
-                    onPress={() => Link.openOldDotLink(CONST.OLDDOT_URLS.INBOX)}
+                    onPress={() => {
+                        ExitSurvey.switchToOldDot();
+                        Link.openOldDotLink(CONST.OLDDOT_URLS.INBOX);
+                    }}
                 />
             </FixedFooter>
         </ScreenWrapper>
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index dcf7fb839290..f1fea45dd0ca 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -10,6 +10,7 @@ import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
+import * as ExitSurvey from '@userActions/ExitSurvey';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
@@ -51,6 +52,7 @@ function ExitSurveyReasonPage() {
                     if (!reason) {
                         return;
                     }
+                    ExitSurvey.saveExitReason(reason);
                     Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(reason));
                 }}
                 submitButtonText={translate('common.next')}
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index cc1b6ed237c7..8015522ed07e 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -16,6 +16,7 @@ import updateMultilineInputRange from '@libs/updateMultilineInputRange';
 import Navigation from '@navigation/Navigation';
 import type {SettingsNavigatorParamList} from '@navigation/types';
 import variables from '@styles/variables';
+import * as ExitSurvey from '@userActions/ExitSurvey';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
@@ -73,7 +74,10 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
             <FormProvider
                 formID={ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM}
                 style={[styles.flex1, styles.mh5, formTopMarginsStyle, StyleUtils.getMaximumHeight(formMaxHeight)]}
-                onSubmit={() => Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM)}
+                onSubmit={() => {
+                    ExitSurvey.saveResponse(response);
+                    Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM);
+                }}
                 submitButtonText={translate('common.next')}
                 validate={() => {
                     if (response?.trim()) {

From fa47d7f6eaeabea2d8228016a8af689a48bfe563 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 26 Jan 2024 17:12:27 -0800
Subject: [PATCH 027/305] whoops, forgot to commit this file

---
 src/libs/actions/ExitSurvey.ts | 45 ++++++++++++++++++++++++++++++++++
 1 file changed, 45 insertions(+)
 create mode 100644 src/libs/actions/ExitSurvey.ts

diff --git a/src/libs/actions/ExitSurvey.ts b/src/libs/actions/ExitSurvey.ts
new file mode 100644
index 000000000000..532e850a4cab
--- /dev/null
+++ b/src/libs/actions/ExitSurvey.ts
@@ -0,0 +1,45 @@
+import Onyx from 'react-native-onyx';
+import type {ValueOf} from 'type-fest';
+import * as API from '@libs/API';
+import Log from '@libs/Log';
+import CONST from '@src/CONST';
+import ONYXKEYS from '@src/ONYXKEYS';
+
+let exitReason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS> | undefined;
+let exitSurveyResponse: string | undefined;
+Onyx.connect({
+    key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM,
+    callback: (value) => (exitReason = value?.[CONST.EXIT_SURVEY.REASON_INPUT_ID]),
+});
+Onyx.connect({
+    key: ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM,
+    callback: (value) => (exitSurveyResponse = value?.[CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]),
+});
+
+function saveExitReason(reason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>) {
+    console.log('RORY_DEBUG setting exit reason:', reason);
+    Onyx.merge(ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM, {[CONST.EXIT_SURVEY.REASON_INPUT_ID]: reason});
+}
+
+function saveResponse(response: string) {
+    console.log('RORY_DEBUG setting response:', response);
+    Onyx.merge(ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM, {[CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]: response});
+}
+
+/**
+ * Save the user's response to the mandatory exit survey in the back-end.
+ */
+function switchToOldDot() {
+    if (!exitReason || !exitSurveyResponse) {
+        console.log('RORY_DEBUG', {exitReason, exitSurveyResponse});
+        Log.hmmm('Attempted to call SwitchToOldDot without filling out mandatory survey.');
+        return;
+    }
+
+    API.write('SwitchToOldDot', {
+        reason: exitReason,
+        surveyResponse: exitSurveyResponse,
+    });
+}
+
+export {saveExitReason, saveResponse, switchToOldDot};

From fb01ab5ccc533070f098076440cfe341176aa635 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 26 Jan 2024 17:18:31 -0800
Subject: [PATCH 028/305] Fix types for API params

---
 src/libs/API/parameters/SwitchToOldDotParams.ts | 9 +++++++++
 src/libs/API/parameters/index.ts                | 1 +
 src/libs/API/types.ts                           | 2 ++
 src/libs/actions/ExitSurvey.ts                  | 3 ---
 4 files changed, 12 insertions(+), 3 deletions(-)
 create mode 100644 src/libs/API/parameters/SwitchToOldDotParams.ts

diff --git a/src/libs/API/parameters/SwitchToOldDotParams.ts b/src/libs/API/parameters/SwitchToOldDotParams.ts
new file mode 100644
index 000000000000..7fe363a542e4
--- /dev/null
+++ b/src/libs/API/parameters/SwitchToOldDotParams.ts
@@ -0,0 +1,9 @@
+import type {ValueOf} from 'type-fest';
+import type CONST from '@src/CONST';
+
+type SwitchToOldDotParams = {
+    reason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
+    surveyResponse: string;
+};
+
+export default SwitchToOldDotParams;
diff --git a/src/libs/API/parameters/index.ts b/src/libs/API/parameters/index.ts
index 039398c0fbf6..836802cd5a1c 100644
--- a/src/libs/API/parameters/index.ts
+++ b/src/libs/API/parameters/index.ts
@@ -122,3 +122,4 @@ export type {default as ReopenTaskParams} from './ReopenTaskParams';
 export type {default as CompleteTaskParams} from './CompleteTaskParams';
 export type {default as CompleteEngagementModalParams} from './CompleteEngagementModalParams';
 export type {default as SetNameValuePairParams} from './SetNameValuePairParams';
+export type {default as SwitchToOldDotParams} from './SwitchToOldDotParams';
diff --git a/src/libs/API/types.ts b/src/libs/API/types.ts
index f58ebc30b4a2..073e2c0fc694 100644
--- a/src/libs/API/types.ts
+++ b/src/libs/API/types.ts
@@ -113,6 +113,7 @@ const WRITE_COMMANDS = {
     COMPLETE_TASK: 'CompleteTask',
     COMPLETE_ENGAGEMENT_MODAL: 'CompleteEngagementModal',
     SET_NAME_VALUE_PAIR: 'SetNameValuePair',
+    SWITCH_TO_OLD_DOT: 'SwitchToOldDot',
 } as const;
 
 type WriteCommand = ValueOf<typeof WRITE_COMMANDS>;
@@ -223,6 +224,7 @@ type WriteCommandParameters = {
     [WRITE_COMMANDS.COMPLETE_TASK]: Parameters.CompleteTaskParams;
     [WRITE_COMMANDS.COMPLETE_ENGAGEMENT_MODAL]: Parameters.CompleteEngagementModalParams;
     [WRITE_COMMANDS.SET_NAME_VALUE_PAIR]: Parameters.SetNameValuePairParams;
+    [WRITE_COMMANDS.SWITCH_TO_OLD_DOT]: Parameters.SwitchToOldDotParams;
 };
 
 const READ_COMMANDS = {
diff --git a/src/libs/actions/ExitSurvey.ts b/src/libs/actions/ExitSurvey.ts
index 532e850a4cab..766d0463257a 100644
--- a/src/libs/actions/ExitSurvey.ts
+++ b/src/libs/actions/ExitSurvey.ts
@@ -17,12 +17,10 @@ Onyx.connect({
 });
 
 function saveExitReason(reason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>) {
-    console.log('RORY_DEBUG setting exit reason:', reason);
     Onyx.merge(ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM, {[CONST.EXIT_SURVEY.REASON_INPUT_ID]: reason});
 }
 
 function saveResponse(response: string) {
-    console.log('RORY_DEBUG setting response:', response);
     Onyx.merge(ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM, {[CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]: response});
 }
 
@@ -31,7 +29,6 @@ function saveResponse(response: string) {
  */
 function switchToOldDot() {
     if (!exitReason || !exitSurveyResponse) {
-        console.log('RORY_DEBUG', {exitReason, exitSurveyResponse});
         Log.hmmm('Attempted to call SwitchToOldDot without filling out mandatory survey.');
         return;
     }

From 6f7026f9842f866c463ff83bd9a822c8e0ec77a0 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 26 Jan 2024 17:34:17 -0800
Subject: [PATCH 029/305] Fix regression:
 https://github.com/Expensify/App/pull/34787\#issuecomment-1912900085

---
 src/components/TextInput/BaseTextInput/index.native.tsx | 2 +-
 src/components/TextInput/BaseTextInput/index.tsx        | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/TextInput/BaseTextInput/index.native.tsx b/src/components/TextInput/BaseTextInput/index.native.tsx
index afd796d8c878..7a230bc90fe4 100644
--- a/src/components/TextInput/BaseTextInput/index.native.tsx
+++ b/src/components/TextInput/BaseTextInput/index.native.tsx
@@ -426,7 +426,7 @@ function BaseTextInput(
                         styles.visibilityHidden,
                     ]}
                     onLayout={(e) => {
-                        if (e.nativeEvent.layout.width === 0) {
+                        if (e.nativeEvent.layout.width === 0 && e.nativeEvent.layout.height === 0) {
                             return;
                         }
                         setTextInputWidth(e.nativeEvent.layout.width);
diff --git a/src/components/TextInput/BaseTextInput/index.tsx b/src/components/TextInput/BaseTextInput/index.tsx
index 4fa47eff4128..7ca8c69153f1 100644
--- a/src/components/TextInput/BaseTextInput/index.tsx
+++ b/src/components/TextInput/BaseTextInput/index.tsx
@@ -447,7 +447,7 @@ function BaseTextInput(
                         styles.visibilityHidden,
                     ]}
                     onLayout={(e) => {
-                        if (e.nativeEvent.layout.width === 0) {
+                        if (e.nativeEvent.layout.width === 0 && e.nativeEvent.layout.height === 0) {
                             return;
                         }
                         let additionalWidth = 0;

From 7315ae8bd8af2198a5060461bb0687e4ae88d419 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Mon, 29 Jan 2024 15:11:29 -0500
Subject: [PATCH 030/305] Add originalMessage to reportAction in
 reportActionsSelector for LHN

---
 src/pages/home/sidebar/SidebarLinksData.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/pages/home/sidebar/SidebarLinksData.js b/src/pages/home/sidebar/SidebarLinksData.js
index d64734a78085..6072395fde50 100644
--- a/src/pages/home/sidebar/SidebarLinksData.js
+++ b/src/pages/home/sidebar/SidebarLinksData.js
@@ -213,7 +213,7 @@ const chatReportSelector = (report) =>
 const reportActionsSelector = (reportActions) =>
     reportActions &&
     lodashMap(reportActions, (reportAction) => {
-        const {reportActionID, parentReportActionID, actionName, errors = []} = reportAction;
+        const {reportActionID, parentReportActionID, actionName, errors = [], originalMessage} = reportAction;
         const decision = lodashGet(reportAction, 'message[0].moderationDecision.decision');
 
         return {
@@ -226,6 +226,7 @@ const reportActionsSelector = (reportActions) =>
                     moderationDecision: {decision},
                 },
             ],
+            originalMessage,
         };
     });
 

From 33da1f434bec083d6b19fc9ac9ba07ff2458c852 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Mon, 29 Jan 2024 15:39:32 -0500
Subject: [PATCH 031/305] Add optimistic transaction thread logic for iou
 functions

---
 src/libs/actions/IOU.js | 179 ++++++++++++++++++++++++++++++++++------
 1 file changed, 156 insertions(+), 23 deletions(-)

diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js
index 3d6664099866..e01a7a1127c3 100644
--- a/src/libs/actions/IOU.js
+++ b/src/libs/actions/IOU.js
@@ -350,6 +350,8 @@ function getOutstandingChildRequest(policy, needsToBeManuallySubmitted) {
  * @param {Array} optimisticPolicyRecentlyUsedTags
  * @param {boolean} isNewChatReport
  * @param {boolean} isNewIOUReport
+ * @param {Object} transactionThreadReport
+ * @param {Object} transactionThreadCreatedReportAction
  * @param {Object} policy - May be undefined, an empty object, or an object matching the Policy type (src/types/onyx/Policy.ts)
  * @param {Array} policyTags
  * @param {Array} policyCategories
@@ -369,6 +371,8 @@ function buildOnyxDataForMoneyRequest(
     optimisticPolicyRecentlyUsedTags,
     isNewChatReport,
     isNewIOUReport,
+    transactionThreadReport,
+    transactionThreadCreatedReportAction,
     policy,
     policyTags,
     policyCategories,
@@ -423,6 +427,18 @@ function buildOnyxDataForMoneyRequest(
                 [iouAction.reportActionID]: iouAction,
             },
         },
+        {
+            onyxMethod: Onyx.METHOD.SET,
+            key: `${ONYXKEYS.COLLECTION.REPORT}${transactionThreadReport.reportID}`,
+            value: transactionThreadReport,
+        },
+        {
+            onyxMethod: Onyx.METHOD.SET,
+            key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${transactionThreadReport.reportID}`,
+            value: {
+                [transactionThreadCreatedReportAction.reportActionID]: transactionThreadCreatedReportAction,
+            },
+        },
 
         // Remove the temporary transaction used during the creation flow
         {
@@ -477,6 +493,14 @@ function buildOnyxDataForMoneyRequest(
                 errorFields: null,
             },
         },
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.REPORT}${transactionThreadReport.reportID}`,
+            value: {
+                pendingFields: null,
+                errorFields: null,
+            },
+        },
         {
             onyxMethod: Onyx.METHOD.MERGE,
             key: `${ONYXKEYS.COLLECTION.TRANSACTION}${transaction.transactionID}`,
@@ -521,6 +545,16 @@ function buildOnyxDataForMoneyRequest(
                 },
             },
         },
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${transactionThreadReport.reportID}`,
+            value: {
+                [transactionThreadCreatedReportAction.reportActionID]: {
+                    pendingAction: null,
+                    errors: null,
+                },
+            },
+        },
     ];
 
     const failureData = [
@@ -551,6 +585,15 @@ function buildOnyxDataForMoneyRequest(
                 },
             },
         },
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.REPORT}${transactionThreadReport.reportID}`,
+            value: {
+                errorFields: {
+                    createChat: ErrorUtils.getMicroSecondOnyxError('report.genericCreateReportFailureMessage'),
+                },
+            },
+        },
         {
             onyxMethod: Onyx.METHOD.MERGE,
             key: `${ONYXKEYS.COLLECTION.TRANSACTION}${transaction.transactionID}`,
@@ -609,6 +652,15 @@ function buildOnyxDataForMoneyRequest(
                       }),
             },
         },
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${transactionThreadReport.reportID}`,
+            value: {
+                [transactionThreadCreatedReportAction.reportActionID]: {
+                    errors: ErrorUtils.getMicroSecondOnyxError('iou.error.genericCreateFailureMessage'),
+                },
+            },
+        },
     ];
 
     // Policy won't be set for P2P cases for which we don't need to compute violations
@@ -661,6 +713,8 @@ function buildOnyxDataForMoneyRequest(
  * @returns {Object} data.createdIOUReportActionID
  * @returns {Object} data.reportPreviewAction
  * @returns {Object} data.onyxData
+ * @returns {Object} data.transactionThreadReportID
+ * @returns {Object} data.createdReportActionForThread
  * @returns {Object} data.onyxData.optimisticData
  * @returns {Object} data.onyxData.successData
  * @returns {Object} data.onyxData.failureData
@@ -786,7 +840,8 @@ function getMoneyRequestInformation(
     // 1. CREATED action for the chatReport
     // 2. CREATED action for the iouReport
     // 3. IOU action for the iouReport
-    // 4. REPORTPREVIEW action for the chatReport
+    // 4. The transaction thread, which requires the iouAction, and CREATED action for the transaction thread
+    // 5. REPORTPREVIEW action for the chatReport
     // Note: The CREATED action for the IOU report must be optimistically generated before the IOU action so there's no chance that it appears after the IOU action in the chat
     const currentTime = DateUtils.getDBTime();
     const optimisticCreatedActionForChat = ReportUtils.buildOptimisticCreatedReportAction(payeeEmail);
@@ -806,6 +861,8 @@ function getMoneyRequestInformation(
         false,
         currentTime,
     );
+    const optimisticTransactionThread = ReportUtils.buildTransactionThread(iouAction, iouReport.reportID);
+    const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(payeeEmail);
 
     let reportPreviewAction = isNewIOUReport ? null : ReportActionsUtils.getReportPreviewAction(chatReport.reportID, iouReport.reportID);
     if (reportPreviewAction) {
@@ -846,6 +903,8 @@ function getMoneyRequestInformation(
         optimisticPolicyRecentlyUsedTags,
         isNewChatReport,
         isNewIOUReport,
+        optimisticTransactionThread,
+        optimisticCreatedActionForTransactionThread,
         policy,
         policyTags,
         policyCategories,
@@ -862,6 +921,8 @@ function getMoneyRequestInformation(
         createdChatReportActionID: isNewChatReport ? optimisticCreatedActionForChat.reportActionID : 0,
         createdIOUReportActionID: isNewIOUReport ? optimisticCreatedActionForIOU.reportActionID : 0,
         reportPreviewAction,
+        transactionThreadReportID: optimisticTransactionThread.reportID,
+        createdReportActionIDForThread: optimisticCreatedActionForTransactionThread.reportActionID,
         onyxData: {
             optimisticData,
             successData,
@@ -898,7 +959,18 @@ function createDistanceRequest(report, participant, comment, created, category,
         source: ReceiptGeneric,
         state: CONST.IOU.RECEIPT_STATE.OPEN,
     };
-    const {iouReport, chatReport, transaction, iouAction, createdChatReportActionID, createdIOUReportActionID, reportPreviewAction, onyxData} = getMoneyRequestInformation(
+    const {
+        iouReport,
+        chatReport,
+        transaction,
+        iouAction,
+        createdChatReportActionID,
+        createdIOUReportActionID,
+        reportPreviewAction,
+        transactionThreadReportID,
+        createdReportActionIDForThread,
+        onyxData,
+    } = getMoneyRequestInformation(
         currentChatReport,
         participant,
         comment,
@@ -933,6 +1005,8 @@ function createDistanceRequest(report, participant, comment, created, category,
             category,
             tag,
             billable,
+            transactionThreadReportID,
+            createdReportActionIDForThread,
         },
         onyxData,
     );
@@ -1314,26 +1388,38 @@ function requestMoney(
     const isMoneyRequestReport = ReportUtils.isMoneyRequestReport(report);
     const currentChatReport = isMoneyRequestReport ? ReportUtils.getReport(report.chatReportID) : report;
     const currentCreated = DateUtils.enrichMoneyRequestTimestamp(created);
-    const {payerAccountID, payerEmail, iouReport, chatReport, transaction, iouAction, createdChatReportActionID, createdIOUReportActionID, reportPreviewAction, onyxData} =
-        getMoneyRequestInformation(
-            currentChatReport,
-            participant,
-            comment,
-            amount,
-            currency,
-            currentCreated,
-            merchant,
-            payeeAccountID,
-            payeeEmail,
-            receipt,
-            undefined,
-            category,
-            tag,
-            billable,
-            policy,
-            policyTags,
-            policyCategories,
-        );
+    const {
+        payerAccountID,
+        payerEmail,
+        iouReport,
+        chatReport,
+        transaction,
+        iouAction,
+        createdChatReportActionID,
+        createdIOUReportActionID,
+        reportPreviewAction,
+        transactionThreadReportID,
+        createdReportActionIDForThread,
+        onyxData,
+    } = getMoneyRequestInformation(
+        currentChatReport,
+        participant,
+        comment,
+        amount,
+        currency,
+        currentCreated,
+        merchant,
+        payeeAccountID,
+        payeeEmail,
+        receipt,
+        undefined,
+        category,
+        tag,
+        billable,
+        policy,
+        policyTags,
+        policyCategories,
+    );
     const activeReportID = isMoneyRequestReport ? report.reportID : chatReport.reportID;
 
     API.write(
@@ -1360,6 +1446,8 @@ function requestMoney(
             taxCode,
             taxAmount,
             billable,
+            transactionThreadReportID,
+            createdReportActionIDForThread,
         },
         onyxData,
     );
@@ -1670,6 +1758,10 @@ function createSplitsAndOnyxData(participants, currentUserLogin, currentUserAcco
         // Add tag to optimistic policy recently used tags when a participant is a workspace
         const optimisticPolicyRecentlyUsedTags = isPolicyExpenseChat ? Policy.buildOptimisticPolicyRecentlyUsedTags(participant.policyID, tag) : {};
 
+        // Create optimistic transactionThread
+        const optimisticTransactionThread = ReportUtils.buildTransactionThread(oneOnOneIOUAction, oneOnOneIOUReport.reportID);
+        const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(currentUserEmailForIOUSplit);
+
         // STEP 5: Build Onyx Data
         const [oneOnOneOptimisticData, oneOnOneSuccessData, oneOnOneFailureData] = buildOnyxDataForMoneyRequest(
             oneOnOneChatReport,
@@ -1697,6 +1789,8 @@ function createSplitsAndOnyxData(participants, currentUserLogin, currentUserAcco
             createdChatReportActionID: oneOnOneCreatedActionForChat.reportActionID,
             createdIOUReportActionID: oneOnOneCreatedActionForIOU.reportActionID,
             reportPreviewReportActionID: oneOnOneReportPreviewAction.reportActionID,
+            transactionThreadReportID: optimisticTransactionThread.reportID,
+            createdReportActionIDForThread: optimisticCreatedActionForTransactionThread.reportActionID,
         };
 
         splits.push(individualSplit);
@@ -2230,6 +2324,9 @@ function completeSplitBill(chatReportID, reportAction, updatedTransaction, sessi
             oneOnOneReportPreviewAction = ReportUtils.buildOptimisticReportPreview(oneOnOneChatReport, oneOnOneIOUReport, '', oneOnOneTransaction);
         }
 
+        const optimisticTransactionThread = ReportUtils.buildTransactionThread(oneOnOneIOUAction, oneOnOneIOUReport.reportID);
+        const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(currentUserEmailForIOUSplit);
+
         const [oneOnOneOptimisticData, oneOnOneSuccessData, oneOnOneFailureData] = buildOnyxDataForMoneyRequest(
             oneOnOneChatReport,
             oneOnOneIOUReport,
@@ -2256,6 +2353,8 @@ function completeSplitBill(chatReportID, reportAction, updatedTransaction, sessi
             createdChatReportActionID: oneOnOneCreatedActionForChat.reportActionID,
             createdIOUReportActionID: oneOnOneCreatedActionForIOU.reportActionID,
             reportPreviewReportActionID: oneOnOneReportPreviewAction.reportActionID,
+            transactionThreadReportID: optimisticTransactionThread.reportID,
+            createdReportActionIDForThread: optimisticCreatedActionForTransactionThread.reportActionID,
         });
 
         optimisticData.push(...oneOnOneOptimisticData);
@@ -2918,6 +3017,9 @@ function getSendMoneyParams(report, amount, currency, comment, paymentMethodType
 
     const reportPreviewAction = ReportUtils.buildOptimisticReportPreview(chatReport, optimisticIOUReport);
 
+    const optimisticTransactionThread = ReportUtils.buildTransactionThread(optimisticIOUReportAction, optimisticIOUReport.reportID);
+    const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(recipientEmail);
+
     // First, add data that will be used in all cases
     const optimisticChatReportData = {
         onyxMethod: Onyx.METHOD.MERGE,
@@ -2937,6 +3039,11 @@ function getSendMoneyParams(report, amount, currency, comment, paymentMethodType
             lastMessageHtml: optimisticIOUReportAction.message[0].html,
         },
     };
+    const optimisticTransactionThreadData = {
+        onyxMethod: Onyx.METHOD.SET,
+        key: `${ONYXKEYS.COLLECTION.REPORT}${optimisticTransactionThread.reportID}`,
+        value: optimisticTransactionThread,
+    };
     const optimisticIOUReportActionsData = {
         onyxMethod: Onyx.METHOD.MERGE,
         key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${optimisticIOUReport.reportID}`,
@@ -2954,6 +3061,13 @@ function getSendMoneyParams(report, amount, currency, comment, paymentMethodType
             [reportPreviewAction.reportActionID]: reportPreviewAction,
         },
     };
+    const optimisticTransactionThreadReportActionsData = {
+        onyxMethod: Onyx.METHOD.MERGE,
+        key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${optimisticTransactionThread.reportID}`,
+        value: {
+            [optimisticCreatedActionForTransactionThread.reportActionID]: optimisticCreatedActionForTransactionThread,
+        },
+    };
 
     const successData = [
         {
@@ -2979,6 +3093,15 @@ function getSendMoneyParams(report, amount, currency, comment, paymentMethodType
                 },
             },
         },
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${optimisticTransactionThread.reportID}`,
+            value: {
+                [optimisticCreatedActionForTransactionThread.reportActionID]: {
+                    pendingAction: null,
+                },
+            },
+        },
     ];
 
     const failureData = [
@@ -3056,7 +3179,15 @@ function getSendMoneyParams(report, amount, currency, comment, paymentMethodType
         });
     }
 
-    const optimisticData = [optimisticChatReportData, optimisticIOUReportData, optimisticChatReportActionsData, optimisticIOUReportActionsData, optimisticTransactionData];
+    const optimisticData = [
+        optimisticChatReportData,
+        optimisticIOUReportData,
+        optimisticChatReportActionsData,
+        optimisticIOUReportActionsData,
+        optimisticTransactionData,
+        optimisticTransactionThreadData,
+        optimisticTransactionThreadReportActionsData,
+    ];
     if (!_.isEmpty(optimisticPersonalDetailListData)) {
         optimisticData.push(optimisticPersonalDetailListData);
     }
@@ -3071,6 +3202,8 @@ function getSendMoneyParams(report, amount, currency, comment, paymentMethodType
             newIOUReportDetails,
             createdReportActionID: isNewChat ? optimisticCreatedAction.reportActionID : 0,
             reportPreviewReportActionID: reportPreviewAction.reportActionID,
+            transactionThreadReportID: optimisticTransactionThread.reportID,
+            createdReportActionIDForThread: optimisticCreatedActionForTransactionThread.reportActionID,
         },
         optimisticData,
         successData,

From d1325b39026f8fbcc8eb7f427a2833dd724f1296 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Mon, 29 Jan 2024 16:11:40 -0500
Subject: [PATCH 032/305] Update LHN logic to allow Transaction Threads with
 Violations to be shown

---
 src/components/LHNOptionsList/OptionRowLHN.tsx | 11 +++++++----
 src/libs/ReportUtils.ts                        | 12 +++++++-----
 2 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/src/components/LHNOptionsList/OptionRowLHN.tsx b/src/components/LHNOptionsList/OptionRowLHN.tsx
index ae225b3db9e9..923337ba9ada 100644
--- a/src/components/LHNOptionsList/OptionRowLHN.tsx
+++ b/src/components/LHNOptionsList/OptionRowLHN.tsx
@@ -52,8 +52,13 @@ function OptionRowLHN({reportID, isFocused = false, onSelectRow = () => {}, opti
         return null;
     }
 
-    const isHidden = optionItem?.notificationPreference === CONST.REPORT.NOTIFICATION_PREFERENCE.HIDDEN;
-    if (isHidden && !isFocused && !optionItem?.isPinned) {
+    const hasBrickError = optionItem.brickRoadIndicator === CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR;
+    const shouldShowGreenDotIndicator = !hasBrickError && ReportUtils.requiresAttentionFromCurrentUser(optionItem, optionItem.parentReportAction);
+
+    const isHidden = optionItem.notificationPreference === CONST.REPORT.NOTIFICATION_PREFERENCE.HIDDEN;
+
+    const shouldOverrideHidden = hasBrickError || isFocused || optionItem.isPinned;
+    if (isHidden && !shouldOverrideHidden) {
         return null;
     }
 
@@ -74,8 +79,6 @@ function OptionRowLHN({reportID, isFocused = false, onSelectRow = () => {}, opti
     const hoveredBackgroundColor = !!styles.sidebarLinkHover && 'backgroundColor' in styles.sidebarLinkHover ? styles.sidebarLinkHover.backgroundColor : theme.sidebar;
     const focusedBackgroundColor = styles.sidebarLinkActive.backgroundColor;
 
-    const hasBrickError = optionItem.brickRoadIndicator === CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR;
-    const shouldShowGreenDotIndicator = !hasBrickError && ReportUtils.requiresAttentionFromCurrentUser(optionItem, optionItem.parentReportAction);
     /**
      * Show the ReportActionContextMenu modal popover.
      *
diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index 58b0489314a0..1d9b8d013cad 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -3648,6 +3648,13 @@ function shouldReportBeInOptionList({
         return true;
     }
 
+    const reportIsSettled = report.statusNum === CONST.REPORT.STATUS_NUM.REIMBURSED;
+
+    // Always show IOU reports with violations unless they are reimbursed
+    if (isExpenseRequest(report) && doesReportHaveViolations && !reportIsSettled) {
+        return true;
+    }
+
     // Hide only chat threads that haven't been commented on (other threads are actionable)
     if (isChatThread(report) && canHideReport && isEmptyChat) {
         return false;
@@ -3659,11 +3666,6 @@ function shouldReportBeInOptionList({
         return true;
     }
 
-    // Always show IOU reports with violations
-    if (isExpenseRequest(report) && doesReportHaveViolations) {
-        return true;
-    }
-
     // All unread chats (even archived ones) in GSD mode will be shown. This is because GSD mode is specifically for focusing the user on the most relevant chats, primarily, the unread ones
     if (isInGSDMode) {
         return isUnread(report) && report.notificationPreference !== CONST.REPORT.NOTIFICATION_PREFERENCE.MUTE;

From bf336ce123bfdeae30bcfa35e053d7248b79761b Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Mon, 29 Jan 2024 17:38:24 -0800
Subject: [PATCH 033/305] Bump type-fest

---
 package-lock.json | 57 ++++++++++++++++++++++++++++++++---------------
 package.json      |  2 +-
 2 files changed, 40 insertions(+), 19 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index c1328d498c79..db7ccddb2e84 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -230,7 +230,7 @@
         "shellcheck": "^1.1.0",
         "style-loader": "^2.0.0",
         "time-analytics-webpack-plugin": "^0.1.17",
-        "type-fest": "^3.12.0",
+        "type-fest": "^4.10.1",
         "typescript": "^5.3.2",
         "wait-port": "^0.2.9",
         "webpack": "^5.76.0",
@@ -7926,9 +7926,9 @@
       }
     },
     "node_modules/@pmmmwh/react-refresh-webpack-plugin": {
-      "version": "0.5.10",
-      "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.10.tgz",
-      "integrity": "sha512-j0Ya0hCFZPd4x40qLzbhGsh9TMtdb+CJQiso+WxLOPNasohq9cc5SNUcwsZaRH6++Xh91Xkm/xHCkuIiIu0LUA==",
+      "version": "0.5.11",
+      "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.11.tgz",
+      "integrity": "sha512-7j/6vdTym0+qZ6u4XbSAxrWBGYSdCfTzySkj7WAFgDLmSyWlOrWvpyzxlFh5jtw9dn0oL/jtW+06XfFiisN3JQ==",
       "dev": true,
       "dependencies": {
         "ansi-html-community": "^0.0.8",
@@ -7948,7 +7948,7 @@
         "@types/webpack": "4.x || 5.x",
         "react-refresh": ">=0.10.0 <1.0.0",
         "sockjs-client": "^1.4.0",
-        "type-fest": ">=0.17.0 <4.0.0",
+        "type-fest": ">=0.17.0 <5.0.0",
         "webpack": ">=4.43.0 <6.0.0",
         "webpack-dev-server": "3.x || 4.x",
         "webpack-hot-middleware": "2.x",
@@ -26744,10 +26744,11 @@
       }
     },
     "node_modules/core-js-pure": {
-      "version": "3.24.1",
+      "version": "3.35.1",
+      "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.35.1.tgz",
+      "integrity": "sha512-zcIdi/CL3MWbBJYo5YCeVAAx+Sy9yJE9I3/u9LkFABwbeaPhTMRWraM8mYFp9jW5Z50hOy7FVzCc8dCrpZqtIQ==",
       "dev": true,
       "hasInstallScript": true,
-      "license": "MIT",
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/core-js"
@@ -38453,6 +38454,17 @@
         "node": ">=8"
       }
     },
+    "node_modules/jest-watch-typeahead/node_modules/type-fest": {
+      "version": "3.13.1",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-3.13.1.tgz",
+      "integrity": "sha512-tLq3bSNx+xSpwvAJnzrK0Ep5CLNWjvFTOp71URMaAEWBfRb9nnJiBoUe0tF8bI4ZFO3omgBR6NvnbzVUT3Ly4g==",
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/jest-watcher": {
       "version": "29.4.1",
       "license": "MIT",
@@ -50805,11 +50817,12 @@
       }
     },
     "node_modules/type-fest": {
-      "version": "3.13.1",
-      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-3.13.1.tgz",
-      "integrity": "sha512-tLq3bSNx+xSpwvAJnzrK0Ep5CLNWjvFTOp71URMaAEWBfRb9nnJiBoUe0tF8bI4ZFO3omgBR6NvnbzVUT3Ly4g==",
+      "version": "4.10.1",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.10.1.tgz",
+      "integrity": "sha512-7ZnJYTp6uc04uYRISWtiX3DSKB/fxNQT0B5o1OUeCqiQiwF+JC9+rJiZIDrPrNCLLuTqyQmh4VdQqh/ZOkv9MQ==",
+      "dev": true,
       "engines": {
-        "node": ">=14.16"
+        "node": ">=16"
       },
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"
@@ -59194,9 +59207,9 @@
       "optional": true
     },
     "@pmmmwh/react-refresh-webpack-plugin": {
-      "version": "0.5.10",
-      "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.10.tgz",
-      "integrity": "sha512-j0Ya0hCFZPd4x40qLzbhGsh9TMtdb+CJQiso+WxLOPNasohq9cc5SNUcwsZaRH6++Xh91Xkm/xHCkuIiIu0LUA==",
+      "version": "0.5.11",
+      "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.11.tgz",
+      "integrity": "sha512-7j/6vdTym0+qZ6u4XbSAxrWBGYSdCfTzySkj7WAFgDLmSyWlOrWvpyzxlFh5jtw9dn0oL/jtW+06XfFiisN3JQ==",
       "dev": true,
       "requires": {
         "ansi-html-community": "^0.0.8",
@@ -72791,7 +72804,9 @@
       }
     },
     "core-js-pure": {
-      "version": "3.24.1",
+      "version": "3.35.1",
+      "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.35.1.tgz",
+      "integrity": "sha512-zcIdi/CL3MWbBJYo5YCeVAAx+Sy9yJE9I3/u9LkFABwbeaPhTMRWraM8mYFp9jW5Z50hOy7FVzCc8dCrpZqtIQ==",
       "dev": true
     },
     "core-util-is": {
@@ -81177,6 +81192,11 @@
           "requires": {
             "has-flag": "^4.0.0"
           }
+        },
+        "type-fest": {
+          "version": "3.13.1",
+          "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-3.13.1.tgz",
+          "integrity": "sha512-tLq3bSNx+xSpwvAJnzrK0Ep5CLNWjvFTOp71URMaAEWBfRb9nnJiBoUe0tF8bI4ZFO3omgBR6NvnbzVUT3Ly4g=="
         }
       }
     },
@@ -90002,9 +90022,10 @@
       "integrity": "sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g=="
     },
     "type-fest": {
-      "version": "3.13.1",
-      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-3.13.1.tgz",
-      "integrity": "sha512-tLq3bSNx+xSpwvAJnzrK0Ep5CLNWjvFTOp71URMaAEWBfRb9nnJiBoUe0tF8bI4ZFO3omgBR6NvnbzVUT3Ly4g=="
+      "version": "4.10.1",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.10.1.tgz",
+      "integrity": "sha512-7ZnJYTp6uc04uYRISWtiX3DSKB/fxNQT0B5o1OUeCqiQiwF+JC9+rJiZIDrPrNCLLuTqyQmh4VdQqh/ZOkv9MQ==",
+      "dev": true
     },
     "type-is": {
       "version": "1.6.18",
diff --git a/package.json b/package.json
index 96de7fb0ab77..fda255265071 100644
--- a/package.json
+++ b/package.json
@@ -278,7 +278,7 @@
     "shellcheck": "^1.1.0",
     "style-loader": "^2.0.0",
     "time-analytics-webpack-plugin": "^0.1.17",
-    "type-fest": "^3.12.0",
+    "type-fest": "^4.10.1",
     "typescript": "^5.3.2",
     "wait-port": "^0.2.9",
     "webpack": "^5.76.0",

From e46c3d2dd5c1f6dadfd14d125d9e5a9f2a71e30e Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Tue, 30 Jan 2024 11:14:57 +0700
Subject: [PATCH 034/305] fix logic get document picker

---
 src/components/AttachmentPicker/index.native.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/AttachmentPicker/index.native.js b/src/components/AttachmentPicker/index.native.js
index 8a60a46e2855..a0fe760abcc1 100644
--- a/src/components/AttachmentPicker/index.native.js
+++ b/src/components/AttachmentPicker/index.native.js
@@ -65,12 +65,12 @@ const getImagePickerOptions = (type) => {
 const getDocumentPickerOptions = (type) => {
     if (type === CONST.ATTACHMENT_PICKER_TYPE.IMAGE) {
         return {
-            type: [RNDocumentPicker.types.allFiles],
+            type: [RNDocumentPicker.types.images],
             copyTo: 'cachesDirectory',
         };
     }
     return {
-        type: [RNDocumentPicker.types.images],
+        type: [RNDocumentPicker.types.allFiles],
         copyTo: 'cachesDirectory',
     };
 };

From d85a2fe95b55d3307f4de4ab375fd128b750981c Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Tue, 30 Jan 2024 10:42:08 -0800
Subject: [PATCH 035/305] Wrap RadioButtons with forwardRef

---
 src/components/RadioButtons.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/RadioButtons.tsx b/src/components/RadioButtons.tsx
index 0055f23ca29d..047fb72f420d 100644
--- a/src/components/RadioButtons.tsx
+++ b/src/components/RadioButtons.tsx
@@ -1,4 +1,4 @@
-import React, {useState} from 'react';
+import React, {forwardRef, useState} from 'react';
 import {View} from 'react-native';
 import type {StyleProp, ViewStyle} from 'react-native';
 import useThemeStyles from '@hooks/useThemeStyles';
@@ -51,4 +51,4 @@ function RadioButtons({items, onPress, errorText}: RadioButtonsProps) {
 RadioButtons.displayName = 'RadioButtons';
 
 export type {Choice};
-export default RadioButtons;
+export default forwardRef(RadioButtons);

From e1e5283c1512a060e3ea26591c482e3f35950ded Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Tue, 30 Jan 2024 10:43:28 -0800
Subject: [PATCH 036/305] Add ExitSurveyForm onyx types

---
 src/ONYXKEYS.ts         | 11 +++--------
 src/types/onyx/index.ts | 14 +++++++++++++-
 2 files changed, 16 insertions(+), 9 deletions(-)

diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts
index b90916804160..9b6287f62def 100755
--- a/src/ONYXKEYS.ts
+++ b/src/ONYXKEYS.ts
@@ -545,15 +545,10 @@ type OnyxValues = {
     // @ts-expect-error Different values are defined under the same key: ReimbursementAccount and ReimbursementAccountForm
     [ONYXKEYS.FORMS.REIMBURSEMENT_ACCOUNT_FORM]: OnyxTypes.Form;
     [ONYXKEYS.FORMS.REIMBURSEMENT_ACCOUNT_FORM_DRAFT]: OnyxTypes.Form;
-    [ONYXKEYS.FORMS.POLICY_REPORT_FIELD_EDIT_FORM_DRAFT]: OnyxTypes.Form | undefined;
-    [ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM]: OnyxTypes.Form & {
-        [CONST.EXIT_SURVEY.REASON_INPUT_ID]: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
-    };
+    [ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM]: OnyxTypes.ExitSurveyReasonForm;
     [ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM_DRAFT]: OnyxTypes.Form;
-    [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM]: OnyxTypes.Form & {
-        [CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]: string;
-    };
-    [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM_DRAFT]: OnyxTypes.Form;
+    [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM]: OnyxTypes.ExitSurveyResponseForm;
+    [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM_DRAFT]: OnyxTypes.ExitSurveyResponseForm;
 };
 
 type OnyxKeyValue<TOnyxKey extends (OnyxKey | OnyxCollectionKey) & keyof OnyxValues> = OnyxEntry<OnyxValues[TOnyxKey]>;
diff --git a/src/types/onyx/index.ts b/src/types/onyx/index.ts
index 5b04cae58671..8f7afa24f03d 100644
--- a/src/types/onyx/index.ts
+++ b/src/types/onyx/index.ts
@@ -9,7 +9,17 @@ import type Credentials from './Credentials';
 import type Currency from './Currency';
 import type CustomStatusDraft from './CustomStatusDraft';
 import type Download from './Download';
-import type {AddDebitCardForm, DateOfBirthForm, DisplayNameForm, IKnowATeacherForm, IntroSchoolPrincipalForm, NewRoomForm, PrivateNotesForm} from './Form';
+import type {
+    AddDebitCardForm,
+    DateOfBirthForm,
+    DisplayNameForm,
+    ExitSurveyReasonForm,
+    ExitSurveyResponseForm,
+    IKnowATeacherForm,
+    IntroSchoolPrincipalForm,
+    NewRoomForm,
+    PrivateNotesForm,
+} from './Form';
 import type Form from './Form';
 import type FrequentlyUsedEmoji from './FrequentlyUsedEmoji';
 import type {FundList} from './Fund';
@@ -84,6 +94,8 @@ export type {
     CustomStatusDraft,
     DateOfBirthForm,
     Download,
+    ExitSurveyReasonForm,
+    ExitSurveyResponseForm,
     Form,
     FrequentlyUsedEmoji,
     Fund,

From b5cfed1c337f68b8a0422f44955f73a557d2f07e Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Tue, 30 Jan 2024 10:44:28 -0800
Subject: [PATCH 037/305] Add Onyx type in Form.ts as well

---
 src/types/onyx/Form.ts | 24 +++++++++++++++++++++++-
 1 file changed, 23 insertions(+), 1 deletion(-)

diff --git a/src/types/onyx/Form.ts b/src/types/onyx/Form.ts
index c3bcec2a2d3b..5759a320bfff 100644
--- a/src/types/onyx/Form.ts
+++ b/src/types/onyx/Form.ts
@@ -1,3 +1,5 @@
+import type {ValueOf} from 'type-fest';
+import type CONST from '@src/CONST';
 import type * as OnyxCommon from './OnyxCommon';
 
 type FormValueType = string | boolean | Date;
@@ -54,6 +56,26 @@ type PrivateNotesForm = Form<{
     privateNotes: string;
 }>;
 
+type ExitSurveyReasonForm = Form<{
+    [CONST.EXIT_SURVEY.REASON_INPUT_ID]: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
+}>;
+
+type ExitSurveyResponseForm = Form<{
+    [CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]: string;
+}>;
+
 export default Form;
 
-export type {AddDebitCardForm, DateOfBirthForm, PrivateNotesForm, DisplayNameForm, FormValueType, NewRoomForm, BaseForm, IKnowATeacherForm, IntroSchoolPrincipalForm};
+export type {
+    AddDebitCardForm,
+    DateOfBirthForm,
+    PrivateNotesForm,
+    DisplayNameForm,
+    FormValueType,
+    NewRoomForm,
+    BaseForm,
+    IKnowATeacherForm,
+    IntroSchoolPrincipalForm,
+    ExitSurveyReasonForm,
+    ExitSurveyResponseForm,
+};

From 13a33cf7df108bd0751b47412289b8a0a95856ff Mon Sep 17 00:00:00 2001
From: Ben Limpich <blimpich@expensify.com>
Date: Tue, 30 Jan 2024 12:52:10 -0800
Subject: [PATCH 038/305] remove unnecessary concierge check

---
 src/libs/ReportUtils.ts | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index 58b0489314a0..853c306d1cec 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -1561,14 +1561,6 @@ function getPersonalDetailsForAccountID(accountID: number): Partial<PersonalDeta
     if (!accountID) {
         return {};
     }
-    if (Number(accountID) === CONST.ACCOUNT_ID.CONCIERGE) {
-        return {
-            accountID,
-            displayName: 'Concierge',
-            login: CONST.EMAIL.CONCIERGE,
-            avatar: UserUtils.getDefaultAvatar(accountID),
-        };
-    }
     return (
         allPersonalDetails?.[accountID] ?? {
             avatar: UserUtils.getDefaultAvatar(accountID),

From 877915899b582594a861f90518d872a3239199d9 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Tue, 30 Jan 2024 21:10:08 -0500
Subject: [PATCH 039/305] Add optimisticTransactionThread and
 optimisticCreatedActionForTransactionThread

---
 src/libs/actions/IOU.js | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js
index e01a7a1127c3..5f47d5811da3 100644
--- a/src/libs/actions/IOU.js
+++ b/src/libs/actions/IOU.js
@@ -1776,6 +1776,8 @@ function createSplitsAndOnyxData(participants, currentUserLogin, currentUserAcco
             optimisticPolicyRecentlyUsedTags,
             isNewOneOnOneChatReport,
             shouldCreateNewOneOnOneIOUReport,
+            optimisticTransactionThread,
+            optimisticCreatedActionForTransactionThread,
         );
 
         const individualSplit = {
@@ -2340,6 +2342,8 @@ function completeSplitBill(chatReportID, reportAction, updatedTransaction, sessi
             {},
             isNewOneOnOneChatReport,
             shouldCreateNewOneOnOneIOUReport,
+            optimisticTransactionThread,
+            optimisticCreatedActionForTransactionThread,
         );
 
         splits.push({

From 6d07a21fde56b86d5f03991bf128e079720264ff Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Wed, 31 Jan 2024 09:43:12 -0500
Subject: [PATCH 040/305] Add policyTags and policyCategories to
 createSplitsAndOnyxData and splitBill functions

---
 src/libs/actions/IOU.js                       | 60 +++++++++++++++++--
 .../step/IOURequestStepConfirmation.js        | 18 +++++-
 .../iou/steps/MoneyRequestConfirmPage.js      |  6 ++
 3 files changed, 79 insertions(+), 5 deletions(-)

diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js
index 5f47d5811da3..09e498a6faae 100644
--- a/src/libs/actions/IOU.js
+++ b/src/libs/actions/IOU.js
@@ -1477,10 +1477,25 @@ function requestMoney(
  * @param {String} category
  * @param {String} tag
  * @param {String} existingSplitChatReportID - the report ID where the split bill happens, could be a group chat or a workspace chat
+ * @param {Array} policyTags
+ * @param {Array} policyCategories
  *
  * @return {Object}
  */
-function createSplitsAndOnyxData(participants, currentUserLogin, currentUserAccountID, amount, comment, currency, merchant, category, tag, existingSplitChatReportID = '') {
+function createSplitsAndOnyxData(
+    participants,
+    currentUserLogin,
+    currentUserAccountID,
+    amount,
+    comment,
+    currency,
+    merchant,
+    category,
+    tag,
+    existingSplitChatReportID = '',
+    policyTags,
+    policyCategories,
+) {
     const currentUserEmailForIOUSplit = OptionsListUtils.addSMSDomainIfPhoneNumber(currentUserLogin);
     const participantAccountIDs = _.map(participants, (participant) => Number(participant.accountID));
     const existingSplitChatReport =
@@ -1762,6 +1777,9 @@ function createSplitsAndOnyxData(participants, currentUserLogin, currentUserAcco
         const optimisticTransactionThread = ReportUtils.buildTransactionThread(oneOnOneIOUAction, oneOnOneIOUReport.reportID);
         const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(currentUserEmailForIOUSplit);
 
+        // Get the policy for the participant to determine if there should be transaction violations
+        const policy = ReportUtils.getPolicy(participant.policyID);
+
         // STEP 5: Build Onyx Data
         const [oneOnOneOptimisticData, oneOnOneSuccessData, oneOnOneFailureData] = buildOnyxDataForMoneyRequest(
             oneOnOneChatReport,
@@ -1778,6 +1796,9 @@ function createSplitsAndOnyxData(participants, currentUserLogin, currentUserAcco
             shouldCreateNewOneOnOneIOUReport,
             optimisticTransactionThread,
             optimisticCreatedActionForTransactionThread,
+            participant.isPolicyExpenseChat && policy,
+            policyTags,
+            policyCategories,
         );
 
         const individualSplit = {
@@ -1830,8 +1851,23 @@ function createSplitsAndOnyxData(participants, currentUserLogin, currentUserAcco
  * @param {String} category
  * @param {String} tag
  * @param {String} existingSplitChatReportID - Either a group DM or a workspace chat
+ * @param {Array} policyTags
+ * @param {Array} policyCategories
  */
-function splitBill(participants, currentUserLogin, currentUserAccountID, amount, comment, currency, merchant, category, tag, existingSplitChatReportID = '') {
+function splitBill(
+    participants,
+    currentUserLogin,
+    currentUserAccountID,
+    amount,
+    comment,
+    currency,
+    merchant,
+    category,
+    tag,
+    existingSplitChatReportID = '',
+    policyTags = [],
+    policyCategories = [],
+) {
     const {splitData, splits, onyxData} = createSplitsAndOnyxData(
         participants,
         currentUserLogin,
@@ -1843,6 +1879,8 @@ function splitBill(participants, currentUserLogin, currentUserAccountID, amount,
         category,
         tag,
         existingSplitChatReportID,
+        policyTags,
+        policyCategories,
     );
     API.write(
         'SplitBill',
@@ -1878,9 +1916,23 @@ function splitBill(participants, currentUserLogin, currentUserAccountID, amount,
  * @param {String} merchant
  * @param {String} category
  * @param {String} tag
+ * @param {Array} policyTags
+ * @param {Array} policyCategories
  */
-function splitBillAndOpenReport(participants, currentUserLogin, currentUserAccountID, amount, comment, currency, merchant, category, tag) {
-    const {splitData, splits, onyxData} = createSplitsAndOnyxData(participants, currentUserLogin, currentUserAccountID, amount, comment, currency, merchant, category, tag);
+function splitBillAndOpenReport(participants, currentUserLogin, currentUserAccountID, amount, comment, currency, merchant, category, tag, policyTags, policyCategories) {
+    const {splitData, splits, onyxData} = createSplitsAndOnyxData(
+        participants,
+        currentUserLogin,
+        currentUserAccountID,
+        amount,
+        comment,
+        currency,
+        merchant,
+        category,
+        tag,
+        policyTags,
+        policyCategories,
+    );
 
     API.write(
         'SplitBillAndOpenReport',
diff --git a/src/pages/iou/request/step/IOURequestStepConfirmation.js b/src/pages/iou/request/step/IOURequestStepConfirmation.js
index 6028a735d132..bd748e6681c9 100644
--- a/src/pages/iou/request/step/IOURequestStepConfirmation.js
+++ b/src/pages/iou/request/step/IOURequestStepConfirmation.js
@@ -244,6 +244,8 @@ function IOURequestStepConfirmation({
                     transaction.category,
                     transaction.tag,
                     report.reportID,
+                    policyTags,
+                    policyCategories,
                 );
                 return;
             }
@@ -260,6 +262,8 @@ function IOURequestStepConfirmation({
                     transaction.merchant,
                     transaction.category,
                     transaction.tag,
+                    policyTags,
+                    policyCategories,
                 );
                 return;
             }
@@ -276,7 +280,19 @@ function IOURequestStepConfirmation({
 
             requestMoney(selectedParticipants, trimmedComment);
         },
-        [iouType, transaction, currentUserPersonalDetails.login, currentUserPersonalDetails.accountID, report, requestType, createDistanceRequest, requestMoney, receiptFile],
+        [
+            iouType,
+            transaction,
+            currentUserPersonalDetails.login,
+            currentUserPersonalDetails.accountID,
+            report,
+            requestType,
+            createDistanceRequest,
+            requestMoney,
+            receiptFile,
+            policyTags,
+            policyCategories,
+        ],
     );
 
     /**
diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js
index 1738ac78df47..83c0d63af617 100644
--- a/src/pages/iou/steps/MoneyRequestConfirmPage.js
+++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js
@@ -272,6 +272,8 @@ function MoneyRequestConfirmPage(props) {
                     props.iou.tag,
                     reportID,
                     props.iou.merchant,
+                    props.policyTags,
+                    props.policyCategories,
                 );
                 return;
             }
@@ -288,6 +290,8 @@ function MoneyRequestConfirmPage(props) {
                     props.iou.category,
                     props.iou.tag,
                     props.iou.merchant,
+                    props.policyTags,
+                    props.policyCategories,
                 );
                 return;
             }
@@ -321,6 +325,8 @@ function MoneyRequestConfirmPage(props) {
             iouType,
             reportID,
             props.iou.merchant,
+            props.policyTags,
+            props.policyCategories,
         ],
     );
 

From 46c3870b9632abbb393abdb343989a8e05a355c0 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Wed, 31 Jan 2024 11:11:29 -0500
Subject: [PATCH 041/305] Fix undefined values for policyTags and
 policyCategories in createSplitsAndOnyxData function

---
 src/libs/actions/IOU.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js
index 09e498a6faae..ae0376992a04 100644
--- a/src/libs/actions/IOU.js
+++ b/src/libs/actions/IOU.js
@@ -1493,8 +1493,8 @@ function createSplitsAndOnyxData(
     category,
     tag,
     existingSplitChatReportID = '',
-    policyTags,
-    policyCategories,
+    policyTags = undefined,
+    policyCategories = undefined,
 ) {
     const currentUserEmailForIOUSplit = OptionsListUtils.addSMSDomainIfPhoneNumber(currentUserLogin);
     const participantAccountIDs = _.map(participants, (participant) => Number(participant.accountID));

From d61a4ed34229f9a05f1abdd0c7b86278b5ecd2ec Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Wed, 31 Jan 2024 11:35:28 -0500
Subject: [PATCH 042/305] Remove isNewIOUReport from getMoneyRequestInformation
 function

---
 src/libs/actions/IOU.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js
index 37d40f52bb78..77d6c23514f9 100644
--- a/src/libs/actions/IOU.js
+++ b/src/libs/actions/IOU.js
@@ -912,7 +912,6 @@ function getMoneyRequestInformation(
         optimisticPolicyRecentlyUsedCategories,
         optimisticPolicyRecentlyUsedTags,
         isNewChatReport,
-        isNewIOUReport,
         optimisticTransactionThread,
         optimisticCreatedActionForTransactionThread,
         shouldCreateNewMoneyRequestReport,

From e683b8f88f9d1bccece429ee46fb7bb69a0d7c84 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Wed, 31 Jan 2024 12:20:08 -0500
Subject: [PATCH 043/305] Remove unused parameters and update function
 signature

---
 src/libs/actions/IOU.js | 20 +++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js
index 77d6c23514f9..7bc0f9645d48 100644
--- a/src/libs/actions/IOU.js
+++ b/src/libs/actions/IOU.js
@@ -349,7 +349,6 @@ function getOutstandingChildRequest(policy, needsToBeManuallySubmitted) {
  * @param {Array} optimisticPolicyRecentlyUsedCategories
  * @param {Array} optimisticPolicyRecentlyUsedTags
  * @param {boolean} isNewChatReport
- * @param {boolean} isNewIOUReport
  * @param {Object} transactionThreadReport
  * @param {Object} transactionThreadCreatedReportAction
  * @param {boolean} shouldCreateNewMoneyRequestReport
@@ -371,7 +370,6 @@ function buildOnyxDataForMoneyRequest(
     optimisticPolicyRecentlyUsedCategories,
     optimisticPolicyRecentlyUsedTags,
     isNewChatReport,
-    isNewIOUReport,
     transactionThreadReport,
     transactionThreadCreatedReportAction,
     shouldCreateNewMoneyRequestReport,
@@ -1879,8 +1877,8 @@ function splitBill(
     category,
     tag,
     existingSplitChatReportID = '',
-    policyTags = [],
-    policyCategories = [],
+    policyTags = undefined,
+    policyCategories = undefined,
 ) {
     const {splitData, splits, onyxData} = createSplitsAndOnyxData(
         participants,
@@ -1933,7 +1931,19 @@ function splitBill(
  * @param {Array} policyTags
  * @param {Array} policyCategories
  */
-function splitBillAndOpenReport(participants, currentUserLogin, currentUserAccountID, amount, comment, currency, merchant, category, tag, policyTags, policyCategories) {
+function splitBillAndOpenReport(
+    participants,
+    currentUserLogin,
+    currentUserAccountID,
+    amount,
+    comment,
+    currency,
+    merchant,
+    category,
+    tag,
+    policyTags = undefined,
+    policyCategories = undefined,
+) {
     const {splitData, splits, onyxData} = createSplitsAndOnyxData(
         participants,
         currentUserLogin,

From 86bf87fed55a9b24fa9625bf706e6261c8d83cf9 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 31 Jan 2024 09:55:05 -0800
Subject: [PATCH 044/305] Fix typecheck

---
 src/components/Form/FormProvider.tsx          |  4 ++--
 src/components/Form/types.ts                  | 15 ++++++++-------
 src/pages/settings/AboutPage.tsx              |  8 +-------
 .../ExitSurvey/ExitSurveyReasonPage.tsx       | 19 ++++++++++---------
 .../ExitSurvey/ExitSurveyResponsePage.tsx     | 17 ++++++++---------
 5 files changed, 29 insertions(+), 34 deletions(-)

diff --git a/src/components/Form/FormProvider.tsx b/src/components/Form/FormProvider.tsx
index 424fd989291a..ba0807c9632e 100644
--- a/src/components/Form/FormProvider.tsx
+++ b/src/components/Form/FormProvider.tsx
@@ -1,5 +1,5 @@
 import lodashIsEqual from 'lodash/isEqual';
-import type {ForwardedRef, MutableRefObject, ReactNode} from 'react';
+import type {FocusEvent, ForwardedRef, MutableRefObject, ReactNode} from 'react';
 import React, {createRef, forwardRef, useCallback, useImperativeHandle, useMemo, useRef, useState} from 'react';
 import type {OnyxEntry} from 'react-native-onyx';
 import {withOnyx} from 'react-native-onyx';
@@ -273,7 +273,7 @@ function FormProvider(
                     }
                     inputProps.onPressOut?.(event);
                 },
-                onBlur: (event) => {
+                onBlur: (event: FocusEvent) => {
                     // Only run validation when user proactively blurs the input.
                     if (Visibility.isVisible() && Visibility.hasFocus()) {
                         const relatedTarget = event && 'relatedTarget' in event.nativeEvent && event?.nativeEvent?.relatedTarget;
diff --git a/src/components/Form/types.ts b/src/components/Form/types.ts
index 447f3205ad68..6a0df04c575f 100644
--- a/src/components/Form/types.ts
+++ b/src/components/Form/types.ts
@@ -1,9 +1,10 @@
-import type {ComponentProps, FocusEvent, Key, MutableRefObject, ReactNode, Ref} from 'react';
-import type {GestureResponderEvent, NativeSyntheticEvent, StyleProp, TextInputFocusEventData, ViewStyle} from 'react-native';
+import type {ComponentProps, Key, MutableRefObject, ReactNode, Ref} from 'react';
+import type {StyleProp, ViewStyle} from 'react-native';
 import type AddressSearch from '@components/AddressSearch';
 import type AmountTextInput from '@components/AmountTextInput';
 import type CheckboxWithLabel from '@components/CheckboxWithLabel';
 import type Picker from '@components/Picker';
+import type RadioButtons from '@components/RadioButtons';
 import type SingleChoiceQuestion from '@components/SingleChoiceQuestion';
 import type TextInput from '@components/TextInput';
 import type {OnyxFormKey, OnyxValues} from '@src/ONYXKEYS';
@@ -17,7 +18,7 @@ import type {BaseForm, FormValueType} from '@src/types/onyx/Form';
  * TODO: Add remaining inputs here once these components are migrated to Typescript:
  * CountrySelector | StatePicker | DatePicker | EmojiPickerButtonDropdown | RoomNameInput | ValuePicker
  */
-type ValidInputs = typeof TextInput | typeof AmountTextInput | typeof SingleChoiceQuestion | typeof CheckboxWithLabel | typeof Picker | typeof AddressSearch;
+type ValidInputs = typeof TextInput | typeof AmountTextInput | typeof SingleChoiceQuestion | typeof CheckboxWithLabel | typeof Picker | typeof AddressSearch | typeof RadioButtons;
 
 type ValueTypeKey = 'string' | 'boolean' | 'date';
 
@@ -26,13 +27,13 @@ type MeasureLayoutOnSuccessCallback = (left: number, top: number, width: number,
 type BaseInputProps = {
     shouldSetTouchedOnBlurOnly?: boolean;
     onValueChange?: (value: unknown, key: string) => void;
-    onTouched?: (event: GestureResponderEvent) => void;
+    onTouched?: (event: unknown) => void;
     valueType?: ValueTypeKey;
     value?: FormValueType;
     defaultValue?: FormValueType;
-    onBlur?: (event: FocusEvent | NativeSyntheticEvent<TextInputFocusEventData>) => void;
-    onPressOut?: (event: GestureResponderEvent) => void;
-    onPress?: (event: GestureResponderEvent) => void;
+    onBlur?: (event: unknown) => void;
+    onPressOut?: (event: unknown) => void;
+    onPress?: (event: unknown) => void;
     shouldSaveDraft?: boolean;
     shouldUseDefaultValue?: boolean;
     key?: Key | null | undefined;
diff --git a/src/pages/settings/AboutPage.tsx b/src/pages/settings/AboutPage.tsx
index 5bbbe3688ca8..ddc779ea23aa 100644
--- a/src/pages/settings/AboutPage.tsx
+++ b/src/pages/settings/AboutPage.tsx
@@ -22,14 +22,8 @@ import CONST from '@src/CONST';
 import type {TranslationPaths} from '@src/languages/types';
 import ROUTES from '@src/ROUTES';
 import SCREENS from '@src/SCREENS';
-<<<<<<<< HEAD:src/pages/settings/AboutPage.js
-import pkg from '../../../package.json';
-|||||||| b4ccb0c4d1:src/pages/settings/AboutPage/AboutPage.js
-import pkg from '../../../../package.json';
-========
 import type IconAsset from '@src/types/utils/IconAsset';
-import pkg from '../../../../package.json';
->>>>>>>> main:src/pages/settings/AboutPage.tsx
+import pkg from '../../../package.json';
 
 function getFlavor(): string {
     const bundleId = DeviceInfo.getBundleId();
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index f1fea45dd0ca..f4fb87134be1 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -14,12 +14,15 @@ import * as ExitSurvey from '@userActions/ExitSurvey';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
+import type {Errors} from '@src/types/onyx/OnyxCommon';
+
+type Reason = ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
 
 function ExitSurveyReasonPage() {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
 
-    const [reason, setReason] = useState<ValueOf<typeof CONST.EXIT_SURVEY.REASONS>>();
+    const [reason, setReason] = useState<Reason>();
     const reasons: Choice[] = useMemo(
         () =>
             Object.values(CONST.EXIT_SURVEY.REASONS).map((value) => ({
@@ -36,17 +39,15 @@ function ExitSurveyReasonPage() {
                 title={translate('exitSurvey.header')}
                 onBackButtonPress={() => Navigation.goBack()}
             />
-            {/* @ts-expect-error - FormProvider is not yet migrated to TS */}
             <FormProvider
                 formID={ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM}
                 style={[styles.flex1, styles.mt3, styles.mh5]}
                 validate={() => {
-                    if (reason) {
-                        return {};
+                    const errors: Errors = {};
+                    if (!reason) {
+                        errors[CONST.EXIT_SURVEY.REASON_INPUT_ID] = 'common.error.fieldRequired';
                     }
-                    return {
-                        [CONST.EXIT_SURVEY.REASON_INPUT_ID]: translate('common.error.fieldRequired'),
-                    };
+                    return errors;
                 }}
                 onSubmit={() => {
                     if (!reason) {
@@ -63,12 +64,12 @@ function ExitSurveyReasonPage() {
                     <Text style={styles.headerAnonymousFooter}>{translate('exitSurvey.reasonPage.title')}</Text>
                     <Text style={styles.mt2}>{translate('exitSurvey.reasonPage.subtitle')}</Text>
                     <InputWrapper
-                        // @ts-expect-error – InputWrapper is not yet implemented in TS
                         InputComponent={RadioButtons}
                         inputID={CONST.EXIT_SURVEY.REASON_INPUT_ID}
                         items={reasons}
-                        onPress={(value: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>) => setReason(value)}
+                        onPress={(value) => setReason(value as Reason)}
                     />
+                    x
                 </>
             </FormProvider>
         </ScreenWrapper>
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 8015522ed07e..2b4e6b4d51e0 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -3,6 +3,7 @@ import React, {useRef, useState} from 'react';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
+import type {AnimatedTextInputRef} from '@components/RNTextInput';
 import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
 import TextInput from '@components/TextInput';
@@ -21,6 +22,7 @@ import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
+import type {Errors} from '@src/types/onyx/OnyxCommon';
 
 type ExitSurveyResponsePageProps = StackScreenProps<SettingsNavigatorParamList, typeof SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE>;
 
@@ -34,7 +36,7 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
     const {reason} = route.params;
 
     const [response, setResponse] = useState('');
-    const responseInputRef = useRef(null);
+    const responseInputRef = useRef<AnimatedTextInputRef | null>(null);
 
     const formTopMarginsStyle = styles.mt3;
     const textStyle = styles.headerAnonymousFooter;
@@ -70,7 +72,6 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
                 title={translate('exitSurvey.header')}
                 onBackButtonPress={() => Navigation.goBack()}
             />
-            {/* @ts-expect-error - FormProvider is not yet migrated to TS */}
             <FormProvider
                 formID={ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM}
                 style={[styles.flex1, styles.mh5, formTopMarginsStyle, StyleUtils.getMaximumHeight(formMaxHeight)]}
@@ -80,12 +81,11 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
                 }}
                 submitButtonText={translate('common.next')}
                 validate={() => {
-                    if (response?.trim()) {
-                        return {};
+                    const errors: Errors = {};
+                    if (!response?.trim()) {
+                        errors[CONST.EXIT_SURVEY.RESPONSE_INPUT_ID] = 'common.error.fieldRequired';
                     }
-                    return {
-                        [CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]: translate('common.error.fieldRequired'),
-                    };
+                    return errors;
                 }}
                 shouldValidateOnBlur
                 shouldValidateOnChange
@@ -93,7 +93,6 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
                 <>
                     <Text style={textStyle}>{translate(`exitSurvey.prompts.${reason}`)}</Text>
                     <InputWrapper
-                        // @ts-expect-error – InputWrapper is not yet implemented in TS
                         InputComponent={TextInput}
                         inputID={CONST.EXIT_SURVEY.RESPONSE_INPUT_ID}
                         label={translate(`exitSurvey.responsePlaceholder`)}
@@ -101,7 +100,7 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
                         role={CONST.ROLE.PRESENTATION}
                         autoGrowHeight
                         maxLength={CONST.MAX_COMMENT_LENGTH}
-                        ref={(el) => {
+                        ref={(el: AnimatedTextInputRef) => {
                             if (!el) {
                                 return;
                             }

From 688a49bba57a9ef1439fc0a2d367e7f7e6caeef6 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 31 Jan 2024 10:03:24 -0800
Subject: [PATCH 045/305] Remove TODOs

---
 src/languages/en.ts | 1 -
 src/languages/es.ts | 1 -
 2 files changed, 2 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index 294508db413f..e12923ff2d98 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -2143,7 +2143,6 @@ export default {
             subtitle: 'Before you go, please tell us why you’d like to switch to Expensify Classic.',
         },
         reasons: {
-            // TODO: use consts for these keys
             [CONST.EXIT_SURVEY.REASONS.FEATURE_NOT_AVAILABLE]: "I need a feature that's only available in Expensify Classic.",
             [CONST.EXIT_SURVEY.REASONS.DONT_UNDERSTAND]: "I don't understand how to use New Expensify.",
             [CONST.EXIT_SURVEY.REASONS.PREFER_CLASSIC]: 'I understand how to use New Expensify, but I prefer Expensify Classic.',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 557297cd3354..0fcac0401c3a 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2631,7 +2631,6 @@ export default {
             subtitle: 'Antes de irte, por favor dinos por qué te gustaría cambiarte a Expensify Classic.',
         },
         reasons: {
-            // TODO: use consts for these keys
             [CONST.EXIT_SURVEY.REASONS.FEATURE_NOT_AVAILABLE]: 'Necesito una función que sólo está disponible en Expensify Classic.',
             [CONST.EXIT_SURVEY.REASONS.DONT_UNDERSTAND]: 'No entiendo cómo usar New Expensify.',
             [CONST.EXIT_SURVEY.REASONS.PREFER_CLASSIC]: 'Entiendo cómo usar New Expensify, pero prefiero Expensify Classic.',

From 2b2a1481cb824d770111bf9801818d997ee71268 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 31 Jan 2024 10:12:55 -0800
Subject: [PATCH 046/305] Fix forwardRef

---
 src/components/RadioButtons.tsx                        | 9 +++++++--
 src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx | 1 -
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/components/RadioButtons.tsx b/src/components/RadioButtons.tsx
index 047fb72f420d..12447b1cb97d 100644
--- a/src/components/RadioButtons.tsx
+++ b/src/components/RadioButtons.tsx
@@ -1,4 +1,5 @@
 import React, {forwardRef, useState} from 'react';
+import type {ForwardedRef} from 'react';
 import {View} from 'react-native';
 import type {StyleProp, ViewStyle} from 'react-native';
 import useThemeStyles from '@hooks/useThemeStyles';
@@ -23,13 +24,17 @@ type RadioButtonsProps = {
     errorText?: MaybePhraseKey;
 };
 
-function RadioButtons({items, onPress, errorText}: RadioButtonsProps) {
+function RadioButtons({items, onPress, errorText}: RadioButtonsProps, ref: ForwardedRef<View>) {
+    console.log('RORY_DEBUG errorText', errorText);
     const styles = useThemeStyles();
     const [checkedValue, setCheckedValue] = useState('');
 
     return (
         <>
-            <View style={styles.mb3}>
+            <View
+                style={styles.mb3}
+                ref={ref}
+            >
                 {items.map((item) => (
                     <RadioButtonWithLabel
                         key={item.value}
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index f4fb87134be1..189fca480654 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -69,7 +69,6 @@ function ExitSurveyReasonPage() {
                         items={reasons}
                         onPress={(value) => setReason(value as Reason)}
                     />
-                    x
                 </>
             </FormProvider>
         </ScreenWrapper>

From 8c909c17cae0e26f3ed4eacdc1381fd673cdb6d9 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 31 Jan 2024 10:19:55 -0800
Subject: [PATCH 047/305] Clear onyx form data after sending to API

---
 src/libs/actions/ExitSurvey.ts | 36 ++++++++++++++++++++++++++++++----
 1 file changed, 32 insertions(+), 4 deletions(-)

diff --git a/src/libs/actions/ExitSurvey.ts b/src/libs/actions/ExitSurvey.ts
index 766d0463257a..7e7234bc754e 100644
--- a/src/libs/actions/ExitSurvey.ts
+++ b/src/libs/actions/ExitSurvey.ts
@@ -1,3 +1,4 @@
+import type {OnyxUpdate} from 'react-native-onyx';
 import Onyx from 'react-native-onyx';
 import type {ValueOf} from 'type-fest';
 import * as API from '@libs/API';
@@ -33,10 +34,37 @@ function switchToOldDot() {
         return;
     }
 
-    API.write('SwitchToOldDot', {
-        reason: exitReason,
-        surveyResponse: exitSurveyResponse,
-    });
+    const finallyData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.SET,
+            key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM,
+            value: null,
+        },
+        {
+            onyxMethod: Onyx.METHOD.SET,
+            key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM_DRAFT,
+            value: null,
+        },
+        {
+            onyxMethod: Onyx.METHOD.SET,
+            key: ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM,
+            value: null,
+        },
+        {
+            onyxMethod: Onyx.METHOD.SET,
+            key: ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM_DRAFT,
+            value: null,
+        },
+    ];
+
+    API.write(
+        'SwitchToOldDot',
+        {
+            reason: exitReason,
+            surveyResponse: exitSurveyResponse,
+        },
+        {finallyData},
+    );
 }
 
 export {saveExitReason, saveResponse, switchToOldDot};

From 639afcd9818898e48c36011eea3a54158afa346c Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 31 Jan 2024 10:56:15 -0800
Subject: [PATCH 048/305] Attempt to apply drafts - seeing cryptic type error

---
 src/ONYXKEYS.ts                                 |  2 +-
 src/libs/FormUtils.ts                           |  2 +-
 .../ExitSurvey/ExitSurveyResponsePage.tsx       | 17 ++++++++++++++---
 src/types/onyx/Form.ts                          |  4 ++++
 src/types/onyx/index.ts                         |  2 ++
 5 files changed, 22 insertions(+), 5 deletions(-)

diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts
index d25962508efe..86501d6e27f2 100755
--- a/src/ONYXKEYS.ts
+++ b/src/ONYXKEYS.ts
@@ -556,7 +556,7 @@ type OnyxValues = {
     [ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM]: OnyxTypes.ExitSurveyReasonForm;
     [ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM_DRAFT]: OnyxTypes.Form;
     [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM]: OnyxTypes.ExitSurveyResponseForm;
-    [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM_DRAFT]: OnyxTypes.ExitSurveyResponseForm;
+    [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM_DRAFT]: OnyxTypes.FormDraft<OnyxTypes.ExitSurveyResponseForm>;
 };
 
 type OnyxKeyValue<TOnyxKey extends (OnyxKey | OnyxCollectionKey) & keyof OnyxValues> = OnyxEntry<OnyxValues[TOnyxKey]>;
diff --git a/src/libs/FormUtils.ts b/src/libs/FormUtils.ts
index 37241df49af7..d99e5f2e93c9 100644
--- a/src/libs/FormUtils.ts
+++ b/src/libs/FormUtils.ts
@@ -1,6 +1,6 @@
 import type {OnyxFormKeyWithoutDraft} from '@components/Form/types';
 
-function getDraftKey(formID: OnyxFormKeyWithoutDraft): `${OnyxFormKeyWithoutDraft}Draft` {
+function getDraftKey<Key extends OnyxFormKeyWithoutDraft>(formID: Key): `${Key}Draft` {
     return `${formID}Draft`;
 }
 
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 2b4e6b4d51e0..4284c79df580 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -1,5 +1,7 @@
 import type {StackScreenProps} from '@react-navigation/stack';
 import React, {useRef, useState} from 'react';
+import type {OnyxEntry} from 'react-native-onyx';
+import {withOnyx} from 'react-native-onyx';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
@@ -12,6 +14,7 @@ import useSafeAreaInsets from '@hooks/useSafeAreaInsets';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
+import FormUtils from '@libs/FormUtils';
 import * as NumberUtils from '@libs/NumberUtils';
 import updateMultilineInputRange from '@libs/updateMultilineInputRange';
 import Navigation from '@navigation/Navigation';
@@ -24,9 +27,13 @@ import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
 import type {Errors} from '@src/types/onyx/OnyxCommon';
 
-type ExitSurveyResponsePageProps = StackScreenProps<SettingsNavigatorParamList, typeof SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE>;
+type ExitSurveyResponsePageOnyxProps = {
+    responseDraft: OnyxEntry<string>;
+};
 
-function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
+type ExitSurveyResponsePageProps = ExitSurveyResponsePageOnyxProps & StackScreenProps<SettingsNavigatorParamList, typeof SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE>;
+
+function ExitSurveyResponsePage({responseDraft, route}: ExitSurveyResponsePageProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
@@ -120,4 +127,8 @@ function ExitSurveyResponsePage({route}: ExitSurveyResponsePageProps) {
 
 ExitSurveyResponsePage.displayName = 'ExitSurveyResponsePage';
 
-export default ExitSurveyResponsePage;
+export default withOnyx<ExitSurveyResponsePageProps, ExitSurveyResponsePageOnyxProps>({
+    responseDraft: {
+        key: FormUtils.getDraftKey(ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM),
+    },
+})(ExitSurveyResponsePage);
diff --git a/src/types/onyx/Form.ts b/src/types/onyx/Form.ts
index 56736500713c..d99fad1fd0d3 100644
--- a/src/types/onyx/Form.ts
+++ b/src/types/onyx/Form.ts
@@ -17,6 +17,9 @@ type BaseForm = {
 };
 
 type Form<TFormValues extends Record<string, FormValueType> = Record<string, FormValueType>> = TFormValues & BaseForm;
+type FormDraft<TForm> = {
+    [Key in keyof TForm as `${Key & string}Draft`]: TForm[Key];
+};
 
 type AddDebitCardForm = Form<{
     /** Whether the form has been submitted */
@@ -82,4 +85,5 @@ export type {
     PersonalBankAccountForm,
     ExitSurveyReasonForm,
     ExitSurveyResponseForm,
+    FormDraft,
 };
diff --git a/src/types/onyx/index.ts b/src/types/onyx/index.ts
index 8f7afa24f03d..02ff9ba20387 100644
--- a/src/types/onyx/index.ts
+++ b/src/types/onyx/index.ts
@@ -15,6 +15,7 @@ import type {
     DisplayNameForm,
     ExitSurveyReasonForm,
     ExitSurveyResponseForm,
+    FormDraft,
     IKnowATeacherForm,
     IntroSchoolPrincipalForm,
     NewRoomForm,
@@ -97,6 +98,7 @@ export type {
     ExitSurveyReasonForm,
     ExitSurveyResponseForm,
     Form,
+    FormDraft,
     FrequentlyUsedEmoji,
     Fund,
     FundList,

From 1ee4118034faec2aca98734ee315e33b4dc96af2 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 31 Jan 2024 13:16:00 -0800
Subject: [PATCH 049/305] Populate response TextInput with draft response

---
 src/ONYXKEYS.ts                               |  2 +-
 .../ExitSurvey/ExitSurveyResponsePage.tsx     | 19 ++++++++++---------
 src/types/onyx/Form.ts                        |  4 ----
 src/types/onyx/index.ts                       |  2 --
 4 files changed, 11 insertions(+), 16 deletions(-)

diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts
index 86501d6e27f2..d25962508efe 100755
--- a/src/ONYXKEYS.ts
+++ b/src/ONYXKEYS.ts
@@ -556,7 +556,7 @@ type OnyxValues = {
     [ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM]: OnyxTypes.ExitSurveyReasonForm;
     [ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM_DRAFT]: OnyxTypes.Form;
     [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM]: OnyxTypes.ExitSurveyResponseForm;
-    [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM_DRAFT]: OnyxTypes.FormDraft<OnyxTypes.ExitSurveyResponseForm>;
+    [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM_DRAFT]: OnyxTypes.ExitSurveyResponseForm;
 };
 
 type OnyxKeyValue<TOnyxKey extends (OnyxKey | OnyxCollectionKey) & keyof OnyxValues> = OnyxEntry<OnyxValues[TOnyxKey]>;
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 4284c79df580..e79b57cea787 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -1,5 +1,5 @@
 import type {StackScreenProps} from '@react-navigation/stack';
-import React, {useRef, useState} from 'react';
+import React, {useRef} from 'react';
 import type {OnyxEntry} from 'react-native-onyx';
 import {withOnyx} from 'react-native-onyx';
 import FormProvider from '@components/Form/FormProvider';
@@ -25,15 +25,16 @@ import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
+import type * as OnyxTypes from '@src/types/onyx';
 import type {Errors} from '@src/types/onyx/OnyxCommon';
 
 type ExitSurveyResponsePageOnyxProps = {
-    responseDraft: OnyxEntry<string>;
+    draftResponse: string;
 };
 
 type ExitSurveyResponsePageProps = ExitSurveyResponsePageOnyxProps & StackScreenProps<SettingsNavigatorParamList, typeof SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE>;
 
-function ExitSurveyResponsePage({responseDraft, route}: ExitSurveyResponsePageProps) {
+function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePageProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
@@ -42,7 +43,6 @@ function ExitSurveyResponsePage({responseDraft, route}: ExitSurveyResponsePagePr
 
     const {reason} = route.params;
 
-    const [response, setResponse] = useState('');
     const responseInputRef = useRef<AnimatedTextInputRef | null>(null);
 
     const formTopMarginsStyle = styles.mt3;
@@ -83,13 +83,13 @@ function ExitSurveyResponsePage({responseDraft, route}: ExitSurveyResponsePagePr
                 formID={ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM}
                 style={[styles.flex1, styles.mh5, formTopMarginsStyle, StyleUtils.getMaximumHeight(formMaxHeight)]}
                 onSubmit={() => {
-                    ExitSurvey.saveResponse(response);
+                    ExitSurvey.saveResponse(draftResponse);
                     Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM);
                 }}
                 submitButtonText={translate('common.next')}
                 validate={() => {
                     const errors: Errors = {};
-                    if (!response?.trim()) {
+                    if (!draftResponse?.trim()) {
                         errors[CONST.EXIT_SURVEY.RESPONSE_INPUT_ID] = 'common.error.fieldRequired';
                     }
                     return errors;
@@ -114,8 +114,8 @@ function ExitSurveyResponsePage({responseDraft, route}: ExitSurveyResponsePagePr
                             responseInputRef.current = el;
                             updateMultilineInputRange(el);
                         }}
-                        value={response}
-                        onChangeText={setResponse}
+                        value={draftResponse}
+                        // onChangeText={setResponse}
                         containerStyles={[baseResponseInputContainerStyle, StyleUtils.getMaximumHeight(responseInputMaxHeight)]}
                         shouldSaveDraft
                     />
@@ -128,7 +128,8 @@ function ExitSurveyResponsePage({responseDraft, route}: ExitSurveyResponsePagePr
 ExitSurveyResponsePage.displayName = 'ExitSurveyResponsePage';
 
 export default withOnyx<ExitSurveyResponsePageProps, ExitSurveyResponsePageOnyxProps>({
-    responseDraft: {
+    draftResponse: {
         key: FormUtils.getDraftKey(ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM),
+        selector: (value: OnyxEntry<OnyxTypes.ExitSurveyResponseForm>) => value?.response ?? '',
     },
 })(ExitSurveyResponsePage);
diff --git a/src/types/onyx/Form.ts b/src/types/onyx/Form.ts
index d99fad1fd0d3..56736500713c 100644
--- a/src/types/onyx/Form.ts
+++ b/src/types/onyx/Form.ts
@@ -17,9 +17,6 @@ type BaseForm = {
 };
 
 type Form<TFormValues extends Record<string, FormValueType> = Record<string, FormValueType>> = TFormValues & BaseForm;
-type FormDraft<TForm> = {
-    [Key in keyof TForm as `${Key & string}Draft`]: TForm[Key];
-};
 
 type AddDebitCardForm = Form<{
     /** Whether the form has been submitted */
@@ -85,5 +82,4 @@ export type {
     PersonalBankAccountForm,
     ExitSurveyReasonForm,
     ExitSurveyResponseForm,
-    FormDraft,
 };
diff --git a/src/types/onyx/index.ts b/src/types/onyx/index.ts
index 02ff9ba20387..8f7afa24f03d 100644
--- a/src/types/onyx/index.ts
+++ b/src/types/onyx/index.ts
@@ -15,7 +15,6 @@ import type {
     DisplayNameForm,
     ExitSurveyReasonForm,
     ExitSurveyResponseForm,
-    FormDraft,
     IKnowATeacherForm,
     IntroSchoolPrincipalForm,
     NewRoomForm,
@@ -98,7 +97,6 @@ export type {
     ExitSurveyReasonForm,
     ExitSurveyResponseForm,
     Form,
-    FormDraft,
     FrequentlyUsedEmoji,
     Fund,
     FundList,

From 41457dcd72725e57a3d9176cf6b59337bacdca07 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 31 Jan 2024 13:21:09 -0800
Subject: [PATCH 050/305] Use Onyx.set instead of Onyx.merge

---
 src/libs/actions/ExitSurvey.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/libs/actions/ExitSurvey.ts b/src/libs/actions/ExitSurvey.ts
index 7e7234bc754e..a21e4a4d35a5 100644
--- a/src/libs/actions/ExitSurvey.ts
+++ b/src/libs/actions/ExitSurvey.ts
@@ -18,11 +18,11 @@ Onyx.connect({
 });
 
 function saveExitReason(reason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>) {
-    Onyx.merge(ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM, {[CONST.EXIT_SURVEY.REASON_INPUT_ID]: reason});
+    Onyx.set(ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM, {[CONST.EXIT_SURVEY.REASON_INPUT_ID]: reason});
 }
 
 function saveResponse(response: string) {
-    Onyx.merge(ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM, {[CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]: response});
+    Onyx.set(ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM, {[CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]: response});
 }
 
 /**

From f738173a0f7356a385b490e6456dd2eb4e132031 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 31 Jan 2024 13:23:06 -0800
Subject: [PATCH 051/305] Remove errant console.log

---
 src/components/RadioButtons.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/RadioButtons.tsx b/src/components/RadioButtons.tsx
index 12447b1cb97d..6e9ca90a0d89 100644
--- a/src/components/RadioButtons.tsx
+++ b/src/components/RadioButtons.tsx
@@ -25,7 +25,6 @@ type RadioButtonsProps = {
 };
 
 function RadioButtons({items, onPress, errorText}: RadioButtonsProps, ref: ForwardedRef<View>) {
-    console.log('RORY_DEBUG errorText', errorText);
     const styles = useThemeStyles();
     const [checkedValue, setCheckedValue] = useState('');
 

From 0faf0c53166ec2e25acdc3ba805d9249841d3b7b Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 31 Jan 2024 21:43:05 -0800
Subject: [PATCH 052/305] Implement loading state in confirm page

---
 src/libs/actions/ExitSurvey.ts                |  7 +++--
 .../ExitSurvey/ExitSurveyConfirmPage.tsx      | 30 +++++++++++++++++--
 .../ExitSurvey/ExitSurveyReasonPage.tsx       |  8 ++---
 .../ExitSurvey/ExitSurveyResponsePage.tsx     |  2 +-
 src/types/onyx/Form.ts                        |  4 +--
 5 files changed, 38 insertions(+), 13 deletions(-)

diff --git a/src/libs/actions/ExitSurvey.ts b/src/libs/actions/ExitSurvey.ts
index a21e4a4d35a5..063095699057 100644
--- a/src/libs/actions/ExitSurvey.ts
+++ b/src/libs/actions/ExitSurvey.ts
@@ -6,7 +6,9 @@ import Log from '@libs/Log';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 
-let exitReason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS> | undefined;
+type ExitReason = ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
+
+let exitReason: ExitReason | undefined;
 let exitSurveyResponse: string | undefined;
 Onyx.connect({
     key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM,
@@ -17,7 +19,7 @@ Onyx.connect({
     callback: (value) => (exitSurveyResponse = value?.[CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]),
 });
 
-function saveExitReason(reason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>) {
+function saveExitReason(reason: ExitReason) {
     Onyx.set(ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM, {[CONST.EXIT_SURVEY.REASON_INPUT_ID]: reason});
 }
 
@@ -68,3 +70,4 @@ function switchToOldDot() {
 }
 
 export {saveExitReason, saveResponse, switchToOldDot};
+export type {ExitReason};
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index e03515ab3742..7a6b7eb147dc 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -1,5 +1,7 @@
-import React from 'react';
+import React, {useEffect, useState} from 'react';
 import {View} from 'react-native';
+import {withOnyx} from 'react-native-onyx';
+import type {OnyxEntry} from 'react-native-onyx';
 import Button from '@components/Button';
 import FixedFooter from '@components/FixedFooter';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
@@ -10,13 +12,28 @@ import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
 import * as ExitSurvey from '@userActions/ExitSurvey';
+import type {ExitReason} from '@userActions/ExitSurvey';
 import * as Link from '@userActions/Link';
 import CONST from '@src/CONST';
+import ONYXKEYS from '@src/ONYXKEYS';
+import type * as OnyxTypes from '@src/types/onyx';
 
-function ExitSurveyConfirmPage() {
+type ExitSurveyConfirmPageOnyxProps = {
+    exitReason: ExitReason | null;
+};
+
+function ExitSurveyConfirmPage({exitReason}: ExitSurveyConfirmPageOnyxProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
 
+    const [isLoading, setIsLoading] = useState(false);
+    useEffect(() => {
+        if (exitReason) {
+            return;
+        }
+        setIsLoading(false);
+    }, [exitReason]);
+
     return (
         <ScreenWrapper testID={ExitSurveyConfirmPage.displayName}>
             <HeaderWithBackButton
@@ -33,9 +50,11 @@ function ExitSurveyConfirmPage() {
                     success
                     text={translate('exitSurvey.goToExpensifyClassic')}
                     onPress={() => {
+                        setIsLoading(true);
                         ExitSurvey.switchToOldDot();
                         Link.openOldDotLink(CONST.OLDDOT_URLS.INBOX);
                     }}
+                    isLoading={isLoading}
                 />
             </FixedFooter>
         </ScreenWrapper>
@@ -44,4 +63,9 @@ function ExitSurveyConfirmPage() {
 
 ExitSurveyConfirmPage.displayName = 'ExitSurveyConfirmPage';
 
-export default ExitSurveyConfirmPage;
+export default withOnyx<ExitSurveyConfirmPageOnyxProps, ExitSurveyConfirmPageOnyxProps>({
+    exitReason: {
+        key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM,
+        selector: (value: OnyxEntry<OnyxTypes.ExitSurveyReasonForm>) => value?.reason ?? null,
+    },
+})(ExitSurveyConfirmPage);
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index 189fca480654..e0df8957ef91 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -1,5 +1,4 @@
 import React, {useMemo, useState} from 'react';
-import type {ValueOf} from 'type-fest';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
@@ -11,18 +10,17 @@ import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
 import * as ExitSurvey from '@userActions/ExitSurvey';
+import type {ExitReason} from '@userActions/ExitSurvey';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import type {Errors} from '@src/types/onyx/OnyxCommon';
 
-type Reason = ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
-
 function ExitSurveyReasonPage() {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
 
-    const [reason, setReason] = useState<Reason>();
+    const [reason, setReason] = useState<ExitReason>();
     const reasons: Choice[] = useMemo(
         () =>
             Object.values(CONST.EXIT_SURVEY.REASONS).map((value) => ({
@@ -67,7 +65,7 @@ function ExitSurveyReasonPage() {
                         InputComponent={RadioButtons}
                         inputID={CONST.EXIT_SURVEY.REASON_INPUT_ID}
                         items={reasons}
-                        onPress={(value) => setReason(value as Reason)}
+                        onPress={(value) => setReason(value as ExitReason)}
                     />
                 </>
             </FormProvider>
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index e79b57cea787..291afe6370c5 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -130,6 +130,6 @@ ExitSurveyResponsePage.displayName = 'ExitSurveyResponsePage';
 export default withOnyx<ExitSurveyResponsePageProps, ExitSurveyResponsePageOnyxProps>({
     draftResponse: {
         key: FormUtils.getDraftKey(ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM),
-        selector: (value: OnyxEntry<OnyxTypes.ExitSurveyResponseForm>) => value?.response ?? '',
+        selector: (value: OnyxEntry<OnyxTypes.ExitSurveyResponseForm>) => value?.[CONST.EXIT_SURVEY.RESPONSE_INPUT_ID] ?? '',
     },
 })(ExitSurveyResponsePage);
diff --git a/src/types/onyx/Form.ts b/src/types/onyx/Form.ts
index 56736500713c..82800a04ac40 100644
--- a/src/types/onyx/Form.ts
+++ b/src/types/onyx/Form.ts
@@ -1,4 +1,4 @@
-import type {ValueOf} from 'type-fest';
+import type {ExitReason} from '@userActions/ExitSurvey';
 import type CONST from '@src/CONST';
 import type * as OnyxCommon from './OnyxCommon';
 import type PersonalBankAccount from './PersonalBankAccount';
@@ -60,7 +60,7 @@ type PrivateNotesForm = Form<{
 type PersonalBankAccountForm = Form<PersonalBankAccount>;
 
 type ExitSurveyReasonForm = Form<{
-    [CONST.EXIT_SURVEY.REASON_INPUT_ID]: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
+    [CONST.EXIT_SURVEY.REASON_INPUT_ID]: ExitReason;
 }>;
 
 type ExitSurveyResponseForm = Form<{

From 0bf73655b508f8252ddecd946a4803d90efb26d0 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Thu, 1 Feb 2024 10:29:21 -0500
Subject: [PATCH 053/305] Update IOUTest to not fail with transaction threads

---
 tests/actions/IOUTest.js | 87 +++++++++++++++++++++++++++++++---------
 1 file changed, 69 insertions(+), 18 deletions(-)

diff --git a/tests/actions/IOUTest.js b/tests/actions/IOUTest.js
index 5b304346f38f..398a07c45857 100644
--- a/tests/actions/IOUTest.js
+++ b/tests/actions/IOUTest.js
@@ -57,6 +57,8 @@ describe('actions/IOU', () => {
             let createdAction;
             let iouAction;
             let transactionID;
+            let transactionThread;
+            let transactionThreadCreatedAction;
             fetch.pause();
             IOU.requestMoney({}, amount, CONST.CURRENCY.USD, '', merchant, RORY_EMAIL, RORY_ACCOUNT_ID, {login: CARLOS_EMAIL, accountID: CARLOS_ACCOUNT_ID}, comment);
             return waitForBatchedUpdates()
@@ -69,14 +71,16 @@ describe('actions/IOU', () => {
                                 callback: (allReports) => {
                                     Onyx.disconnect(connectionID);
 
-                                    // A chat report and an iou report should be created
+                                    // A chat report, a transaction thread, and an iou report should be created
                                     const chatReports = _.filter(allReports, (report) => report.type === CONST.REPORT.TYPE.CHAT);
                                     const iouReports = _.filter(allReports, (report) => report.type === CONST.REPORT.TYPE.IOU);
-                                    expect(_.size(chatReports)).toBe(1);
+                                    expect(_.size(chatReports)).toBe(2);
                                     expect(_.size(iouReports)).toBe(1);
                                     const chatReport = chatReports[0];
+                                    const transactionThreadReport = chatReports[1];
                                     const iouReport = iouReports[0];
                                     iouReportID = iouReport.reportID;
+                                    transactionThread = transactionThreadReport;
 
                                     expect(iouReport.notificationPreference).toBe(CONST.REPORT.NOTIFICATION_PREFERENCE.HIDDEN);
 
@@ -131,6 +135,27 @@ describe('actions/IOU', () => {
                             });
                         }),
                 )
+                .then(
+                    () =>
+                        new Promise((resolve) => {
+                            const connectionID = Onyx.connect({
+                                key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${transactionThread.reportID}`,
+                                waitForCollectionCallback: true,
+                                callback: (reportActionsForTransactionThread) => {
+                                    Onyx.disconnect(connectionID);
+
+                                    // The transaction thread should have a CREATED action
+                                    expect(_.size(reportActionsForTransactionThread)).toBe(1);
+                                    const createdActions = _.filter(reportActionsForTransactionThread, (reportAction) => reportAction.actionName === CONST.REPORT.ACTIONS.TYPE.CREATED);
+                                    expect(_.size(createdActions)).toBe(1);
+                                    transactionThreadCreatedAction = createdActions[0];
+
+                                    expect(transactionThreadCreatedAction.pendingAction).toBe(CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD);
+                                    resolve();
+                                },
+                            });
+                        }),
+                )
                 .then(
                     () =>
                         new Promise((resolve) => {
@@ -236,8 +261,8 @@ describe('actions/IOU', () => {
                                 callback: (allReports) => {
                                     Onyx.disconnect(connectionID);
 
-                                    // The same chat report should be reused, and an IOU report should be created
-                                    expect(_.size(allReports)).toBe(2);
+                                    // The same chat report should be reused, a transaction thread and an IOU report should be created
+                                    expect(_.size(allReports)).toBe(3);
                                     expect(_.find(allReports, (report) => report.type === CONST.REPORT.TYPE.CHAT).reportID).toBe(chatReport.reportID);
                                     chatReport = _.find(allReports, (report) => report.type === CONST.REPORT.TYPE.CHAT);
                                     const iouReport = _.find(allReports, (report) => report.type === CONST.REPORT.TYPE.IOU);
@@ -430,7 +455,7 @@ describe('actions/IOU', () => {
                                     Onyx.disconnect(connectionID);
 
                                     // No new reports should be created
-                                    expect(_.size(allReports)).toBe(2);
+                                    expect(_.size(allReports)).toBe(3);
                                     expect(_.find(allReports, (report) => report.reportID === chatReportID)).toBeTruthy();
                                     expect(_.find(allReports, (report) => report.reportID === iouReportID)).toBeTruthy();
 
@@ -549,6 +574,8 @@ describe('actions/IOU', () => {
             let createdAction;
             let iouAction;
             let transactionID;
+            let transactionThreadReport;
+            let transactionThreadAction;
             fetch.pause();
             IOU.requestMoney({}, amount, CONST.CURRENCY.USD, '', '', RORY_EMAIL, RORY_ACCOUNT_ID, {login: CARLOS_EMAIL, accountID: CARLOS_ACCOUNT_ID}, comment);
             return (
@@ -562,13 +589,15 @@ describe('actions/IOU', () => {
                                     callback: (allReports) => {
                                         Onyx.disconnect(connectionID);
 
-                                        // A chat report and an iou report should be created
+                                        // A chat report, transaction thread and an iou report should be created
                                         const chatReports = _.filter(allReports, (report) => report.type === CONST.REPORT.TYPE.CHAT);
                                         const iouReports = _.filter(allReports, (report) => report.type === CONST.REPORT.TYPE.IOU);
-                                        expect(_.size(chatReports)).toBe(1);
+                                        expect(_.size(chatReports)).toBe(2);
                                         expect(_.size(iouReports)).toBe(1);
                                         const chatReport = chatReports[0];
                                         chatReportID = chatReport.reportID;
+                                        transactionThreadReport = chatReports[1];
+
                                         const iouReport = iouReports[0];
                                         iouReportID = iouReport.reportID;
 
@@ -673,6 +702,25 @@ describe('actions/IOU', () => {
                                 });
                             }),
                     )
+                    .then(
+                        () =>
+                            new Promise((resolve) => {
+                                const connectionID = Onyx.connect({
+                                    key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}`,
+                                    waitForCollectionCallback: true,
+                                    callback: (reportActionsForTransactionThread) => {
+                                        Onyx.disconnect(connectionID);
+                                        expect(_.size(reportActionsForTransactionThread)).toBe(3);
+                                        transactionThreadAction = _.find(
+                                            reportActionsForTransactionThread[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${transactionThreadReport.reportID}`],
+                                            (reportAction) => reportAction.actionName === CONST.REPORT.ACTIONS.TYPE.CREATED,
+                                        );
+                                        expect(transactionThreadAction.pendingAction).toBe(CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD);
+                                        resolve();
+                                    },
+                                });
+                            }),
+                    )
                     .then(
                         () =>
                             new Promise((resolve) => {
@@ -695,6 +743,7 @@ describe('actions/IOU', () => {
                         () =>
                             new Promise((resolve) => {
                                 ReportActions.clearReportActionErrors(iouReportID, iouAction);
+                                ReportActions.clearReportActionErrors(transactionThreadReport.reportID, transactionThreadAction);
                                 resolve();
                             }),
                     )
@@ -737,6 +786,7 @@ describe('actions/IOU', () => {
                         () =>
                             new Promise((resolve) => {
                                 Report.deleteReport(chatReportID);
+                                Report.deleteReport(transactionThreadReport.reportID);
                                 resolve();
                             }),
                     )
@@ -937,8 +987,8 @@ describe('actions/IOU', () => {
                                 callback: (allReports) => {
                                     Onyx.disconnect(connectionID);
 
-                                    // There should now be 7 reports
-                                    expect(_.size(allReports)).toBe(7);
+                                    // There should now be 8 reports
+                                    expect(_.size(allReports)).toBe(8);
 
                                     // 1. The chat report with Rory + Carlos
                                     carlosChatReport = _.find(allReports, (report) => report.reportID === carlosChatReport.reportID);
@@ -1005,8 +1055,8 @@ describe('actions/IOU', () => {
                                 callback: (allReportActions) => {
                                     Onyx.disconnect(connectionID);
 
-                                    // There should be reportActions on all 4 chat reports + 3 IOU reports in each 1:1 chat
-                                    expect(_.size(allReportActions)).toBe(7);
+                                    // There should be reportActions on all 5 chat reports + 3 IOU reports in each 1:1 chat
+                                    expect(_.size(allReportActions)).toBe(8);
 
                                     const carlosReportActions = allReportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${carlosChatReport.iouReportID}`];
                                     const julesReportActions = allReportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${julesChatReport.iouReportID}`];
@@ -1219,9 +1269,10 @@ describe('actions/IOU', () => {
                                 callback: (allReports) => {
                                     Onyx.disconnect(connectionID);
 
-                                    expect(_.size(allReports)).toBe(2);
+                                    expect(_.size(allReports)).toBe(3);
 
-                                    chatReport = _.find(allReports, (report) => report.type === CONST.REPORT.TYPE.CHAT);
+                                    const chatReports = _.filter(allReports, (report) => report.type === CONST.REPORT.TYPE.CHAT);
+                                    chatReport = chatReports[0];
                                     expect(chatReport).toBeTruthy();
                                     expect(chatReport).toHaveProperty('reportID');
                                     expect(chatReport).toHaveProperty('iouReportID');
@@ -1298,7 +1349,7 @@ describe('actions/IOU', () => {
                                 callback: (allReports) => {
                                     Onyx.disconnect(connectionID);
 
-                                    expect(_.size(allReports)).toBe(2);
+                                    expect(_.size(allReports)).toBe(3);
 
                                     chatReport = _.find(allReports, (r) => r.type === CONST.REPORT.TYPE.CHAT);
                                     iouReport = _.find(allReports, (r) => r.type === CONST.REPORT.TYPE.IOU);
@@ -1347,7 +1398,7 @@ describe('actions/IOU', () => {
                                 callback: (allReports) => {
                                     Onyx.disconnect(connectionID);
 
-                                    expect(_.size(allReports)).toBe(2);
+                                    expect(_.size(allReports)).toBe(3);
 
                                     chatReport = _.find(allReports, (r) => r.type === CONST.REPORT.TYPE.CHAT);
                                     iouReport = _.find(allReports, (r) => r.type === CONST.REPORT.TYPE.IOU);
@@ -1849,7 +1900,7 @@ describe('actions/IOU', () => {
                         }),
                 );
         });
-    });
+    }, 15000);
 
     describe('deleteMoneyRequest', () => {
         const amount = 10000;
@@ -1902,8 +1953,8 @@ describe('actions/IOU', () => {
                 });
             });
 
-            // Then we should have exactly 2 reports
-            expect(_.size(allReports)).toBe(2);
+            // Then we should have exactly 3 reports
+            expect(_.size(allReports)).toBe(3);
 
             // Then one of them should be a chat report with relevant properties
             chatReport = _.find(allReports, (report) => report.type === CONST.REPORT.TYPE.CHAT);

From 11a63e402fadc11116b497da601b62d8a5000066 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Thu, 1 Feb 2024 10:46:26 -0500
Subject: [PATCH 054/305] Remove unneeded jest timeout

---
 tests/actions/IOUTest.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/tests/actions/IOUTest.js b/tests/actions/IOUTest.js
index 398a07c45857..8b71cba3c491 100644
--- a/tests/actions/IOUTest.js
+++ b/tests/actions/IOUTest.js
@@ -1900,7 +1900,7 @@ describe('actions/IOU', () => {
                         }),
                 );
         });
-    }, 15000);
+    });
 
     describe('deleteMoneyRequest', () => {
         const amount = 10000;

From fb98789999f365db3244871ebd66765949f04b78 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Thu, 1 Feb 2024 23:47:55 +0800
Subject: [PATCH 055/305] use the stack navigator to go back

---
 src/pages/NewChatSelectorPage.js | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/pages/NewChatSelectorPage.js b/src/pages/NewChatSelectorPage.js
index ba64ffec5a96..93669d79dab4 100755
--- a/src/pages/NewChatSelectorPage.js
+++ b/src/pages/NewChatSelectorPage.js
@@ -1,3 +1,4 @@
+import {useNavigation} from '@react-navigation/native';
 import React from 'react';
 import {withOnyx} from 'react-native-onyx';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
@@ -25,6 +26,8 @@ const defaultProps = {
 };
 
 function NewChatSelectorPage(props) {
+    const navigation = useNavigation();
+
     return (
         <ScreenWrapper
             shouldEnableKeyboardAvoidingView={false}
@@ -33,7 +36,10 @@ function NewChatSelectorPage(props) {
             shouldEnableMaxHeight
             testID={NewChatSelectorPage.displayName}
         >
-            <HeaderWithBackButton title={props.translate('sidebarScreen.fabNewChat')} />
+            <HeaderWithBackButton
+                title={props.translate('sidebarScreen.fabNewChat')}
+                onBackButtonPress={navigation.goBack}
+            />
             <OnyxTabNavigator
                 id={CONST.TAB.NEW_CHAT_TAB_ID}
                 tabBar={({state, navigation, position}) => (

From 1503aad4e93116d68f1a484291d85298ec9b7fc5 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Fri, 2 Feb 2024 00:16:10 +0800
Subject: [PATCH 056/305] rename

---
 src/pages/NewChatSelectorPage.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/NewChatSelectorPage.js b/src/pages/NewChatSelectorPage.js
index 93669d79dab4..093cb285ed54 100755
--- a/src/pages/NewChatSelectorPage.js
+++ b/src/pages/NewChatSelectorPage.js
@@ -42,10 +42,10 @@ function NewChatSelectorPage(props) {
             />
             <OnyxTabNavigator
                 id={CONST.TAB.NEW_CHAT_TAB_ID}
-                tabBar={({state, navigation, position}) => (
+                tabBar={({state, navigation: tabNavigation, position}) => (
                     <TabSelector
                         state={state}
-                        navigation={navigation}
+                        navigation={tabNavigation}
                         position={position}
                     />
                 )}

From c19372a98f8c42e195bf332b626c0f1f3917f18e Mon Sep 17 00:00:00 2001
From: Trevor Coleman <trevor@trevorcoleman.design>
Date: Thu, 1 Feb 2024 14:38:52 -0500
Subject: [PATCH 057/305] feat(Violations): reorder arguments when building
 onyx data, and remove policyTags & categories

---
 src/libs/actions/IOU.js                       | 42 ++-----------------
 .../step/IOURequestStepConfirmation.js        |  2 -
 .../iou/steps/MoneyRequestConfirmPage.js      |  3 +-
 tests/actions/IOUTest.js                      |  8 ++--
 4 files changed, 8 insertions(+), 47 deletions(-)

diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js
index fd32d6152665..638cc0ed3332 100644
--- a/src/libs/actions/IOU.js
+++ b/src/libs/actions/IOU.js
@@ -1495,21 +1495,7 @@ function requestMoney(
  *
  * @return {Object}
  */
-function createSplitsAndOnyxData(
-    participants,
-    currentUserLogin,
-    currentUserAccountID,
-    amount,
-    comment,
-    currency,
-    merchant,
-    category,
-    tag,
-    existingSplitChatReportID = '',
-    billable = false,
-    policyTags = undefined,
-    policyCategories = undefined,
-) {
+function createSplitsAndOnyxData(participants, currentUserLogin, currentUserAccountID, amount, comment, currency, merchant, category, tag, existingSplitChatReportID = '', billable = false) {
     const currentUserEmailForIOUSplit = OptionsListUtils.addSMSDomainIfPhoneNumber(currentUserLogin);
     const participantAccountIDs = _.map(participants, (participant) => Number(participant.accountID));
     const existingSplitChatReport =
@@ -1793,9 +1779,6 @@ function createSplitsAndOnyxData(
         const optimisticTransactionThread = ReportUtils.buildTransactionThread(oneOnOneIOUAction, oneOnOneIOUReport.reportID);
         const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(currentUserEmailForIOUSplit);
 
-        // Get the policy for the participant to determine if there should be transaction violations
-        const policy = ReportUtils.getPolicy(participant.policyID);
-
         // STEP 5: Build Onyx Data
         const [oneOnOneOptimisticData, oneOnOneSuccessData, oneOnOneFailureData] = buildOnyxDataForMoneyRequest(
             oneOnOneChatReport,
@@ -1809,12 +1792,9 @@ function createSplitsAndOnyxData(
             optimisticPolicyRecentlyUsedCategories,
             optimisticPolicyRecentlyUsedTags,
             isNewOneOnOneChatReport,
-            shouldCreateNewOneOnOneIOUReport,
             optimisticTransactionThread,
             optimisticCreatedActionForTransactionThread,
-            participant.isPolicyExpenseChat && policy,
-            policyTags,
-            policyCategories,
+            shouldCreateNewOneOnOneIOUReport,
         );
 
         const individualSplit = {
@@ -1871,21 +1851,7 @@ function createSplitsAndOnyxData(
  * @param {Array} policyTags
  * @param {Array} policyCategories
  */
-function splitBill(
-    participants,
-    currentUserLogin,
-    currentUserAccountID,
-    amount,
-    comment,
-    currency,
-    merchant,
-    category,
-    tag,
-    existingSplitChatReportID = '',
-    billable = false,
-    policyTags = undefined,
-    policyCategories = undefined,
-) {
+function splitBill(participants, currentUserLogin, currentUserAccountID, amount, comment, currency, merchant, category, tag, existingSplitChatReportID = '', billable = false) {
     const {splitData, splits, onyxData} = createSplitsAndOnyxData(
         participants,
         currentUserLogin,
@@ -1898,8 +1864,6 @@ function splitBill(
         tag,
         existingSplitChatReportID,
         billable,
-        policyTags,
-        policyCategories,
     );
     API.write(
         'SplitBill',
diff --git a/src/pages/iou/request/step/IOURequestStepConfirmation.js b/src/pages/iou/request/step/IOURequestStepConfirmation.js
index 30552126cd65..0cd131dc7107 100644
--- a/src/pages/iou/request/step/IOURequestStepConfirmation.js
+++ b/src/pages/iou/request/step/IOURequestStepConfirmation.js
@@ -246,8 +246,6 @@ function IOURequestStepConfirmation({
                     transaction.tag,
                     report.reportID,
                     transaction.billable,
-                    policyTags,
-                    policyCategories,
                 );
                 return;
             }
diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js
index 83c0d63af617..1ac739696734 100644
--- a/src/pages/iou/steps/MoneyRequestConfirmPage.js
+++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js
@@ -272,8 +272,7 @@ function MoneyRequestConfirmPage(props) {
                     props.iou.tag,
                     reportID,
                     props.iou.merchant,
-                    props.policyTags,
-                    props.policyCategories,
+                    false,
                 );
                 return;
             }
diff --git a/tests/actions/IOUTest.js b/tests/actions/IOUTest.js
index 8b71cba3c491..f9743cf10afd 100644
--- a/tests/actions/IOUTest.js
+++ b/tests/actions/IOUTest.js
@@ -987,8 +987,8 @@ describe('actions/IOU', () => {
                                 callback: (allReports) => {
                                     Onyx.disconnect(connectionID);
 
-                                    // There should now be 8 reports
-                                    expect(_.size(allReports)).toBe(8);
+                                    // There should now be 10 reports
+                                    expect(_.size(allReports)).toBe(10);
 
                                     // 1. The chat report with Rory + Carlos
                                     carlosChatReport = _.find(allReports, (report) => report.reportID === carlosChatReport.reportID);
@@ -1055,8 +1055,8 @@ describe('actions/IOU', () => {
                                 callback: (allReportActions) => {
                                     Onyx.disconnect(connectionID);
 
-                                    // There should be reportActions on all 5 chat reports + 3 IOU reports in each 1:1 chat
-                                    expect(_.size(allReportActions)).toBe(8);
+                                    // There should be reportActions on all 7 chat reports + 3 IOU reports in each 1:1 chat
+                                    expect(_.size(allReportActions)).toBe(10);
 
                                     const carlosReportActions = allReportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${carlosChatReport.iouReportID}`];
                                     const julesReportActions = allReportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${julesChatReport.iouReportID}`];

From ef706f9285a0cb6d4224ddfd96eea05064f249cc Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 1 Feb 2024 15:23:03 -0800
Subject: [PATCH 058/305] Fix linking config

---
 .../AppNavigator/ModalStackNavigators.tsx          |  6 +++---
 src/libs/Navigation/linkingConfig/config.ts        |  9 +++++++++
 src/pages/settings/InitialSettingsPage.js          | 14 +++++++-------
 3 files changed, 19 insertions(+), 10 deletions(-)

diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
index f9a37a810e11..b17ba463e480 100644
--- a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
+++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
@@ -191,6 +191,9 @@ const AccountSettingsModalStackNavigator = createModalStackNavigator(
         [SCREENS.SETTINGS.SHARE_CODE]: () => require('../../../pages/ShareCodePage').default as React.ComponentType,
         [SCREENS.SETTINGS.WALLET.ROOT]: () => require('../../../pages/settings/Wallet/WalletPage').default as React.ComponentType,
         [SCREENS.SETTINGS.ABOUT]: () => require('../../../pages/settings/AboutPage').default as React.ComponentType,
+        [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyReasonPage').default as React.ComponentType,
+        [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyResponsePage').default as React.ComponentType,
+        [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyConfirmPage').default as React.ComponentType,
     },
     (styles) => ({cardStyle: styles.navigationScreenCardStyle, headerShown: false}),
 );
@@ -245,9 +248,6 @@ const SettingsModalStackNavigator = createModalStackNavigator<SettingsNavigatorP
     [SCREENS.SETTINGS.TWO_FACTOR_AUTH]: () => require('../../../pages/settings/Security/TwoFactorAuth/TwoFactorAuthPage').default as React.ComponentType,
     [SCREENS.SETTINGS.REPORT_CARD_LOST_OR_DAMAGED]: () => require('../../../pages/settings/Wallet/ReportCardLostPage').default as React.ComponentType,
     [SCREENS.KEYBOARD_SHORTCUTS]: () => require('../../../pages/KeyboardShortcutsPage').default as React.ComponentType,
-    [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyReasonPage').default as React.ComponentType,
-    [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyResponsePage').default as React.ComponentType,
-    [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyConfirmPage').default as React.ComponentType,
 });
 
 const EnablePaymentsStackNavigator = createModalStackNavigator<EnablePaymentsNavigatorParamList>({
diff --git a/src/libs/Navigation/linkingConfig/config.ts b/src/libs/Navigation/linkingConfig/config.ts
index f1c9c316fe93..c0db821e8886 100644
--- a/src/libs/Navigation/linkingConfig/config.ts
+++ b/src/libs/Navigation/linkingConfig/config.ts
@@ -505,6 +505,15 @@ const config: LinkingOptions<RootStackParamList>['config'] = {
                             path: ROUTES.SETTINGS_ABOUT,
                             exact: true,
                         },
+                        [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: {
+                            path: ROUTES.SETTINGS_EXIT_SURVEY_REASON,
+                        },
+                        [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: {
+                            path: ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.route,
+                        },
+                        [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: {
+                            path: ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM,
+                        },
                     },
                 },
             },
diff --git a/src/pages/settings/InitialSettingsPage.js b/src/pages/settings/InitialSettingsPage.js
index 8f3450915bfa..560d7a73e310 100755
--- a/src/pages/settings/InitialSettingsPage.js
+++ b/src/pages/settings/InitialSettingsPage.js
@@ -165,13 +165,6 @@ function InitialSettingsPage(props) {
                     icon: Expensicons.Lock,
                     routeName: ROUTES.SETTINGS_SECURITY,
                 },
-                {
-                    translationKey: 'initialSettingsPage.goToExpensifyClassic',
-                    icon: Expensicons.NewExpensify,
-                    action: () => {
-                        Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_REASON);
-                    },
-                },
                 {
                     translationKey: 'initialSettingsPage.signOut',
                     icon: Expensicons.Exit,
@@ -207,6 +200,13 @@ function InitialSettingsPage(props) {
                     icon: Expensicons.Info,
                     routeName: ROUTES.SETTINGS_ABOUT,
                 },
+                {
+                    translationKey: 'initialSettingsPage.goToExpensifyClassic',
+                    icon: Expensicons.NewExpensify,
+                    action: () => {
+                        Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_REASON);
+                    },
+                },
             ],
         }),
         [styles.pt4],

From 8fab4f9c9de907de0872cbe655e9c92d1f8d27b5 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 1 Feb 2024 15:25:30 -0800
Subject: [PATCH 059/305] Consolidate goToExpensifyClassic copy

---
 src/languages/en.ts                       |  1 -
 src/languages/es.ts                       |  1 -
 src/pages/settings/InitialSettingsPage.js | 14 +++++++-------
 3 files changed, 7 insertions(+), 9 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index 954e6ac25bb1..9bd4f7c9cc83 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -806,7 +806,6 @@ export default {
                 label: 'macOS',
             },
         },
-        goToExpensifyClassic: 'Go to Expensify Classic',
         security: 'Security',
         signOut: 'Sign out',
         signOutConfirmationText: "You'll lose any offline changes if you sign-out.",
diff --git a/src/languages/es.ts b/src/languages/es.ts
index e61b6802d880..05b6738663d6 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -804,7 +804,6 @@ export default {
         signOut: 'Desconectar',
         signOutConfirmationText: 'Si cierras sesión perderás los cambios hechos mientras estabas desconectado',
         versionLetter: 'v',
-        goToExpensifyClassic: 'Ir a Expensify Classic',
         readTheTermsAndPrivacy: {
             phrase1: 'Leer los',
             phrase2: 'Términos de Servicio',
diff --git a/src/pages/settings/InitialSettingsPage.js b/src/pages/settings/InitialSettingsPage.js
index 560d7a73e310..5def717d5e3f 100755
--- a/src/pages/settings/InitialSettingsPage.js
+++ b/src/pages/settings/InitialSettingsPage.js
@@ -187,6 +187,13 @@ function InitialSettingsPage(props) {
             },
             sectionTranslationKey: 'initialSettingsPage.general',
             items: [
+                {
+                    translationKey: 'exitSurvey.goToExpensifyClassic',
+                    icon: Expensicons.NewExpensify,
+                    action: () => {
+                        Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_REASON);
+                    },
+                },
                 {
                     translationKey: 'initialSettingsPage.help',
                     icon: Expensicons.QuestionMark,
@@ -200,13 +207,6 @@ function InitialSettingsPage(props) {
                     icon: Expensicons.Info,
                     routeName: ROUTES.SETTINGS_ABOUT,
                 },
-                {
-                    translationKey: 'initialSettingsPage.goToExpensifyClassic',
-                    icon: Expensicons.NewExpensify,
-                    action: () => {
-                        Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_REASON);
-                    },
-                },
             ],
         }),
         [styles.pt4],

From 222cfb65d7f34ba3f883f39ce74cdadef10c9a7f Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 1 Feb 2024 15:26:22 -0800
Subject: [PATCH 060/305] Upgrade react-native-onyx

---
 package-lock.json | 8 ++++----
 package.json      | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index eea17b8ea1e4..14662e7a2bc0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -96,7 +96,7 @@
         "react-native-linear-gradient": "^2.8.1",
         "react-native-localize": "^2.2.6",
         "react-native-modal": "^13.0.0",
-        "react-native-onyx": "2.0.1",
+        "react-native-onyx": "2.0.4",
         "react-native-pager-view": "6.2.2",
         "react-native-pdf": "6.7.3",
         "react-native-performance": "^5.1.0",
@@ -45056,9 +45056,9 @@
       }
     },
     "node_modules/react-native-onyx": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/react-native-onyx/-/react-native-onyx-2.0.1.tgz",
-      "integrity": "sha512-o6QNvq91qg8hFXIhmHjBqlNXD/YZxBZSRN8Vkq7xD2NYskzxK2mLqhBdhB8yMMwe6Cd8sVUK4vlZax/JU79xYw==",
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/react-native-onyx/-/react-native-onyx-2.0.4.tgz",
+      "integrity": "sha512-QpeqqpvH4XGTWgPK4qJ6NoBvHDXFWtbLOuGBN7iqd3RVFx+juxgiuaf+Zr0GEpR2P40vsX5IA0m1SiAotvzbmA==",
       "dependencies": {
         "ascii-table": "0.0.9",
         "fast-equals": "^4.0.3",
diff --git a/package.json b/package.json
index 0e8e08aa187f..997b44fc5d94 100644
--- a/package.json
+++ b/package.json
@@ -144,7 +144,7 @@
     "react-native-linear-gradient": "^2.8.1",
     "react-native-localize": "^2.2.6",
     "react-native-modal": "^13.0.0",
-    "react-native-onyx": "2.0.1",
+    "react-native-onyx": "2.0.4",
     "react-native-pager-view": "6.2.2",
     "react-native-pdf": "6.7.3",
     "react-native-performance": "^5.1.0",

From 33d614d2b6851d88aca0045887e13cacb01b8fa8 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 1 Feb 2024 16:10:04 -0800
Subject: [PATCH 061/305] Hide reason page back button on wide layouts

---
 src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index e0df8957ef91..1663102aa0dd 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -8,6 +8,7 @@ import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
+import useWindowDimensions from '@hooks/useWindowDimensions';
 import Navigation from '@navigation/Navigation';
 import * as ExitSurvey from '@userActions/ExitSurvey';
 import type {ExitReason} from '@userActions/ExitSurvey';
@@ -19,6 +20,7 @@ import type {Errors} from '@src/types/onyx/OnyxCommon';
 function ExitSurveyReasonPage() {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
+    const {isSmallScreenWidth} = useWindowDimensions();
 
     const [reason, setReason] = useState<ExitReason>();
     const reasons: Choice[] = useMemo(
@@ -36,6 +38,7 @@ function ExitSurveyReasonPage() {
             <HeaderWithBackButton
                 title={translate('exitSurvey.header')}
                 onBackButtonPress={() => Navigation.goBack()}
+                shouldShowBackButton={isSmallScreenWidth}
             />
             <FormProvider
                 formID={ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM}

From db6b991ebef2dd48382c497c8694046bc03665d1 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 1 Feb 2024 16:15:33 -0800
Subject: [PATCH 062/305] Remove unnecessary ref

---
 src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 291afe6370c5..a6939e24277e 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -1,5 +1,5 @@
 import type {StackScreenProps} from '@react-navigation/stack';
-import React, {useRef} from 'react';
+import React from 'react';
 import type {OnyxEntry} from 'react-native-onyx';
 import {withOnyx} from 'react-native-onyx';
 import FormProvider from '@components/Form/FormProvider';
@@ -43,8 +43,6 @@ function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePagePr
 
     const {reason} = route.params;
 
-    const responseInputRef = useRef<AnimatedTextInputRef | null>(null);
-
     const formTopMarginsStyle = styles.mt3;
     const textStyle = styles.headerAnonymousFooter;
     const baseResponseInputContainerStyle = styles.mt7;
@@ -111,11 +109,9 @@ function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePagePr
                             if (!el) {
                                 return;
                             }
-                            responseInputRef.current = el;
                             updateMultilineInputRange(el);
                         }}
                         value={draftResponse}
-                        // onChangeText={setResponse}
                         containerStyles={[baseResponseInputContainerStyle, StyleUtils.getMaximumHeight(responseInputMaxHeight)]}
                         shouldSaveDraft
                     />

From 3bff7db2daaa84d35ad3d0002f1263df1080541a Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 1 Feb 2024 16:20:21 -0800
Subject: [PATCH 063/305] Submit response form on CMD+Enter

---
 .../settings/ExitSurvey/ExitSurveyResponsePage.tsx | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index a6939e24277e..6b5f38d3d399 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -1,5 +1,5 @@
 import type {StackScreenProps} from '@react-navigation/stack';
-import React from 'react';
+import React, {useCallback} from 'react';
 import type {OnyxEntry} from 'react-native-onyx';
 import {withOnyx} from 'react-native-onyx';
 import FormProvider from '@components/Form/FormProvider';
@@ -9,6 +9,7 @@ import type {AnimatedTextInputRef} from '@components/RNTextInput';
 import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
 import TextInput from '@components/TextInput';
+import useKeyboardShortcut from '@hooks/useKeyboardShortcut';
 import useLocalize from '@hooks/useLocalize';
 import useSafeAreaInsets from '@hooks/useSafeAreaInsets';
 import useStyleUtils from '@hooks/useStyleUtils';
@@ -43,6 +44,12 @@ function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePagePr
 
     const {reason} = route.params;
 
+    const submitForm = useCallback(() => {
+        ExitSurvey.saveResponse(draftResponse);
+        Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM);
+    }, [draftResponse]);
+    useKeyboardShortcut(CONST.KEYBOARD_SHORTCUTS.CTRL_ENTER, submitForm);
+
     const formTopMarginsStyle = styles.mt3;
     const textStyle = styles.headerAnonymousFooter;
     const baseResponseInputContainerStyle = styles.mt7;
@@ -80,10 +87,7 @@ function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePagePr
             <FormProvider
                 formID={ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM}
                 style={[styles.flex1, styles.mh5, formTopMarginsStyle, StyleUtils.getMaximumHeight(formMaxHeight)]}
-                onSubmit={() => {
-                    ExitSurvey.saveResponse(draftResponse);
-                    Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM);
-                }}
+                onSubmit={submitForm}
                 submitButtonText={translate('common.next')}
                 validate={() => {
                     const errors: Errors = {};

From a7f4a2f5bd11bb8f6a1c993cfdac9d1adac50ed6 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 1 Feb 2024 16:50:14 -0800
Subject: [PATCH 064/305] Fix form second submission

---
 src/ONYXKEYS.ts                               |  4 +++
 .../API/parameters/SwitchToOldDotParams.ts    |  4 +--
 src/libs/actions/ExitSurvey.ts                | 19 +++++++++-----
 .../ExitSurvey/ExitSurveyConfirmPage.tsx      | 25 +++++--------------
 4 files changed, 25 insertions(+), 27 deletions(-)

diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts
index 752060b93507..713d08f0375a 100755
--- a/src/ONYXKEYS.ts
+++ b/src/ONYXKEYS.ts
@@ -191,6 +191,9 @@ const ONYXKEYS = {
     /** Is report data loading? */
     IS_LOADING_APP: 'isLoadingApp',
 
+    /** Is the user in the process of switching to OldDot? */
+    IS_SWITCHING_TO_OLD_DOT: 'isSwitchingToOldDot',
+
     /** Is the test tools modal open? */
     IS_TEST_TOOLS_MODAL_OPEN: 'isTestToolsModalOpen',
 
@@ -439,6 +442,7 @@ type OnyxValues = {
     [ONYXKEYS.IS_LOADING_REPORT_DATA]: boolean;
     [ONYXKEYS.IS_TEST_TOOLS_MODAL_OPEN]: boolean;
     [ONYXKEYS.IS_LOADING_APP]: boolean;
+    [ONYXKEYS.IS_SWITCHING_TO_OLD_DOT]: boolean;
     [ONYXKEYS.WALLET_TRANSFER]: OnyxTypes.WalletTransfer;
     [ONYXKEYS.LAST_ACCESSED_WORKSPACE_POLICY_ID]: string;
     [ONYXKEYS.SHOULD_SHOW_COMPOSE_INPUT]: boolean;
diff --git a/src/libs/API/parameters/SwitchToOldDotParams.ts b/src/libs/API/parameters/SwitchToOldDotParams.ts
index 7fe363a542e4..95449a123dc9 100644
--- a/src/libs/API/parameters/SwitchToOldDotParams.ts
+++ b/src/libs/API/parameters/SwitchToOldDotParams.ts
@@ -2,8 +2,8 @@ import type {ValueOf} from 'type-fest';
 import type CONST from '@src/CONST';
 
 type SwitchToOldDotParams = {
-    reason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
-    surveyResponse: string;
+    reason?: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
+    surveyResponse?: string;
 };
 
 export default SwitchToOldDotParams;
diff --git a/src/libs/actions/ExitSurvey.ts b/src/libs/actions/ExitSurvey.ts
index 063095699057..7b3ba839397c 100644
--- a/src/libs/actions/ExitSurvey.ts
+++ b/src/libs/actions/ExitSurvey.ts
@@ -2,7 +2,6 @@ import type {OnyxUpdate} from 'react-native-onyx';
 import Onyx from 'react-native-onyx';
 import type {ValueOf} from 'type-fest';
 import * as API from '@libs/API';
-import Log from '@libs/Log';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 
@@ -31,12 +30,20 @@ function saveResponse(response: string) {
  * Save the user's response to the mandatory exit survey in the back-end.
  */
 function switchToOldDot() {
-    if (!exitReason || !exitSurveyResponse) {
-        Log.hmmm('Attempted to call SwitchToOldDot without filling out mandatory survey.');
-        return;
-    }
+    const optimisticData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.SET,
+            key: ONYXKEYS.IS_SWITCHING_TO_OLD_DOT,
+            value: true,
+        },
+    ];
 
     const finallyData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.SET,
+            key: ONYXKEYS.IS_SWITCHING_TO_OLD_DOT,
+            value: false,
+        },
         {
             onyxMethod: Onyx.METHOD.SET,
             key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM,
@@ -65,7 +72,7 @@ function switchToOldDot() {
             reason: exitReason,
             surveyResponse: exitSurveyResponse,
         },
-        {finallyData},
+        {optimisticData, finallyData},
     );
 }
 
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index 7a6b7eb147dc..c347029b3a77 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -1,4 +1,4 @@
-import React, {useEffect, useState} from 'react';
+import React from 'react';
 import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
@@ -12,28 +12,17 @@ import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
 import * as ExitSurvey from '@userActions/ExitSurvey';
-import type {ExitReason} from '@userActions/ExitSurvey';
 import * as Link from '@userActions/Link';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
-import type * as OnyxTypes from '@src/types/onyx';
 
 type ExitSurveyConfirmPageOnyxProps = {
-    exitReason: ExitReason | null;
+    isLoading: OnyxEntry<boolean>;
 };
 
-function ExitSurveyConfirmPage({exitReason}: ExitSurveyConfirmPageOnyxProps) {
+function ExitSurveyConfirmPage({isLoading}: ExitSurveyConfirmPageOnyxProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
-
-    const [isLoading, setIsLoading] = useState(false);
-    useEffect(() => {
-        if (exitReason) {
-            return;
-        }
-        setIsLoading(false);
-    }, [exitReason]);
-
     return (
         <ScreenWrapper testID={ExitSurveyConfirmPage.displayName}>
             <HeaderWithBackButton
@@ -50,11 +39,10 @@ function ExitSurveyConfirmPage({exitReason}: ExitSurveyConfirmPageOnyxProps) {
                     success
                     text={translate('exitSurvey.goToExpensifyClassic')}
                     onPress={() => {
-                        setIsLoading(true);
                         ExitSurvey.switchToOldDot();
                         Link.openOldDotLink(CONST.OLDDOT_URLS.INBOX);
                     }}
-                    isLoading={isLoading}
+                    isLoading={isLoading ?? false}
                 />
             </FixedFooter>
         </ScreenWrapper>
@@ -64,8 +52,7 @@ function ExitSurveyConfirmPage({exitReason}: ExitSurveyConfirmPageOnyxProps) {
 ExitSurveyConfirmPage.displayName = 'ExitSurveyConfirmPage';
 
 export default withOnyx<ExitSurveyConfirmPageOnyxProps, ExitSurveyConfirmPageOnyxProps>({
-    exitReason: {
-        key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM,
-        selector: (value: OnyxEntry<OnyxTypes.ExitSurveyReasonForm>) => value?.reason ?? null,
+    isLoading: {
+        key: ONYXKEYS.IS_SWITCHING_TO_OLD_DOT,
     },
 })(ExitSurveyConfirmPage);

From a61b8d52ecfe59dc62997b70bad34f3791b4ccf5 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 1 Feb 2024 17:04:06 -0800
Subject: [PATCH 065/305] Make isOffline a true boolean

---
 src/hooks/useNetwork.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/hooks/useNetwork.ts b/src/hooks/useNetwork.ts
index f9e1a627c5f5..eae7c53c7173 100644
--- a/src/hooks/useNetwork.ts
+++ b/src/hooks/useNetwork.ts
@@ -5,7 +5,7 @@ type UseNetworkProps = {
     onReconnect?: () => void;
 };
 
-type UseNetwork = {isOffline?: boolean};
+type UseNetwork = {isOffline: boolean};
 
 export default function useNetwork({onReconnect = () => {}}: UseNetworkProps = {}): UseNetwork {
     const callback = useRef(onReconnect);
@@ -28,5 +28,5 @@ export default function useNetwork({onReconnect = () => {}}: UseNetworkProps = {
         prevOfflineStatusRef.current = isOffline;
     }, [isOffline]);
 
-    return {isOffline};
+    return {isOffline: isOffline ?? false};
 }

From 566000b04c4afdd1a20735982419df2dfe853fe8 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 1 Feb 2024 17:50:28 -0800
Subject: [PATCH 066/305] Implement offline UI for reason page

---
 src/languages/en.ts                           |  1 +
 .../ExitSurvey/ExitSurveyReasonPage.tsx       | 39 ++++++++++++++-----
 2 files changed, 30 insertions(+), 10 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index 9bd4f7c9cc83..6d55887789e4 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -2174,6 +2174,7 @@ export default {
         thankYou: 'Thanks for the feedback!',
         thankYouSubtitle: 'Your responses will help us build a better product to get stuff done. Thank you so much!',
         goToExpensifyClassic: 'Switch to Expensify Classic',
+        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.",
     },
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index 1663102aa0dd..7a34c386c56b 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -1,15 +1,20 @@
 import React, {useMemo, useState} from 'react';
+import {View} from 'react-native';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
+import Icon from '@components/Icon';
+import {ToddBehindCloud} from '@components/Icon/Illustrations';
 import type {Choice} from '@components/RadioButtons';
 import RadioButtons from '@components/RadioButtons';
 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 useWindowDimensions from '@hooks/useWindowDimensions';
 import Navigation from '@navigation/Navigation';
+import variables from '@styles/variables';
 import * as ExitSurvey from '@userActions/ExitSurvey';
 import type {ExitReason} from '@userActions/ExitSurvey';
 import CONST from '@src/CONST';
@@ -21,6 +26,7 @@ function ExitSurveyReasonPage() {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const {isSmallScreenWidth} = useWindowDimensions();
+    const {isOffline} = useNetwork();
 
     const [reason, setReason] = useState<ExitReason>();
     const reasons: Choice[] = useMemo(
@@ -61,16 +67,29 @@ function ExitSurveyReasonPage() {
                 shouldValidateOnBlur
                 shouldValidateOnChange
             >
-                <>
-                    <Text style={styles.headerAnonymousFooter}>{translate('exitSurvey.reasonPage.title')}</Text>
-                    <Text style={styles.mt2}>{translate('exitSurvey.reasonPage.subtitle')}</Text>
-                    <InputWrapper
-                        InputComponent={RadioButtons}
-                        inputID={CONST.EXIT_SURVEY.REASON_INPUT_ID}
-                        items={reasons}
-                        onPress={(value) => setReason(value as ExitReason)}
-                    />
-                </>
+                {isOffline && (
+                    <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter]}>
+                        <Icon
+                            width={variables.modalTopIconWidth}
+                            height={variables.modalTopIconHeight}
+                            src={ToddBehindCloud}
+                        />
+                        <Text style={styles.headerAnonymousFooter}>{translate('exitSurvey.offlineTitle')}</Text>
+                        <Text style={styles.mt2}>{translate('exitSurvey.offline')}</Text>
+                    </View>
+                )}
+                {!isOffline && (
+                    <>
+                        <Text style={styles.headerAnonymousFooter}>{translate('exitSurvey.reasonPage.title')}</Text>
+                        <Text style={styles.mt2}>{translate('exitSurvey.reasonPage.subtitle')}</Text>
+                        <InputWrapper
+                            InputComponent={RadioButtons}
+                            inputID={CONST.EXIT_SURVEY.REASON_INPUT_ID}
+                            items={reasons}
+                            onPress={(value) => setReason(value as ExitReason)}
+                        />
+                    </>
+                )}
             </FormProvider>
         </ScreenWrapper>
     );

From b3245a333ba4f85960503ca4e6b62ed6880ef443 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 1 Feb 2024 18:02:48 -0800
Subject: [PATCH 067/305] Implement offline UI for the other pages in the
 survey as well

---
 .../ExitSurvey/ExitSurveyConfirmPage.tsx      | 27 ++++++++---
 .../settings/ExitSurvey/ExitSurveyOffline.tsx | 28 +++++++++++
 .../ExitSurvey/ExitSurveyReasonPage.tsx       | 17 +------
 .../ExitSurvey/ExitSurveyResponsePage.tsx     | 48 +++++++++++--------
 4 files changed, 78 insertions(+), 42 deletions(-)
 create mode 100644 src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index c347029b3a77..c7d6088a2b97 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {useEffect} from 'react';
 import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
@@ -9,12 +9,15 @@ import {MushroomTopHat} from '@components/Icon/Illustrations';
 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 ExitSurvey from '@userActions/ExitSurvey';
 import * as Link from '@userActions/Link';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import ROUTES from '@src/ROUTES';
+import ExitSurveyOffline from './ExitSurveyOffline';
 
 type ExitSurveyConfirmPageOnyxProps = {
     isLoading: OnyxEntry<boolean>;
@@ -22,18 +25,30 @@ type ExitSurveyConfirmPageOnyxProps = {
 
 function ExitSurveyConfirmPage({isLoading}: ExitSurveyConfirmPageOnyxProps) {
     const {translate} = useLocalize();
+    const {isOffline} = useNetwork();
     const styles = useThemeStyles();
+
+    useEffect(() => {
+        if (!isOffline) {
+            return;
+        }
+        Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_REASON);
+    }, [isOffline]);
+
     return (
         <ScreenWrapper testID={ExitSurveyConfirmPage.displayName}>
             <HeaderWithBackButton
                 title={translate('exitSurvey.header')}
                 onBackButtonPress={() => Navigation.goBack()}
             />
-            <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter, styles.p5]}>
-                <MushroomTopHat />
-                <Text style={[styles.headerAnonymousFooter, styles.mt5]}>{translate('exitSurvey.thankYou')}</Text>
-                <Text style={[styles.mt2]}>{translate('exitSurvey.thankYouSubtitle')}</Text>
-            </View>
+            {isOffline && <ExitSurveyOffline />}
+            {!isOffline && (
+                <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter, styles.p5]}>
+                    <MushroomTopHat />
+                    <Text style={[styles.headerAnonymousFooter, styles.mt5]}>{translate('exitSurvey.thankYou')}</Text>
+                    <Text style={[styles.mt2]}>{translate('exitSurvey.thankYouSubtitle')}</Text>
+                </View>
+            )}
             <FixedFooter>
                 <Button
                     success
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx b/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx
new file mode 100644
index 000000000000..a02ee48d1943
--- /dev/null
+++ b/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx
@@ -0,0 +1,28 @@
+import React, {memo} from 'react';
+import {View} from 'react-native';
+import Icon from '@components/Icon';
+import {ToddBehindCloud} from '@components/Icon/Illustrations';
+import Text from '@components/Text';
+import useLocalize from '@hooks/useLocalize';
+import useThemeStyles from '@hooks/useThemeStyles';
+import variables from '@styles/variables';
+
+function ExitSurveyOffline() {
+    const {translate} = useLocalize();
+    const styles = useThemeStyles();
+    return (
+        <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter]}>
+            <Icon
+                width={variables.modalTopIconWidth}
+                height={variables.modalTopIconHeight}
+                src={ToddBehindCloud}
+            />
+            <Text style={styles.headerAnonymousFooter}>{translate('exitSurvey.offlineTitle')}</Text>
+            <Text style={styles.mt2}>{translate('exitSurvey.offline')}</Text>
+        </View>
+    );
+}
+
+ExitSurveyOffline.displayName = 'ExitSurveyOffline';
+
+export default memo(ExitSurveyOffline);
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index 7a34c386c56b..0ee59fe88bbd 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -1,10 +1,7 @@
 import React, {useMemo, useState} from 'react';
-import {View} from 'react-native';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
-import Icon from '@components/Icon';
-import {ToddBehindCloud} from '@components/Icon/Illustrations';
 import type {Choice} from '@components/RadioButtons';
 import RadioButtons from '@components/RadioButtons';
 import ScreenWrapper from '@components/ScreenWrapper';
@@ -14,13 +11,13 @@ import useNetwork from '@hooks/useNetwork';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import Navigation from '@navigation/Navigation';
-import variables from '@styles/variables';
 import * as ExitSurvey from '@userActions/ExitSurvey';
 import type {ExitReason} from '@userActions/ExitSurvey';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import type {Errors} from '@src/types/onyx/OnyxCommon';
+import ExitSurveyOffline from './ExitSurveyOffline';
 
 function ExitSurveyReasonPage() {
     const {translate} = useLocalize();
@@ -67,17 +64,7 @@ function ExitSurveyReasonPage() {
                 shouldValidateOnBlur
                 shouldValidateOnChange
             >
-                {isOffline && (
-                    <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter]}>
-                        <Icon
-                            width={variables.modalTopIconWidth}
-                            height={variables.modalTopIconHeight}
-                            src={ToddBehindCloud}
-                        />
-                        <Text style={styles.headerAnonymousFooter}>{translate('exitSurvey.offlineTitle')}</Text>
-                        <Text style={styles.mt2}>{translate('exitSurvey.offline')}</Text>
-                    </View>
-                )}
+                {isOffline && <ExitSurveyOffline />}
                 {!isOffline && (
                     <>
                         <Text style={styles.headerAnonymousFooter}>{translate('exitSurvey.reasonPage.title')}</Text>
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 6b5f38d3d399..ce0b81cdabff 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -11,6 +11,7 @@ import Text from '@components/Text';
 import TextInput from '@components/TextInput';
 import useKeyboardShortcut from '@hooks/useKeyboardShortcut';
 import useLocalize from '@hooks/useLocalize';
+import useNetwork from '@hooks/useNetwork';
 import useSafeAreaInsets from '@hooks/useSafeAreaInsets';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useThemeStyles from '@hooks/useThemeStyles';
@@ -28,6 +29,7 @@ import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
 import type * as OnyxTypes from '@src/types/onyx';
 import type {Errors} from '@src/types/onyx/OnyxCommon';
+import ExitSurveyOffline from './ExitSurveyOffline';
 
 type ExitSurveyResponsePageOnyxProps = {
     draftResponse: string;
@@ -37,6 +39,7 @@ type ExitSurveyResponsePageProps = ExitSurveyResponsePageOnyxProps & StackScreen
 
 function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePageProps) {
     const {translate} = useLocalize();
+    const {isOffline} = useNetwork();
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     const {windowHeight} = useWindowDimensions();
@@ -99,27 +102,30 @@ function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePagePr
                 shouldValidateOnBlur
                 shouldValidateOnChange
             >
-                <>
-                    <Text style={textStyle}>{translate(`exitSurvey.prompts.${reason}`)}</Text>
-                    <InputWrapper
-                        InputComponent={TextInput}
-                        inputID={CONST.EXIT_SURVEY.RESPONSE_INPUT_ID}
-                        label={translate(`exitSurvey.responsePlaceholder`)}
-                        accessibilityLabel={translate(`exitSurvey.responsePlaceholder`)}
-                        role={CONST.ROLE.PRESENTATION}
-                        autoGrowHeight
-                        maxLength={CONST.MAX_COMMENT_LENGTH}
-                        ref={(el: AnimatedTextInputRef) => {
-                            if (!el) {
-                                return;
-                            }
-                            updateMultilineInputRange(el);
-                        }}
-                        value={draftResponse}
-                        containerStyles={[baseResponseInputContainerStyle, StyleUtils.getMaximumHeight(responseInputMaxHeight)]}
-                        shouldSaveDraft
-                    />
-                </>
+                {isOffline && <ExitSurveyOffline />}
+                {!isOffline && (
+                    <>
+                        <Text style={textStyle}>{translate(`exitSurvey.prompts.${reason}`)}</Text>
+                        <InputWrapper
+                            InputComponent={TextInput}
+                            inputID={CONST.EXIT_SURVEY.RESPONSE_INPUT_ID}
+                            label={translate(`exitSurvey.responsePlaceholder`)}
+                            accessibilityLabel={translate(`exitSurvey.responsePlaceholder`)}
+                            role={CONST.ROLE.PRESENTATION}
+                            autoGrowHeight
+                            maxLength={CONST.MAX_COMMENT_LENGTH}
+                            ref={(el: AnimatedTextInputRef) => {
+                                if (!el) {
+                                    return;
+                                }
+                                updateMultilineInputRange(el);
+                            }}
+                            value={draftResponse}
+                            containerStyles={[baseResponseInputContainerStyle, StyleUtils.getMaximumHeight(responseInputMaxHeight)]}
+                            shouldSaveDraft
+                        />
+                    </>
+                )}
             </FormProvider>
         </ScreenWrapper>
     );

From 220a974a3dad4fd27ee97785c29e1db1ee199f3b Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 1 Feb 2024 18:03:39 -0800
Subject: [PATCH 068/305] Disable button in confirm page when offline

---
 src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index c7d6088a2b97..932f8d2803aa 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -58,6 +58,7 @@ function ExitSurveyConfirmPage({isLoading}: ExitSurveyConfirmPageOnyxProps) {
                         Link.openOldDotLink(CONST.OLDDOT_URLS.INBOX);
                     }}
                     isLoading={isLoading ?? false}
+                    isDisabled={isOffline}
                 />
             </FixedFooter>
         </ScreenWrapper>

From aed59f1591a9c9733c45cd2259d4b24b0744680d Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 2 Feb 2024 10:34:30 -0800
Subject: [PATCH 069/305] Move survey back to RHP

---
 src/libs/Navigation/linkingConfig/config.ts | 18 +++++++++---------
 src/pages/settings/InitialSettingsPage.js   |  4 +---
 2 files changed, 10 insertions(+), 12 deletions(-)

diff --git a/src/libs/Navigation/linkingConfig/config.ts b/src/libs/Navigation/linkingConfig/config.ts
index c0db821e8886..496588d8114d 100644
--- a/src/libs/Navigation/linkingConfig/config.ts
+++ b/src/libs/Navigation/linkingConfig/config.ts
@@ -250,6 +250,15 @@ const config: LinkingOptions<RootStackParamList>['config'] = {
                             path: ROUTES.KEYBOARD_SHORTCUTS,
                         },
                         [SCREENS.WORKSPACE.NAME]: ROUTES.WORKSPACE_OVERVIEW_NAME.route,
+                        [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: {
+                            path: ROUTES.SETTINGS_EXIT_SURVEY_REASON,
+                        },
+                        [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: {
+                            path: ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.route,
+                        },
+                        [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: {
+                            path: ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM,
+                        },
                     },
                 },
                 [SCREENS.RIGHT_MODAL.PRIVATE_NOTES]: {
@@ -505,15 +514,6 @@ const config: LinkingOptions<RootStackParamList>['config'] = {
                             path: ROUTES.SETTINGS_ABOUT,
                             exact: true,
                         },
-                        [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: {
-                            path: ROUTES.SETTINGS_EXIT_SURVEY_REASON,
-                        },
-                        [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: {
-                            path: ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.route,
-                        },
-                        [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: {
-                            path: ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM,
-                        },
                     },
                 },
             },
diff --git a/src/pages/settings/InitialSettingsPage.js b/src/pages/settings/InitialSettingsPage.js
index 5def717d5e3f..a5417ce9d4e3 100755
--- a/src/pages/settings/InitialSettingsPage.js
+++ b/src/pages/settings/InitialSettingsPage.js
@@ -190,9 +190,7 @@ function InitialSettingsPage(props) {
                 {
                     translationKey: 'exitSurvey.goToExpensifyClassic',
                     icon: Expensicons.NewExpensify,
-                    action: () => {
-                        Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_REASON);
-                    },
+                    routeName: ROUTES.SETTINGS_EXIT_SURVEY_REASON,
                 },
                 {
                     translationKey: 'initialSettingsPage.help',

From 4222758f2d61c5980acfd027fbe838952bbfe9e9 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 2 Feb 2024 10:35:59 -0800
Subject: [PATCH 070/305] Fix typo

---
 src/pages/settings/InitialSettingsPage.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/settings/InitialSettingsPage.js b/src/pages/settings/InitialSettingsPage.js
index a5417ce9d4e3..7acbd8fedfad 100755
--- a/src/pages/settings/InitialSettingsPage.js
+++ b/src/pages/settings/InitialSettingsPage.js
@@ -180,7 +180,7 @@ function InitialSettingsPage(props) {
      * Retuns a list of menu items data for general section
      * @returns {Object} object with translationKey, style and items for the general section
      */
-    const generaltMenuItemsData = useMemo(
+    const generalMenuItemsData = useMemo(
         () => ({
             sectionStyle: {
                 ...styles.pt4,
@@ -283,7 +283,7 @@ function InitialSettingsPage(props) {
     );
 
     const accountMenuItems = useMemo(() => getMenuItemsSection(accountMenuItemsData), [accountMenuItemsData, getMenuItemsSection]);
-    const generalMenuItems = useMemo(() => getMenuItemsSection(generaltMenuItemsData), [generaltMenuItemsData, getMenuItemsSection]);
+    const generalMenuItems = useMemo(() => getMenuItemsSection(generalMenuItemsData), [generalMenuItemsData, getMenuItemsSection]);
 
     const currentUserDetails = props.currentUserPersonalDetails || {};
     const avatarURL = lodashGet(currentUserDetails, 'avatar', '');

From edbf8a4125bd3a57d32cd95eb18713f9e2506b9e Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 2 Feb 2024 10:53:40 -0800
Subject: [PATCH 071/305] Fix navigation to RHP

---
 src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx | 6 +++---
 src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx    | 3 ---
 2 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
index b17ba463e480..f9a37a810e11 100644
--- a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
+++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
@@ -191,9 +191,6 @@ const AccountSettingsModalStackNavigator = createModalStackNavigator(
         [SCREENS.SETTINGS.SHARE_CODE]: () => require('../../../pages/ShareCodePage').default as React.ComponentType,
         [SCREENS.SETTINGS.WALLET.ROOT]: () => require('../../../pages/settings/Wallet/WalletPage').default as React.ComponentType,
         [SCREENS.SETTINGS.ABOUT]: () => require('../../../pages/settings/AboutPage').default as React.ComponentType,
-        [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyReasonPage').default as React.ComponentType,
-        [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyResponsePage').default as React.ComponentType,
-        [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyConfirmPage').default as React.ComponentType,
     },
     (styles) => ({cardStyle: styles.navigationScreenCardStyle, headerShown: false}),
 );
@@ -248,6 +245,9 @@ const SettingsModalStackNavigator = createModalStackNavigator<SettingsNavigatorP
     [SCREENS.SETTINGS.TWO_FACTOR_AUTH]: () => require('../../../pages/settings/Security/TwoFactorAuth/TwoFactorAuthPage').default as React.ComponentType,
     [SCREENS.SETTINGS.REPORT_CARD_LOST_OR_DAMAGED]: () => require('../../../pages/settings/Wallet/ReportCardLostPage').default as React.ComponentType,
     [SCREENS.KEYBOARD_SHORTCUTS]: () => require('../../../pages/KeyboardShortcutsPage').default as React.ComponentType,
+    [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyReasonPage').default as React.ComponentType,
+    [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyResponsePage').default as React.ComponentType,
+    [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: () => require('../../../pages/settings/ExitSurvey/ExitSurveyConfirmPage').default as React.ComponentType,
 });
 
 const EnablePaymentsStackNavigator = createModalStackNavigator<EnablePaymentsNavigatorParamList>({
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index 0ee59fe88bbd..ea19d58c3b9f 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -9,7 +9,6 @@ import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
 import useNetwork from '@hooks/useNetwork';
 import useThemeStyles from '@hooks/useThemeStyles';
-import useWindowDimensions from '@hooks/useWindowDimensions';
 import Navigation from '@navigation/Navigation';
 import * as ExitSurvey from '@userActions/ExitSurvey';
 import type {ExitReason} from '@userActions/ExitSurvey';
@@ -22,7 +21,6 @@ import ExitSurveyOffline from './ExitSurveyOffline';
 function ExitSurveyReasonPage() {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
-    const {isSmallScreenWidth} = useWindowDimensions();
     const {isOffline} = useNetwork();
 
     const [reason, setReason] = useState<ExitReason>();
@@ -41,7 +39,6 @@ function ExitSurveyReasonPage() {
             <HeaderWithBackButton
                 title={translate('exitSurvey.header')}
                 onBackButtonPress={() => Navigation.goBack()}
-                shouldShowBackButton={isSmallScreenWidth}
             />
             <FormProvider
                 formID={ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM}

From 7c5e3317edbd5bc98a7fe4ef2e05a60908208b27 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 2 Feb 2024 10:55:29 -0800
Subject: [PATCH 072/305] Remove unnecessary offline navigation effect

---
 .../settings/ExitSurvey/ExitSurveyConfirmPage.tsx     | 11 +----------
 1 file changed, 1 insertion(+), 10 deletions(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index 932f8d2803aa..19679fdcccdc 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -1,4 +1,4 @@
-import React, {useEffect} from 'react';
+import React from 'react';
 import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
@@ -16,7 +16,6 @@ import * as ExitSurvey from '@userActions/ExitSurvey';
 import * as Link from '@userActions/Link';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
-import ROUTES from '@src/ROUTES';
 import ExitSurveyOffline from './ExitSurveyOffline';
 
 type ExitSurveyConfirmPageOnyxProps = {
@@ -27,14 +26,6 @@ function ExitSurveyConfirmPage({isLoading}: ExitSurveyConfirmPageOnyxProps) {
     const {translate} = useLocalize();
     const {isOffline} = useNetwork();
     const styles = useThemeStyles();
-
-    useEffect(() => {
-        if (!isOffline) {
-            return;
-        }
-        Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_REASON);
-    }, [isOffline]);
-
     return (
         <ScreenWrapper testID={ExitSurveyConfirmPage.displayName}>
             <HeaderWithBackButton

From 1893e7a498c12b136557d2d3a7082fdaffbba264 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 2 Feb 2024 11:25:14 -0800
Subject: [PATCH 073/305] Add backTo param to response and confirm page, even
 though it doesn't work

---
 src/ROUTES.ts                                            | 7 +++++--
 src/libs/Navigation/linkingConfig/config.ts              | 2 +-
 src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx   | 2 +-
 src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx | 2 +-
 4 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/ROUTES.ts b/src/ROUTES.ts
index c38cb34adaac..cc623c44475f 100644
--- a/src/ROUTES.ts
+++ b/src/ROUTES.ts
@@ -158,9 +158,12 @@ const ROUTES = {
     SETTINGS_EXIT_SURVEY_REASON: 'settings/exit-survey/reason',
     SETTINGS_EXIT_SURVEY_RESPONSE: {
         route: 'settings/exit-survey/response',
-        getRoute: (reason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>) => `settings/exit-survey/response?reason=${encodeURIComponent(reason)}` as const,
+        getRoute: (reason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>, backTo: string) => getUrlWithBackToParam(`settings/exit-survey/response?reason=${encodeURIComponent(reason)}`, backTo),
+    },
+    SETTINGS_EXIT_SURVEY_CONFIRM: {
+        route: 'settings/exit-survey/confirm',
+        getRoute: (backTo: string) => getUrlWithBackToParam('settings/exit-survey/confirm', backTo),
     },
-    SETTINGS_EXIT_SURVEY_CONFIRM: 'settings/exit-survey/confirm',
 
     KEYBOARD_SHORTCUTS: 'keyboard-shortcuts',
 
diff --git a/src/libs/Navigation/linkingConfig/config.ts b/src/libs/Navigation/linkingConfig/config.ts
index 496588d8114d..b02afb43f8b3 100644
--- a/src/libs/Navigation/linkingConfig/config.ts
+++ b/src/libs/Navigation/linkingConfig/config.ts
@@ -257,7 +257,7 @@ const config: LinkingOptions<RootStackParamList>['config'] = {
                             path: ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.route,
                         },
                         [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: {
-                            path: ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM,
+                            path: ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM.route,
                         },
                     },
                 },
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index ea19d58c3b9f..acd55210af6f 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -55,7 +55,7 @@ function ExitSurveyReasonPage() {
                         return;
                     }
                     ExitSurvey.saveExitReason(reason);
-                    Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(reason));
+                    Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(reason, ROUTES.SETTINGS_EXIT_SURVEY_REASON));
                 }}
                 submitButtonText={translate('common.next')}
                 shouldValidateOnBlur
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index ce0b81cdabff..e9ed2d3d16c9 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -49,7 +49,7 @@ function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePagePr
 
     const submitForm = useCallback(() => {
         ExitSurvey.saveResponse(draftResponse);
-        Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM);
+        Navigation.navigate(ROUTES.SETTINGS_EXIT_SURVEY_CONFIRM.getRoute(ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.route));
     }, [draftResponse]);
     useKeyboardShortcut(CONST.KEYBOARD_SHORTCUTS.CTRL_ENTER, submitForm);
 

From ecfc373a84788f1eef3bdae59c14acebc4f5c643 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 2 Feb 2024 11:25:26 -0800
Subject: [PATCH 074/305] Add missing spanish translation

---
 src/languages/es.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/languages/es.ts b/src/languages/es.ts
index 05b6738663d6..0fe35d4a4902 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2662,6 +2662,7 @@ export default {
         thankYou: '¡Gracias por tus comentarios!',
         thankYouSubtitle: 'Sus respuestas nos ayudarán a crear un mejor producto para hacer las cosas bien. ¡Muchas gracias!',
         goToExpensifyClassic: 'Cambiar a Expensify Classic',
+        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.',
     },

From fb01bd23b3e1f7e860ae05e976b277a246238576 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 2 Feb 2024 11:57:01 -0800
Subject: [PATCH 075/305] Fix backTo bug

---
 src/ROUTES.ts                                        |  5 +++--
 .../settings/ExitSurvey/ExitSurveyConfirmPage.tsx    | 12 ++++++++++--
 .../settings/ExitSurvey/ExitSurveyResponsePage.tsx   |  2 +-
 3 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/ROUTES.ts b/src/ROUTES.ts
index cc623c44475f..906786b7282d 100644
--- a/src/ROUTES.ts
+++ b/src/ROUTES.ts
@@ -158,11 +158,12 @@ const ROUTES = {
     SETTINGS_EXIT_SURVEY_REASON: 'settings/exit-survey/reason',
     SETTINGS_EXIT_SURVEY_RESPONSE: {
         route: 'settings/exit-survey/response',
-        getRoute: (reason: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>, backTo: string) => getUrlWithBackToParam(`settings/exit-survey/response?reason=${encodeURIComponent(reason)}`, backTo),
+        getRoute: (reason?: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>, backTo?: string) =>
+            getUrlWithBackToParam(`settings/exit-survey/response${reason ? `?reason=${encodeURIComponent(reason)}` : ''}`, backTo),
     },
     SETTINGS_EXIT_SURVEY_CONFIRM: {
         route: 'settings/exit-survey/confirm',
-        getRoute: (backTo: string) => getUrlWithBackToParam('settings/exit-survey/confirm', backTo),
+        getRoute: (backTo?: string) => getUrlWithBackToParam('settings/exit-survey/confirm', backTo),
     },
 
     KEYBOARD_SHORTCUTS: 'keyboard-shortcuts',
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index 19679fdcccdc..c7d8885c1944 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -13,16 +13,20 @@ import useNetwork from '@hooks/useNetwork';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
 import * as ExitSurvey from '@userActions/ExitSurvey';
+import type {ExitReason} from '@userActions/ExitSurvey';
 import * as Link from '@userActions/Link';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import ROUTES from '@src/ROUTES';
+import type * as OnyxTypes from '@src/types/onyx';
 import ExitSurveyOffline from './ExitSurveyOffline';
 
 type ExitSurveyConfirmPageOnyxProps = {
+    exitReason?: ExitReason;
     isLoading: OnyxEntry<boolean>;
 };
 
-function ExitSurveyConfirmPage({isLoading}: ExitSurveyConfirmPageOnyxProps) {
+function ExitSurveyConfirmPage({exitReason, isLoading}: ExitSurveyConfirmPageOnyxProps) {
     const {translate} = useLocalize();
     const {isOffline} = useNetwork();
     const styles = useThemeStyles();
@@ -30,7 +34,7 @@ function ExitSurveyConfirmPage({isLoading}: ExitSurveyConfirmPageOnyxProps) {
         <ScreenWrapper testID={ExitSurveyConfirmPage.displayName}>
             <HeaderWithBackButton
                 title={translate('exitSurvey.header')}
-                onBackButtonPress={() => Navigation.goBack()}
+                onBackButtonPress={() => Navigation.goBack(exitReason ? ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(exitReason, ROUTES.SETTINGS_EXIT_SURVEY_REASON) : undefined)}
             />
             {isOffline && <ExitSurveyOffline />}
             {!isOffline && (
@@ -59,6 +63,10 @@ function ExitSurveyConfirmPage({isLoading}: ExitSurveyConfirmPageOnyxProps) {
 ExitSurveyConfirmPage.displayName = 'ExitSurveyConfirmPage';
 
 export default withOnyx<ExitSurveyConfirmPageOnyxProps, ExitSurveyConfirmPageOnyxProps>({
+    exitReason: {
+        key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM,
+        selector: (value: OnyxEntry<OnyxTypes.ExitSurveyReasonForm>) => value?.[CONST.EXIT_SURVEY.REASON_INPUT_ID],
+    },
     isLoading: {
         key: ONYXKEYS.IS_SWITCHING_TO_OLD_DOT,
     },
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index e9ed2d3d16c9..ff297861b3b2 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -85,7 +85,7 @@ function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePagePr
         <ScreenWrapper testID={ExitSurveyResponsePage.displayName}>
             <HeaderWithBackButton
                 title={translate('exitSurvey.header')}
-                onBackButtonPress={() => Navigation.goBack()}
+                onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_EXIT_SURVEY_REASON)}
             />
             <FormProvider
                 formID={ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM}

From 50d47e9b5823dcc0e0f56756d8a55aa8bd0016ab Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 2 Feb 2024 14:39:49 -0800
Subject: [PATCH 076/305] Move switch to Expensify Classic to top of account
 settings page

---
 src/pages/settings/InitialSettingsPage.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/pages/settings/InitialSettingsPage.js b/src/pages/settings/InitialSettingsPage.js
index 7acbd8fedfad..81666ed8fa78 100755
--- a/src/pages/settings/InitialSettingsPage.js
+++ b/src/pages/settings/InitialSettingsPage.js
@@ -135,6 +135,11 @@ function InitialSettingsPage(props) {
             sectionStyle: styles.accountSettingsSectionContainer,
             sectionTranslationKey: 'initialSettingsPage.account',
             items: [
+                {
+                    translationKey: 'exitSurvey.goToExpensifyClassic',
+                    icon: Expensicons.NewExpensify,
+                    routeName: ROUTES.SETTINGS_EXIT_SURVEY_REASON,
+                },
                 {
                     translationKey: 'common.profile',
                     icon: Expensicons.Profile,
@@ -187,11 +192,6 @@ function InitialSettingsPage(props) {
             },
             sectionTranslationKey: 'initialSettingsPage.general',
             items: [
-                {
-                    translationKey: 'exitSurvey.goToExpensifyClassic',
-                    icon: Expensicons.NewExpensify,
-                    routeName: ROUTES.SETTINGS_EXIT_SURVEY_REASON,
-                },
                 {
                     translationKey: 'initialSettingsPage.help',
                     icon: Expensicons.QuestionMark,

From 3ee883283fc0aef1c7f74c3ff014cf436b068ea4 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 2 Feb 2024 18:35:30 -0800
Subject: [PATCH 077/305] Subtract keyboard height from maxHeight of form and
 input

---
 src/components/withKeyboardState.tsx          | 20 +++++++++++++------
 .../ExitSurvey/ExitSurveyResponsePage.tsx     |  3 +++
 2 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/src/components/withKeyboardState.tsx b/src/components/withKeyboardState.tsx
index 74d10945fbcb..560576fdbf5c 100755
--- a/src/components/withKeyboardState.tsx
+++ b/src/components/withKeyboardState.tsx
@@ -8,27 +8,34 @@ import type ChildrenProps from '@src/types/utils/ChildrenProps';
 type KeyboardStateContextValue = {
     /** Whether the keyboard is open */
     isKeyboardShown: boolean;
+
+    /** Height of the keyboard in pixels */
+    keyboardHeight: number;
 };
 
 // TODO: Remove - left for backwards compatibility with existing components (https://github.com/Expensify/App/issues/25151)
 const keyboardStatePropTypes = {
     /** Whether the keyboard is open */
     isKeyboardShown: PropTypes.bool.isRequired,
+
+    /** Height of the keyboard in pixels */
+    keyboardHeight: PropTypes.number.isRequired,
 };
 
 const KeyboardStateContext = createContext<KeyboardStateContextValue>({
     isKeyboardShown: false,
+    keyboardHeight: 0,
 });
 
 function KeyboardStateProvider({children}: ChildrenProps): ReactElement | null {
-    const [isKeyboardShown, setIsKeyboardShown] = useState(false);
+    const [keyboardHeight, setKeyboardHeight] = useState(0);
 
     useEffect(() => {
-        const keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', () => {
-            setIsKeyboardShown(true);
+        const keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', (e) => {
+            setKeyboardHeight(e.endCoordinates.height);
         });
         const keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', () => {
-            setIsKeyboardShown(false);
+            setKeyboardHeight(0);
         });
 
         return () => {
@@ -39,9 +46,10 @@ function KeyboardStateProvider({children}: ChildrenProps): ReactElement | null {
 
     const contextValue = useMemo(
         () => ({
-            isKeyboardShown,
+            keyboardHeight,
+            isKeyboardShown: keyboardHeight !== 0,
         }),
-        [isKeyboardShown],
+        [keyboardHeight],
     );
     return <KeyboardStateContext.Provider value={contextValue}>{children}</KeyboardStateContext.Provider>;
 }
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index ff297861b3b2..be9efe3adf2b 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -10,6 +10,7 @@ import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
 import TextInput from '@components/TextInput';
 import useKeyboardShortcut from '@hooks/useKeyboardShortcut';
+import useKeyboardState from '@hooks/useKeyboardState';
 import useLocalize from '@hooks/useLocalize';
 import useNetwork from '@hooks/useNetwork';
 import useSafeAreaInsets from '@hooks/useSafeAreaInsets';
@@ -42,6 +43,7 @@ function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePagePr
     const {isOffline} = useNetwork();
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
+    const {keyboardHeight} = useKeyboardState();
     const {windowHeight} = useWindowDimensions();
     const {top: safeAreaInsetsTop} = useSafeAreaInsets();
 
@@ -58,6 +60,7 @@ function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePagePr
     const baseResponseInputContainerStyle = styles.mt7;
     const formMaxHeight = Math.floor(
         windowHeight -
+            keyboardHeight -
             safeAreaInsetsTop -
             // Minus the height of HeaderWithBackButton
             variables.contentHeaderHeight -

From 382510499af817c7490a08c77472d5ff874f0444 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Tue, 6 Feb 2024 11:04:57 +0800
Subject: [PATCH 078/305] remove unused import

---
 src/pages/NewChatSelectorPage.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/NewChatSelectorPage.js b/src/pages/NewChatSelectorPage.js
index f5cdafc17df9..0e8e192db884 100755
--- a/src/pages/NewChatSelectorPage.js
+++ b/src/pages/NewChatSelectorPage.js
@@ -7,7 +7,6 @@ import TabSelector from '@components/TabSelector/TabSelector';
 import withLocalize, {withLocalizePropTypes} from '@components/withLocalize';
 import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions';
 import compose from '@libs/compose';
-import Navigation from '@libs/Navigation/Navigation';
 import OnyxTabNavigator, {TopTab} from '@libs/Navigation/OnyxTabNavigator';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';

From da579792bb56c1b87225afae6b68a33774ad794c Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Tue, 6 Feb 2024 11:34:51 -0500
Subject: [PATCH 079/305] Update optimistic transaction thread logic for
 typscript conversion

---
 .../API/parameters/CreateDistanceRequestParams.ts    |  2 ++
 src/libs/API/parameters/RequestMoneyParams.ts        |  2 ++
 src/libs/API/parameters/SendMoneyParams.ts           |  2 ++
 src/libs/actions/IOU.ts                              | 12 ++++++------
 src/types/onyx/IOU.ts                                |  2 ++
 5 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/src/libs/API/parameters/CreateDistanceRequestParams.ts b/src/libs/API/parameters/CreateDistanceRequestParams.ts
index c1eb1003a698..62f90a64cf05 100644
--- a/src/libs/API/parameters/CreateDistanceRequestParams.ts
+++ b/src/libs/API/parameters/CreateDistanceRequestParams.ts
@@ -12,6 +12,8 @@ type CreateDistanceRequestParams = {
     category?: string;
     tag?: string;
     billable?: boolean;
+    transactionThreadReportID: string;
+    createdReportActionIDForThread: string;
 };
 
 export default CreateDistanceRequestParams;
diff --git a/src/libs/API/parameters/RequestMoneyParams.ts b/src/libs/API/parameters/RequestMoneyParams.ts
index ccafdd692137..4e5153083027 100644
--- a/src/libs/API/parameters/RequestMoneyParams.ts
+++ b/src/libs/API/parameters/RequestMoneyParams.ts
@@ -24,6 +24,8 @@ type RequestMoneyParams = {
     taxCode: string;
     taxAmount: number;
     billable?: boolean;
+    transactionThreadReportID: string;
+    createdReportActionIDForThread: string;
 };
 
 export default RequestMoneyParams;
diff --git a/src/libs/API/parameters/SendMoneyParams.ts b/src/libs/API/parameters/SendMoneyParams.ts
index c32287d5b4ec..dce9845421d6 100644
--- a/src/libs/API/parameters/SendMoneyParams.ts
+++ b/src/libs/API/parameters/SendMoneyParams.ts
@@ -10,6 +10,8 @@ type SendMoneyParams = {
     newIOUReportDetails: string;
     createdReportActionID: string;
     reportPreviewReportActionID: string;
+    transactionThreadReportID: string;
+    createdReportActionIDForThread: string;
 };
 
 export default SendMoneyParams;
diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts
index c34c4905fc39..832865c1807c 100644
--- a/src/libs/actions/IOU.ts
+++ b/src/libs/actions/IOU.ts
@@ -888,7 +888,7 @@ function getMoneyRequestInformation(
         false,
         currentTime,
     );
-    const optimisticTransactionThread = ReportUtils.buildTransactionThread(iouAction, iouReport.reportID);
+    const optimisticTransactionThread = ReportUtils.buildTransactionThread(iouAction as OnyxEntry<ReportAction>, iouReport.reportID);
     const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(payeeEmail);
 
     let reportPreviewAction = shouldCreateNewMoneyRequestReport ? null : ReportActionsUtils.getReportPreviewAction(chatReport.reportID, iouReport.reportID);
@@ -1739,7 +1739,7 @@ function createSplitsAndOnyxData(
         const optimisticPolicyRecentlyUsedTags = isPolicyExpenseChat ? Policy.buildOptimisticPolicyRecentlyUsedTags(participant.policyID, tag) : {};
 
         // Create optimistic transactionThread
-        const optimisticTransactionThread = ReportUtils.buildTransactionThread(oneOnOneIOUAction, oneOnOneIOUReport.reportID);
+        const optimisticTransactionThread = ReportUtils.buildTransactionThread(oneOnOneIOUAction as OnyxEntry<ReportAction>, oneOnOneIOUReport.reportID);
         const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(currentUserEmailForIOUSplit);
 
         // STEP 5: Build Onyx Data
@@ -2332,7 +2332,7 @@ function completeSplitBill(chatReportID: string, reportAction: OnyxTypes.ReportA
             oneOnOneReportPreviewAction = ReportUtils.buildOptimisticReportPreview(oneOnOneChatReport, oneOnOneIOUReport, '', oneOnOneTransaction);
         }
 
-        const optimisticTransactionThread = ReportUtils.buildTransactionThread(oneOnOneIOUAction, oneOnOneIOUReport.reportID);
+        const optimisticTransactionThread = ReportUtils.buildTransactionThread(oneOnOneIOUAction as OnyxEntry<ReportAction>, oneOnOneIOUReport.reportID);
         const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(currentUserEmailForIOUSplit);
 
         const [oneOnOneOptimisticData, oneOnOneSuccessData, oneOnOneFailureData] = buildOnyxDataForMoneyRequest(
@@ -2347,9 +2347,9 @@ function completeSplitBill(chatReportID: string, reportAction: OnyxTypes.ReportA
             [],
             {},
             isNewOneOnOneChatReport,
-            shouldCreateNewOneOnOneIOUReport,
             optimisticTransactionThread,
             optimisticCreatedActionForTransactionThread,
+            shouldCreateNewOneOnOneIOUReport,
         );
 
         splits.push({
@@ -3014,7 +3014,7 @@ function getSendMoneyParams(
 
     const reportPreviewAction = ReportUtils.buildOptimisticReportPreview(chatReport, optimisticIOUReport);
 
-    const optimisticTransactionThread = ReportUtils.buildTransactionThread(optimisticIOUReportAction, optimisticIOUReport.reportID);
+    const optimisticTransactionThread = ReportUtils.buildTransactionThread(optimisticIOUReportAction as OnyxEntry<ReportAction>, optimisticIOUReport.reportID);
     const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(recipientEmail);
 
     // Change the method to set for new reports because it doesn't exist yet, is faster,
@@ -3071,7 +3071,7 @@ function getSendMoneyParams(
             [reportPreviewAction.reportActionID]: reportPreviewAction,
         },
     };
-    const optimisticTransactionThreadReportActionsData = {
+    const optimisticTransactionThreadReportActionsData: OnyxUpdate = {
         onyxMethod: Onyx.METHOD.MERGE,
         key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${optimisticTransactionThread.reportID}`,
         value: {
diff --git a/src/types/onyx/IOU.ts b/src/types/onyx/IOU.ts
index b04011978d73..6bbcb174a617 100644
--- a/src/types/onyx/IOU.ts
+++ b/src/types/onyx/IOU.ts
@@ -35,6 +35,8 @@ type Split = {
     createdChatReportActionID?: string;
     createdIOUReportActionID?: string;
     reportPreviewReportActionID?: string;
+    transactionThreadReportID?: string;
+    createdReportActionIDForThread?: string;
 };
 
 type IOU = {

From 40b514fe11010b160d0ad6ba59cf263e0e4d9867 Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Tue, 6 Feb 2024 23:37:27 +0700
Subject: [PATCH 080/305] fix: incomplete referral link

---
 src/libs/actions/User.ts | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/src/libs/actions/User.ts b/src/libs/actions/User.ts
index 09cc6e49e6cc..5007fa96fa10 100644
--- a/src/libs/actions/User.ts
+++ b/src/libs/actions/User.ts
@@ -678,6 +678,13 @@ function generateStatementPDF(period: string) {
 function setContactMethodAsDefault(newDefaultContactMethod: string) {
     const oldDefaultContactMethod = currentEmail;
     const optimisticData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: ONYXKEYS.ACCOUNT,
+            value: {
+                primaryLogin: newDefaultContactMethod,
+            },
+        },
         {
             onyxMethod: Onyx.METHOD.MERGE,
             key: ONYXKEYS.SESSION,
@@ -724,6 +731,13 @@ function setContactMethodAsDefault(newDefaultContactMethod: string) {
         },
     ];
     const failureData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: ONYXKEYS.ACCOUNT,
+            value: {
+                primaryLogin: oldDefaultContactMethod,
+            },
+        },
         {
             onyxMethod: Onyx.METHOD.MERGE,
             key: ONYXKEYS.SESSION,

From f06d5b02a044b48554c69d55cf5148ca63bb8c3d Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Tue, 6 Feb 2024 15:49:32 -0500
Subject: [PATCH 081/305] Refactor buildTransactionThread function calls in
 IOU.ts

---
 src/libs/actions/IOU.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts
index 832865c1807c..1da26ccf4b65 100644
--- a/src/libs/actions/IOU.ts
+++ b/src/libs/actions/IOU.ts
@@ -888,7 +888,7 @@ function getMoneyRequestInformation(
         false,
         currentTime,
     );
-    const optimisticTransactionThread = ReportUtils.buildTransactionThread(iouAction as OnyxEntry<ReportAction>, iouReport.reportID);
+    const optimisticTransactionThread = ReportUtils.buildTransactionThread(iouAction, iouReport.reportID);
     const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(payeeEmail);
 
     let reportPreviewAction = shouldCreateNewMoneyRequestReport ? null : ReportActionsUtils.getReportPreviewAction(chatReport.reportID, iouReport.reportID);
@@ -1739,7 +1739,7 @@ function createSplitsAndOnyxData(
         const optimisticPolicyRecentlyUsedTags = isPolicyExpenseChat ? Policy.buildOptimisticPolicyRecentlyUsedTags(participant.policyID, tag) : {};
 
         // Create optimistic transactionThread
-        const optimisticTransactionThread = ReportUtils.buildTransactionThread(oneOnOneIOUAction as OnyxEntry<ReportAction>, oneOnOneIOUReport.reportID);
+        const optimisticTransactionThread = ReportUtils.buildTransactionThread(oneOnOneIOUAction, oneOnOneIOUReport.reportID);
         const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(currentUserEmailForIOUSplit);
 
         // STEP 5: Build Onyx Data
@@ -2332,7 +2332,7 @@ function completeSplitBill(chatReportID: string, reportAction: OnyxTypes.ReportA
             oneOnOneReportPreviewAction = ReportUtils.buildOptimisticReportPreview(oneOnOneChatReport, oneOnOneIOUReport, '', oneOnOneTransaction);
         }
 
-        const optimisticTransactionThread = ReportUtils.buildTransactionThread(oneOnOneIOUAction as OnyxEntry<ReportAction>, oneOnOneIOUReport.reportID);
+        const optimisticTransactionThread = ReportUtils.buildTransactionThread(oneOnOneIOUAction, oneOnOneIOUReport.reportID);
         const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(currentUserEmailForIOUSplit);
 
         const [oneOnOneOptimisticData, oneOnOneSuccessData, oneOnOneFailureData] = buildOnyxDataForMoneyRequest(
@@ -3014,7 +3014,7 @@ function getSendMoneyParams(
 
     const reportPreviewAction = ReportUtils.buildOptimisticReportPreview(chatReport, optimisticIOUReport);
 
-    const optimisticTransactionThread = ReportUtils.buildTransactionThread(optimisticIOUReportAction as OnyxEntry<ReportAction>, optimisticIOUReport.reportID);
+    const optimisticTransactionThread = ReportUtils.buildTransactionThread(optimisticIOUReportAction, optimisticIOUReport.reportID);
     const optimisticCreatedActionForTransactionThread = ReportUtils.buildOptimisticCreatedReportAction(recipientEmail);
 
     // Change the method to set for new reports because it doesn't exist yet, is faster,

From 4451052f379d7bd625b52ae58b530cac36b11362 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Wed, 7 Feb 2024 14:41:28 +0800
Subject: [PATCH 082/305] update bottom tab when nvaigating to settings

---
 src/pages/workspace/WorkspaceMembersPage.js | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/pages/workspace/WorkspaceMembersPage.js b/src/pages/workspace/WorkspaceMembersPage.js
index cdcf15f8b0e2..9b0e301fd576 100644
--- a/src/pages/workspace/WorkspaceMembersPage.js
+++ b/src/pages/workspace/WorkspaceMembersPage.js
@@ -176,6 +176,11 @@ function WorkspaceMembersPage(props) {
         getWorkspaceMembers();
     }, [props.network.isOffline, prevIsOffline, getWorkspaceMembers]);
 
+    const notFoundGoBack = () => {
+        Navigation.goBack(ROUTES.SETTINGS_WORKSPACES);
+        Navigation.navigateWithSwitchPolicyID({route: ROUTES.ALL_SETTINGS});
+    }
+
     /**
      * Open the modal to invite a user
      */
@@ -425,7 +430,8 @@ function WorkspaceMembersPage(props) {
             <FullPageNotFoundView
                 shouldShow={(_.isEmpty(props.policy) && !props.isLoadingReportData) || !PolicyUtils.isPolicyAdmin(props.policy) || PolicyUtils.isPendingDeletePolicy(props.policy)}
                 subtitleKey={_.isEmpty(props.policy) ? undefined : 'workspace.common.notAuthorized'}
-                onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_WORKSPACES)}
+                onBackButtonPress={notFoundGoBack}
+                onLinkPress={notFoundGoBack}
             >
                 <HeaderWithBackButton
                     title={props.translate('workspace.common.members')}

From 4ed993b4577161383567680138305bb636e39dda Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Wed, 7 Feb 2024 15:04:20 +0800
Subject: [PATCH 083/305] rename

---
 src/pages/workspace/WorkspaceMembersPage.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/workspace/WorkspaceMembersPage.js b/src/pages/workspace/WorkspaceMembersPage.js
index 9b0e301fd576..aaa34c57b4e6 100644
--- a/src/pages/workspace/WorkspaceMembersPage.js
+++ b/src/pages/workspace/WorkspaceMembersPage.js
@@ -176,7 +176,7 @@ function WorkspaceMembersPage(props) {
         getWorkspaceMembers();
     }, [props.network.isOffline, prevIsOffline, getWorkspaceMembers]);
 
-    const notFoundGoBack = () => {
+    const goBackFromNotFoundPage = () => {
         Navigation.goBack(ROUTES.SETTINGS_WORKSPACES);
         Navigation.navigateWithSwitchPolicyID({route: ROUTES.ALL_SETTINGS});
     }

From a21821a5aedbac274e1d8ae9e43cdba54913013b Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Wed, 7 Feb 2024 15:09:59 +0800
Subject: [PATCH 084/305] rename

---
 src/pages/workspace/WorkspaceMembersPage.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/workspace/WorkspaceMembersPage.js b/src/pages/workspace/WorkspaceMembersPage.js
index aaa34c57b4e6..b610d6227f23 100644
--- a/src/pages/workspace/WorkspaceMembersPage.js
+++ b/src/pages/workspace/WorkspaceMembersPage.js
@@ -176,7 +176,7 @@ function WorkspaceMembersPage(props) {
         getWorkspaceMembers();
     }, [props.network.isOffline, prevIsOffline, getWorkspaceMembers]);
 
-    const goBackFromNotFoundPage = () => {
+    const goBack = () => {
         Navigation.goBack(ROUTES.SETTINGS_WORKSPACES);
         Navigation.navigateWithSwitchPolicyID({route: ROUTES.ALL_SETTINGS});
     }
@@ -430,8 +430,8 @@ function WorkspaceMembersPage(props) {
             <FullPageNotFoundView
                 shouldShow={(_.isEmpty(props.policy) && !props.isLoadingReportData) || !PolicyUtils.isPolicyAdmin(props.policy) || PolicyUtils.isPendingDeletePolicy(props.policy)}
                 subtitleKey={_.isEmpty(props.policy) ? undefined : 'workspace.common.notAuthorized'}
-                onBackButtonPress={notFoundGoBack}
-                onLinkPress={notFoundGoBack}
+                onBackButtonPress={goBack}
+                onLinkPress={goBack}
             >
                 <HeaderWithBackButton
                     title={props.translate('workspace.common.members')}

From d002fa2a21d96ab9520da71fd2536406e191555b Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Wed, 7 Feb 2024 21:04:33 +0800
Subject: [PATCH 085/305] prettier

---
 src/pages/workspace/WorkspaceMembersPage.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/workspace/WorkspaceMembersPage.js b/src/pages/workspace/WorkspaceMembersPage.js
index b610d6227f23..c8ff4cfd09d9 100644
--- a/src/pages/workspace/WorkspaceMembersPage.js
+++ b/src/pages/workspace/WorkspaceMembersPage.js
@@ -179,7 +179,7 @@ function WorkspaceMembersPage(props) {
     const goBack = () => {
         Navigation.goBack(ROUTES.SETTINGS_WORKSPACES);
         Navigation.navigateWithSwitchPolicyID({route: ROUTES.ALL_SETTINGS});
-    }
+    };
 
     /**
      * Open the modal to invite a user

From 78a61fb1e310339e18d96a3df6a35c66ab760228 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Thu, 8 Feb 2024 23:36:09 +0800
Subject: [PATCH 086/305] move the code to util and use it on other pages too

---
 src/libs/PolicyUtils.ts                               | 10 ++++++++++
 .../ReimbursementAccount/ReimbursementAccountPage.js  |  3 ++-
 src/pages/workspace/WorkspaceInitialPage.js           |  5 +++--
 src/pages/workspace/WorkspaceInviteMessagePage.js     |  3 ++-
 src/pages/workspace/WorkspaceInvitePage.js            |  3 ++-
 src/pages/workspace/WorkspaceMembersPage.js           |  9 ++-------
 src/pages/workspace/WorkspaceOverviewCurrencyPage.js  |  4 ++--
 src/pages/workspace/WorkspacePageWithSections.tsx     | 11 ++---------
 8 files changed, 25 insertions(+), 23 deletions(-)

diff --git a/src/libs/PolicyUtils.ts b/src/libs/PolicyUtils.ts
index d9e57f5e3bb8..50cfc7152c5f 100644
--- a/src/libs/PolicyUtils.ts
+++ b/src/libs/PolicyUtils.ts
@@ -3,9 +3,11 @@ import type {OnyxCollection, OnyxEntry} from 'react-native-onyx';
 import type {ValueOf} from 'type-fest';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import ROUTES from '@src/ROUTES';
 import type {PersonalDetailsList, Policy, PolicyMembers, PolicyTag, PolicyTags} from '@src/types/onyx';
 import type {EmptyObject} from '@src/types/utils/EmptyObject';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
+import Navigation from './Navigation/Navigation';
 
 type MemberEmailsToAccountIDs = Record<string, number>;
 type UnitRate = {rate: number};
@@ -220,6 +222,13 @@ function getPolicyMembersByIdWithoutCurrentUser(policyMembers: OnyxCollection<Po
         : [];
 }
 
+function goBackFromInvalidPolicy() {
+    Navigation.goBack(ROUTES.SETTINGS_WORKSPACES);
+
+    // Needed when workspace with given policyID does not exist
+    Navigation.navigateWithSwitchPolicyID({route: ROUTES.ALL_SETTINGS});
+}
+
 export {
     getActivePolicies,
     hasPolicyMemberError,
@@ -245,4 +254,5 @@ export {
     extractPolicyIDFromPath,
     getPathWithoutPolicyID,
     getPolicyMembersByIdWithoutCurrentUser,
+    goBackFromInvalidPolicy,
 };
diff --git a/src/pages/ReimbursementAccount/ReimbursementAccountPage.js b/src/pages/ReimbursementAccount/ReimbursementAccountPage.js
index 2882e1436b9d..30e579290fdd 100644
--- a/src/pages/ReimbursementAccount/ReimbursementAccountPage.js
+++ b/src/pages/ReimbursementAccount/ReimbursementAccountPage.js
@@ -427,7 +427,8 @@ function ReimbursementAccountPage({reimbursementAccount, route, onfidoToken, pol
             <ScreenWrapper testID={ReimbursementAccountPage.displayName}>
                 <FullPageNotFoundView
                     shouldShow
-                    onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_WORKSPACES)}
+                    onBackButtonPress={PolicyUtils.goBackFromInvalidPolicy}
+                    onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
                     subtitleKey={_.isEmpty(policy) ? undefined : 'workspace.common.notAuthorized'}
                 />
             </ScreenWrapper>
diff --git a/src/pages/workspace/WorkspaceInitialPage.js b/src/pages/workspace/WorkspaceInitialPage.js
index 8141fe92a5d9..c03c3809d517 100644
--- a/src/pages/workspace/WorkspaceInitialPage.js
+++ b/src/pages/workspace/WorkspaceInitialPage.js
@@ -46,7 +46,7 @@ const defaultProps = {
  * @param {string} policyID
  */
 function dismissError(policyID) {
-    Navigation.goBack(ROUTES.SETTINGS_WORKSPACES);
+    PolicyUtils.goBackFromInvalidPolicy();
     Policy.removeWorkspace(policyID);
 }
 
@@ -173,7 +173,8 @@ function WorkspaceInitialPage(props) {
             style={[styles.pb0]}
         >
             <FullPageNotFoundView
-                onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_WORKSPACES)}
+                onBackButtonPress={PolicyUtils.goBackFromInvalidPolicy}
+                onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
                 shouldShow={shouldShowNotFoundPage}
                 subtitleKey={_.isEmpty(policy) ? undefined : 'workspace.common.notAuthorized'}
             >
diff --git a/src/pages/workspace/WorkspaceInviteMessagePage.js b/src/pages/workspace/WorkspaceInviteMessagePage.js
index 00bdce30891a..1677c7c612e2 100644
--- a/src/pages/workspace/WorkspaceInviteMessagePage.js
+++ b/src/pages/workspace/WorkspaceInviteMessagePage.js
@@ -134,7 +134,8 @@ function WorkspaceInviteMessagePage(props) {
             <FullPageNotFoundView
                 shouldShow={_.isEmpty(props.policy) || !PolicyUtils.isPolicyAdmin(props.policy) || PolicyUtils.isPendingDeletePolicy(props.policy)}
                 subtitleKey={_.isEmpty(props.policy) ? undefined : 'workspace.common.notAuthorized'}
-                onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_WORKSPACES)}
+                onBackButtonPress={PolicyUtils.goBackFromInvalidPolicy}
+                onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
             >
                 <HeaderWithBackButton
                     title={translate('workspace.inviteMessage.inviteMessageTitle')}
diff --git a/src/pages/workspace/WorkspaceInvitePage.js b/src/pages/workspace/WorkspaceInvitePage.js
index 4bf2bf3a8472..4f096a05e94a 100644
--- a/src/pages/workspace/WorkspaceInvitePage.js
+++ b/src/pages/workspace/WorkspaceInvitePage.js
@@ -291,7 +291,8 @@ function WorkspaceInvitePage(props) {
             <FullPageNotFoundView
                 shouldShow={(_.isEmpty(props.policy) && !props.isLoadingReportData) || !PolicyUtils.isPolicyAdmin(props.policy) || PolicyUtils.isPendingDeletePolicy(props.policy)}
                 subtitleKey={_.isEmpty(props.policy) ? undefined : 'workspace.common.notAuthorized'}
-                onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_WORKSPACES)}
+                onBackButtonPress={PolicyUtils.goBackFromInvalidPolicy}
+                onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
             >
                 <HeaderWithBackButton
                     title={translate('workspace.invite.invitePeople')}
diff --git a/src/pages/workspace/WorkspaceMembersPage.js b/src/pages/workspace/WorkspaceMembersPage.js
index c8ff4cfd09d9..c7c83a9a79f3 100644
--- a/src/pages/workspace/WorkspaceMembersPage.js
+++ b/src/pages/workspace/WorkspaceMembersPage.js
@@ -176,11 +176,6 @@ function WorkspaceMembersPage(props) {
         getWorkspaceMembers();
     }, [props.network.isOffline, prevIsOffline, getWorkspaceMembers]);
 
-    const goBack = () => {
-        Navigation.goBack(ROUTES.SETTINGS_WORKSPACES);
-        Navigation.navigateWithSwitchPolicyID({route: ROUTES.ALL_SETTINGS});
-    };
-
     /**
      * Open the modal to invite a user
      */
@@ -430,8 +425,8 @@ function WorkspaceMembersPage(props) {
             <FullPageNotFoundView
                 shouldShow={(_.isEmpty(props.policy) && !props.isLoadingReportData) || !PolicyUtils.isPolicyAdmin(props.policy) || PolicyUtils.isPendingDeletePolicy(props.policy)}
                 subtitleKey={_.isEmpty(props.policy) ? undefined : 'workspace.common.notAuthorized'}
-                onBackButtonPress={goBack}
-                onLinkPress={goBack}
+                onBackButtonPress={PolicyUtils.goBackFromInvalidPolicy}
+                onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
             >
                 <HeaderWithBackButton
                     title={props.translate('workspace.common.members')}
diff --git a/src/pages/workspace/WorkspaceOverviewCurrencyPage.js b/src/pages/workspace/WorkspaceOverviewCurrencyPage.js
index 31b88c7c487b..a25f6d4ece13 100644
--- a/src/pages/workspace/WorkspaceOverviewCurrencyPage.js
+++ b/src/pages/workspace/WorkspaceOverviewCurrencyPage.js
@@ -12,7 +12,6 @@ import Navigation from '@libs/Navigation/Navigation';
 import * as PolicyUtils from '@libs/PolicyUtils';
 import * as Policy from '@userActions/Policy';
 import ONYXKEYS from '@src/ONYXKEYS';
-import ROUTES from '@src/ROUTES';
 import {policyDefaultProps, policyPropTypes} from './withPolicy';
 import withPolicyAndFullscreenLoading from './withPolicyAndFullscreenLoading';
 
@@ -79,7 +78,8 @@ function WorkspaceSettingsCurrencyPage({currencyList, policy, isLoadingReportDat
             testID={WorkspaceSettingsCurrencyPage.displayName}
         >
             <FullPageNotFoundView
-                onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_WORKSPACES)}
+                onBackButtonPress={PolicyUtils.goBackFromInvalidPolicy}
+                onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
                 shouldShow={(_.isEmpty(policy) && !isLoadingReportData) || !PolicyUtils.isPolicyAdmin(policy) || PolicyUtils.isPendingDeletePolicy(policy)}
                 subtitleKey={_.isEmpty(policy) ? undefined : 'workspace.common.notAuthorized'}
             >
diff --git a/src/pages/workspace/WorkspacePageWithSections.tsx b/src/pages/workspace/WorkspacePageWithSections.tsx
index 70198f38f18c..f6b71448a58b 100644
--- a/src/pages/workspace/WorkspacePageWithSections.tsx
+++ b/src/pages/workspace/WorkspacePageWithSections.tsx
@@ -113,13 +113,6 @@ function WorkspacePageWithSections({
     const {isSmallScreenWidth} = useWindowDimensions();
     const firstRender = useRef(true);
 
-    const goBack = () => {
-        Navigation.goBack(ROUTES.SETTINGS_WORKSPACES);
-
-        // Needed when workspace with given policyID does not exist
-        Navigation.navigateWithSwitchPolicyID({route: ROUTES.ALL_SETTINGS});
-    };
-
     useEffect(() => {
         // Because isLoading is false before merging in Onyx, we need firstRender ref to display loading page as well before isLoading is change to true
         firstRender.current = false;
@@ -147,8 +140,8 @@ function WorkspacePageWithSections({
             shouldShowOfflineIndicatorInWideScreen={shouldShowOfflineIndicatorInWideScreen && !shouldShow}
         >
             <FullPageNotFoundView
-                onBackButtonPress={goBack}
-                onLinkPress={goBack}
+                onBackButtonPress={PolicyUtils.goBackFromInvalidPolicy}
+                onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
                 shouldShow={shouldShow}
                 subtitleKey={isEmptyObject(policy) ? undefined : 'workspace.common.notAuthorized'}
                 shouldForceFullScreen

From 9a5baefe86874a0db526f5c922e746f88470eba4 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Thu, 8 Feb 2024 10:54:20 -0500
Subject: [PATCH 087/305] Update ReportActionsUtils, ReportUtils, and
 TransactionUtils types

---
 src/libs/ReportActionsUtils.ts | 15 +++++++++------
 src/libs/ReportUtils.ts        |  4 ++--
 src/libs/TransactionUtils.ts   |  6 ++++--
 3 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/src/libs/ReportActionsUtils.ts b/src/libs/ReportActionsUtils.ts
index 1aeb6e6e7343..f48f843a41bc 100644
--- a/src/libs/ReportActionsUtils.ts
+++ b/src/libs/ReportActionsUtils.ts
@@ -6,7 +6,7 @@ import Onyx from 'react-native-onyx';
 import type {ValueOf} from 'type-fest';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
-import type {ActionName, ChangeLog, OriginalMessageReimbursementDequeued} from '@src/types/onyx/OriginalMessage';
+import type {ActionName, ChangeLog, IOUMessage, OriginalMessageReimbursementDequeued} from '@src/types/onyx/OriginalMessage';
 import type Report from '@src/types/onyx/Report';
 import type {Message, ReportActionBase, ReportActions} from '@src/types/onyx/ReportAction';
 import type ReportAction from '@src/types/onyx/ReportAction';
@@ -19,6 +19,7 @@ import * as Localize from './Localize';
 import Log from './Log';
 import type {MessageElementBase, MessageTextElement} from './MessageElement';
 import * as PersonalDetailsUtils from './PersonalDetailsUtils';
+import type {OptimisticIOUReportAction} from './ReportUtils';
 
 type LastVisibleMessage = {
     lastMessageTranslationKey?: string;
@@ -80,7 +81,7 @@ function isCreatedAction(reportAction: OnyxEntry<ReportAction>): boolean {
     return reportAction?.actionName === CONST.REPORT.ACTIONS.TYPE.CREATED;
 }
 
-function isDeletedAction(reportAction: OnyxEntry<ReportAction>): boolean {
+function isDeletedAction(reportAction: OnyxEntry<ReportAction | OptimisticIOUReportAction>): boolean {
     // A deleted comment has either an empty array or an object with html field with empty string as value
     const message = reportAction?.message ?? [];
     return message.length === 0 || message[0]?.html === '';
@@ -90,8 +91,8 @@ function isDeletedParentAction(reportAction: OnyxEntry<ReportAction>): boolean {
     return (reportAction?.message?.[0]?.isDeletedParentAction ?? false) && (reportAction?.childVisibleActionCount ?? 0) > 0;
 }
 
-function isReversedTransaction(reportAction: OnyxEntry<ReportAction>) {
-    return (reportAction?.message?.[0]?.isReversedTransaction ?? false) && (reportAction?.childVisibleActionCount ?? 0) > 0;
+function isReversedTransaction(reportAction: OnyxEntry<ReportAction | OptimisticIOUReportAction>) {
+    return (reportAction?.message?.[0]?.isReversedTransaction ?? false) && ((reportAction as ReportAction)?.childVisibleActionCount ?? 0) > 0;
 }
 
 function isPendingRemove(reportAction: OnyxEntry<ReportAction> | EmptyObject): boolean {
@@ -161,9 +162,11 @@ function getParentReportAction(report: OnyxEntry<Report> | EmptyObject): ReportA
 /**
  * Determines if the given report action is sent money report action by checking for 'pay' type and presence of IOUDetails object.
  */
-function isSentMoneyReportAction(reportAction: OnyxEntry<ReportAction>): boolean {
+function isSentMoneyReportAction(reportAction: OnyxEntry<ReportAction | OptimisticIOUReportAction>): boolean {
     return (
-        reportAction?.actionName === CONST.REPORT.ACTIONS.TYPE.IOU && reportAction?.originalMessage?.type === CONST.IOU.REPORT_ACTION_TYPE.PAY && !!reportAction?.originalMessage?.IOUDetails
+        reportAction?.actionName === CONST.REPORT.ACTIONS.TYPE.IOU &&
+        (reportAction?.originalMessage as IOUMessage)?.type === CONST.IOU.REPORT_ACTION_TYPE.PAY &&
+        !!(reportAction?.originalMessage as IOUMessage)?.IOUDetails
     );
 }
 
diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index a15943210a14..9fff1399593e 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -2171,7 +2171,7 @@ function hasMissingSmartscanFields(iouReportID: string): boolean {
 /**
  * Given a parent IOU report action get report name for the LHN.
  */
-function getTransactionReportName(reportAction: OnyxEntry<ReportAction>): string {
+function getTransactionReportName(reportAction: OnyxEntry<ReportAction | OptimisticIOUReportAction>): string {
     if (ReportActionsUtils.isReversedTransaction(reportAction)) {
         return Localize.translateLocal('parentReportAction.reversedTransaction');
     }
@@ -3540,7 +3540,7 @@ function buildOptimisticTaskReport(
  *
  * @param moneyRequestReportID - the reportID which the report action belong to
  */
-function buildTransactionThread(reportAction: OnyxEntry<ReportAction>, moneyRequestReportID: string): OptimisticChatReport {
+function buildTransactionThread(reportAction: OnyxEntry<ReportAction | OptimisticIOUReportAction>, moneyRequestReportID: string): OptimisticChatReport {
     const participantAccountIDs = [...new Set([currentUserAccountID, Number(reportAction?.actorAccountID)])].filter(Boolean) as number[];
     return buildOptimisticChatReport(
         participantAccountIDs,
diff --git a/src/libs/TransactionUtils.ts b/src/libs/TransactionUtils.ts
index 8a814f311481..33ca06d7f122 100644
--- a/src/libs/TransactionUtils.ts
+++ b/src/libs/TransactionUtils.ts
@@ -5,12 +5,14 @@ import type {ValueOf} from 'type-fest';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type {RecentWaypoint, Report, ReportAction, Transaction, TransactionViolation} from '@src/types/onyx';
+import type {IOUMessage} from '@src/types/onyx/OriginalMessage';
 import type {PolicyTaxRate, PolicyTaxRates} from '@src/types/onyx/PolicyTaxRates';
 import type {Comment, Receipt, TransactionChanges, Waypoint, WaypointCollection} from '@src/types/onyx/Transaction';
 import type {EmptyObject} from '@src/types/utils/EmptyObject';
 import {isCorporateCard, isExpensifyCard} from './CardUtils';
 import DateUtils from './DateUtils';
 import * as NumberUtils from './NumberUtils';
+import type {OptimisticIOUReportAction} from './ReportUtils';
 
 let allTransactions: OnyxCollection<Transaction> = {};
 
@@ -448,11 +450,11 @@ function hasRoute(transaction: Transaction): boolean {
  *
  * @deprecated Use Onyx.connect() or withOnyx() instead
  */
-function getLinkedTransaction(reportAction: OnyxEntry<ReportAction>): Transaction | EmptyObject {
+function getLinkedTransaction(reportAction: OnyxEntry<ReportAction | OptimisticIOUReportAction>): Transaction | EmptyObject {
     let transactionID = '';
 
     if (reportAction?.actionName === CONST.REPORT.ACTIONS.TYPE.IOU) {
-        transactionID = reportAction.originalMessage?.IOUTransactionID ?? '';
+        transactionID = (reportAction?.originalMessage as IOUMessage)?.IOUTransactionID ?? '';
     }
 
     return allTransactions?.[`${ONYXKEYS.COLLECTION.TRANSACTION}${transactionID}`] ?? {};

From 916d6989324ff9d14802c1faaf36a4a1a1dd2baf Mon Sep 17 00:00:00 2001
From: someone-here <eshgupta1217@gmail.com>
Date: Thu, 8 Feb 2024 21:44:57 +0530
Subject: [PATCH 088/305] Fix workspace switcher creating new workspace

---
 src/pages/WorkspaceSwitcherPage.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/pages/WorkspaceSwitcherPage.tsx b/src/pages/WorkspaceSwitcherPage.tsx
index 4b464777b534..a6b354a94857 100644
--- a/src/pages/WorkspaceSwitcherPage.tsx
+++ b/src/pages/WorkspaceSwitcherPage.tsx
@@ -216,6 +216,7 @@ function WorkspaceSwitcherPage({policies}: WorkspaceSwitcherPageProps) {
                         accessible={false}
                         role={CONST.ROLE.BUTTON}
                         onPress={() => {
+                            Navigation.goBack();
                             App.createWorkspaceWithPolicyDraftAndNavigateToIt();
                         }}
                     >

From dcd132f3cff066a3004413595f04ad1f36ac31d4 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 8 Feb 2024 16:41:55 -0800
Subject: [PATCH 089/305] Make textinput uncontrolled for better performance on
 android, remove outdated comment

---
 src/components/TextInput/BaseTextInput/types.ts          | 4 ----
 src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx | 1 -
 2 files changed, 5 deletions(-)

diff --git a/src/components/TextInput/BaseTextInput/types.ts b/src/components/TextInput/BaseTextInput/types.ts
index a637dc22d72e..d852d83220f5 100644
--- a/src/components/TextInput/BaseTextInput/types.ts
+++ b/src/components/TextInput/BaseTextInput/types.ts
@@ -51,15 +51,11 @@ type CustomBaseTextInputProps = {
 
     /**
      * Autogrow input container length based on the entered text.
-     * Note: If you use this prop, the text input has to be controlled
-     * by a value prop.
      */
     autoGrow?: boolean;
 
     /**
      * Autogrow input container height based on the entered text
-     * Note: If you use this prop, the text input has to be controlled
-     * by a value prop.
      */
     autoGrowHeight?: boolean;
 
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index be9efe3adf2b..0b4b949cb224 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -123,7 +123,6 @@ function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePagePr
                                 }
                                 updateMultilineInputRange(el);
                             }}
-                            value={draftResponse}
                             containerStyles={[baseResponseInputContainerStyle, StyleUtils.getMaximumHeight(responseInputMaxHeight)]}
                             shouldSaveDraft
                         />

From 57fdf9464c4de48e95e55c2c54801b4ca4b5164d Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 8 Feb 2024 16:57:35 -0800
Subject: [PATCH 090/305] Fix offline icon on mobile

---
 src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index c7d8885c1944..80834a683f2c 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -2,6 +2,7 @@ import React from 'react';
 import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
+import Icon from '@components//Icon';
 import Button from '@components/Button';
 import FixedFooter from '@components/FixedFooter';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
@@ -12,6 +13,7 @@ import useLocalize from '@hooks/useLocalize';
 import useNetwork from '@hooks/useNetwork';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
+import variables from '@styles/variables';
 import * as ExitSurvey from '@userActions/ExitSurvey';
 import type {ExitReason} from '@userActions/ExitSurvey';
 import * as Link from '@userActions/Link';
@@ -39,7 +41,11 @@ function ExitSurveyConfirmPage({exitReason, isLoading}: ExitSurveyConfirmPageOny
             {isOffline && <ExitSurveyOffline />}
             {!isOffline && (
                 <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter, styles.p5]}>
-                    <MushroomTopHat />
+                    <Icon
+                        src={MushroomTopHat}
+                        width={variables.modalTopIconWidth}
+                        height={variables.modalTopIconHeight}
+                    />
                     <Text style={[styles.headerAnonymousFooter, styles.mt5]}>{translate('exitSurvey.thankYou')}</Text>
                     <Text style={[styles.mt2]}>{translate('exitSurvey.thankYouSubtitle')}</Text>
                 </View>

From 13cd0e5ef6555cf53738fede80356b97c613a8c9 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 8 Feb 2024 16:57:46 -0800
Subject: [PATCH 091/305] Add padding to offline view

---
 src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx b/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx
index a02ee48d1943..2e89036f62b4 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx
@@ -11,7 +11,7 @@ function ExitSurveyOffline() {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     return (
-        <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter]}>
+        <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter, styles.p5]}>
             <Icon
                 width={variables.modalTopIconWidth}
                 height={variables.modalTopIconHeight}

From f0091e4155bfc097f83bd214cb0fde0cd6594141 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 8 Feb 2024 17:11:45 -0800
Subject: [PATCH 092/305] Fix offline and mushroomtophat styles

---
 .../ExitSurvey/ExitSurveyConfirmPage.tsx      | 26 ++++++++++---------
 .../settings/ExitSurvey/ExitSurveyOffline.tsx |  2 +-
 src/styles/variables.ts                       |  3 +++
 3 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index 80834a683f2c..a813a05bff5d 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -38,18 +38,20 @@ function ExitSurveyConfirmPage({exitReason, isLoading}: ExitSurveyConfirmPageOny
                 title={translate('exitSurvey.header')}
                 onBackButtonPress={() => Navigation.goBack(exitReason ? ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(exitReason, ROUTES.SETTINGS_EXIT_SURVEY_REASON) : undefined)}
             />
-            {isOffline && <ExitSurveyOffline />}
-            {!isOffline && (
-                <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter, styles.p5]}>
-                    <Icon
-                        src={MushroomTopHat}
-                        width={variables.modalTopIconWidth}
-                        height={variables.modalTopIconHeight}
-                    />
-                    <Text style={[styles.headerAnonymousFooter, styles.mt5]}>{translate('exitSurvey.thankYou')}</Text>
-                    <Text style={[styles.mt2]}>{translate('exitSurvey.thankYouSubtitle')}</Text>
-                </View>
-            )}
+            <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter, styles.mh5]}>
+                {isOffline && <ExitSurveyOffline />}
+                {!isOffline && (
+                    <>
+                        <Icon
+                            src={MushroomTopHat}
+                            width={variables.mushroomTopHatWidth}
+                            height={variables.mushroomTopHatHeight}
+                        />
+                        <Text style={[styles.headerAnonymousFooter, styles.mt5]}>{translate('exitSurvey.thankYou')}</Text>
+                        <Text style={[styles.mt2]}>{translate('exitSurvey.thankYouSubtitle')}</Text>
+                    </>
+                )}
+            </View>
             <FixedFooter>
                 <Button
                     success
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx b/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx
index 2e89036f62b4..a02ee48d1943 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx
@@ -11,7 +11,7 @@ function ExitSurveyOffline() {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     return (
-        <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter, styles.p5]}>
+        <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter]}>
             <Icon
                 width={variables.modalTopIconWidth}
                 height={variables.modalTopIconHeight}
diff --git a/src/styles/variables.ts b/src/styles/variables.ts
index c6d2bebe1417..f450a185a978 100644
--- a/src/styles/variables.ts
+++ b/src/styles/variables.ts
@@ -214,4 +214,7 @@ export default {
     updateAnimationH: 240,
     updateTextViewContainerWidth: 310,
     updateViewHeaderHeight: 70,
+
+    mushroomTopHatWidth: 138,
+    mushroomTopHatHeight: 128,
 } as const;

From adbae00022083ca08e99e4d41532597a3cef892d Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 8 Feb 2024 18:00:39 -0800
Subject: [PATCH 093/305] Fix lockfiles after merge

---
 ios/Podfile.lock  |  2 +-
 package-lock.json | 43 ++++++++++++++++++++++++++++---------------
 2 files changed, 29 insertions(+), 16 deletions(-)

diff --git a/ios/Podfile.lock b/ios/Podfile.lock
index 1664c982ce50..5b66969747c1 100644
--- a/ios/Podfile.lock
+++ b/ios/Podfile.lock
@@ -1981,7 +1981,7 @@ SPEC CHECKSUMS:
   SocketRocket: f32cd54efbe0f095c4d7594881e52619cfe80b17
   Turf: 13d1a92d969ca0311bbc26e8356cca178ce95da2
   VisionCamera: fda554d8751e395effcc87749f8b7c198c1031be
-  Yoga: 13c8ef87792450193e117976337b8527b49e8c03
+  Yoga: e64aa65de36c0832d04e8c7bd614396c77a80047
 
 PODFILE CHECKSUM: 0ccbb4f2406893c6e9f266dc1e7470dcd72885d2
 
diff --git a/package-lock.json b/package-lock.json
index eaf3aba67c85..1b3b96cf318c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -96,7 +96,7 @@
         "react-native-linear-gradient": "^2.8.1",
         "react-native-localize": "^2.2.6",
         "react-native-modal": "^13.0.0",
-        "react-native-onyx": "2.0.2",
+        "react-native-onyx": "2.0.4",
         "react-native-pager-view": "6.2.2",
         "react-native-pdf": "6.7.3",
         "react-native-performance": "^5.1.0",
@@ -233,7 +233,7 @@
         "style-loader": "^2.0.0",
         "time-analytics-webpack-plugin": "^0.1.17",
         "ts-node": "^10.9.2",
-        "type-fest": "^3.12.0",
+        "type-fest": "^4.10.2",
         "typescript": "^5.3.2",
         "wait-port": "^0.2.9",
         "webpack": "^5.76.0",
@@ -8133,9 +8133,9 @@
       }
     },
     "node_modules/@pmmmwh/react-refresh-webpack-plugin": {
-      "version": "0.5.10",
-      "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.10.tgz",
-      "integrity": "sha512-j0Ya0hCFZPd4x40qLzbhGsh9TMtdb+CJQiso+WxLOPNasohq9cc5SNUcwsZaRH6++Xh91Xkm/xHCkuIiIu0LUA==",
+      "version": "0.5.11",
+      "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.11.tgz",
+      "integrity": "sha512-7j/6vdTym0+qZ6u4XbSAxrWBGYSdCfTzySkj7WAFgDLmSyWlOrWvpyzxlFh5jtw9dn0oL/jtW+06XfFiisN3JQ==",
       "dev": true,
       "dependencies": {
         "ansi-html-community": "^0.0.8",
@@ -8155,7 +8155,7 @@
         "@types/webpack": "4.x || 5.x",
         "react-refresh": ">=0.10.0 <1.0.0",
         "sockjs-client": "^1.4.0",
-        "type-fest": ">=0.17.0 <4.0.0",
+        "type-fest": ">=0.17.0 <5.0.0",
         "webpack": ">=4.43.0 <6.0.0",
         "webpack-dev-server": "3.x || 4.x",
         "webpack-hot-middleware": "2.x",
@@ -26846,10 +26846,11 @@
       }
     },
     "node_modules/core-js-pure": {
-      "version": "3.24.1",
+      "version": "3.35.1",
+      "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.35.1.tgz",
+      "integrity": "sha512-zcIdi/CL3MWbBJYo5YCeVAAx+Sy9yJE9I3/u9LkFABwbeaPhTMRWraM8mYFp9jW5Z50hOy7FVzCc8dCrpZqtIQ==",
       "dev": true,
       "hasInstallScript": true,
-      "license": "MIT",
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/core-js"
@@ -38585,6 +38586,17 @@
         "node": ">=8"
       }
     },
+    "node_modules/jest-watch-typeahead/node_modules/type-fest": {
+      "version": "3.13.1",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-3.13.1.tgz",
+      "integrity": "sha512-tLq3bSNx+xSpwvAJnzrK0Ep5CLNWjvFTOp71URMaAEWBfRb9nnJiBoUe0tF8bI4ZFO3omgBR6NvnbzVUT3Ly4g==",
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/jest-watcher": {
       "version": "29.4.1",
       "license": "MIT",
@@ -45112,9 +45124,9 @@
       }
     },
     "node_modules/react-native-onyx": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/react-native-onyx/-/react-native-onyx-2.0.2.tgz",
-      "integrity": "sha512-24kcG3ChBXp+uSSCXudFvZTdCnKLRHQRgvTcnh2eA7COtKvbL8ggEJNkglSYmcf5WoDzLgYyWiKvcjcXQnmBvw==",
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/react-native-onyx/-/react-native-onyx-2.0.4.tgz",
+      "integrity": "sha512-QpeqqpvH4XGTWgPK4qJ6NoBvHDXFWtbLOuGBN7iqd3RVFx+juxgiuaf+Zr0GEpR2P40vsX5IA0m1SiAotvzbmA==",
       "dependencies": {
         "ascii-table": "0.0.9",
         "fast-equals": "^4.0.3",
@@ -50784,11 +50796,12 @@
       }
     },
     "node_modules/type-fest": {
-      "version": "3.13.1",
-      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-3.13.1.tgz",
-      "integrity": "sha512-tLq3bSNx+xSpwvAJnzrK0Ep5CLNWjvFTOp71URMaAEWBfRb9nnJiBoUe0tF8bI4ZFO3omgBR6NvnbzVUT3Ly4g==",
+      "version": "4.10.2",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.10.2.tgz",
+      "integrity": "sha512-anpAG63wSpdEbLwOqH8L84urkL6PiVIov3EMmgIhhThevh9aiMQov+6Btx0wldNcvm4wV+e2/Rt1QdDwKHFbHw==",
+      "dev": true,
       "engines": {
-        "node": ">=14.16"
+        "node": ">=16"
       },
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"

From e3ac42d4b13785c38cd4aef41974d392806025a8 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Thu, 8 Feb 2024 23:03:07 -0800
Subject: [PATCH 094/305] Center align text on offline and confirm page

---
 src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx | 4 ++--
 src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx     | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index a813a05bff5d..042cbe284bb5 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -47,8 +47,8 @@ function ExitSurveyConfirmPage({exitReason, isLoading}: ExitSurveyConfirmPageOny
                             width={variables.mushroomTopHatWidth}
                             height={variables.mushroomTopHatHeight}
                         />
-                        <Text style={[styles.headerAnonymousFooter, styles.mt5]}>{translate('exitSurvey.thankYou')}</Text>
-                        <Text style={[styles.mt2]}>{translate('exitSurvey.thankYouSubtitle')}</Text>
+                        <Text style={[styles.headerAnonymousFooter, styles.mt5, styles.textAlignCenter]}>{translate('exitSurvey.thankYou')}</Text>
+                        <Text style={[styles.mt2, styles.textAlignCenter]}>{translate('exitSurvey.thankYouSubtitle')}</Text>
                     </>
                 )}
             </View>
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx b/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx
index a02ee48d1943..3363867ad4bb 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyOffline.tsx
@@ -17,8 +17,8 @@ function ExitSurveyOffline() {
                 height={variables.modalTopIconHeight}
                 src={ToddBehindCloud}
             />
-            <Text style={styles.headerAnonymousFooter}>{translate('exitSurvey.offlineTitle')}</Text>
-            <Text style={styles.mt2}>{translate('exitSurvey.offline')}</Text>
+            <Text style={[styles.headerAnonymousFooter, styles.textAlignCenter]}>{translate('exitSurvey.offlineTitle')}</Text>
+            <Text style={[styles.mt2, styles.textAlignCenter]}>{translate('exitSurvey.offline')}</Text>
         </View>
     );
 }

From 80fc188d03f0b55da33f46a9eedcd0d2b9c8dccd Mon Sep 17 00:00:00 2001
From: Yauheni Pasiukevich <pasyukevich@live.com>
Date: Mon, 5 Feb 2024 19:30:42 +0100
Subject: [PATCH 095/305] [TS migration] Migrate 'AvatarWithImagePicker.js'
 component to TypeScript

---
 ...agePicker.js => AvatarWithImagePicker.tsx} | 187 +++++++-----------
 src/components/PopoverMenu.tsx                |   2 +-
 2 files changed, 77 insertions(+), 112 deletions(-)
 rename src/components/{AvatarWithImagePicker.js => AvatarWithImagePicker.tsx} (77%)

diff --git a/src/components/AvatarWithImagePicker.js b/src/components/AvatarWithImagePicker.tsx
similarity index 77%
rename from src/components/AvatarWithImagePicker.js
rename to src/components/AvatarWithImagePicker.tsx
index f55db3dd0620..b96349bdcd85 100644
--- a/src/components/AvatarWithImagePicker.js
+++ b/src/components/AvatarWithImagePicker.tsx
@@ -1,8 +1,6 @@
-import lodashGet from 'lodash/get';
-import PropTypes from 'prop-types';
 import React, {useEffect, useRef, useState} from 'react';
 import {StyleSheet, View} from 'react-native';
-import _ from 'underscore';
+import type {StyleProp, ViewStyle} from 'react-native';
 import useLocalize from '@hooks/useLocalize';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
@@ -10,9 +8,12 @@ import useWindowDimensions from '@hooks/useWindowDimensions';
 import * as Browser from '@libs/Browser';
 import * as FileUtils from '@libs/fileDownload/FileUtils';
 import getImageResolution from '@libs/fileDownload/getImageResolution';
-import stylePropTypes from '@styles/stylePropTypes';
+import type {AvatarSource} from '@libs/UserUtils';
 import variables from '@styles/variables';
 import CONST from '@src/CONST';
+import type {TranslationPaths} from '@src/languages/types';
+import type * as OnyxCommon from '@src/types/onyx/OnyxCommon';
+import type IconAsset from '@src/types/utils/IconAsset';
 import AttachmentModal from './AttachmentModal';
 import AttachmentPicker from './AttachmentPicker';
 import Avatar from './Avatar';
@@ -20,162 +21,136 @@ import AvatarCropModal from './AvatarCropModal/AvatarCropModal';
 import DotIndicatorMessage from './DotIndicatorMessage';
 import Icon from './Icon';
 import * as Expensicons from './Icon/Expensicons';
-import sourcePropTypes from './Image/sourcePropTypes';
 import OfflineWithFeedback from './OfflineWithFeedback';
 import PopoverMenu from './PopoverMenu';
 import PressableWithoutFeedback from './Pressable/PressableWithoutFeedback';
 import Tooltip from './Tooltip';
 import withNavigationFocus from './withNavigationFocus';
 
-const propTypes = {
+type ErrorData = {
+    validationError?: TranslationPaths | null | '';
+    phraseParam: Record<string, unknown>;
+};
+
+type OpenPickerParams = {
+    onPicked: (image: File) => void;
+};
+type OpenPicker = (args: OpenPickerParams) => void;
+
+type MenuItem = {
+    icon: IconAsset;
+    text: string;
+    onSelected: () => void;
+};
+
+type AvatarWithImagePickerProps = {
     /** Avatar source to display */
-    source: PropTypes.oneOfType([PropTypes.string, sourcePropTypes]),
+    source?: AvatarSource;
 
     /** Additional style props */
-    style: stylePropTypes,
+    style?: StyleProp<ViewStyle>;
 
     /** Additional style props for disabled picker */
-    disabledStyle: stylePropTypes,
+    disabledStyle?: StyleProp<ViewStyle>;
 
     /** Executed once an image has been selected */
-    onImageSelected: PropTypes.func,
+    onImageSelected?: () => void;
 
     /** Execute when the user taps "remove" */
-    onImageRemoved: PropTypes.func,
+    onImageRemoved?: () => void;
 
     /** A default avatar component to display when there is no source */
-    DefaultAvatar: PropTypes.func,
+    DefaultAvatar?: () => React.ReactNode;
 
     /** Whether we are using the default avatar */
-    isUsingDefaultAvatar: PropTypes.bool,
+    isUsingDefaultAvatar?: boolean;
 
     /** Size of Indicator */
-    size: PropTypes.oneOf([CONST.AVATAR_SIZE.XLARGE, CONST.AVATAR_SIZE.LARGE, CONST.AVATAR_SIZE.DEFAULT]),
+    size?: typeof CONST.AVATAR_SIZE.XLARGE | typeof CONST.AVATAR_SIZE.LARGE | typeof CONST.AVATAR_SIZE.DEFAULT;
 
     /** A fallback avatar icon to display when there is an error on loading avatar from remote URL. */
-    fallbackIcon: sourcePropTypes,
+    fallbackIcon?: AvatarSource;
 
     /** Denotes whether it is an avatar or a workspace avatar */
-    type: PropTypes.oneOf([CONST.ICON_TYPE_AVATAR, CONST.ICON_TYPE_WORKSPACE]),
+    type?: typeof CONST.ICON_TYPE_AVATAR | typeof CONST.ICON_TYPE_WORKSPACE;
 
     /** Image crop vector mask */
-    editorMaskImage: sourcePropTypes,
+    editorMaskImage?: IconAsset;
 
     /** Additional style object for the error row */
-    errorRowStyles: stylePropTypes,
+    errorRowStyles?: StyleProp<ViewStyle>;
 
     /** A function to run when the X button next to the error is clicked */
-    onErrorClose: PropTypes.func,
+    onErrorClose?: () => void;
 
     /** The type of action that's pending  */
-    pendingAction: PropTypes.oneOf(['add', 'update', 'delete']),
+    pendingAction?: OnyxCommon.PendingAction;
 
     /** The errors to display  */
-    // eslint-disable-next-line react/forbid-prop-types
-    errors: PropTypes.object,
+    errors?: OnyxCommon.Errors;
 
     /** Title for avatar preview modal */
-    headerTitle: PropTypes.string,
+    headerTitle?: string;
 
     /** Avatar source for avatar preview modal */
-    previewSource: PropTypes.oneOfType([PropTypes.string, sourcePropTypes]),
+    previewSource?: AvatarSource;
 
     /** File name of the avatar */
-    originalFileName: PropTypes.string,
+    originalFileName?: string;
 
     /** Whether navigation is focused */
-    isFocused: PropTypes.bool.isRequired,
+    isFocused: boolean;
 
     /** Style applied to the avatar */
-    avatarStyle: stylePropTypes.isRequired,
+    avatarStyle: StyleProp<ViewStyle>;
 
     /** Indicates if picker feature should be disabled */
-    disabled: PropTypes.bool,
+    disabled?: boolean;
 
     /** Executed once click on view photo option */
-    onViewPhotoPress: PropTypes.func,
-
-    /** Where the popover should be positioned relative to the anchor points. */
-    anchorAlignment: PropTypes.shape({
-        horizontal: PropTypes.oneOf(_.values(CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL)),
-        vertical: PropTypes.oneOf(_.values(CONST.MODAL.ANCHOR_ORIGIN_VERTICAL)),
-    }),
-};
-
-const defaultProps = {
-    source: '',
-    onImageSelected: () => {},
-    onImageRemoved: () => {},
-    style: [],
-    disabledStyle: [],
-    DefaultAvatar: () => {},
-    isUsingDefaultAvatar: false,
-    size: CONST.AVATAR_SIZE.DEFAULT,
-    fallbackIcon: Expensicons.FallbackAvatar,
-    type: CONST.ICON_TYPE_AVATAR,
-    editorMaskImage: undefined,
-    errorRowStyles: [],
-    onErrorClose: () => {},
-    pendingAction: null,
-    errors: null,
-    headerTitle: '',
-    previewSource: '',
-    originalFileName: '',
-    disabled: false,
-    onViewPhotoPress: undefined,
-    anchorAlignment: {
-        horizontal: CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.LEFT,
-        vertical: CONST.MODAL.ANCHOR_ORIGIN_VERTICAL.TOP,
-    },
+    onViewPhotoPress?: () => void;
 };
 
 function AvatarWithImagePicker({
     isFocused,
-    DefaultAvatar,
+    DefaultAvatar = () => null,
     style,
     disabledStyle,
     pendingAction,
     errors,
     errorRowStyles,
-    onErrorClose,
-    source,
-    fallbackIcon,
-    size,
-    type,
-    headerTitle,
-    previewSource,
-    originalFileName,
-    isUsingDefaultAvatar,
-    onImageRemoved,
-    onImageSelected,
+    onErrorClose = () => {},
+    source = '',
+    fallbackIcon = Expensicons.FallbackAvatar,
+    size = CONST.AVATAR_SIZE.DEFAULT,
+    type = CONST.ICON_TYPE_AVATAR,
+    headerTitle = '',
+    previewSource = '',
+    originalFileName = '',
+    isUsingDefaultAvatar = false,
+    onImageSelected = () => {},
+    onImageRemoved = () => {},
     editorMaskImage,
     avatarStyle,
-    disabled,
+    disabled = false,
     onViewPhotoPress,
-}) {
+}: AvatarWithImagePickerProps) {
     const theme = useTheme();
     const styles = useThemeStyles();
     const {windowWidth} = useWindowDimensions();
     const [popoverPosition, setPopoverPosition] = useState({horizontal: 0, vertical: 0});
     const [isMenuVisible, setIsMenuVisible] = useState(false);
-    const [errorData, setErrorData] = useState({
-        validationError: null,
-        phraseParam: {},
-    });
+    const [errorData, setErrorData] = useState<ErrorData>({validationError: null, phraseParam: {}});
     const [isAvatarCropModalOpen, setIsAvatarCropModalOpen] = useState(false);
     const [imageData, setImageData] = useState({
         uri: '',
         name: '',
         type: '',
     });
-    const anchorRef = useRef();
+    const anchorRef = useRef<View>(null);
     const {translate} = useLocalize();
 
-    /**
-     * @param {String} error
-     * @param {Object} phraseParam
-     */
-    const setError = (error, phraseParam) => {
+    const setError = (error: TranslationPaths | null, phraseParam: Record<string, unknown>) => {
         setErrorData({
             validationError: error,
             phraseParam,
@@ -193,40 +168,29 @@ function AvatarWithImagePicker({
 
     /**
      * Check if the attachment extension is allowed.
-     *
-     * @param {Object} image
-     * @returns {Boolean}
      */
-    const isValidExtension = (image) => {
-        const {fileExtension} = FileUtils.splitExtensionFromFileName(lodashGet(image, 'name', ''));
-        return _.contains(CONST.AVATAR_ALLOWED_EXTENSIONS, fileExtension.toLowerCase());
+    const isValidExtension = (image: File): boolean => {
+        const {fileExtension} = FileUtils.splitExtensionFromFileName(image?.name ?? '');
+        return CONST.AVATAR_ALLOWED_EXTENSIONS.some((extension) => extension === fileExtension.toLowerCase());
     };
 
     /**
      * Check if the attachment size is less than allowed size.
-     *
-     * @param {Object} image
-     * @returns {Boolean}
      */
-    const isValidSize = (image) => image && lodashGet(image, 'size', 0) < CONST.AVATAR_MAX_ATTACHMENT_SIZE;
+    const isValidSize = (image: File): boolean => (image?.size ?? 0) < CONST.AVATAR_MAX_ATTACHMENT_SIZE;
 
     /**
      * Check if the attachment resolution matches constraints.
-     *
-     * @param {Object} image
-     * @returns {Promise}
      */
-    const isValidResolution = (image) =>
+    const isValidResolution = (image: File): Promise<boolean> =>
         getImageResolution(image).then(
             ({height, width}) => height >= CONST.AVATAR_MIN_HEIGHT_PX && width >= CONST.AVATAR_MIN_WIDTH_PX && height <= CONST.AVATAR_MAX_HEIGHT_PX && width <= CONST.AVATAR_MAX_WIDTH_PX,
         );
 
     /**
      * Validates if an image has a valid resolution and opens an avatar crop modal
-     *
-     * @param {Object} image
      */
-    const showAvatarCropModal = (image) => {
+    const showAvatarCropModal = (image: File) => {
         if (!isValidExtension(image)) {
             setError('avatarWithImagePicker.notAllowedExtension', {allowedExtensions: CONST.AVATAR_ALLOWED_EXTENSIONS});
             return;
@@ -264,11 +228,8 @@ function AvatarWithImagePicker({
 
     /**
      * Create menu items list for avatar menu
-     *
-     * @param {Function} openPicker
-     * @returns {Array}
      */
-    const createMenuItems = (openPicker) => {
+    const createMenuItems = (openPicker: OpenPicker): MenuItem[] => {
         const menuItems = [
             {
                 icon: Expensicons.Upload,
@@ -313,6 +274,7 @@ function AvatarWithImagePicker({
                 vertical: y + height + variables.spacing2,
             });
         });
+
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [isMenuVisible, windowWidth]);
 
@@ -372,7 +334,11 @@ function AvatarWithImagePicker({
                     maybeIcon={isUsingDefaultAvatar}
                 >
                     {({show}) => (
-                        <AttachmentPicker type={CONST.ATTACHMENT_PICKER_TYPE.IMAGE}>
+                        <AttachmentPicker
+                            // @ts-expect-error TODO: Remove this once AttachmentPicker (https://github.com/Expensify/App/issues/25134) is migrated to TypeScript.
+                            type={CONST.ATTACHMENT_PICKER_TYPE.IMAGE}
+                        >
+                            {/* @ts-expect-error TODO: Remove this once AttachmentPicker (https://github.com/Expensify/App/issues/25134) is migrated to TypeScript. */}
                             {({openPicker}) => {
                                 const menuItems = createMenuItems(openPicker);
 
@@ -421,7 +387,8 @@ function AvatarWithImagePicker({
             {errorData.validationError && (
                 <DotIndicatorMessage
                     style={[styles.mt6]}
-                    messages={{0: [errorData.validationError, errorData.phraseParam]}}
+                    // eslint-disable-next-line @typescript-eslint/naming-convention
+                    messages={{0: translate(errorData.validationError, errorData.phraseParam as never)}}
                     type="error"
                 />
             )}
@@ -438,8 +405,6 @@ function AvatarWithImagePicker({
     );
 }
 
-AvatarWithImagePicker.propTypes = propTypes;
-AvatarWithImagePicker.defaultProps = defaultProps;
 AvatarWithImagePicker.displayName = 'AvatarWithImagePicker';
 
 export default withNavigationFocus(AvatarWithImagePicker);
diff --git a/src/components/PopoverMenu.tsx b/src/components/PopoverMenu.tsx
index 34391933da32..550bee5e397a 100644
--- a/src/components/PopoverMenu.tsx
+++ b/src/components/PopoverMenu.tsx
@@ -69,7 +69,7 @@ type PopoverMenuProps = Partial<PopoverModalProps> & {
     anchorPosition: AnchorPosition;
 
     /** Ref of the anchor */
-    anchorRef: RefObject<HTMLDivElement>;
+    anchorRef: RefObject<View | HTMLDivElement>;
 
     /** Where the popover should be positioned relative to the anchor points. */
     anchorAlignment?: AnchorAlignment;

From 6a640fe342eb99365ab3698b360842311e913efd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 12 Feb 2024 13:50:03 +0100
Subject: [PATCH 096/305] add workflows icon

---
 assets/images/workflows.svg        | 1 +
 src/components/Icon/Expensicons.ts | 2 ++
 2 files changed, 3 insertions(+)
 create mode 100644 assets/images/workflows.svg

diff --git a/assets/images/workflows.svg b/assets/images/workflows.svg
new file mode 100644
index 000000000000..24156c66eb69
--- /dev/null
+++ b/assets/images/workflows.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="Layer_1" x="0" y="0" version="1.1" viewBox="0 0 20 20" style="enable-background:new 0 0 20 20" xml:space="preserve"><style type="text/css">.st0{fill-rule:evenodd;clip-rule:evenodd}</style><path d="M6.8341 4.9863C6.42615 6.15864 5.31133 7 4 7C2.34315 7 1 5.65685 1 4C1 2.34315 2.34315 1 4 1C5.31133 1 6.42615 1.84136 6.8341 3.0137C6.88806 3.00469 6.94348 3 7 3H12.25C14.3211 3 16 4.67893 16 6.75C16 8.82107 14.3211 10.5 12.25 10.5H7.75C6.7835 10.5 6 11.2835 6 12.25C6 13.2165 6.7835 14 7.75 14H15.5858L14.7929 13.2071C14.4024 12.8166 14.4024 12.1834 14.7929 11.7929C15.1834 11.4024 15.8166 11.4024 16.2071 11.7929L18.7066 14.2924C18.7069 14.2927 18.7073 14.2931 18.7076 14.2934L19.4142 15L18.7074 15.7068C18.7072 15.707 18.707 15.7072 18.7068 15.7074L16.2071 18.2071C15.8166 18.5976 15.1834 18.5976 14.7929 18.2071C14.4024 17.8166 14.4024 17.1834 14.7929 16.7929L15.5858 16H7.75C5.67893 16 4 14.3211 4 12.25C4 10.1789 5.67893 8.5 7.75 8.5H12.25C13.2165 8.5 14 7.7165 14 6.75C14 5.7835 13.2165 5 12.25 5H7C6.94348 5 6.88806 4.99531 6.8341 4.9863Z" class="st0"/></svg>
\ No newline at end of file
diff --git a/src/components/Icon/Expensicons.ts b/src/components/Icon/Expensicons.ts
index 252d13259aea..d81158544906 100644
--- a/src/components/Icon/Expensicons.ts
+++ b/src/components/Icon/Expensicons.ts
@@ -135,6 +135,7 @@ import User from '@assets/images/user.svg';
 import Users from '@assets/images/users.svg';
 import Wallet from '@assets/images/wallet.svg';
 import Workspace from '@assets/images/workspace-default-avatar.svg';
+import Workflows from '@assets/images/workflows.svg';
 import Wrench from '@assets/images/wrench.svg';
 import Zoom from '@assets/images/zoom.svg';
 import LoungeAccess from './svgs/LoungeAccessIcon';
@@ -270,6 +271,7 @@ export {
     User,
     Users,
     Wallet,
+    Workflows,
     Workspace,
     Zoom,
     Twitter,

From 32219ced45a3e78c47a6c34b877b9546529ec0d5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 12 Feb 2024 13:50:17 +0100
Subject: [PATCH 097/305] add workflow translation keys

---
 src/languages/en.ts | 1 +
 src/languages/es.ts | 1 +
 2 files changed, 2 insertions(+)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index f24b0e3e2438..16ee8a24db1a 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -1533,6 +1533,7 @@ export default {
     workspace: {
         common: {
             card: 'Cards',
+            workflows: 'Workflows',
             workspace: 'Workspace',
             edit: 'Edit workspace',
             delete: 'Delete workspace',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 3238e7fa94b0..9a0e33c266b8 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -1555,6 +1555,7 @@ export default {
     workspace: {
         common: {
             card: 'Tarjetas',
+            workflows: 'Flujos de trabajo',
             workspace: 'Espacio de trabajo',
             edit: 'Editar espacio de trabajo',
             delete: 'Eliminar espacio de trabajo',

From c189537471ac5120384fa766084d0e3e3f43b54a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 12 Feb 2024 13:50:51 +0100
Subject: [PATCH 098/305] add workflows route

---
 src/ROUTES.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/ROUTES.ts b/src/ROUTES.ts
index 5a2ab8cfc7de..7645c75cb119 100644
--- a/src/ROUTES.ts
+++ b/src/ROUTES.ts
@@ -456,6 +456,10 @@ const ROUTES = {
         route: 'workspace/:policyID/settings/currency',
         getRoute: (policyID: string) => `workspace/${policyID}/settings/currency` as const,
     },
+    WORKSPACE_WORKFLOWS: {
+        route: 'workspace/:policyID/workflows',
+        getRoute: (policyID: string) => `workspace/${policyID}/workflows` as const,
+    },
     WORKSPACE_CARD: {
         route: 'workspace/:policyID/card',
         getRoute: (policyID: string) => `workspace/${policyID}/card` as const,

From ed7f4e38fcd7bf2e77e66ffebb7ad613288ae15c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 12 Feb 2024 13:51:01 +0100
Subject: [PATCH 099/305] add workflows screen

---
 src/SCREENS.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/SCREENS.ts b/src/SCREENS.ts
index 1d7c77bf129c..8c07b6be8811 100644
--- a/src/SCREENS.ts
+++ b/src/SCREENS.ts
@@ -205,6 +205,7 @@ const SCREENS = {
         INVITE: 'Workspace_Invite',
         INVITE_MESSAGE: 'Workspace_Invite_Message',
         CURRENCY: 'Workspace_Profile_Currency',
+        WORKFLOWS: 'Workspace_Workflows',
         NAME: 'Workspace_Profile_Name',
     },
 

From 6062cea63e0720759548a74d0f71dd4e4a38aa18 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 12 Feb 2024 13:51:27 +0100
Subject: [PATCH 100/305] add workflows to central pane

---
 .../CentralPaneNavigator/BaseCentralPaneNavigator.tsx          | 1 +
 src/libs/Navigation/linkingConfig/config.ts                    | 3 +++
 src/libs/Navigation/types.ts                                   | 3 +++
 3 files changed, 7 insertions(+)

diff --git a/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx b/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx
index 087e963b3892..204bb361d6e6 100644
--- a/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx
+++ b/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx
@@ -17,6 +17,7 @@ const workspaceSettingsScreens = {
     [SCREENS.SETTINGS.WORKSPACES]: () => require('../../../../../pages/workspace/WorkspacesListPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.PROFILE]: () => require('../../../../../pages/workspace/WorkspaceProfilePage').default as React.ComponentType,
     [SCREENS.WORKSPACE.CARD]: () => require('../../../../../pages/workspace/card/WorkspaceCardPage').default as React.ComponentType,
+    [SCREENS.WORKSPACE.WORKFLOWS]: () => require('../../../../../pages/workspace/card/WorkspaceCardPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.REIMBURSE]: () => require('../../../../../pages/workspace/reimburse/WorkspaceReimbursePage').default as React.ComponentType,
     [SCREENS.WORKSPACE.BILLS]: () => require('../../../../../pages/workspace/bills/WorkspaceBillsPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.INVOICES]: () => require('../../../../../pages/workspace/invoices/WorkspaceInvoicesPage').default as React.ComponentType,
diff --git a/src/libs/Navigation/linkingConfig/config.ts b/src/libs/Navigation/linkingConfig/config.ts
index ab218adc3879..23091cfebba5 100644
--- a/src/libs/Navigation/linkingConfig/config.ts
+++ b/src/libs/Navigation/linkingConfig/config.ts
@@ -46,6 +46,9 @@ const config: LinkingOptions<RootStackParamList>['config'] = {
                 [SCREENS.WORKSPACE.CARD]: {
                     path: ROUTES.WORKSPACE_CARD.route,
                 },
+                [SCREENS.WORKSPACE.WORKFLOWS]: {
+                    path: ROUTES.WORKSPACE_WORKFLOWS.route,
+                },
                 [SCREENS.WORKSPACE.REIMBURSE]: {
                     path: ROUTES.WORKSPACE_REIMBURSE.route,
                 },
diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts
index bbdb03ab3df8..2f06eee954d9 100644
--- a/src/libs/Navigation/types.ts
+++ b/src/libs/Navigation/types.ts
@@ -59,6 +59,9 @@ type CentralPaneNavigatorParamList = {
     [SCREENS.WORKSPACE.CARD]: {
         policyID: string;
     };
+    [SCREENS.WORKSPACE.WORKFLOWS]: {
+        policyID: string;
+    };
     [SCREENS.WORKSPACE.REIMBURSE]: {
         policyID: string;
     };

From ab54b30a40b0dfa39686bcc5691b995980229736 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 12 Feb 2024 13:51:38 +0100
Subject: [PATCH 101/305] add workflows to menu items

---
 src/pages/workspace/WorkspaceInitialPage.tsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index 3f7bfc92d48d..803504824b72 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -100,6 +100,12 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
     const shouldShowProtectedItems = PolicyUtils.isPolicyAdmin(policy);
 
     const protectedMenuItems: WorkspaceMenuItem[] = [
+        {
+            translationKey: 'workspace.common.workflows',
+            icon: Expensicons.Workflows,
+            action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID)))),
+            routeName: SCREENS.WORKSPACE.WORKFLOWS,
+        },
         {
             translationKey: 'workspace.common.card',
             icon: Expensicons.ExpensifyCard,

From e4b2d68060521b4866f353808034b2c86047cff6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 12 Feb 2024 17:13:43 +0100
Subject: [PATCH 102/305] add translations for workflows page

---
 src/languages/en.ts | 11 +++++++++++
 src/languages/es.ts | 12 ++++++++++++
 2 files changed, 23 insertions(+)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index 16ee8a24db1a..39b73b4bcbe6 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -987,6 +987,17 @@ export default {
         },
         cardDetailsLoadingFailure: 'An error occurred while loading the card details. Please check your internet connection and try again.',
     },
+    workflowsPage:
+    {
+        workflowTitle: 'Spend workflow',
+        workflowDescription: 'Configure a workflow from the moment spend occurs, including approval and payment.',
+        delaySubmissionTitle: 'Delay submissions',
+        delaySubmissionDescription: 'Set a slower cadence to receive expense submissions.',
+        addApprovalsTitle: 'Add approval',
+        addApprovalsDescription: 'Set a slower cadence to receive expense submissions in real time.',
+        makeOrTrackPaymentsTitle: 'Make or track payments',
+        makeOrTrackPaymentsDescription: 'Add an authorized payer for payments made in Expensify, or simply track payments made elsewhere.',
+    },
     reportFraudPage: {
         title: 'Report virtual card fraud',
         description: 'If your virtual card details have been stolen or compromised, we’ll permanently deactivate your existing card and provide you with a new virtual card and number.',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 9a0e33c266b8..7c3d04549a5d 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -982,6 +982,17 @@ export default {
         },
         cardDetailsLoadingFailure: 'Se ha producido un error al cargar los datos de la tarjeta. Comprueba tu conexión a Internet e inténtalo de nuevo.',
     },
+    workflowsPage:
+    {
+        workflowTitle: 'Flujo de trabajo de gastos',
+        workflowDescription: 'Configure un flujo de trabajo desde el momento en que se produce el gasto, incluida la aprobación y el pago.',
+        delaySubmissionTitle: 'Retrasar las presentaciones',
+        delaySubmissionDescription: 'Establezca una cadencia más lenta para recibir los envíos de gastos.',
+        addApprovalsTitle: 'Añadir aprobación',
+        addApprovalsDescription: 'Establezca una cadencia más lenta para recibir los envíos de gastos en tiempo real.',
+        makeOrTrackPaymentsTitle: 'Realizar o seguir pagos',
+        makeOrTrackPaymentsDescription: 'Añada un pagador autorizado para los pagos realizados en Expensify, o simplemente realice un seguimiento de los pagos realizados en otro lugar.',
+    },
     reportFraudPage: {
         title: 'Reportar fraude con la tarjeta virtual',
         description:
@@ -1556,6 +1567,7 @@ export default {
         common: {
             card: 'Tarjetas',
             workflows: 'Flujos de trabajo',
+            spendWorkflow: 'Flujo de trabajo de gastos',
             workspace: 'Espacio de trabajo',
             edit: 'Editar espacio de trabajo',
             delete: 'Eliminar espacio de trabajo',

From 67ce9fa1b1041e788483e3b6b4ba95c9eaf7e591 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 12 Feb 2024 17:14:04 +0100
Subject: [PATCH 103/305] add styles for workflows

---
 src/styles/index.ts | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/src/styles/index.ts b/src/styles/index.ts
index 1bea3d298cd4..811dd6af592a 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4337,6 +4337,27 @@ const styles = (theme: ThemeColors) =>
         updateRequiredViewTextContainer: {
             width: variables.updateTextViewContainerWidth,
         },
+        workspaceWorkflowsIcon: {
+            height: 48,
+            width: 48,
+            marginRight: 12,
+        },
+        workspaceWorkflowsContainer: {
+            flexDirection: 'row',
+            alignItems: 'center',
+        },
+        workspaceWorkflowsHeading: {
+            fontSize: 15,
+            fontWeight: '700',
+        },
+        workspaceWorkflowsWrapperText: {
+            flexDirection: 'column',
+        },
+        workspaceWorkflowsSubtitle: {
+            fontSize: 13,
+            color: theme.textSupporting,
+            marginTop: 3,
+        }
     } satisfies Styles);
 
 type ThemeStyles = ReturnType<typeof styles>;

From 4b8418633246e88a9dec587529b9993d84ba6f07 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 12 Feb 2024 17:14:22 +0100
Subject: [PATCH 104/305] add workflows related icons

---
 .../simple-illustrations/simple-illustration__approval.svg  | 1 +
 .../simple-illustration__receipt-envelope.svg               | 1 +
 .../simple-illustration__wallet-alt.svg                     | 1 +
 src/components/Icon/Illustrations.ts                        | 6 ++++++
 4 files changed, 9 insertions(+)
 create mode 100644 assets/images/simple-illustrations/simple-illustration__approval.svg
 create mode 100644 assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg
 create mode 100644 assets/images/simple-illustrations/simple-illustration__wallet-alt.svg

diff --git a/assets/images/simple-illustrations/simple-illustration__approval.svg b/assets/images/simple-illustrations/simple-illustration__approval.svg
new file mode 100644
index 000000000000..8816849fa39e
--- /dev/null
+++ b/assets/images/simple-illustrations/simple-illustration__approval.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="38" height="40" viewBox="0 0 38 40" fill="none"><path d="M13.8399 7.32497L11.4532 3.52603C11.4532 3.52603 9.89413 0.797631 7.02157 0.848355C4.14902 0.896409 2.00529 2.01767 1.03086 4.69535C0.0564363 7.37303 0.73987 9.32188 1.76235 10.4431C2.78483 11.5644 5.75616 12.2932 5.75616 12.2932L5.80421 24.3735L9.16531 27.198C9.16531 27.198 8.77554 16.53 8.82359 15.9453C8.87165 15.3607 8.97043 13.3157 8.97043 13.3157C8.97043 13.3157 9.40825 12.4401 10.6256 11.9515C11.843 11.463 24.7988 7.03131 24.7988 7.03131L21.5365 4.88756C21.5365 4.88756 19.8306 5.17856 19.2967 5.42417C18.7601 5.66711 13.8426 7.32497 13.8426 7.32497H13.8399Z" fill="#D18000"/><path d="M26.8817 9.35938C26.8817 9.35938 26.0781 7.27704 24.543 7.23967C23.008 7.20229 21.5851 7.93378 21.5851 7.93378L10.2977 12.0264C10.2977 12.0264 9.2379 12.6831 9.05636 13.743C8.87482 14.8028 8.98428 26.528 8.98428 26.528C8.98428 26.528 10.0068 28.573 11.5792 28.4288C13.1516 28.2847 25.7524 23.2417 25.7524 23.2417C25.7524 23.2417 26.7749 23.0228 26.8496 21.0125C26.9217 19.0022 26.887 9.35938 26.887 9.35938H26.8817Z" fill="#FFED8F"/><path d="M24.8469 7.1812L21 4.89062L19.2941 5.42723L7.01897 9.9096C7.01897 9.9096 5.89771 10.6891 5.89771 11.6636C5.89771 12.638 5.80161 24.3765 5.80161 24.3765L9.06393 26.7632L9.05058 13.7459C9.05058 13.7459 9.50175 12.3443 10.6203 11.9546C11.7389 11.5648 23.1384 7.37609 23.1384 7.37609C23.1384 7.37609 24.5987 7.08509 24.8443 7.1812H24.8469Z" fill="#722B03"/><path d="M25.5333 33.3111L24.6683 34.5392C24.5428 34.718 24.6176 34.953 24.8338 35.0491L29.3375 37.062C29.5378 37.1528 29.786 37.086 29.8955 36.9152L34.2123 30.1609C34.3271 29.982 34.247 29.7551 34.0361 29.6643L32.728 29.0904C32.5304 29.0023 32.2875 29.0663 32.1781 29.2319L28.9291 34.144C28.8143 34.3149 28.5633 34.3763 28.3631 34.2802L26.0939 33.183C25.899 33.0869 25.6507 33.1456 25.5333 33.3111V33.3111Z" fill="#00B268"/><path d="M21.4617 18.0134L22.2386 19.4844C22.3507 19.6979 22.284 19.9783 22.0891 20.093L18.0366 22.5064C17.855 22.6132 17.6335 22.5358 17.5347 22.3302L13.6503 14.2411C13.5462 14.0276 13.6183 13.7553 13.8078 13.6458L14.9852 12.957C15.164 12.8529 15.3803 12.9277 15.4817 13.1279L18.405 19.0118C18.5064 19.2174 18.7334 19.2895 18.9149 19.1747L20.9572 17.8585C21.1334 17.7437 21.355 17.8131 21.4617 18.0107V18.0134Z" fill="#00B268"/><path d="M35.5121 26.4414H23.4319C22.2252 26.4414 21.2455 27.2877 21.2455 28.3342V37.8703C21.2455 38.9141 22.2226 39.7631 23.4319 39.7631H35.5121C36.7188 39.7631 37.6986 38.9168 37.6986 37.8703V28.3342C37.6986 27.2904 36.7215 26.4414 35.5121 26.4414ZM34.8928 36.6769C34.8928 37.1948 34.4069 37.614 33.8089 37.614H25.1298C24.5318 37.614 24.046 37.1948 24.046 36.6769V29.5275C24.046 29.0096 24.5318 28.5905 25.1298 28.5905H33.8089C34.4069 28.5905 34.8928 29.0096 34.8928 29.5275V36.6769Z" fill="#00B268"/><path d="M22.6658 9.58578L12.1741 13.6517C11.5067 13.9106 11.0528 14.6234 11.0395 15.4324L10.898 24.2129C10.8766 25.5184 11.9739 26.4581 13.0551 26.063L23.5041 22.256C24.1822 22.0077 24.6521 21.2923 24.6681 20.4727L24.855 11.4359C24.8817 10.1117 23.7604 9.16397 22.6685 9.58578H22.6658ZM23.1063 19.7706C23.1063 20.171 22.8527 20.5261 22.479 20.6596L14.5688 23.5028C13.9467 23.727 13.2927 23.2598 13.298 22.6004L13.3647 16.049C13.3674 15.6539 13.6157 15.3042 13.9868 15.1681L21.8569 12.2661C22.479 12.0365 23.1384 12.4984 23.1357 13.1605L23.109 19.7706H23.1063Z" fill="#00B268"/><path d="M26.8439 21.089V9.98585C26.8439 8.03966 24.9858 6.67546 23.2105 7.31618L10.7005 11.8439C9.60592 12.2417 8.87177 13.3123 8.87177 14.5136V25.6168C8.87177 27.563 10.7298 28.9272 12.5052 28.2864L25.0152 23.7587C26.1098 23.3609 26.8439 22.2904 26.8439 21.089V21.089Z" stroke="#002140" stroke-width="0.999899" stroke-linecap="round" stroke-linejoin="round"/><path d="M9.95073 27.8696L6.1171 24.6687C5.91687 24.2789 5.80475 23.8304 5.80475 23.3472V12.244C5.80475 11.0427 6.53891 9.97212 7.63347 9.57434L20.1435 5.04659C20.6053 4.8784 21.2781 4.77428 21.9588 5.22011L25.6937 7.67888" stroke="#002140" stroke-width="0.999899" stroke-linecap="round" stroke-linejoin="round"/><path d="M5.74796 12.2405C4.92837 12.131 4.11413 12.0456 3.25984 11.5677C1.34302 10.4918 0.651581 8.70314 0.651581 6.66084C0.651581 3.39317 3.29988 0.742188 6.57021 0.742188C11.2982 0.838296 11.6773 4.7547 13.7703 7.20012" stroke="#002140" stroke-width="0.999899" stroke-linecap="round" stroke-linejoin="round"/></svg>
\ No newline at end of file
diff --git a/assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg b/assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg
new file mode 100644
index 000000000000..d16bea869771
--- /dev/null
+++ b/assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg
@@ -0,0 +1 @@
+<svg fill="none" viewBox="0 0 20 40" xmlns="http://www.w3.org/2000/svg"><path d="m4.2457 24.812h12.194s1.7429-0.3283 1.7429-3.0596v-19.819l-2.3081 1.9766-1.8345-2.2608-1.8345 2.2608-2.0713-2.1187-2.1187 2.2134-1.7429-2.2134-1.7429 2.166-2.0713-1.8345v9.0872l1.7903 13.606-0.00316-0.0032z" fill="#FFFAF0" stroke="#002140" stroke-miterlimit="10" stroke-width=".99999"/><path d="m19.25 9.2266h-18.149v29.374h18.149v-29.374z" fill="#FFA75A" stroke="#002140" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/><path d="m19.25 38.6s0.3-2.084-2.2102-2.084h-14.032c-1.8503 0-1.9103 2.084-1.9103 2.084" stroke="#002140" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/><path d="m10.175 9.2266v27.24" stroke="#002140" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/></svg>
\ No newline at end of file
diff --git a/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg b/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg
new file mode 100644
index 000000000000..6cce2acd04f6
--- /dev/null
+++ b/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="30" height="44" viewBox="0 0 30 44" fill="none"><path d="M26.7969 22.8477H2.94542C1.80808 22.8477 0.886078 23.7697 0.886078 24.907V40.482C0.886078 41.6193 1.80808 42.5413 2.94542 42.5413H26.7969C27.9342 42.5413 28.8562 41.6193 28.8562 40.482V24.907C28.8562 23.7697 27.9342 22.8477 26.7969 22.8477Z" fill="#D18000"/><path d="M5.4714 26.359V22.7461H2.63247C2.63247 22.7461 0.886078 23.3832 0.886078 24.5959V26.4373L5.4686 26.359H5.4714Z" fill="#780505"/><path d="M24.5616 22.5848V26.5135H28.725V24.5911C28.725 24.5911 28.3255 22.8447 27.11 22.8447C25.8945 22.8447 24.5616 22.582 24.5616 22.582V22.5848Z" fill="#780505"/><path d="M24.7183 0.824219H5.15598V26.5143H24.7183V0.824219Z" fill="#00B268"/><path d="M26.0845 32.7557V29.8078C26.0845 29.8078 26.1684 28.4609 24.9473 28.4609H6.79042C6.79042 28.4609 5.65317 28.4609 5.65317 29.5563V32.6746L26.0845 32.7585V32.7557Z" fill="#FCDCFF"/><path d="M6.15912 28.6251H4.39038C4.39038 28.6251 3.67506 28.4155 3.63314 29.7623L3.54932 32.4588L5.65616 32.6683V29.55L6.16191 28.6223L6.15912 28.6251Z" fill="#FBCCFF"/><path d="M12.0715 30.1836H8.30768V32.5419H12.0715V30.1836Z" fill="#F9B5FE"/><path d="M5.49982 32.4874V29.6932C5.49982 29.003 6.05866 28.4414 6.75163 28.4414H24.861C25.5512 28.4414 26.1128 29.0003 26.1128 29.6932V32.6551" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.13742 32.429V30.2383H12.013V32.4848" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 30.4609H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M20.1024 30.4609H23.9779" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 31.5898H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M3.58807 32.4874V29.6932C3.58807 29.003 4.14692 28.4414 4.83989 28.4414H8.92504" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8744 23.4105C17.2988 23.4105 19.2641 20.4181 19.2641 16.7267C19.2641 13.0354 17.2988 10.043 14.8744 10.043C12.45 10.043 10.4847 13.0354 10.4847 16.7267C10.4847 20.4181 12.45 23.4105 14.8744 23.4105Z" fill="#5BE3AA"/><path d="M8.40536 5.57031C9.15073 5.57031 9.75497 4.96607 9.75497 4.2207C9.75497 3.47533 9.15073 2.87109 8.40536 2.87109C7.66 2.87109 7.05576 3.47533 7.05576 4.2207C7.05576 4.96607 7.66 5.57031 8.40536 5.57031Z" fill="#5BE3AA"/><path d="M21.5131 5.58984C22.2585 5.58984 22.8627 4.9856 22.8627 4.24023C22.8627 3.49487 22.2585 2.89062 21.5131 2.89062C20.7677 2.89062 20.1635 3.49487 20.1635 4.24023C20.1635 4.9856 20.7677 5.58984 21.5131 5.58984Z" fill="#5BE3AA"/><path d="M5.21713 26.3569V1.10547H24.5727V26.2255" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8966 23.6281C17.3425 23.6281 19.3254 20.5581 19.3254 16.7711C19.3254 12.9841 17.3425 9.91406 14.8966 9.91406C12.4506 9.91406 10.4677 12.9841 10.4677 16.7711C10.4677 20.5581 12.4506 23.6281 14.8966 23.6281Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.5134 5.79131C22.3683 5.79131 23.0614 5.09825 23.0614 4.24331C23.0614 3.38838 22.3683 2.69531 21.5134 2.69531C20.6585 2.69531 19.9654 3.38838 19.9654 4.24331C19.9654 5.09825 20.6585 5.79131 21.5134 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.41381 5.79131C9.26875 5.79131 9.96181 5.09825 9.96181 4.24331C9.96181 3.38838 9.26875 2.69531 8.41381 2.69531C7.55888 2.69531 6.86581 3.38838 6.86581 4.24331C6.86581 5.09825 7.55888 5.79131 8.41381 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.23514 26.3568V7.32812" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.6474 7.32812V26.4155" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6552 3.98828H18.2496" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.2468 4.21875C18.2468 5.93999 19.6439 7.3371 21.3652 7.3371C21.4294 7.3371 21.4965 7.3371 21.5608 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6582 4.21875C11.6582 5.93999 10.2611 7.3371 8.53983 7.3371C8.47557 7.3371 8.40851 7.3371 8.34424 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M24.7713 22.6406H26.5988C27.845 22.6406 28.8565 23.6521 28.8565 24.8984V40.4957C28.8565 41.7419 27.845 42.7534 26.5988 42.7534H3.04066C1.79444 42.7534 0.782928 41.7419 0.782928 40.4957V24.8984C0.782928 23.6521 1.79444 22.6406 3.04066 22.6406H5.02456" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 26.4102H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 33.0078H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/></svg>
\ No newline at end of file
diff --git a/src/components/Icon/Illustrations.ts b/src/components/Icon/Illustrations.ts
index 51422e7b4a49..23a8e6eba151 100644
--- a/src/components/Icon/Illustrations.ts
+++ b/src/components/Icon/Illustrations.ts
@@ -62,6 +62,9 @@ import ThumbsUpStars from '@assets/images/simple-illustrations/simple-illustrati
 import TrackShoe from '@assets/images/simple-illustrations/simple-illustration__track-shoe.svg';
 import TrashCan from '@assets/images/simple-illustrations/simple-illustration__trashcan.svg';
 import TreasureChest from '@assets/images/simple-illustrations/simple-illustration__treasurechest.svg';
+import Approval from '@assets/images/simple-illustrations/simple-illustration__approval.svg';
+import ReceiptEnvelope from '@assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg';
+import WalletAlt from '@assets/images/simple-illustrations/simple-illustration__wallet-alt.svg';
 
 export {
     Abracadabra,
@@ -128,4 +131,7 @@ export {
     LockClosed,
     Gears,
     QrCode,
+    ReceiptEnvelope,
+    Approval,
+    WalletAlt,
 };

From 657f637072a394ee24d4cc6fe7abd45874b95481 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 12 Feb 2024 17:14:59 +0100
Subject: [PATCH 105/305] add workflows

---
 src/CONST.ts                                                     | 1 +
 src/libs/Navigation/linkingConfig/TAB_TO_CENTRAL_PANE_MAPPING.ts | 1 +
 2 files changed, 2 insertions(+)

diff --git a/src/CONST.ts b/src/CONST.ts
index eae4b8ec7a2b..4a5d15ec8428 100755
--- a/src/CONST.ts
+++ b/src/CONST.ts
@@ -1513,6 +1513,7 @@ const CONST = {
         WORKSPACE_INVOICES: 'WorkspaceSendInvoices',
         WORKSPACE_TRAVEL: 'WorkspaceBookTravel',
         WORKSPACE_MEMBERS: 'WorkspaceManageMembers',
+        WORKSPACE_WORKFLOWS: 'WorkspaceWorkflows',
         WORKSPACE_BANK_ACCOUNT: 'WorkspaceBankAccount',
     },
     get EXPENSIFY_EMAILS() {
diff --git a/src/libs/Navigation/linkingConfig/TAB_TO_CENTRAL_PANE_MAPPING.ts b/src/libs/Navigation/linkingConfig/TAB_TO_CENTRAL_PANE_MAPPING.ts
index 446fb479ea09..f17a9f526800 100755
--- a/src/libs/Navigation/linkingConfig/TAB_TO_CENTRAL_PANE_MAPPING.ts
+++ b/src/libs/Navigation/linkingConfig/TAB_TO_CENTRAL_PANE_MAPPING.ts
@@ -7,6 +7,7 @@ const TAB_TO_CENTRAL_PANE_MAPPING: Record<BottomTabName, CentralPaneName[]> = {
     [SCREENS.WORKSPACE.INITIAL]: [
         SCREENS.WORKSPACE.PROFILE,
         SCREENS.WORKSPACE.CARD,
+        SCREENS.WORKSPACE.WORKFLOWS,
         SCREENS.WORKSPACE.REIMBURSE,
         SCREENS.WORKSPACE.BILLS,
         SCREENS.WORKSPACE.INVOICES,

From b62413fd79ad5a4a6d88b71186394477477fc2bd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 12 Feb 2024 17:15:17 +0100
Subject: [PATCH 106/305] create workspace workflows main page

---
 .../workflows/WorkspaceWorkflowsPage.tsx      | 54 +++++++++++++++++++
 1 file changed, 54 insertions(+)
 create mode 100644 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
new file mode 100644
index 000000000000..79afb996a497
--- /dev/null
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -0,0 +1,54 @@
+import type {StackScreenProps} from '@react-navigation/stack';
+import React from 'react';
+import {View} from 'react-native';
+import useLocalize from '@hooks/useLocalize';
+import useThemeStyles from '@hooks/useThemeStyles';
+import useWindowDimensions from '@hooks/useWindowDimensions';
+import type {CentralPaneNavigatorParamList} from '@navigation/types';
+import WorkspacePageWithSections from '@pages/workspace/WorkspacePageWithSections';
+import CONST from '@src/CONST';
+import type SCREENS from '@src/SCREENS';
+import Text from '@components/Text';
+import Section from '@components/Section';
+import * as Illustrations from '@components/Icon/Illustrations';
+
+type WorkspaceWorkflowsPageProps = StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
+
+function WorkspaceWorkflowsPage({route}: WorkspaceWorkflowsPageProps) {
+    const {translate} = useLocalize();
+    const styles = useThemeStyles();
+    const {isSmallScreenWidth} = useWindowDimensions();
+
+    return (
+        <WorkspacePageWithSections
+            shouldUseScrollView
+            headerText={translate('workspace.common.workflows')}
+            route={route}
+            guidesCallTaskID={CONST.GUIDES_CALL_TASK_IDS.WORKSPACE_WORKFLOWS}
+            shouldShowOfflineIndicatorInWideScreen
+        >
+            {(_, policyID: string) => (
+                <View style={[styles.mt3, styles.textStrong, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
+                    <Section title={translate('workflowsPage.workflowTitle')} titleStyles={styles.textStrong}>
+                        <View>
+                            <Text style={[styles.mt3, styles.textSupporting]}>{translate('workflowsPage.workflowDescription')}</Text>
+                            <View style={styles.mt7}>
+                                <View style={styles.workspaceWorkflowsContainer}>
+                                    <Illustrations.ReceiptEnvelope style={styles.workspaceWorkflowsIcon}/>
+                                    <View style={styles.workspaceWorkflowsWrapperText}>
+                                        <Text style={styles.workspaceWorkflowsHeading}>{translate('workflowsPage.delaySubmissionTitle')}</Text>
+                                        <Text style={styles.workspaceWorkflowsSubtitle}>{translate('workflowsPage.delaySubmissionDescription')}</Text>
+                                    </View>
+                                </View>
+                            </View>
+                        </View>
+                    </Section>
+                </View>
+            )}
+        </WorkspacePageWithSections>
+    );
+}
+
+WorkspaceWorkflowsPage.displayName = 'WorkspaceWorkflowsPage';
+
+export default WorkspaceWorkflowsPage;

From 4c41b30e0091baf84f714bf1c8b17ac1dbf256f7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 12 Feb 2024 17:15:28 +0100
Subject: [PATCH 107/305] use workspace workflows main page

---
 .../CentralPaneNavigator/BaseCentralPaneNavigator.tsx           | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx b/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx
index 204bb361d6e6..ef5b46968f58 100644
--- a/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx
+++ b/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx
@@ -17,7 +17,7 @@ const workspaceSettingsScreens = {
     [SCREENS.SETTINGS.WORKSPACES]: () => require('../../../../../pages/workspace/WorkspacesListPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.PROFILE]: () => require('../../../../../pages/workspace/WorkspaceProfilePage').default as React.ComponentType,
     [SCREENS.WORKSPACE.CARD]: () => require('../../../../../pages/workspace/card/WorkspaceCardPage').default as React.ComponentType,
-    [SCREENS.WORKSPACE.WORKFLOWS]: () => require('../../../../../pages/workspace/card/WorkspaceCardPage').default as React.ComponentType,
+    [SCREENS.WORKSPACE.WORKFLOWS]: () => require('../../../../../pages/workspace/workflows/WorkspaceWorkflowsPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.REIMBURSE]: () => require('../../../../../pages/workspace/reimburse/WorkspaceReimbursePage').default as React.ComponentType,
     [SCREENS.WORKSPACE.BILLS]: () => require('../../../../../pages/workspace/bills/WorkspaceBillsPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.INVOICES]: () => require('../../../../../pages/workspace/invoices/WorkspaceInvoicesPage').default as React.ComponentType,

From 56a6c2a1cc5727cc334b35adf419a93239d81c04 Mon Sep 17 00:00:00 2001
From: Sheena Trepanier <sheena@expensify.com>
Date: Mon, 12 Feb 2024 14:30:01 -0800
Subject: [PATCH 108/305] Update Billing-Overview.md

Per https://github.com/Expensify/Expensify/issues/357408

Small copy change to satisfy Bancorp requirements for new card program.
---
 .../billing-and-subscriptions/Billing-Overview.md               | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/articles/expensify-classic/billing-and-subscriptions/Billing-Overview.md b/docs/articles/expensify-classic/billing-and-subscriptions/Billing-Overview.md
index 09dd4de2867b..bb289a15ddb1 100644
--- a/docs/articles/expensify-classic/billing-and-subscriptions/Billing-Overview.md
+++ b/docs/articles/expensify-classic/billing-and-subscriptions/Billing-Overview.md
@@ -3,7 +3,7 @@ title: Billing Overview
 description: An overview of how billing works in Expensify.
 ---
 # Overview
-Expensify’s billing is based on monthly member activity. At the beginning of each month, you’ll be billed for the previous month’s activity. Your Expensify bill ultimately depends on your plan type, whether you're on an annual subscription or pay-per-use billing, and whether you’re using Expensify Cards. 
+Expensify’s billing is based on monthly member activity. At the beginning of each month, you’ll be billed for the previous month’s activity. Your Expensify bill ultimately depends on your plan type, whether you're on an annual subscription or pay-per-use billing, and whether you’re using the Expensify Visa® Commercial Card. 
 # How billing works in Expensify
 Expensify bills the owners of Group Workspaces on the first of each month for the previous month's usage. You can find billing receipts in **Settings > Account > Payments > Billing History**. We recommend that businesses have one billing owner for all of their Group Workspaces.
 ## Active members

From 044816a7012d913daff23dafeec3f3a8d8e33eb9 Mon Sep 17 00:00:00 2001
From: Sheena Trepanier <sheena@expensify.com>
Date: Mon, 12 Feb 2024 15:26:10 -0800
Subject: [PATCH 109/305] Update Billing-Overview.md

Missed an update to cash back, just added it.
---
 .../billing-and-subscriptions/Billing-Overview.md               | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/articles/expensify-classic/billing-and-subscriptions/Billing-Overview.md b/docs/articles/expensify-classic/billing-and-subscriptions/Billing-Overview.md
index bb289a15ddb1..922a60a7f4da 100644
--- a/docs/articles/expensify-classic/billing-and-subscriptions/Billing-Overview.md
+++ b/docs/articles/expensify-classic/billing-and-subscriptions/Billing-Overview.md
@@ -23,7 +23,7 @@ Bundling the Expensify Card with an annual subscription ensures you pay the lowe
 
 If at least 50% of your approved USD spend in a given month is on your company’s Expensify Cards, you will receive an additional 50% discount on the price per member. This additional 50% discount, when coupled with an annual subscription, brings the price per member to $5 on a Collect plan and $9 on a Control plan.
 
-Additionally, every month, you receive 1% cash back on all Expensify Card purchases, and 2% if the spend across your Expensify Cards is $250k or more. Any cash back from the Expensify Card is first applied to your Expensify bill, further reducing your price per member. Any leftover cash back is deposited directly into your connected bank account.
+Additionally, every month, you receive 1% cash back on all Expensify Card purchases, and 2% if the spend across your Expensify Cards is $250k or more (_Applies to USD purchases only._) Any cash back from the Expensify Card is first applied to your Expensify bill, further reducing your price per member. Any leftover cash back is deposited directly into your connected bank account.
 ## Savings calculator
 To see how much money you can save (and even earn!) by using the Expensify Card, check out our [savings calculator](https://use.expensify.com/price-savings-calculator). Just enter a few details and see how much you’ll save!
 {% include faq-begin.md %}

From 8b5c13208f639351eb6f3b22099346adb4cfb246 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Tue, 13 Feb 2024 10:32:17 -0500
Subject: [PATCH 110/305] Rearrange function parameters for
 MoneyRequestConfirmPage

---
 src/pages/iou/steps/MoneyRequestConfirmPage.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js
index 1ac739696734..0b48eb9ac47d 100644
--- a/src/pages/iou/steps/MoneyRequestConfirmPage.js
+++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js
@@ -268,10 +268,10 @@ function MoneyRequestConfirmPage(props) {
                     props.iou.amount,
                     trimmedComment,
                     props.iou.currency,
+                    props.iou.merchant,
                     props.iou.category,
                     props.iou.tag,
                     reportID,
-                    props.iou.merchant,
                     false,
                 );
                 return;

From 6cc2a08cd5629aba19f932d7a242841977110168 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Tue, 13 Feb 2024 16:34:28 +0100
Subject: [PATCH 111/305] create ToggleSettingsOptionRow component

---
 .../workflows/ToggleSettingsOptionRow.tsx     | 51 +++++++++++++++++++
 1 file changed, 51 insertions(+)
 create mode 100644 src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
new file mode 100644
index 000000000000..94c07d0bfdc8
--- /dev/null
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -0,0 +1,51 @@
+import Switch from "@components/Switch";
+import Text from "@components/Text";
+import useLocalize from "@hooks/useLocalize";
+import useThemeStyles from "@hooks/useThemeStyles";
+import { TranslationPaths } from "@src/languages/types";
+import React, { useState } from "react";
+import { View } from "react-native";
+import { SvgProps } from "react-native-svg";
+
+export type OptionType = {
+    Illustration: React.ElementType<SvgProps>;
+    title: string;
+    subtitle: string;
+    onToggle: (isEnabled: boolean) => void;
+    subMenuItems?: React.ReactNode;
+};
+
+const ToggleSettingOptionRow = ({ Illustration, title, subtitle, onToggle, subMenuItems }: OptionType) => {
+    const [isEnabled, setIsEnabled] = useState(false);
+    const { translate } = useLocalize();
+    const styles = useThemeStyles();
+  
+    const toggleSwitch = () => {
+      setIsEnabled(previousState => !previousState);
+      onToggle(!isEnabled);
+    };
+  
+    return (
+    <View style={styles.workspaceWorkflowContainer}>        
+        <View style={styles.workspaceWorkflowContent}>
+            <View style={styles.workspaceWorkflowsIllustrationContainer}>
+                <Illustration style={styles.workspaceWorkflowsIcon} />
+            </View>
+            <View style={styles.workspaceWorkflowsWrapperText}>
+                <Text style={styles.workspaceWorkflowsHeading}>{title}</Text>
+                <Text style={styles.workspaceWorkflowsSubtitle}>{subtitle}</Text>
+            </View>
+        </View>
+        <View>
+            <Switch
+                accessibilityLabel={subtitle}
+                onToggle={toggleSwitch}
+                isOn={isEnabled}
+            />
+        </View>
+            {isEnabled && subMenuItems}
+    </View>
+    );
+  };
+
+  export default ToggleSettingOptionRow;
\ No newline at end of file

From c3120df261e09c418f0e276cedc3a8fa4978ca9f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Tue, 13 Feb 2024 16:35:05 +0100
Subject: [PATCH 112/305] add new workflows styles

---
 src/styles/index.ts | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/styles/index.ts b/src/styles/index.ts
index 811dd6af592a..7d07f6fd36ac 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4342,9 +4342,14 @@ const styles = (theme: ThemeColors) =>
             width: 48,
             marginRight: 12,
         },
-        workspaceWorkflowsContainer: {
+        workspaceWorkflowContent: {
+            flexDirection: 'row', 
+            alignItems: 'center',
+        },
+        workspaceWorkflowContainer: {
             flexDirection: 'row',
             alignItems: 'center',
+            justifyContent: 'space-between',
         },
         workspaceWorkflowsHeading: {
             fontSize: 15,
@@ -4352,12 +4357,17 @@ const styles = (theme: ThemeColors) =>
         },
         workspaceWorkflowsWrapperText: {
             flexDirection: 'column',
+            maxWidth: 486,
         },
         workspaceWorkflowsSubtitle: {
             fontSize: 13,
             color: theme.textSupporting,
             marginTop: 3,
-        }
+        },
+        workspaceWorkflowsIllustrationContainer: {
+            justifyContent: 'center',
+            alignItems: 'center',
+        },
     } satisfies Styles);
 
 type ThemeStyles = ReturnType<typeof styles>;

From 1adba7ecf11df07565bd6d482385dd8c303902bd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Tue, 13 Feb 2024 16:35:24 +0100
Subject: [PATCH 113/305] use a <FlatList>

---
 .../workflows/WorkspaceWorkflowsPage.tsx      | 82 ++++++++++++++++---
 1 file changed, 70 insertions(+), 12 deletions(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 79afb996a497..6a18ec780d43 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -1,6 +1,6 @@
 import type {StackScreenProps} from '@react-navigation/stack';
 import React from 'react';
-import {View} from 'react-native';
+import {FlatList, View} from 'react-native';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
@@ -11,14 +11,76 @@ import type SCREENS from '@src/SCREENS';
 import Text from '@components/Text';
 import Section from '@components/Section';
 import * as Illustrations from '@components/Icon/Illustrations';
+import ToggleSettingOptionRow, { OptionType } from './ToggleSettingsOptionRow';
+import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 
 type WorkspaceWorkflowsPageProps = StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
 
-function WorkspaceWorkflowsPage({route}: WorkspaceWorkflowsPageProps) {
+const WorkspaceWorkflowsPage: React.FC<WorkspaceWorkflowsPageProps> = ({route}) => {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const {isSmallScreenWidth} = useWindowDimensions();
 
+    const items: OptionType[] = [
+        {
+          Illustration: Illustrations.ReceiptEnvelope, // Replace with actual component
+          title: translate('workflowsPage.delaySubmissionTitle'),
+          subtitle: translate('workflowsPage.delaySubmissionDescription'),
+          onToggle: (isEnabled: boolean) => {
+            // TODO
+          },
+          subMenuItems: (
+            <MenuItemWithTopDescription
+              title={translate('workflowsPage.delaySubmissionTitle')}
+              onPress={() => {}}
+              shouldShowRightIcon={true}
+            />
+          ),
+        },
+        {
+            Illustration: Illustrations.Approval,
+            title: translate('workflowsPage.addApprovalsTitle'),
+            subtitle: translate('workflowsPage.addApprovalsDescription'),
+            onToggle: (isEnabled: boolean) => {
+              // TODO
+            },
+            subMenuItems: (
+              <MenuItemWithTopDescription
+                title={translate('workflowsPage.addApprovalsTitle')}
+                onPress={() => {}}
+                shouldShowRightIcon={true}
+              />
+            ),
+          },
+          {
+            Illustration: Illustrations.WalletAlt,
+            title: translate('workflowsPage.makeOrTrackPaymentsTitle'),
+            subtitle: translate('workflowsPage.makeOrTrackPaymentsDescription'),
+            onToggle: (isEnabled: boolean) => {
+              // TODO
+            },
+            subMenuItems: (
+              <MenuItemWithTopDescription
+                title={translate('workflowsPage.makeOrTrackPaymentsTitle')}
+                onPress={() => {}}
+                shouldShowRightIcon={true}
+              />
+            ),
+          },
+    ];
+
+    const renderItem = ({ item }: { item: OptionType }) => (
+        <View style={styles.mt7}>
+             <ToggleSettingOptionRow
+                Illustration={item.Illustration}
+                title={item.title}
+                subtitle={item.subtitle}                    
+                onToggle={item.onToggle}
+                subMenuItems={item.subMenuItems}
+            />
+        </View>
+    );
+
     return (
         <WorkspacePageWithSections
             shouldUseScrollView
@@ -29,18 +91,14 @@ function WorkspaceWorkflowsPage({route}: WorkspaceWorkflowsPageProps) {
         >
             {(_, policyID: string) => (
                 <View style={[styles.mt3, styles.textStrong, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
-                    <Section title={translate('workflowsPage.workflowTitle')} titleStyles={styles.textStrong}>
+                    <Section title={translate('workflowsPage.workflowTitle')} titleStyles={styles.textStrong} containerStyles={styles.p8}>
                         <View>
                             <Text style={[styles.mt3, styles.textSupporting]}>{translate('workflowsPage.workflowDescription')}</Text>
-                            <View style={styles.mt7}>
-                                <View style={styles.workspaceWorkflowsContainer}>
-                                    <Illustrations.ReceiptEnvelope style={styles.workspaceWorkflowsIcon}/>
-                                    <View style={styles.workspaceWorkflowsWrapperText}>
-                                        <Text style={styles.workspaceWorkflowsHeading}>{translate('workflowsPage.delaySubmissionTitle')}</Text>
-                                        <Text style={styles.workspaceWorkflowsSubtitle}>{translate('workflowsPage.delaySubmissionDescription')}</Text>
-                                    </View>
-                                </View>
-                            </View>
+                            <FlatList
+                                data={items}
+                                renderItem={renderItem}
+                                keyExtractor={(item: OptionType) => item.title}
+                            />                            
                         </View>
                     </Section>
                 </View>

From e33cc2309a6ab5b58185a8f0b045b225b9effb2e Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Tue, 13 Feb 2024 10:38:15 -0500
Subject: [PATCH 114/305] Refactor MoneyRequestConfirmPage.js to include
 merchant information

---
 src/pages/iou/steps/MoneyRequestConfirmPage.js | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js
index 0b48eb9ac47d..2c5990e26d15 100644
--- a/src/pages/iou/steps/MoneyRequestConfirmPage.js
+++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js
@@ -286,11 +286,9 @@ function MoneyRequestConfirmPage(props) {
                     props.iou.amount,
                     trimmedComment,
                     props.iou.currency,
+                    props.iou.merchant,
                     props.iou.category,
                     props.iou.tag,
-                    props.iou.merchant,
-                    props.policyTags,
-                    props.policyCategories,
                 );
                 return;
             }
@@ -324,8 +322,6 @@ function MoneyRequestConfirmPage(props) {
             iouType,
             reportID,
             props.iou.merchant,
-            props.policyTags,
-            props.policyCategories,
         ],
     );
 

From 2e3d3dadb8c5f9ab17c7c9f7a501e2da7aa52c03 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Tue, 13 Feb 2024 11:01:06 -0500
Subject: [PATCH 115/305] Update onyxMethod in IOU.ts

---
 src/libs/actions/IOU.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts
index 14e6612620eb..7381bc5ad196 100644
--- a/src/libs/actions/IOU.ts
+++ b/src/libs/actions/IOU.ts
@@ -475,12 +475,12 @@ function buildOnyxDataForMoneyRequest(
               },
 
         {
-            onyxMethod: Onyx.METHOD.SET,
+            onyxMethod: Onyx.METHOD.MERGE,
             key: `${ONYXKEYS.COLLECTION.REPORT}${transactionThreadReport.reportID}`,
             value: transactionThreadReport,
         },
         {
-            onyxMethod: Onyx.METHOD.SET,
+            onyxMethod: Onyx.METHOD.MERGE,
             key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${transactionThreadReport.reportID}`,
             value: {
                 [transactionThreadCreatedReportAction.reportActionID]: transactionThreadCreatedReportAction,

From 1449800cea264daf969bc9682741ab42f1ca1b4b Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Tue, 13 Feb 2024 12:19:06 -0500
Subject: [PATCH 116/305] Add error handling data for transaction thread report
 and report actions

---
 src/libs/actions/IOU.ts | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts
index 7381bc5ad196..842711a8fde2 100644
--- a/src/libs/actions/IOU.ts
+++ b/src/libs/actions/IOU.ts
@@ -3298,6 +3298,24 @@ function getSendMoneyParams(
                 errors: ErrorUtils.getMicroSecondOnyxError('iou.error.other'),
             },
         },
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.REPORT}${optimisticTransactionThread.reportID}`,
+            value: {
+                errorFields: {
+                    createChat: ErrorUtils.getMicroSecondOnyxError('report.genericCreateReportFailureMessage'),
+                },
+            },
+        },
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${optimisticTransactionThread.reportID}`,
+            value: {
+                [optimisticCreatedActionForTransactionThread.reportActionID]: {
+                    errors: ErrorUtils.getMicroSecondOnyxError('iou.error.genericCreateFailureMessage'),
+                },
+            },
+        },
     ];
 
     let optimisticPersonalDetailListData: OnyxUpdate | EmptyObject = {};

From f13759880581586b68214a3162c7c8b8097aa082 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 14 Feb 2024 08:47:39 +0100
Subject: [PATCH 117/305] add workflows icon

---
 .../simple-illustrations/simple-illustration__workflows.svg     | 1 +
 src/components/Icon/Illustrations.ts                            | 2 ++
 2 files changed, 3 insertions(+)
 create mode 100644 assets/images/simple-illustrations/simple-illustration__workflows.svg

diff --git a/assets/images/simple-illustrations/simple-illustration__workflows.svg b/assets/images/simple-illustrations/simple-illustration__workflows.svg
new file mode 100644
index 000000000000..47d30d54310f
--- /dev/null
+++ b/assets/images/simple-illustrations/simple-illustration__workflows.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="41" height="38" viewBox="0 0 41 38" fill="none"><path d="M25.7122 33.072V36.0237C25.7122 36.7766 25.3142 37.1314 24.5812 37.1314H18.1074C17.7061 37.1314 17.4076 37.022 17.2152 36.8031L17.1854 36.7633C17.0461 36.5842 16.9797 36.3388 16.9797 36.0237V33.072C16.9797 32.3158 17.3777 31.9609 18.1074 31.9609H24.5812C24.9693 31.9609 25.2644 32.0604 25.4535 32.2661V32.2727C25.6259 32.4551 25.7122 32.7204 25.7122 33.072Z" fill="#5AB0FF"/><path d="M25.7122 18.3064V21.2581C25.7122 22.0109 25.3142 22.3658 24.5812 22.3658H18.1074C17.7061 22.3658 17.4076 22.2564 17.2152 22.0375L17.1854 21.9977C17.0461 21.8186 16.9797 21.5732 16.9797 21.2581V18.3064C16.9797 17.5502 17.3777 17.1953 18.1074 17.1953H24.5812C24.9693 17.1953 25.2644 17.2948 25.4535 17.5004V17.5071C25.6259 17.6895 25.7122 17.9548 25.7122 18.3064Z" fill="#5AB0FF"/><path d="M25.7122 3.54464V6.49636C25.7122 7.24922 25.3142 7.60409 24.5812 7.60409H18.1074C17.7061 7.60409 17.4076 7.49464 17.2152 7.27575L17.1854 7.23595C17.0461 7.05686 16.9797 6.81143 16.9797 6.49636V3.54464C16.9797 2.78846 17.3777 2.43359 18.1074 2.43359H24.5812C24.9693 2.43359 25.2644 2.53309 25.4535 2.73872V2.74535C25.6259 2.92776 25.7122 3.19308 25.7122 3.54464Z" fill="#5AB0FF"/><path d="M5.14695 29.6861H2.57C2.1687 29.6861 1.87022 29.5767 1.67786 29.3578L1.64801 29.318C1.50871 29.1389 1.44238 28.8935 1.44238 28.5784V25.6267C1.44238 24.8705 1.84037 24.5156 2.57 24.5156H9.04387C9.43191 24.5156 9.72708 24.6151 9.91612 24.8207V24.8274C10.0886 25.0098 10.1748 25.2751 10.1748 25.6267V28.5784C10.1748 29.3312 9.77683 29.6861 9.04387 29.6861H5.14695Z" fill="#B0D9FF"/><path d="M39.7644 10.861V13.8128C39.7644 14.5656 39.3664 14.9205 38.6335 14.9205H32.1596C31.7583 14.9205 31.4598 14.811 31.2675 14.5922L31.2376 14.5524C31.0983 14.3733 31.032 14.1278 31.032 13.8128V10.861C31.032 10.1049 31.43 9.75 32.1596 9.75H38.6335C39.0215 9.75 39.3167 9.8495 39.5057 10.0551V10.0618C39.6782 10.2442 39.7644 10.5095 39.7644 10.861Z" fill="#B0D9FF"/><path d="M8.4003 3.20818C8.77838 3.71229 9.00059 4.34244 9.00059 5.02233C9.00059 6.7005 7.64081 8.06028 5.96265 8.06028C5.12688 8.06028 4.36408 7.71868 3.81353 7.17145C3.26299 6.6209 2.92139 5.86142 2.92139 5.02233C2.92139 3.34416 4.28448 1.98438 5.95933 1.98438C6.95761 1.98438 7.8398 2.46196 8.39366 3.20486C8.39366 3.20486 8.39698 3.20486 8.39698 3.20818H8.4003Z" fill="#B0D9FF"/><path d="M35.904 34.3095L31.7915 37.49V31.1289L35.904 34.3095Z" fill="#003C73"/><path d="M16.9798 33.0706V36.0223C16.9798 36.3374 17.0494 36.5828 17.1854 36.7619L16.4292 35.7934L16.4027 35.7437C16.3131 35.5779 16.27 35.3689 16.27 35.1135V32.1618C16.27 31.4057 16.668 31.0508 17.3976 31.0508H23.8715C24.2164 31.0508 24.4884 31.1304 24.6774 31.2962L24.7239 31.3426L25.4535 32.268C25.2645 32.0623 24.9693 31.9628 24.5812 31.9628H18.1074C17.3744 31.9628 16.9798 32.3177 16.9798 33.0739V33.0706Z" fill="#003C73"/><path d="M9.04316 24.5103H2.56929C1.83634 24.5103 1.44167 24.8652 1.44167 25.6213V28.5731C1.44167 28.8881 1.51132 29.1336 1.6473 29.3127L0.891127 28.3442L0.864595 28.2945C0.775048 28.1286 0.731934 27.9197 0.731934 27.6643V24.7126C0.731934 23.9564 1.12992 23.6016 1.85955 23.6016H8.33342C8.67834 23.6016 8.9503 23.6812 9.13934 23.847L9.18577 23.8934L9.91541 24.8187C9.72637 24.6131 9.4312 24.5136 9.04316 24.5136V24.5103Z" fill="#003C73"/><path d="M38.7761 9.13229L39.5057 10.0576C39.3167 9.85198 39.0215 9.75248 38.6335 9.75248H32.1596C31.4267 9.75248 31.032 10.1074 31.032 10.8635V13.8152C31.032 14.1303 31.1016 14.3757 31.2376 14.5548L30.4815 13.5864L30.4549 13.5367C30.3654 13.3708 30.3223 13.1619 30.3223 12.9065V9.95479C30.3223 9.19862 30.7202 8.84375 31.4499 8.84375H37.9238C38.2687 8.84375 38.5406 8.92335 38.7297 9.08917L38.7761 9.13561V9.13229Z" fill="#003C73"/><path d="M16.9798 3.5438V6.49553C16.9798 6.8106 17.0494 7.05602 17.1854 7.23512L16.4292 6.26669L16.4027 6.21694C16.3131 6.05111 16.27 5.84217 16.27 5.58679V2.63839C16.27 1.88221 16.668 1.52734 17.3976 1.52734H23.8715C24.2164 1.52734 24.4884 1.60694 24.6774 1.77277L24.7239 1.8192L25.4535 2.74452C25.2645 2.53889 24.9693 2.43939 24.5812 2.43939H18.1074C17.3744 2.43939 16.9798 2.79426 16.9798 3.55044V3.5438Z" fill="#003C73"/><path d="M7.32576 1.89341L7.41531 1.98295C7.89289 2.46053 8.17148 2.84525 8.397 3.20344C7.84314 2.46053 6.96094 1.98295 5.96267 1.98295C4.2845 1.98295 2.92472 3.34605 2.92472 5.02091C2.92472 5.85999 3.26633 6.61948 3.81687 7.17003L3.80361 7.18329C3.33266 6.74219 2.99437 6.26793 2.70915 5.77708C2.3974 5.2995 2.21167 4.72905 2.21167 4.11217C2.21167 2.43732 3.57476 1.07422 5.24961 1.07422C6.0489 1.07422 6.77853 1.38597 7.32245 1.89341H7.32576Z" fill="#003C73"/><path d="M16.9798 18.3088V21.2606C16.9798 21.5756 17.0494 21.8211 17.1854 22.0002L16.4292 21.0317L16.4027 20.982C16.3131 20.8161 16.27 20.6072 16.27 20.3518V17.4001C16.27 16.6439 16.668 16.2891 17.3976 16.2891H23.8715C24.2164 16.2891 24.4884 16.3687 24.6774 16.5345L24.7239 16.5809L25.4535 17.5062C25.2645 17.3006 24.9693 17.2011 24.5812 17.2011H18.1074C17.3744 17.2011 16.9798 17.556 16.9798 18.3122V18.3088Z" fill="#003C73"/><path d="M8.4003 3.20818C8.77838 3.71229 9.00059 4.34244 9.00059 5.02233C9.00059 6.7005 7.64081 8.06028 5.96265 8.06028C5.12688 8.06028 4.36408 7.71868 3.81353 7.17145C3.26299 6.6209 2.92139 5.86142 2.92139 5.02233C2.92139 3.34416 4.28448 1.98438 5.95933 1.98438C6.95761 1.98438 7.8398 2.46196 8.39366 3.20486" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.1106 2.43359H24.5811" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.1106 7.60547H24.5811" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.7122 3.54688V4.78726V6.4986" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.9797 3.54688V6.4986" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.9797 3.54464C16.9797 2.78846 17.3777 2.43359 18.1074 2.43359" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.4535 2.73872C25.2645 2.53309 24.9693 2.43359 24.5813 2.43359" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.7122 3.54538C25.7122 3.19714 25.6259 2.93182 25.4568 2.74609" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M17.2188 7.27734C17.4078 7.49624 17.7096 7.60568 18.1109 7.60568" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.9797 6.49609C16.9797 6.81117 17.0494 7.05659 17.1854 7.23568" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.7122 6.49609C25.7122 7.24895 25.3143 7.60382 24.5813 7.60382" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M2.70915 5.77708C2.3974 5.2995 2.21167 4.72905 2.21167 4.11217C2.21167 2.43732 3.57476 1.07422 5.24961 1.07422C6.0489 1.07422 6.77853 1.38597 7.32244 1.89341" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M17.3979 1.52734H23.8718" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.27 2.64062V5.58903" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.27 2.63839C16.27 1.88221 16.668 1.52734 17.3976 1.52734" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M24.6782 1.76886C24.4892 1.60635 24.2172 1.52344 23.8723 1.52344" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.27 5.58984C16.27 5.84522 16.3165 6.05416 16.4027 6.21999" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.40005 3.20818C8.40005 3.20818 8.40005 3.20818 8.39673 3.20486C8.17121 2.84668 7.89262 2.45864 7.41504 1.98438" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M3.82997 7.20677C3.82997 7.20677 3.81339 7.19019 3.80344 7.18356C3.33249 6.74246 2.99421 6.26819 2.70898 5.77734" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M17.2183 7.27776L17.1884 7.23796L16.429 6.26953" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.4573 2.74504L25.454 2.73841L24.7244 1.81641" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M32.1599 9.75H38.6338" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M32.1599 14.9219H35.3305H38.6338" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M39.7612 10.8633V13.815" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M31.032 10.8633V13.815" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M31.032 10.861C31.032 10.1049 31.43 9.75 32.1596 9.75" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M39.5058 10.0551C39.3167 9.8495 39.0216 9.75 38.6335 9.75" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M39.7644 10.8618C39.7644 10.5135 39.6782 10.2482 39.509 10.0625" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M31.2678 14.5938C31.4569 14.8126 31.7587 14.9221 32.16 14.9221" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M31.032 13.8125C31.032 14.1276 31.1016 14.373 31.2376 14.5521" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M39.7645 13.8125C39.7645 14.5654 39.3665 14.9202 38.6335 14.9202" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M31.4465 8.84375H35.1677H37.9204" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M30.3193 9.95703V12.9088" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M30.3193 9.95479C30.3193 9.19862 30.7173 8.84375 31.447 8.84375" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M38.7266 9.08527C38.5375 8.92276 38.2656 8.83984 37.9207 8.83984" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M30.3193 12.9062C30.3193 13.1616 30.3658 13.3706 30.452 13.5364" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M31.2672 14.5942L31.2374 14.5544L30.4812 13.5859" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M39.5088 10.0614L39.5055 10.0548L38.7759 9.13281" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M2.56958 24.5117H9.04345" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M2.56958 29.6875H5.14652H9.04345" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M10.1711 25.625V28.5767" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M1.44238 25.625V28.5767" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M1.44238 25.6228C1.44238 24.8666 1.84037 24.5117 2.57 24.5117" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M9.91619 24.8207C9.72715 24.6151 9.43198 24.5156 9.04395 24.5156" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M10.1748 25.6235C10.1748 25.2753 10.0886 25.0099 9.91943 24.8242" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M1.67749 29.3594C1.86653 29.5783 2.16834 29.6877 2.56964 29.6877" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M1.44238 28.5742C1.44238 28.8893 1.51203 29.1347 1.64801 29.3138" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M10.1749 28.5742C10.1749 29.3271 9.7769 29.6819 9.04395 29.6819" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M1.85693 23.6055H5.30944H8.3308" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.729004 24.7188V27.6705" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.729004 24.7165C0.729004 23.9603 1.12699 23.6055 1.85662 23.6055" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M9.13624 23.8509C8.9472 23.6884 8.67524 23.6055 8.33032 23.6055" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.729004 27.668C0.729004 27.9233 0.775435 28.1323 0.861665 28.2981" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M1.67786 29.3559L1.64801 29.3128L0.891846 28.3477" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M9.91923 24.8265L9.91592 24.8198L9.18628 23.8945" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.1106 17.1953H24.5811" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.1106 22.3672H24.5811" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.7122 18.3086V21.2603" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.9797 18.3086V21.2603" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.9797 18.3064C16.9797 17.5502 17.3777 17.1953 18.1074 17.1953" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.4535 17.5043C25.2645 17.2987 24.9693 17.1992 24.5813 17.1992" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.7122 18.3071C25.7122 17.9589 25.6259 17.6935 25.4568 17.5078" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M17.2188 22.043C17.4078 22.2619 17.7096 22.3713 18.1109 22.3713" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.9797 21.2578C16.9797 21.5729 17.0494 21.8183 17.1854 21.9974" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.7122 21.2578C25.7122 22.0107 25.3143 22.3655 24.5813 22.3655" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M17.3979 16.2891H23.8718" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.27 17.4023V20.3541" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.27 17.4001C16.27 16.6439 16.668 16.2891 17.3976 16.2891" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M24.6782 16.5345C24.4892 16.372 24.2172 16.2891 23.8723 16.2891" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.27 20.3516C16.27 20.6069 16.3165 20.8159 16.4027 20.9817" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M17.2183 22.0395L17.1884 21.9964L16.429 21.0312" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.4573 17.5101L25.454 17.5034L24.7244 16.5781" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.1106 31.957H24.5811" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.1106 37.1328H24.5811" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.7122 33.0703V36.0187" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.9797 33.0703V36.0187" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.9797 33.072C16.9797 32.3158 17.3777 31.9609 18.1074 31.9609" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.4535 32.2661C25.2645 32.0604 24.9693 31.9609 24.5813 31.9609" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.7122 33.0727C25.7122 32.7245 25.6259 32.4592 25.4568 32.2734" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M17.2188 36.8047C17.4078 37.0236 17.7096 37.133 18.1109 37.133" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.9797 36.0195C16.9797 36.3346 17.0494 36.58 17.1854 36.7591" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.7122 36.0195C25.7122 36.7724 25.3143 37.1273 24.5813 37.1273" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M17.3979 31.0508H23.8718" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.27 32.1641V35.1158" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.27 32.1618C16.27 31.4057 16.668 31.0508 17.3976 31.0508" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M24.6782 31.2962C24.4892 31.1337 24.2172 31.0508 23.8723 31.0508" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M16.27 35.1133C16.27 35.3687 16.3165 35.5776 16.4027 35.7434" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M17.2183 36.8051L17.1884 36.762L16.429 35.7969" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.4573 32.2718L25.454 32.2652L24.7244 31.3398" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M10.1748 19.5469H16.1512" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.7122 19.5469H30.4515" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M9.00098 4.78516H16.1945" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.7122 4.78516H30.4515" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M10.1748 34.3086H16.1512" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M25.8982 34.3086H31.6955" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M35.1676 8.84461C34.4247 6.54293 32.8527 4.78516 30.4548 4.78516" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M30.4519 19.5485C33.0454 19.5485 34.6705 17.4988 35.3305 14.9219" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M5.30908 23.6063C6.0553 21.3046 7.62402 19.5469 10.0219 19.5469" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M10.0219 34.3078C7.4284 34.3078 5.8033 32.2582 5.14663 29.6812C5.14663 29.6779 5.14663 29.6713 5.14331 29.668" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M31.7915 31.1289V37.49" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M31.7915 31.1289L35.904 34.3095" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/><path d="M31.7915 37.4892L35.904 34.3086" stroke="#003C73" stroke-linecap="round" stroke-linejoin="round"/></svg>
\ No newline at end of file
diff --git a/src/components/Icon/Illustrations.ts b/src/components/Icon/Illustrations.ts
index 211ae16f40cf..a69859974fc5 100644
--- a/src/components/Icon/Illustrations.ts
+++ b/src/components/Icon/Illustrations.ts
@@ -66,6 +66,7 @@ import TreasureChest from '@assets/images/simple-illustrations/simple-illustrati
 import Approval from '@assets/images/simple-illustrations/simple-illustration__approval.svg';
 import ReceiptEnvelope from '@assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg';
 import WalletAlt from '@assets/images/simple-illustrations/simple-illustration__wallet-alt.svg';
+import Workflows from '@assets/images/simple-illustrations/simple-illustration__workflows.svg';
 
 export {
     Abracadabra,
@@ -136,4 +137,5 @@ export {
     ReceiptEnvelope,
     Approval,
     WalletAlt,
+    Workflows,
 };

From 6de537f022f587b7c58e5805ea11db0a84d89615 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 14 Feb 2024 08:59:10 +0100
Subject: [PATCH 118/305] remove unneeded imports

---
 src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 94c07d0bfdc8..b04d1937ba58 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -1,8 +1,6 @@
 import Switch from "@components/Switch";
 import Text from "@components/Text";
-import useLocalize from "@hooks/useLocalize";
 import useThemeStyles from "@hooks/useThemeStyles";
-import { TranslationPaths } from "@src/languages/types";
 import React, { useState } from "react";
 import { View } from "react-native";
 import { SvgProps } from "react-native-svg";
@@ -17,7 +15,6 @@ export type OptionType = {
 
 const ToggleSettingOptionRow = ({ Illustration, title, subtitle, onToggle, subMenuItems }: OptionType) => {
     const [isEnabled, setIsEnabled] = useState(false);
-    const { translate } = useLocalize();
     const styles = useThemeStyles();
   
     const toggleSwitch = () => {

From 763c8ff572430936aff93506e2aeb3d284928391 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 14 Feb 2024 08:59:32 +0100
Subject: [PATCH 119/305] add icon property

---
 src/pages/workspace/WorkspacePageWithSections.tsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/pages/workspace/WorkspacePageWithSections.tsx b/src/pages/workspace/WorkspacePageWithSections.tsx
index 17163346473f..eabfcf147573 100644
--- a/src/pages/workspace/WorkspacePageWithSections.tsx
+++ b/src/pages/workspace/WorkspacePageWithSections.tsx
@@ -23,6 +23,7 @@ import type {Policy, ReimbursementAccount, User} from '@src/types/onyx';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
 import type {WithPolicyAndFullscreenLoadingProps} from './withPolicyAndFullscreenLoading';
 import withPolicyAndFullscreenLoading from './withPolicyAndFullscreenLoading';
+import IconAsset from '@src/types/utils/IconAsset';
 
 type WorkspacePageWithSectionsOnyxProps = {
     /** From Onyx */
@@ -46,6 +47,9 @@ type WorkspacePageWithSectionsProps = WithPolicyAndFullscreenLoadingProps &
         /** Content to be added as fixed footer */
         footer?: ReactNode;
 
+        /** The icon to display in the header */
+        icon?: IconAsset;
+
         /** The guides call task ID to associate with the workspace page being shown */
         guidesCallTaskID: string;
 
@@ -83,6 +87,7 @@ function WorkspacePageWithSections({
     backButtonRoute,
     children = () => null,
     footer = null,
+    icon = undefined,
     guidesCallTaskID = '',
     headerText,
     policy,
@@ -155,6 +160,7 @@ function WorkspacePageWithSections({
                     guidesCallTaskID={guidesCallTaskID}
                     shouldShowBackButton={isSmallScreenWidth || shouldShowBackButton}
                     onBackButtonPress={() => Navigation.goBack(backButtonRoute ?? ROUTES.WORKSPACE_INITIAL.getRoute(policyID))}
+                    icon={icon ?? undefined}
                 />
                 {(isLoading || firstRender.current) && shouldShowLoading ? (
                     <FullScreenLoadingIndicator style={[styles.flex1, styles.pRelative]} />

From 8335949017a7bebbc85b5fdaa71fb4c118ae7a34 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 14 Feb 2024 08:59:42 +0100
Subject: [PATCH 120/305] use workflows icon

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 6a18ec780d43..740e3b300614 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -85,6 +85,7 @@ const WorkspaceWorkflowsPage: React.FC<WorkspaceWorkflowsPageProps> = ({route})
         <WorkspacePageWithSections
             shouldUseScrollView
             headerText={translate('workspace.common.workflows')}
+            icon={Illustrations.Workflows}
             route={route}
             guidesCallTaskID={CONST.GUIDES_CALL_TASK_IDS.WORKSPACE_WORKFLOWS}
             shouldShowOfflineIndicatorInWideScreen

From 45d4052569a95031b45679f6fcb4a64265417ff1 Mon Sep 17 00:00:00 2001
From: Yauheni Pasiukevich <pasyukevich@live.com>
Date: Wed, 14 Feb 2024 15:12:03 +0100
Subject: [PATCH 121/305] [TS migration] Migrate 'ReportActionsUtilsTest.js'
 test to TypeScript

---
 src/libs/ReportActionsUtils.ts                |   4 +-
 ...UtilsTest.js => ReportActionsUtilsTest.ts} | 328 +++++++++++++++---
 2 files changed, 282 insertions(+), 50 deletions(-)
 rename tests/unit/{ReportActionsUtilsTest.js => ReportActionsUtilsTest.ts} (56%)

diff --git a/src/libs/ReportActionsUtils.ts b/src/libs/ReportActionsUtils.ts
index 3658fb53a722..cda382580bed 100644
--- a/src/libs/ReportActionsUtils.ts
+++ b/src/libs/ReportActionsUtils.ts
@@ -459,7 +459,7 @@ function replaceBaseURLInPolicyChangeLogAction(reportAction: ReportAction): Repo
     return updatedReportAction;
 }
 
-function getLastVisibleAction(reportID: string, actionsToMerge: OnyxCollection<ReportAction> = {}): OnyxEntry<ReportAction> {
+function getLastVisibleAction(reportID: string | number, actionsToMerge: OnyxCollection<ReportAction> = {}): OnyxEntry<ReportAction> {
     const reportActions = Object.values(fastMerge(allReportActions?.[reportID] ?? {}, actionsToMerge ?? {}, true));
     const visibleReportActions = Object.values(reportActions ?? {}).filter((action): action is ReportAction => shouldReportActionBeVisibleAsLastAction(action));
     const sortedReportActions = getSortedReportActions(visibleReportActions, true);
@@ -511,7 +511,7 @@ function filterOutDeprecatedReportActions(reportActions: ReportActions | null):
  * to ensure they will always be displayed in the same order (in case multiple actions have the same timestamp).
  * This is all handled with getSortedReportActions() which is used by several other methods to keep the code DRY.
  */
-function getSortedReportActionsForDisplay(reportActions: ReportActions | null, shouldMarkTheFirstItemAsNewest = false): ReportAction[] {
+function getSortedReportActionsForDisplay(reportActions: ReportActions | ReportAction[] | null, shouldMarkTheFirstItemAsNewest = false): ReportAction[] {
     const filteredReportActions = Object.entries(reportActions ?? {})
         .filter(([key, reportAction]) => shouldReportActionBeVisible(reportAction, key))
         .map((entry) => entry[1]);
diff --git a/tests/unit/ReportActionsUtilsTest.js b/tests/unit/ReportActionsUtilsTest.ts
similarity index 56%
rename from tests/unit/ReportActionsUtilsTest.js
rename to tests/unit/ReportActionsUtilsTest.ts
index 19a89d1c892c..e3d6e50aa716 100644
--- a/tests/unit/ReportActionsUtilsTest.js
+++ b/tests/unit/ReportActionsUtilsTest.ts
@@ -2,6 +2,7 @@ import Onyx from 'react-native-onyx';
 import CONST from '../../src/CONST';
 import * as ReportActionsUtils from '../../src/libs/ReportActionsUtils';
 import ONYXKEYS from '../../src/ONYXKEYS';
+import type {Report, ReportAction} from '../../src/types/onyx';
 import * as LHNTestUtils from '../utils/LHNTestUtils';
 import waitForBatchedUpdates from '../utils/waitForBatchedUpdates';
 import wrapOnyxWithWaitForBatchedUpdates from '../utils/wrapOnyxWithWaitForBatchedUpdates';
@@ -10,7 +11,6 @@ describe('ReportActionsUtils', () => {
     beforeAll(() =>
         Onyx.init({
             keys: ONYXKEYS,
-            registerStorageEventListener: () => {},
             safeEvictionKeys: [ONYXKEYS.COLLECTION.REPORT_ACTIONS],
         }),
     );
@@ -36,11 +36,19 @@ describe('ReportActionsUtils', () => {
                         created: '2022-11-09 22:27:01.825',
                         reportActionID: '8401445780099176',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                     {
                         created: '2022-11-09 22:27:01.600',
                         reportActionID: '6401435781022176',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
 
                     // These reportActions were created in the same millisecond so should appear ordered by reportActionID
@@ -48,16 +56,28 @@ describe('ReportActionsUtils', () => {
                         created: '2022-11-09 22:26:48.789',
                         reportActionID: '2962390724708756',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                     {
                         created: '2022-11-09 22:26:48.789',
                         reportActionID: '1609646094152486',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                     {
                         created: '2022-11-09 22:26:48.789',
                         reportActionID: '1661970171066218',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                 ],
                 [
@@ -65,26 +85,46 @@ describe('ReportActionsUtils', () => {
                         created: '2022-11-09 22:26:48.789',
                         reportActionID: '1609646094152486',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                     {
                         created: '2022-11-09 22:26:48.789',
                         reportActionID: '1661970171066218',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                     {
                         created: '2022-11-09 22:26:48.789',
                         reportActionID: '2962390724708756',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                     {
                         created: '2022-11-09 22:27:01.600',
                         reportActionID: '6401435781022176',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                     {
                         created: '2022-11-09 22:27:01.825',
                         reportActionID: '8401445780099176',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                 ],
             ],
@@ -95,16 +135,28 @@ describe('ReportActionsUtils', () => {
                         created: '2023-01-10 22:25:47.132',
                         reportActionID: '3',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                     {
                         created: '2023-01-10 22:25:47.132',
                         reportActionID: '2',
                         actionName: CONST.REPORT.ACTIONS.TYPE.CREATED,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                     {
                         created: '2023-01-10 22:25:47.132',
                         reportActionID: '1',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                 ],
                 [
@@ -113,16 +165,28 @@ describe('ReportActionsUtils', () => {
                         created: '2023-01-10 22:25:47.132',
                         reportActionID: '2',
                         actionName: CONST.REPORT.ACTIONS.TYPE.CREATED,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                     {
                         created: '2023-01-10 22:25:47.132',
                         reportActionID: '1',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                     {
                         created: '2023-01-10 22:25:47.132',
                         reportActionID: '3',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
                     },
                 ],
             ],
@@ -141,48 +205,100 @@ describe('ReportActionsUtils', () => {
 
     describe('getSortedReportActionsForDisplay', () => {
         it('should filter out non-whitelisted actions', () => {
-            const input = [
+            const input: ReportAction[] = [
                 {
                     created: '2022-11-13 22:27:01.825',
                     reportActionID: '8401445780099176',
                     actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
-                    message: [{html: 'Hello world'}],
+                    originalMessage: {
+                        html: 'Hello world',
+                        whisperedTo: [],
+                    },
+                    message: [
+                        {
+                            html: 'Hello world',
+                            type: 'Action type',
+                            text: 'Action text',
+                        },
+                    ],
                 },
                 {
                     created: '2022-11-12 22:27:01.825',
                     reportActionID: '6401435781022176',
                     actionName: CONST.REPORT.ACTIONS.TYPE.CREATED,
-                    message: [{html: 'Hello world'}],
+                    originalMessage: {
+                        html: 'Hello world',
+                        whisperedTo: [],
+                    },
+                    message: [
+                        {
+                            html: 'Hello world',
+                            type: 'Action type',
+                            text: 'Action text',
+                        },
+                    ],
                 },
                 {
                     created: '2022-11-11 22:27:01.825',
                     reportActionID: '2962390724708756',
                     actionName: CONST.REPORT.ACTIONS.TYPE.IOU,
-                    message: [{html: 'Hello world'}],
+                    originalMessage: {
+                        amount: 0,
+                        currency: 'USD',
+                        type: 'split', // change to const
+                    },
+                    message: [
+                        {
+                            html: 'Hello world',
+                            type: 'Action type',
+                            text: 'Action text',
+                        },
+                    ],
                 },
                 {
                     created: '2022-11-10 22:27:01.825',
                     reportActionID: '1609646094152486',
                     actionName: CONST.REPORT.ACTIONS.TYPE.RENAMED,
-                    message: [{html: 'Hello world'}],
+                    originalMessage: {
+                        html: 'Hello world',
+                        lastModified: '2022-11-10 22:27:01.825',
+                        oldName: 'old name',
+                        newName: 'new name',
+                    },
+                    message: [
+                        {
+                            html: 'Hello world',
+                            type: 'Action type',
+                            text: 'Action text',
+                        },
+                    ],
                 },
                 {
                     created: '2022-11-09 22:27:01.825',
                     reportActionID: '8049485084562457',
                     actionName: CONST.REPORT.ACTIONS.TYPE.POLICYCHANGELOG.UPDATE_FIELD,
-                    message: [{html: 'updated the Approval Mode from "Submit and Approve" to "Submit and Close"'}],
+                    originalMessage: {},
+                    message: [{html: 'updated the Approval Mode from "Submit and Approve" to "Submit and Close"', type: 'Action type', text: 'Action text'}],
                 },
                 {
                     created: '2022-11-08 22:27:06.825',
                     reportActionID: '1661970171066216',
                     actionName: CONST.REPORT.ACTIONS.TYPE.REIMBURSEMENTQUEUED,
-                    message: [{html: 'Waiting for the bank account'}],
+                    originalMessage: {
+                        html: 'Hello world',
+                        whisperedTo: [],
+                    },
+                    message: [{html: 'Waiting for the bank account', type: 'Action type', text: 'Action text'}],
                 },
                 {
                     created: '2022-11-06 22:27:08.825',
                     reportActionID: '1661970171066220',
                     actionName: CONST.REPORT.ACTIONS.TYPE.TASKEDITED,
-                    message: [{html: 'I have changed the task'}],
+                    originalMessage: {
+                        html: 'Hello world',
+                        whisperedTo: [],
+                    },
+                    message: [{html: 'I have changed the task', type: 'Action type', text: 'Action text'}],
                 },
             ];
 
@@ -193,48 +309,100 @@ describe('ReportActionsUtils', () => {
 
         describe('getSortedReportActionsForDisplay with marked the first reportAction', () => {
             it('should filter out non-whitelisted actions', () => {
-                const input = [
+                const input: ReportAction[] = [
                     {
                         created: '2022-11-13 22:27:01.825',
                         reportActionID: '8401445780099176',
                         actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
-                        message: [{html: 'Hello world'}],
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
+                        message: [
+                            {
+                                html: 'Hello world',
+                                type: 'Action type',
+                                text: 'Action text',
+                            },
+                        ],
                     },
                     {
                         created: '2022-11-12 22:27:01.825',
                         reportActionID: '6401435781022176',
                         actionName: CONST.REPORT.ACTIONS.TYPE.CREATED,
-                        message: [{html: 'Hello world'}],
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
+                        message: [
+                            {
+                                html: 'Hello world',
+                                type: 'Action type',
+                                text: 'Action text',
+                            },
+                        ],
                     },
                     {
                         created: '2022-11-11 22:27:01.825',
                         reportActionID: '2962390724708756',
                         actionName: CONST.REPORT.ACTIONS.TYPE.IOU,
-                        message: [{html: 'Hello world'}],
+                        originalMessage: {
+                            amount: 0,
+                            currency: 'USD',
+                            type: 'split', // change to const
+                        },
+                        message: [
+                            {
+                                html: 'Hello world',
+                                type: 'Action type',
+                                text: 'Action text',
+                            },
+                        ],
                     },
                     {
                         created: '2022-11-10 22:27:01.825',
                         reportActionID: '1609646094152486',
                         actionName: CONST.REPORT.ACTIONS.TYPE.RENAMED,
-                        message: [{html: 'Hello world'}],
+                        originalMessage: {
+                            html: 'Hello world',
+                            lastModified: '2022-11-10 22:27:01.825',
+                            oldName: 'old name',
+                            newName: 'new name',
+                        },
+                        message: [
+                            {
+                                html: 'Hello world',
+                                type: 'Action type',
+                                text: 'Action text',
+                            },
+                        ],
                     },
                     {
                         created: '2022-11-09 22:27:01.825',
                         reportActionID: '8049485084562457',
                         actionName: CONST.REPORT.ACTIONS.TYPE.POLICYCHANGELOG.UPDATE_FIELD,
-                        message: [{html: 'updated the Approval Mode from "Submit and Approve" to "Submit and Close"'}],
+                        originalMessage: {},
+                        message: [{html: 'updated the Approval Mode from "Submit and Approve" to "Submit and Close"', type: 'Action type', text: 'Action text'}],
                     },
                     {
                         created: '2022-11-08 22:27:06.825',
                         reportActionID: '1661970171066216',
                         actionName: CONST.REPORT.ACTIONS.TYPE.REIMBURSEMENTQUEUED,
-                        message: [{html: 'Waiting for the bank account'}],
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
+                        message: [{html: 'Waiting for the bank account', type: 'Action type', text: 'Action text'}],
                     },
                     {
                         created: '2022-11-06 22:27:08.825',
                         reportActionID: '1661970171066220',
                         actionName: CONST.REPORT.ACTIONS.TYPE.TASKEDITED,
-                        message: [{html: 'I have changed the task'}],
+                        originalMessage: {
+                            html: 'Hello world',
+                            whisperedTo: [],
+                        },
+                        message: [{html: 'I have changed the task', type: 'Action type', text: 'Action text'}],
                     },
                 ];
 
@@ -251,36 +419,89 @@ describe('ReportActionsUtils', () => {
         });
 
         it('should filter out closed actions', () => {
-            const input = [
+            const input: ReportAction[] = [
                 {
                     created: '2022-11-13 22:27:01.825',
                     reportActionID: '8401445780099176',
                     actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
-                    message: [{html: 'Hello world'}],
+                    originalMessage: {
+                        html: 'Hello world',
+                        whisperedTo: [],
+                    },
+                    message: [
+                        {
+                            html: 'Hello world',
+                            type: 'Action type',
+                            text: 'Action text',
+                        },
+                    ],
                 },
                 {
                     created: '2022-11-12 22:27:01.825',
                     reportActionID: '6401435781022176',
                     actionName: CONST.REPORT.ACTIONS.TYPE.CREATED,
-                    message: [{html: 'Hello world'}],
+                    originalMessage: {
+                        html: 'Hello world',
+                        whisperedTo: [],
+                    },
+                    message: [
+                        {
+                            html: 'Hello world',
+                            type: 'Action type',
+                            text: 'Action text',
+                        },
+                    ],
                 },
                 {
                     created: '2022-11-11 22:27:01.825',
                     reportActionID: '2962390724708756',
                     actionName: CONST.REPORT.ACTIONS.TYPE.IOU,
-                    message: [{html: 'Hello world'}],
+                    originalMessage: {
+                        amount: 0,
+                        currency: 'USD',
+                        type: 'split', // change to const
+                    },
+                    message: [
+                        {
+                            html: 'Hello world',
+                            type: 'Action type',
+                            text: 'Action text',
+                        },
+                    ],
                 },
                 {
                     created: '2022-11-10 22:27:01.825',
                     reportActionID: '1609646094152486',
                     actionName: CONST.REPORT.ACTIONS.TYPE.RENAMED,
-                    message: [{html: 'Hello world'}],
+                    originalMessage: {
+                        html: 'Hello world',
+                        lastModified: '2022-11-10 22:27:01.825',
+                        oldName: 'old name',
+                        newName: 'new name',
+                    },
+                    message: [
+                        {
+                            html: 'Hello world',
+                            type: 'Action type',
+                            text: 'Action text',
+                        },
+                    ],
                 },
                 {
                     created: '2022-11-09 22:27:01.825',
                     reportActionID: '1661970171066218',
                     actionName: CONST.REPORT.ACTIONS.TYPE.CLOSED,
-                    message: [{html: 'Hello world'}],
+                    originalMessage: {
+                        policyName: 'default', // change to const
+                        reason: 'default', // change to const
+                    },
+                    message: [
+                        {
+                            html: 'Hello world',
+                            type: 'Action type',
+                            text: 'Action text',
+                        },
+                    ],
                 },
             ];
             const result = ReportActionsUtils.getSortedReportActionsForDisplay(input);
@@ -289,25 +510,43 @@ describe('ReportActionsUtils', () => {
         });
 
         it('should filter out deleted, non-pending comments', () => {
-            const input = [
+            const input: ReportAction[] = [
                 {
                     created: '2022-11-13 22:27:01.825',
                     reportActionID: '8401445780099176',
                     actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
-                    message: [{html: 'Hello world'}],
+                    originalMessage: {
+                        html: 'Hello world',
+                        whisperedTo: [],
+                    },
+                    message: [
+                        {
+                            html: 'Hello world',
+                            type: 'Action type',
+                            text: 'Action text',
+                        },
+                    ],
                 },
                 {
                     created: '2022-11-12 22:27:01.825',
                     reportActionID: '8401445780099175',
                     actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
-                    message: [{html: ''}],
+                    originalMessage: {
+                        html: 'Hello world',
+                        whisperedTo: [],
+                    },
+                    message: [{html: '', type: 'Action type', text: 'Action text'}],
                     pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE,
                 },
                 {
                     created: '2022-11-11 22:27:01.825',
                     reportActionID: '8401445780099174',
                     actionName: CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT,
-                    message: [{html: ''}],
+                    originalMessage: {
+                        html: 'Hello world',
+                        whisperedTo: [],
+                    },
+                    message: [{html: '', type: 'Action type', text: 'Action text'}],
                 },
             ];
             const result = ReportActionsUtils.getSortedReportActionsForDisplay(input);
@@ -318,42 +557,35 @@ describe('ReportActionsUtils', () => {
 
     describe('getLastVisibleAction', () => {
         it('should return the last visible action for a report', () => {
-            const report = {
-                ...LHNTestUtils.getFakeReport(['email1@test.com', 'email2@test.com'], 3, true),
-                reportID: 1,
+            const report: Report = {
+                ...LHNTestUtils.getFakeReport([8401445480599174, 9401445480599174], 3, true),
+                reportID: '1',
             };
-            const action = {
-                ...LHNTestUtils.getFakeReportAction('email1@test.com', 3, true),
+            const action: ReportAction = {
+                ...LHNTestUtils.getFakeReportAction('email1@test.com', 3),
                 created: '2023-08-01 16:00:00',
                 reportActionID: 'action1',
                 actionName: 'ADDCOMMENT',
                 originalMessage: {
-                    policyName: 'Vikings Policy',
-                    reason: 'policyDeleted',
-                },
-                message: {
-                    policyName: 'Vikings Policy',
-                    reason: 'policyDeleted',
+                    html: 'Hello world',
+                    whisperedTo: [],
                 },
             };
-            const action2 = {
-                ...LHNTestUtils.getFakeReportAction('email2@test.com', 3, true),
+            const action2: ReportAction = {
+                ...LHNTestUtils.getFakeReportAction('email2@test.com', 3),
                 created: '2023-08-01 18:00:00',
                 reportActionID: 'action2',
                 actionName: 'ADDCOMMENT',
                 originalMessage: {
-                    policyName: 'Vikings Policy',
-                    reason: 'policyDeleted',
-                },
-                message: {
-                    policyName: 'Vikings Policy',
-                    reason: 'policyDeleted',
+                    html: 'Hello world',
+                    whisperedTo: [],
                 },
             };
             return (
                 waitForBatchedUpdates()
                     // When Onyx is updated with the data and the sidebar re-renders
                     .then(() =>
+                        // @ts-expect-error Preset necessary values
                         Onyx.multiSet({
                             [`${ONYXKEYS.COLLECTION.REPORT}${report.reportID}`]: report,
                             [`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report.reportID}`]: {[action.reportActionID]: action, [action2.reportActionID]: action2},
@@ -361,9 +593,9 @@ describe('ReportActionsUtils', () => {
                     )
                     .then(
                         () =>
-                            new Promise((resolve) => {
+                            new Promise<void>((resolve) => {
                                 const connectionID = Onyx.connect({
-                                    key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report.reportID}`,
+                                    key: 'reportActions_test',
                                     waitForCollectionCallback: true,
                                     callback: () => {
                                         Onyx.disconnect(connectionID);

From 92d0ce7efe851dcea2d9cba78a96c831b1697ae7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 14 Feb 2024 18:18:35 +0100
Subject: [PATCH 122/305] add new workflows translation keys

---
 src/languages/en.ts | 11 ++++++++++-
 src/languages/es.ts | 11 ++++++++++-
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index f36ffefe8fb7..d35b377a376e 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -998,7 +998,16 @@ export default {
         workflowDescription: 'Configure a workflow from the moment spend occurs, including approval and payment.',
         delaySubmissionTitle: 'Delay submissions',
         delaySubmissionDescription: 'Set a slower cadence to receive expense submissions.',
-        addApprovalsTitle: 'Add approval',
+        submissionFrequency: 'Submission frequency',
+        weeklyFrequency: 'Weekly',
+        monthlyFrequency: 'Monthly',
+        twiceAMonthFrequency: 'Twice a month',
+        byTripFrequency: 'By trip',
+        manuallyFrequency: 'Manually',
+        dailyFrequency: 'Daily',
+        addApprovalsTitle: 'Add approvals',
+        approver: 'Approver',
+        connectBankAccount: 'Connect bank account',
         addApprovalsDescription: 'Set a slower cadence to receive expense submissions in real time.',
         makeOrTrackPaymentsTitle: 'Make or track payments',
         makeOrTrackPaymentsDescription: 'Add an authorized payer for payments made in Expensify, or simply track payments made elsewhere.',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index b6c73e2e53d7..e43a857d5087 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -994,7 +994,16 @@ export default {
         workflowDescription: 'Configure un flujo de trabajo desde el momento en que se produce el gasto, incluida la aprobación y el pago.',
         delaySubmissionTitle: 'Retrasar las presentaciones',
         delaySubmissionDescription: 'Establezca una cadencia más lenta para recibir los envíos de gastos.',
-        addApprovalsTitle: 'Añadir aprobación',
+        addApprovalsTitle: 'Añadir aprobacións',
+        approver: 'Aprobador',
+        submissionFrequency: 'Frecuencia de envío',
+        weeklyFrequency: 'Semanal',
+        monthlyFrequency: 'Mensual',
+        twiceAMonthFrequency: 'Dos veces al mes',
+        byTripFrequency: 'Por viaje',
+        manuallyFrequency: 'Manualmente',
+        dailyFrequency: 'Diario',
+        connectBankAccount: 'Conectar cuenta bancaria',
         addApprovalsDescription: 'Establezca una cadencia más lenta para recibir los envíos de gastos en tiempo real.',
         makeOrTrackPaymentsTitle: 'Realizar o seguir pagos',
         makeOrTrackPaymentsDescription: 'Añada un pagador autorizado para los pagos realizados en Expensify, o simplemente realice un seguimiento de los pagos realizados en otro lugar.',

From 93dc0630be927d9bfc01956677a881b6e3c7b9e3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 14 Feb 2024 18:18:49 +0100
Subject: [PATCH 123/305] update workflows styles

---
 src/styles/index.ts | 24 +++++++++++++++++++-----
 1 file changed, 19 insertions(+), 5 deletions(-)

diff --git a/src/styles/index.ts b/src/styles/index.ts
index 0d0d454fcb28..7076dd455e47 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4453,10 +4453,11 @@ const styles = (theme: ThemeColors) =>
         workspaceWorkflowContent: {
             flexDirection: 'row', 
             alignItems: 'center',
+            flex: 1,
         },
         workspaceWorkflowContainer: {
             flexDirection: 'row',
-            alignItems: 'center',
+            alignItems: 'flex-start',
             justifyContent: 'space-between',
         },
         workspaceWorkflowsHeading: {
@@ -4465,16 +4466,29 @@ const styles = (theme: ThemeColors) =>
         },
         workspaceWorkflowsWrapperText: {
             flexDirection: 'column',
-            maxWidth: 486,
+            flex: 1,
         },
         workspaceWorkflowsSubtitle: {
             fontSize: 13,
             color: theme.textSupporting,
             marginTop: 3,
         },
-        workspaceWorkflowsIllustrationContainer: {
-            justifyContent: 'center',
-            alignItems: 'center',
+        workspaceWorkflowsSubMenuContainer: {
+            ...spacing.ph8,
+            ...spacing.mhn8,
+            width: 'auto',
+            marginLeft: 29
+        },
+        workspaceWorkflowsSubMenuTitle: {
+            color: theme.textSupporting,
+            fontSize: 13,
+            lineHeight: 16,
+            fontWeight: '400',
+        },
+        workspaceWorkflowsSubMenuDescription: {
+            color: theme.text,
+            fontSize: 15,
+            lineHeight: 20
         },
     } satisfies Styles);
 

From 343c2de0418053d2be2ff3fc5be8def6fcfa2f03 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 14 Feb 2024 18:18:59 +0100
Subject: [PATCH 124/305] render sub items correctly

---
 .../workflows/ToggleSettingsOptionRow.tsx     | 36 +++++++++++--------
 1 file changed, 21 insertions(+), 15 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index b04d1937ba58..8365b2b65f57 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -23,24 +23,30 @@ const ToggleSettingOptionRow = ({ Illustration, title, subtitle, onToggle, subMe
     };
   
     return (
-    <View style={styles.workspaceWorkflowContainer}>        
-        <View style={styles.workspaceWorkflowContent}>
-            <View style={styles.workspaceWorkflowsIllustrationContainer}>
-                <Illustration style={styles.workspaceWorkflowsIcon} />
+    <View>   
+        <View style={styles.workspaceWorkflowContainer}>        
+            <View style={styles.workspaceWorkflowContent}>
+                <View>
+                    <Illustration style={styles.workspaceWorkflowsIcon} />
+                </View>
+                <View style={styles.workspaceWorkflowsWrapperText}>
+                    <Text style={styles.workspaceWorkflowsHeading}>{title}</Text>
+                    <Text style={styles.workspaceWorkflowsSubtitle}>{subtitle}</Text>
+                </View>
             </View>
-            <View style={styles.workspaceWorkflowsWrapperText}>
-                <Text style={styles.workspaceWorkflowsHeading}>{title}</Text>
-                <Text style={styles.workspaceWorkflowsSubtitle}>{subtitle}</Text>
+            <View>
+                <Switch
+                    accessibilityLabel={subtitle}
+                    onToggle={toggleSwitch}
+                    isOn={isEnabled}
+                />
             </View>
         </View>
-        <View>
-            <Switch
-                accessibilityLabel={subtitle}
-                onToggle={toggleSwitch}
-                isOn={isEnabled}
-            />
-        </View>
-            {isEnabled && subMenuItems}
+        {isEnabled && (
+            <View>
+                {subMenuItems}
+            </View>
+        )}
     </View>
     );
   };

From 23727e274af21680ee94dc3a02e95491050c57c0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 14 Feb 2024 18:19:58 +0100
Subject: [PATCH 125/305] use correct subitems component

---
 .../workflows/WorkspaceWorkflowsPage.tsx      | 46 ++++++++++++-------
 1 file changed, 30 insertions(+), 16 deletions(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 740e3b300614..78029917ebd5 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -12,11 +12,13 @@ import Text from '@components/Text';
 import Section from '@components/Section';
 import * as Illustrations from '@components/Icon/Illustrations';
 import ToggleSettingOptionRow, { OptionType } from './ToggleSettingsOptionRow';
-import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
+import MenuItem from '@components/MenuItem';
+import compose from '@libs/compose';
+import withPolicy, {WithPolicyProps} from '@pages/workspace/withPolicy';
 
-type WorkspaceWorkflowsPageProps = StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
+type WorkspaceWorkflowsPageProps = WithPolicyProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
 
-const WorkspaceWorkflowsPage: React.FC<WorkspaceWorkflowsPageProps> = ({route}) => {
+function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const {isSmallScreenWidth} = useWindowDimensions();
@@ -27,14 +29,18 @@ const WorkspaceWorkflowsPage: React.FC<WorkspaceWorkflowsPageProps> = ({route})
           title: translate('workflowsPage.delaySubmissionTitle'),
           subtitle: translate('workflowsPage.delaySubmissionDescription'),
           onToggle: (isEnabled: boolean) => {
-            // TODO
+              // TODO call API routes && set onyx optimistic data
           },
           subMenuItems: (
-            <MenuItemWithTopDescription
-              title={translate('workflowsPage.delaySubmissionTitle')}
-              onPress={() => {}}
-              shouldShowRightIcon={true}
-            />
+                <MenuItem
+                title={translate('workflowsPage.submissionFrequency')}
+                titleStyle={styles.workspaceWorkflowsSubMenuTitle}
+                descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
+                description={translate('workflowsPage.weeklyFrequency')}
+                onPress={() => {}}
+                shouldShowRightIcon={true}
+                wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
+                />
           ),
         },
         {
@@ -42,13 +48,17 @@ const WorkspaceWorkflowsPage: React.FC<WorkspaceWorkflowsPageProps> = ({route})
             title: translate('workflowsPage.addApprovalsTitle'),
             subtitle: translate('workflowsPage.addApprovalsDescription'),
             onToggle: (isEnabled: boolean) => {
-              // TODO
+              // TODO call API routes && set onyx optimistic data
             },
             subMenuItems: (
-              <MenuItemWithTopDescription
-                title={translate('workflowsPage.addApprovalsTitle')}
+              <MenuItem
+                title={translate('workflowsPage.approver')}
+                titleStyle={styles.workspaceWorkflowsSubMenuTitle}
+                descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
+                description={policy?.owner ?? ''}
                 onPress={() => {}}
                 shouldShowRightIcon={true}
+                wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
               />
             ),
           },
@@ -57,13 +67,15 @@ const WorkspaceWorkflowsPage: React.FC<WorkspaceWorkflowsPageProps> = ({route})
             title: translate('workflowsPage.makeOrTrackPaymentsTitle'),
             subtitle: translate('workflowsPage.makeOrTrackPaymentsDescription'),
             onToggle: (isEnabled: boolean) => {
-              // TODO
+              // TODO call API routes && set onyx optimistic data
             },
             subMenuItems: (
-              <MenuItemWithTopDescription
-                title={translate('workflowsPage.makeOrTrackPaymentsTitle')}
+                <MenuItem
+                descriptionTextStyle={[styles.workspaceWorkflowsSubMenuDescription, styles.textSupporting]}
+                description={translate('workflowsPage.connectBankAccount')}
                 onPress={() => {}}
                 shouldShowRightIcon={true}
+                wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
               />
             ),
           },
@@ -110,4 +122,6 @@ const WorkspaceWorkflowsPage: React.FC<WorkspaceWorkflowsPageProps> = ({route})
 
 WorkspaceWorkflowsPage.displayName = 'WorkspaceWorkflowsPage';
 
-export default WorkspaceWorkflowsPage;
+export default compose(
+    withPolicy,
+)(WorkspaceWorkflowsPage);

From 90a0b4a8c0a9108beef9b11c3969a01917187081 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 14 Feb 2024 09:48:04 -0800
Subject: [PATCH 126/305] Fix most types after merge

---
 src/CONST.ts                                     |  2 --
 src/ONYXKEYS.ts                                  |  2 ++
 src/components/Form/FormProvider.tsx             |  4 ++--
 src/libs/FormUtils.ts                            |  2 +-
 src/libs/Navigation/types.ts                     |  3 ++-
 src/libs/actions/ExitSurvey.ts                   | 16 +++++++---------
 .../ExitSurvey/ExitSurveyConfirmPage.tsx         |  6 +++---
 .../settings/ExitSurvey/ExitSurveyReasonPage.tsx |  7 ++++---
 .../ExitSurvey/ExitSurveyResponsePage.tsx        | 14 +++++++-------
 src/types/form/ExitSurveyReasonForm.ts           | 16 ++++++++++++++++
 src/types/form/ExitSurveyResponseForm.ts         | 12 ++++++++++++
 src/types/form/index.ts                          |  2 ++
 12 files changed, 58 insertions(+), 28 deletions(-)
 create mode 100644 src/types/form/ExitSurveyReasonForm.ts
 create mode 100644 src/types/form/ExitSurveyResponseForm.ts

diff --git a/src/CONST.ts b/src/CONST.ts
index 02f720c638bd..c83da086b281 100755
--- a/src/CONST.ts
+++ b/src/CONST.ts
@@ -3256,8 +3256,6 @@ const CONST = {
             DONT_UNDERSTAND: 'dontUnderstand',
             PREFER_CLASSIC: 'preferClassic',
         },
-        REASON_INPUT_ID: 'reason',
-        RESPONSE_INPUT_ID: 'response',
     },
 } as const;
 
diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts
index 07ecb7d50ca8..10232f04e843 100755
--- a/src/ONYXKEYS.ts
+++ b/src/ONYXKEYS.ts
@@ -404,6 +404,8 @@ type OnyxFormValuesMapping = {
     [ONYXKEYS.FORMS.ROOM_SETTINGS_FORM]: FormTypes.Form;
     [ONYXKEYS.FORMS.NEW_TASK_FORM]: FormTypes.Form;
     [ONYXKEYS.FORMS.EDIT_TASK_FORM]: FormTypes.Form;
+    [ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM]: FormTypes.ExitSurveyReasonForm;
+    [ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM]: FormTypes.ExitSurveyResponseForm;
     [ONYXKEYS.FORMS.MONEY_REQUEST_DESCRIPTION_FORM]: FormTypes.Form;
     [ONYXKEYS.FORMS.MONEY_REQUEST_MERCHANT_FORM]: FormTypes.Form;
     [ONYXKEYS.FORMS.MONEY_REQUEST_AMOUNT_FORM]: FormTypes.Form;
diff --git a/src/components/Form/FormProvider.tsx b/src/components/Form/FormProvider.tsx
index ff808c8ee45e..ad09b68a5f39 100644
--- a/src/components/Form/FormProvider.tsx
+++ b/src/components/Form/FormProvider.tsx
@@ -1,5 +1,5 @@
 import lodashIsEqual from 'lodash/isEqual';
-import type {FocusEvent, ForwardedRef, MutableRefObject, ReactNode} from 'react';
+import type {ForwardedRef, MutableRefObject, ReactNode} from 'react';
 import React, {createRef, forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState} from 'react';
 import type {NativeSyntheticEvent, StyleProp, TextInputSubmitEditingEventData, ViewStyle} from 'react-native';
 import type {OnyxEntry} from 'react-native-onyx';
@@ -311,7 +311,7 @@ function FormProvider(
                     }
                     inputProps.onPressOut?.(event);
                 },
-                onBlur: (event: FocusEvent) => {
+                onBlur: (event) => {
                     // Only run validation when user proactively blurs the input.
                     if (Visibility.isVisible() && Visibility.hasFocus()) {
                         const relatedTarget = event && 'relatedTarget' in event.nativeEvent && event?.nativeEvent?.relatedTarget;
diff --git a/src/libs/FormUtils.ts b/src/libs/FormUtils.ts
index 4d0571ada6f2..1f854c311454 100644
--- a/src/libs/FormUtils.ts
+++ b/src/libs/FormUtils.ts
@@ -1,7 +1,7 @@
 import type {OnyxFormDraftKey, OnyxFormKey} from '@src/ONYXKEYS';
 
 function getDraftKey(formID: OnyxFormKey): OnyxFormDraftKey {
-    return `${formID}Draft`;
+    return `${formID}Draft` as const;
 }
 
 export default {getDraftKey};
diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts
index 4957d8cd06e4..d6f5eaf72605 100644
--- a/src/libs/Navigation/types.ts
+++ b/src/libs/Navigation/types.ts
@@ -15,6 +15,7 @@ import type CONST from '@src/CONST';
 import type NAVIGATORS from '@src/NAVIGATORS';
 import type {HybridAppRoute, Route as Routes} from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
+import type EXIT_SURVEY_REASON_FORM_INPUT_IDS from '@src/types/form/ExitSurveyReasonForm';
 
 type NavigationRef = NavigationContainerRefWithCurrent<RootStackParamList>;
 
@@ -163,7 +164,7 @@ type SettingsNavigatorParamList = {
     [SCREENS.KEYBOARD_SHORTCUTS]: undefined;
     [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: undefined;
     [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: {
-        [CONST.EXIT_SURVEY.REASON_INPUT_ID]: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
+        [EXIT_SURVEY_REASON_FORM_INPUT_IDS.REASON]: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
     };
     [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: undefined;
 } & ReimbursementAccountNavigatorParamList;
diff --git a/src/libs/actions/ExitSurvey.ts b/src/libs/actions/ExitSurvey.ts
index 7b3ba839397c..ef3ecd6d3e31 100644
--- a/src/libs/actions/ExitSurvey.ts
+++ b/src/libs/actions/ExitSurvey.ts
@@ -1,29 +1,28 @@
 import type {OnyxUpdate} from 'react-native-onyx';
 import Onyx from 'react-native-onyx';
-import type {ValueOf} from 'type-fest';
 import * as API from '@libs/API';
-import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
-
-type ExitReason = ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
+import REASON_INPUT_IDS from '@src/types/form/ExitSurveyReasonForm';
+import type {ExitReason} from '@src/types/form/ExitSurveyReasonForm';
+import RESPONSE_INPUT_IDS from '@src/types/form/ExitSurveyResponseForm';
 
 let exitReason: ExitReason | undefined;
 let exitSurveyResponse: string | undefined;
 Onyx.connect({
     key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM,
-    callback: (value) => (exitReason = value?.[CONST.EXIT_SURVEY.REASON_INPUT_ID]),
+    callback: (value) => (exitReason = value?.[REASON_INPUT_IDS.REASON]),
 });
 Onyx.connect({
     key: ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM,
-    callback: (value) => (exitSurveyResponse = value?.[CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]),
+    callback: (value) => (exitSurveyResponse = value?.[RESPONSE_INPUT_IDS.RESPONSE]),
 });
 
 function saveExitReason(reason: ExitReason) {
-    Onyx.set(ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM, {[CONST.EXIT_SURVEY.REASON_INPUT_ID]: reason});
+    Onyx.set(ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM, {[REASON_INPUT_IDS.REASON]: reason});
 }
 
 function saveResponse(response: string) {
-    Onyx.set(ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM, {[CONST.EXIT_SURVEY.RESPONSE_INPUT_ID]: response});
+    Onyx.set(ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM, {[RESPONSE_INPUT_IDS.RESPONSE]: response});
 }
 
 /**
@@ -77,4 +76,3 @@ function switchToOldDot() {
 }
 
 export {saveExitReason, saveResponse, switchToOldDot};
-export type {ExitReason};
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index 042cbe284bb5..15f9becd6580 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -15,12 +15,12 @@ import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
 import variables from '@styles/variables';
 import * as ExitSurvey from '@userActions/ExitSurvey';
-import type {ExitReason} from '@userActions/ExitSurvey';
 import * as Link from '@userActions/Link';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
-import type * as OnyxTypes from '@src/types/onyx';
+import type {ExitReason, ExitSurveyReasonForm} from '@src/types/form/ExitSurveyReasonForm';
+import EXIT_SURVEY_REASON_INPUT_IDS from '@src/types/form/ExitSurveyReasonForm';
 import ExitSurveyOffline from './ExitSurveyOffline';
 
 type ExitSurveyConfirmPageOnyxProps = {
@@ -73,7 +73,7 @@ ExitSurveyConfirmPage.displayName = 'ExitSurveyConfirmPage';
 export default withOnyx<ExitSurveyConfirmPageOnyxProps, ExitSurveyConfirmPageOnyxProps>({
     exitReason: {
         key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM,
-        selector: (value: OnyxEntry<OnyxTypes.ExitSurveyReasonForm>) => value?.[CONST.EXIT_SURVEY.REASON_INPUT_ID],
+        selector: (value: OnyxEntry<ExitSurveyReasonForm>) => value?.[EXIT_SURVEY_REASON_INPUT_IDS.REASON],
     },
     isLoading: {
         key: ONYXKEYS.IS_SWITCHING_TO_OLD_DOT,
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index acd55210af6f..b62deb323ac7 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -11,10 +11,11 @@ import useNetwork from '@hooks/useNetwork';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
 import * as ExitSurvey from '@userActions/ExitSurvey';
-import type {ExitReason} from '@userActions/ExitSurvey';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
+import type {ExitReason} from '@src/types/form/ExitSurveyReasonForm';
+import INPUT_IDS from '@src/types/form/ExitSurveyReasonForm';
 import type {Errors} from '@src/types/onyx/OnyxCommon';
 import ExitSurveyOffline from './ExitSurveyOffline';
 
@@ -46,7 +47,7 @@ function ExitSurveyReasonPage() {
                 validate={() => {
                     const errors: Errors = {};
                     if (!reason) {
-                        errors[CONST.EXIT_SURVEY.REASON_INPUT_ID] = 'common.error.fieldRequired';
+                        errors[INPUT_IDS.REASON] = 'common.error.fieldRequired';
                     }
                     return errors;
                 }}
@@ -68,7 +69,7 @@ function ExitSurveyReasonPage() {
                         <Text style={styles.mt2}>{translate('exitSurvey.reasonPage.subtitle')}</Text>
                         <InputWrapper
                             InputComponent={RadioButtons}
-                            inputID={CONST.EXIT_SURVEY.REASON_INPUT_ID}
+                            inputID={INPUT_IDS.REASON}
                             items={reasons}
                             onPress={(value) => setReason(value as ExitReason)}
                         />
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 0b4b949cb224..b09a3ea49f38 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -1,9 +1,9 @@
 import type {StackScreenProps} from '@react-navigation/stack';
 import React, {useCallback} from 'react';
-import type {OnyxEntry} from 'react-native-onyx';
 import {withOnyx} from 'react-native-onyx';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
+import type {FormOnyxValues} from '@components/Form/types';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import type {AnimatedTextInputRef} from '@components/RNTextInput';
 import ScreenWrapper from '@components/ScreenWrapper';
@@ -17,7 +17,6 @@ import useSafeAreaInsets from '@hooks/useSafeAreaInsets';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
-import FormUtils from '@libs/FormUtils';
 import * as NumberUtils from '@libs/NumberUtils';
 import updateMultilineInputRange from '@libs/updateMultilineInputRange';
 import Navigation from '@navigation/Navigation';
@@ -28,7 +27,8 @@ import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
-import type * as OnyxTypes from '@src/types/onyx';
+import type {ExitSurveyResponseForm} from '@src/types/form';
+import INPUT_IDS from '@src/types/form/ExitSurveyResponseForm';
 import type {Errors} from '@src/types/onyx/OnyxCommon';
 import ExitSurveyOffline from './ExitSurveyOffline';
 
@@ -98,7 +98,7 @@ function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePagePr
                 validate={() => {
                     const errors: Errors = {};
                     if (!draftResponse?.trim()) {
-                        errors[CONST.EXIT_SURVEY.RESPONSE_INPUT_ID] = 'common.error.fieldRequired';
+                        errors[INPUT_IDS.RESPONSE] = 'common.error.fieldRequired';
                     }
                     return errors;
                 }}
@@ -111,7 +111,7 @@ function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePagePr
                         <Text style={textStyle}>{translate(`exitSurvey.prompts.${reason}`)}</Text>
                         <InputWrapper
                             InputComponent={TextInput}
-                            inputID={CONST.EXIT_SURVEY.RESPONSE_INPUT_ID}
+                            inputID={INPUT_IDS.RESPONSE}
                             label={translate(`exitSurvey.responsePlaceholder`)}
                             accessibilityLabel={translate(`exitSurvey.responsePlaceholder`)}
                             role={CONST.ROLE.PRESENTATION}
@@ -137,7 +137,7 @@ ExitSurveyResponsePage.displayName = 'ExitSurveyResponsePage';
 
 export default withOnyx<ExitSurveyResponsePageProps, ExitSurveyResponsePageOnyxProps>({
     draftResponse: {
-        key: FormUtils.getDraftKey(ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM),
-        selector: (value: OnyxEntry<OnyxTypes.ExitSurveyResponseForm>) => value?.[CONST.EXIT_SURVEY.RESPONSE_INPUT_ID] ?? '',
+        key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM_DRAFT,
+        selector: (value: FormOnyxValues<typeof ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM>) => value?.[INPUT_IDS.RESPONSE] ?? '',
     },
 })(ExitSurveyResponsePage);
diff --git a/src/types/form/ExitSurveyReasonForm.ts b/src/types/form/ExitSurveyReasonForm.ts
new file mode 100644
index 000000000000..48f10d4d163d
--- /dev/null
+++ b/src/types/form/ExitSurveyReasonForm.ts
@@ -0,0 +1,16 @@
+import type {ValueOf} from 'type-fest';
+import type CONST from '@src/CONST';
+import type Form from './Form';
+
+type ExitReason = ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
+
+const INPUT_IDS = {
+    REASON: 'reason',
+} as const;
+
+type ExitSurveyReasonForm = Form<{
+    [INPUT_IDS.REASON]: ExitReason;
+}>;
+
+export type {ExitSurveyReasonForm, ExitReason};
+export default INPUT_IDS;
diff --git a/src/types/form/ExitSurveyResponseForm.ts b/src/types/form/ExitSurveyResponseForm.ts
new file mode 100644
index 000000000000..6776b29b8054
--- /dev/null
+++ b/src/types/form/ExitSurveyResponseForm.ts
@@ -0,0 +1,12 @@
+import type Form from './Form';
+
+const INPUT_IDS = {
+    RESPONSE: 'response',
+} as const;
+
+type ExitSurveyResponseForm = Form<{
+    [INPUT_IDS.RESPONSE]: string;
+}>;
+
+export type {ExitSurveyResponseForm};
+export default INPUT_IDS;
diff --git a/src/types/form/index.ts b/src/types/form/index.ts
index eb691bcc8ca4..17ffa17e9dfc 100644
--- a/src/types/form/index.ts
+++ b/src/types/form/index.ts
@@ -3,6 +3,8 @@ export type {CloseAccountForm} from './CloseAccountForm';
 export type {DateOfBirthForm} from './DateOfBirthForm';
 export type {DisplayNameForm} from './DisplayNameForm';
 export type {EditTaskForm} from './EditTaskForm';
+export type {ExitSurveyReasonForm} from './ExitSurveyReasonForm';
+export type {ExitSurveyResponseForm} from './ExitSurveyResponseForm';
 export type {GetPhysicalCardForm} from './GetPhysicalCardForm';
 export type {HomeAddressForm} from './HomeAddressForm';
 export type {IKnowTeacherForm} from './IKnowTeacherForm';

From 349f6d83b9ded15ba4f19b016e76626f78ad46d2 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 14 Feb 2024 10:09:58 -0800
Subject: [PATCH 127/305] Fix types in ExitSurveyResponsePage

---
 src/libs/FormUtils.ts                                    | 2 +-
 src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx | 6 ++----
 2 files changed, 3 insertions(+), 5 deletions(-)

diff --git a/src/libs/FormUtils.ts b/src/libs/FormUtils.ts
index 1f854c311454..4d0571ada6f2 100644
--- a/src/libs/FormUtils.ts
+++ b/src/libs/FormUtils.ts
@@ -1,7 +1,7 @@
 import type {OnyxFormDraftKey, OnyxFormKey} from '@src/ONYXKEYS';
 
 function getDraftKey(formID: OnyxFormKey): OnyxFormDraftKey {
-    return `${formID}Draft` as const;
+    return `${formID}Draft`;
 }
 
 export default {getDraftKey};
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index b09a3ea49f38..9a23e3406521 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -3,7 +3,6 @@ import React, {useCallback} from 'react';
 import {withOnyx} from 'react-native-onyx';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
-import type {FormOnyxValues} from '@components/Form/types';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import type {AnimatedTextInputRef} from '@components/RNTextInput';
 import ScreenWrapper from '@components/ScreenWrapper';
@@ -27,7 +26,6 @@ import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
-import type {ExitSurveyResponseForm} from '@src/types/form';
 import INPUT_IDS from '@src/types/form/ExitSurveyResponseForm';
 import type {Errors} from '@src/types/onyx/OnyxCommon';
 import ExitSurveyOffline from './ExitSurveyOffline';
@@ -137,7 +135,7 @@ ExitSurveyResponsePage.displayName = 'ExitSurveyResponsePage';
 
 export default withOnyx<ExitSurveyResponsePageProps, ExitSurveyResponsePageOnyxProps>({
     draftResponse: {
-        key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM_DRAFT,
-        selector: (value: FormOnyxValues<typeof ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM>) => value?.[INPUT_IDS.RESPONSE] ?? '',
+        key: ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM_DRAFT,
+        selector: (value) => value?.[INPUT_IDS.RESPONSE] ?? '',
     },
 })(ExitSurveyResponsePage);

From 45882a4e98d0a543c2eadcfcd9220c554c98cefc Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 14 Feb 2024 10:27:07 -0800
Subject: [PATCH 128/305] Fix typo in english translation

---
 src/languages/en.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index eeefe60005b2..aaee8997c4fb 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -2333,7 +2333,7 @@ export default {
         prompts: {
             [CONST.EXIT_SURVEY.REASONS.FEATURE_NOT_AVAILABLE]: "What feature do you need that isn't available in New Expensify?",
             [CONST.EXIT_SURVEY.REASONS.DONT_UNDERSTAND]: 'What are you trying to do?',
-            [CONST.EXIT_SURVEY.REASONS.PREFER_CLASSIC]: 'Why to you prefer Expensify Classic?',
+            [CONST.EXIT_SURVEY.REASONS.PREFER_CLASSIC]: 'Why do you prefer Expensify Classic?',
         },
         responsePlaceholder: 'Your response',
         thankYou: 'Thanks for the feedback!',

From 07a802d9c5d5bc27121208c7f5a9c0525516a49e Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 14 Feb 2024 10:28:48 -0800
Subject: [PATCH 129/305] Update MushroomTopHat illustration

---
 .../mushroom-top-hat.svg                      | 213 ++++++++++++------
 1 file changed, 141 insertions(+), 72 deletions(-)

diff --git a/assets/images/product-illustrations/mushroom-top-hat.svg b/assets/images/product-illustrations/mushroom-top-hat.svg
index f09f7e7378ed..cb808f7289e0 100644
--- a/assets/images/product-illustrations/mushroom-top-hat.svg
+++ b/assets/images/product-illustrations/mushroom-top-hat.svg
@@ -1,73 +1,142 @@
-<svg width="136" height="128" viewBox="0 0 136 128" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g id="Illustration">
-<path id="Vector" d="M20.9596 119.21C20.9596 119.21 21.6229 120.98 23.2829 120.98C24.9429 120.98 27.3762 121.09 27.3762 121.09L28.9262 122.416C28.9262 122.416 30.1429 126.62 33.4595 126.176C36.7761 125.733 36.5561 123.19 36.5561 123.19C36.5561 123.19 39.4328 122.526 39.8728 120.203C39.8728 120.203 42.5261 119.76 42.7494 117.66C42.7494 117.66 47.2894 119.186 53.2026 116.266C59.1159 113.346 58.0126 107.043 58.0126 107.043C58.0126 107.043 55.5793 100.74 54.8059 100.187C54.0326 99.6332 51.8193 97.7533 51.8193 97.7533L21.9563 89.0167L31.1362 109.92C31.1362 109.92 17.753 110.803 20.9596 119.21Z" fill="#FFFAF0"/>
-<path id="Vector_2" d="M4.70031 76.5168C4.70031 76.5168 4.36697 83.3734 15.7602 87.0234C27.1534 90.6733 49.9365 97.1999 49.9365 97.1999C49.9365 97.1999 66.6364 100.85 69.0697 92.0033C71.503 83.1567 67.1297 80.8901 63.873 78.8434C63.873 78.8434 49.1632 70.7702 33.9 67.2303C18.6368 63.6903 10.7836 63.2503 6.58362 70.1069C5.70029 72.5402 4.59364 75.5267 4.70364 76.5201L4.70031 76.5168Z" fill="#03D47C"/>
-<path id="Vector_3" d="M27.2634 85.3667C30.868 85.3667 33.79 82.4448 33.79 78.8402C33.79 75.2357 30.868 72.3136 27.2634 72.3136C23.6589 72.3136 20.7368 75.2357 20.7368 78.8402C20.7368 82.4448 23.6589 85.3667 27.2634 85.3667Z" fill="#FFFAF0"/>
-<path id="Vector_4" d="M40.5361 89.7899C44.1407 89.7899 47.0627 86.8678 47.0627 83.2633C47.0627 79.6587 44.1407 76.7368 40.5361 76.7368C36.9316 76.7368 34.0095 79.6587 34.0095 83.2633C34.0095 86.8678 36.9316 89.7899 40.5361 89.7899Z" fill="#FFFAF0"/>
-<path id="Vector_5" d="M35.3361 52.187C35.3361 52.187 29.5129 46.5837 24.9396 53.2203C20.3696 59.8569 28.0362 65.3136 28.0362 65.3136L39.6861 69.0003L47.5027 68.4103C47.5027 68.4103 43.0794 65.3136 46.176 62.3636C49.2727 59.4137 51.336 65.167 55.1726 63.397C59.0059 61.627 58.5659 54.4004 54.2893 51.6004L52.666 52.7804L51.7826 7.36076C51.7826 7.36076 50.3093 0.577492 42.9361 1.02082C35.5628 1.46415 35.1195 5.44418 34.6795 9.42747C34.2362 13.4074 35.3428 52.1904 35.3428 52.1904L35.3361 52.187Z" fill="#F68DFE"/>
-<path id="Vector_6" d="M35.3363 52.1869C35.3363 52.1869 35.363 52.207 35.4097 52.247C36.0463 52.7703 40.6796 56.477 44.0729 56.167C47.7229 55.8337 52.1462 52.737 52.1462 52.737L52.3662 47.7604C52.3662 47.7604 44.5129 45.217 35.333 47.6503V52.1837L35.3363 52.1869Z" fill="#E4BC07"/>
-<path id="Vector_7" d="M79.5758 112.793L75.9259 123.19C75.9259 123.19 75.5925 125.07 78.8025 125.07H97.6057C97.6057 125.07 100.369 123.853 100.482 122.083C100.592 120.313 99.819 119.206 99.819 119.206L87.4324 113.233L79.5792 112.79L79.5758 112.793Z" fill="#FED607"/>
-<path id="Vector_8" d="M121.492 111.356V119.1H132.662C132.662 119.1 134.762 117.883 134.762 115.12V98.64C134.762 98.64 133.879 95.3233 131.666 95.1C129.452 94.8766 128.236 96.87 128.236 96.87L121.489 111.36L121.492 111.356Z" fill="#FED607"/>
-<path id="Vector_9" d="M23.54 94.5834L21.0334 89.1267L1.42023 111.1C1.42023 111.1 0.903572 114.86 1.64023 116.41C2.37689 117.96 5.77018 119.36 5.77018 119.36L20.5167 119.213C20.5167 119.213 19.1167 114.566 21.6234 112.873L8.86682 112.726L8.05683 112.283L23.54 94.5866V94.5834Z" fill="#002140"/>
-<path id="Vector_10" d="M46.103 118.62H77.5127L79.4294 112.13L57.3096 112.276C57.3096 112.276 51.263 117.436 49.3463 117.66C47.4297 117.883 46.103 118.62 46.103 118.62Z" fill="#002140"/>
-<path id="Vector_11" d="M87.4287 113.016L99.7053 119.543H120.938C120.938 119.543 121.712 113.35 120.828 111.8H87.5387L87.4287 113.016Z" fill="#002140"/>
-<path id="Vector_12" d="M79.4293 112.13C79.4293 112.13 84.8859 114.01 87.4292 113.013L98.1558 84.3667C98.1558 84.3667 99.8157 78.1734 94.5058 76.8468C89.1958 75.5201 83.0026 83.0401 83.0026 83.0401L58.0061 109.473L57.3062 112.276L67.2961 112.24L85.8759 90.8933C85.8759 90.8933 87.0925 90.34 86.7592 92.11C86.4259 93.8799 79.4226 112.13 79.4226 112.13H79.4293Z" fill="#002140"/>
-<path id="Vector_13" d="M76.3691 88.6834L75.7057 91.3367L80.7924 86.9134L82.3423 82.8201C82.3423 82.8201 80.4624 67.7802 62.5459 65.5669C62.5459 65.5669 60.7759 66.4503 61.2192 69.1069C61.2192 69.1069 76.5157 71.8302 76.3724 88.6834H76.3691Z" fill="#002140"/>
-<path id="Vector_14" d="M51.4826 63.1369C51.4826 63.1369 50.4859 61.4769 48.276 61.5869C46.0626 61.6969 45.2893 63.1368 45.2893 64.0201C45.2893 64.9035 46.616 68.3335 51.3726 69.3302C56.1292 70.3268 60.8825 69.5502 60.8825 69.5502C60.8825 69.5502 60.3292 66.0102 64.4225 64.6835C68.5157 63.3569 73.3057 61.3303 73.3824 60.037C73.4557 58.747 72.499 57.1603 71.3924 57.3837C71.3924 57.3837 72.609 54.8403 70.7291 54.067C68.8491 53.2936 64.9791 54.5104 62.8758 57.827C62.8758 57.827 62.1025 50.417 57.6792 48.867C54.9159 47.6503 54.3625 51.4104 54.3625 51.4104C54.3625 51.4104 61.1092 57.9369 56.4625 62.5802C53.7259 64.6269 51.4859 63.1336 51.4859 63.1336L51.4826 63.1369Z" fill="#FFFAF0"/>
-<path id="Vector_15" d="M41.3093 105.383C41.3093 105.383 40.976 106.71 39.4294 106.046C37.8794 105.383 37.9927 103.503 37.9927 103.503C37.9927 103.503 35.1894 105.053 34.8961 103.283C34.6027 101.513 34.0127 101.733 35.2294 100.52C36.446 99.3064 37.8827 96.9799 37.8827 96.9799C37.8827 96.9799 35.1194 94.9432 33.6794 95.3199C32.2394 95.6966 30.1394 97.6432 30.1394 98.3065C30.1394 98.9699 29.9195 105.606 38.4327 108.04C46.9493 110.473 48.0559 107.706 48.6093 106.38C49.1626 105.053 50.2692 103.726 48.1659 102.73C46.0659 101.733 44.296 101.18 44.296 101.18L41.3093 105.383Z" fill="#002140"/>
-<path id="Vector_16" d="M36.4893 53.0404L38.2592 54.5871L45.2625 46.9939L41.4292 47.5839L36.4893 53.0404Z" fill="#002140"/>
-<path id="Vector_17" d="M41.1362 55.8405L44.5995 55.9904L52.2695 48.0271L49.0995 47.6571L41.1362 55.8405Z" fill="#002140"/>
-<path id="Vector_18" d="M18.5 64.5402C18.5 64.5402 12.3801 65.2769 10.2434 66.6035C10.2434 66.6035 10.3901 74.1236 16.4367 72.2802C22.4833 70.4369 19.3866 64.6137 18.5 64.537V64.5402Z" fill="#002140"/>
-<path id="Vector_19" d="M12.0835 75.3801C12.0835 75.3801 7.14358 75.3802 6.18359 80.1001C6.18359 80.1001 9.06022 84.0801 11.1235 84.8934C11.1235 84.8934 15.1802 84.8201 15.6935 81.2801C16.2102 77.7402 13.7035 75.4568 12.0802 75.3801H12.0835Z" fill="#002140"/>
-<path id="Vector_20" d="M41.5028 69.7037C41.5028 69.7037 33.8362 66.9003 32.5062 66.977C31.1796 67.0503 31.3996 72.6536 35.7495 73.6869C40.0995 74.7202 41.4995 69.707 41.4995 69.707L41.5028 69.7037Z" fill="#002140"/>
-<path id="Vector_21" d="M60.8225 77.6669L53.8925 74.3502C53.8925 74.3502 51.6792 76.3035 51.4592 77.5201C51.2392 78.7368 51.8292 83.0501 55.0725 83.4201C58.3158 83.7901 60.9725 81.0601 60.8225 77.6702V77.6669Z" fill="#002140"/>
-<path id="Vector_22" d="M67.529 82.4601C67.529 82.4601 64.8024 83.1967 64.9491 86.3666C65.0957 89.5366 69.4457 90.1999 69.4457 90.1999C69.4457 90.1999 71.659 84.2266 67.529 82.4567V82.4601Z" fill="#002140"/>
-<path id="Vector_23" d="M54.5525 97.9432L59.4924 98.3865C59.4924 98.3865 62.6624 95.8798 61.9991 93.5199C61.3358 91.1599 59.4191 89.2433 56.3958 89.4633C53.3725 89.6833 52.7592 92.6899 52.6358 93.4432C52.0458 95.4332 54.0358 97.7932 54.5525 97.9399V97.9432Z" fill="#002140"/>
-<path id="Vector_24" d="M34.646 101.703L38.1126 97.1333C38.1126 97.1333 33.7627 93.6667 31.1094 96.9867C28.4561 100.303 32.806 104.95 32.806 104.95C32.806 104.95 38.706 109.3 43.1293 109.447C47.5526 109.593 48.9525 106.13 48.9525 106.13L48.7325 103.55L44.4559 101.043L40.476 106.28C40.476 106.28 39.3693 106.207 38.706 105.987C38.0426 105.767 38.2626 103.333 38.2626 103.333C38.2626 103.333 35.7193 104.253 35.2227 103.757C34.726 103.26 34.6527 101.71 34.6527 101.71L34.646 101.703Z" fill="#002140"/>
-<path id="Vector_25" d="M57.946 98.6066C57.946 98.6066 60.4527 104.063 62.886 104.356L66.7926 100.743L63.476 97.2032L57.946 98.6031V98.6066Z" fill="#002140"/>
-<path id="Vector_26" d="M30.2966 56.5803C30.2966 56.5803 42.6832 66.9769 53.8531 57.7969" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_27" d="M42.9031 70.0703C32.9332 67.1137 11.3667 58.217 5.58345 72.2202C1.86348 81.2234 11.0534 85.6201 18.1367 87.8301C27.7799 90.84 37.4198 93.88 47.1497 96.6C54.6496 98.6933 64.3429 100.733 68.7628 92.3933C69.5195 90.9634 70.0328 89.38 70.0428 87.7633C70.0728 82.0801 63.4162 78.9168 59.1296 76.7202C53.9563 74.0702 48.483 71.7236 42.9031 70.0703Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_28" d="M26.9794 85.7766C30.7662 85.7766 33.836 82.7562 33.836 79.0301C33.836 75.3041 30.7662 72.2834 26.9794 72.2834C23.1926 72.2834 20.1228 75.3041 20.1228 79.0301C20.1228 82.7562 23.1926 85.7766 26.9794 85.7766Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_29" d="M24.2501 78.1835L28.3867 78.4434C28.51 76.0001 27.0634 73.8634 24.9501 73.5268C22.6568 73.1635 20.4535 75.0535 20.0235 77.7468C19.5935 80.4401 21.1068 82.92 23.4001 83.2834C24.7367 83.4967 26.0401 82.9402 26.9801 81.9102L24.2468 78.1835H24.2501Z" fill="#002140"/>
-<path id="Vector_30" d="M40.3959 90.0533C44.1827 90.0533 47.2525 87.0328 47.2525 83.3067C47.2525 79.5807 44.1827 76.5601 40.3959 76.5601C36.6091 76.5601 33.5393 79.5807 33.5393 83.3067C33.5393 87.0328 36.6091 90.0533 40.3959 90.0533Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_31" d="M37.6696 82.4601L41.8062 82.72C41.9296 80.2767 40.4829 78.1401 38.3696 77.8034C36.0763 77.4401 33.873 79.3301 33.443 82.0234C33.0163 84.7167 34.5263 87.1966 36.8196 87.56C38.1563 87.7733 39.4596 87.2166 40.3996 86.1866L37.6663 82.4601H37.6696Z" fill="#002140"/>
-<path id="Vector_32" d="M47.733 68.3403C47.733 68.3403 41.9631 68.9135 39.5198 69.0135" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_33" d="M35.383 52.3771C35.383 52.3771 34.533 11.3774 34.533 10.0274C34.533 8.67739 33.9464 1.39422 42.9063 1.28088C50.4262 1.28088 51.8662 5.37422 51.8662 8.91085C51.7562 10.3475 52.4128 52.817 52.4128 52.817" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_34" d="M35.4932 47.5104C35.4932 47.5104 46.2197 46.2938 51.973 47.6204" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_35" d="M36.3428 53.187L41.946 47.0671" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_36" d="M38.4795 54.5136L45.4894 47.0038" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_37" d="M41.5029 55.547L49.2462 47.2039" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_38" d="M44.4526 56.0638L52.1959 47.7205" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_39" d="M63.9929 60.7804C67.9729 58.5671 72.6928 56.4303 73.5028 58.937C74.3128 61.4436 68.3429 63.7304 64.1396 65.057C59.9363 66.3837 61.3363 69.4803 61.3363 69.4803C61.3363 69.4803 57.3563 70.5136 53.6897 70.0803C51.043 69.7703 47.5697 68.7136 45.8464 66.5237C44.0064 64.1837 46.6764 60.4804 49.4764 61.6671C50.143 61.9504 50.6664 62.4837 51.2564 62.9037C52.7797 63.9837 55.2263 64.3937 56.623 62.9037C59.3463 60.0038 57.7963 53.3837 54.4097 51.597" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_40" d="M71.1423 57.7571C71.1423 57.7571 72.6923 55.6204 71.069 54.2904C69.4457 52.9637 64.6557 54.1437 62.5891 58.7137C63.0524 57.6903 62.3958 55.3437 62.1624 54.3371C61.5224 51.5638 59.6658 48.6171 56.4558 48.7071C54.8192 48.7504 54.1825 50.1305 54.4058 51.6005C52.7459 52.1538 51.4192 55.1404 44.6726 56.0237C37.926 56.9071 35.936 51.7105 31.7327 50.4939C27.5295 49.2772 24.6561 52.4838 23.8628 54.9038C22.8695 57.3104 22.8962 62.4737 28.8961 65.9136" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_41" d="M30.6297 109.776L21.1165 88.7633" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_42" d="M42.6826 117.85C42.6826 117.85 43.8993 118.403 46.5526 118.293C49.2059 118.183 58.0558 116.193 58.0558 108.783C58.0558 101.373 51.5292 97.7233 51.5292 97.7233" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_43" d="M30.2962 100.596C30.2962 100.596 30.7395 104.577 36.7094 107.453C39.5161 108.803 44.686 110.643 47.4793 108.263C48.9693 106.993 49.876 104.123 47.9927 102.81C46.3893 101.693 44.5094 101.066 42.7461 100.24C41.3661 99.5932 40.0261 98.8232 38.9261 97.7532C37.2528 96.1232 34.6095 94.7233 32.2862 95.8899C30.5562 96.7599 30.1028 98.8232 30.2995 100.6L30.2962 100.596Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_44" d="M37.8728 97.2233C37.8728 97.2233 36.4895 99.2698 35.1628 100.93C33.8362 102.59 34.7762 103.42 35.2195 103.75C35.6628 104.083 36.9161 104.45 38.2595 102.55C39.6061 100.65 40.5828 99.2698 40.5828 99.2698" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_45" d="M41.3393 99.7399C40.9226 100.347 39.8493 101.883 38.8093 103.18C37.4827 104.84 38.4226 105.67 38.866 106C39.3093 106.333 40.5626 106.7 41.9059 104.8C43.2526 102.9 44.2293 101.52 44.2293 101.52" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_46" d="M36.4897 123.38C36.4897 123.38 38.3697 123.546 39.3664 122.22C40.363 120.893 39.8097 117.353 35.1631 115.03" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_47" d="M40.016 120.486C40.656 120.416 41.6193 120.17 42.2426 119.343C43.2393 118.016 42.6859 114.476 38.0393 112.153C38.0393 112.153 33.8927 110.163 31.1261 110.163C24.3795 110.163 19.9562 113.04 20.0095 116.8C20.0095 116.8 20.1762 121.28 23.6595 121.17C27.1428 121.06 28.0828 120.95 28.9128 122.22C29.7428 123.493 30.9027 126.533 33.1694 126.533C35.436 126.533 36.266 125.373 36.266 123.656C36.266 121.94 33.4461 118.9 30.9027 117.573" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_48" d="M21.4496 113.04H9.143C8.63634 113.04 8.36301 112.443 8.69634 112.06L23.5529 94.8999" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_49" d="M21.3363 89.15L2.41652 110.343C-0.766781 113.91 1.7632 119.563 6.54648 119.563H20.5063" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_50" d="M79.3291 112.35L57.5027 112.32" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_51" d="M47.3191 118.226L77.6321 118.413" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_52" d="M58.0195 110.257L84.5459 81.8135C84.5459 81.8135 84.5659 81.79 84.5759 81.7767C84.8259 81.4634 88.5592 76.8534 93.1892 76.8534C97.8191 76.8534 99.4891 81.4968 97.9825 85.3335L87.1392 112.913C87.0492 113.14 86.8392 113.296 86.5992 113.316C85.3326 113.42 81.3826 113.65 79.916 112.663C79.6793 112.506 79.596 112.2 79.6893 111.933L86.8826 91.8067C87.1159 91.15 86.2792 90.65 85.8126 91.1633L66.7961 112.103" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_53" d="M79.6888 111.93L76.3055 122.57C76.3055 122.57 75.2722 125.223 78.6655 125.223H96.802C96.802 125.223 100.709 124.853 100.709 121.83C100.709 121.83 100.929 120.356 99.4553 119.323C97.982 118.29 87.1387 112.91 87.1387 112.91" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_54" d="M86.7759 117.406C86.7759 117.406 87.7359 114.68 89.3558 114.236" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_55" d="M91.1255 119.546C91.1255 119.546 92.0855 116.82 93.7055 116.376" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_56" d="M99.9724 119.473C99.9724 119.473 129.465 119.503 132.025 119.503C134.585 119.503 134.679 115.563 134.679 115.563V99.0066C134.679 99.0066 134.309 95.0999 131.285 95.0999C131.285 95.0999 129.812 94.8798 128.779 96.3531C127.745 97.8265 121.206 111.953 121.206 111.953C121.206 111.953 121.942 117.703 121.132 119.4" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_57" d="M126.865 109.033C126.865 109.033 124.139 108.073 123.695 106.453" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_58" d="M129.002 104.683C129.002 104.683 126.275 103.723 125.832 102.103" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_59" d="M87.6592 112.026H121.209" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_60" d="M57.946 98.6798C57.946 98.6798 59.496 103.25 63.3293 104.283" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_61" d="M63.6223 97.5C63.6223 97.5 64.729 99.8598 66.8656 100.596" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_62" d="M61.3359 69.4835C61.3359 69.4835 76.6291 70.8602 76.6291 90.3" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_63" d="M63.4023 65.5004C63.4023 65.5004 82.2921 70.2236 82.2921 84.2302" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_64" d="M54.3392 97.91C53.2292 97.0534 52.5159 95.7099 52.5159 94.1999C52.5159 91.6133 54.6125 89.5167 57.1992 89.5167C59.7858 89.5167 61.8824 91.6133 61.8824 94.1999C61.8824 95.8966 60.9824 97.38 59.6325 98.2033" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_65" d="M69.5392 90.2333C69.3525 90.2599 69.1625 90.2733 68.9692 90.2733C66.7492 90.2733 64.9492 88.4733 64.9492 86.2533C64.9492 84.4567 66.1292 82.9334 67.7592 82.42" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_66" d="M60.6391 77.7201C60.7091 78.0468 60.7491 78.3869 60.7491 78.7369C60.7491 81.3635 58.6191 83.4935 55.9925 83.4935C53.3658 83.4935 51.2358 81.3635 51.2358 78.7369C51.2358 76.8469 52.3392 75.2136 53.9358 74.4469" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_67" d="M6.34354 80.8467C6.31354 80.6267 6.29688 80.4001 6.29688 80.1701C6.29688 77.5434 8.42685 75.4135 11.0535 75.4135C13.6801 75.4135 15.8101 77.5434 15.8101 80.1701C15.8101 82.6534 13.9101 84.69 11.4835 84.9067" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_68" d="M18.9128 64.6603C19.5162 65.4703 19.8762 66.4769 19.8762 67.5636C19.8762 70.2469 17.6995 72.4235 15.0162 72.4235C12.3329 72.4235 10.1562 70.2469 10.1562 67.5636C10.1562 67.2769 10.1829 66.9935 10.2296 66.7202" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="Vector_69" d="M41.6829 69.8403C41.2429 72.0703 39.2729 73.7535 36.9129 73.7535C34.2296 73.7535 32.053 71.5768 32.053 68.8935C32.053 68.2402 32.183 67.617 32.4163 67.0503" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/>
-</g>
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 28.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 139 128" style="enable-background:new 0 0 139 128;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#FFFAF0;}
+	.st1{fill:#03D47C;}
+	.st2{fill:#F68DFE;}
+	.st3{fill:#E4BC07;}
+	.st4{fill:#FED607;}
+	.st5{fill:#003C73;}
+	.st6{fill:#002140;}
+	.st7{fill:none;stroke:#002140;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;}
+</style>
+<path class="st0" d="M22.46,119.21c0,0,0.663,1.77,2.323,1.77s4.093,0.11,4.093,0.11l1.55,1.326c0,0,1.217,4.204,4.533,3.76
+	c3.317-0.443,3.097-2.986,3.097-2.986s2.877-0.664,3.317-2.987c0,0,2.653-0.443,2.877-2.543c0,0,4.54,1.526,10.453-1.394
+	c5.913-2.92,4.81-9.223,4.81-9.223s-2.433-6.303-3.207-6.857c-0.773-0.553-2.987-2.433-2.987-2.433l-29.863-8.737l9.18,20.903
+	C32.636,109.92,19.253,110.803,22.46,119.21z"/>
+<path class="st1" d="M6.2,76.517c0,0-0.333,6.857,11.06,10.507C28.653,90.674,51.436,97.2,51.436,97.2s16.7,3.65,19.133-5.197
+	c2.433-8.847-1.94-11.113-5.197-13.16c0,0-14.71-8.073-29.973-11.613c-15.263-3.54-23.116-3.98-27.316,2.877
+	c-0.883,2.433-1.99,5.42-1.88,6.413L6.2,76.517z"/>
+<path class="st0" d="M28.763,85.367c3.605,0,6.527-2.922,6.527-6.526s-2.922-6.527-6.527-6.527c-3.604,0-6.527,2.922-6.527,6.527
+	S25.159,85.367,28.763,85.367z"/>
+<path class="st0" d="M42.036,89.79c3.604,0,6.527-2.922,6.527-6.527c0-3.605-2.922-6.526-6.527-6.526s-6.527,2.922-6.527,6.526
+	C35.509,86.868,38.431,89.79,42.036,89.79z"/>
+<path class="st2" d="M36.836,52.187c0,0-5.823-5.603-10.397,1.033c-4.57,6.637,3.097,12.093,3.097,12.093L41.186,69l7.817-0.59
+	c0,0-4.423-3.097-1.327-6.047c3.097-2.95,5.16,2.803,8.997,1.033c3.833-1.77,3.393-8.997-0.883-11.797l-1.623,1.18l-0.883-45.42
+	c0,0-1.473-6.783-8.847-6.34c-7.373,0.443-7.817,4.423-8.257,8.407c-0.443,3.98,0.663,42.763,0.663,42.763L36.836,52.187z"/>
+<path class="st3" d="M36.836,52.187c0,0,0.027,0.02,0.073,0.06c0.637,0.523,5.27,4.23,8.663,3.92c3.65-0.333,8.073-3.43,8.073-3.43
+	l0.22-4.977c0,0-7.853-2.543-17.033-0.11v4.533L36.836,52.187z"/>
+<path class="st4" d="M81.076,112.793l-3.65,10.397c0,0-0.333,1.88,2.877,1.88h18.803c0,0,2.764-1.217,2.877-2.987
+	c0.11-1.77-0.663-2.877-0.663-2.877l-12.387-5.973l-7.853-0.443L81.076,112.793z"/>
+<path class="st4" d="M122.992,111.356v7.744h11.17c0,0,2.1-1.217,2.1-3.98V98.64c0,0-0.883-3.317-3.096-3.54
+	c-2.214-0.223-3.43,1.77-3.43,1.77l-6.747,14.49L122.992,111.356z"/>
+<path class="st5" d="M25.04,94.583l-2.507-5.457L2.92,111.1c0,0-0.517,3.76,0.22,5.31c0.737,1.55,4.13,2.95,4.13,2.95l14.747-0.147
+	c0,0-1.4-4.647,1.107-6.34l-12.757-0.147l-0.81-0.443L25.04,94.587V94.583z"/>
+<path class="st5" d="M47.603,118.62h31.41l1.917-6.49l-22.12,0.146c0,0-6.047,5.16-7.963,5.384
+	C48.93,117.883,47.603,118.62,47.603,118.62z"/>
+<path class="st5" d="M88.929,113.016l12.276,6.527h21.234c0,0,0.773-6.193-0.111-7.743H89.039L88.929,113.016z"/>
+<path class="st5" d="M80.929,112.13c0,0,5.457,1.88,8,0.883l10.727-28.646c0,0,1.66-6.193-3.65-7.52
+	c-5.31-1.327-11.503,6.193-11.503,6.193l-24.996,26.433l-0.7,2.804l9.99-0.037l18.58-21.346c0,0,1.217-0.553,0.883,1.217
+	c-0.333,1.77-7.337,20.02-7.337,20.02H80.929z"/>
+<path class="st5" d="M77.869,88.683l-0.663,2.653l5.087-4.423l1.55-4.093c0,0-1.88-15.04-19.796-17.253c0,0-1.77,0.883-1.327,3.54
+	c0,0,15.297,2.723,15.153,19.576H77.869z"/>
+<path class="st0" d="M52.983,63.137c0,0-0.997-1.66-3.207-1.55c-2.213,0.11-2.987,1.55-2.987,2.433c0,0.883,1.327,4.313,6.083,5.31
+	c4.757,0.997,9.51,0.22,9.51,0.22s-0.553-3.54,3.54-4.867c4.093-1.327,8.883-3.353,8.96-4.647c0.073-1.29-0.883-2.877-1.99-2.653
+	c0,0,1.217-2.543-0.663-3.317c-1.88-0.773-5.75,0.443-7.853,3.76c0,0-0.773-7.41-5.197-8.96c-2.763-1.217-3.317,2.543-3.317,2.543
+	s6.747,6.527,2.1,11.17c-2.737,2.047-4.977,0.553-4.977,0.553L52.983,63.137z"/>
+<path class="st6" d="M42.81,105.383c0,0-0.333,1.327-1.88,0.663c-1.55-0.663-1.437-2.543-1.437-2.543s-2.803,1.55-3.097-0.22
+	c-0.293-1.77-0.883-1.55,0.333-2.763c1.217-1.214,2.653-3.54,2.653-3.54s-2.763-2.037-4.203-1.66c-1.44,0.377-3.54,2.323-3.54,2.987
+	c0,0.663-0.22,7.299,8.293,9.733c8.517,2.433,9.623-0.334,10.177-1.66c0.553-1.327,1.66-2.654-0.443-3.65
+	c-2.1-0.997-3.87-1.55-3.87-1.55L42.81,105.383z"/>
+<path class="st6" d="M37.989,53.04l1.77,1.547l7.003-7.593l-3.833,0.59L37.989,53.04z"/>
+<path class="st6" d="M42.636,55.84l3.463,0.15l7.67-7.963l-3.17-0.37L42.636,55.84z"/>
+<path class="st6" d="M20,64.54c0,0-6.12,0.737-8.257,2.063c0,0,0.147,7.52,6.193,5.677s2.95-7.667,2.063-7.743V64.54z"/>
+<path class="st6" d="M13.583,75.38c0,0-4.94,0-5.9,4.72c0,0,2.877,3.98,4.94,4.793c0,0,4.057-0.073,4.57-3.613
+	c0.517-3.54-1.99-5.823-3.613-5.9H13.583z"/>
+<path class="st6" d="M43.003,69.704c0,0-7.667-2.803-8.997-2.727c-1.327,0.073-1.107,5.677,3.243,6.71
+	c4.35,1.033,5.75-3.98,5.75-3.98L43.003,69.704z"/>
+<path class="st6" d="M62.322,77.667l-6.93-3.317c0,0-2.213,1.953-2.433,3.17c-0.22,1.217,0.37,5.53,3.613,5.9
+	c3.243,0.37,5.9-2.36,5.75-5.75V77.667z"/>
+<path class="st6" d="M69.029,82.46c0,0-2.727,0.737-2.58,3.907c0.147,3.17,4.497,3.833,4.497,3.833s2.213-5.973-1.917-7.743V82.46z"
+	/>
+<path class="st6" d="M56.052,97.943l4.94,0.443c0,0,3.17-2.507,2.507-4.867c-0.663-2.36-2.58-4.277-5.603-4.057
+	c-3.023,0.22-3.637,3.227-3.76,3.98c-0.59,1.99,1.4,4.35,1.917,4.497V97.943z"/>
+<path class="st6" d="M36.146,101.703l3.467-4.57c0,0-4.35-3.467-7.003-0.147c-2.653,3.316,1.697,7.963,1.697,7.963
+	s5.9,4.35,10.323,4.496c4.423,0.147,5.823-3.316,5.823-3.316l-0.22-2.58l-4.277-2.507l-3.98,5.237c0,0-1.107-0.074-1.77-0.294
+	c-0.663-0.22-0.443-2.653-0.443-2.653s-2.543,0.92-3.04,0.424c-0.497-0.497-0.57-2.047-0.57-2.047L36.146,101.703z"/>
+<path class="st5" d="M59.446,98.607c0,0,2.507,5.456,4.94,5.75l3.907-3.614l-3.317-3.54l-5.53,1.4V98.607z"/>
+<path class="st7" d="M31.797,56.58c0,0,12.387,10.397,23.556,1.217"/>
+<path class="st7" d="M44.403,70.07c-9.97-2.957-31.536-11.853-37.32,2.15c-3.72,9.003,5.47,13.4,12.553,15.61
+	c9.643,3.01,19.283,6.05,29.013,8.77c7.5,2.093,17.193,4.133,21.613-4.207c0.757-1.43,1.27-3.013,1.28-4.63
+	c0.03-5.683-6.627-8.846-10.913-11.043C55.456,74.07,49.983,71.724,44.403,70.07z"/>
+<path class="st7" d="M28.479,85.777c3.787,0,6.857-3.02,6.857-6.747c0-3.726-3.07-6.747-6.857-6.747s-6.857,3.021-6.857,6.747
+	C21.623,82.756,24.693,85.777,28.479,85.777z"/>
+<path class="st6" d="M25.75,78.183l4.137,0.26c0.123-2.443-1.323-4.58-3.437-4.917c-2.293-0.363-4.497,1.527-4.927,4.22
+	c-0.43,2.693,1.083,5.173,3.377,5.537c1.337,0.213,2.64-0.343,3.58-1.373l-2.733-3.727H25.75z"/>
+<path class="st7" d="M41.896,90.053c3.787,0,6.857-3.021,6.857-6.747c0-3.726-3.07-6.747-6.857-6.747s-6.857,3.021-6.857,6.747
+	C35.039,87.033,38.109,90.053,41.896,90.053z"/>
+<path class="st6" d="M39.169,82.46l4.137,0.26c0.123-2.443-1.323-4.58-3.437-4.917c-2.293-0.363-4.497,1.527-4.927,4.22
+	c-0.427,2.693,1.083,5.173,3.377,5.537c1.337,0.213,2.64-0.343,3.58-1.373l-2.733-3.727H39.169z"/>
+<path class="st7" d="M49.233,68.34c0,0-5.77,0.573-8.213,0.673"/>
+<path class="st7" d="M36.883,52.377c0,0-0.85-41-0.85-42.35c0-1.35-0.587-8.633,8.373-8.746c7.52,0,8.96,4.093,8.96,7.63
+	c-0.11,1.437,0.547,43.906,0.547,43.906"/>
+<path class="st7" d="M36.993,47.51c0,0,10.727-1.217,16.48,0.11"/>
+<path class="st7" d="M37.843,53.187l5.603-6.12"/>
+<path class="st7" d="M39.979,54.514l7.01-7.51"/>
+<path class="st7" d="M43.003,55.547l7.743-8.343"/>
+<path class="st7" d="M45.953,56.064l7.743-8.343"/>
+<path class="st7" d="M65.493,60.78c3.98-2.213,8.7-4.35,9.51-1.843c0.81,2.507-5.16,4.793-9.363,6.12
+	c-4.203,1.327-2.803,4.423-2.803,4.423s-3.98,1.033-7.647,0.6c-2.647-0.31-6.12-1.367-7.843-3.557c-1.84-2.34,0.83-6.043,3.63-4.857
+	c0.667,0.283,1.19,0.817,1.78,1.237c1.523,1.08,3.97,1.49,5.367,0c2.723-2.9,1.173-9.52-2.213-11.307"/>
+<path class="st7" d="M72.642,57.757c0,0,1.55-2.137-0.073-3.467c-1.623-1.327-6.413-0.147-8.48,4.423
+	c0.463-1.023-0.193-3.37-0.427-4.377c-0.64-2.773-2.497-5.72-5.707-5.63c-1.637,0.043-2.273,1.423-2.05,2.893
+	c-1.66,0.553-2.987,3.54-9.733,4.423c-6.747,0.883-8.737-4.313-12.94-5.53c-4.203-1.217-7.077,1.99-7.87,4.41
+	c-0.993,2.407-0.967,7.57,5.033,11.01"/>
+<path class="st7" d="M32.13,109.776l-9.513-21.013"/>
+<path class="st7" d="M44.182,117.85c0,0,1.217,0.553,3.87,0.443c2.653-0.11,11.503-2.1,11.503-9.51c0-7.41-6.527-11.06-6.527-11.06"
+	/>
+<path class="st7" d="M31.796,100.596c0,0,0.443,3.98,6.413,6.857c2.807,1.35,7.977,3.19,10.77,0.81
+	c1.49-1.27,2.397-4.14,0.513-5.453c-1.603-1.117-3.483-1.744-5.247-2.57c-1.38-0.647-2.72-1.417-3.82-2.487
+	c-1.673-1.63-4.317-3.03-6.64-1.863c-1.73,0.87-2.183,2.933-1.987,4.71L31.796,100.596z"/>
+<path class="st7" d="M39.373,97.223c0,0-1.383,2.047-2.71,3.707c-1.327,1.66-0.387,2.49,0.057,2.82c0.443,0.333,1.697,0.7,3.04-1.2
+	c1.347-1.9,2.323-3.28,2.323-3.28"/>
+<path class="st7" d="M42.839,99.74c-0.417,0.607-1.49,2.143-2.53,3.44c-1.327,1.66-0.387,2.49,0.057,2.82
+	c0.443,0.333,1.697,0.7,3.04-1.2c1.347-1.9,2.323-3.28,2.323-3.28"/>
+<path class="st7" d="M37.99,123.38c0,0,1.88,0.166,2.877-1.16c0.997-1.327,0.443-4.867-4.203-7.19"/>
+<path class="st7" d="M41.516,120.486c0.64-0.07,1.603-0.316,2.227-1.143c0.997-1.327,0.443-4.867-4.203-7.19
+	c0,0-4.147-1.99-6.913-1.99c-6.747,0-11.17,2.877-11.117,6.637c0,0,0.167,4.48,3.65,4.37s4.423-0.22,5.253,1.05
+	c0.83,1.273,1.99,4.313,4.257,4.313c2.267,0,3.097-1.16,3.097-2.877c0-1.716-2.82-4.756-5.363-6.083"/>
+<path class="st7" d="M22.95,113.04H10.643c-0.507,0-0.78-0.597-0.447-0.98L25.053,94.9"/>
+<path class="st7" d="M22.836,89.15l-18.92,21.193c-3.183,3.567-0.653,9.22,4.13,9.22h13.96"/>
+<path class="st7" d="M80.829,112.35l-21.826-0.03"/>
+<path class="st7" d="M48.819,118.226l30.313,0.187"/>
+<path class="st7" d="M59.52,110.257l26.526-28.443c0,0,0.02-0.023,0.03-0.037c0.25-0.313,3.983-4.923,8.613-4.923
+	s6.3,4.643,4.793,8.48l-10.843,27.579c-0.09,0.227-0.3,0.384-0.54,0.404c-1.267,0.103-5.217,0.333-6.683-0.654
+	c-0.237-0.156-0.32-0.463-0.227-0.73l7.193-20.126c0.233-0.657-0.603-1.157-1.07-0.643l-19.016,20.94"/>
+<path class="st7" d="M81.189,111.93l-3.383,10.64c0,0-1.033,2.653,2.36,2.653h18.137c0,0,3.907-0.37,3.907-3.393
+	c0,0,0.22-1.474-1.254-2.507c-1.473-1.033-12.316-6.413-12.316-6.413"/>
+<path class="st7" d="M88.276,117.406c0,0,0.96-2.726,2.58-3.169"/>
+<path class="st7" d="M92.625,119.546c0,0,0.96-2.726,2.58-3.17"/>
+<path class="st7" d="M101.472,119.473c0,0,29.493,0.03,32.053,0.03c2.56,0,2.654-3.94,2.654-3.94V99.007c0,0-0.37-3.907-3.394-3.907
+	c0,0-1.473-0.22-2.506,1.253c-1.034,1.473-7.574,15.6-7.574,15.6s0.737,5.75-0.073,7.447"/>
+<path class="st7" d="M128.365,109.033c0,0-2.726-0.96-3.17-2.58"/>
+<path class="st7" d="M130.502,104.683c0,0-2.727-0.96-3.17-2.58"/>
+<path class="st7" d="M89.159,112.026h33.55"/>
+<path class="st7" d="M59.446,98.68c0,0,1.55,4.57,5.383,5.603"/>
+<path class="st7" d="M65.122,97.5c0,0,1.107,2.36,3.243,3.096"/>
+<path class="st7" d="M62.836,69.484c0,0,15.293,1.377,15.293,20.817"/>
+<path class="st7" d="M64.902,65.5c0,0,18.89,4.723,18.89,18.73"/>
+<path class="st7" d="M55.839,97.91c-1.11-0.857-1.823-2.2-1.823-3.71c0-2.587,2.097-4.683,4.683-4.683
+	c2.587,0,4.683,2.097,4.683,4.683c0,1.697-0.9,3.18-2.25,4.003"/>
+<path class="st7" d="M71.039,90.233c-0.187,0.027-0.377,0.04-0.57,0.04c-2.22,0-4.02-1.8-4.02-4.02c0-1.797,1.18-3.32,2.81-3.833"/>
+<path class="st7" d="M62.139,77.72c0.07,0.327,0.11,0.667,0.11,1.017c0,2.627-2.13,4.757-4.757,4.757
+	c-2.627,0-4.757-2.13-4.757-4.757c0-1.89,1.103-3.523,2.7-4.29"/>
+<path class="st7" d="M7.844,80.847c-0.03-0.22-0.047-0.447-0.047-0.677c0-2.627,2.13-4.757,4.757-4.757
+	c2.627,0,4.757,2.13,4.757,4.757c0,2.483-1.9,4.52-4.327,4.737"/>
+<path class="st7" d="M20.413,64.66c0.603,0.81,0.963,1.817,0.963,2.903c0,2.683-2.177,4.86-4.86,4.86s-4.86-2.177-4.86-4.86
+	c0-0.287,0.027-0.57,0.073-0.843"/>
+<path class="st7" d="M43.183,69.84c-0.44,2.23-2.41,3.913-4.77,3.913c-2.683,0-4.86-2.177-4.86-4.86c0-0.653,0.13-1.277,0.363-1.843
+	"/>
 </svg>

From 1c4111b5f2c8621c2b6fe26e5a91e39672c0e0e0 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 14 Feb 2024 10:51:56 -0800
Subject: [PATCH 130/305] Prepopulate reason form with draft reason

---
 .../settings/ExitSurvey/ExitSurveyReasonPage.tsx | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index b62deb323ac7..101ab3545ae6 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -1,4 +1,5 @@
 import React, {useMemo, useState} from 'react';
+import {withOnyx} from 'react-native-onyx';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
@@ -19,12 +20,16 @@ import INPUT_IDS from '@src/types/form/ExitSurveyReasonForm';
 import type {Errors} from '@src/types/onyx/OnyxCommon';
 import ExitSurveyOffline from './ExitSurveyOffline';
 
-function ExitSurveyReasonPage() {
+type ExitSurveyReasonPageOnyxProps = {
+    draftReason?: ExitReason;
+};
+
+function ExitSurveyReasonPage({draftReason}: ExitSurveyReasonPageOnyxProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const {isOffline} = useNetwork();
 
-    const [reason, setReason] = useState<ExitReason>();
+    const [reason, setReason] = useState<ExitReason | undefined>(draftReason);
     const reasons: Choice[] = useMemo(
         () =>
             Object.values(CONST.EXIT_SURVEY.REASONS).map((value) => ({
@@ -82,4 +87,9 @@ function ExitSurveyReasonPage() {
 
 ExitSurveyReasonPage.displayName = 'ExitSurveyReasonPage';
 
-export default ExitSurveyReasonPage;
+export default withOnyx<ExitSurveyReasonPageOnyxProps, ExitSurveyReasonPageOnyxProps>({
+    draftReason: {
+        key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM_DRAFT,
+        selector: (value) => value?.[INPUT_IDS.REASON],
+    },
+})(ExitSurveyReasonPage);

From 043601d48c1b6a2c364d17269f962fad642f86be Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 14 Feb 2024 10:59:24 -0800
Subject: [PATCH 131/305] Remove outdated cleanup

---
 src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx       | 2 +-
 src/pages/settings/{ => AboutPage}/AboutPage.tsx                | 2 +-
 src/pages/settings/{ => AboutPage}/ConsolePage.tsx              | 0
 .../settings/{ => AboutPage}/ShareLogList/BaseShareLogList.tsx  | 0
 .../settings/{ => AboutPage}/ShareLogList/index.native.tsx      | 0
 src/pages/settings/{ => AboutPage}/ShareLogList/index.tsx       | 0
 src/pages/settings/{ => AboutPage}/ShareLogList/types.ts        | 0
 src/pages/settings/{ => AboutPage}/ShareLogPage.tsx             | 0
 src/pages/settings/{ => AboutPage}/TroubleshootPage.tsx         | 0
 9 files changed, 2 insertions(+), 2 deletions(-)
 rename src/pages/settings/{ => AboutPage}/AboutPage.tsx (99%)
 rename src/pages/settings/{ => AboutPage}/ConsolePage.tsx (100%)
 rename src/pages/settings/{ => AboutPage}/ShareLogList/BaseShareLogList.tsx (100%)
 rename src/pages/settings/{ => AboutPage}/ShareLogList/index.native.tsx (100%)
 rename src/pages/settings/{ => AboutPage}/ShareLogList/index.tsx (100%)
 rename src/pages/settings/{ => AboutPage}/ShareLogList/types.ts (100%)
 rename src/pages/settings/{ => AboutPage}/ShareLogPage.tsx (100%)
 rename src/pages/settings/{ => AboutPage}/TroubleshootPage.tsx (100%)

diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
index 713e7876da31..00212ce17818 100644
--- a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
+++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
@@ -193,7 +193,7 @@ const AccountSettingsModalStackNavigator = createModalStackNavigator(
         [SCREENS.SETTINGS.PROFILE.ROOT]: () => require('../../../pages/settings/Profile/ProfilePage').default as React.ComponentType,
         [SCREENS.SETTINGS.SHARE_CODE]: () => require('../../../pages/ShareCodePage').default as React.ComponentType,
         [SCREENS.SETTINGS.WALLET.ROOT]: () => require('../../../pages/settings/Wallet/WalletPage').default as React.ComponentType,
-        [SCREENS.SETTINGS.ABOUT]: () => require('../../../pages/settings/AboutPage').default as React.ComponentType,
+        [SCREENS.SETTINGS.ABOUT]: () => require('../../../pages/settings/AboutPage/AboutPage').default as React.ComponentType,
     },
     (styles) => ({cardStyle: styles.navigationScreenCardStyle, headerShown: false}),
 );
diff --git a/src/pages/settings/AboutPage.tsx b/src/pages/settings/AboutPage/AboutPage.tsx
similarity index 99%
rename from src/pages/settings/AboutPage.tsx
rename to src/pages/settings/AboutPage/AboutPage.tsx
index f82213ab2d44..3346b044ceca 100644
--- a/src/pages/settings/AboutPage.tsx
+++ b/src/pages/settings/AboutPage/AboutPage.tsx
@@ -25,7 +25,7 @@ import CONST from '@src/CONST';
 import type {TranslationPaths} from '@src/languages/types';
 import ROUTES from '@src/ROUTES';
 import type IconAsset from '@src/types/utils/IconAsset';
-import pkg from '../../../package.json';
+import pkg from '../../../../package.json';
 
 function getFlavor(): string {
     const bundleId = DeviceInfo.getBundleId();
diff --git a/src/pages/settings/ConsolePage.tsx b/src/pages/settings/AboutPage/ConsolePage.tsx
similarity index 100%
rename from src/pages/settings/ConsolePage.tsx
rename to src/pages/settings/AboutPage/ConsolePage.tsx
diff --git a/src/pages/settings/ShareLogList/BaseShareLogList.tsx b/src/pages/settings/AboutPage/ShareLogList/BaseShareLogList.tsx
similarity index 100%
rename from src/pages/settings/ShareLogList/BaseShareLogList.tsx
rename to src/pages/settings/AboutPage/ShareLogList/BaseShareLogList.tsx
diff --git a/src/pages/settings/ShareLogList/index.native.tsx b/src/pages/settings/AboutPage/ShareLogList/index.native.tsx
similarity index 100%
rename from src/pages/settings/ShareLogList/index.native.tsx
rename to src/pages/settings/AboutPage/ShareLogList/index.native.tsx
diff --git a/src/pages/settings/ShareLogList/index.tsx b/src/pages/settings/AboutPage/ShareLogList/index.tsx
similarity index 100%
rename from src/pages/settings/ShareLogList/index.tsx
rename to src/pages/settings/AboutPage/ShareLogList/index.tsx
diff --git a/src/pages/settings/ShareLogList/types.ts b/src/pages/settings/AboutPage/ShareLogList/types.ts
similarity index 100%
rename from src/pages/settings/ShareLogList/types.ts
rename to src/pages/settings/AboutPage/ShareLogList/types.ts
diff --git a/src/pages/settings/ShareLogPage.tsx b/src/pages/settings/AboutPage/ShareLogPage.tsx
similarity index 100%
rename from src/pages/settings/ShareLogPage.tsx
rename to src/pages/settings/AboutPage/ShareLogPage.tsx
diff --git a/src/pages/settings/TroubleshootPage.tsx b/src/pages/settings/AboutPage/TroubleshootPage.tsx
similarity index 100%
rename from src/pages/settings/TroubleshootPage.tsx
rename to src/pages/settings/AboutPage/TroubleshootPage.tsx

From 3dfac290bfbaf12b98d9f7af41507f7a149db2f0 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 14 Feb 2024 11:02:17 -0800
Subject: [PATCH 132/305] Fix comment in NumberUtils

---
 src/libs/NumberUtils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/libs/NumberUtils.ts b/src/libs/NumberUtils.ts
index aaef0b5f8dfa..60e5246f5ed2 100644
--- a/src/libs/NumberUtils.ts
+++ b/src/libs/NumberUtils.ts
@@ -70,7 +70,7 @@ function parseFloatAnyLocale(value: string): number {
 }
 
 /**
- * Given an input number q and another number n, returns the largest number x that's less than p and divisible by q.
+ * Given an input number p and another number q, returns the largest number that's less than p and divisible by q.
  */
 function roundDownToLargestMultiple(p: number, q: number) {
     return Math.floor(p / q) * q;

From c7f2b5721b374eebedaed5dee5ee3508247f2652 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 14 Feb 2024 11:59:10 -0800
Subject: [PATCH 133/305] fix draft on reason page

---
 src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index 101ab3545ae6..4d94c035697b 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -21,7 +21,7 @@ import type {Errors} from '@src/types/onyx/OnyxCommon';
 import ExitSurveyOffline from './ExitSurveyOffline';
 
 type ExitSurveyReasonPageOnyxProps = {
-    draftReason?: ExitReason;
+    draftReason: ExitReason | null;
 };
 
 function ExitSurveyReasonPage({draftReason}: ExitSurveyReasonPageOnyxProps) {
@@ -29,7 +29,7 @@ function ExitSurveyReasonPage({draftReason}: ExitSurveyReasonPageOnyxProps) {
     const styles = useThemeStyles();
     const {isOffline} = useNetwork();
 
-    const [reason, setReason] = useState<ExitReason | undefined>(draftReason);
+    const [reason, setReason] = useState<ExitReason | null>(draftReason);
     const reasons: Choice[] = useMemo(
         () =>
             Object.values(CONST.EXIT_SURVEY.REASONS).map((value) => ({
@@ -90,6 +90,6 @@ ExitSurveyReasonPage.displayName = 'ExitSurveyReasonPage';
 export default withOnyx<ExitSurveyReasonPageOnyxProps, ExitSurveyReasonPageOnyxProps>({
     draftReason: {
         key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM_DRAFT,
-        selector: (value) => value?.[INPUT_IDS.REASON],
+        selector: (value) => value?.[INPUT_IDS.REASON] ?? null,
     },
 })(ExitSurveyReasonPage);

From 22b63905fa23b83c21208eb6d707dd8c86d4d1a7 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 14 Feb 2024 12:29:34 -0800
Subject: [PATCH 134/305] Setup RadioButtons to work as a controlled input

---
 src/components/RadioButtons.tsx                 | 17 +++++++++++++++--
 .../ExitSurvey/ExitSurveyReasonPage.tsx         | 12 +++++++++++-
 2 files changed, 26 insertions(+), 3 deletions(-)

diff --git a/src/components/RadioButtons.tsx b/src/components/RadioButtons.tsx
index c15fe65b357a..90c7d8580b5c 100644
--- a/src/components/RadioButtons.tsx
+++ b/src/components/RadioButtons.tsx
@@ -1,4 +1,4 @@
-import React, {forwardRef, useState} from 'react';
+import React, {forwardRef, useEffect, useState} from 'react';
 import type {ForwardedRef} from 'react';
 import {View} from 'react-native';
 import type {StyleProp, ViewStyle} from 'react-native';
@@ -28,11 +28,23 @@ type RadioButtonsProps = {
 
     /** Style for radio button */
     radioButtonStyle?: StyleProp<ViewStyle>;
+
+    /** Callback executed when input value changes (same as onPress, but required by FormProvider for the sake of saving drafts) */
+    onInputChange?: (value: string) => void;
+
+    /** The checked value, if you're using this component as a controlled input. */
+    value?: string;
 };
 
-function RadioButtons({items, onPress, defaultCheckedValue = '', radioButtonStyle, errorText}: RadioButtonsProps, ref: ForwardedRef<View>) {
+function RadioButtons({items, onPress, defaultCheckedValue = '', radioButtonStyle, errorText, onInputChange = () => {}, value}: RadioButtonsProps, ref: ForwardedRef<View>) {
     const styles = useThemeStyles();
     const [checkedValue, setCheckedValue] = useState(defaultCheckedValue);
+    useEffect(() => {
+        if (value === checkedValue) {
+            return;
+        }
+        setCheckedValue(value ?? '');
+    }, [checkedValue, value]);
 
     return (
         <>
@@ -47,6 +59,7 @@ function RadioButtons({items, onPress, defaultCheckedValue = '', radioButtonStyl
                         style={[styles.mb4, radioButtonStyle]}
                         onPress={() => {
                             setCheckedValue(item.value);
+                            onInputChange(item.value);
                             return onPress(item.value);
                         }}
                         label={item.label}
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index 4d94c035697b..a74a7726d638 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -1,4 +1,4 @@
-import React, {useMemo, useState} from 'react';
+import React, {useEffect, useMemo, useState} from 'react';
 import {withOnyx} from 'react-native-onyx';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
@@ -30,6 +30,14 @@ function ExitSurveyReasonPage({draftReason}: ExitSurveyReasonPageOnyxProps) {
     const {isOffline} = useNetwork();
 
     const [reason, setReason] = useState<ExitReason | null>(draftReason);
+    useEffect(() => {
+        // disabling lint because || is fine to use as a logical operator (as opposed to being used to define a default value)
+        // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+        if (reason || !draftReason) {
+            return;
+        }
+        setReason(draftReason);
+    }, [reason, draftReason]);
     const reasons: Choice[] = useMemo(
         () =>
             Object.values(CONST.EXIT_SURVEY.REASONS).map((value) => ({
@@ -75,8 +83,10 @@ function ExitSurveyReasonPage({draftReason}: ExitSurveyReasonPageOnyxProps) {
                         <InputWrapper
                             InputComponent={RadioButtons}
                             inputID={INPUT_IDS.REASON}
+                            value={reason as string}
                             items={reasons}
                             onPress={(value) => setReason(value as ExitReason)}
+                            shouldSaveDraft
                         />
                     </>
                 )}

From 7be4f4658cb8b70c9239de0b479c12272b247806 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 14 Feb 2024 13:39:38 -0800
Subject: [PATCH 135/305] Switch backTo for response and confirm page if you're
 offline

---
 src/libs/Navigation/types.ts                  |  5 ++-
 .../ExitSurvey/ExitSurveyConfirmPage.tsx      | 34 ++++++++++++++++---
 .../ExitSurvey/ExitSurveyResponsePage.tsx     | 22 +++++++++---
 3 files changed, 51 insertions(+), 10 deletions(-)

diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts
index 6e1942f8a8fb..d656daf3580d 100644
--- a/src/libs/Navigation/types.ts
+++ b/src/libs/Navigation/types.ts
@@ -172,8 +172,11 @@ type SettingsNavigatorParamList = {
     [SCREENS.SETTINGS.EXIT_SURVEY.REASON]: undefined;
     [SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE]: {
         [EXIT_SURVEY_REASON_FORM_INPUT_IDS.REASON]: ValueOf<typeof CONST.EXIT_SURVEY.REASONS>;
+        backTo: Routes;
+    };
+    [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: {
+        backTo: Routes;
     };
-    [SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM]: undefined;
 } & ReimbursementAccountNavigatorParamList;
 
 type NewChatNavigatorParamList = {
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
index 15f9becd6580..7459819afd99 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyConfirmPage.tsx
@@ -1,4 +1,5 @@
-import React from 'react';
+import type {StackScreenProps} from '@react-navigation/stack';
+import React, {useCallback, useEffect} from 'react';
 import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
@@ -13,12 +14,14 @@ import useLocalize from '@hooks/useLocalize';
 import useNetwork from '@hooks/useNetwork';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@navigation/Navigation';
+import type {SettingsNavigatorParamList} from '@navigation/types';
 import variables from '@styles/variables';
 import * as ExitSurvey from '@userActions/ExitSurvey';
 import * as Link from '@userActions/Link';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
+import type SCREENS from '@src/SCREENS';
 import type {ExitReason, ExitSurveyReasonForm} from '@src/types/form/ExitSurveyReasonForm';
 import EXIT_SURVEY_REASON_INPUT_IDS from '@src/types/form/ExitSurveyReasonForm';
 import ExitSurveyOffline from './ExitSurveyOffline';
@@ -28,15 +31,38 @@ type ExitSurveyConfirmPageOnyxProps = {
     isLoading: OnyxEntry<boolean>;
 };
 
-function ExitSurveyConfirmPage({exitReason, isLoading}: ExitSurveyConfirmPageOnyxProps) {
+type ExitSurveyConfirmPageProps = ExitSurveyConfirmPageOnyxProps & StackScreenProps<SettingsNavigatorParamList, typeof SCREENS.SETTINGS.EXIT_SURVEY.CONFIRM>;
+
+function ExitSurveyConfirmPage({exitReason, isLoading, route, navigation}: ExitSurveyConfirmPageProps) {
     const {translate} = useLocalize();
     const {isOffline} = useNetwork();
     const styles = useThemeStyles();
+
+    const getBackToParam = useCallback(() => {
+        if (isOffline) {
+            return ROUTES.SETTINGS;
+        }
+        if (exitReason) {
+            return ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(exitReason, ROUTES.SETTINGS_EXIT_SURVEY_REASON);
+        }
+        return ROUTES.SETTINGS;
+    }, [exitReason, isOffline]);
+    const {backTo} = route.params;
+    useEffect(() => {
+        const newBackTo = getBackToParam();
+        if (backTo === newBackTo) {
+            return;
+        }
+        navigation.setParams({
+            backTo: newBackTo,
+        });
+    }, [backTo, getBackToParam, navigation]);
+
     return (
         <ScreenWrapper testID={ExitSurveyConfirmPage.displayName}>
             <HeaderWithBackButton
                 title={translate('exitSurvey.header')}
-                onBackButtonPress={() => Navigation.goBack(exitReason ? ROUTES.SETTINGS_EXIT_SURVEY_RESPONSE.getRoute(exitReason, ROUTES.SETTINGS_EXIT_SURVEY_REASON) : undefined)}
+                onBackButtonPress={() => Navigation.goBack(backTo)}
             />
             <View style={[styles.flex1, styles.justifyContentCenter, styles.alignItemsCenter, styles.mh5]}>
                 {isOffline && <ExitSurveyOffline />}
@@ -70,7 +96,7 @@ function ExitSurveyConfirmPage({exitReason, isLoading}: ExitSurveyConfirmPageOny
 
 ExitSurveyConfirmPage.displayName = 'ExitSurveyConfirmPage';
 
-export default withOnyx<ExitSurveyConfirmPageOnyxProps, ExitSurveyConfirmPageOnyxProps>({
+export default withOnyx<ExitSurveyConfirmPageProps, ExitSurveyConfirmPageOnyxProps>({
     exitReason: {
         key: ONYXKEYS.FORMS.EXIT_SURVEY_REASON_FORM,
         selector: (value: OnyxEntry<ExitSurveyReasonForm>) => value?.[EXIT_SURVEY_REASON_INPUT_IDS.REASON],
diff --git a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
index 9a23e3406521..c43ef8dd9320 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyResponsePage.tsx
@@ -1,5 +1,5 @@
 import type {StackScreenProps} from '@react-navigation/stack';
-import React, {useCallback} from 'react';
+import React, {useCallback, useEffect} from 'react';
 import {withOnyx} from 'react-native-onyx';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
@@ -36,16 +36,28 @@ type ExitSurveyResponsePageOnyxProps = {
 
 type ExitSurveyResponsePageProps = ExitSurveyResponsePageOnyxProps & StackScreenProps<SettingsNavigatorParamList, typeof SCREENS.SETTINGS.EXIT_SURVEY.RESPONSE>;
 
-function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePageProps) {
+function ExitSurveyResponsePage({draftResponse, route, navigation}: ExitSurveyResponsePageProps) {
     const {translate} = useLocalize();
-    const {isOffline} = useNetwork();
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     const {keyboardHeight} = useKeyboardState();
     const {windowHeight} = useWindowDimensions();
     const {top: safeAreaInsetsTop} = useSafeAreaInsets();
 
-    const {reason} = route.params;
+    const {reason, backTo} = route.params;
+    const {isOffline} = useNetwork({
+        onReconnect: () => {
+            navigation.setParams({
+                backTo: ROUTES.SETTINGS_EXIT_SURVEY_REASON,
+            });
+        },
+    });
+    useEffect(() => {
+        if (!isOffline || backTo === ROUTES.SETTINGS) {
+            return;
+        }
+        navigation.setParams({backTo: ROUTES.SETTINGS});
+    }, [backTo, isOffline, navigation]);
 
     const submitForm = useCallback(() => {
         ExitSurvey.saveResponse(draftResponse);
@@ -86,7 +98,7 @@ function ExitSurveyResponsePage({draftResponse, route}: ExitSurveyResponsePagePr
         <ScreenWrapper testID={ExitSurveyResponsePage.displayName}>
             <HeaderWithBackButton
                 title={translate('exitSurvey.header')}
-                onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_EXIT_SURVEY_REASON)}
+                onBackButtonPress={() => Navigation.goBack(backTo)}
             />
             <FormProvider
                 formID={ONYXKEYS.FORMS.EXIT_SURVEY_RESPONSE_FORM}

From 18624a8f26ce12ef3622d654e861deb753e812fa Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 15 Feb 2024 08:43:25 +0100
Subject: [PATCH 136/305] update workflows translations

---
 src/languages/en.ts | 4 ++--
 src/languages/es.ts | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index d35b377a376e..ebc4204c80e8 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -997,7 +997,7 @@ export default {
         workflowTitle: 'Spend workflow',
         workflowDescription: 'Configure a workflow from the moment spend occurs, including approval and payment.',
         delaySubmissionTitle: 'Delay submissions',
-        delaySubmissionDescription: 'Set a slower cadence to receive expense submissions.',
+        delaySubmissionDescription: 'Expenses are shared right away for better spend visibility. Set a slower cadence if needed.',
         submissionFrequency: 'Submission frequency',
         weeklyFrequency: 'Weekly',
         monthlyFrequency: 'Monthly',
@@ -1008,7 +1008,7 @@ export default {
         addApprovalsTitle: 'Add approvals',
         approver: 'Approver',
         connectBankAccount: 'Connect bank account',
-        addApprovalsDescription: 'Set a slower cadence to receive expense submissions in real time.',
+        addApprovalsDescription: 'Require additional approval before authorizing a payment.',
         makeOrTrackPaymentsTitle: 'Make or track payments',
         makeOrTrackPaymentsDescription: 'Add an authorized payer for payments made in Expensify, or simply track payments made elsewhere.',
     },
diff --git a/src/languages/es.ts b/src/languages/es.ts
index e43a857d5087..a471752f5c3b 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -993,7 +993,7 @@ export default {
         workflowTitle: 'Flujo de trabajo de gastos',
         workflowDescription: 'Configure un flujo de trabajo desde el momento en que se produce el gasto, incluida la aprobación y el pago.',
         delaySubmissionTitle: 'Retrasar las presentaciones',
-        delaySubmissionDescription: 'Establezca una cadencia más lenta para recibir los envíos de gastos.',
+        delaySubmissionDescription: 'Los gastos se comparten de inmediato para una mejor visibilidad del gasto. Establece una cadencia más lenta si es necesario.',
         addApprovalsTitle: 'Añadir aprobacións',
         approver: 'Aprobador',
         submissionFrequency: 'Frecuencia de envío',
@@ -1004,7 +1004,7 @@ export default {
         manuallyFrequency: 'Manualmente',
         dailyFrequency: 'Diario',
         connectBankAccount: 'Conectar cuenta bancaria',
-        addApprovalsDescription: 'Establezca una cadencia más lenta para recibir los envíos de gastos en tiempo real.',
+        addApprovalsDescription: 'Requiere una aprobación adicional antes de autorizar un pago.',
         makeOrTrackPaymentsTitle: 'Realizar o seguir pagos',
         makeOrTrackPaymentsDescription: 'Añada un pagador autorizado para los pagos realizados en Expensify, o simplemente realice un seguimiento de los pagos realizados en otro lugar.',
     },

From 906dbdd26c48f8cfdf4d5712c050804a717f9727 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 15 Feb 2024 15:10:00 +0100
Subject: [PATCH 137/305] update svg so it takes less space on the left x axis

---
 .../simple-illustration__receipt-envelope.svg                   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg b/assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg
index d16bea869771..61d63f506a9b 100644
--- a/assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg
+++ b/assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg
@@ -1 +1 @@
-<svg fill="none" viewBox="0 0 20 40" xmlns="http://www.w3.org/2000/svg"><path d="m4.2457 24.812h12.194s1.7429-0.3283 1.7429-3.0596v-19.819l-2.3081 1.9766-1.8345-2.2608-1.8345 2.2608-2.0713-2.1187-2.1187 2.2134-1.7429-2.2134-1.7429 2.166-2.0713-1.8345v9.0872l1.7903 13.606-0.00316-0.0032z" fill="#FFFAF0" stroke="#002140" stroke-miterlimit="10" stroke-width=".99999"/><path d="m19.25 9.2266h-18.149v29.374h18.149v-29.374z" fill="#FFA75A" stroke="#002140" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/><path d="m19.25 38.6s0.3-2.084-2.2102-2.084h-14.032c-1.8503 0-1.9103 2.084-1.9103 2.084" stroke="#002140" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/><path d="m10.175 9.2266v27.24" stroke="#002140" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/></svg>
\ No newline at end of file
+<svg fill="none" viewBox="0 0 20 40" xmlns="http://www.w3.org/2000/svg"><path d="m0 24.812h12.194s1.7429-0.3283 1.7429-3.0596v-19.819l-2.3081 1.9766-1.8345-2.2608-1.8345 2.2608-2.0713-2.1187-2.1187 2.2134-1.7429-2.2134-1.7429 2.166-2.0713-1.8345v9.0872l1.7903 13.606-0.00316-0.0032z" fill="#FFFAF0" stroke="#002140" stroke-miterlimit="10" stroke-width=".99999"/><path d="m15 9.2266h-18.149v29.374h18.149v-29.374z" fill="#FFA75A" stroke="#002140" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/><path d="m15 38.6s0.3-2.084-2.2102-2.084h-14.032c-1.8503 0-1.9103 2.084-1.9103 2.084" stroke="#002140" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/><path d="m6 9.2266v27.24" stroke="#002140" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/></svg>
\ No newline at end of file

From 7224a43c5b26256ac1ce36649c883b233d70ddc6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 15 Feb 2024 15:10:16 +0100
Subject: [PATCH 138/305] add new workflows styles

---
 src/styles/index.ts | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/styles/index.ts b/src/styles/index.ts
index 7076dd455e47..b04d51b6a66f 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4449,6 +4449,8 @@ const styles = (theme: ThemeColors) =>
             height: 48,
             width: 48,
             marginRight: 12,
+            zIndex: 2,
+            paddingBottom: 15,
         },
         workspaceWorkflowContent: {
             flexDirection: 'row', 
@@ -4490,6 +4492,14 @@ const styles = (theme: ThemeColors) =>
             fontSize: 15,
             lineHeight: 20
         },
+        workspaceWorkflowsTimelineOverride: {
+            backgroundColor: theme.cardBG, 
+            zIndex: 1, 
+            height: 19, 
+            width: 19, 
+            position: 'absolute', 
+            left:0,
+        },
     } satisfies Styles);
 
 type ThemeStyles = ReturnType<typeof styles>;

From c3c3b4b4e27f77c532b2ea796a91ab1e750cc3f6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 15 Feb 2024 15:11:04 +0100
Subject: [PATCH 139/305] take into account vertical timeline below icons

---
 .../workflows/ToggleSettingsOptionRow.tsx     | 63 ++++++++++++-------
 1 file changed, 39 insertions(+), 24 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 8365b2b65f57..b5f15e7eef63 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -1,9 +1,10 @@
 import Switch from "@components/Switch";
 import Text from "@components/Text";
-import useThemeStyles from "@hooks/useThemeStyles";
+import getIsSmallScreenWidth from "@libs/getIsSmallScreenWidth";
 import React, { useState } from "react";
 import { View } from "react-native";
 import { SvgProps } from "react-native-svg";
+import useThemeStyles from "@hooks/useThemeStyles";
 
 export type OptionType = {
     Illustration: React.ElementType<SvgProps>;
@@ -11,9 +12,10 @@ export type OptionType = {
     subtitle: string;
     onToggle: (isEnabled: boolean) => void;
     subMenuItems?: React.ReactNode;
+    isEndOptionRow?: boolean;
 };
 
-const ToggleSettingOptionRow = ({ Illustration, title, subtitle, onToggle, subMenuItems }: OptionType) => {
+const ToggleSettingOptionRow = ({ Illustration, title, subtitle, onToggle, subMenuItems, isEndOptionRow }: OptionType) => {
     const [isEnabled, setIsEnabled] = useState(false);
     const styles = useThemeStyles();
   
@@ -21,33 +23,46 @@ const ToggleSettingOptionRow = ({ Illustration, title, subtitle, onToggle, subMe
       setIsEnabled(previousState => !previousState);
       onToggle(!isEnabled);
     };
-  
+    const isSmallScreenWidth = getIsSmallScreenWidth();
+
     return (
-    <View>   
-        <View style={styles.workspaceWorkflowContainer}>        
-            <View style={styles.workspaceWorkflowContent}>
-                <View>
-                    <Illustration style={styles.workspaceWorkflowsIcon} />
+        <View style={styles.pRelative}>   
+            <View style={styles.workspaceWorkflowContainer}>        
+                <View style={styles.workspaceWorkflowContent}>
+                        <Illustration style={styles.workspaceWorkflowsIcon} />
+                        <View style={styles.workspaceWorkflowsTimelineOverride}/>
+                        {!isEndOptionRow && (
+                            <View style={{
+                                                position: 'absolute',
+                                                width: 6,
+                                                backgroundImage: 'radial-gradient(circle at 2.5px, #1A3D32 1.25px, rgba(255, 255, 255, 0) 2.5px)',
+                                                backgroundPosition: 'top, right, bottom, left',
+                                                backgroundSize: '5px 15px',
+                                                backgroundRepeat: 'repeat-y',                                        
+                                                top: isSmallScreenWidth ? '32%' : '12%',
+                                                bottom: isEnabled ? '-180%' : '-100%',
+                                                left: isSmallScreenWidth ? '6%' : '2.45%',
+                                            }} />
+                        )}
+                    <View style={styles.workspaceWorkflowsWrapperText}>
+                        <Text style={styles.workspaceWorkflowsHeading}>{title}</Text>
+                        <Text style={styles.workspaceWorkflowsSubtitle}>{subtitle}</Text>
+                    </View>
                 </View>
-                <View style={styles.workspaceWorkflowsWrapperText}>
-                    <Text style={styles.workspaceWorkflowsHeading}>{title}</Text>
-                    <Text style={styles.workspaceWorkflowsSubtitle}>{subtitle}</Text>
+                <View>
+                    <Switch
+                        accessibilityLabel={subtitle}
+                        onToggle={toggleSwitch}
+                        isOn={isEnabled}
+                    />
                 </View>
             </View>
-            <View>
-                <Switch
-                    accessibilityLabel={subtitle}
-                    onToggle={toggleSwitch}
-                    isOn={isEnabled}
-                />
-            </View>
+            {isEnabled && (
+                <View>
+                    {subMenuItems}
+                </View>
+            )}   
         </View>
-        {isEnabled && (
-            <View>
-                {subMenuItems}
-            </View>
-        )}
-    </View>
     );
   };
 

From 79a20fe5ae4cfbe95d8a7caa8cbfd4d6518b8d7b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 15 Feb 2024 15:11:30 +0100
Subject: [PATCH 140/305] take into account timeline edge case

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 78029917ebd5..9cd77e87dd76 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -78,6 +78,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
               />
             ),
+            isEndOptionRow: true,
           },
     ];
 
@@ -89,6 +90,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 subtitle={item.subtitle}                    
                 onToggle={item.onToggle}
                 subMenuItems={item.subMenuItems}
+                isEndOptionRow={item.isEndOptionRow}
             />
         </View>
     );
@@ -111,7 +113,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                                 data={items}
                                 renderItem={renderItem}
                                 keyExtractor={(item: OptionType) => item.title}
-                            />                            
+                            />          
                         </View>
                     </Section>
                 </View>

From 77e1f0fa5512919d1c0c5c5e41d7a5d2d091c701 Mon Sep 17 00:00:00 2001
From: Yauheni Pasiukevich <pasyukevich@live.com>
Date: Thu, 15 Feb 2024 16:57:56 +0100
Subject: [PATCH 141/305] fix comments

---
 src/libs/ReportActionsUtils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/libs/ReportActionsUtils.ts b/src/libs/ReportActionsUtils.ts
index cda382580bed..c639fb70dd19 100644
--- a/src/libs/ReportActionsUtils.ts
+++ b/src/libs/ReportActionsUtils.ts
@@ -459,7 +459,7 @@ function replaceBaseURLInPolicyChangeLogAction(reportAction: ReportAction): Repo
     return updatedReportAction;
 }
 
-function getLastVisibleAction(reportID: string | number, actionsToMerge: OnyxCollection<ReportAction> = {}): OnyxEntry<ReportAction> {
+function getLastVisibleAction(reportID: string, actionsToMerge: OnyxCollection<ReportAction> = {}): OnyxEntry<ReportAction> {
     const reportActions = Object.values(fastMerge(allReportActions?.[reportID] ?? {}, actionsToMerge ?? {}, true));
     const visibleReportActions = Object.values(reportActions ?? {}).filter((action): action is ReportAction => shouldReportActionBeVisibleAsLastAction(action));
     const sortedReportActions = getSortedReportActions(visibleReportActions, true);

From f7ccbc321793bc3d585f3425fc132a4b5f9a6b2f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 08:10:28 +0100
Subject: [PATCH 142/305] add approval keys

---
 src/types/onyx/Policy.ts | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/types/onyx/Policy.ts b/src/types/onyx/Policy.ts
index e63e87adfa2a..b40163910cf5 100644
--- a/src/types/onyx/Policy.ts
+++ b/src/types/onyx/Policy.ts
@@ -138,9 +138,15 @@ type Policy = {
     /** Whether policy is updating */
     isPolicyUpdating?: boolean;
 
+    /** The approver of the policy */
+    approver: string;
+
     /** The approval mode set up on this policy */
     approvalMode?: ValueOf<typeof CONST.POLICY.APPROVAL_MODE>;
 
+    /** Whether the auto approval is enabled */
+    isAutoApprovalEnabled: boolean;
+
     /** Whether transactions should be billable by default */
     defaultBillable?: boolean;
 

From 00dec0566ba546d6e30a2ae3c6c5e253555b6284 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 08:11:18 +0100
Subject: [PATCH 143/305] add method to check if it's a collect policy

---
 src/libs/PolicyUtils.ts | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/libs/PolicyUtils.ts b/src/libs/PolicyUtils.ts
index 90dfa8fde339..2e261cf26384 100644
--- a/src/libs/PolicyUtils.ts
+++ b/src/libs/PolicyUtils.ts
@@ -108,6 +108,8 @@ function isExpensifyGuideTeam(email: string): boolean {
  */
 const isPolicyAdmin = (policy: OnyxEntry<Policy> | EmptyObject): boolean => policy?.role === CONST.POLICY.ROLE.ADMIN;
 
+const isCollectPolicy = (policy: OnyxEntry<Policy> | EmptyObject): boolean => policy?.type === CONST.POLICY.TYPE.TEAM;
+
 const isPolicyMember = (policyID: string, policies: OnyxCollection<Policy>): boolean => Object.values(policies ?? {}).some((policy) => policy?.id === policyID);
 
 /**
@@ -250,6 +252,7 @@ export {
     isExpensifyTeam,
     isExpensifyGuideTeam,
     isInstantSubmitEnabled,
+    isCollectPolicy,
     isPolicyAdmin,
     isSubmitAndClose,
     getMemberAccountIDsForWorkspace,

From c594e299cd664dee69ed9e17cb1575746eb3da0f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 08:11:28 +0100
Subject: [PATCH 144/305] restrict workflows to collect policy

---
 src/pages/workspace/WorkspaceInitialPage.tsx | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index cf67a18ae4e1..f2b83703a999 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -96,16 +96,10 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
 
     const hasMembersError = PolicyUtils.hasPolicyMemberError(policyMembers);
     const hasGeneralSettingsError = !isEmptyObject(policy?.errorFields?.generalSettings ?? {}) || !isEmptyObject(policy?.errorFields?.avatar ?? {});
-
     const shouldShowProtectedItems = PolicyUtils.isPolicyAdmin(policy);
+    const isCollectPolicy = PolicyUtils.isCollectPolicy(policy);
 
     const protectedMenuItems: WorkspaceMenuItem[] = [
-        {
-            translationKey: 'workspace.common.workflows',
-            icon: Expensicons.Workflows,
-            action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID)))),
-            routeName: SCREENS.WORKSPACE.WORKFLOWS,
-        },
         {
             translationKey: 'workspace.common.card',
             icon: Expensicons.ExpensifyCard,
@@ -153,6 +147,13 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
             brickRoadIndicator: !isEmptyObject(reimbursementAccount?.errors) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
         },
     ];
+    const protectedCollectPolicyMenuItems: WorkspaceMenuItem[] = [{
+        translationKey: 'workspace.common.workflows',
+        icon: Expensicons.Workflows,
+        action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID)))),
+        routeName: SCREENS.WORKSPACE.WORKFLOWS,
+        },
+    ];
 
     const menuItems: WorkspaceMenuItem[] = [
         {
@@ -162,6 +163,7 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
             brickRoadIndicator: hasGeneralSettingsError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             routeName: SCREENS.WORKSPACE.PROFILE,
         },
+        ...(isCollectPolicy ? protectedCollectPolicyMenuItems : []),
         ...(shouldShowProtectedItems ? protectedMenuItems : []),
     ];
 

From 8df6c6ab4de5f6f7719f858ada6ac3a5cf423df6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 08:12:04 +0100
Subject: [PATCH 145/305] add workspace workflows related api commands

---
 src/libs/API/types.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/libs/API/types.ts b/src/libs/API/types.ts
index f5d99d8cf40e..cbca447e725d 100644
--- a/src/libs/API/types.ts
+++ b/src/libs/API/types.ts
@@ -8,6 +8,8 @@ import type UpdateBeneficialOwnersForBankAccountParams from './parameters/Update
 type ApiRequest = ValueOf<typeof CONST.API_REQUEST_TYPE>;
 
 const WRITE_COMMANDS = {
+    SET_WORKSPACE_AUTO_REPORTING: 'SetWorkspaceAutoReporting',
+    SET_WORKSPACE_APPROVAL_MODE: 'SetWorkspaceApprovalMode',
     DISMISS_REFERRAL_BANNER: 'DismissReferralBanner',
     UPDATE_PREFERRED_LOCALE: 'UpdatePreferredLocale',
     RECONNECT_APP: 'ReconnectApp',

From 78b608da70a96747f5983bd2eccd9801a5a673c0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 08:12:38 +0100
Subject: [PATCH 146/305] add workspace workflows related api commands types

---
 src/libs/API/parameters/SetWorkspaceApprovalModeParams.ts  | 6 ++++++
 src/libs/API/parameters/SetWorkspaceAutoReportingParams.ts | 6 ++++++
 2 files changed, 12 insertions(+)
 create mode 100644 src/libs/API/parameters/SetWorkspaceApprovalModeParams.ts
 create mode 100644 src/libs/API/parameters/SetWorkspaceAutoReportingParams.ts

diff --git a/src/libs/API/parameters/SetWorkspaceApprovalModeParams.ts b/src/libs/API/parameters/SetWorkspaceApprovalModeParams.ts
new file mode 100644
index 000000000000..6f5b88e36532
--- /dev/null
+++ b/src/libs/API/parameters/SetWorkspaceApprovalModeParams.ts
@@ -0,0 +1,6 @@
+type SetWorkspaceApprovalModeParams = {
+    policyID: string
+    value: string,
+};
+
+export default SetWorkspaceApprovalModeParams;
diff --git a/src/libs/API/parameters/SetWorkspaceAutoReportingParams.ts b/src/libs/API/parameters/SetWorkspaceAutoReportingParams.ts
new file mode 100644
index 000000000000..a87817986ffa
--- /dev/null
+++ b/src/libs/API/parameters/SetWorkspaceAutoReportingParams.ts
@@ -0,0 +1,6 @@
+type SetWorkspaceAutoReportingParams = {
+    policyID: string;
+    enabled: boolean;
+};
+
+export default SetWorkspaceAutoReportingParams;

From 7d35834d4db1cf005418c6d46182f2a5a9a5bf7b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 08:13:57 +0100
Subject: [PATCH 147/305] handle workspace auto reporting and approval mode

---
 src/libs/actions/Policy.ts | 40 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index d492f77fcdce..c9fd181b28cd 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -52,6 +52,8 @@ import type {Errors} from '@src/types/onyx/OnyxCommon';
 import type {Attributes, CustomUnit, Rate, Unit} from '@src/types/onyx/Policy';
 import type {EmptyObject} from '@src/types/utils/EmptyObject';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
+import SetWorkspaceAutoReportingParams from '@libs/API/parameters/SetWorkspaceAutoReportingParams';
+import SetWorkspaceApprovalModeParams from '@libs/API/parameters/SetWorkspaceApprovalModeParams';
 
 type AnnounceRoomMembersOnyxData = {
     onyxOptimisticData: OnyxUpdate[];
@@ -378,6 +380,42 @@ function buildAnnounceRoomMembersOnyxData(policyID: string, accountIDs: number[]
     return announceRoomMembers;
 }
 
+function setWorkspaceAutoReporting(policyID: string, isEnabled: boolean) {
+    const optimisticData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                autoReporting: true,
+            },
+        },
+    ];
+
+    const params: SetWorkspaceAutoReportingParams = {policyID, enabled: isEnabled};
+    API.write(WRITE_COMMANDS.SET_WORKSPACE_AUTO_REPORTING, params, {optimisticData});
+}
+
+function setWorkspaceApprovalMode(policyID: string, approver: string, approvalMode: "BASIC" | "OPTIONAL") {
+    const isAutoApprovalEnabled = approvalMode === "BASIC";
+
+    const value = JSON.stringify({
+        approver: approver,
+        approvalMode: approvalMode,
+        isAutoApprovalEnabled: isAutoApprovalEnabled,
+    });
+    const optimisticData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: JSON.parse(value),
+        },
+    ];
+
+    const params: SetWorkspaceApprovalModeParams = {policyID, value};
+    API.write(WRITE_COMMANDS.SET_WORKSPACE_APPROVAL_MODE, params, {optimisticData});
+}
+
+
 /**
  * Build optimistic data for removing users from the announcement room
  */
@@ -2069,4 +2107,6 @@ export {
     buildOptimisticPolicyRecentlyUsedTags,
     createDraftInitialWorkspace,
     setWorkspaceInviteMessageDraft,
+    setWorkspaceAutoReporting,
+    setWorkspaceApprovalMode,
 };

From 6ee9bbf46b0eb60f5f659511b71e2ac36d410f91 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 08:14:29 +0100
Subject: [PATCH 148/305] handle submission and approval api calls

---
 .../workspace/workflows/WorkspaceWorkflowsPage.tsx  | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 9cd77e87dd76..d7d969ada4e5 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -15,6 +15,9 @@ import ToggleSettingOptionRow, { OptionType } from './ToggleSettingsOptionRow';
 import MenuItem from '@components/MenuItem';
 import compose from '@libs/compose';
 import withPolicy, {WithPolicyProps} from '@pages/workspace/withPolicy';
+import * as Policy from '@userActions/Policy';
+import Navigation from '@libs/Navigation/Navigation';
+import ROUTES from '@src/ROUTES';
 
 type WorkspaceWorkflowsPageProps = WithPolicyProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
 
@@ -29,7 +32,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
           title: translate('workflowsPage.delaySubmissionTitle'),
           subtitle: translate('workflowsPage.delaySubmissionDescription'),
           onToggle: (isEnabled: boolean) => {
-              // TODO call API routes && set onyx optimistic data
+              Policy.setWorkspaceAutoReporting(route.params.policyID, isEnabled);
           },
           subMenuItems: (
                 <MenuItem
@@ -37,7 +40,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 titleStyle={styles.workspaceWorkflowsSubMenuTitle}
                 descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
                 description={translate('workflowsPage.weeklyFrequency')}
-                onPress={() => {}}
+                // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_AUTOREPORTING_FREQUENCY.getRoute(route.params.policyID))}
                 shouldShowRightIcon={true}
                 wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
                 />
@@ -48,7 +51,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             title: translate('workflowsPage.addApprovalsTitle'),
             subtitle: translate('workflowsPage.addApprovalsDescription'),
             onToggle: (isEnabled: boolean) => {
-              // TODO call API routes && set onyx optimistic data
+                Policy.setWorkspaceApprovalMode(route.params.policyID, policy?.owner ?? '', isEnabled ? 'BASIC' : 'OPTIONAL');
             },
             subMenuItems: (
               <MenuItem
@@ -56,7 +59,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 titleStyle={styles.workspaceWorkflowsSubMenuTitle}
                 descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
                 description={policy?.owner ?? ''}
-                onPress={() => {}}
+                // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
                 shouldShowRightIcon={true}
                 wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
               />
@@ -73,7 +76,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 <MenuItem
                 descriptionTextStyle={[styles.workspaceWorkflowsSubMenuDescription, styles.textSupporting]}
                 description={translate('workflowsPage.connectBankAccount')}
-                onPress={() => {}}
+                // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
                 shouldShowRightIcon={true}
                 wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
               />

From 5942299adb141b8a7a7848c82a3d8de9fb696d55 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 09:08:03 +0100
Subject: [PATCH 149/305] update translation for workflows title

---
 src/languages/en.ts | 2 +-
 src/languages/es.ts | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index ebc4204c80e8..0d0343bf40f8 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -994,7 +994,7 @@ export default {
     },
     workflowsPage:
     {
-        workflowTitle: 'Spend workflow',
+        workflowTitle: 'Spend',
         workflowDescription: 'Configure a workflow from the moment spend occurs, including approval and payment.',
         delaySubmissionTitle: 'Delay submissions',
         delaySubmissionDescription: 'Expenses are shared right away for better spend visibility. Set a slower cadence if needed.',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index a471752f5c3b..3c55f594b5b1 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -990,7 +990,7 @@ export default {
     },
     workflowsPage:
     {
-        workflowTitle: 'Flujo de trabajo de gastos',
+        workflowTitle: 'Gasto',
         workflowDescription: 'Configure un flujo de trabajo desde el momento en que se produce el gasto, incluida la aprobación y el pago.',
         delaySubmissionTitle: 'Retrasar las presentaciones',
         delaySubmissionDescription: 'Los gastos se comparten de inmediato para una mejor visibilidad del gasto. Establece una cadencia más lenta si es necesario.',

From 17b63b030f410e68eed812f33122875b2500a14c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 11:57:28 +0100
Subject: [PATCH 150/305] remove useless css property

---
 src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index b5f15e7eef63..99f849aca1ea 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -36,7 +36,6 @@ const ToggleSettingOptionRow = ({ Illustration, title, subtitle, onToggle, subMe
                                                 position: 'absolute',
                                                 width: 6,
                                                 backgroundImage: 'radial-gradient(circle at 2.5px, #1A3D32 1.25px, rgba(255, 255, 255, 0) 2.5px)',
-                                                backgroundPosition: 'top, right, bottom, left',
                                                 backgroundSize: '5px 15px',
                                                 backgroundRepeat: 'repeat-y',                                        
                                                 top: isSmallScreenWidth ? '32%' : '12%',

From 167b35baf5d030f502c86f1df36fceff34a0519c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 11:58:20 +0100
Subject: [PATCH 151/305] new style for workflows subitems hover

---
 src/styles/index.ts | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/styles/index.ts b/src/styles/index.ts
index b04d51b6a66f..d4fa61877a71 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4500,6 +4500,11 @@ const styles = (theme: ThemeColors) =>
             position: 'absolute', 
             left:0,
         },
+        workspaceWorkflowsSubItemHover: {
+            borderRadius: 8,
+            marginRight: 0,
+            transition: 'all 0.3s ease-in-out',
+        }
     } satisfies Styles);
 
 type ThemeStyles = ReturnType<typeof styles>;

From 53e6b6c387fe4539e9bbd790761257e6af0e3102 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 11:58:45 +0100
Subject: [PATCH 152/305] use new style for hover on sub items

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index d7d969ada4e5..fb19f3bc64b8 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -43,6 +43,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_AUTOREPORTING_FREQUENCY.getRoute(route.params.policyID))}
                 shouldShowRightIcon={true}
                 wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
+                hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
                 />
           ),
         },
@@ -62,6 +63,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
                 shouldShowRightIcon={true}
                 wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
+                hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
               />
             ),
           },
@@ -69,7 +71,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             Illustration: Illustrations.WalletAlt,
             title: translate('workflowsPage.makeOrTrackPaymentsTitle'),
             subtitle: translate('workflowsPage.makeOrTrackPaymentsDescription'),
-            onToggle: (isEnabled: boolean) => {
+            onToggle: (_isEnabled: boolean) => {
               // TODO call API routes && set onyx optimistic data
             },
             subMenuItems: (
@@ -79,6 +81,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
                 shouldShowRightIcon={true}
                 wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
+                hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
               />
             ),
             isEndOptionRow: true,
@@ -107,9 +110,9 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             guidesCallTaskID={CONST.GUIDES_CALL_TASK_IDS.WORKSPACE_WORKFLOWS}
             shouldShowOfflineIndicatorInWideScreen
         >
-            {(_, policyID: string) => (
+            {(_hasVBA?: boolean, _policyID?: string) => (
                 <View style={[styles.mt3, styles.textStrong, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
-                    <Section title={translate('workflowsPage.workflowTitle')} titleStyles={styles.textStrong} containerStyles={styles.p8}>
+                    <Section title={translate('workflowsPage.workflowTitle')} titleStyles={styles.textStrong} containerStyles={isSmallScreenWidth ? styles.p5: styles.p8}>
                         <View>
                             <Text style={[styles.mt3, styles.textSupporting]}>{translate('workflowsPage.workflowDescription')}</Text>
                             <FlatList

From b6c720b501a689e881618ee455ccb7e06d91c8e4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 12:04:44 +0100
Subject: [PATCH 153/305] fix typo

---
 src/styles/index.ts | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/styles/index.ts b/src/styles/index.ts
index d51457260713..ab73f8a81858 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4632,8 +4632,7 @@ const styles = (theme: ThemeColors) =>
             borderRadius: 8,
             marginRight: 0,
             transition: 'all 0.3s ease-in-out',
-        }
-
+        },
         workspaceTitleStyle: {
             fontFamily: FontUtils.fontFamily.platform.EXP_NEUE_BOLD,
             fontWeight: '500',

From d5a100d0d5c5123bc95151e759e4292cef9390eb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 14:08:45 +0100
Subject: [PATCH 154/305] fix lint

---
 src/libs/API/parameters/index.ts              |  2 +
 src/libs/actions/Policy.ts                    | 10 ++--
 .../workspace/WorkspacePageWithSections.tsx   |  2 -
 .../workflows/ToggleSettingsOptionRow.tsx     | 11 +++--
 .../workflows/WorkspaceWorkflowsPage.tsx      | 46 +++++++++----------
 5 files changed, 34 insertions(+), 37 deletions(-)

diff --git a/src/libs/API/parameters/index.ts b/src/libs/API/parameters/index.ts
index ada3b84e6cf4..f61e74033cd5 100644
--- a/src/libs/API/parameters/index.ts
+++ b/src/libs/API/parameters/index.ts
@@ -142,3 +142,5 @@ export type {default as PayMoneyRequestParams} from './PayMoneyRequestParams';
 export type {default as CancelPaymentParams} from './CancelPaymentParams';
 export type {default as AcceptACHContractForBankAccount} from './AcceptACHContractForBankAccount';
 export type {default as UpdateWorkspaceDescriptionParams} from './UpdateWorkspaceDescriptionParams';
+export type {default as SetWorkspaceAutoReportingParams} from './SetWorkspaceAutoReportingParams';
+export type {default as SetWorkspaceApprovalModeParams} from './SetWorkspaceApprovalModeParams';
diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index e734057623bc..a38b467b2d64 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -23,6 +23,8 @@ import type {
     UpdateWorkspaceCustomUnitAndRateParams,
     UpdateWorkspaceDescriptionParams,
     UpdateWorkspaceGeneralSettingsParams,
+    SetWorkspaceAutoReportingParams,
+    SetWorkspaceApprovalModeParams,
 } from '@libs/API/parameters';
 import {READ_COMMANDS, WRITE_COMMANDS} from '@libs/API/types';
 import DateUtils from '@libs/DateUtils';
@@ -53,8 +55,6 @@ import type {Errors} from '@src/types/onyx/OnyxCommon';
 import type {Attributes, CustomUnit, Rate, Unit} from '@src/types/onyx/Policy';
 import type {EmptyObject} from '@src/types/utils/EmptyObject';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
-import SetWorkspaceAutoReportingParams from '@libs/API/parameters/SetWorkspaceAutoReportingParams';
-import SetWorkspaceApprovalModeParams from '@libs/API/parameters/SetWorkspaceApprovalModeParams';
 
 type AnnounceRoomMembersOnyxData = {
     onyxOptimisticData: OnyxUpdate[];
@@ -400,9 +400,9 @@ function setWorkspaceApprovalMode(policyID: string, approver: string, approvalMo
     const isAutoApprovalEnabled = approvalMode === "BASIC";
 
     const value = JSON.stringify({
-        approver: approver,
-        approvalMode: approvalMode,
-        isAutoApprovalEnabled: isAutoApprovalEnabled,
+        approver,
+        approvalMode,
+        isAutoApprovalEnabled,
     });
     const optimisticData: OnyxUpdate[] = [
         {
diff --git a/src/pages/workspace/WorkspacePageWithSections.tsx b/src/pages/workspace/WorkspacePageWithSections.tsx
index c486aa7cad1f..1401e5d5695a 100644
--- a/src/pages/workspace/WorkspacePageWithSections.tsx
+++ b/src/pages/workspace/WorkspacePageWithSections.tsx
@@ -24,7 +24,6 @@ import {isEmptyObject} from '@src/types/utils/EmptyObject';
 import type IconAsset from '@src/types/utils/IconAsset';
 import type {WithPolicyAndFullscreenLoadingProps} from './withPolicyAndFullscreenLoading';
 import withPolicyAndFullscreenLoading from './withPolicyAndFullscreenLoading';
-import IconAsset from '@src/types/utils/IconAsset';
 
 type WorkspacePageWithSectionsOnyxProps = {
     /** From Onyx */
@@ -109,7 +108,6 @@ function WorkspacePageWithSections({
     shouldShowLoading = true,
     shouldShowOfflineIndicatorInWideScreen = false,
     shouldShowNonAdmin = false,
-    icon,
 }: WorkspacePageWithSectionsProps) {
     const styles = useThemeStyles();
     useNetwork({onReconnect: () => fetchData(shouldSkipVBBACall)});
diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 99f849aca1ea..c5e31da48e29 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -3,10 +3,10 @@ import Text from "@components/Text";
 import getIsSmallScreenWidth from "@libs/getIsSmallScreenWidth";
 import React, { useState } from "react";
 import { View } from "react-native";
-import { SvgProps } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
 import useThemeStyles from "@hooks/useThemeStyles";
 
-export type OptionType = {
+type OptionType = {
     Illustration: React.ElementType<SvgProps>;
     title: string;
     subtitle: string;
@@ -15,7 +15,7 @@ export type OptionType = {
     isEndOptionRow?: boolean;
 };
 
-const ToggleSettingOptionRow = ({ Illustration, title, subtitle, onToggle, subMenuItems, isEndOptionRow }: OptionType) => {
+function ToggleSettingOptionRow({ Illustration, title, subtitle, onToggle, subMenuItems, isEndOptionRow }: OptionType) {
     const [isEnabled, setIsEnabled] = useState(false);
     const styles = useThemeStyles();
   
@@ -63,6 +63,7 @@ const ToggleSettingOptionRow = ({ Illustration, title, subtitle, onToggle, subMe
             )}   
         </View>
     );
-  };
+};
 
-  export default ToggleSettingOptionRow;
\ No newline at end of file
+export type {OptionType};
+export default ToggleSettingOptionRow;
\ No newline at end of file
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index fb19f3bc64b8..42c3e923846e 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -11,13 +11,12 @@ import type SCREENS from '@src/SCREENS';
 import Text from '@components/Text';
 import Section from '@components/Section';
 import * as Illustrations from '@components/Icon/Illustrations';
-import ToggleSettingOptionRow, { OptionType } from './ToggleSettingsOptionRow';
-import MenuItem from '@components/MenuItem';
-import compose from '@libs/compose';
-import withPolicy, {WithPolicyProps} from '@pages/workspace/withPolicy';
 import * as Policy from '@userActions/Policy';
-import Navigation from '@libs/Navigation/Navigation';
-import ROUTES from '@src/ROUTES';
+import MenuItem from '@components/MenuItem';
+import withPolicy from '@pages/workspace/withPolicy';
+import type { WithPolicyProps } from '@pages/workspace/withPolicy';
+import ToggleSettingOptionRow from './ToggleSettingsOptionRow';
+import type { OptionType } from './ToggleSettingsOptionRow';
 
 type WorkspaceWorkflowsPageProps = WithPolicyProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
 
@@ -28,24 +27,23 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
 
     const items: OptionType[] = [
         {
-          Illustration: Illustrations.ReceiptEnvelope, // Replace with actual component
-          title: translate('workflowsPage.delaySubmissionTitle'),
-          subtitle: translate('workflowsPage.delaySubmissionDescription'),
-          onToggle: (isEnabled: boolean) => {
-              Policy.setWorkspaceAutoReporting(route.params.policyID, isEnabled);
-          },
-          subMenuItems: (
-                <MenuItem
+            Illustration: Illustrations.ReceiptEnvelope,
+            title: translate('workflowsPage.delaySubmissionTitle'),
+            subtitle: translate('workflowsPage.delaySubmissionDescription'),
+            onToggle: (isEnabled: boolean) => {
+                Policy.setWorkspaceAutoReporting(route.params.policyID, isEnabled);
+            },
+            subMenuItems: (
+             <MenuItem
                 title={translate('workflowsPage.submissionFrequency')}
                 titleStyle={styles.workspaceWorkflowsSubMenuTitle}
                 descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
                 description={translate('workflowsPage.weeklyFrequency')}
-                // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_AUTOREPORTING_FREQUENCY.getRoute(route.params.policyID))}
-                shouldShowRightIcon={true}
+                shouldShowRightIcon
                 wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
                 hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
-                />
-          ),
+              />
+            ),
         },
         {
             Illustration: Illustrations.Approval,
@@ -61,7 +59,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
                 description={policy?.owner ?? ''}
                 // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
-                shouldShowRightIcon={true}
+                shouldShowRightIcon
                 wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
                 hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
               />
@@ -71,7 +69,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             Illustration: Illustrations.WalletAlt,
             title: translate('workflowsPage.makeOrTrackPaymentsTitle'),
             subtitle: translate('workflowsPage.makeOrTrackPaymentsDescription'),
-            onToggle: (_isEnabled: boolean) => {
+            onToggle: () => {
               // TODO call API routes && set onyx optimistic data
             },
             subMenuItems: (
@@ -79,7 +77,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 descriptionTextStyle={[styles.workspaceWorkflowsSubMenuDescription, styles.textSupporting]}
                 description={translate('workflowsPage.connectBankAccount')}
                 // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
-                shouldShowRightIcon={true}
+                shouldShowRightIcon
                 wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
                 hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
               />
@@ -110,7 +108,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             guidesCallTaskID={CONST.GUIDES_CALL_TASK_IDS.WORKSPACE_WORKFLOWS}
             shouldShowOfflineIndicatorInWideScreen
         >
-            {(_hasVBA?: boolean, _policyID?: string) => (
+            {() => (
                 <View style={[styles.mt3, styles.textStrong, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
                     <Section title={translate('workflowsPage.workflowTitle')} titleStyles={styles.textStrong} containerStyles={isSmallScreenWidth ? styles.p5: styles.p8}>
                         <View>
@@ -130,6 +128,4 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
 
 WorkspaceWorkflowsPage.displayName = 'WorkspaceWorkflowsPage';
 
-export default compose(
-    withPolicy,
-)(WorkspaceWorkflowsPage);
+export default withPolicy(WorkspaceWorkflowsPage);

From 9530b17f35d7a26db701aa7690a3e5c44eedfa86 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 14:33:49 +0100
Subject: [PATCH 155/305] fix typechecks

---
 src/languages/es.ts                               | 1 -
 src/libs/API/types.ts                             | 2 ++
 src/pages/workspace/WorkspacePageWithSections.tsx | 3 ---
 src/types/onyx/Policy.ts                          | 4 ++--
 4 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/src/languages/es.ts b/src/languages/es.ts
index 7c22164ddb25..e14a8d9aed9a 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -1714,7 +1714,6 @@ export default {
         common: {
             card: 'Tarjetas',
             workflows: 'Flujos de trabajo',
-            spendWorkflow: 'Flujo de trabajo de gastos',
             workspace: 'Espacio de trabajo',
             edit: 'Editar espacio de trabajo',
             delete: 'Eliminar espacio de trabajo',
diff --git a/src/libs/API/types.ts b/src/libs/API/types.ts
index 26acf21230a7..0a49bb604cf2 100644
--- a/src/libs/API/types.ts
+++ b/src/libs/API/types.ts
@@ -288,6 +288,8 @@ type WriteCommandParameters = {
     [WRITE_COMMANDS.CANCEL_PAYMENT]: Parameters.CancelPaymentParams;
     [WRITE_COMMANDS.ACCEPT_ACH_CONTRACT_FOR_BANK_ACCOUNT]: Parameters.AcceptACHContractForBankAccount;
     [WRITE_COMMANDS.UPDATE_WORKSPACE_DESCRIPTION]: Parameters.UpdateWorkspaceDescriptionParams;
+    [WRITE_COMMANDS.SET_WORKSPACE_AUTO_REPORTING]: Parameters.SetWorkspaceAutoReportingParams;
+    [WRITE_COMMANDS.SET_WORKSPACE_APPROVAL_MODE]: Parameters.SetWorkspaceApprovalModeParams;
 };
 
 const READ_COMMANDS = {
diff --git a/src/pages/workspace/WorkspacePageWithSections.tsx b/src/pages/workspace/WorkspacePageWithSections.tsx
index 1401e5d5695a..71b7cf747887 100644
--- a/src/pages/workspace/WorkspacePageWithSections.tsx
+++ b/src/pages/workspace/WorkspacePageWithSections.tsx
@@ -47,9 +47,6 @@ type WorkspacePageWithSectionsProps = WithPolicyAndFullscreenLoadingProps &
         /** Content to be added as fixed footer */
         footer?: ReactNode;
 
-        /** The icon to display in the header */
-        icon?: IconAsset;
-
         /** The guides call task ID to associate with the workspace page being shown */
         guidesCallTaskID: string;
 
diff --git a/src/types/onyx/Policy.ts b/src/types/onyx/Policy.ts
index 87be13b5b1c3..27629d4fa4c1 100644
--- a/src/types/onyx/Policy.ts
+++ b/src/types/onyx/Policy.ts
@@ -139,13 +139,13 @@ type Policy = {
     isPolicyUpdating?: boolean;
 
     /** The approver of the policy */
-    approver: string;
+    approver?: string;
 
     /** The approval mode set up on this policy */
     approvalMode?: ValueOf<typeof CONST.POLICY.APPROVAL_MODE>;
 
     /** Whether the auto approval is enabled */
-    isAutoApprovalEnabled: boolean;
+    isAutoApprovalEnabled?: boolean;
 
     /** Whether transactions should be billable by default */
     defaultBillable?: boolean;

From fe6cd8c1dc76f49885090a48576937a35de9212e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 14:40:15 +0100
Subject: [PATCH 156/305] fix prettier

---
 src/components/Icon/Expensicons.ts            |  2 +-
 src/components/Icon/Illustrations.ts          |  4 +-
 src/languages/en.ts                           |  3 +-
 src/languages/es.ts                           |  3 +-
 .../SetWorkspaceApprovalModeParams.ts         |  4 +-
 src/libs/actions/Policy.ts                    |  9 +-
 src/pages/workspace/WorkspaceInitialPage.tsx  | 11 +--
 .../workflows/ToggleSettingsOptionRow.tsx     | 66 +++++++-------
 .../workflows/WorkspaceWorkflowsPage.tsx      | 90 ++++++++++---------
 src/styles/index.ts                           | 18 ++--
 10 files changed, 105 insertions(+), 105 deletions(-)

diff --git a/src/components/Icon/Expensicons.ts b/src/components/Icon/Expensicons.ts
index b5bc3d6faa72..b67eded12855 100644
--- a/src/components/Icon/Expensicons.ts
+++ b/src/components/Icon/Expensicons.ts
@@ -142,8 +142,8 @@ import Users from '@assets/images/users.svg';
 import VolumeHigh from '@assets/images/volume-high.svg';
 import VolumeLow from '@assets/images/volume-low.svg';
 import Wallet from '@assets/images/wallet.svg';
-import Workspace from '@assets/images/workspace-default-avatar.svg';
 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 LoungeAccess from './svgs/LoungeAccessIcon';
diff --git a/src/components/Icon/Illustrations.ts b/src/components/Icon/Illustrations.ts
index 0ff999d94e4f..908589e0e78d 100644
--- a/src/components/Icon/Illustrations.ts
+++ b/src/components/Icon/Illustrations.ts
@@ -27,6 +27,7 @@ import TadaBlue from '@assets/images/product-illustrations/tada--blue.svg';
 import TadaYellow from '@assets/images/product-illustrations/tada--yellow.svg';
 import TeleScope from '@assets/images/product-illustrations/telescope.svg';
 import ToddBehindCloud from '@assets/images/product-illustrations/todd-behind-cloud.svg';
+import Approval from '@assets/images/simple-illustrations/simple-illustration__approval.svg';
 import BankArrow from '@assets/images/simple-illustrations/simple-illustration__bank-arrow.svg';
 import BigRocket from '@assets/images/simple-illustrations/simple-illustration__bigrocket.svg';
 import PinkBill from '@assets/images/simple-illustrations/simple-illustration__bill.svg';
@@ -56,6 +57,7 @@ import OpenSafe from '@assets/images/simple-illustrations/simple-illustration__o
 import PalmTree from '@assets/images/simple-illustrations/simple-illustration__palmtree.svg';
 import Profile from '@assets/images/simple-illustrations/simple-illustration__profile.svg';
 import QRCode from '@assets/images/simple-illustrations/simple-illustration__qr-code.svg';
+import ReceiptEnvelope from '@assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg';
 import ReceiptWrangler from '@assets/images/simple-illustrations/simple-illustration__receipt-wrangler.svg';
 import SanFrancisco from '@assets/images/simple-illustrations/simple-illustration__sanfrancisco.svg';
 import ShieldYellow from '@assets/images/simple-illustrations/simple-illustration__shield.svg';
@@ -64,8 +66,6 @@ import ThumbsUpStars from '@assets/images/simple-illustrations/simple-illustrati
 import TrackShoe from '@assets/images/simple-illustrations/simple-illustration__track-shoe.svg';
 import TrashCan from '@assets/images/simple-illustrations/simple-illustration__trashcan.svg';
 import TreasureChest from '@assets/images/simple-illustrations/simple-illustration__treasurechest.svg';
-import Approval from '@assets/images/simple-illustrations/simple-illustration__approval.svg';
-import ReceiptEnvelope from '@assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg';
 import WalletAlt from '@assets/images/simple-illustrations/simple-illustration__wallet-alt.svg';
 import Workflows from '@assets/images/simple-illustrations/simple-illustration__workflows.svg';
 
diff --git a/src/languages/en.ts b/src/languages/en.ts
index f66ce7c5821d..713e4b722dfb 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -1016,8 +1016,7 @@ export default {
         },
         cardDetailsLoadingFailure: 'An error occurred while loading the card details. Please check your internet connection and try again.',
     },
-    workflowsPage:
-    {
+    workflowsPage: {
         workflowTitle: 'Spend',
         workflowDescription: 'Configure a workflow from the moment spend occurs, including approval and payment.',
         delaySubmissionTitle: 'Delay submissions',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index e14a8d9aed9a..cdbecda8bf34 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -1012,8 +1012,7 @@ export default {
         },
         cardDetailsLoadingFailure: 'Se ha producido un error al cargar los datos de la tarjeta. Comprueba tu conexión a Internet e inténtalo de nuevo.',
     },
-    workflowsPage:
-    {
+    workflowsPage: {
         workflowTitle: 'Gasto',
         workflowDescription: 'Configure un flujo de trabajo desde el momento en que se produce el gasto, incluida la aprobación y el pago.',
         delaySubmissionTitle: 'Retrasar las presentaciones',
diff --git a/src/libs/API/parameters/SetWorkspaceApprovalModeParams.ts b/src/libs/API/parameters/SetWorkspaceApprovalModeParams.ts
index 6f5b88e36532..df84fbabbf95 100644
--- a/src/libs/API/parameters/SetWorkspaceApprovalModeParams.ts
+++ b/src/libs/API/parameters/SetWorkspaceApprovalModeParams.ts
@@ -1,6 +1,6 @@
 type SetWorkspaceApprovalModeParams = {
-    policyID: string
-    value: string,
+    policyID: string;
+    value: string;
 };
 
 export default SetWorkspaceApprovalModeParams;
diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index a38b467b2d64..8c8e165cd9ae 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -19,12 +19,12 @@ import type {
     OpenWorkspaceMembersPageParams,
     OpenWorkspaceParams,
     OpenWorkspaceReimburseViewParams,
+    SetWorkspaceApprovalModeParams,
+    SetWorkspaceAutoReportingParams,
     UpdateWorkspaceAvatarParams,
     UpdateWorkspaceCustomUnitAndRateParams,
     UpdateWorkspaceDescriptionParams,
     UpdateWorkspaceGeneralSettingsParams,
-    SetWorkspaceAutoReportingParams,
-    SetWorkspaceApprovalModeParams,
 } from '@libs/API/parameters';
 import {READ_COMMANDS, WRITE_COMMANDS} from '@libs/API/types';
 import DateUtils from '@libs/DateUtils';
@@ -396,8 +396,8 @@ function setWorkspaceAutoReporting(policyID: string, isEnabled: boolean) {
     API.write(WRITE_COMMANDS.SET_WORKSPACE_AUTO_REPORTING, params, {optimisticData});
 }
 
-function setWorkspaceApprovalMode(policyID: string, approver: string, approvalMode: "BASIC" | "OPTIONAL") {
-    const isAutoApprovalEnabled = approvalMode === "BASIC";
+function setWorkspaceApprovalMode(policyID: string, approver: string, approvalMode: 'BASIC' | 'OPTIONAL') {
+    const isAutoApprovalEnabled = approvalMode === 'BASIC';
 
     const value = JSON.stringify({
         approver,
@@ -416,7 +416,6 @@ function setWorkspaceApprovalMode(policyID: string, approver: string, approvalMo
     API.write(WRITE_COMMANDS.SET_WORKSPACE_APPROVAL_MODE, params, {optimisticData});
 }
 
-
 /**
  * Build optimistic data for removing users from the announcement room
  */
diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index f2b83703a999..3d1287c46920 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -147,11 +147,12 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
             brickRoadIndicator: !isEmptyObject(reimbursementAccount?.errors) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
         },
     ];
-    const protectedCollectPolicyMenuItems: WorkspaceMenuItem[] = [{
-        translationKey: 'workspace.common.workflows',
-        icon: Expensicons.Workflows,
-        action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID)))),
-        routeName: SCREENS.WORKSPACE.WORKFLOWS,
+    const protectedCollectPolicyMenuItems: WorkspaceMenuItem[] = [
+        {
+            translationKey: 'workspace.common.workflows',
+            icon: Expensicons.Workflows,
+            action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID)))),
+            routeName: SCREENS.WORKSPACE.WORKFLOWS,
         },
     ];
 
diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index c5e31da48e29..de538cfda519 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -1,10 +1,10 @@
-import Switch from "@components/Switch";
-import Text from "@components/Text";
-import getIsSmallScreenWidth from "@libs/getIsSmallScreenWidth";
-import React, { useState } from "react";
-import { View } from "react-native";
-import type { SvgProps } from "react-native-svg";
-import useThemeStyles from "@hooks/useThemeStyles";
+import React, {useState} from 'react';
+import {View} from 'react-native';
+import type {SvgProps} from 'react-native-svg';
+import Switch from '@components/Switch';
+import Text from '@components/Text';
+import useThemeStyles from '@hooks/useThemeStyles';
+import getIsSmallScreenWidth from '@libs/getIsSmallScreenWidth';
 
 type OptionType = {
     Illustration: React.ElementType<SvgProps>;
@@ -15,34 +15,36 @@ type OptionType = {
     isEndOptionRow?: boolean;
 };
 
-function ToggleSettingOptionRow({ Illustration, title, subtitle, onToggle, subMenuItems, isEndOptionRow }: OptionType) {
+function ToggleSettingOptionRow({Illustration, title, subtitle, onToggle, subMenuItems, isEndOptionRow}: OptionType) {
     const [isEnabled, setIsEnabled] = useState(false);
     const styles = useThemeStyles();
-  
+
     const toggleSwitch = () => {
-      setIsEnabled(previousState => !previousState);
-      onToggle(!isEnabled);
+        setIsEnabled((previousState) => !previousState);
+        onToggle(!isEnabled);
     };
     const isSmallScreenWidth = getIsSmallScreenWidth();
 
     return (
-        <View style={styles.pRelative}>   
-            <View style={styles.workspaceWorkflowContainer}>        
+        <View style={styles.pRelative}>
+            <View style={styles.workspaceWorkflowContainer}>
                 <View style={styles.workspaceWorkflowContent}>
-                        <Illustration style={styles.workspaceWorkflowsIcon} />
-                        <View style={styles.workspaceWorkflowsTimelineOverride}/>
-                        {!isEndOptionRow && (
-                            <View style={{
-                                                position: 'absolute',
-                                                width: 6,
-                                                backgroundImage: 'radial-gradient(circle at 2.5px, #1A3D32 1.25px, rgba(255, 255, 255, 0) 2.5px)',
-                                                backgroundSize: '5px 15px',
-                                                backgroundRepeat: 'repeat-y',                                        
-                                                top: isSmallScreenWidth ? '32%' : '12%',
-                                                bottom: isEnabled ? '-180%' : '-100%',
-                                                left: isSmallScreenWidth ? '6%' : '2.45%',
-                                            }} />
-                        )}
+                    <Illustration style={styles.workspaceWorkflowsIcon} />
+                    <View style={styles.workspaceWorkflowsTimelineOverride} />
+                    {!isEndOptionRow && (
+                        <View
+                            style={{
+                                position: 'absolute',
+                                width: 6,
+                                backgroundImage: 'radial-gradient(circle at 2.5px, #1A3D32 1.25px, rgba(255, 255, 255, 0) 2.5px)',
+                                backgroundSize: '5px 15px',
+                                backgroundRepeat: 'repeat-y',
+                                top: isSmallScreenWidth ? '32%' : '12%',
+                                bottom: isEnabled ? '-180%' : '-100%',
+                                left: isSmallScreenWidth ? '6%' : '2.45%',
+                            }}
+                        />
+                    )}
                     <View style={styles.workspaceWorkflowsWrapperText}>
                         <Text style={styles.workspaceWorkflowsHeading}>{title}</Text>
                         <Text style={styles.workspaceWorkflowsSubtitle}>{subtitle}</Text>
@@ -56,14 +58,10 @@ function ToggleSettingOptionRow({ Illustration, title, subtitle, onToggle, subMe
                     />
                 </View>
             </View>
-            {isEnabled && (
-                <View>
-                    {subMenuItems}
-                </View>
-            )}   
+            {isEnabled && <View>{subMenuItems}</View>}
         </View>
     );
-};
+}
 
 export type {OptionType};
-export default ToggleSettingOptionRow;
\ No newline at end of file
+export default ToggleSettingOptionRow;
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 42c3e923846e..43daced72467 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -1,22 +1,22 @@
 import type {StackScreenProps} from '@react-navigation/stack';
 import React from 'react';
 import {FlatList, View} from 'react-native';
+import * as Illustrations from '@components/Icon/Illustrations';
+import MenuItem from '@components/MenuItem';
+import Section from '@components/Section';
+import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import type {CentralPaneNavigatorParamList} from '@navigation/types';
+import withPolicy from '@pages/workspace/withPolicy';
+import type {WithPolicyProps} from '@pages/workspace/withPolicy';
 import WorkspacePageWithSections from '@pages/workspace/WorkspacePageWithSections';
+import * as Policy from '@userActions/Policy';
 import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
-import Text from '@components/Text';
-import Section from '@components/Section';
-import * as Illustrations from '@components/Icon/Illustrations';
-import * as Policy from '@userActions/Policy';
-import MenuItem from '@components/MenuItem';
-import withPolicy from '@pages/workspace/withPolicy';
-import type { WithPolicyProps } from '@pages/workspace/withPolicy';
 import ToggleSettingOptionRow from './ToggleSettingsOptionRow';
-import type { OptionType } from './ToggleSettingsOptionRow';
+import type {OptionType} from './ToggleSettingsOptionRow';
 
 type WorkspaceWorkflowsPageProps = WithPolicyProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
 
@@ -34,15 +34,15 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 Policy.setWorkspaceAutoReporting(route.params.policyID, isEnabled);
             },
             subMenuItems: (
-             <MenuItem
-                title={translate('workflowsPage.submissionFrequency')}
-                titleStyle={styles.workspaceWorkflowsSubMenuTitle}
-                descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
-                description={translate('workflowsPage.weeklyFrequency')}
-                shouldShowRightIcon
-                wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
-                hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
-              />
+                <MenuItem
+                    title={translate('workflowsPage.submissionFrequency')}
+                    titleStyle={styles.workspaceWorkflowsSubMenuTitle}
+                    descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
+                    description={translate('workflowsPage.weeklyFrequency')}
+                    shouldShowRightIcon
+                    wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
+                    hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
+                />
             ),
         },
         {
@@ -53,45 +53,45 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 Policy.setWorkspaceApprovalMode(route.params.policyID, policy?.owner ?? '', isEnabled ? 'BASIC' : 'OPTIONAL');
             },
             subMenuItems: (
-              <MenuItem
-                title={translate('workflowsPage.approver')}
-                titleStyle={styles.workspaceWorkflowsSubMenuTitle}
-                descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
-                description={policy?.owner ?? ''}
-                // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
-                shouldShowRightIcon
-                wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
-                hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
-              />
+                <MenuItem
+                    title={translate('workflowsPage.approver')}
+                    titleStyle={styles.workspaceWorkflowsSubMenuTitle}
+                    descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
+                    description={policy?.owner ?? ''}
+                    // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
+                    shouldShowRightIcon
+                    wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
+                    hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
+                />
             ),
-          },
-          {
+        },
+        {
             Illustration: Illustrations.WalletAlt,
             title: translate('workflowsPage.makeOrTrackPaymentsTitle'),
             subtitle: translate('workflowsPage.makeOrTrackPaymentsDescription'),
             onToggle: () => {
-              // TODO call API routes && set onyx optimistic data
+                // TODO call API routes && set onyx optimistic data
             },
             subMenuItems: (
                 <MenuItem
-                descriptionTextStyle={[styles.workspaceWorkflowsSubMenuDescription, styles.textSupporting]}
-                description={translate('workflowsPage.connectBankAccount')}
-                // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
-                shouldShowRightIcon
-                wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
-                hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
-              />
+                    descriptionTextStyle={[styles.workspaceWorkflowsSubMenuDescription, styles.textSupporting]}
+                    description={translate('workflowsPage.connectBankAccount')}
+                    // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
+                    shouldShowRightIcon
+                    wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
+                    hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
+                />
             ),
             isEndOptionRow: true,
-          },
+        },
     ];
 
-    const renderItem = ({ item }: { item: OptionType }) => (
+    const renderItem = ({item}: {item: OptionType}) => (
         <View style={styles.mt7}>
-             <ToggleSettingOptionRow
+            <ToggleSettingOptionRow
                 Illustration={item.Illustration}
                 title={item.title}
-                subtitle={item.subtitle}                    
+                subtitle={item.subtitle}
                 onToggle={item.onToggle}
                 subMenuItems={item.subMenuItems}
                 isEndOptionRow={item.isEndOptionRow}
@@ -110,14 +110,18 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
         >
             {() => (
                 <View style={[styles.mt3, styles.textStrong, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
-                    <Section title={translate('workflowsPage.workflowTitle')} titleStyles={styles.textStrong} containerStyles={isSmallScreenWidth ? styles.p5: styles.p8}>
+                    <Section
+                        title={translate('workflowsPage.workflowTitle')}
+                        titleStyles={styles.textStrong}
+                        containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
+                    >
                         <View>
                             <Text style={[styles.mt3, styles.textSupporting]}>{translate('workflowsPage.workflowDescription')}</Text>
                             <FlatList
                                 data={items}
                                 renderItem={renderItem}
                                 keyExtractor={(item: OptionType) => item.title}
-                            />          
+                            />
                         </View>
                     </Section>
                 </View>
diff --git a/src/styles/index.ts b/src/styles/index.ts
index ab73f8a81858..36dff530494f 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4581,7 +4581,7 @@ const styles = (theme: ThemeColors) =>
             paddingBottom: 15,
         },
         workspaceWorkflowContent: {
-            flexDirection: 'row', 
+            flexDirection: 'row',
             alignItems: 'center',
             flex: 1,
         },
@@ -4607,7 +4607,7 @@ const styles = (theme: ThemeColors) =>
             ...spacing.ph8,
             ...spacing.mhn8,
             width: 'auto',
-            marginLeft: 29
+            marginLeft: 29,
         },
         workspaceWorkflowsSubMenuTitle: {
             color: theme.textSupporting,
@@ -4618,15 +4618,15 @@ const styles = (theme: ThemeColors) =>
         workspaceWorkflowsSubMenuDescription: {
             color: theme.text,
             fontSize: 15,
-            lineHeight: 20
+            lineHeight: 20,
         },
         workspaceWorkflowsTimelineOverride: {
-            backgroundColor: theme.cardBG, 
-            zIndex: 1, 
-            height: 19, 
-            width: 19, 
-            position: 'absolute', 
-            left:0,
+            backgroundColor: theme.cardBG,
+            zIndex: 1,
+            height: 19,
+            width: 19,
+            position: 'absolute',
+            left: 0,
         },
         workspaceWorkflowsSubItemHover: {
             borderRadius: 8,

From ddc71355247ff3d63b90145952a4b5404dcdefd2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 14:48:26 +0100
Subject: [PATCH 157/305] better naming for collect policy menu items

---
 src/pages/workspace/WorkspaceInitialPage.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index 3d1287c46920..aaaca8f74be8 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -147,7 +147,7 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
             brickRoadIndicator: !isEmptyObject(reimbursementAccount?.errors) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
         },
     ];
-    const protectedCollectPolicyMenuItems: WorkspaceMenuItem[] = [
+    const collectPolicyMenuItems: WorkspaceMenuItem[] = [
         {
             translationKey: 'workspace.common.workflows',
             icon: Expensicons.Workflows,
@@ -164,7 +164,7 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
             brickRoadIndicator: hasGeneralSettingsError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             routeName: SCREENS.WORKSPACE.PROFILE,
         },
-        ...(isCollectPolicy ? protectedCollectPolicyMenuItems : []),
+        ...(isCollectPolicy ? collectPolicyMenuItems : []),
         ...(shouldShowProtectedItems ? protectedMenuItems : []),
     ];
 

From f9b3e541c5695c4623f6388e05a7f3e720f03a45 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Fri, 16 Feb 2024 09:42:12 -0500
Subject: [PATCH 158/305] Remove unnecessary code and fix merchant parameter in
 MoneyRequestConfirmPage.js

---
 src/pages/iou/steps/MoneyRequestConfirmPage.js | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js
index 2c5990e26d15..1738ac78df47 100644
--- a/src/pages/iou/steps/MoneyRequestConfirmPage.js
+++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js
@@ -268,11 +268,10 @@ function MoneyRequestConfirmPage(props) {
                     props.iou.amount,
                     trimmedComment,
                     props.iou.currency,
-                    props.iou.merchant,
                     props.iou.category,
                     props.iou.tag,
                     reportID,
-                    false,
+                    props.iou.merchant,
                 );
                 return;
             }
@@ -286,9 +285,9 @@ function MoneyRequestConfirmPage(props) {
                     props.iou.amount,
                     trimmedComment,
                     props.iou.currency,
-                    props.iou.merchant,
                     props.iou.category,
                     props.iou.tag,
+                    props.iou.merchant,
                 );
                 return;
             }

From 4dd1d7df975efbceb94fb8c154b5e1a9cc907fc7 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Fri, 16 Feb 2024 09:48:45 -0500
Subject: [PATCH 159/305] Remove unused variables in
 IOURequestStepConfirmation.js

---
 src/pages/iou/request/step/IOURequestStepConfirmation.js | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/src/pages/iou/request/step/IOURequestStepConfirmation.js b/src/pages/iou/request/step/IOURequestStepConfirmation.js
index 547870a580e1..7d4d7f04bb7e 100644
--- a/src/pages/iou/request/step/IOURequestStepConfirmation.js
+++ b/src/pages/iou/request/step/IOURequestStepConfirmation.js
@@ -308,8 +308,6 @@ function IOURequestStepConfirmation({
                     transaction.category,
                     transaction.tag,
                     transaction.billable,
-                    policyTags,
-                    policyCategories,
                 );
                 return;
             }
@@ -362,8 +360,6 @@ function IOURequestStepConfirmation({
             createDistanceRequest,
             requestMoney,
             receiptFile,
-            policyTags,
-            policyCategories,
         ],
     );
 

From 25d2b776a5acd49afa63a6adbc735351f7e3dfc2 Mon Sep 17 00:00:00 2001
From: Daniel Edwards <cdaniel.edwards@gmail.com>
Date: Fri, 16 Feb 2024 09:51:09 -0500
Subject: [PATCH 160/305] Refactor IOURequestStepConfirmation function
 parameters

---
 .../iou/request/step/IOURequestStepConfirmation.js   | 12 +-----------
 1 file changed, 1 insertion(+), 11 deletions(-)

diff --git a/src/pages/iou/request/step/IOURequestStepConfirmation.js b/src/pages/iou/request/step/IOURequestStepConfirmation.js
index 7d4d7f04bb7e..00055d6048f8 100644
--- a/src/pages/iou/request/step/IOURequestStepConfirmation.js
+++ b/src/pages/iou/request/step/IOURequestStepConfirmation.js
@@ -350,17 +350,7 @@ function IOURequestStepConfirmation({
 
             requestMoney(selectedParticipants, trimmedComment);
         },
-        [
-            iouType,
-            transaction,
-            currentUserPersonalDetails.login,
-            currentUserPersonalDetails.accountID,
-            report,
-            requestType,
-            createDistanceRequest,
-            requestMoney,
-            receiptFile,
-        ],
+        [iouType, transaction, currentUserPersonalDetails.login, currentUserPersonalDetails.accountID, report, requestType, createDistanceRequest, requestMoney, receiptFile],
     );
 
     /**

From 1b6b0e7da0cbbcf6b10b5381e927a1bb9a2ca864 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 16 Feb 2024 16:47:57 +0100
Subject: [PATCH 161/305] fix padding and positioning

---
 src/styles/index.ts | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/styles/index.ts b/src/styles/index.ts
index 36dff530494f..f1dcd73d873a 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4587,7 +4587,7 @@ const styles = (theme: ThemeColors) =>
         },
         workspaceWorkflowContainer: {
             flexDirection: 'row',
-            alignItems: 'flex-start',
+            alignItems: 'center',
             justifyContent: 'space-between',
         },
         workspaceWorkflowsHeading: {
@@ -4607,7 +4607,11 @@ const styles = (theme: ThemeColors) =>
             ...spacing.ph8,
             ...spacing.mhn8,
             width: 'auto',
-            marginLeft: 29,
+            marginLeft: 44,
+            paddingVertical: 12,
+            paddingRight: 9,
+            paddingLeft: 16,
+            marginRight: 0,
         },
         workspaceWorkflowsSubMenuTitle: {
             color: theme.textSupporting,
@@ -4631,7 +4635,6 @@ const styles = (theme: ThemeColors) =>
         workspaceWorkflowsSubItemHover: {
             borderRadius: 8,
             marginRight: 0,
-            transition: 'all 0.3s ease-in-out',
         },
         workspaceTitleStyle: {
             fontFamily: FontUtils.fontFamily.platform.EXP_NEUE_BOLD,

From 127facc6a10ac87f0f67d8a9808733079464251e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 10:26:31 +0100
Subject: [PATCH 162/305] use windowDimensions() and remove inline style

---
 .../workflows/ToggleSettingsOptionRow.tsx     | 33 +++++++++----------
 1 file changed, 16 insertions(+), 17 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index de538cfda519..f1ca9dad2fc3 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -1,10 +1,10 @@
 import React, {useState} from 'react';
-import {View} from 'react-native';
+import {View, ViewStyle} from 'react-native';
 import type {SvgProps} from 'react-native-svg';
 import Switch from '@components/Switch';
 import Text from '@components/Text';
 import useThemeStyles from '@hooks/useThemeStyles';
-import getIsSmallScreenWidth from '@libs/getIsSmallScreenWidth';
+import useWindowDimensions from '@hooks/useWindowDimensions';
 
 type OptionType = {
     Illustration: React.ElementType<SvgProps>;
@@ -23,7 +23,19 @@ function ToggleSettingOptionRow({Illustration, title, subtitle, onToggle, subMen
         setIsEnabled((previousState) => !previousState);
         onToggle(!isEnabled);
     };
-    const isSmallScreenWidth = getIsSmallScreenWidth();
+    const { isSmallScreenWidth } = useWindowDimensions();
+
+    // Define dot style for menu items based on screen width
+    const getDynamicDotStyle = (isEnabled: boolean) => ({
+        position: 'absolute',
+        width: 6,
+        backgroundImage: 'radial-gradient(circle at 2.5px, #1A3D32 1.25px, rgba(255, 255, 255, 0) 2.5px)',
+        backgroundSize: '5px 15px',
+        backgroundRepeat: 'repeat-y',
+        top: isSmallScreenWidth ? '32%' : '12%',
+        bottom: isEnabled ? '-180%' : '-100%',
+        left: isSmallScreenWidth ? '6%' : '2.45%',
+    } as ViewStyle);
 
     return (
         <View style={styles.pRelative}>
@@ -31,20 +43,7 @@ function ToggleSettingOptionRow({Illustration, title, subtitle, onToggle, subMen
                 <View style={styles.workspaceWorkflowContent}>
                     <Illustration style={styles.workspaceWorkflowsIcon} />
                     <View style={styles.workspaceWorkflowsTimelineOverride} />
-                    {!isEndOptionRow && (
-                        <View
-                            style={{
-                                position: 'absolute',
-                                width: 6,
-                                backgroundImage: 'radial-gradient(circle at 2.5px, #1A3D32 1.25px, rgba(255, 255, 255, 0) 2.5px)',
-                                backgroundSize: '5px 15px',
-                                backgroundRepeat: 'repeat-y',
-                                top: isSmallScreenWidth ? '32%' : '12%',
-                                bottom: isEnabled ? '-180%' : '-100%',
-                                left: isSmallScreenWidth ? '6%' : '2.45%',
-                            }}
-                        />
-                    )}
+                    {!isEndOptionRow && <View style={getDynamicDotStyle(isEnabled)} />}
                     <View style={styles.workspaceWorkflowsWrapperText}>
                         <Text style={styles.workspaceWorkflowsHeading}>{title}</Text>
                         <Text style={styles.workspaceWorkflowsSubtitle}>{subtitle}</Text>

From 612548ea1c4cb6434b3d30cb57ee1a7dbe8d7131 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 10:50:09 +0100
Subject: [PATCH 163/305] add a new property to keep track of previous toggle
 state

---
 .../workspace/workflows/ToggleSettingsOptionRow.tsx   | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index f1ca9dad2fc3..d2e120d9ac09 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -1,4 +1,4 @@
-import React, {useState} from 'react';
+import React, {useEffect, useState} from 'react';
 import {View, ViewStyle} from 'react-native';
 import type {SvgProps} from 'react-native-svg';
 import Switch from '@components/Switch';
@@ -10,12 +10,13 @@ type OptionType = {
     Illustration: React.ElementType<SvgProps>;
     title: string;
     subtitle: string;
+    hasBeenToggled: boolean;
     onToggle: (isEnabled: boolean) => void;
     subMenuItems?: React.ReactNode;
     isEndOptionRow?: boolean;
 };
 
-function ToggleSettingOptionRow({Illustration, title, subtitle, onToggle, subMenuItems, isEndOptionRow}: OptionType) {
+function ToggleSettingOptionRow({Illustration, title, subtitle, onToggle, subMenuItems, isEndOptionRow, hasBeenToggled}: OptionType) {
     const [isEnabled, setIsEnabled] = useState(false);
     const styles = useThemeStyles();
 
@@ -37,6 +38,10 @@ function ToggleSettingOptionRow({Illustration, title, subtitle, onToggle, subMen
         left: isSmallScreenWidth ? '6%' : '2.45%',
     } as ViewStyle);
 
+    useEffect(() => {
+        setIsEnabled(hasBeenToggled);
+    }, []);
+
     return (
         <View style={styles.pRelative}>
             <View style={styles.workspaceWorkflowContainer}>
@@ -57,7 +62,7 @@ function ToggleSettingOptionRow({Illustration, title, subtitle, onToggle, subMen
                     />
                 </View>
             </View>
-            {isEnabled && <View>{subMenuItems}</View>}
+            {isEnabled && subMenuItems}
         </View>
     );
 }

From 2cdcba8e0d94792c2a23955005d68977999cf147 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 10:50:33 +0100
Subject: [PATCH 164/305] handle toggle states on refresh

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 43daced72467..08d16b750e63 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -44,6 +44,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
                 />
             ),
+            hasBeenToggled: policy?.harvesting?.enabled ?? false
         },
         {
             Illustration: Illustrations.Approval,
@@ -64,6 +65,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
                 />
             ),
+            hasBeenToggled: policy?.isAutoApprovalEnabled ?? false,
         },
         {
             Illustration: Illustrations.WalletAlt,
@@ -83,6 +85,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 />
             ),
             isEndOptionRow: true,
+            hasBeenToggled: false, // TODO make it dynamic when VBBA action is implemented
         },
     ];
 
@@ -95,6 +98,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 onToggle={item.onToggle}
                 subMenuItems={item.subMenuItems}
                 isEndOptionRow={item.isEndOptionRow}
+                hasBeenToggled={item.hasBeenToggled}
             />
         </View>
     );

From 350dab48e3da5ab9bd97d99f41fcf3bc0b6392e2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 11:22:23 +0100
Subject: [PATCH 165/305] use icon component

---
 .../workflows/ToggleSettingsOptionRow.tsx        | 16 +++++++++-------
 .../workflows/WorkspaceWorkflowsPage.tsx         |  8 ++++----
 src/styles/index.ts                              |  2 --
 3 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index d2e120d9ac09..d90bab4a7143 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -1,13 +1,15 @@
 import React, {useEffect, useState} from 'react';
-import {View, ViewStyle} from 'react-native';
+import {View} from 'react-native';
+import type {ViewStyle} from 'react-native';
 import type {SvgProps} from 'react-native-svg';
 import Switch from '@components/Switch';
 import Text from '@components/Text';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
+import Icon from '@components/Icon';
 
 type OptionType = {
-    Illustration: React.ElementType<SvgProps>;
+    icon: React.FC<SvgProps>;
     title: string;
     subtitle: string;
     hasBeenToggled: boolean;
@@ -16,7 +18,7 @@ type OptionType = {
     isEndOptionRow?: boolean;
 };
 
-function ToggleSettingOptionRow({Illustration, title, subtitle, onToggle, subMenuItems, isEndOptionRow, hasBeenToggled}: OptionType) {
+function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, isEndOptionRow, hasBeenToggled}: OptionType) {
     const [isEnabled, setIsEnabled] = useState(false);
     const styles = useThemeStyles();
 
@@ -27,26 +29,26 @@ function ToggleSettingOptionRow({Illustration, title, subtitle, onToggle, subMen
     const { isSmallScreenWidth } = useWindowDimensions();
 
     // Define dot style for menu items based on screen width
-    const getDynamicDotStyle = (isEnabled: boolean) => ({
+    const getDynamicDotStyle = (enabled: boolean) => ({
         position: 'absolute',
         width: 6,
         backgroundImage: 'radial-gradient(circle at 2.5px, #1A3D32 1.25px, rgba(255, 255, 255, 0) 2.5px)',
         backgroundSize: '5px 15px',
         backgroundRepeat: 'repeat-y',
         top: isSmallScreenWidth ? '32%' : '12%',
-        bottom: isEnabled ? '-180%' : '-100%',
+        bottom: enabled ? '-180%' : '-100%',
         left: isSmallScreenWidth ? '6%' : '2.45%',
     } as ViewStyle);
 
     useEffect(() => {
         setIsEnabled(hasBeenToggled);
-    }, []);
+    }, [hasBeenToggled]);
 
     return (
         <View style={styles.pRelative}>
             <View style={styles.workspaceWorkflowContainer}>
                 <View style={styles.workspaceWorkflowContent}>
-                    <Illustration style={styles.workspaceWorkflowsIcon} />
+                    <Icon src={icon} height={48} width={48} additionalStyles={styles.workspaceWorkflowsIcon} />
                     <View style={styles.workspaceWorkflowsTimelineOverride} />
                     {!isEndOptionRow && <View style={getDynamicDotStyle(isEnabled)} />}
                     <View style={styles.workspaceWorkflowsWrapperText}>
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 08d16b750e63..a891499f3b57 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -27,7 +27,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
 
     const items: OptionType[] = [
         {
-            Illustration: Illustrations.ReceiptEnvelope,
+            icon: Illustrations.ReceiptEnvelope,
             title: translate('workflowsPage.delaySubmissionTitle'),
             subtitle: translate('workflowsPage.delaySubmissionDescription'),
             onToggle: (isEnabled: boolean) => {
@@ -47,7 +47,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             hasBeenToggled: policy?.harvesting?.enabled ?? false
         },
         {
-            Illustration: Illustrations.Approval,
+            icon: Illustrations.Approval,
             title: translate('workflowsPage.addApprovalsTitle'),
             subtitle: translate('workflowsPage.addApprovalsDescription'),
             onToggle: (isEnabled: boolean) => {
@@ -68,7 +68,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             hasBeenToggled: policy?.isAutoApprovalEnabled ?? false,
         },
         {
-            Illustration: Illustrations.WalletAlt,
+            icon: Illustrations.WalletAlt,
             title: translate('workflowsPage.makeOrTrackPaymentsTitle'),
             subtitle: translate('workflowsPage.makeOrTrackPaymentsDescription'),
             onToggle: () => {
@@ -92,7 +92,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const renderItem = ({item}: {item: OptionType}) => (
         <View style={styles.mt7}>
             <ToggleSettingOptionRow
-                Illustration={item.Illustration}
+                icon={item.icon}
                 title={item.title}
                 subtitle={item.subtitle}
                 onToggle={item.onToggle}
diff --git a/src/styles/index.ts b/src/styles/index.ts
index f1dcd73d873a..7f3e4da43f4c 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4574,8 +4574,6 @@ const styles = (theme: ThemeColors) =>
             width: variables.updateTextViewContainerWidth,
         },
         workspaceWorkflowsIcon: {
-            height: 48,
-            width: 48,
             marginRight: 12,
             zIndex: 2,
             paddingBottom: 15,

From de670a4e8e690098f62dda32c1829c71261a7de8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 11:33:51 +0100
Subject: [PATCH 166/305] remove unneeded style

---
 src/styles/index.ts | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/src/styles/index.ts b/src/styles/index.ts
index 7f3e4da43f4c..ab51c657cbfc 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4630,10 +4630,6 @@ const styles = (theme: ThemeColors) =>
             position: 'absolute',
             left: 0,
         },
-        workspaceWorkflowsSubItemHover: {
-            borderRadius: 8,
-            marginRight: 0,
-        },
         workspaceTitleStyle: {
             fontFamily: FontUtils.fontFamily.platform.EXP_NEUE_BOLD,
             fontWeight: '500',

From e51a3ea8fd714e21793f3e33a2ec34b4dcf3e8db Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 11:34:07 +0100
Subject: [PATCH 167/305] use existing classes for styling

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index a891499f3b57..a3c0986526c4 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -41,7 +41,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     description={translate('workflowsPage.weeklyFrequency')}
                     shouldShowRightIcon
                     wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
-                    hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
+                    hoverAndPressStyle={[styles.mr0, styles.br2]}
                 />
             ),
             hasBeenToggled: policy?.harvesting?.enabled ?? false
@@ -62,7 +62,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
                     shouldShowRightIcon
                     wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
-                    hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
+                    hoverAndPressStyle={[styles.mr0, styles.br2]}
                 />
             ),
             hasBeenToggled: policy?.isAutoApprovalEnabled ?? false,
@@ -81,7 +81,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
                     shouldShowRightIcon
                     wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
-                    hoverAndPressStyle={styles.workspaceWorkflowsSubItemHover}
+                    hoverAndPressStyle={[styles.mr0, styles.br2]}
                 />
             ),
             isEndOptionRow: true,

From 6e6190f52d1a75c828be267d6614fc8b54c6bf0b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 11:40:20 +0100
Subject: [PATCH 168/305] fix style

---
 .../workflows/ToggleSettingsOptionRow.tsx     | 32 +++++++++++--------
 .../workflows/WorkspaceWorkflowsPage.tsx      |  2 +-
 2 files changed, 20 insertions(+), 14 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index d90bab4a7143..6084667d1f61 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -2,11 +2,11 @@ import React, {useEffect, useState} from 'react';
 import {View} from 'react-native';
 import type {ViewStyle} from 'react-native';
 import type {SvgProps} from 'react-native-svg';
+import Icon from '@components/Icon';
 import Switch from '@components/Switch';
 import Text from '@components/Text';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
-import Icon from '@components/Icon';
 
 type OptionType = {
     icon: React.FC<SvgProps>;
@@ -26,19 +26,20 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
         setIsEnabled((previousState) => !previousState);
         onToggle(!isEnabled);
     };
-    const { isSmallScreenWidth } = useWindowDimensions();
+    const {isSmallScreenWidth} = useWindowDimensions();
 
     // Define dot style for menu items based on screen width
-    const getDynamicDotStyle = (enabled: boolean) => ({
-        position: 'absolute',
-        width: 6,
-        backgroundImage: 'radial-gradient(circle at 2.5px, #1A3D32 1.25px, rgba(255, 255, 255, 0) 2.5px)',
-        backgroundSize: '5px 15px',
-        backgroundRepeat: 'repeat-y',
-        top: isSmallScreenWidth ? '32%' : '12%',
-        bottom: enabled ? '-180%' : '-100%',
-        left: isSmallScreenWidth ? '6%' : '2.45%',
-    } as ViewStyle);
+    const getDynamicDotStyle = (enabled: boolean) =>
+        ({
+            position: 'absolute',
+            width: 6,
+            backgroundImage: 'radial-gradient(circle at 2.5px, #1A3D32 1.25px, rgba(255, 255, 255, 0) 2.5px)',
+            backgroundSize: '5px 15px',
+            backgroundRepeat: 'repeat-y',
+            top: isSmallScreenWidth ? '32%' : '12%',
+            bottom: enabled ? '-180%' : '-100%',
+            left: isSmallScreenWidth ? '6%' : '2.45%',
+        } as ViewStyle);
 
     useEffect(() => {
         setIsEnabled(hasBeenToggled);
@@ -48,7 +49,12 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
         <View style={styles.pRelative}>
             <View style={styles.workspaceWorkflowContainer}>
                 <View style={styles.workspaceWorkflowContent}>
-                    <Icon src={icon} height={48} width={48} additionalStyles={styles.workspaceWorkflowsIcon} />
+                    <Icon
+                        src={icon}
+                        height={48}
+                        width={48}
+                        additionalStyles={styles.workspaceWorkflowsIcon}
+                    />
                     <View style={styles.workspaceWorkflowsTimelineOverride} />
                     {!isEndOptionRow && <View style={getDynamicDotStyle(isEnabled)} />}
                     <View style={styles.workspaceWorkflowsWrapperText}>
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index a3c0986526c4..b1b720519da2 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -44,7 +44,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     hoverAndPressStyle={[styles.mr0, styles.br2]}
                 />
             ),
-            hasBeenToggled: policy?.harvesting?.enabled ?? false
+            hasBeenToggled: policy?.harvesting?.enabled ?? false,
         },
         {
             icon: Illustrations.Approval,

From d37d2ad694d8b756166d780690eb78f8b5b474d8 Mon Sep 17 00:00:00 2001
From: Cong Pham <ptcong411@gmail.com>
Date: Thu, 15 Feb 2024 23:50:39 +0700
Subject: [PATCH 169/305] update SignInPage structure

---
 src/pages/signin/SignInModal.tsx |  2 +-
 src/pages/signin/SignInPage.tsx  | 13 ++++++++-----
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/pages/signin/SignInModal.tsx b/src/pages/signin/SignInModal.tsx
index b2ee9d218da9..b53092f5652a 100644
--- a/src/pages/signin/SignInModal.tsx
+++ b/src/pages/signin/SignInModal.tsx
@@ -26,7 +26,7 @@ function SignInModal() {
             testID={SignInModal.displayName}
         >
             <HeaderWithBackButton onBackButtonPress={() => Navigation.goBack()} />
-            <SignInPage />
+            <SignInPage shouldEnableMaxHeight={false} />
         </ScreenWrapper>
     );
 }
diff --git a/src/pages/signin/SignInPage.tsx b/src/pages/signin/SignInPage.tsx
index 3d761601a919..fb3c97c11044 100644
--- a/src/pages/signin/SignInPage.tsx
+++ b/src/pages/signin/SignInPage.tsx
@@ -1,10 +1,10 @@
 import Str from 'expensify-common/lib/str';
 import React, {useEffect, useRef, useState} from 'react';
-import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
 import ColorSchemeWrapper from '@components/ColorSchemeWrapper';
 import CustomStatusBarAndBackground from '@components/CustomStatusBarAndBackground';
+import ScreenWrapper from '@components/ScreenWrapper';
 import ThemeProvider from '@components/ThemeProvider';
 import ThemeStylesProvider from '@components/ThemeStylesProvider';
 import useLocalize from '@hooks/useLocalize';
@@ -48,7 +48,9 @@ type SignInPageInnerOnyxProps = {
     preferredLocale: OnyxEntry<Locale>;
 };
 
-type SignInPageInnerProps = SignInPageInnerOnyxProps;
+type SignInPageInnerProps = SignInPageInnerOnyxProps & {
+    shouldEnableMaxHeight: boolean;
+};
 
 type RenderOption = {
     shouldShowLoginForm: boolean;
@@ -124,7 +126,7 @@ function getRenderOptions({
     };
 }
 
-function SignInPageInner({credentials, account, activeClients = [], preferredLocale}: SignInPageInnerProps) {
+function SignInPageInner({ credentials, account, activeClients = [], preferredLocale, shouldEnableMaxHeight = true }: SignInPageInnerProps) {
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     const {translate, formatPhoneNumber} = useLocalize();
@@ -245,7 +247,8 @@ function SignInPageInner({credentials, account, activeClients = [], preferredLoc
     return (
         // Bottom SafeAreaView is removed so that login screen svg displays correctly on mobile.
         // The SVG should flow under the Home Indicator on iOS.
-        <View
+        <ScreenWrapper
+            shouldEnableMaxHeight={shouldEnableMaxHeight}
             style={[styles.signInPage, StyleUtils.getSafeAreaPadding({...safeAreaInsets, bottom: 0, top: shouldUseNarrowLayout ? 0 : safeAreaInsets.top}, 1)]}
             testID={SignInPageInner.displayName}
         >
@@ -281,7 +284,7 @@ function SignInPageInner({credentials, account, activeClients = [], preferredLoc
                     </>
                 )}
             </SignInPageLayout>
-        </View>
+        </ScreenWrapper>
     );
 }
 

From 890fcb0057533be8a203409fb7d8556d0e900969 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 16:12:37 +0100
Subject: [PATCH 170/305] add issues for todos

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index b1b720519da2..510a66dd2dd1 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -38,6 +38,8 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     title={translate('workflowsPage.submissionFrequency')}
                     titleStyle={styles.workspaceWorkflowsSubMenuTitle}
                     descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
+                    // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_AUTOREPORTING_FREQUENCY).getRoute(route.params.policyID))}
+                    // TODO will be done in https://github.com/Expensify/Expensify/issues/368332
                     description={translate('workflowsPage.weeklyFrequency')}
                     shouldShowRightIcon
                     wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
@@ -60,6 +62,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
                     description={policy?.owner ?? ''}
                     // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
+                    // TODO will be done in https://github.com/Expensify/Expensify/issues/368334
                     shouldShowRightIcon
                     wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
                     hoverAndPressStyle={[styles.mr0, styles.br2]}
@@ -72,13 +75,14 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             title: translate('workflowsPage.makeOrTrackPaymentsTitle'),
             subtitle: translate('workflowsPage.makeOrTrackPaymentsDescription'),
             onToggle: () => {
-                // TODO call API routes && set onyx optimistic data
+                // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
             },
             subMenuItems: (
                 <MenuItem
                     descriptionTextStyle={[styles.workspaceWorkflowsSubMenuDescription, styles.textSupporting]}
                     description={translate('workflowsPage.connectBankAccount')}
                     // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
+                    // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
                     shouldShowRightIcon
                     wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
                     hoverAndPressStyle={[styles.mr0, styles.br2]}

From 8602b32bc32a423bf38f163787e2272621d70963 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 16:15:50 +0100
Subject: [PATCH 171/305] use useMemo() for performance

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 510a66dd2dd1..7310f6ce65b6 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -1,5 +1,5 @@
 import type {StackScreenProps} from '@react-navigation/stack';
-import React from 'react';
+import { useMemo } from 'react';
 import {FlatList, View} from 'react-native';
 import * as Illustrations from '@components/Icon/Illustrations';
 import MenuItem from '@components/MenuItem';
@@ -25,7 +25,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const styles = useThemeStyles();
     const {isSmallScreenWidth} = useWindowDimensions();
 
-    const items: OptionType[] = [
+    const items: OptionType[] = useMemo(() => ([
         {
             icon: Illustrations.ReceiptEnvelope,
             title: translate('workflowsPage.delaySubmissionTitle'),
@@ -91,7 +91,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             isEndOptionRow: true,
             hasBeenToggled: false, // TODO make it dynamic when VBBA action is implemented
         },
-    ];
+    ]), [policy, route.params.policyID, styles, translate]);
 
     const renderItem = ({item}: {item: OptionType}) => (
         <View style={styles.mt7}>

From 64053f6d981d0a37fa5e02215cd70730597ffea6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 16:25:03 +0100
Subject: [PATCH 172/305] add helpers for policy types

---
 src/libs/PolicyUtils.ts | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/libs/PolicyUtils.ts b/src/libs/PolicyUtils.ts
index d93a761d1163..09ad08e9cb85 100644
--- a/src/libs/PolicyUtils.ts
+++ b/src/libs/PolicyUtils.ts
@@ -110,6 +110,10 @@ const isPolicyAdmin = (policy: OnyxEntry<Policy> | EmptyObject): boolean => poli
 
 const isCollectPolicy = (policy: OnyxEntry<Policy> | EmptyObject): boolean => policy?.type === CONST.POLICY.TYPE.TEAM;
 
+const isFreePolicy = (policy: OnyxEntry<Policy> | EmptyObject): boolean => policy?.type === CONST.POLICY.TYPE.FREE;
+
+const isControlPolicy = (policy: OnyxEntry<Policy> | EmptyObject): boolean => policy?.type === CONST.POLICY.TYPE.CORPORATE;
+
 const isPolicyMember = (policyID: string, policies: OnyxCollection<Policy>): boolean => Object.values(policies ?? {}).some((policy) => policy?.id === policyID);
 
 /**
@@ -261,6 +265,8 @@ export {
     isExpensifyGuideTeam,
     isInstantSubmitEnabled,
     isCollectPolicy,
+    isFreePolicy,
+    isControlPolicy,
     isPolicyAdmin,
     isSubmitAndClose,
     getMemberAccountIDsForWorkspace,

From b4e67d54dda5abb3b1532dbd2a2c5e211f4c2a59 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 16:25:38 +0100
Subject: [PATCH 173/305] change display logic for control/collect policies
 (more features menu item)

---
 src/pages/workspace/WorkspaceInitialPage.tsx | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index aaaca8f74be8..3b415c8a6fe0 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -98,6 +98,8 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
     const hasGeneralSettingsError = !isEmptyObject(policy?.errorFields?.generalSettings ?? {}) || !isEmptyObject(policy?.errorFields?.avatar ?? {});
     const shouldShowProtectedItems = PolicyUtils.isPolicyAdmin(policy);
     const isCollectPolicy = PolicyUtils.isCollectPolicy(policy);
+    const isControlPolicy = PolicyUtils.isControlPolicy(policy);
+    const isFreePolicy = PolicyUtils.isFreePolicy(policy);
 
     const protectedMenuItems: WorkspaceMenuItem[] = [
         {
@@ -147,7 +149,7 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
             brickRoadIndicator: !isEmptyObject(reimbursementAccount?.errors) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
         },
     ];
-    const collectPolicyMenuItems: WorkspaceMenuItem[] = [
+    const moreFeaturesMenuItems: WorkspaceMenuItem[] = [
         {
             translationKey: 'workspace.common.workflows',
             icon: Expensicons.Workflows,
@@ -164,8 +166,8 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
             brickRoadIndicator: hasGeneralSettingsError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             routeName: SCREENS.WORKSPACE.PROFILE,
         },
-        ...(isCollectPolicy ? collectPolicyMenuItems : []),
-        ...(shouldShowProtectedItems ? protectedMenuItems : []),
+        ...(shouldShowProtectedItems && isCollectPolicy || isControlPolicy ? moreFeaturesMenuItems : []),
+        ...(shouldShowProtectedItems && isFreePolicy ? protectedMenuItems : []),
     ];
 
     const prevPolicy = usePrevious(policy);

From 395faf23a561872620712a769a8fcae4722cdcfc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 16:31:47 +0100
Subject: [PATCH 174/305] fix import

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 7310f6ce65b6..2e87c8098ba0 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -1,5 +1,5 @@
 import type {StackScreenProps} from '@react-navigation/stack';
-import { useMemo } from 'react';
+import React, { useMemo } from 'react';
 import {FlatList, View} from 'react-native';
 import * as Illustrations from '@components/Icon/Illustrations';
 import MenuItem from '@components/MenuItem';

From 1fd4e707a904ebb25b504c7b358d475c11bde388 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 16:39:51 +0100
Subject: [PATCH 175/305] use styleUtils

---
 .../workflows/ToggleSettingsOptionRow.tsx      | 18 ++++--------------
 src/styles/utils/index.ts                      | 12 ++++++++++++
 2 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 6084667d1f61..cb06be97e2c1 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -1,6 +1,7 @@
 import React, {useEffect, useState} from 'react';
 import {View} from 'react-native';
 import type {ViewStyle} from 'react-native';
+import useStyleUtils from '@hooks/useStyleUtils';
 import type {SvgProps} from 'react-native-svg';
 import Icon from '@components/Icon';
 import Switch from '@components/Switch';
@@ -21,25 +22,14 @@ type OptionType = {
 function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, isEndOptionRow, hasBeenToggled}: OptionType) {
     const [isEnabled, setIsEnabled] = useState(false);
     const styles = useThemeStyles();
+    const StyleUtils = useStyleUtils();
 
     const toggleSwitch = () => {
-        setIsEnabled((previousState) => !previousState);
+        setIsEnabled(!isEnabled);
         onToggle(!isEnabled);
     };
     const {isSmallScreenWidth} = useWindowDimensions();
 
-    // Define dot style for menu items based on screen width
-    const getDynamicDotStyle = (enabled: boolean) =>
-        ({
-            position: 'absolute',
-            width: 6,
-            backgroundImage: 'radial-gradient(circle at 2.5px, #1A3D32 1.25px, rgba(255, 255, 255, 0) 2.5px)',
-            backgroundSize: '5px 15px',
-            backgroundRepeat: 'repeat-y',
-            top: isSmallScreenWidth ? '32%' : '12%',
-            bottom: enabled ? '-180%' : '-100%',
-            left: isSmallScreenWidth ? '6%' : '2.45%',
-        } as ViewStyle);
 
     useEffect(() => {
         setIsEnabled(hasBeenToggled);
@@ -56,7 +46,7 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
                         additionalStyles={styles.workspaceWorkflowsIcon}
                     />
                     <View style={styles.workspaceWorkflowsTimelineOverride} />
-                    {!isEndOptionRow && <View style={getDynamicDotStyle(isEnabled)} />}
+                    {!isEndOptionRow && <View style={StyleUtils.getWorkspaceWorkflowsDotStyle(isEnabled, isSmallScreenWidth) as ViewStyle} />}
                     <View style={styles.workspaceWorkflowsWrapperText}>
                         <Text style={styles.workspaceWorkflowsHeading}>{title}</Text>
                         <Text style={styles.workspaceWorkflowsSubtitle}>{subtitle}</Text>
diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index a0edb7fd4e23..fc64556199de 100644
--- a/src/styles/utils/index.ts
+++ b/src/styles/utils/index.ts
@@ -1474,6 +1474,18 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
     },
 
     getFullscreenCenteredContentStyles: () => [StyleSheet.absoluteFill, styles.justifyContentCenter, styles.alignItemsCenter],
+    
+    getWorkspaceWorkflowsDotStyle: (enabled: boolean, isSmallScreenWidth: boolean) =>
+    ({
+        position: 'absolute',
+        width: 6,
+        backgroundImage: 'radial-gradient(circle at 2.5px, #1A3D32 1.25px, rgba(255, 255, 255, 0) 2.5px)',
+        backgroundSize: '5px 15px',
+        backgroundRepeat: 'repeat-y',
+        top: isSmallScreenWidth ? '32%' : '12%',
+        bottom: enabled ? '-180%' : '-100%',
+        left: isSmallScreenWidth ? '6%' : '2.45%',
+    }),
 });
 
 type StyleUtilsType = ReturnType<typeof createStyleUtils>;

From 6e66ace77035c3f299cfceb895154574001bbedb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 16:40:18 +0100
Subject: [PATCH 176/305] fix spanish translations

---
 src/languages/es.ts | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/languages/es.ts b/src/languages/es.ts
index cdbecda8bf34..c0fc0e8fcc18 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -1014,22 +1014,22 @@ export default {
     },
     workflowsPage: {
         workflowTitle: 'Gasto',
-        workflowDescription: 'Configure un flujo de trabajo desde el momento en que se produce el gasto, incluida la aprobación y el pago.',
-        delaySubmissionTitle: 'Retrasar las presentaciones',
+        workflowDescription: 'Configure un flujo de trabajo desde el momento en que se produce el gasto, incluida la aprobación y el pago',
+        delaySubmissionTitle: 'Retrasar envíos',
         delaySubmissionDescription: 'Los gastos se comparten de inmediato para una mejor visibilidad del gasto. Establece una cadencia más lenta si es necesario.',
-        addApprovalsTitle: 'Añadir aprobacións',
-        approver: 'Aprobador',
-        submissionFrequency: 'Frecuencia de envío',
+        submissionFrequency: 'Frecuencia de envíos',
         weeklyFrequency: 'Semanal',
         monthlyFrequency: 'Mensual',
         twiceAMonthFrequency: 'Dos veces al mes',
         byTripFrequency: 'Por viaje',
-        manuallyFrequency: 'Manualmente',
-        dailyFrequency: 'Diario',
+        manuallyFrequency: 'Manual',
+        dailyFrequency: 'Diaria',
+        addApprovalsTitle: 'Requerir aprobaciones',
+        approver: 'Aprobador',
         connectBankAccount: 'Conectar cuenta bancaria',
         addApprovalsDescription: 'Requiere una aprobación adicional antes de autorizar un pago.',
         makeOrTrackPaymentsTitle: 'Realizar o seguir pagos',
-        makeOrTrackPaymentsDescription: 'Añada un pagador autorizado para los pagos realizados en Expensify, o simplemente realice un seguimiento de los pagos realizados en otro lugar.',
+        makeOrTrackPaymentsDescription: 'Añade un pagador autorizado para los pagos realizados en Expensify, o simplemente realiza un seguimiento de los pagos realizados en otro lugar.,
     },
     reportFraudPage: {
         title: 'Reportar fraude con la tarjeta virtual',

From 9e60d5001f07053bbaa7db03f8fd62075828f374 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 16:46:36 +0100
Subject: [PATCH 177/305] fix typo

---
 src/languages/es.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/languages/es.ts b/src/languages/es.ts
index c0fc0e8fcc18..4758717189f8 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -1029,7 +1029,7 @@ export default {
         connectBankAccount: 'Conectar cuenta bancaria',
         addApprovalsDescription: 'Requiere una aprobación adicional antes de autorizar un pago.',
         makeOrTrackPaymentsTitle: 'Realizar o seguir pagos',
-        makeOrTrackPaymentsDescription: 'Añade un pagador autorizado para los pagos realizados en Expensify, o simplemente realiza un seguimiento de los pagos realizados en otro lugar.,
+        makeOrTrackPaymentsDescription: 'Añade un pagador autorizado para los pagos realizados en Expensify, o simplemente realiza un seguimiento de los pagos realizados en otro lugar.',
     },
     reportFraudPage: {
         title: 'Reportar fraude con la tarjeta virtual',

From 4deab03dc9d18d75632e7e7a1d38e54812f2951a Mon Sep 17 00:00:00 2001
From: Cong Pham <ptcong411@gmail.com>
Date: Mon, 19 Feb 2024 23:02:44 +0700
Subject: [PATCH 178/305] fix sign page typecheck

---
 src/pages/signin/SignInPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/signin/SignInPage.tsx b/src/pages/signin/SignInPage.tsx
index fb3c97c11044..981e26129e1c 100644
--- a/src/pages/signin/SignInPage.tsx
+++ b/src/pages/signin/SignInPage.tsx
@@ -49,7 +49,7 @@ type SignInPageInnerOnyxProps = {
 };
 
 type SignInPageInnerProps = SignInPageInnerOnyxProps & {
-    shouldEnableMaxHeight: boolean;
+    shouldEnableMaxHeight?: boolean;
 };
 
 type RenderOption = {

From a4fab45cc9ce487a7dc5591184cbc38fb8de8363 Mon Sep 17 00:00:00 2001
From: Cong Pham <ptcong411@gmail.com>
Date: Mon, 19 Feb 2024 23:09:29 +0700
Subject: [PATCH 179/305] fix prettier

---
 src/pages/signin/SignInPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/signin/SignInPage.tsx b/src/pages/signin/SignInPage.tsx
index 981e26129e1c..a8026d99be51 100644
--- a/src/pages/signin/SignInPage.tsx
+++ b/src/pages/signin/SignInPage.tsx
@@ -126,7 +126,7 @@ function getRenderOptions({
     };
 }
 
-function SignInPageInner({ credentials, account, activeClients = [], preferredLocale, shouldEnableMaxHeight = true }: SignInPageInnerProps) {
+function SignInPageInner({credentials, account, activeClients = [], preferredLocale, shouldEnableMaxHeight = true}: SignInPageInnerProps) {
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     const {translate, formatPhoneNumber} = useLocalize();

From 3051a27e49fde74ed7e3d7ab7bff82230ad5d844 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 17:35:16 +0100
Subject: [PATCH 180/305] create workflows style utils

---
 src/styles/utils/index.ts | 77 ++++++++++++++++++++++++++++++++++++++-
 1 file changed, 76 insertions(+), 1 deletion(-)

diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index fc64556199de..3dc5927b7f6f 100644
--- a/src/styles/utils/index.ts
+++ b/src/styles/utils/index.ts
@@ -25,6 +25,7 @@ import getNavigationModalCardStyle from './getNavigationModalCardStyles';
 import getSignInBgStyles from './getSignInBgStyles';
 import {compactContentContainerStyles} from './optionRowStyles';
 import positioning from './positioning';
+import spacing from './spacing';
 import type {
     AllStyles,
     AvatarSize,
@@ -1474,7 +1475,7 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
     },
 
     getFullscreenCenteredContentStyles: () => [StyleSheet.absoluteFill, styles.justifyContentCenter, styles.alignItemsCenter],
-    
+
     getWorkspaceWorkflowsDotStyle: (enabled: boolean, isSmallScreenWidth: boolean) =>
     ({
         position: 'absolute',
@@ -1486,6 +1487,80 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
         bottom: enabled ? '-180%' : '-100%',
         left: isSmallScreenWidth ? '6%' : '2.45%',
     }),
+
+    getWorkflowsStyle: (type: string): Object => {
+        switch (type) {
+            case 'icon':
+                return {
+                    marginRight: 12,
+                    zIndex: 2,
+                    paddingBottom: 15,
+                };
+            case 'content':
+                return {
+                    flexDirection: 'row',
+                    alignItems: 'center',
+                    flex: 1,
+                };
+            case 'container':
+                return {
+                    flexDirection: 'row',
+                    alignItems: 'center',
+                    justifyContent: 'space-between',
+                };
+            case 'heading':
+                return {
+                    fontSize: 15,
+                    fontWeight: '700',
+                };
+            case 'wrapperText':
+                return {
+                    flexDirection: 'column',
+                    flex: 1,
+                };
+            case 'subtitle':
+                return {
+                    fontSize: 13,
+                    color: defaultTheme.textSupporting,
+                    marginTop: 3,
+                };
+            case 'subMenuContainer':
+                return {
+                    ...spacing.ph8,
+                    ...spacing.mhn8,
+                    width: 'auto',
+                    marginLeft: 44,
+                    paddingVertical: 12,
+                    paddingRight: 9,
+                    paddingLeft: 16,
+                    marginRight: 0,
+                };
+            case 'subMenuTitle':
+                return {
+                    color: defaultTheme.textSupporting,
+                    fontSize: 13,
+                    lineHeight: 16,
+                    fontWeight: '400',
+                };
+            case 'subMenuDescription':
+                return {
+                    color: defaultTheme.text,
+                    fontSize: 15,
+                    lineHeight: 20,
+                };
+            case 'timelineOverride':
+                return {
+                    backgroundColor: defaultTheme.cardBG,
+                    zIndex: 1,
+                    height: 19,
+                    width: 19,
+                    position: 'absolute',
+                    left: 0,
+                };
+            default:
+                return {};
+        }
+    },
 });
 
 type StyleUtilsType = ReturnType<typeof createStyleUtils>;

From c2a75444168b4ded23da20720e02129cd993df85 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 17:35:51 +0100
Subject: [PATCH 181/305] use workflows style utils

---
 .../workflows/ToggleSettingsOptionRow.tsx     | 14 ++++++-------
 .../workflows/WorkspaceWorkflowsPage.tsx      | 20 ++++++++++---------
 2 files changed, 18 insertions(+), 16 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index cb06be97e2c1..3543f1d72581 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -37,19 +37,19 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
 
     return (
         <View style={styles.pRelative}>
-            <View style={styles.workspaceWorkflowContainer}>
-                <View style={styles.workspaceWorkflowContent}>
+            <View style={StyleUtils.getWorkflowsStyle('container')}>
+                <View style={StyleUtils.getWorkflowsStyle('content')}>
                     <Icon
                         src={icon}
                         height={48}
                         width={48}
-                        additionalStyles={styles.workspaceWorkflowsIcon}
+                        additionalStyles={StyleUtils.getWorkflowsStyle('icon')}
                     />
-                    <View style={styles.workspaceWorkflowsTimelineOverride} />
+                    <View style={StyleUtils.getWorkflowsStyle('timelineOverride')} />
                     {!isEndOptionRow && <View style={StyleUtils.getWorkspaceWorkflowsDotStyle(isEnabled, isSmallScreenWidth) as ViewStyle} />}
-                    <View style={styles.workspaceWorkflowsWrapperText}>
-                        <Text style={styles.workspaceWorkflowsHeading}>{title}</Text>
-                        <Text style={styles.workspaceWorkflowsSubtitle}>{subtitle}</Text>
+                    <View style={StyleUtils.getWorkflowsStyle('wrapperText')}>
+                        <Text style={StyleUtils.getWorkflowsStyle('heading')}>{title}</Text>
+                        <Text style={StyleUtils.getWorkflowsStyle('subtitle')}>{subtitle}</Text>
                     </View>
                 </View>
                 <View>
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 2e87c8098ba0..ccb26563ce16 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -17,6 +17,7 @@ import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
 import ToggleSettingOptionRow from './ToggleSettingsOptionRow';
 import type {OptionType} from './ToggleSettingsOptionRow';
+import useStyleUtils from '@hooks/useStyleUtils';
 
 type WorkspaceWorkflowsPageProps = WithPolicyProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
 
@@ -24,6 +25,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const {isSmallScreenWidth} = useWindowDimensions();
+    const StyleUtils = useStyleUtils();
 
     const items: OptionType[] = useMemo(() => ([
         {
@@ -36,13 +38,13 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             subMenuItems: (
                 <MenuItem
                     title={translate('workflowsPage.submissionFrequency')}
-                    titleStyle={styles.workspaceWorkflowsSubMenuTitle}
-                    descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
+                    titleStyle={StyleUtils.getWorkflowsStyle('subMenuTitle')}
+                    descriptionTextStyle={StyleUtils.getWorkflowsStyle('subMenuDescription')}
                     // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_AUTOREPORTING_FREQUENCY).getRoute(route.params.policyID))}
                     // TODO will be done in https://github.com/Expensify/Expensify/issues/368332
                     description={translate('workflowsPage.weeklyFrequency')}
                     shouldShowRightIcon
-                    wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
+                    wrapperStyle={StyleUtils.getWorkflowsStyle('subMenuContainer')}
                     hoverAndPressStyle={[styles.mr0, styles.br2]}
                 />
             ),
@@ -58,13 +60,13 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             subMenuItems: (
                 <MenuItem
                     title={translate('workflowsPage.approver')}
-                    titleStyle={styles.workspaceWorkflowsSubMenuTitle}
-                    descriptionTextStyle={styles.workspaceWorkflowsSubMenuDescription}
+                    titleStyle={StyleUtils.getWorkflowsStyle('subMenuTitle')}
+                    descriptionTextStyle={StyleUtils.getWorkflowsStyle('subMenuDescription')}
                     description={policy?.owner ?? ''}
                     // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
                     // TODO will be done in https://github.com/Expensify/Expensify/issues/368334
                     shouldShowRightIcon
-                    wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
+                    wrapperStyle={StyleUtils.getWorkflowsStyle('subMenuContainer')}
                     hoverAndPressStyle={[styles.mr0, styles.br2]}
                 />
             ),
@@ -79,19 +81,19 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             },
             subMenuItems: (
                 <MenuItem
-                    descriptionTextStyle={[styles.workspaceWorkflowsSubMenuDescription, styles.textSupporting]}
+                    descriptionTextStyle={[StyleUtils.getWorkflowsStyle('subMenuDescription'), styles.textSupporting]}
                     description={translate('workflowsPage.connectBankAccount')}
                     // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
                     // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
                     shouldShowRightIcon
-                    wrapperStyle={styles.workspaceWorkflowsSubMenuContainer}
+                    wrapperStyle={StyleUtils.getWorkflowsStyle('subMenuContainer')}
                     hoverAndPressStyle={[styles.mr0, styles.br2]}
                 />
             ),
             isEndOptionRow: true,
             hasBeenToggled: false, // TODO make it dynamic when VBBA action is implemented
         },
-    ]), [policy, route.params.policyID, styles, translate]);
+    ]), [policy, route.params.policyID, styles, translate, StyleUtils]);
 
     const renderItem = ({item}: {item: OptionType}) => (
         <View style={styles.mt7}>

From 007d5388377b9d52374243a12d0a9e73c7ff665e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Mon, 19 Feb 2024 17:47:22 +0100
Subject: [PATCH 182/305] use correct naming for props

---
 .../workflows/ToggleSettingsOptionRow.tsx         | 15 +++++----------
 .../workflows/WorkspaceWorkflowsPage.tsx          |  8 ++++----
 2 files changed, 9 insertions(+), 14 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 3543f1d72581..e84484a98f17 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -1,4 +1,4 @@
-import React, {useEffect, useState} from 'react';
+import React, {useState} from 'react';
 import {View} from 'react-native';
 import type {ViewStyle} from 'react-native';
 import useStyleUtils from '@hooks/useStyleUtils';
@@ -9,7 +9,7 @@ import Text from '@components/Text';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 
-type OptionType = {
+type ToggleSettingOptionRowProps = {
     icon: React.FC<SvgProps>;
     title: string;
     subtitle: string;
@@ -19,8 +19,8 @@ type OptionType = {
     isEndOptionRow?: boolean;
 };
 
-function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, isEndOptionRow, hasBeenToggled}: OptionType) {
-    const [isEnabled, setIsEnabled] = useState(false);
+function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, isEndOptionRow, hasBeenToggled}: ToggleSettingOptionRowProps) {
+    const [isEnabled, setIsEnabled] = useState(hasBeenToggled);
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
 
@@ -30,11 +30,6 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
     };
     const {isSmallScreenWidth} = useWindowDimensions();
 
-
-    useEffect(() => {
-        setIsEnabled(hasBeenToggled);
-    }, [hasBeenToggled]);
-
     return (
         <View style={styles.pRelative}>
             <View style={StyleUtils.getWorkflowsStyle('container')}>
@@ -65,5 +60,5 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
     );
 }
 
-export type {OptionType};
+export type {ToggleSettingOptionRowProps};
 export default ToggleSettingOptionRow;
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index ccb26563ce16..9fe10bff8419 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -16,7 +16,7 @@ import * as Policy from '@userActions/Policy';
 import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
 import ToggleSettingOptionRow from './ToggleSettingsOptionRow';
-import type {OptionType} from './ToggleSettingsOptionRow';
+import type {ToggleSettingOptionRowProps} from './ToggleSettingsOptionRow';
 import useStyleUtils from '@hooks/useStyleUtils';
 
 type WorkspaceWorkflowsPageProps = WithPolicyProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
@@ -27,7 +27,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const {isSmallScreenWidth} = useWindowDimensions();
     const StyleUtils = useStyleUtils();
 
-    const items: OptionType[] = useMemo(() => ([
+    const items: ToggleSettingOptionRowProps[] = useMemo(() => ([
         {
             icon: Illustrations.ReceiptEnvelope,
             title: translate('workflowsPage.delaySubmissionTitle'),
@@ -95,7 +95,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
         },
     ]), [policy, route.params.policyID, styles, translate, StyleUtils]);
 
-    const renderItem = ({item}: {item: OptionType}) => (
+    const renderItem = ({item}: {item: ToggleSettingOptionRowProps}) => (
         <View style={styles.mt7}>
             <ToggleSettingOptionRow
                 icon={item.icon}
@@ -130,7 +130,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                             <FlatList
                                 data={items}
                                 renderItem={renderItem}
-                                keyExtractor={(item: OptionType) => item.title}
+                                keyExtractor={(item: ToggleSettingOptionRowProps) => item.title}
                             />
                         </View>
                     </Section>

From fe1f3f0699bba272887b575e370657b56659596a Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Mon, 19 Feb 2024 14:40:36 -0800
Subject: [PATCH 183/305] Cleanup

---
 .../MoneyRequestPreviewContent.tsx                  |  6 +++---
 src/libs/ReportUtils.ts                             |  6 ++----
 src/libs/TransactionUtils.ts                        | 13 ++-----------
 3 files changed, 7 insertions(+), 18 deletions(-)

diff --git a/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx b/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
index e2f7314afd73..41726549b285 100644
--- a/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
+++ b/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
@@ -85,7 +85,7 @@ function MoneyRequestPreviewContent({
     const requestMerchant = truncate(merchant, {length: CONST.REQUEST_PREVIEW.MAX_LENGTH});
     const hasReceipt = TransactionUtils.hasReceipt(transaction);
     const isScanning = hasReceipt && TransactionUtils.isReceiptBeingScanned(transaction);
-    const hasViolations = TransactionUtils.hasViolation(transaction, transactionViolations);
+    const hasViolations = TransactionUtils.hasViolation(transaction?.transactionID, transactionViolations);
     const hasFieldErrors = TransactionUtils.hasMissingSmartscanFields(transaction);
     const shouldShowRBR = hasViolations || hasFieldErrors;
     const isDistanceRequest = TransactionUtils.isDistanceRequest(transaction);
@@ -148,13 +148,13 @@ function MoneyRequestPreviewContent({
 
         let message = translate('iou.cash');
         if (hasViolations && transaction) {
-            const violations = TransactionUtils.getTransactionViolations(transaction, transactionViolations);
+            const violations = TransactionUtils.getTransactionViolations(transaction.transactionID, transactionViolations);
             if (violations?.[0]) {
                 const violationMessage = ViolationsUtils.getViolationTranslation(violations[0], translate);
                 const isTooLong = violations.filter((v) => v.type === 'violation').length > 1 || violationMessage.length > 15;
                 message += ` • ${isTooLong ? translate('violations.reviewRequired') : violationMessage}`;
             }
-        } else if (ReportUtils.isPaidGroupPolicyExpenseReport(iouReport) && ReportUtils.isReportApproved(iouReport) && !ReportUtils.isSettled(iouReport)) {
+        } else if (ReportUtils.isPaidGroupPolicyExpenseReport(iouReport) && ReportUtils.isReportApproved(iouReport) && !ReportUtils.isSettled(iouReport?.reportID)) {
             message += ` • ${translate('iou.approved')}`;
         } else if (iouReport?.isWaitingOnBankAccount) {
             message += ` • ${translate('iou.pending')}`;
diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index d0c3bf3e8c03..ea7009c25465 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -721,12 +721,10 @@ function hasParticipantInArray(report: Report, policyMemberAccountIDs: number[])
 /**
  * Whether the Money Request report is settled
  */
-function isSettled(reportOrID: Report | OnyxEntry<Report> | string | undefined): boolean {
-    if (!allReports || !reportOrID) {
+function isSettled(reportID: string | undefined): boolean {
+    if (!allReports) {
         return false;
     }
-    const reportID = typeof reportOrID === 'string' ? reportOrID : reportOrID?.reportID;
-
     const report: Report | EmptyObject = allReports[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`] ?? {};
     if (isEmptyObject(report) || report.isWaitingOnBankAccount) {
         return false;
diff --git a/src/libs/TransactionUtils.ts b/src/libs/TransactionUtils.ts
index d3eafc6554db..05bcbaa8f17e 100644
--- a/src/libs/TransactionUtils.ts
+++ b/src/libs/TransactionUtils.ts
@@ -550,20 +550,11 @@ function isOnHold(transaction: OnyxEntry<Transaction>): boolean {
 /**
  * Checks if any violations for the provided transaction are of type 'violation'
  */
-function hasViolation(transactionOrID: Transaction | OnyxEntry<Transaction> | string, transactionViolations: OnyxCollection<TransactionViolation[]>): boolean {
-    if (!transactionOrID) {
-        return false;
-    }
-    const transactionID = typeof transactionOrID === 'string' ? transactionOrID : transactionOrID.transactionID;
+function hasViolation(transactionID: string, transactionViolations: OnyxCollection<TransactionViolation[]>): boolean {
     return Boolean(transactionViolations?.[ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS + transactionID]?.some((violation: TransactionViolation) => violation.type === 'violation'));
 }
 
-function getTransactionViolations(transactionOrID: OnyxEntry<Transaction> | string, transactionViolations: OnyxCollection<TransactionViolation[]>): TransactionViolation[] | null {
-    if (!transactionOrID) {
-        return null;
-    }
-    const transactionID = typeof transactionOrID === 'string' ? transactionOrID : transactionOrID.transactionID;
-
+function getTransactionViolations(transactionID: string, transactionViolations: OnyxCollection<TransactionViolation[]>): TransactionViolation[] | null {
     return transactionViolations?.[ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS + transactionID] ?? null;
 }
 

From 45441a4e9884ca95cdbb310d6d530cb342852897 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Mon, 19 Feb 2024 16:26:39 -0800
Subject: [PATCH 184/305] Fix client side violations

---
 src/hooks/useViolations.ts             | 15 +++------------
 src/libs/Violations/ViolationsUtils.ts |  6 ------
 2 files changed, 3 insertions(+), 18 deletions(-)

diff --git a/src/hooks/useViolations.ts b/src/hooks/useViolations.ts
index ea825b45bc0b..e43820281e8a 100644
--- a/src/hooks/useViolations.ts
+++ b/src/hooks/useViolations.ts
@@ -59,18 +59,9 @@ function useViolations(violations: TransactionViolation[]) {
         return violationGroups ?? new Map();
     }, [violations]);
 
-    const getViolationsForField = useCallback(
-        (field: ViolationField, data?: TransactionViolation['data']) => {
-            const currentViolations = violationsByField.get(field) ?? [];
-
-            if (data?.tagName) {
-                return currentViolations.filter((violation) => violation.data?.tagName === data.tagName);
-            }
-
-            return currentViolations;
-        },
-        [violationsByField],
-    );
+    const getViolationsForField = useCallback((field: ViolationField, data?: TransactionViolation['data']) => {
+        return violationsByField.get(field) ?? [];
+    }, [violationsByField]);
 
     return {
         getViolationsForField,
diff --git a/src/libs/Violations/ViolationsUtils.ts b/src/libs/Violations/ViolationsUtils.ts
index a1cd001badee..620a9e7b4e84 100644
--- a/src/libs/Violations/ViolationsUtils.ts
+++ b/src/libs/Violations/ViolationsUtils.ts
@@ -83,9 +83,6 @@ const ViolationsUtils = {
                 if (hasTagOutOfPolicyViolation && selectedTag && isTagInPolicy) {
                     newTransactionViolations = reject(newTransactionViolations, {
                         name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
-                        data: {
-                            tagName: key,
-                        },
                     });
                 }
 
@@ -93,9 +90,6 @@ const ViolationsUtils = {
                 if (hasMissingTagViolation && isTagInPolicy) {
                     newTransactionViolations = reject(newTransactionViolations, {
                         name: CONST.VIOLATIONS.MISSING_TAG,
-                        data: {
-                            tagName: key,
-                        },
                     });
                 }
 

From 59987c2bfa56db042517594dc57d71b61a72aed5 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Mon, 19 Feb 2024 16:26:54 -0800
Subject: [PATCH 185/305] Fix currency issue

---
 src/libs/actions/IOU.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts
index cc85fb92dd66..0f450ac66cf1 100644
--- a/src/libs/actions/IOU.ts
+++ b/src/libs/actions/IOU.ts
@@ -1140,7 +1140,7 @@ function getUpdateMoneyRequestParams(
                 ? IOUUtils.updateIOUOwnerAndTotal(iouReport, updatedReportAction.actorAccountID ?? -1, diff, TransactionUtils.getCurrency(transaction), false, true)
                 : {};
         }
-        updatedMoneyRequestReport.cachedTotal = CurrencyUtils.convertToDisplayString(updatedMoneyRequestReport.total, updatedTransaction?.modifiedCurrency);
+        updatedMoneyRequestReport.cachedTotal = CurrencyUtils.convertToDisplayString(updatedMoneyRequestReport.total, updatedTransaction?.currency);
 
         optimisticData.push({
             onyxMethod: Onyx.METHOD.MERGE,

From 52ac1d9c9f96e59d054752b47a2fcfa48628d2b9 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Mon, 19 Feb 2024 16:34:17 -0800
Subject: [PATCH 186/305] Remove unused userMessage

---
 src/libs/Violations/ViolationsUtils.ts | 7 ++-----
 src/types/onyx/TransactionViolation.ts | 1 -
 2 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/src/libs/Violations/ViolationsUtils.ts b/src/libs/Violations/ViolationsUtils.ts
index 620a9e7b4e84..f4a407d6c8bd 100644
--- a/src/libs/Violations/ViolationsUtils.ts
+++ b/src/libs/Violations/ViolationsUtils.ts
@@ -30,7 +30,7 @@ const ViolationsUtils = {
 
             // Add 'categoryOutOfPolicy' violation if category is not in policy
             if (!hasCategoryOutOfPolicyViolation && categoryKey && !isCategoryInPolicy) {
-                newTransactionViolations.push({name: 'categoryOutOfPolicy', type: 'violation', userMessage: ''});
+                newTransactionViolations.push({name: 'categoryOutOfPolicy', type: 'violation'});
             }
 
             // Remove 'categoryOutOfPolicy' violation if category is in policy
@@ -45,7 +45,7 @@ const ViolationsUtils = {
 
             // Add 'missingCategory' violation if category is required and not set
             if (!hasMissingCategoryViolation && policyRequiresCategories && !categoryKey) {
-                newTransactionViolations.push({name: 'missingCategory', type: 'violation', userMessage: ''});
+                newTransactionViolations.push({name: 'missingCategory', type: 'violation'});
             }
         }
 
@@ -57,7 +57,6 @@ const ViolationsUtils = {
                 newTransactionViolations.push({
                     name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
                     type: 'violation',
-                    userMessage: '',
                 });
             }
 
@@ -72,7 +71,6 @@ const ViolationsUtils = {
                     newTransactionViolations.push({
                         name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
                         type: 'violation',
-                        userMessage: '',
                         data: {
                             tagName: key,
                         },
@@ -98,7 +96,6 @@ const ViolationsUtils = {
                     newTransactionViolations.push({
                         name: CONST.VIOLATIONS.MISSING_TAG,
                         type: 'violation',
-                        userMessage: '',
                         data: {
                             tagName: key,
                         },
diff --git a/src/types/onyx/TransactionViolation.ts b/src/types/onyx/TransactionViolation.ts
index b1764b4aeb80..9133eca63c65 100644
--- a/src/types/onyx/TransactionViolation.ts
+++ b/src/types/onyx/TransactionViolation.ts
@@ -9,7 +9,6 @@ type ViolationName = (typeof CONST.VIOLATIONS)[keyof typeof CONST.VIOLATIONS];
 type TransactionViolation = {
     type: string;
     name: ViolationName;
-    userMessage: string;
     data?: {
         rejectedBy?: string;
         rejectReason?: string;

From f87ab42ccf0bcd539ef67d76f7507387f928fbf5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Tue, 20 Feb 2024 10:08:41 +0100
Subject: [PATCH 187/305] use paid group policy check

---
 src/pages/workspace/WorkspaceInitialPage.tsx | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index 3b415c8a6fe0..c9a995e3cc06 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -97,8 +97,6 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
     const hasMembersError = PolicyUtils.hasPolicyMemberError(policyMembers);
     const hasGeneralSettingsError = !isEmptyObject(policy?.errorFields?.generalSettings ?? {}) || !isEmptyObject(policy?.errorFields?.avatar ?? {});
     const shouldShowProtectedItems = PolicyUtils.isPolicyAdmin(policy);
-    const isCollectPolicy = PolicyUtils.isCollectPolicy(policy);
-    const isControlPolicy = PolicyUtils.isControlPolicy(policy);
     const isFreePolicy = PolicyUtils.isFreePolicy(policy);
 
     const protectedMenuItems: WorkspaceMenuItem[] = [
@@ -166,7 +164,7 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
             brickRoadIndicator: hasGeneralSettingsError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             routeName: SCREENS.WORKSPACE.PROFILE,
         },
-        ...(shouldShowProtectedItems && isCollectPolicy || isControlPolicy ? moreFeaturesMenuItems : []),
+        ...(shouldShowProtectedItems && PolicyUtils.isPaidGroupPolicy(policy) ? moreFeaturesMenuItems : []),
         ...(shouldShowProtectedItems && isFreePolicy ? protectedMenuItems : []),
     ];
 

From 7ccb5806e286bc0bc2cbdcf435dc8c70c6db884b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Tue, 20 Feb 2024 10:29:42 +0100
Subject: [PATCH 188/305] clean up paid group policy check

---
 src/pages/workspace/WorkspaceInitialPage.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index c9a995e3cc06..eb0d360a12b0 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -98,6 +98,7 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
     const hasGeneralSettingsError = !isEmptyObject(policy?.errorFields?.generalSettings ?? {}) || !isEmptyObject(policy?.errorFields?.avatar ?? {});
     const shouldShowProtectedItems = PolicyUtils.isPolicyAdmin(policy);
     const isFreePolicy = PolicyUtils.isFreePolicy(policy);
+    const isPaidGroupPolicy = PolicyUtils.isPaidGroupPolicy(policy);
 
     const protectedMenuItems: WorkspaceMenuItem[] = [
         {
@@ -164,8 +165,8 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
             brickRoadIndicator: hasGeneralSettingsError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             routeName: SCREENS.WORKSPACE.PROFILE,
         },
-        ...(shouldShowProtectedItems && PolicyUtils.isPaidGroupPolicy(policy) ? moreFeaturesMenuItems : []),
-        ...(shouldShowProtectedItems && isFreePolicy ? protectedMenuItems : []),
+        ...(isPaidGroupPolicy && shouldShowProtectedItems ? moreFeaturesMenuItems : []),
+        ...(isFreePolicy && shouldShowProtectedItems ? protectedMenuItems : []),
     ];
 
     const prevPolicy = usePrevious(policy);

From f83b9c11961093d2f44bee928630ec1be816d050 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Tue, 20 Feb 2024 11:17:37 +0100
Subject: [PATCH 189/305] fix ios console error

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 9fe10bff8419..c6a61f2f2bf5 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -111,7 +111,6 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
 
     return (
         <WorkspacePageWithSections
-            shouldUseScrollView
             headerText={translate('workspace.common.workflows')}
             icon={Illustrations.Workflows}
             route={route}

From 505d7ea5c1bcedd096799e6c11bcddfec090bd62 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Tue, 20 Feb 2024 11:32:19 +0100
Subject: [PATCH 190/305] fix icons display

---
 .../simple-illustrations/simple-illustration__approval.svg      | 2 +-
 .../simple-illustration__receipt-envelope.svg                   | 2 +-
 .../simple-illustrations/simple-illustration__wallet-alt.svg    | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/assets/images/simple-illustrations/simple-illustration__approval.svg b/assets/images/simple-illustrations/simple-illustration__approval.svg
index 8816849fa39e..bdef2436958b 100644
--- a/assets/images/simple-illustrations/simple-illustration__approval.svg
+++ b/assets/images/simple-illustrations/simple-illustration__approval.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="38" height="40" viewBox="0 0 38 40" fill="none"><path d="M13.8399 7.32497L11.4532 3.52603C11.4532 3.52603 9.89413 0.797631 7.02157 0.848355C4.14902 0.896409 2.00529 2.01767 1.03086 4.69535C0.0564363 7.37303 0.73987 9.32188 1.76235 10.4431C2.78483 11.5644 5.75616 12.2932 5.75616 12.2932L5.80421 24.3735L9.16531 27.198C9.16531 27.198 8.77554 16.53 8.82359 15.9453C8.87165 15.3607 8.97043 13.3157 8.97043 13.3157C8.97043 13.3157 9.40825 12.4401 10.6256 11.9515C11.843 11.463 24.7988 7.03131 24.7988 7.03131L21.5365 4.88756C21.5365 4.88756 19.8306 5.17856 19.2967 5.42417C18.7601 5.66711 13.8426 7.32497 13.8426 7.32497H13.8399Z" fill="#D18000"/><path d="M26.8817 9.35938C26.8817 9.35938 26.0781 7.27704 24.543 7.23967C23.008 7.20229 21.5851 7.93378 21.5851 7.93378L10.2977 12.0264C10.2977 12.0264 9.2379 12.6831 9.05636 13.743C8.87482 14.8028 8.98428 26.528 8.98428 26.528C8.98428 26.528 10.0068 28.573 11.5792 28.4288C13.1516 28.2847 25.7524 23.2417 25.7524 23.2417C25.7524 23.2417 26.7749 23.0228 26.8496 21.0125C26.9217 19.0022 26.887 9.35938 26.887 9.35938H26.8817Z" fill="#FFED8F"/><path d="M24.8469 7.1812L21 4.89062L19.2941 5.42723L7.01897 9.9096C7.01897 9.9096 5.89771 10.6891 5.89771 11.6636C5.89771 12.638 5.80161 24.3765 5.80161 24.3765L9.06393 26.7632L9.05058 13.7459C9.05058 13.7459 9.50175 12.3443 10.6203 11.9546C11.7389 11.5648 23.1384 7.37609 23.1384 7.37609C23.1384 7.37609 24.5987 7.08509 24.8443 7.1812H24.8469Z" fill="#722B03"/><path d="M25.5333 33.3111L24.6683 34.5392C24.5428 34.718 24.6176 34.953 24.8338 35.0491L29.3375 37.062C29.5378 37.1528 29.786 37.086 29.8955 36.9152L34.2123 30.1609C34.3271 29.982 34.247 29.7551 34.0361 29.6643L32.728 29.0904C32.5304 29.0023 32.2875 29.0663 32.1781 29.2319L28.9291 34.144C28.8143 34.3149 28.5633 34.3763 28.3631 34.2802L26.0939 33.183C25.899 33.0869 25.6507 33.1456 25.5333 33.3111V33.3111Z" fill="#00B268"/><path d="M21.4617 18.0134L22.2386 19.4844C22.3507 19.6979 22.284 19.9783 22.0891 20.093L18.0366 22.5064C17.855 22.6132 17.6335 22.5358 17.5347 22.3302L13.6503 14.2411C13.5462 14.0276 13.6183 13.7553 13.8078 13.6458L14.9852 12.957C15.164 12.8529 15.3803 12.9277 15.4817 13.1279L18.405 19.0118C18.5064 19.2174 18.7334 19.2895 18.9149 19.1747L20.9572 17.8585C21.1334 17.7437 21.355 17.8131 21.4617 18.0107V18.0134Z" fill="#00B268"/><path d="M35.5121 26.4414H23.4319C22.2252 26.4414 21.2455 27.2877 21.2455 28.3342V37.8703C21.2455 38.9141 22.2226 39.7631 23.4319 39.7631H35.5121C36.7188 39.7631 37.6986 38.9168 37.6986 37.8703V28.3342C37.6986 27.2904 36.7215 26.4414 35.5121 26.4414ZM34.8928 36.6769C34.8928 37.1948 34.4069 37.614 33.8089 37.614H25.1298C24.5318 37.614 24.046 37.1948 24.046 36.6769V29.5275C24.046 29.0096 24.5318 28.5905 25.1298 28.5905H33.8089C34.4069 28.5905 34.8928 29.0096 34.8928 29.5275V36.6769Z" fill="#00B268"/><path d="M22.6658 9.58578L12.1741 13.6517C11.5067 13.9106 11.0528 14.6234 11.0395 15.4324L10.898 24.2129C10.8766 25.5184 11.9739 26.4581 13.0551 26.063L23.5041 22.256C24.1822 22.0077 24.6521 21.2923 24.6681 20.4727L24.855 11.4359C24.8817 10.1117 23.7604 9.16397 22.6685 9.58578H22.6658ZM23.1063 19.7706C23.1063 20.171 22.8527 20.5261 22.479 20.6596L14.5688 23.5028C13.9467 23.727 13.2927 23.2598 13.298 22.6004L13.3647 16.049C13.3674 15.6539 13.6157 15.3042 13.9868 15.1681L21.8569 12.2661C22.479 12.0365 23.1384 12.4984 23.1357 13.1605L23.109 19.7706H23.1063Z" fill="#00B268"/><path d="M26.8439 21.089V9.98585C26.8439 8.03966 24.9858 6.67546 23.2105 7.31618L10.7005 11.8439C9.60592 12.2417 8.87177 13.3123 8.87177 14.5136V25.6168C8.87177 27.563 10.7298 28.9272 12.5052 28.2864L25.0152 23.7587C26.1098 23.3609 26.8439 22.2904 26.8439 21.089V21.089Z" stroke="#002140" stroke-width="0.999899" stroke-linecap="round" stroke-linejoin="round"/><path d="M9.95073 27.8696L6.1171 24.6687C5.91687 24.2789 5.80475 23.8304 5.80475 23.3472V12.244C5.80475 11.0427 6.53891 9.97212 7.63347 9.57434L20.1435 5.04659C20.6053 4.8784 21.2781 4.77428 21.9588 5.22011L25.6937 7.67888" stroke="#002140" stroke-width="0.999899" stroke-linecap="round" stroke-linejoin="round"/><path d="M5.74796 12.2405C4.92837 12.131 4.11413 12.0456 3.25984 11.5677C1.34302 10.4918 0.651581 8.70314 0.651581 6.66084C0.651581 3.39317 3.29988 0.742188 6.57021 0.742188C11.2982 0.838296 11.6773 4.7547 13.7703 7.20012" stroke="#002140" stroke-width="0.999899" stroke-linecap="round" stroke-linejoin="round"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" width="60" height="70" viewBox="0 0 38 40" fill="none"><path d="M13.8399 7.32497L11.4532 3.52603C11.4532 3.52603 9.89413 0.797631 7.02157 0.848355C4.14902 0.896409 2.00529 2.01767 1.03086 4.69535C0.0564363 7.37303 0.73987 9.32188 1.76235 10.4431C2.78483 11.5644 5.75616 12.2932 5.75616 12.2932L5.80421 24.3735L9.16531 27.198C9.16531 27.198 8.77554 16.53 8.82359 15.9453C8.87165 15.3607 8.97043 13.3157 8.97043 13.3157C8.97043 13.3157 9.40825 12.4401 10.6256 11.9515C11.843 11.463 24.7988 7.03131 24.7988 7.03131L21.5365 4.88756C21.5365 4.88756 19.8306 5.17856 19.2967 5.42417C18.7601 5.66711 13.8426 7.32497 13.8426 7.32497H13.8399Z" fill="#D18000"/><path d="M26.8817 9.35938C26.8817 9.35938 26.0781 7.27704 24.543 7.23967C23.008 7.20229 21.5851 7.93378 21.5851 7.93378L10.2977 12.0264C10.2977 12.0264 9.2379 12.6831 9.05636 13.743C8.87482 14.8028 8.98428 26.528 8.98428 26.528C8.98428 26.528 10.0068 28.573 11.5792 28.4288C13.1516 28.2847 25.7524 23.2417 25.7524 23.2417C25.7524 23.2417 26.7749 23.0228 26.8496 21.0125C26.9217 19.0022 26.887 9.35938 26.887 9.35938H26.8817Z" fill="#FFED8F"/><path d="M24.8469 7.1812L21 4.89062L19.2941 5.42723L7.01897 9.9096C7.01897 9.9096 5.89771 10.6891 5.89771 11.6636C5.89771 12.638 5.80161 24.3765 5.80161 24.3765L9.06393 26.7632L9.05058 13.7459C9.05058 13.7459 9.50175 12.3443 10.6203 11.9546C11.7389 11.5648 23.1384 7.37609 23.1384 7.37609C23.1384 7.37609 24.5987 7.08509 24.8443 7.1812H24.8469Z" fill="#722B03"/><path d="M25.5333 33.3111L24.6683 34.5392C24.5428 34.718 24.6176 34.953 24.8338 35.0491L29.3375 37.062C29.5378 37.1528 29.786 37.086 29.8955 36.9152L34.2123 30.1609C34.3271 29.982 34.247 29.7551 34.0361 29.6643L32.728 29.0904C32.5304 29.0023 32.2875 29.0663 32.1781 29.2319L28.9291 34.144C28.8143 34.3149 28.5633 34.3763 28.3631 34.2802L26.0939 33.183C25.899 33.0869 25.6507 33.1456 25.5333 33.3111V33.3111Z" fill="#00B268"/><path d="M21.4617 18.0134L22.2386 19.4844C22.3507 19.6979 22.284 19.9783 22.0891 20.093L18.0366 22.5064C17.855 22.6132 17.6335 22.5358 17.5347 22.3302L13.6503 14.2411C13.5462 14.0276 13.6183 13.7553 13.8078 13.6458L14.9852 12.957C15.164 12.8529 15.3803 12.9277 15.4817 13.1279L18.405 19.0118C18.5064 19.2174 18.7334 19.2895 18.9149 19.1747L20.9572 17.8585C21.1334 17.7437 21.355 17.8131 21.4617 18.0107V18.0134Z" fill="#00B268"/><path d="M35.5121 26.4414H23.4319C22.2252 26.4414 21.2455 27.2877 21.2455 28.3342V37.8703C21.2455 38.9141 22.2226 39.7631 23.4319 39.7631H35.5121C36.7188 39.7631 37.6986 38.9168 37.6986 37.8703V28.3342C37.6986 27.2904 36.7215 26.4414 35.5121 26.4414ZM34.8928 36.6769C34.8928 37.1948 34.4069 37.614 33.8089 37.614H25.1298C24.5318 37.614 24.046 37.1948 24.046 36.6769V29.5275C24.046 29.0096 24.5318 28.5905 25.1298 28.5905H33.8089C34.4069 28.5905 34.8928 29.0096 34.8928 29.5275V36.6769Z" fill="#00B268"/><path d="M22.6658 9.58578L12.1741 13.6517C11.5067 13.9106 11.0528 14.6234 11.0395 15.4324L10.898 24.2129C10.8766 25.5184 11.9739 26.4581 13.0551 26.063L23.5041 22.256C24.1822 22.0077 24.6521 21.2923 24.6681 20.4727L24.855 11.4359C24.8817 10.1117 23.7604 9.16397 22.6685 9.58578H22.6658ZM23.1063 19.7706C23.1063 20.171 22.8527 20.5261 22.479 20.6596L14.5688 23.5028C13.9467 23.727 13.2927 23.2598 13.298 22.6004L13.3647 16.049C13.3674 15.6539 13.6157 15.3042 13.9868 15.1681L21.8569 12.2661C22.479 12.0365 23.1384 12.4984 23.1357 13.1605L23.109 19.7706H23.1063Z" fill="#00B268"/><path d="M26.8439 21.089V9.98585C26.8439 8.03966 24.9858 6.67546 23.2105 7.31618L10.7005 11.8439C9.60592 12.2417 8.87177 13.3123 8.87177 14.5136V25.6168C8.87177 27.563 10.7298 28.9272 12.5052 28.2864L25.0152 23.7587C26.1098 23.3609 26.8439 22.2904 26.8439 21.089V21.089Z" stroke="#002140" stroke-width="0.999899" stroke-linecap="round" stroke-linejoin="round"/><path d="M9.95073 27.8696L6.1171 24.6687C5.91687 24.2789 5.80475 23.8304 5.80475 23.3472V12.244C5.80475 11.0427 6.53891 9.97212 7.63347 9.57434L20.1435 5.04659C20.6053 4.8784 21.2781 4.77428 21.9588 5.22011L25.6937 7.67888" stroke="#002140" stroke-width="0.999899" stroke-linecap="round" stroke-linejoin="round"/><path d="M5.74796 12.2405C4.92837 12.131 4.11413 12.0456 3.25984 11.5677C1.34302 10.4918 0.651581 8.70314 0.651581 6.66084C0.651581 3.39317 3.29988 0.742188 6.57021 0.742188C11.2982 0.838296 11.6773 4.7547 13.7703 7.20012" stroke="#002140" stroke-width="0.999899" stroke-linecap="round" stroke-linejoin="round"/></svg>
\ No newline at end of file
diff --git a/assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg b/assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg
index 61d63f506a9b..fc7082e9932c 100644
--- a/assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg
+++ b/assets/images/simple-illustrations/simple-illustration__receipt-envelope.svg
@@ -1 +1 @@
-<svg fill="none" viewBox="0 0 20 40" xmlns="http://www.w3.org/2000/svg"><path d="m0 24.812h12.194s1.7429-0.3283 1.7429-3.0596v-19.819l-2.3081 1.9766-1.8345-2.2608-1.8345 2.2608-2.0713-2.1187-2.1187 2.2134-1.7429-2.2134-1.7429 2.166-2.0713-1.8345v9.0872l1.7903 13.606-0.00316-0.0032z" fill="#FFFAF0" stroke="#002140" stroke-miterlimit="10" stroke-width=".99999"/><path d="m15 9.2266h-18.149v29.374h18.149v-29.374z" fill="#FFA75A" stroke="#002140" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/><path d="m15 38.6s0.3-2.084-2.2102-2.084h-14.032c-1.8503 0-1.9103 2.084-1.9103 2.084" stroke="#002140" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/><path d="m6 9.2266v27.24" stroke="#002140" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" width="60" height="70" viewBox="0 0 20 40" fill="none"><path d="M4.24562 24.8116H16.4398C16.4398 24.8116 18.1827 24.4833 18.1827 21.752V1.93261L15.8746 3.90919L14.0401 1.64844L12.2056 3.90919L10.1343 1.79052L8.01563 4.00391L6.2727 1.79052L4.5298 3.95655L2.4585 2.12206V11.2093L4.24878 24.8148L4.24562 24.8116Z" fill="#FFFAF0" stroke="#002140" stroke-width="0.99999" stroke-miterlimit="10"/><path d="M19.25 9.22656H1.10083V38.6005H19.25V9.22656Z" fill="#FFA75A" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M19.2499 38.5996C19.2499 38.5996 19.5499 36.5156 17.0397 36.5156H3.00792C1.15764 36.5156 1.09766 38.5996 1.09766 38.5996" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M10.1754 9.22656V36.4661" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/></svg>
diff --git a/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg b/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg
index 6cce2acd04f6..54b56e8d4e17 100644
--- a/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg
+++ b/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="30" height="44" viewBox="0 0 30 44" fill="none"><path d="M26.7969 22.8477H2.94542C1.80808 22.8477 0.886078 23.7697 0.886078 24.907V40.482C0.886078 41.6193 1.80808 42.5413 2.94542 42.5413H26.7969C27.9342 42.5413 28.8562 41.6193 28.8562 40.482V24.907C28.8562 23.7697 27.9342 22.8477 26.7969 22.8477Z" fill="#D18000"/><path d="M5.4714 26.359V22.7461H2.63247C2.63247 22.7461 0.886078 23.3832 0.886078 24.5959V26.4373L5.4686 26.359H5.4714Z" fill="#780505"/><path d="M24.5616 22.5848V26.5135H28.725V24.5911C28.725 24.5911 28.3255 22.8447 27.11 22.8447C25.8945 22.8447 24.5616 22.582 24.5616 22.582V22.5848Z" fill="#780505"/><path d="M24.7183 0.824219H5.15598V26.5143H24.7183V0.824219Z" fill="#00B268"/><path d="M26.0845 32.7557V29.8078C26.0845 29.8078 26.1684 28.4609 24.9473 28.4609H6.79042C6.79042 28.4609 5.65317 28.4609 5.65317 29.5563V32.6746L26.0845 32.7585V32.7557Z" fill="#FCDCFF"/><path d="M6.15912 28.6251H4.39038C4.39038 28.6251 3.67506 28.4155 3.63314 29.7623L3.54932 32.4588L5.65616 32.6683V29.55L6.16191 28.6223L6.15912 28.6251Z" fill="#FBCCFF"/><path d="M12.0715 30.1836H8.30768V32.5419H12.0715V30.1836Z" fill="#F9B5FE"/><path d="M5.49982 32.4874V29.6932C5.49982 29.003 6.05866 28.4414 6.75163 28.4414H24.861C25.5512 28.4414 26.1128 29.0003 26.1128 29.6932V32.6551" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.13742 32.429V30.2383H12.013V32.4848" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 30.4609H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M20.1024 30.4609H23.9779" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 31.5898H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M3.58807 32.4874V29.6932C3.58807 29.003 4.14692 28.4414 4.83989 28.4414H8.92504" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8744 23.4105C17.2988 23.4105 19.2641 20.4181 19.2641 16.7267C19.2641 13.0354 17.2988 10.043 14.8744 10.043C12.45 10.043 10.4847 13.0354 10.4847 16.7267C10.4847 20.4181 12.45 23.4105 14.8744 23.4105Z" fill="#5BE3AA"/><path d="M8.40536 5.57031C9.15073 5.57031 9.75497 4.96607 9.75497 4.2207C9.75497 3.47533 9.15073 2.87109 8.40536 2.87109C7.66 2.87109 7.05576 3.47533 7.05576 4.2207C7.05576 4.96607 7.66 5.57031 8.40536 5.57031Z" fill="#5BE3AA"/><path d="M21.5131 5.58984C22.2585 5.58984 22.8627 4.9856 22.8627 4.24023C22.8627 3.49487 22.2585 2.89062 21.5131 2.89062C20.7677 2.89062 20.1635 3.49487 20.1635 4.24023C20.1635 4.9856 20.7677 5.58984 21.5131 5.58984Z" fill="#5BE3AA"/><path d="M5.21713 26.3569V1.10547H24.5727V26.2255" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8966 23.6281C17.3425 23.6281 19.3254 20.5581 19.3254 16.7711C19.3254 12.9841 17.3425 9.91406 14.8966 9.91406C12.4506 9.91406 10.4677 12.9841 10.4677 16.7711C10.4677 20.5581 12.4506 23.6281 14.8966 23.6281Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.5134 5.79131C22.3683 5.79131 23.0614 5.09825 23.0614 4.24331C23.0614 3.38838 22.3683 2.69531 21.5134 2.69531C20.6585 2.69531 19.9654 3.38838 19.9654 4.24331C19.9654 5.09825 20.6585 5.79131 21.5134 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.41381 5.79131C9.26875 5.79131 9.96181 5.09825 9.96181 4.24331C9.96181 3.38838 9.26875 2.69531 8.41381 2.69531C7.55888 2.69531 6.86581 3.38838 6.86581 4.24331C6.86581 5.09825 7.55888 5.79131 8.41381 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.23514 26.3568V7.32812" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.6474 7.32812V26.4155" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6552 3.98828H18.2496" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.2468 4.21875C18.2468 5.93999 19.6439 7.3371 21.3652 7.3371C21.4294 7.3371 21.4965 7.3371 21.5608 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6582 4.21875C11.6582 5.93999 10.2611 7.3371 8.53983 7.3371C8.47557 7.3371 8.40851 7.3371 8.34424 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M24.7713 22.6406H26.5988C27.845 22.6406 28.8565 23.6521 28.8565 24.8984V40.4957C28.8565 41.7419 27.845 42.7534 26.5988 42.7534H3.04066C1.79444 42.7534 0.782928 41.7419 0.782928 40.4957V24.8984C0.782928 23.6521 1.79444 22.6406 3.04066 22.6406H5.02456" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 26.4102H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 33.0078H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" width="60" height="70" viewBox="0 0 30 44" fill="none"><path d="M26.7969 22.8477H2.94542C1.80808 22.8477 0.886078 23.7697 0.886078 24.907V40.482C0.886078 41.6193 1.80808 42.5413 2.94542 42.5413H26.7969C27.9342 42.5413 28.8562 41.6193 28.8562 40.482V24.907C28.8562 23.7697 27.9342 22.8477 26.7969 22.8477Z" fill="#D18000"/><path d="M5.4714 26.359V22.7461H2.63247C2.63247 22.7461 0.886078 23.3832 0.886078 24.5959V26.4373L5.4686 26.359H5.4714Z" fill="#780505"/><path d="M24.5616 22.5848V26.5135H28.725V24.5911C28.725 24.5911 28.3255 22.8447 27.11 22.8447C25.8945 22.8447 24.5616 22.582 24.5616 22.582V22.5848Z" fill="#780505"/><path d="M24.7183 0.824219H5.15598V26.5143H24.7183V0.824219Z" fill="#00B268"/><path d="M26.0845 32.7557V29.8078C26.0845 29.8078 26.1684 28.4609 24.9473 28.4609H6.79042C6.79042 28.4609 5.65317 28.4609 5.65317 29.5563V32.6746L26.0845 32.7585V32.7557Z" fill="#FCDCFF"/><path d="M6.15912 28.6251H4.39038C4.39038 28.6251 3.67506 28.4155 3.63314 29.7623L3.54932 32.4588L5.65616 32.6683V29.55L6.16191 28.6223L6.15912 28.6251Z" fill="#FBCCFF"/><path d="M12.0715 30.1836H8.30768V32.5419H12.0715V30.1836Z" fill="#F9B5FE"/><path d="M5.49982 32.4874V29.6932C5.49982 29.003 6.05866 28.4414 6.75163 28.4414H24.861C25.5512 28.4414 26.1128 29.0003 26.1128 29.6932V32.6551" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.13742 32.429V30.2383H12.013V32.4848" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 30.4609H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M20.1024 30.4609H23.9779" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 31.5898H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M3.58807 32.4874V29.6932C3.58807 29.003 4.14692 28.4414 4.83989 28.4414H8.92504" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8744 23.4105C17.2988 23.4105 19.2641 20.4181 19.2641 16.7267C19.2641 13.0354 17.2988 10.043 14.8744 10.043C12.45 10.043 10.4847 13.0354 10.4847 16.7267C10.4847 20.4181 12.45 23.4105 14.8744 23.4105Z" fill="#5BE3AA"/><path d="M8.40536 5.57031C9.15073 5.57031 9.75497 4.96607 9.75497 4.2207C9.75497 3.47533 9.15073 2.87109 8.40536 2.87109C7.66 2.87109 7.05576 3.47533 7.05576 4.2207C7.05576 4.96607 7.66 5.57031 8.40536 5.57031Z" fill="#5BE3AA"/><path d="M21.5131 5.58984C22.2585 5.58984 22.8627 4.9856 22.8627 4.24023C22.8627 3.49487 22.2585 2.89062 21.5131 2.89062C20.7677 2.89062 20.1635 3.49487 20.1635 4.24023C20.1635 4.9856 20.7677 5.58984 21.5131 5.58984Z" fill="#5BE3AA"/><path d="M5.21713 26.3569V1.10547H24.5727V26.2255" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8966 23.6281C17.3425 23.6281 19.3254 20.5581 19.3254 16.7711C19.3254 12.9841 17.3425 9.91406 14.8966 9.91406C12.4506 9.91406 10.4677 12.9841 10.4677 16.7711C10.4677 20.5581 12.4506 23.6281 14.8966 23.6281Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.5134 5.79131C22.3683 5.79131 23.0614 5.09825 23.0614 4.24331C23.0614 3.38838 22.3683 2.69531 21.5134 2.69531C20.6585 2.69531 19.9654 3.38838 19.9654 4.24331C19.9654 5.09825 20.6585 5.79131 21.5134 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.41381 5.79131C9.26875 5.79131 9.96181 5.09825 9.96181 4.24331C9.96181 3.38838 9.26875 2.69531 8.41381 2.69531C7.55888 2.69531 6.86581 3.38838 6.86581 4.24331C6.86581 5.09825 7.55888 5.79131 8.41381 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.23514 26.3568V7.32812" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.6474 7.32812V26.4155" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6552 3.98828H18.2496" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.2468 4.21875C18.2468 5.93999 19.6439 7.3371 21.3652 7.3371C21.4294 7.3371 21.4965 7.3371 21.5608 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6582 4.21875C11.6582 5.93999 10.2611 7.3371 8.53983 7.3371C8.47557 7.3371 8.40851 7.3371 8.34424 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M24.7713 22.6406H26.5988C27.845 22.6406 28.8565 23.6521 28.8565 24.8984V40.4957C28.8565 41.7419 27.845 42.7534 26.5988 42.7534H3.04066C1.79444 42.7534 0.782928 41.7419 0.782928 40.4957V24.8984C0.782928 23.6521 1.79444 22.6406 3.04066 22.6406H5.02456" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 26.4102H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 33.0078H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/></svg>
\ No newline at end of file

From e809446b356d62f24007de0dd93ced2785869226 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kacper=20Miko=C5=82ajczak?= <kacpermikolajczak10@gmail.com>
Date: Tue, 20 Feb 2024 13:27:35 +0100
Subject: [PATCH 191/305] add function description

---
 src/libs/LocaleCompare.ts | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/src/libs/LocaleCompare.ts b/src/libs/LocaleCompare.ts
index 5142c5b43d9a..ee2944e766fe 100644
--- a/src/libs/LocaleCompare.ts
+++ b/src/libs/LocaleCompare.ts
@@ -14,6 +14,14 @@ Onyx.connect({
     },
 });
 
+/**
+ * This is a wrapper around the localeCompare function that uses the preferred locale from the user's settings.
+ *
+ * It re-uses Intl.Collator for performance reasons. See https://github.com/facebook/hermes/issues/867 for more details.
+ * @param a
+ * @param b
+ * @returns -1 if a < b, 1 if a > b, 0 if a === b
+ */
 function localeCompare(a: string, b: string) {
     return collator.compare(a, b);
 }

From b880889e924201a000ed9a16cb54053edae3e492 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kacper=20Miko=C5=82ajczak?= <kacpermikolajczak10@gmail.com>
Date: Tue, 20 Feb 2024 13:27:53 +0100
Subject: [PATCH 192/305] add basic tests

---
 tests/unit/LocaleCompareTest.js | 27 +++++++++++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 tests/unit/LocaleCompareTest.js

diff --git a/tests/unit/LocaleCompareTest.js b/tests/unit/LocaleCompareTest.js
new file mode 100644
index 000000000000..2fa0448e3be2
--- /dev/null
+++ b/tests/unit/LocaleCompareTest.js
@@ -0,0 +1,27 @@
+const {default: localeCompare} = require('@libs/LocaleCompare');
+
+describe('localeCompare', () => {
+    it('should return -1 for descending comparison', () => {
+        const result = localeCompare('Da Vinci', 'Tesla');
+
+        expect(result).toBe(-1);
+    });
+
+    it('should return -1 for ascending comparison', () => {
+        const result = localeCompare('Zidane', 'Messi');
+
+        expect(result).toBe(1);
+    });
+
+    it('should return 0 for equal strings', () => {
+        const result = localeCompare('Cat', 'Cat');
+
+        expect(result).toBe(0);
+    });
+
+    it('should discard sensitivity differences', () => {
+        const result = localeCompare('apple', 'Apple');
+
+        expect(result).toBe(0);
+    });
+});

From 9795e5fbc78ae1811b0952a9bf8481c71ad369ea Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Tue, 20 Feb 2024 13:43:33 +0100
Subject: [PATCH 193/305] working workflows dots for react native

---
 assets/images/dot.svg                         |  3 +++
 .../workflows/ToggleSettingsOptionRow.tsx     | 23 ++++++++++++++++++-
 src/styles/utils/index.ts                     | 13 +++++------
 3 files changed, 31 insertions(+), 8 deletions(-)
 create mode 100644 assets/images/dot.svg

diff --git a/assets/images/dot.svg b/assets/images/dot.svg
new file mode 100644
index 000000000000..1146c88a01b8
--- /dev/null
+++ b/assets/images/dot.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="4" height="4" viewBox="0 0 4 4" fill="none">
+  <circle cx="2" cy="2" r="2" fill="#1A3D32"/>
+</svg>
\ No newline at end of file
diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index e84484a98f17..453b80f3148b 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -8,6 +8,8 @@ import Switch from '@components/Switch';
 import Text from '@components/Text';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
+import ImageSVG from '@components/ImageSVG';
+import Dot from '@assets/images/dot.svg';
 
 type ToggleSettingOptionRowProps = {
     icon: React.FC<SvgProps>;
@@ -30,6 +32,22 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
     };
     const {isSmallScreenWidth} = useWindowDimensions();
 
+
+    const VerticalDots = ({count}: {count: number}) => {
+        return (
+        <View style={StyleUtils.getWorkspaceWorkflowsDotStyle(isEnabled, isSmallScreenWidth) as ViewStyle}>
+            {Array.from({length: count}, (_, index) => (
+            <ImageSVG
+            contentFit="contain"
+            src={Dot}
+            height={isSmallScreenWidth ? 4 : 6}
+            width={isSmallScreenWidth ? 4 : 6}
+            pointerEvents="none"
+            />))}
+        </View>
+        );
+    };
+
     return (
         <View style={styles.pRelative}>
             <View style={StyleUtils.getWorkflowsStyle('container')}>
@@ -41,7 +59,9 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
                         additionalStyles={StyleUtils.getWorkflowsStyle('icon')}
                     />
                     <View style={StyleUtils.getWorkflowsStyle('timelineOverride')} />
-                    {!isEndOptionRow && <View style={StyleUtils.getWorkspaceWorkflowsDotStyle(isEnabled, isSmallScreenWidth) as ViewStyle} />}
+                    {!isEndOptionRow && (
+                        <VerticalDots count={7}/>
+                    )}
                     <View style={StyleUtils.getWorkflowsStyle('wrapperText')}>
                         <Text style={StyleUtils.getWorkflowsStyle('heading')}>{title}</Text>
                         <Text style={StyleUtils.getWorkflowsStyle('subtitle')}>{subtitle}</Text>
@@ -62,3 +82,4 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
 
 export type {ToggleSettingOptionRowProps};
 export default ToggleSettingOptionRow;
+
diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index 3dc5927b7f6f..247afaaa9cb2 100644
--- a/src/styles/utils/index.ts
+++ b/src/styles/utils/index.ts
@@ -1480,12 +1480,11 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
     ({
         position: 'absolute',
         width: 6,
-        backgroundImage: 'radial-gradient(circle at 2.5px, #1A3D32 1.25px, rgba(255, 255, 255, 0) 2.5px)',
-        backgroundSize: '5px 15px',
-        backgroundRepeat: 'repeat-y',
         top: isSmallScreenWidth ? '32%' : '12%',
-        bottom: enabled ? '-180%' : '-100%',
-        left: isSmallScreenWidth ? '6%' : '2.45%',
+        bottom: enabled ? '-140%' : '-80%',
+        left: isSmallScreenWidth ? '8%' : '4%',
+        display: 'flex',
+        justifyContent: 'space-between',
     }),
 
     getWorkflowsStyle: (type: string): Object => {
@@ -1552,8 +1551,8 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
                 return {
                     backgroundColor: defaultTheme.cardBG,
                     zIndex: 1,
-                    height: 19,
-                    width: 19,
+                    height: 29,
+                    width: 29,
                     position: 'absolute',
                     left: 0,
                 };

From c674033cc08266ab39c3c7f378c763dd02ccce86 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Tue, 20 Feb 2024 13:58:19 +0100
Subject: [PATCH 194/305] fix lint

---
 .../workflows/ToggleSettingsOptionRow.tsx     | 26 +++++++++----------
 .../workflows/WorkspaceWorkflowsPage.tsx      |  2 +-
 src/styles/utils/index.ts                     |  3 ++-
 3 files changed, 16 insertions(+), 15 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 453b80f3148b..adfb202443cf 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -32,21 +32,21 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
     };
     const {isSmallScreenWidth} = useWindowDimensions();
 
-
-    const VerticalDots = ({count}: {count: number}) => {
+    function VerticalDots({count}: {count: number}) {
         return (
-        <View style={StyleUtils.getWorkspaceWorkflowsDotStyle(isEnabled, isSmallScreenWidth) as ViewStyle}>
-            {Array.from({length: count}, (_, index) => (
-            <ImageSVG
-            contentFit="contain"
-            src={Dot}
-            height={isSmallScreenWidth ? 4 : 6}
-            width={isSmallScreenWidth ? 4 : 6}
-            pointerEvents="none"
-            />))}
-        </View>
+            <View style={StyleUtils.getWorkspaceWorkflowsDotStyle(isEnabled, isSmallScreenWidth) as ViewStyle}>
+                {Array.from({length: count}, () => (
+                    <ImageSVG
+                        contentFit="contain"
+                        src={Dot}
+                        height={isSmallScreenWidth ? 4 : 6}
+                        width={isSmallScreenWidth ? 4 : 6}
+                        pointerEvents="none"
+                    />
+                ))}
+            </View>
         );
-    };
+    }
 
     return (
         <View style={styles.pRelative}>
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index c6a61f2f2bf5..3ac6dd68e1c2 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -15,9 +15,9 @@ import WorkspacePageWithSections from '@pages/workspace/WorkspacePageWithSection
 import * as Policy from '@userActions/Policy';
 import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
+import useStyleUtils from '@hooks/useStyleUtils';
 import ToggleSettingOptionRow from './ToggleSettingsOptionRow';
 import type {ToggleSettingOptionRowProps} from './ToggleSettingsOptionRow';
-import useStyleUtils from '@hooks/useStyleUtils';
 
 type WorkspaceWorkflowsPageProps = WithPolicyProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
 
diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index 247afaaa9cb2..aaa3ce0f44ba 100644
--- a/src/styles/utils/index.ts
+++ b/src/styles/utils/index.ts
@@ -1487,7 +1487,7 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
         justifyContent: 'space-between',
     }),
 
-    getWorkflowsStyle: (type: string): Object => {
+    getWorkflowsStyle: (type: string): Record<string, string|number> => {
         switch (type) {
             case 'icon':
                 return {
@@ -1569,3 +1569,4 @@ const DefaultStyleUtils = createStyleUtils(defaultTheme, defaultStyles);
 export default createStyleUtils;
 export {DefaultStyleUtils};
 export type {StyleUtilsType, AvatarSizeName};
+

From a14d15f43ab0482e2e733a363973749a62cf4837 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kacper=20Miko=C5=82ajczak?= <kacpermikolajczak10@gmail.com>
Date: Tue, 20 Feb 2024 14:58:00 +0100
Subject: [PATCH 195/305] add Onyx setup

---
 tests/unit/LocaleCompareTest.js | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/tests/unit/LocaleCompareTest.js b/tests/unit/LocaleCompareTest.js
index 2fa0448e3be2..df87b47c93c5 100644
--- a/tests/unit/LocaleCompareTest.js
+++ b/tests/unit/LocaleCompareTest.js
@@ -1,6 +1,20 @@
-const {default: localeCompare} = require('@libs/LocaleCompare');
+import Onyx from 'react-native-onyx';
+import localeCompare from '@libs/LocaleCompare';
+import CONST from '@src/CONST';
+import ONYXKEYS from '@src/ONYXKEYS';
+import waitForBatchedUpdates from '../utils/waitForBatchedUpdates';
 
 describe('localeCompare', () => {
+    beforeAll(() => {
+        Onyx.init({
+            keys: {NVP_PREFERRED_LOCALE: ONYXKEYS.NVP_PREFERRED_LOCALE},
+            initialKeyStates: {[ONYXKEYS.NVP_PREFERRED_LOCALE]: CONST.LOCALES.DEFAULT},
+        });
+        return waitForBatchedUpdates();
+    });
+
+    afterEach(() => Onyx.clear());
+
     it('should return -1 for descending comparison', () => {
         const result = localeCompare('Da Vinci', 'Tesla');
 

From eff12f4ef2239384ba80202212b81fcdeb8b694a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kacper=20Miko=C5=82ajczak?= <kacpermikolajczak10@gmail.com>
Date: Tue, 20 Feb 2024 15:00:47 +0100
Subject: [PATCH 196/305] use default locale from CONST

---
 src/libs/LocaleCompare.ts | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/libs/LocaleCompare.ts b/src/libs/LocaleCompare.ts
index ee2944e766fe..b2c48b410d32 100644
--- a/src/libs/LocaleCompare.ts
+++ b/src/libs/LocaleCompare.ts
@@ -1,23 +1,22 @@
 import Onyx from 'react-native-onyx';
+import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 
-const DEFAULT_LOCALE = 'en';
-
 const COLLATOR_OPTIONS: Intl.CollatorOptions = {usage: 'sort', sensitivity: 'base'};
 
-let collator = new Intl.Collator(DEFAULT_LOCALE, COLLATOR_OPTIONS);
+let collator = new Intl.Collator(CONST.LOCALES.DEFAULT, COLLATOR_OPTIONS);
 
 Onyx.connect({
     key: ONYXKEYS.NVP_PREFERRED_LOCALE,
     callback: (locale) => {
-        collator = new Intl.Collator(locale ?? DEFAULT_LOCALE, COLLATOR_OPTIONS);
+        collator = new Intl.Collator(locale ?? CONST.LOCALES.DEFAULT, COLLATOR_OPTIONS);
     },
 });
 
 /**
  * This is a wrapper around the localeCompare function that uses the preferred locale from the user's settings.
  *
- * It re-uses Intl.Collator for performance reasons. See https://github.com/facebook/hermes/issues/867 for more details.
+ * It re-uses Intl.Collator with static options for performance reasons. See https://github.com/facebook/hermes/issues/867 for more details.
  * @param a
  * @param b
  * @returns -1 if a < b, 1 if a > b, 0 if a === b

From 5fef2d5d0e0f1d87fffc04e9eff1ddcfce84c3ef Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kacper=20Miko=C5=82ajczak?= <kacpermikolajczak10@gmail.com>
Date: Tue, 20 Feb 2024 15:10:06 +0100
Subject: [PATCH 197/305] add spanish sorting test

---
 tests/unit/LocaleCompareTest.js | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/tests/unit/LocaleCompareTest.js b/tests/unit/LocaleCompareTest.js
index df87b47c93c5..3c709675f31d 100644
--- a/tests/unit/LocaleCompareTest.js
+++ b/tests/unit/LocaleCompareTest.js
@@ -38,4 +38,14 @@ describe('localeCompare', () => {
 
         expect(result).toBe(0);
     });
+
+    it('distinguishes spanish diacritic characters', async () => {
+        await Onyx.set(ONYXKEYS.NVP_PREFERRED_LOCALE, CONST.LOCALES.ES);
+
+        const input = ['zorro', 'árbol', 'jalapeño', 'jalapeno', 'nino', 'niño'];
+
+        input.sort(localeCompare);
+
+        expect(input).toEqual(['árbol', 'jalapeno', 'jalapeño', 'nino', 'niño', 'zorro']);
+    });
 });

From 814489073e1566fe95541a637f54b7ad6138b085 Mon Sep 17 00:00:00 2001
From: Krishna Gupta <belivethatkg@gmail.com>
Date: Tue, 20 Feb 2024 21:25:34 +0530
Subject: [PATCH 198/305] fix: Chat - Download option in three-dot menu is
 still available in offline mode.

Signed-off-by: Krishna Gupta <belivethatkg@gmail.com>
---
 .../VideoPopoverMenuContext.js                | 30 +++++++++++--------
 1 file changed, 18 insertions(+), 12 deletions(-)

diff --git a/src/components/VideoPlayerContexts/VideoPopoverMenuContext.js b/src/components/VideoPlayerContexts/VideoPopoverMenuContext.js
index 23d1aec1817c..9c19ef8ed212 100644
--- a/src/components/VideoPlayerContexts/VideoPopoverMenuContext.js
+++ b/src/components/VideoPlayerContexts/VideoPopoverMenuContext.js
@@ -3,6 +3,7 @@ import React, {useCallback, useContext, useMemo, useState} from 'react';
 import _ from 'underscore';
 import * as Expensicons from '@components/Icon/Expensicons';
 import useLocalize from '@hooks/useLocalize';
+import useNetwork from '@hooks/useNetwork';
 import fileDownload from '@libs/fileDownload';
 import * as Url from '@libs/Url';
 import CONST from '@src/CONST';
@@ -14,6 +15,7 @@ function VideoPopoverMenuContextProvider({children}) {
     const {currentVideoPlayerRef} = usePlaybackContext();
     const {translate} = useLocalize();
     const [currentPlaybackSpeed, setCurrentPlaybackSpeed] = useState(CONST.VIDEO_PLAYER.PLAYBACK_SPEEDS[2]);
+    const {isOffline} = useNetwork();
 
     const updatePlaybackSpeed = useCallback(
         (speed) => {
@@ -30,15 +32,8 @@ function VideoPopoverMenuContextProvider({children}) {
         });
     }, [currentVideoPlayerRef]);
 
-    const menuItems = useMemo(
-        () => [
-            {
-                icon: Expensicons.Download,
-                text: translate('common.download'),
-                onSelected: () => {
-                    downloadAttachment();
-                },
-            },
+    const menuItems = useMemo(() => {
+        const items = [
             {
                 icon: Expensicons.Meter,
                 text: translate('videoPlayer.playbackSpeed'),
@@ -53,9 +48,20 @@ function VideoPopoverMenuContextProvider({children}) {
                     })),
                 ],
             },
-        ],
-        [currentPlaybackSpeed, downloadAttachment, translate, updatePlaybackSpeed],
-    );
+        ];
+
+        if (!isOffline) {
+            items.push({
+                icon: Expensicons.Download,
+                text: translate('common.download'),
+                onSelected: () => {
+                    downloadAttachment();
+                },
+            });
+        }
+
+        return items;
+    }, [currentPlaybackSpeed, downloadAttachment, translate, updatePlaybackSpeed, isOffline]);
 
     const contextValue = useMemo(() => ({menuItems, updatePlaybackSpeed}), [menuItems, updatePlaybackSpeed]);
     return <VideoPopoverMenuContext.Provider value={contextValue}>{children}</VideoPopoverMenuContext.Provider>;

From 07356afe66b744814a74fe3a786a82d31a00e1a5 Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Tue, 20 Feb 2024 17:29:37 +0100
Subject: [PATCH 199/305] [TS migration] Migrate 'execAsync.js' test

---
 tests/e2e/utils/{execAsync.js => execAsync.ts} | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)
 rename tests/e2e/utils/{execAsync.js => execAsync.ts} (72%)

diff --git a/tests/e2e/utils/execAsync.js b/tests/e2e/utils/execAsync.ts
similarity index 72%
rename from tests/e2e/utils/execAsync.js
rename to tests/e2e/utils/execAsync.ts
index 9abc41105f7e..b6beef01b4bb 100644
--- a/tests/e2e/utils/execAsync.js
+++ b/tests/e2e/utils/execAsync.ts
@@ -1,17 +1,19 @@
 import {exec} from 'child_process';
+import type {ChildProcess} from 'child_process';
 import * as Logger from './logger';
 
+type PromiseWithAbort = Promise<string | void> & {
+    abort?: () => void;
+};
+
 /**
  * Executes a command none-blocking by wrapping it in a promise.
  * In addition to the promise it returns an abort function.
- * @param {string} command
- * @param {object} env environment variables
- * @returns {Promise<void>}
  */
-export default (command, env = {}) => {
-    let childProcess;
-    const promise = new Promise((resolve, reject) => {
-        const finalEnv = {
+export default (command: string, env: NodeJS.ProcessEnv = {}): PromiseWithAbort => {
+    let childProcess: ChildProcess;
+    const promise: PromiseWithAbort = new Promise<string | void>((resolve, reject) => {
+        const finalEnv: NodeJS.ProcessEnv = {
             ...process.env,
             ...env,
         };
@@ -29,7 +31,7 @@ export default (command, env = {}) => {
                     if (error && error.killed) {
                         resolve();
                     } else {
-                        Logger.error(`failed with error: ${error}`);
+                        Logger.error(`failed with error: ${error.message}`);
                         reject(error);
                     }
                 } else {

From 5bd1c45238f609386f17d19eb56b763e407af2e9 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Tue, 20 Feb 2024 08:31:42 -0800
Subject: [PATCH 200/305] Lint

---
 .../MoneyRequestPreview/MoneyRequestPreviewContent.tsx       | 2 +-
 src/hooks/useViolations.ts                                   | 5 +----
 2 files changed, 2 insertions(+), 5 deletions(-)

diff --git a/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx b/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
index 41726549b285..c1a54257df25 100644
--- a/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
+++ b/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
@@ -85,7 +85,7 @@ function MoneyRequestPreviewContent({
     const requestMerchant = truncate(merchant, {length: CONST.REQUEST_PREVIEW.MAX_LENGTH});
     const hasReceipt = TransactionUtils.hasReceipt(transaction);
     const isScanning = hasReceipt && TransactionUtils.isReceiptBeingScanned(transaction);
-    const hasViolations = TransactionUtils.hasViolation(transaction?.transactionID, transactionViolations);
+    const hasViolations = TransactionUtils.hasViolation(transaction?.transactionID ?? '', transactionViolations);
     const hasFieldErrors = TransactionUtils.hasMissingSmartscanFields(transaction);
     const shouldShowRBR = hasViolations || hasFieldErrors;
     const isDistanceRequest = TransactionUtils.isDistanceRequest(transaction);
diff --git a/src/hooks/useViolations.ts b/src/hooks/useViolations.ts
index e43820281e8a..29b2dcb86718 100644
--- a/src/hooks/useViolations.ts
+++ b/src/hooks/useViolations.ts
@@ -58,10 +58,7 @@ function useViolations(violations: TransactionViolation[]) {
         }
         return violationGroups ?? new Map();
     }, [violations]);
-
-    const getViolationsForField = useCallback((field: ViolationField, data?: TransactionViolation['data']) => {
-        return violationsByField.get(field) ?? [];
-    }, [violationsByField]);
+    const getViolationsForField = useCallback((field: ViolationField) => violationsByField.get(field) ?? [], [violationsByField]);
 
     return {
         getViolationsForField,

From faf6741acf75c39233bc060b53d2a9e2a91571ad Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Tue, 20 Feb 2024 11:01:01 -0800
Subject: [PATCH 201/305] Use stable reference for onPress

---
 src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
index a74a7726d638..dbaf330803c1 100644
--- a/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
+++ b/src/pages/settings/ExitSurvey/ExitSurveyReasonPage.tsx
@@ -85,7 +85,7 @@ function ExitSurveyReasonPage({draftReason}: ExitSurveyReasonPageOnyxProps) {
                             inputID={INPUT_IDS.REASON}
                             value={reason as string}
                             items={reasons}
-                            onPress={(value) => setReason(value as ExitReason)}
+                            onPress={setReason as (value: string) => void}
                             shouldSaveDraft
                         />
                     </>

From a5fb310bf29feddc7de43722e4b14cee9af6470e Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Tue, 20 Feb 2024 11:01:23 -0800
Subject: [PATCH 202/305] Delete gremlin file

---
 src/types/onyx/Form.ts | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 delete mode 100644 src/types/onyx/Form.ts

diff --git a/src/types/onyx/Form.ts b/src/types/onyx/Form.ts
deleted file mode 100644
index e69de29bb2d1..000000000000

From 947feb9678158e368fdee64a319ab0776f3d5d17 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Tue, 20 Feb 2024 11:09:05 -0800
Subject: [PATCH 203/305] Lint 2

---
 src/components/ReportActionItem/MoneyRequestView.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index d3c86698f910..9fb28384c5eb 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -143,7 +143,7 @@ function MoneyRequestView({
 
     const {getViolationsForField} = useViolations(transactionViolations ?? []);
     const hasViolations = useCallback(
-        (field: ViolationField, data?: OnyxTypes.TransactionViolation['data']): boolean => !!canUseViolations && getViolationsForField(field, data).length > 0,
+        (field: ViolationField): boolean => !!canUseViolations && getViolationsForField(field).length > 0,
         [canUseViolations, getViolationsForField],
     );
 
@@ -226,7 +226,7 @@ function MoneyRequestView({
 
             // Return violations if there are any
             if (canUseViolations && hasViolations(field, data)) {
-                const violations = getViolationsForField(field, data);
+                const violations = getViolationsForField(field);
                 return ViolationsUtils.getViolationTranslation(violations[0], translate);
             }
 

From ff80f9c758cc69d1747d8496b60f213644023ed8 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Tue, 20 Feb 2024 11:30:18 -0800
Subject: [PATCH 204/305] Lint 3

---
 src/components/ReportActionItem/MoneyRequestView.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index 9fb28384c5eb..8167ce127da7 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -225,7 +225,7 @@ function MoneyRequestView({
             }
 
             // Return violations if there are any
-            if (canUseViolations && hasViolations(field, data)) {
+            if (canUseViolations && hasViolations(field)) {
                 const violations = getViolationsForField(field);
                 return ViolationsUtils.getViolationTranslation(violations[0], translate);
             }

From f4b38fbe3f5f995cad6f5ef4f9fa4cc9043bbde4 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Tue, 20 Feb 2024 11:43:52 -0800
Subject: [PATCH 205/305] Lint 4

---
 src/components/ReportActionItem/MoneyRequestView.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index 8167ce127da7..b9a3fef8e1e9 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -199,7 +199,7 @@ function MoneyRequestView({
     const getPendingFieldAction = (fieldPath: TransactionPendingFieldsKey) => transaction?.pendingFields?.[fieldPath] ?? pendingAction;
 
     const getErrorForField = useCallback(
-        (field: ViolationField, data?: OnyxTypes.TransactionViolation['data']) => {
+        (field: ViolationField) => {
             // Checks applied when creating a new money request
             // NOTE: receipt field can return multiple violations, so we need to handle it separately
             const fieldChecks: Partial<Record<ViolationField, {isError: boolean; translationPath: TranslationPaths}>> = {

From e71da03fc1f0f61374d2947f8fa14dd2eaf7288e Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Tue, 20 Feb 2024 11:47:33 -0800
Subject: [PATCH 206/305] Lint

---
 src/components/ReportActionItem/MoneyRequestView.tsx | 10 ++--------
 1 file changed, 2 insertions(+), 8 deletions(-)

diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index b9a3fef8e1e9..9e12ae01bb98 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -389,15 +389,9 @@ function MoneyRequestView({
                                     )
                                 }
                                 brickRoadIndicator={
-                                    getErrorForField('tag', {
-                                        tagName: name,
-                                    })
-                                        ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR
-                                        : undefined
+                                    getErrorForField('tag') ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined
                                 }
-                                error={getErrorForField('tag', {
-                                    tagName: name,
-                                })}
+                                error={getErrorForField('tag')}
                             />
                         </OfflineWithFeedback>
                     ))}

From cd56779d2c0102bb4e46c45e63147337a474ab1d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kacper=20Miko=C5=82ajczak?= <kacpermikolajczak10@gmail.com>
Date: Tue, 20 Feb 2024 20:49:53 +0100
Subject: [PATCH 207/305] replace all localeCompare occurrences with custom one

---
 src/libs/GroupChatUtils.ts                  | 3 ++-
 src/libs/KeyboardShortcut/index.ts          | 3 ++-
 src/libs/OptionsListUtils.ts                | 5 +++--
 src/libs/ReportUtils.ts                     | 5 +++--
 src/pages/ReportParticipantsPage.tsx        | 3 ++-
 src/pages/RoomMembersPage.tsx               | 3 ++-
 src/pages/workspace/WorkspaceNewRoomPage.js | 3 ++-
 src/pages/workspace/WorkspacesListPage.tsx  | 3 ++-
 8 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/src/libs/GroupChatUtils.ts b/src/libs/GroupChatUtils.ts
index 5d925ae1c684..58a82de3df53 100644
--- a/src/libs/GroupChatUtils.ts
+++ b/src/libs/GroupChatUtils.ts
@@ -1,5 +1,6 @@
 import type {OnyxEntry} from 'react-native-onyx';
 import type {Report} from '@src/types/onyx';
+import localeCompare from './LocaleCompare';
 import * as ReportUtils from './ReportUtils';
 
 /**
@@ -11,7 +12,7 @@ function getGroupChatName(report: OnyxEntry<Report>): string | undefined {
 
     return participants
         .map((participant) => ReportUtils.getDisplayNameForParticipant(participant, isMultipleParticipantReport))
-        .sort((first, second) => first?.localeCompare(second ?? '') ?? 0)
+        .sort((first, second) => localeCompare(first ?? '', second ?? ''))
         .filter(Boolean)
         .join(', ');
 }
diff --git a/src/libs/KeyboardShortcut/index.ts b/src/libs/KeyboardShortcut/index.ts
index 44ba54953c40..0571f5e271ab 100644
--- a/src/libs/KeyboardShortcut/index.ts
+++ b/src/libs/KeyboardShortcut/index.ts
@@ -1,6 +1,7 @@
 import Str from 'expensify-common/lib/str';
 import * as KeyCommand from 'react-native-key-command';
 import getOperatingSystem from '@libs/getOperatingSystem';
+import localeCompare from '@libs/LocaleCompare';
 import CONST from '@src/CONST';
 import bindHandlerToKeydownEvent from './bindHandlerToKeydownEvent';
 
@@ -32,7 +33,7 @@ type Shortcut = {
 const documentedShortcuts: Record<string, Shortcut> = {};
 
 function getDocumentedShortcuts(): Shortcut[] {
-    return Object.values(documentedShortcuts).sort((a, b) => a.displayName.localeCompare(b.displayName));
+    return Object.values(documentedShortcuts).sort((a, b) => localeCompare(a.displayName, b.displayName));
 }
 
 const keyInputEnter = KeyCommand?.constants?.keyInputEnter?.toString() ?? 'keyInputEnter';
diff --git a/src/libs/OptionsListUtils.ts b/src/libs/OptionsListUtils.ts
index 80081061f340..bacdf9571f55 100644
--- a/src/libs/OptionsListUtils.ts
+++ b/src/libs/OptionsListUtils.ts
@@ -34,6 +34,7 @@ import times from '@src/utils/times';
 import Timing from './actions/Timing';
 import * as CollectionUtils from './CollectionUtils';
 import * as ErrorUtils from './ErrorUtils';
+import localeCompare from './LocaleCompare';
 import * as LocalePhoneNumber from './LocalePhoneNumber';
 import * as Localize from './Localize';
 import * as LoginUtils from './LoginUtils';
@@ -871,9 +872,9 @@ function sortTags(tags: Record<string, Tag> | Tag[]) {
     let sortedTags;
 
     if (Array.isArray(tags)) {
-        sortedTags = tags.sort((a, b) => a.name.localeCompare(b.name));
+        sortedTags = tags.sort((a, b) => localeCompare(a.name, b.name));
     } else {
-        sortedTags = Object.values(tags).sort((a, b) => a.name.localeCompare(b.name));
+        sortedTags = Object.values(tags).sort((a, b) => localeCompare(a.name, b.name));
     }
 
     return sortedTags;
diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index 6abdd4348488..1249a75e9e58 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -52,6 +52,7 @@ import * as CollectionUtils from './CollectionUtils';
 import * as CurrencyUtils from './CurrencyUtils';
 import DateUtils from './DateUtils';
 import isReportMessageAttachment from './isReportMessageAttachment';
+import localeCompare from './LocaleCompare';
 import * as LocalePhoneNumber from './LocalePhoneNumber';
 import * as Localize from './Localize';
 import linkingConfig from './Navigation/linkingConfig';
@@ -1442,7 +1443,7 @@ function getIconsForParticipants(participants: number[], personalDetails: OnyxCo
 
     const sortedParticipantDetails = participantDetails.sort((first, second) => {
         // First sort by displayName/login
-        const displayNameLoginOrder = first[1].localeCompare(second[1]);
+        const displayNameLoginOrder = localeCompare(first[1], second[1]);
         if (displayNameLoginOrder !== 0) {
             return displayNameLoginOrder;
         }
@@ -1700,7 +1701,7 @@ function getDisplayNamesWithTooltips(
         })
         .sort((first, second) => {
             // First sort by displayName/login
-            const displayNameLoginOrder = first.displayName.localeCompare(second.displayName);
+            const displayNameLoginOrder = localeCompare(first.displayName, second.displayName);
             if (displayNameLoginOrder !== 0) {
                 return displayNameLoginOrder;
             }
diff --git a/src/pages/ReportParticipantsPage.tsx b/src/pages/ReportParticipantsPage.tsx
index b560ce672ae4..3f24e220498d 100755
--- a/src/pages/ReportParticipantsPage.tsx
+++ b/src/pages/ReportParticipantsPage.tsx
@@ -8,6 +8,7 @@ import OptionsList from '@components/OptionsList';
 import ScreenWrapper from '@components/ScreenWrapper';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
+import localeCompare from '@libs/LocaleCompare';
 import * as LocalePhoneNumber from '@libs/LocalePhoneNumber';
 import type * as Localize from '@libs/Localize';
 import Navigation from '@libs/Navigation/Navigation';
@@ -69,7 +70,7 @@ const getAllParticipants = (
                 reportID: report?.reportID ?? '',
             };
         })
-        .sort((a, b) => a.displayName.localeCompare(b.displayName.toLowerCase()));
+        .sort((a, b) => localeCompare(a.displayName, b.displayName));
 
 function ReportParticipantsPage({report, personalDetails}: ReportParticipantsPageProps) {
     const {translate} = useLocalize();
diff --git a/src/pages/RoomMembersPage.tsx b/src/pages/RoomMembersPage.tsx
index 7d0833379c8d..4e990b8bfdec 100644
--- a/src/pages/RoomMembersPage.tsx
+++ b/src/pages/RoomMembersPage.tsx
@@ -16,6 +16,7 @@ import withCurrentUserPersonalDetails from '@components/withCurrentUserPersonalD
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import * as DeviceCapabilities from '@libs/DeviceCapabilities';
+import localeCompare from '@libs/LocaleCompare';
 import Log from '@libs/Log';
 import Navigation from '@libs/Navigation/Navigation';
 import type {RoomMembersNavigatorParamList} from '@libs/Navigation/types';
@@ -200,7 +201,7 @@ function RoomMembersPage({report, session, policies}: RoomMembersPageProps) {
             });
         });
 
-        result = result.sort((value1, value2) => value1.text.localeCompare(value2.text.toLowerCase()));
+        result = result.sort((value1, value2) => localeCompare(value1.text, value2.text));
 
         return result;
     };
diff --git a/src/pages/workspace/WorkspaceNewRoomPage.js b/src/pages/workspace/WorkspaceNewRoomPage.js
index 36f874e8919d..e56d9d9a76fc 100644
--- a/src/pages/workspace/WorkspaceNewRoomPage.js
+++ b/src/pages/workspace/WorkspaceNewRoomPage.js
@@ -23,6 +23,7 @@ import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import compose from '@libs/compose';
 import * as ErrorUtils from '@libs/ErrorUtils';
+import localeCompare from '@libs/LocaleCompare';
 import {translatableTextPropTypes} from '@libs/Localize';
 import Navigation from '@libs/Navigation/Navigation';
 import * as PolicyUtils from '@libs/PolicyUtils';
@@ -114,7 +115,7 @@ function WorkspaceNewRoomPage(props) {
                     label: policy.name,
                     value: policy.id,
                 }),
-            ).sort((a, b) => a.label.toLowerCase().localeCompare(b.label.toLowerCase())),
+            ).sort((a, b) => localeCompare(a.label, b.label)),
         [props.policies],
     );
     const [policyID, setPolicyID] = useState(() => {
diff --git a/src/pages/workspace/WorkspacesListPage.tsx b/src/pages/workspace/WorkspacesListPage.tsx
index 88ea1bf1ec54..d1edf7f2f783 100755
--- a/src/pages/workspace/WorkspacesListPage.tsx
+++ b/src/pages/workspace/WorkspacesListPage.tsx
@@ -23,6 +23,7 @@ import useNetwork from '@hooks/useNetwork';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
+import localeCompare from '@libs/LocaleCompare';
 import Navigation from '@libs/Navigation/Navigation';
 import * as PolicyUtils from '@libs/PolicyUtils';
 import * as ReportUtils from '@libs/ReportUtils';
@@ -308,7 +309,7 @@ function WorkspacesListPage({policies, allPolicyMembers, reimbursementAccount, r
                     type: policy.type,
                 }),
             )
-            .sort((a, b) => a.title.toLowerCase().localeCompare(b.title.toLowerCase()));
+            .sort((a, b) => localeCompare(a.title, b.title));
     }, [reimbursementAccount?.errors, policies, isOffline, theme.textLight, allPolicyMembers, policyRooms]);
 
     if (isEmptyObject(workspaces)) {

From dd95657d17cbbabc0f086f70816a6100958d5f1a Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Tue, 20 Feb 2024 11:52:48 -0800
Subject: [PATCH 208/305] Prettier

---
 src/components/ReportActionItem/MoneyRequestView.tsx | 9 ++-------
 1 file changed, 2 insertions(+), 7 deletions(-)

diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index 9e12ae01bb98..dc1cbfeb1b8e 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -142,10 +142,7 @@ function MoneyRequestView({
     const shouldShowBillable = isPolicyExpenseChat && (!!transactionBillable || !(policy?.disabledFields?.defaultBillable ?? true));
 
     const {getViolationsForField} = useViolations(transactionViolations ?? []);
-    const hasViolations = useCallback(
-        (field: ViolationField): boolean => !!canUseViolations && getViolationsForField(field).length > 0,
-        [canUseViolations, getViolationsForField],
-    );
+    const hasViolations = useCallback((field: ViolationField): boolean => !!canUseViolations && getViolationsForField(field).length > 0, [canUseViolations, getViolationsForField]);
 
     let amountDescription = `${translate('iou.amount')}`;
 
@@ -388,9 +385,7 @@ function MoneyRequestView({
                                         ROUTES.MONEY_REQUEST_STEP_TAG.getRoute(CONST.IOU.ACTION.EDIT, CONST.IOU.TYPE.REQUEST, index, transaction?.transactionID ?? '', report.reportID),
                                     )
                                 }
-                                brickRoadIndicator={
-                                    getErrorForField('tag') ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined
-                                }
+                                brickRoadIndicator={getErrorForField('tag') ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
                                 error={getErrorForField('tag')}
                             />
                         </OfflineWithFeedback>

From a99ff4cd44929c8b95e64c758bb72bad51c4573e Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Tue, 20 Feb 2024 11:59:02 -0800
Subject: [PATCH 209/305] Remove userMessage from tests

---
 tests/unit/ViolationUtilsTest.js | 24 ++++++++++--------------
 1 file changed, 10 insertions(+), 14 deletions(-)

diff --git a/tests/unit/ViolationUtilsTest.js b/tests/unit/ViolationUtilsTest.js
index 4f03fe0a42fa..bc9207fb8021 100644
--- a/tests/unit/ViolationUtilsTest.js
+++ b/tests/unit/ViolationUtilsTest.js
@@ -6,25 +6,21 @@ import ONYXKEYS from '@src/ONYXKEYS';
 const categoryOutOfPolicyViolation = {
     name: 'categoryOutOfPolicy',
     type: 'violation',
-    userMessage: '',
 };
 
 const missingCategoryViolation = {
     name: 'missingCategory',
     type: 'violation',
-    userMessage: '',
 };
 
 const tagOutOfPolicyViolation = {
     name: 'tagOutOfPolicy',
     type: 'violation',
-    userMessage: '',
 };
 
 const missingTagViolation = {
     name: 'missingTag',
     type: 'violation',
-    userMessage: '',
 };
 
 describe('getViolationsOnyxData', () => {
@@ -56,8 +52,8 @@ describe('getViolationsOnyxData', () => {
 
     it('should handle multiple violations', () => {
         transactionViolations = [
-            {name: 'duplicatedTransaction', type: 'violation', userMessage: ''},
-            {name: 'receiptRequired', type: 'violation', userMessage: ''},
+            {name: 'duplicatedTransaction', type: 'violation'},
+            {name: 'receiptRequired', type: 'violation'},
         ];
         const result = ViolationsUtils.getViolationsOnyxData(transaction, transactionViolations, policyRequiresTags, policyTags, policyRequiresCategories, policyCategories);
         expect(result.value).toEqual(expect.arrayContaining(transactionViolations));
@@ -90,8 +86,8 @@ describe('getViolationsOnyxData', () => {
         it('should add categoryOutOfPolicy violation to existing violations if they exist', () => {
             transaction.category = 'Bananas';
             transactionViolations = [
-                {name: 'duplicatedTransaction', type: 'violation', userMessage: ''},
-                {name: 'receiptRequired', type: 'violation', userMessage: ''},
+                {name: 'duplicatedTransaction', type: 'violation'},
+                {name: 'receiptRequired', type: 'violation'},
             ];
 
             const result = ViolationsUtils.getViolationsOnyxData(transaction, transactionViolations, policyRequiresTags, policyTags, policyRequiresCategories, policyCategories);
@@ -102,8 +98,8 @@ describe('getViolationsOnyxData', () => {
         it('should add missingCategory violation to existing violations if they exist', () => {
             transaction.category = undefined;
             transactionViolations = [
-                {name: 'duplicatedTransaction', type: 'violation', userMessage: ''},
-                {name: 'receiptRequired', type: 'violation', userMessage: ''},
+                {name: 'duplicatedTransaction', type: 'violation'},
+                {name: 'receiptRequired', type: 'violation'},
             ];
 
             const result = ViolationsUtils.getViolationsOnyxData(transaction, transactionViolations, policyRequiresTags, policyTags, policyRequiresCategories, policyCategories);
@@ -171,8 +167,8 @@ describe('getViolationsOnyxData', () => {
         it('should add tagOutOfPolicy violation to existing violations if transaction has tag that is not in the policy', () => {
             transaction.tag = 'Bananas';
             transactionViolations = [
-                {name: 'duplicatedTransaction', type: 'violation', userMessage: ''},
-                {name: 'receiptRequired', type: 'violation', userMessage: ''},
+                {name: 'duplicatedTransaction', type: 'violation'},
+                {name: 'receiptRequired', type: 'violation'},
             ];
 
             const result = ViolationsUtils.getViolationsOnyxData(transaction, transactionViolations, policyRequiresTags, policyTags, policyRequiresCategories, policyCategories);
@@ -183,8 +179,8 @@ describe('getViolationsOnyxData', () => {
         it('should add missingTag violation to existing violations if transaction does not have a tag', () => {
             transaction.tag = undefined;
             transactionViolations = [
-                {name: 'duplicatedTransaction', type: 'violation', userMessage: ''},
-                {name: 'receiptRequired', type: 'violation', userMessage: ''},
+                {name: 'duplicatedTransaction', type: 'violation'},
+                {name: 'receiptRequired', type: 'violation'},
             ];
 
             const result = ViolationsUtils.getViolationsOnyxData(transaction, transactionViolations, policyRequiresTags, policyTags, policyRequiresCategories, policyCategories);

From 653926213bda56de620713e99a33a16b72d54730 Mon Sep 17 00:00:00 2001
From: adriancova <adriancova.95@gmail.com>
Date: Tue, 20 Feb 2024 14:57:43 -0600
Subject: [PATCH 210/305] Remove TRANSACTION_DRAFT merge to null from
 successData and failureData

---
 src/libs/actions/IOU.ts | 10 ----------
 1 file changed, 10 deletions(-)

diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts
index 47d10ddcef4b..3888e63bcd18 100644
--- a/src/libs/actions/IOU.ts
+++ b/src/libs/actions/IOU.ts
@@ -1621,11 +1621,6 @@ function createSplitsAndOnyxData(
             key: `${ONYXKEYS.COLLECTION.TRANSACTION}${splitTransaction.transactionID}`,
             value: {pendingAction: null},
         },
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${CONST.IOU.OPTIMISTIC_TRANSACTION_ID}`,
-            value: null,
-        },
     ];
 
     if (!existingSplitChatReport) {
@@ -1644,11 +1639,6 @@ function createSplitsAndOnyxData(
                 errors: ErrorUtils.getMicroSecondOnyxError('iou.error.genericCreateFailureMessage'),
             },
         },
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${CONST.IOU.OPTIMISTIC_TRANSACTION_ID}`,
-            value: null,
-        },
     ];
 
     if (existingSplitChatReport) {

From 1cab9fdf6b4e140d83bc5d1d3e4e7422e282baca Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Wed, 21 Feb 2024 11:25:23 +0700
Subject: [PATCH 211/305] fix: disabled tag is not displayed in the list as
 selected

---
 src/libs/OptionsListUtils.ts | 13 +++++--------
 1 file changed, 5 insertions(+), 8 deletions(-)

diff --git a/src/libs/OptionsListUtils.ts b/src/libs/OptionsListUtils.ts
index 80081061f340..f0e89f8e8d72 100644
--- a/src/libs/OptionsListUtils.ts
+++ b/src/libs/OptionsListUtils.ts
@@ -1061,7 +1061,7 @@ function getTagsOptions(tags: Category[]): Option[] {
 function getTagListSections(tags: Tag[], recentlyUsedTags: string[], selectedOptions: Category[], searchInputValue: string, maxRecentReportsToShow: number) {
     const tagSections = [];
     const sortedTags = sortTags(tags);
-    const enabledTags = sortedTags.filter((tag) => tag.enabled);
+    const enabledTags = [...selectedOptions, ...sortedTags.filter((tag) => tag.enabled)];
     const numberOfTags = enabledTags.length;
     let indexOffset = 0;
 
@@ -1119,13 +1119,10 @@ function getTagListSections(tags: Tag[], recentlyUsedTags: string[], selectedOpt
     const filteredTags = enabledTags.filter((tag) => !selectedOptionNames.includes(tag.name));
 
     if (selectedOptions.length) {
-        const selectedTagOptions = selectedOptions.map((option) => {
-            const tagObject = tags.find((tag) => tag.name === option.name);
-            return {
-                name: option.name,
-                enabled: !!tagObject?.enabled,
-            };
-        });
+        const selectedTagOptions = selectedOptions.map((option) => ({
+            name: option.name,
+            enabled: true,
+        }));
 
         tagSections.push({
             // "Selected" section

From cb3206f58f54783a6661af5a0844d882399a87a5 Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Wed, 21 Feb 2024 12:00:41 +0700
Subject: [PATCH 212/305] filter enabled tag

---
 src/libs/OptionsListUtils.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/libs/OptionsListUtils.ts b/src/libs/OptionsListUtils.ts
index f0e89f8e8d72..eafda5ee1ce7 100644
--- a/src/libs/OptionsListUtils.ts
+++ b/src/libs/OptionsListUtils.ts
@@ -1061,7 +1061,8 @@ function getTagsOptions(tags: Category[]): Option[] {
 function getTagListSections(tags: Tag[], recentlyUsedTags: string[], selectedOptions: Category[], searchInputValue: string, maxRecentReportsToShow: number) {
     const tagSections = [];
     const sortedTags = sortTags(tags);
-    const enabledTags = [...selectedOptions, ...sortedTags.filter((tag) => tag.enabled)];
+    const selectedOptionNames = selectedOptions.map((selectedOption) => selectedOption.name);
+    const enabledTags = [...selectedOptions, ...sortedTags.filter((tag) => tag.enabled && !selectedOptionNames.includes(tag.name))];
     const numberOfTags = enabledTags.length;
     let indexOffset = 0;
 
@@ -1109,7 +1110,6 @@ function getTagListSections(tags: Tag[], recentlyUsedTags: string[], selectedOpt
         return tagSections;
     }
 
-    const selectedOptionNames = selectedOptions.map((selectedOption) => selectedOption.name);
     const filteredRecentlyUsedTags = recentlyUsedTags
         .filter((recentlyUsedTag) => {
             const tagObject = tags.find((tag) => tag.name === recentlyUsedTag);

From b09c0ea806a843f6984ebd3e8d4d22049d30d26f Mon Sep 17 00:00:00 2001
From: Pavlo Tsimura <paultsimura@gmail.com>
Date: Wed, 21 Feb 2024 12:10:30 +0100
Subject: [PATCH 213/305] IOU: use cleared pending fields

---
 src/libs/actions/IOU.ts | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts
index 47d10ddcef4b..d82f030774b7 100644
--- a/src/libs/actions/IOU.ts
+++ b/src/libs/actions/IOU.ts
@@ -400,6 +400,7 @@ function buildOnyxDataForMoneyRequest(
 ): [OnyxUpdate[], OnyxUpdate[], OnyxUpdate[]] {
     const isScanRequest = TransactionUtils.isScanRequest(transaction);
     const outstandingChildRequest = getOutstandingChildRequest(needsToBeManuallySubmitted, policy);
+    const clearedPendingFields = Object.fromEntries(Object.keys(transaction.pendingFields ?? {}).map((key) => [key, null]));
     const optimisticData: OnyxUpdate[] = [];
 
     if (chatReport) {
@@ -536,7 +537,7 @@ function buildOnyxDataForMoneyRequest(
             key: `${ONYXKEYS.COLLECTION.TRANSACTION}${transaction.transactionID}`,
             value: {
                 pendingAction: null,
-                pendingFields: null,
+                pendingFields: clearedPendingFields,
             },
         },
 
@@ -611,7 +612,7 @@ function buildOnyxDataForMoneyRequest(
             value: {
                 errors: ErrorUtils.getMicroSecondOnyxError('iou.error.genericCreateFailureMessage'),
                 pendingAction: null,
-                pendingFields: null,
+                pendingFields: clearedPendingFields,
             },
         },
 

From f4377195834c8a9d2ea8cd2242b695078642733e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 21 Feb 2024 14:05:57 +0100
Subject: [PATCH 214/305] fix subtitle display

---
 src/styles/utils/index.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index aaa3ce0f44ba..405b463cf1df 100644
--- a/src/styles/utils/index.ts
+++ b/src/styles/utils/index.ts
@@ -1522,6 +1522,7 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
                     fontSize: 13,
                     color: defaultTheme.textSupporting,
                     marginTop: 3,
+                    marginRight: 10,
                 };
             case 'subMenuContainer':
                 return {

From 7648bfef8b995da9b8f1d1b0f29a0bb0ffd29502 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 21 Feb 2024 15:22:37 +0100
Subject: [PATCH 215/305] increase icon size

---
 .../simple-illustrations/simple-illustration__wallet-alt.svg    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg b/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg
index 54b56e8d4e17..502a216f82e6 100644
--- a/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg
+++ b/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="60" height="70" viewBox="0 0 30 44" fill="none"><path d="M26.7969 22.8477H2.94542C1.80808 22.8477 0.886078 23.7697 0.886078 24.907V40.482C0.886078 41.6193 1.80808 42.5413 2.94542 42.5413H26.7969C27.9342 42.5413 28.8562 41.6193 28.8562 40.482V24.907C28.8562 23.7697 27.9342 22.8477 26.7969 22.8477Z" fill="#D18000"/><path d="M5.4714 26.359V22.7461H2.63247C2.63247 22.7461 0.886078 23.3832 0.886078 24.5959V26.4373L5.4686 26.359H5.4714Z" fill="#780505"/><path d="M24.5616 22.5848V26.5135H28.725V24.5911C28.725 24.5911 28.3255 22.8447 27.11 22.8447C25.8945 22.8447 24.5616 22.582 24.5616 22.582V22.5848Z" fill="#780505"/><path d="M24.7183 0.824219H5.15598V26.5143H24.7183V0.824219Z" fill="#00B268"/><path d="M26.0845 32.7557V29.8078C26.0845 29.8078 26.1684 28.4609 24.9473 28.4609H6.79042C6.79042 28.4609 5.65317 28.4609 5.65317 29.5563V32.6746L26.0845 32.7585V32.7557Z" fill="#FCDCFF"/><path d="M6.15912 28.6251H4.39038C4.39038 28.6251 3.67506 28.4155 3.63314 29.7623L3.54932 32.4588L5.65616 32.6683V29.55L6.16191 28.6223L6.15912 28.6251Z" fill="#FBCCFF"/><path d="M12.0715 30.1836H8.30768V32.5419H12.0715V30.1836Z" fill="#F9B5FE"/><path d="M5.49982 32.4874V29.6932C5.49982 29.003 6.05866 28.4414 6.75163 28.4414H24.861C25.5512 28.4414 26.1128 29.0003 26.1128 29.6932V32.6551" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.13742 32.429V30.2383H12.013V32.4848" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 30.4609H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M20.1024 30.4609H23.9779" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 31.5898H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M3.58807 32.4874V29.6932C3.58807 29.003 4.14692 28.4414 4.83989 28.4414H8.92504" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8744 23.4105C17.2988 23.4105 19.2641 20.4181 19.2641 16.7267C19.2641 13.0354 17.2988 10.043 14.8744 10.043C12.45 10.043 10.4847 13.0354 10.4847 16.7267C10.4847 20.4181 12.45 23.4105 14.8744 23.4105Z" fill="#5BE3AA"/><path d="M8.40536 5.57031C9.15073 5.57031 9.75497 4.96607 9.75497 4.2207C9.75497 3.47533 9.15073 2.87109 8.40536 2.87109C7.66 2.87109 7.05576 3.47533 7.05576 4.2207C7.05576 4.96607 7.66 5.57031 8.40536 5.57031Z" fill="#5BE3AA"/><path d="M21.5131 5.58984C22.2585 5.58984 22.8627 4.9856 22.8627 4.24023C22.8627 3.49487 22.2585 2.89062 21.5131 2.89062C20.7677 2.89062 20.1635 3.49487 20.1635 4.24023C20.1635 4.9856 20.7677 5.58984 21.5131 5.58984Z" fill="#5BE3AA"/><path d="M5.21713 26.3569V1.10547H24.5727V26.2255" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8966 23.6281C17.3425 23.6281 19.3254 20.5581 19.3254 16.7711C19.3254 12.9841 17.3425 9.91406 14.8966 9.91406C12.4506 9.91406 10.4677 12.9841 10.4677 16.7711C10.4677 20.5581 12.4506 23.6281 14.8966 23.6281Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.5134 5.79131C22.3683 5.79131 23.0614 5.09825 23.0614 4.24331C23.0614 3.38838 22.3683 2.69531 21.5134 2.69531C20.6585 2.69531 19.9654 3.38838 19.9654 4.24331C19.9654 5.09825 20.6585 5.79131 21.5134 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.41381 5.79131C9.26875 5.79131 9.96181 5.09825 9.96181 4.24331C9.96181 3.38838 9.26875 2.69531 8.41381 2.69531C7.55888 2.69531 6.86581 3.38838 6.86581 4.24331C6.86581 5.09825 7.55888 5.79131 8.41381 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.23514 26.3568V7.32812" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.6474 7.32812V26.4155" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6552 3.98828H18.2496" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.2468 4.21875C18.2468 5.93999 19.6439 7.3371 21.3652 7.3371C21.4294 7.3371 21.4965 7.3371 21.5608 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6582 4.21875C11.6582 5.93999 10.2611 7.3371 8.53983 7.3371C8.47557 7.3371 8.40851 7.3371 8.34424 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M24.7713 22.6406H26.5988C27.845 22.6406 28.8565 23.6521 28.8565 24.8984V40.4957C28.8565 41.7419 27.845 42.7534 26.5988 42.7534H3.04066C1.79444 42.7534 0.782928 41.7419 0.782928 40.4957V24.8984C0.782928 23.6521 1.79444 22.6406 3.04066 22.6406H5.02456" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 26.4102H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 33.0078H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" width="100" height="110" viewBox="0 0 30 44" fill="none"><path d="M26.7969 22.8477H2.94542C1.80808 22.8477 0.886078 23.7697 0.886078 24.907V40.482C0.886078 41.6193 1.80808 42.5413 2.94542 42.5413H26.7969C27.9342 42.5413 28.8562 41.6193 28.8562 40.482V24.907C28.8562 23.7697 27.9342 22.8477 26.7969 22.8477Z" fill="#D18000"/><path d="M5.4714 26.359V22.7461H2.63247C2.63247 22.7461 0.886078 23.3832 0.886078 24.5959V26.4373L5.4686 26.359H5.4714Z" fill="#780505"/><path d="M24.5616 22.5848V26.5135H28.725V24.5911C28.725 24.5911 28.3255 22.8447 27.11 22.8447C25.8945 22.8447 24.5616 22.582 24.5616 22.582V22.5848Z" fill="#780505"/><path d="M24.7183 0.824219H5.15598V26.5143H24.7183V0.824219Z" fill="#00B268"/><path d="M26.0845 32.7557V29.8078C26.0845 29.8078 26.1684 28.4609 24.9473 28.4609H6.79042C6.79042 28.4609 5.65317 28.4609 5.65317 29.5563V32.6746L26.0845 32.7585V32.7557Z" fill="#FCDCFF"/><path d="M6.15912 28.6251H4.39038C4.39038 28.6251 3.67506 28.4155 3.63314 29.7623L3.54932 32.4588L5.65616 32.6683V29.55L6.16191 28.6223L6.15912 28.6251Z" fill="#FBCCFF"/><path d="M12.0715 30.1836H8.30768V32.5419H12.0715V30.1836Z" fill="#F9B5FE"/><path d="M5.49982 32.4874V29.6932C5.49982 29.003 6.05866 28.4414 6.75163 28.4414H24.861C25.5512 28.4414 26.1128 29.0003 26.1128 29.6932V32.6551" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.13742 32.429V30.2383H12.013V32.4848" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 30.4609H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M20.1024 30.4609H23.9779" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 31.5898H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M3.58807 32.4874V29.6932C3.58807 29.003 4.14692 28.4414 4.83989 28.4414H8.92504" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8744 23.4105C17.2988 23.4105 19.2641 20.4181 19.2641 16.7267C19.2641 13.0354 17.2988 10.043 14.8744 10.043C12.45 10.043 10.4847 13.0354 10.4847 16.7267C10.4847 20.4181 12.45 23.4105 14.8744 23.4105Z" fill="#5BE3AA"/><path d="M8.40536 5.57031C9.15073 5.57031 9.75497 4.96607 9.75497 4.2207C9.75497 3.47533 9.15073 2.87109 8.40536 2.87109C7.66 2.87109 7.05576 3.47533 7.05576 4.2207C7.05576 4.96607 7.66 5.57031 8.40536 5.57031Z" fill="#5BE3AA"/><path d="M21.5131 5.58984C22.2585 5.58984 22.8627 4.9856 22.8627 4.24023C22.8627 3.49487 22.2585 2.89062 21.5131 2.89062C20.7677 2.89062 20.1635 3.49487 20.1635 4.24023C20.1635 4.9856 20.7677 5.58984 21.5131 5.58984Z" fill="#5BE3AA"/><path d="M5.21713 26.3569V1.10547H24.5727V26.2255" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8966 23.6281C17.3425 23.6281 19.3254 20.5581 19.3254 16.7711C19.3254 12.9841 17.3425 9.91406 14.8966 9.91406C12.4506 9.91406 10.4677 12.9841 10.4677 16.7711C10.4677 20.5581 12.4506 23.6281 14.8966 23.6281Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.5134 5.79131C22.3683 5.79131 23.0614 5.09825 23.0614 4.24331C23.0614 3.38838 22.3683 2.69531 21.5134 2.69531C20.6585 2.69531 19.9654 3.38838 19.9654 4.24331C19.9654 5.09825 20.6585 5.79131 21.5134 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.41381 5.79131C9.26875 5.79131 9.96181 5.09825 9.96181 4.24331C9.96181 3.38838 9.26875 2.69531 8.41381 2.69531C7.55888 2.69531 6.86581 3.38838 6.86581 4.24331C6.86581 5.09825 7.55888 5.79131 8.41381 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.23514 26.3568V7.32812" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.6474 7.32812V26.4155" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6552 3.98828H18.2496" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.2468 4.21875C18.2468 5.93999 19.6439 7.3371 21.3652 7.3371C21.4294 7.3371 21.4965 7.3371 21.5608 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6582 4.21875C11.6582 5.93999 10.2611 7.3371 8.53983 7.3371C8.47557 7.3371 8.40851 7.3371 8.34424 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M24.7713 22.6406H26.5988C27.845 22.6406 28.8565 23.6521 28.8565 24.8984V40.4957C28.8565 41.7419 27.845 42.7534 26.5988 42.7534H3.04066C1.79444 42.7534 0.782928 41.7419 0.782928 40.4957V24.8984C0.782928 23.6521 1.79444 22.6406 3.04066 22.6406H5.02456" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 26.4102H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 33.0078H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/></svg>
\ No newline at end of file

From 3224dcabf2557964276bc3b88beef139804026ce Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 21 Feb 2024 15:22:44 +0100
Subject: [PATCH 216/305] remove dots

---
 assets/images/dot.svg | 3 ---
 1 file changed, 3 deletions(-)
 delete mode 100644 assets/images/dot.svg

diff --git a/assets/images/dot.svg b/assets/images/dot.svg
deleted file mode 100644
index 1146c88a01b8..000000000000
--- a/assets/images/dot.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="4" height="4" viewBox="0 0 4 4" fill="none">
-  <circle cx="2" cy="2" r="2" fill="#1A3D32"/>
-</svg>
\ No newline at end of file

From 195cc803d5216b8d6e42c4fd9e15ef12d716f7b8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 21 Feb 2024 15:23:15 +0100
Subject: [PATCH 217/305] clean up styles

---
 .../workflows/ToggleSettingsOptionRow.tsx     | 69 ++++++++-------
 .../workflows/WorkspaceWorkflowsPage.tsx      | 44 ++++++++--
 src/styles/index.ts                           | 57 ------------
 src/styles/utils/index.ts                     | 86 -------------------
 4 files changed, 75 insertions(+), 181 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index adfb202443cf..215897651123 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -1,15 +1,13 @@
 import React, {useState} from 'react';
 import {View} from 'react-native';
-import type {ViewStyle} from 'react-native';
-import useStyleUtils from '@hooks/useStyleUtils';
 import type {SvgProps} from 'react-native-svg';
 import Icon from '@components/Icon';
 import Switch from '@components/Switch';
 import Text from '@components/Text';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
-import ImageSVG from '@components/ImageSVG';
-import Dot from '@assets/images/dot.svg';
+import { Styles } from '@styles/index';
+import {defaultTheme } from '@styles/theme';
 
 type ToggleSettingOptionRowProps = {
     icon: React.FC<SvgProps>;
@@ -24,7 +22,6 @@ type ToggleSettingOptionRowProps = {
 function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, isEndOptionRow, hasBeenToggled}: ToggleSettingOptionRowProps) {
     const [isEnabled, setIsEnabled] = useState(hasBeenToggled);
     const styles = useThemeStyles();
-    const StyleUtils = useStyleUtils();
 
     const toggleSwitch = () => {
         setIsEnabled(!isEnabled);
@@ -32,39 +29,51 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
     };
     const {isSmallScreenWidth} = useWindowDimensions();
 
-    function VerticalDots({count}: {count: number}) {
-        return (
-            <View style={StyleUtils.getWorkspaceWorkflowsDotStyle(isEnabled, isSmallScreenWidth) as ViewStyle}>
-                {Array.from({length: count}, () => (
-                    <ImageSVG
-                        contentFit="contain"
-                        src={Dot}
-                        height={isSmallScreenWidth ? 4 : 6}
-                        width={isSmallScreenWidth ? 4 : 6}
-                        pointerEvents="none"
-                    />
-                ))}
-            </View>
-        );
-    }
+    // Since these styles are only used in this component we define them here
+    const workflowsStyles = {
+        container: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            justifyContent: 'space-between',
+        },
+        content: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            flex: 1,
+        },
+        icon: {
+            marginRight: 12,
+            zIndex: 2,
+            paddingBottom: 15,
+        },
+        wrapperText: {
+            flexDirection: 'column',
+            flex: 1,
+        },
+        heading: {
+            fontSize: 15,
+            fontWeight: '700',
+        }, 
+        subtitle: {
+            fontSize: 13,
+            color: defaultTheme.textSupporting,
+            marginTop: 3,
+        },
+    } satisfies Styles;
 
     return (
         <View style={styles.pRelative}>
-            <View style={StyleUtils.getWorkflowsStyle('container')}>
-                <View style={StyleUtils.getWorkflowsStyle('content')}>
+            <View style={workflowsStyles.container}>
+                <View style={workflowsStyles.content}>
                     <Icon
                         src={icon}
                         height={48}
                         width={48}
-                        additionalStyles={StyleUtils.getWorkflowsStyle('icon')}
+                        additionalStyles={workflowsStyles.icon}
                     />
-                    <View style={StyleUtils.getWorkflowsStyle('timelineOverride')} />
-                    {!isEndOptionRow && (
-                        <VerticalDots count={7}/>
-                    )}
-                    <View style={StyleUtils.getWorkflowsStyle('wrapperText')}>
-                        <Text style={StyleUtils.getWorkflowsStyle('heading')}>{title}</Text>
-                        <Text style={StyleUtils.getWorkflowsStyle('subtitle')}>{subtitle}</Text>
+                    <View style={workflowsStyles.wrapperText}>
+                        <Text style={workflowsStyles.heading}>{title}</Text>
+                        <Text style={workflowsStyles.subtitle}>{subtitle}</Text>
                     </View>
                 </View>
                 <View>
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 3ac6dd68e1c2..f6972f0fac1f 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -18,6 +18,9 @@ import type SCREENS from '@src/SCREENS';
 import useStyleUtils from '@hooks/useStyleUtils';
 import ToggleSettingOptionRow from './ToggleSettingsOptionRow';
 import type {ToggleSettingOptionRowProps} from './ToggleSettingsOptionRow';
+import {defaultTheme } from '@styles/theme';
+import spacing from '@styles/utils/spacing';
+import { Styles } from '@styles/index';
 
 type WorkspaceWorkflowsPageProps = WithPolicyProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
 
@@ -27,6 +30,31 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const {isSmallScreenWidth} = useWindowDimensions();
     const StyleUtils = useStyleUtils();
 
+    // Since these styles are only used in this component we define them here
+    const workflowsStyles = {
+        subMenuContainer: {
+            ...spacing.ph8,
+            ...spacing.mhn8,
+            width: 'auto',
+            marginLeft: 44,
+            paddingVertical: 12,
+            paddingRight: 9,
+            paddingLeft: 16,
+            marginRight: 0,
+        },
+        subMenuTitle: {
+            color: defaultTheme.textSupporting,
+            fontSize: 13,
+            lineHeight: 16,
+            fontWeight: '400',
+        },
+        subMenuDescription: {
+            color: defaultTheme.text,
+            fontSize: 15,
+            lineHeight: 20,
+        },
+    } satisfies Styles;
+
     const items: ToggleSettingOptionRowProps[] = useMemo(() => ([
         {
             icon: Illustrations.ReceiptEnvelope,
@@ -38,13 +66,13 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             subMenuItems: (
                 <MenuItem
                     title={translate('workflowsPage.submissionFrequency')}
-                    titleStyle={StyleUtils.getWorkflowsStyle('subMenuTitle')}
-                    descriptionTextStyle={StyleUtils.getWorkflowsStyle('subMenuDescription')}
+                    titleStyle={workflowsStyles.subMenuTitle}
+                    descriptionTextStyle={workflowsStyles.subMenuDescription}
                     // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_AUTOREPORTING_FREQUENCY).getRoute(route.params.policyID))}
                     // TODO will be done in https://github.com/Expensify/Expensify/issues/368332
                     description={translate('workflowsPage.weeklyFrequency')}
                     shouldShowRightIcon
-                    wrapperStyle={StyleUtils.getWorkflowsStyle('subMenuContainer')}
+                    wrapperStyle={workflowsStyles.subMenuContainer}
                     hoverAndPressStyle={[styles.mr0, styles.br2]}
                 />
             ),
@@ -60,13 +88,13 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             subMenuItems: (
                 <MenuItem
                     title={translate('workflowsPage.approver')}
-                    titleStyle={StyleUtils.getWorkflowsStyle('subMenuTitle')}
-                    descriptionTextStyle={StyleUtils.getWorkflowsStyle('subMenuDescription')}
+                    titleStyle={workflowsStyles.subMenuTitle}
+                    descriptionTextStyle={workflowsStyles.subMenuDescription}
                     description={policy?.owner ?? ''}
                     // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
                     // TODO will be done in https://github.com/Expensify/Expensify/issues/368334
                     shouldShowRightIcon
-                    wrapperStyle={StyleUtils.getWorkflowsStyle('subMenuContainer')}
+                    wrapperStyle={workflowsStyles.subMenuContainer}
                     hoverAndPressStyle={[styles.mr0, styles.br2]}
                 />
             ),
@@ -81,12 +109,12 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             },
             subMenuItems: (
                 <MenuItem
-                    descriptionTextStyle={[StyleUtils.getWorkflowsStyle('subMenuDescription'), styles.textSupporting]}
+                    descriptionTextStyle={[workflowsStyles.subMenuDescription, styles.textSupporting]}
                     description={translate('workflowsPage.connectBankAccount')}
                     // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
                     // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
                     shouldShowRightIcon
-                    wrapperStyle={StyleUtils.getWorkflowsStyle('subMenuContainer')}
+                    wrapperStyle={workflowsStyles.subMenuContainer}
                     hoverAndPressStyle={[styles.mr0, styles.br2]}
                 />
             ),
diff --git a/src/styles/index.ts b/src/styles/index.ts
index ab51c657cbfc..30c5657620ad 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4573,63 +4573,6 @@ const styles = (theme: ThemeColors) =>
         updateRequiredViewTextContainer: {
             width: variables.updateTextViewContainerWidth,
         },
-        workspaceWorkflowsIcon: {
-            marginRight: 12,
-            zIndex: 2,
-            paddingBottom: 15,
-        },
-        workspaceWorkflowContent: {
-            flexDirection: 'row',
-            alignItems: 'center',
-            flex: 1,
-        },
-        workspaceWorkflowContainer: {
-            flexDirection: 'row',
-            alignItems: 'center',
-            justifyContent: 'space-between',
-        },
-        workspaceWorkflowsHeading: {
-            fontSize: 15,
-            fontWeight: '700',
-        },
-        workspaceWorkflowsWrapperText: {
-            flexDirection: 'column',
-            flex: 1,
-        },
-        workspaceWorkflowsSubtitle: {
-            fontSize: 13,
-            color: theme.textSupporting,
-            marginTop: 3,
-        },
-        workspaceWorkflowsSubMenuContainer: {
-            ...spacing.ph8,
-            ...spacing.mhn8,
-            width: 'auto',
-            marginLeft: 44,
-            paddingVertical: 12,
-            paddingRight: 9,
-            paddingLeft: 16,
-            marginRight: 0,
-        },
-        workspaceWorkflowsSubMenuTitle: {
-            color: theme.textSupporting,
-            fontSize: 13,
-            lineHeight: 16,
-            fontWeight: '400',
-        },
-        workspaceWorkflowsSubMenuDescription: {
-            color: theme.text,
-            fontSize: 15,
-            lineHeight: 20,
-        },
-        workspaceWorkflowsTimelineOverride: {
-            backgroundColor: theme.cardBG,
-            zIndex: 1,
-            height: 19,
-            width: 19,
-            position: 'absolute',
-            left: 0,
-        },
         workspaceTitleStyle: {
             fontFamily: FontUtils.fontFamily.platform.EXP_NEUE_BOLD,
             fontWeight: '500',
diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index 405b463cf1df..4efe61fddea1 100644
--- a/src/styles/utils/index.ts
+++ b/src/styles/utils/index.ts
@@ -1475,92 +1475,6 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
     },
 
     getFullscreenCenteredContentStyles: () => [StyleSheet.absoluteFill, styles.justifyContentCenter, styles.alignItemsCenter],
-
-    getWorkspaceWorkflowsDotStyle: (enabled: boolean, isSmallScreenWidth: boolean) =>
-    ({
-        position: 'absolute',
-        width: 6,
-        top: isSmallScreenWidth ? '32%' : '12%',
-        bottom: enabled ? '-140%' : '-80%',
-        left: isSmallScreenWidth ? '8%' : '4%',
-        display: 'flex',
-        justifyContent: 'space-between',
-    }),
-
-    getWorkflowsStyle: (type: string): Record<string, string|number> => {
-        switch (type) {
-            case 'icon':
-                return {
-                    marginRight: 12,
-                    zIndex: 2,
-                    paddingBottom: 15,
-                };
-            case 'content':
-                return {
-                    flexDirection: 'row',
-                    alignItems: 'center',
-                    flex: 1,
-                };
-            case 'container':
-                return {
-                    flexDirection: 'row',
-                    alignItems: 'center',
-                    justifyContent: 'space-between',
-                };
-            case 'heading':
-                return {
-                    fontSize: 15,
-                    fontWeight: '700',
-                };
-            case 'wrapperText':
-                return {
-                    flexDirection: 'column',
-                    flex: 1,
-                };
-            case 'subtitle':
-                return {
-                    fontSize: 13,
-                    color: defaultTheme.textSupporting,
-                    marginTop: 3,
-                    marginRight: 10,
-                };
-            case 'subMenuContainer':
-                return {
-                    ...spacing.ph8,
-                    ...spacing.mhn8,
-                    width: 'auto',
-                    marginLeft: 44,
-                    paddingVertical: 12,
-                    paddingRight: 9,
-                    paddingLeft: 16,
-                    marginRight: 0,
-                };
-            case 'subMenuTitle':
-                return {
-                    color: defaultTheme.textSupporting,
-                    fontSize: 13,
-                    lineHeight: 16,
-                    fontWeight: '400',
-                };
-            case 'subMenuDescription':
-                return {
-                    color: defaultTheme.text,
-                    fontSize: 15,
-                    lineHeight: 20,
-                };
-            case 'timelineOverride':
-                return {
-                    backgroundColor: defaultTheme.cardBG,
-                    zIndex: 1,
-                    height: 29,
-                    width: 29,
-                    position: 'absolute',
-                    left: 0,
-                };
-            default:
-                return {};
-        }
-    },
 });
 
 type StyleUtilsType = ReturnType<typeof createStyleUtils>;

From 587772cb0b808266ca86fff0c4ea94694692b7ea Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 21 Feb 2024 15:45:18 +0100
Subject: [PATCH 218/305] handle user theme preference

---
 .../workflows/ToggleSettingsOptionRow.tsx          | 14 +++++++-------
 .../workspace/workflows/WorkspaceWorkflowsPage.tsx | 14 ++++++++++----
 2 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 215897651123..7198c767d229 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -5,9 +5,9 @@ import Icon from '@components/Icon';
 import Switch from '@components/Switch';
 import Text from '@components/Text';
 import useThemeStyles from '@hooks/useThemeStyles';
-import useWindowDimensions from '@hooks/useWindowDimensions';
 import { Styles } from '@styles/index';
 import {defaultTheme } from '@styles/theme';
+import { ThemeColors } from '@styles/theme/types';
 
 type ToggleSettingOptionRowProps = {
     icon: React.FC<SvgProps>;
@@ -17,17 +17,17 @@ type ToggleSettingOptionRowProps = {
     onToggle: (isEnabled: boolean) => void;
     subMenuItems?: React.ReactNode;
     isEndOptionRow?: boolean;
+    theme?: ThemeColors;
 };
 
-function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, isEndOptionRow, hasBeenToggled}: ToggleSettingOptionRowProps) {
+function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, hasBeenToggled, theme}: ToggleSettingOptionRowProps) {
     const [isEnabled, setIsEnabled] = useState(hasBeenToggled);
     const styles = useThemeStyles();
-
+    const ICON_SIZE = 48;
     const toggleSwitch = () => {
         setIsEnabled(!isEnabled);
         onToggle(!isEnabled);
     };
-    const {isSmallScreenWidth} = useWindowDimensions();
 
     // Since these styles are only used in this component we define them here
     const workflowsStyles = {
@@ -56,7 +56,7 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
         }, 
         subtitle: {
             fontSize: 13,
-            color: defaultTheme.textSupporting,
+            color: theme?.textSupporting || defaultTheme.textSupporting,
             marginTop: 3,
         },
     } satisfies Styles;
@@ -67,8 +67,8 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
                 <View style={workflowsStyles.content}>
                     <Icon
                         src={icon}
-                        height={48}
-                        width={48}
+                        height={ICON_SIZE}
+                        width={ICON_SIZE}
                         additionalStyles={workflowsStyles.icon}
                     />
                     <View style={workflowsStyles.wrapperText}>
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index f6972f0fac1f..b782d8c02ed5 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -18,9 +18,11 @@ import type SCREENS from '@src/SCREENS';
 import useStyleUtils from '@hooks/useStyleUtils';
 import ToggleSettingOptionRow from './ToggleSettingsOptionRow';
 import type {ToggleSettingOptionRowProps} from './ToggleSettingsOptionRow';
-import {defaultTheme } from '@styles/theme';
+import darkTheme from '@styles/theme/themes/dark';
+import lightTheme from '@styles/theme/themes/light';
 import spacing from '@styles/utils/spacing';
 import { Styles } from '@styles/index';
+import useThemePreference from '@hooks/useThemePreference';
 
 type WorkspaceWorkflowsPageProps = WithPolicyProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
 
@@ -29,7 +31,9 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const styles = useThemeStyles();
     const {isSmallScreenWidth} = useWindowDimensions();
     const StyleUtils = useStyleUtils();
-
+    const themePreference = useThemePreference();
+    const themeToUse = useMemo(() => themePreference === CONST.THEME.DARK ? darkTheme : lightTheme, [themePreference]);    
+    
     // Since these styles are only used in this component we define them here
     const workflowsStyles = {
         subMenuContainer: {
@@ -41,15 +45,16 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             paddingRight: 9,
             paddingLeft: 16,
             marginRight: 0,
+            marginTop: 14,
         },
         subMenuTitle: {
-            color: defaultTheme.textSupporting,
+            color: themeToUse.textSupporting,
             fontSize: 13,
             lineHeight: 16,
             fontWeight: '400',
         },
         subMenuDescription: {
-            color: defaultTheme.text,
+            color: themeToUse.text,
             fontSize: 15,
             lineHeight: 20,
         },
@@ -133,6 +138,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 subMenuItems={item.subMenuItems}
                 isEndOptionRow={item.isEndOptionRow}
                 hasBeenToggled={item.hasBeenToggled}
+                theme={themeToUse}
             />
         </View>
     );

From 4dfeae8cddda90bfca4492e39f8b86a7938c938f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 21 Feb 2024 15:46:21 +0100
Subject: [PATCH 219/305] help readability

---
 src/styles/index.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/styles/index.ts b/src/styles/index.ts
index 30c5657620ad..0d206be6f27e 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4578,6 +4578,7 @@ const styles = (theme: ThemeColors) =>
             fontWeight: '500',
             fontSize: variables.workspaceProfileName,
         },
+        
     } satisfies Styles);
 
 type ThemeStyles = ReturnType<typeof styles>;

From e95d7753840e2ac757c4b5f36d22d55f6c89d963 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 21 Feb 2024 15:54:26 +0100
Subject: [PATCH 220/305] fix workflows policy actions

---
 src/libs/actions/Policy.ts | 15 ++++++++-------
 1 file changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index 8c8e165cd9ae..931bc4f776ff 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -381,38 +381,39 @@ function buildAnnounceRoomMembersOnyxData(policyID: string, accountIDs: number[]
     return announceRoomMembers;
 }
 
-function setWorkspaceAutoReporting(policyID: string, isEnabled: boolean) {
+function setWorkspaceAutoReporting(policyID: string, enabled: boolean) {
     const optimisticData: OnyxUpdate[] = [
         {
             onyxMethod: Onyx.METHOD.MERGE,
             key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
             value: {
-                autoReporting: true,
+                autoReporting: enabled,
             },
         },
     ];
 
-    const params: SetWorkspaceAutoReportingParams = {policyID, enabled: isEnabled};
+    const params: SetWorkspaceAutoReportingParams = {policyID, enabled};
     API.write(WRITE_COMMANDS.SET_WORKSPACE_AUTO_REPORTING, params, {optimisticData});
 }
 
 function setWorkspaceApprovalMode(policyID: string, approver: string, approvalMode: 'BASIC' | 'OPTIONAL') {
     const isAutoApprovalEnabled = approvalMode === 'BASIC';
 
-    const value = JSON.stringify({
+    const value = {
         approver,
         approvalMode,
         isAutoApprovalEnabled,
-    });
+    };
+
     const optimisticData: OnyxUpdate[] = [
         {
             onyxMethod: Onyx.METHOD.MERGE,
             key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: JSON.parse(value),
+            value: value,
         },
     ];
 
-    const params: SetWorkspaceApprovalModeParams = {policyID, value};
+    const params: SetWorkspaceApprovalModeParams = {policyID, value: JSON.stringify(value)};
     API.write(WRITE_COMMANDS.SET_WORKSPACE_APPROVAL_MODE, params, {optimisticData});
 }
 

From 8e05fbbd67b56898ee9a227570a8b72350c27676 Mon Sep 17 00:00:00 2001
From: Marcin Swornowski <swor71@gmail.com>
Date: Wed, 21 Feb 2024 15:58:25 +0100
Subject: [PATCH 221/305] fix: added check against offline to confirm screens
 in VBBA flow

---
 .../ReimbursementAccount/BankInfo/substeps/Confirmation.tsx   | 4 +++-
 .../BeneficialOwnerDetailsFormSubsteps/ConfirmationUBO.tsx    | 3 +++
 .../BusinessInfo/substeps/ConfirmationBusiness.tsx            | 1 +
 .../CompleteVerification/substeps/ConfirmAgreements.tsx       | 1 +
 .../PersonalInfo/substeps/Confirmation.tsx                    | 3 +++
 5 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/pages/ReimbursementAccount/BankInfo/substeps/Confirmation.tsx b/src/pages/ReimbursementAccount/BankInfo/substeps/Confirmation.tsx
index 4105a5f03f36..b128d6dc75e8 100644
--- a/src/pages/ReimbursementAccount/BankInfo/substeps/Confirmation.tsx
+++ b/src/pages/ReimbursementAccount/BankInfo/substeps/Confirmation.tsx
@@ -7,6 +7,7 @@ import DotIndicatorMessage from '@components/DotIndicatorMessage';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
+import useNetwork from '@hooks/useNetwork';
 import type {SubStepProps} from '@hooks/useSubStep/types';
 import useThemeStyles from '@hooks/useThemeStyles';
 import * as ErrorUtils from '@libs/ErrorUtils';
@@ -33,6 +34,7 @@ const BANK_INFO_STEP_INDEXES = CONST.REIMBURSEMENT_ACCOUNT_SUBSTEP_INDEX.BANK_AC
 function Confirmation({reimbursementAccount, reimbursementAccountDraft, onNext, onMove}: ConfirmationProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
+    const {isOffline} = useNetwork();
 
     const isLoading = reimbursementAccount?.isLoading ?? false;
     const setupType = reimbursementAccount?.achData?.subStep ?? '';
@@ -86,7 +88,7 @@ function Confirmation({reimbursementAccount, reimbursementAccountDraft, onNext,
                 )}
                 <Button
                     isLoading={isLoading}
-                    isDisabled={isLoading}
+                    isDisabled={isLoading || isOffline}
                     success
                     style={[styles.w100]}
                     onPress={onNext}
diff --git a/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/BeneficialOwnerDetailsFormSubsteps/ConfirmationUBO.tsx b/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/BeneficialOwnerDetailsFormSubsteps/ConfirmationUBO.tsx
index 7095957cfbca..2b742ad65699 100644
--- a/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/BeneficialOwnerDetailsFormSubsteps/ConfirmationUBO.tsx
+++ b/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/BeneficialOwnerDetailsFormSubsteps/ConfirmationUBO.tsx
@@ -8,6 +8,7 @@ import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import Text from '@components/Text';
 import TextLink from '@components/TextLink';
 import useLocalize from '@hooks/useLocalize';
+import useNetwork from '@hooks/useNetwork';
 import type {SubStepProps} from '@hooks/useSubStep/types';
 import useThemeStyles from '@hooks/useThemeStyles';
 import * as ErrorUtils from '@libs/ErrorUtils';
@@ -31,6 +32,7 @@ const UBO_STEP_INDEXES = CONST.REIMBURSEMENT_ACCOUNT_SUBSTEP_INDEX.UBO;
 function ConfirmationUBO({reimbursementAccount, reimbursementAccountDraft, onNext, onMove, beneficialOwnerBeingModifiedID}: ConfirmationUBOProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
+    const {isOffline} = useNetwork();
 
     const values = getValuesForBeneficialOwner(beneficialOwnerBeingModifiedID, reimbursementAccountDraft);
     const error = reimbursementAccount ? ErrorUtils.getLatestErrorMessage(reimbursementAccount) : '';
@@ -106,6 +108,7 @@ function ConfirmationUBO({reimbursementAccount, reimbursementAccountDraft, onNex
                     />
                 )}
                 <Button
+                    isDisabled={isOffline}
                     success
                     style={[styles.w100, styles.mt2, styles.pb5]}
                     onPress={onNext}
diff --git a/src/pages/ReimbursementAccount/BusinessInfo/substeps/ConfirmationBusiness.tsx b/src/pages/ReimbursementAccount/BusinessInfo/substeps/ConfirmationBusiness.tsx
index 0be5db5e788a..90362f258f65 100644
--- a/src/pages/ReimbursementAccount/BusinessInfo/substeps/ConfirmationBusiness.tsx
+++ b/src/pages/ReimbursementAccount/BusinessInfo/substeps/ConfirmationBusiness.tsx
@@ -131,6 +131,7 @@ function ConfirmationBusiness({reimbursementAccount, reimbursementAccountDraft,
                 scrollContextEnabled
                 submitButtonText={translate('common.confirm')}
                 style={[styles.mh5, styles.flexGrow1]}
+                enabledWhenOffline={false}
             >
                 <InputWrapper
                     InputComponent={CheckboxWithLabel}
diff --git a/src/pages/ReimbursementAccount/CompleteVerification/substeps/ConfirmAgreements.tsx b/src/pages/ReimbursementAccount/CompleteVerification/substeps/ConfirmAgreements.tsx
index aa554ca87eb2..cb92bb31f30e 100644
--- a/src/pages/ReimbursementAccount/CompleteVerification/substeps/ConfirmAgreements.tsx
+++ b/src/pages/ReimbursementAccount/CompleteVerification/substeps/ConfirmAgreements.tsx
@@ -62,6 +62,7 @@ function ConfirmAgreements({onNext, reimbursementAccount}: ConfirmAgreementsProp
             onSubmit={onNext}
             submitButtonText={translate('common.saveAndContinue')}
             style={[styles.mh5, styles.flexGrow1]}
+            enabledWhenOffline={false}
         >
             <Text style={[styles.textHeadlineLineHeightXXL]}>{translate('completeVerificationStep.confirmAgreements')}</Text>
             <InputWrapper
diff --git a/src/pages/ReimbursementAccount/PersonalInfo/substeps/Confirmation.tsx b/src/pages/ReimbursementAccount/PersonalInfo/substeps/Confirmation.tsx
index 9eae888bdd74..b4272f094071 100644
--- a/src/pages/ReimbursementAccount/PersonalInfo/substeps/Confirmation.tsx
+++ b/src/pages/ReimbursementAccount/PersonalInfo/substeps/Confirmation.tsx
@@ -8,6 +8,7 @@ import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import Text from '@components/Text';
 import TextLink from '@components/TextLink';
 import useLocalize from '@hooks/useLocalize';
+import useNetwork from '@hooks/useNetwork';
 import type {SubStepProps} from '@hooks/useSubStep/types';
 import useThemeStyles from '@hooks/useThemeStyles';
 import * as ErrorUtils from '@libs/ErrorUtils';
@@ -34,6 +35,7 @@ const PERSONAL_INFO_STEP_INDEXES = CONST.REIMBURSEMENT_ACCOUNT_SUBSTEP_INDEX.PER
 function Confirmation({reimbursementAccount, reimbursementAccountDraft, onNext, onMove}: ConfirmationProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
+    const {isOffline} = useNetwork();
 
     const isLoading = reimbursementAccount?.isLoading ?? false;
     const values = useMemo(() => getSubstepValues(PERSONAL_INFO_STEP_KEYS, reimbursementAccountDraft, reimbursementAccount), [reimbursementAccount, reimbursementAccountDraft]);
@@ -112,6 +114,7 @@ function Confirmation({reimbursementAccount, reimbursementAccountDraft, onNext,
                     />
                 )}
                 <Button
+                    isDisabled={isOffline}
                     success
                     isLoading={isLoading}
                     style={[styles.w100]}

From 3ca09f601593269ba3c36272c5884340a1f2d75d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 21 Feb 2024 16:19:37 +0100
Subject: [PATCH 222/305] fix lint

---
 src/libs/actions/Policy.ts                    |  2 +-
 .../workflows/ToggleSettingsOptionRow.tsx     | 13 ++++------
 .../workflows/WorkspaceWorkflowsPage.tsx      | 24 +++++++------------
 src/styles/utils/index.ts                     |  1 -
 4 files changed, 15 insertions(+), 25 deletions(-)

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index 931bc4f776ff..9723851e543f 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -409,7 +409,7 @@ function setWorkspaceApprovalMode(policyID: string, approver: string, approvalMo
         {
             onyxMethod: Onyx.METHOD.MERGE,
             key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: value,
+            value,
         },
     ];
 
diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 7198c767d229..be9177759c9f 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -5,9 +5,8 @@ import Icon from '@components/Icon';
 import Switch from '@components/Switch';
 import Text from '@components/Text';
 import useThemeStyles from '@hooks/useThemeStyles';
-import { Styles } from '@styles/index';
-import {defaultTheme } from '@styles/theme';
-import { ThemeColors } from '@styles/theme/types';
+import type { Styles } from '@styles/index';
+import useTheme from '@hooks/useTheme';
 
 type ToggleSettingOptionRowProps = {
     icon: React.FC<SvgProps>;
@@ -16,13 +15,12 @@ type ToggleSettingOptionRowProps = {
     hasBeenToggled: boolean;
     onToggle: (isEnabled: boolean) => void;
     subMenuItems?: React.ReactNode;
-    isEndOptionRow?: boolean;
-    theme?: ThemeColors;
 };
 
-function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, hasBeenToggled, theme}: ToggleSettingOptionRowProps) {
+function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, hasBeenToggled}: ToggleSettingOptionRowProps) {
     const [isEnabled, setIsEnabled] = useState(hasBeenToggled);
     const styles = useThemeStyles();
+    const theme = useTheme();
     const ICON_SIZE = 48;
     const toggleSwitch = () => {
         setIsEnabled(!isEnabled);
@@ -56,7 +54,7 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
         }, 
         subtitle: {
             fontSize: 13,
-            color: theme?.textSupporting || defaultTheme.textSupporting,
+            color: theme.textSupporting,
             marginTop: 3,
         },
     } satisfies Styles;
@@ -91,4 +89,3 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
 
 export type {ToggleSettingOptionRowProps};
 export default ToggleSettingOptionRow;
-
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index b782d8c02ed5..126f0500f4d7 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -15,14 +15,12 @@ import WorkspacePageWithSections from '@pages/workspace/WorkspacePageWithSection
 import * as Policy from '@userActions/Policy';
 import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
-import useStyleUtils from '@hooks/useStyleUtils';
+import useTheme from '@hooks/useTheme';
+// eslint-disable-next-line no-restricted-imports
+import spacing from '@styles/utils/spacing';
+import type { Styles } from '@styles/index';
 import ToggleSettingOptionRow from './ToggleSettingsOptionRow';
 import type {ToggleSettingOptionRowProps} from './ToggleSettingsOptionRow';
-import darkTheme from '@styles/theme/themes/dark';
-import lightTheme from '@styles/theme/themes/light';
-import spacing from '@styles/utils/spacing';
-import { Styles } from '@styles/index';
-import useThemePreference from '@hooks/useThemePreference';
 
 type WorkspaceWorkflowsPageProps = WithPolicyProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
 
@@ -30,9 +28,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const {isSmallScreenWidth} = useWindowDimensions();
-    const StyleUtils = useStyleUtils();
-    const themePreference = useThemePreference();
-    const themeToUse = useMemo(() => themePreference === CONST.THEME.DARK ? darkTheme : lightTheme, [themePreference]);    
+    const theme = useTheme();  
     
     // Since these styles are only used in this component we define them here
     const workflowsStyles = {
@@ -48,13 +44,13 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             marginTop: 14,
         },
         subMenuTitle: {
-            color: themeToUse.textSupporting,
+            color: theme.textSupporting,
             fontSize: 13,
             lineHeight: 16,
             fontWeight: '400',
         },
         subMenuDescription: {
-            color: themeToUse.text,
+            color: theme.text,
             fontSize: 15,
             lineHeight: 20,
         },
@@ -126,8 +122,8 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             isEndOptionRow: true,
             hasBeenToggled: false, // TODO make it dynamic when VBBA action is implemented
         },
-    ]), [policy, route.params.policyID, styles, translate, StyleUtils]);
-
+    ]), [policy, route.params.policyID, styles, translate, workflowsStyles.subMenuContainer, workflowsStyles.subMenuDescription, workflowsStyles.subMenuTitle]);
+    
     const renderItem = ({item}: {item: ToggleSettingOptionRowProps}) => (
         <View style={styles.mt7}>
             <ToggleSettingOptionRow
@@ -136,9 +132,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 subtitle={item.subtitle}
                 onToggle={item.onToggle}
                 subMenuItems={item.subMenuItems}
-                isEndOptionRow={item.isEndOptionRow}
                 hasBeenToggled={item.hasBeenToggled}
-                theme={themeToUse}
             />
         </View>
     );
diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index 4efe61fddea1..c756dd2fed3f 100644
--- a/src/styles/utils/index.ts
+++ b/src/styles/utils/index.ts
@@ -25,7 +25,6 @@ import getNavigationModalCardStyle from './getNavigationModalCardStyles';
 import getSignInBgStyles from './getSignInBgStyles';
 import {compactContentContainerStyles} from './optionRowStyles';
 import positioning from './positioning';
-import spacing from './spacing';
 import type {
     AllStyles,
     AvatarSize,

From c57b1dd1278e25e269e145b3f7884f7d3ee6e36b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 21 Feb 2024 16:25:55 +0100
Subject: [PATCH 223/305] fix icon display

---
 .../simple-illustrations/simple-illustration__wallet-alt.svg    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg b/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg
index 502a216f82e6..33d1fc0fa044 100644
--- a/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg
+++ b/assets/images/simple-illustrations/simple-illustration__wallet-alt.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="100" height="110" viewBox="0 0 30 44" fill="none"><path d="M26.7969 22.8477H2.94542C1.80808 22.8477 0.886078 23.7697 0.886078 24.907V40.482C0.886078 41.6193 1.80808 42.5413 2.94542 42.5413H26.7969C27.9342 42.5413 28.8562 41.6193 28.8562 40.482V24.907C28.8562 23.7697 27.9342 22.8477 26.7969 22.8477Z" fill="#D18000"/><path d="M5.4714 26.359V22.7461H2.63247C2.63247 22.7461 0.886078 23.3832 0.886078 24.5959V26.4373L5.4686 26.359H5.4714Z" fill="#780505"/><path d="M24.5616 22.5848V26.5135H28.725V24.5911C28.725 24.5911 28.3255 22.8447 27.11 22.8447C25.8945 22.8447 24.5616 22.582 24.5616 22.582V22.5848Z" fill="#780505"/><path d="M24.7183 0.824219H5.15598V26.5143H24.7183V0.824219Z" fill="#00B268"/><path d="M26.0845 32.7557V29.8078C26.0845 29.8078 26.1684 28.4609 24.9473 28.4609H6.79042C6.79042 28.4609 5.65317 28.4609 5.65317 29.5563V32.6746L26.0845 32.7585V32.7557Z" fill="#FCDCFF"/><path d="M6.15912 28.6251H4.39038C4.39038 28.6251 3.67506 28.4155 3.63314 29.7623L3.54932 32.4588L5.65616 32.6683V29.55L6.16191 28.6223L6.15912 28.6251Z" fill="#FBCCFF"/><path d="M12.0715 30.1836H8.30768V32.5419H12.0715V30.1836Z" fill="#F9B5FE"/><path d="M5.49982 32.4874V29.6932C5.49982 29.003 6.05866 28.4414 6.75163 28.4414H24.861C25.5512 28.4414 26.1128 29.0003 26.1128 29.6932V32.6551" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.13742 32.429V30.2383H12.013V32.4848" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 30.4609H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M20.1024 30.4609H23.9779" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 31.5898H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M3.58807 32.4874V29.6932C3.58807 29.003 4.14692 28.4414 4.83989 28.4414H8.92504" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8744 23.4105C17.2988 23.4105 19.2641 20.4181 19.2641 16.7267C19.2641 13.0354 17.2988 10.043 14.8744 10.043C12.45 10.043 10.4847 13.0354 10.4847 16.7267C10.4847 20.4181 12.45 23.4105 14.8744 23.4105Z" fill="#5BE3AA"/><path d="M8.40536 5.57031C9.15073 5.57031 9.75497 4.96607 9.75497 4.2207C9.75497 3.47533 9.15073 2.87109 8.40536 2.87109C7.66 2.87109 7.05576 3.47533 7.05576 4.2207C7.05576 4.96607 7.66 5.57031 8.40536 5.57031Z" fill="#5BE3AA"/><path d="M21.5131 5.58984C22.2585 5.58984 22.8627 4.9856 22.8627 4.24023C22.8627 3.49487 22.2585 2.89062 21.5131 2.89062C20.7677 2.89062 20.1635 3.49487 20.1635 4.24023C20.1635 4.9856 20.7677 5.58984 21.5131 5.58984Z" fill="#5BE3AA"/><path d="M5.21713 26.3569V1.10547H24.5727V26.2255" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8966 23.6281C17.3425 23.6281 19.3254 20.5581 19.3254 16.7711C19.3254 12.9841 17.3425 9.91406 14.8966 9.91406C12.4506 9.91406 10.4677 12.9841 10.4677 16.7711C10.4677 20.5581 12.4506 23.6281 14.8966 23.6281Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.5134 5.79131C22.3683 5.79131 23.0614 5.09825 23.0614 4.24331C23.0614 3.38838 22.3683 2.69531 21.5134 2.69531C20.6585 2.69531 19.9654 3.38838 19.9654 4.24331C19.9654 5.09825 20.6585 5.79131 21.5134 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.41381 5.79131C9.26875 5.79131 9.96181 5.09825 9.96181 4.24331C9.96181 3.38838 9.26875 2.69531 8.41381 2.69531C7.55888 2.69531 6.86581 3.38838 6.86581 4.24331C6.86581 5.09825 7.55888 5.79131 8.41381 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.23514 26.3568V7.32812" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.6474 7.32812V26.4155" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6552 3.98828H18.2496" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.2468 4.21875C18.2468 5.93999 19.6439 7.3371 21.3652 7.3371C21.4294 7.3371 21.4965 7.3371 21.5608 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6582 4.21875C11.6582 5.93999 10.2611 7.3371 8.53983 7.3371C8.47557 7.3371 8.40851 7.3371 8.34424 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M24.7713 22.6406H26.5988C27.845 22.6406 28.8565 23.6521 28.8565 24.8984V40.4957C28.8565 41.7419 27.845 42.7534 26.5988 42.7534H3.04066C1.79444 42.7534 0.782928 41.7419 0.782928 40.4957V24.8984C0.782928 23.6521 1.79444 22.6406 3.04066 22.6406H5.02456" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 26.4102H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 33.0078H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" width="270" height="280" viewBox="0 0 30 44" fill="none"><path d="M26.7969 22.8477H2.94542C1.80808 22.8477 0.886078 23.7697 0.886078 24.907V40.482C0.886078 41.6193 1.80808 42.5413 2.94542 42.5413H26.7969C27.9342 42.5413 28.8562 41.6193 28.8562 40.482V24.907C28.8562 23.7697 27.9342 22.8477 26.7969 22.8477Z" fill="#D18000"/><path d="M5.4714 26.359V22.7461H2.63247C2.63247 22.7461 0.886078 23.3832 0.886078 24.5959V26.4373L5.4686 26.359H5.4714Z" fill="#780505"/><path d="M24.5616 22.5848V26.5135H28.725V24.5911C28.725 24.5911 28.3255 22.8447 27.11 22.8447C25.8945 22.8447 24.5616 22.582 24.5616 22.582V22.5848Z" fill="#780505"/><path d="M24.7183 0.824219H5.15598V26.5143H24.7183V0.824219Z" fill="#00B268"/><path d="M26.0845 32.7557V29.8078C26.0845 29.8078 26.1684 28.4609 24.9473 28.4609H6.79042C6.79042 28.4609 5.65317 28.4609 5.65317 29.5563V32.6746L26.0845 32.7585V32.7557Z" fill="#FCDCFF"/><path d="M6.15912 28.6251H4.39038C4.39038 28.6251 3.67506 28.4155 3.63314 29.7623L3.54932 32.4588L5.65616 32.6683V29.55L6.16191 28.6223L6.15912 28.6251Z" fill="#FBCCFF"/><path d="M12.0715 30.1836H8.30768V32.5419H12.0715V30.1836Z" fill="#F9B5FE"/><path d="M5.49982 32.4874V29.6932C5.49982 29.003 6.05866 28.4414 6.75163 28.4414H24.861C25.5512 28.4414 26.1128 29.0003 26.1128 29.6932V32.6551" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.13742 32.429V30.2383H12.013V32.4848" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 30.4609H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M20.1024 30.4609H23.9779" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.0359 31.5898H17.9114" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M3.58807 32.4874V29.6932C3.58807 29.003 4.14692 28.4414 4.83989 28.4414H8.92504" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8744 23.4105C17.2988 23.4105 19.2641 20.4181 19.2641 16.7267C19.2641 13.0354 17.2988 10.043 14.8744 10.043C12.45 10.043 10.4847 13.0354 10.4847 16.7267C10.4847 20.4181 12.45 23.4105 14.8744 23.4105Z" fill="#5BE3AA"/><path d="M8.40536 5.57031C9.15073 5.57031 9.75497 4.96607 9.75497 4.2207C9.75497 3.47533 9.15073 2.87109 8.40536 2.87109C7.66 2.87109 7.05576 3.47533 7.05576 4.2207C7.05576 4.96607 7.66 5.57031 8.40536 5.57031Z" fill="#5BE3AA"/><path d="M21.5131 5.58984C22.2585 5.58984 22.8627 4.9856 22.8627 4.24023C22.8627 3.49487 22.2585 2.89062 21.5131 2.89062C20.7677 2.89062 20.1635 3.49487 20.1635 4.24023C20.1635 4.9856 20.7677 5.58984 21.5131 5.58984Z" fill="#5BE3AA"/><path d="M5.21713 26.3569V1.10547H24.5727V26.2255" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M14.8966 23.6281C17.3425 23.6281 19.3254 20.5581 19.3254 16.7711C19.3254 12.9841 17.3425 9.91406 14.8966 9.91406C12.4506 9.91406 10.4677 12.9841 10.4677 16.7711C10.4677 20.5581 12.4506 23.6281 14.8966 23.6281Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.5134 5.79131C22.3683 5.79131 23.0614 5.09825 23.0614 4.24331C23.0614 3.38838 22.3683 2.69531 21.5134 2.69531C20.6585 2.69531 19.9654 3.38838 19.9654 4.24331C19.9654 5.09825 20.6585 5.79131 21.5134 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.41381 5.79131C9.26875 5.79131 9.96181 5.09825 9.96181 4.24331C9.96181 3.38838 9.26875 2.69531 8.41381 2.69531C7.55888 2.69531 6.86581 3.38838 6.86581 4.24331C6.86581 5.09825 7.55888 5.79131 8.41381 5.79131Z" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M8.23514 26.3568V7.32812" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M21.6474 7.32812V26.4155" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6552 3.98828H18.2496" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M18.2468 4.21875C18.2468 5.93999 19.6439 7.3371 21.3652 7.3371C21.4294 7.3371 21.4965 7.3371 21.5608 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6582 4.21875C11.6582 5.93999 10.2611 7.3371 8.53983 7.3371C8.47557 7.3371 8.40851 7.3371 8.34424 7.33151" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M24.7713 22.6406H26.5988C27.845 22.6406 28.8565 23.6521 28.8565 24.8984V40.4957C28.8565 41.7419 27.845 42.7534 26.5988 42.7534H3.04066C1.79444 42.7534 0.782928 41.7419 0.782928 40.4957V24.8984C0.782928 23.6521 1.79444 22.6406 3.04066 22.6406H5.02456" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 26.4102H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/><path d="M0.782928 33.0078H28.7531" stroke="#002140" stroke-width="0.99999" stroke-linecap="round" stroke-linejoin="round"/></svg>
\ No newline at end of file

From 1a61957a316ad46c7afce964b348f0025d6589d3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 21 Feb 2024 16:31:02 +0100
Subject: [PATCH 224/305] add margin as in figma

---
 src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index be9177759c9f..df87a0bc5adc 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -56,6 +56,7 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
             fontSize: 13,
             color: theme.textSupporting,
             marginTop: 3,
+            marginRight: 20,
         },
     } satisfies Styles;
 

From d0b0c93b93d7fc95d468ffaeeece9515ca7d2181 Mon Sep 17 00:00:00 2001
From: Marcin Swornowski <swor71@gmail.com>
Date: Wed, 21 Feb 2024 16:59:40 +0100
Subject: [PATCH 225/305] fix: removed shouldEnableMaxHeight prop from
 ScreenWrapper

---
 src/pages/ReimbursementAccount/BankInfo/BankInfo.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/ReimbursementAccount/BankInfo/BankInfo.tsx b/src/pages/ReimbursementAccount/BankInfo/BankInfo.tsx
index bb352acd4732..ed00fbcff422 100644
--- a/src/pages/ReimbursementAccount/BankInfo/BankInfo.tsx
+++ b/src/pages/ReimbursementAccount/BankInfo/BankInfo.tsx
@@ -136,7 +136,6 @@ function BankInfo({reimbursementAccount, reimbursementAccountDraft, plaidLinkTok
             testID={BankInfo.displayName}
             includeSafeAreaPaddingBottom={false}
             shouldEnablePickerAvoiding={false}
-            shouldEnableMaxHeight
         >
             <HeaderWithBackButton
                 shouldShowBackButton

From f0aab68fd41986e99d74f10c5fe7b11072158e46 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 21 Feb 2024 17:10:32 +0100
Subject: [PATCH 226/305] fix default approver display name

---
 .../workflows/WorkspaceWorkflowsPage.tsx      | 21 ++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 126f0500f4d7..22f8bc6bccaa 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -1,7 +1,9 @@
 import type {StackScreenProps} from '@react-navigation/stack';
-import React, { useMemo } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import {FlatList, View} from 'react-native';
 import * as Illustrations from '@components/Icon/Illustrations';
+import * as OptionsListUtils from '@libs/OptionsListUtils';
+import * as ReportUtils from '@libs/ReportUtils';
 import MenuItem from '@components/MenuItem';
 import Section from '@components/Section';
 import Text from '@components/Text';
@@ -30,6 +32,18 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const {isSmallScreenWidth} = useWindowDimensions();
     const theme = useTheme();  
     
+    const [policyOwnerDisplayName, setPolicyOwnerDisplayName] = useState('');
+
+    useEffect(() => {
+        if (!policy?.ownerAccountID) { 
+            return;
+        }
+        const ownerPersonalDetails = ReportUtils.getDisplayNamesWithTooltips(OptionsListUtils.getPersonalDetailsForAccountIDs([policy.ownerAccountID], CONST.EMPTY_OBJECT), false);
+        if (ownerPersonalDetails.length > 0 && ownerPersonalDetails[0].displayName) {
+            setPolicyOwnerDisplayName(ownerPersonalDetails[0].displayName);
+        }
+    }, [policy]);
+
     // Since these styles are only used in this component we define them here
     const workflowsStyles = {
         subMenuContainer: {
@@ -91,7 +105,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     title={translate('workflowsPage.approver')}
                     titleStyle={workflowsStyles.subMenuTitle}
                     descriptionTextStyle={workflowsStyles.subMenuDescription}
-                    description={policy?.owner ?? ''}
+                    description={policyOwnerDisplayName ?? ''}
                     // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
                     // TODO will be done in https://github.com/Expensify/Expensify/issues/368334
                     shouldShowRightIcon
@@ -122,7 +136,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             isEndOptionRow: true,
             hasBeenToggled: false, // TODO make it dynamic when VBBA action is implemented
         },
-    ]), [policy, route.params.policyID, styles, translate, workflowsStyles.subMenuContainer, workflowsStyles.subMenuDescription, workflowsStyles.subMenuTitle]);
+    ]), [policy, route.params.policyID, styles, translate, workflowsStyles.subMenuContainer, workflowsStyles.subMenuDescription, workflowsStyles.subMenuTitle, policyOwnerDisplayName]);
     
     const renderItem = ({item}: {item: ToggleSettingOptionRowProps}) => (
         <View style={styles.mt7}>
@@ -170,3 +184,4 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
 WorkspaceWorkflowsPage.displayName = 'WorkspaceWorkflowsPage';
 
 export default withPolicy(WorkspaceWorkflowsPage);
+

From 5b4914789287ada163aad3e3564fa10f99eab43d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Wed, 21 Feb 2024 17:19:43 +0100
Subject: [PATCH 227/305] fix prettier

---
 .../workflows/ToggleSettingsOptionRow.tsx     |   6 +-
 .../workflows/WorkspaceWorkflowsPage.tsx      | 154 +++++++++---------
 src/styles/index.ts                           |   1 -
 src/styles/utils/index.ts                     |   1 -
 4 files changed, 81 insertions(+), 81 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index df87a0bc5adc..deb467ae0c76 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -4,9 +4,9 @@ import type {SvgProps} from 'react-native-svg';
 import Icon from '@components/Icon';
 import Switch from '@components/Switch';
 import Text from '@components/Text';
-import useThemeStyles from '@hooks/useThemeStyles';
-import type { Styles } from '@styles/index';
 import useTheme from '@hooks/useTheme';
+import useThemeStyles from '@hooks/useThemeStyles';
+import type {Styles} from '@styles/index';
 
 type ToggleSettingOptionRowProps = {
     icon: React.FC<SvgProps>;
@@ -51,7 +51,7 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
         heading: {
             fontSize: 15,
             fontWeight: '700',
-        }, 
+        },
         subtitle: {
             fontSize: 13,
             color: theme.textSupporting,
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 22f8bc6bccaa..390afc7be492 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -1,26 +1,26 @@
 import type {StackScreenProps} from '@react-navigation/stack';
-import React, { useEffect, useMemo, useState } from 'react';
+import React, {useEffect, useMemo, useState} from 'react';
 import {FlatList, View} from 'react-native';
 import * as Illustrations from '@components/Icon/Illustrations';
-import * as OptionsListUtils from '@libs/OptionsListUtils';
-import * as ReportUtils from '@libs/ReportUtils';
 import MenuItem from '@components/MenuItem';
 import Section from '@components/Section';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
+import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
+import * as OptionsListUtils from '@libs/OptionsListUtils';
+import * as ReportUtils from '@libs/ReportUtils';
 import type {CentralPaneNavigatorParamList} from '@navigation/types';
 import withPolicy from '@pages/workspace/withPolicy';
 import type {WithPolicyProps} from '@pages/workspace/withPolicy';
 import WorkspacePageWithSections from '@pages/workspace/WorkspacePageWithSections';
+import type {Styles} from '@styles/index';
+// eslint-disable-next-line no-restricted-imports
+import spacing from '@styles/utils/spacing';
 import * as Policy from '@userActions/Policy';
 import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
-import useTheme from '@hooks/useTheme';
-// eslint-disable-next-line no-restricted-imports
-import spacing from '@styles/utils/spacing';
-import type { Styles } from '@styles/index';
 import ToggleSettingOptionRow from './ToggleSettingsOptionRow';
 import type {ToggleSettingOptionRowProps} from './ToggleSettingsOptionRow';
 
@@ -30,12 +30,12 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const {isSmallScreenWidth} = useWindowDimensions();
-    const theme = useTheme();  
-    
+    const theme = useTheme();
+
     const [policyOwnerDisplayName, setPolicyOwnerDisplayName] = useState('');
 
     useEffect(() => {
-        if (!policy?.ownerAccountID) { 
+        if (!policy?.ownerAccountID) {
             return;
         }
         const ownerPersonalDetails = ReportUtils.getDisplayNamesWithTooltips(OptionsListUtils.getPersonalDetailsForAccountIDs([policy.ownerAccountID], CONST.EMPTY_OBJECT), false);
@@ -70,74 +70,77 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
         },
     } satisfies Styles;
 
-    const items: ToggleSettingOptionRowProps[] = useMemo(() => ([
-        {
-            icon: Illustrations.ReceiptEnvelope,
-            title: translate('workflowsPage.delaySubmissionTitle'),
-            subtitle: translate('workflowsPage.delaySubmissionDescription'),
-            onToggle: (isEnabled: boolean) => {
-                Policy.setWorkspaceAutoReporting(route.params.policyID, isEnabled);
+    const items: ToggleSettingOptionRowProps[] = useMemo(
+        () => [
+            {
+                icon: Illustrations.ReceiptEnvelope,
+                title: translate('workflowsPage.delaySubmissionTitle'),
+                subtitle: translate('workflowsPage.delaySubmissionDescription'),
+                onToggle: (isEnabled: boolean) => {
+                    Policy.setWorkspaceAutoReporting(route.params.policyID, isEnabled);
+                },
+                subMenuItems: (
+                    <MenuItem
+                        title={translate('workflowsPage.submissionFrequency')}
+                        titleStyle={workflowsStyles.subMenuTitle}
+                        descriptionTextStyle={workflowsStyles.subMenuDescription}
+                        // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_AUTOREPORTING_FREQUENCY).getRoute(route.params.policyID))}
+                        // TODO will be done in https://github.com/Expensify/Expensify/issues/368332
+                        description={translate('workflowsPage.weeklyFrequency')}
+                        shouldShowRightIcon
+                        wrapperStyle={workflowsStyles.subMenuContainer}
+                        hoverAndPressStyle={[styles.mr0, styles.br2]}
+                    />
+                ),
+                hasBeenToggled: policy?.harvesting?.enabled ?? false,
             },
-            subMenuItems: (
-                <MenuItem
-                    title={translate('workflowsPage.submissionFrequency')}
-                    titleStyle={workflowsStyles.subMenuTitle}
-                    descriptionTextStyle={workflowsStyles.subMenuDescription}
-                    // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_AUTOREPORTING_FREQUENCY).getRoute(route.params.policyID))}
-                    // TODO will be done in https://github.com/Expensify/Expensify/issues/368332
-                    description={translate('workflowsPage.weeklyFrequency')}
-                    shouldShowRightIcon
-                    wrapperStyle={workflowsStyles.subMenuContainer}
-                    hoverAndPressStyle={[styles.mr0, styles.br2]}
-                />
-            ),
-            hasBeenToggled: policy?.harvesting?.enabled ?? false,
-        },
-        {
-            icon: Illustrations.Approval,
-            title: translate('workflowsPage.addApprovalsTitle'),
-            subtitle: translate('workflowsPage.addApprovalsDescription'),
-            onToggle: (isEnabled: boolean) => {
-                Policy.setWorkspaceApprovalMode(route.params.policyID, policy?.owner ?? '', isEnabled ? 'BASIC' : 'OPTIONAL');
+            {
+                icon: Illustrations.Approval,
+                title: translate('workflowsPage.addApprovalsTitle'),
+                subtitle: translate('workflowsPage.addApprovalsDescription'),
+                onToggle: (isEnabled: boolean) => {
+                    Policy.setWorkspaceApprovalMode(route.params.policyID, policy?.owner ?? '', isEnabled ? 'BASIC' : 'OPTIONAL');
+                },
+                subMenuItems: (
+                    <MenuItem
+                        title={translate('workflowsPage.approver')}
+                        titleStyle={workflowsStyles.subMenuTitle}
+                        descriptionTextStyle={workflowsStyles.subMenuDescription}
+                        description={policyOwnerDisplayName ?? ''}
+                        // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
+                        // TODO will be done in https://github.com/Expensify/Expensify/issues/368334
+                        shouldShowRightIcon
+                        wrapperStyle={workflowsStyles.subMenuContainer}
+                        hoverAndPressStyle={[styles.mr0, styles.br2]}
+                    />
+                ),
+                hasBeenToggled: policy?.isAutoApprovalEnabled ?? false,
             },
-            subMenuItems: (
-                <MenuItem
-                    title={translate('workflowsPage.approver')}
-                    titleStyle={workflowsStyles.subMenuTitle}
-                    descriptionTextStyle={workflowsStyles.subMenuDescription}
-                    description={policyOwnerDisplayName ?? ''}
-                    // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
-                    // TODO will be done in https://github.com/Expensify/Expensify/issues/368334
-                    shouldShowRightIcon
-                    wrapperStyle={workflowsStyles.subMenuContainer}
-                    hoverAndPressStyle={[styles.mr0, styles.br2]}
-                />
-            ),
-            hasBeenToggled: policy?.isAutoApprovalEnabled ?? false,
-        },
-        {
-            icon: Illustrations.WalletAlt,
-            title: translate('workflowsPage.makeOrTrackPaymentsTitle'),
-            subtitle: translate('workflowsPage.makeOrTrackPaymentsDescription'),
-            onToggle: () => {
-                // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
-            },
-            subMenuItems: (
-                <MenuItem
-                    descriptionTextStyle={[workflowsStyles.subMenuDescription, styles.textSupporting]}
-                    description={translate('workflowsPage.connectBankAccount')}
-                    // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
+            {
+                icon: Illustrations.WalletAlt,
+                title: translate('workflowsPage.makeOrTrackPaymentsTitle'),
+                subtitle: translate('workflowsPage.makeOrTrackPaymentsDescription'),
+                onToggle: () => {
                     // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
-                    shouldShowRightIcon
-                    wrapperStyle={workflowsStyles.subMenuContainer}
-                    hoverAndPressStyle={[styles.mr0, styles.br2]}
-                />
-            ),
-            isEndOptionRow: true,
-            hasBeenToggled: false, // TODO make it dynamic when VBBA action is implemented
-        },
-    ]), [policy, route.params.policyID, styles, translate, workflowsStyles.subMenuContainer, workflowsStyles.subMenuDescription, workflowsStyles.subMenuTitle, policyOwnerDisplayName]);
-    
+                },
+                subMenuItems: (
+                    <MenuItem
+                        descriptionTextStyle={[workflowsStyles.subMenuDescription, styles.textSupporting]}
+                        description={translate('workflowsPage.connectBankAccount')}
+                        // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
+                        // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
+                        shouldShowRightIcon
+                        wrapperStyle={workflowsStyles.subMenuContainer}
+                        hoverAndPressStyle={[styles.mr0, styles.br2]}
+                    />
+                ),
+                isEndOptionRow: true,
+                hasBeenToggled: false, // TODO make it dynamic when VBBA action is implemented
+            },
+        ],
+        [policy, route.params.policyID, styles, translate, workflowsStyles.subMenuContainer, workflowsStyles.subMenuDescription, workflowsStyles.subMenuTitle, policyOwnerDisplayName],
+    );
+
     const renderItem = ({item}: {item: ToggleSettingOptionRowProps}) => (
         <View style={styles.mt7}>
             <ToggleSettingOptionRow
@@ -184,4 +187,3 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
 WorkspaceWorkflowsPage.displayName = 'WorkspaceWorkflowsPage';
 
 export default withPolicy(WorkspaceWorkflowsPage);
-
diff --git a/src/styles/index.ts b/src/styles/index.ts
index aa2860003c60..a02a82fffce6 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -4583,7 +4583,6 @@ const styles = (theme: ThemeColors) =>
             fontWeight: '500',
             fontSize: variables.workspaceProfileName,
         },
-        
     } satisfies Styles);
 
 type ThemeStyles = ReturnType<typeof styles>;
diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index c756dd2fed3f..a0edb7fd4e23 100644
--- a/src/styles/utils/index.ts
+++ b/src/styles/utils/index.ts
@@ -1483,4 +1483,3 @@ const DefaultStyleUtils = createStyleUtils(defaultTheme, defaultStyles);
 export default createStyleUtils;
 export {DefaultStyleUtils};
 export type {StyleUtilsType, AvatarSizeName};
-

From becf2fd33d9eaf0570376bfa7bc0bcb7ed5cc379 Mon Sep 17 00:00:00 2001
From: Kamil Owczarz <kamil.owczarz@swmansion.com>
Date: Wed, 21 Feb 2024 18:01:50 +0100
Subject: [PATCH 228/305] Fix app returns to previous thread when scrubbing
 video in thread

---
 src/components/VideoPlayer/BaseVideoPlayer.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/VideoPlayer/BaseVideoPlayer.js b/src/components/VideoPlayer/BaseVideoPlayer.js
index 73dbf8407c0c..da4306f2164a 100644
--- a/src/components/VideoPlayer/BaseVideoPlayer.js
+++ b/src/components/VideoPlayer/BaseVideoPlayer.js
@@ -164,7 +164,9 @@ function BaseVideoPlayer({
     }, [bindFunctions, currentVideoPlayerRef, currentlyPlayingURL, isSmallScreenWidth, originalParent, sharedElement, shouldUseSharedVideoElement, url]);
 
     return (
-        <>
+        // We need to wrap the video component in a component that will catch unhandled pointer events. Otherwise, these
+        // events will bubble up the tree, and it will cause unexpected press behavior.
+        <PressableWithoutFeedback accessibilityRole="button">
             <View style={style}>
                 <Hoverable>
                     {(isHovered) => (
@@ -243,7 +245,7 @@ function BaseVideoPlayer({
                 hidePopover={hidePopoverMenu}
                 anchorPosition={popoverAnchorPosition}
             />
-        </>
+        </PressableWithoutFeedback>
     );
 }
 

From cfa58253fe09a8cde52920d96155fb6594cb02e3 Mon Sep 17 00:00:00 2001
From: Yauheni Pasiukevich <pasyukevich@live.com>
Date: Wed, 21 Feb 2024 18:10:28 +0100
Subject: [PATCH 229/305] fix prettier

---
 src/components/AvatarWithImagePicker.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/AvatarWithImagePicker.tsx b/src/components/AvatarWithImagePicker.tsx
index 1f49b0f49b40..07c535ccd96c 100644
--- a/src/components/AvatarWithImagePicker.tsx
+++ b/src/components/AvatarWithImagePicker.tsx
@@ -111,7 +111,7 @@ type AvatarWithImagePickerProps = {
     onViewPhotoPress?: () => void;
 
     /** Allows to open an image without Attachment Picker. */
-    enablePreview?: boolean,
+    enablePreview?: boolean;
 };
 
 function AvatarWithImagePicker({

From 80863fe60918953d9dd8ffae4d80cb01bf77828e Mon Sep 17 00:00:00 2001
From: Cong Pham <ptcong411@gmail.com>
Date: Thu, 22 Feb 2024 00:27:24 +0700
Subject: [PATCH 230/305] fix prettier

---
 src/pages/signin/SignInPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/signin/SignInPage.tsx b/src/pages/signin/SignInPage.tsx
index eacf3415e10e..fd44b3a6a91d 100644
--- a/src/pages/signin/SignInPage.tsx
+++ b/src/pages/signin/SignInPage.tsx
@@ -249,7 +249,7 @@ function SignInPageInner({credentials, account, activeClients = [], preferredLoc
         // The SVG should flow under the Home Indicator on iOS.
         <ScreenWrapper
             shouldEnableMaxHeight={shouldEnableMaxHeight}
-            style={[styles.signInPage, StyleUtils.getSafeAreaPadding({ ...safeAreaInsets, bottom: 0, top: isInModal ? 0 : safeAreaInsets.top }, 1)]}
+            style={[styles.signInPage, StyleUtils.getSafeAreaPadding({...safeAreaInsets, bottom: 0, top: isInModal ? 0 : safeAreaInsets.top}, 1)]}
             testID={SignInPageInner.displayName}
         >
             <SignInPageLayout

From 338972f9980e60970811275b3af826c257fb3295 Mon Sep 17 00:00:00 2001
From: brunovjk <brunovjk@gmail.com>
Date: Wed, 21 Feb 2024 16:12:52 -0300
Subject: [PATCH 231/305] remove 'getMarkedReimbursedMessage'

---
 src/libs/ReportActionsUtils.ts            | 9 ---------
 src/pages/home/report/ReportActionItem.js | 2 --
 2 files changed, 11 deletions(-)

diff --git a/src/libs/ReportActionsUtils.ts b/src/libs/ReportActionsUtils.ts
index eeebbdf7dbdb..c83730754f24 100644
--- a/src/libs/ReportActionsUtils.ts
+++ b/src/libs/ReportActionsUtils.ts
@@ -800,14 +800,6 @@ function getMemberChangeMessageFragment(reportAction: OnyxEntry<ReportAction>):
     };
 }
 
-/**
- * MARKEDREIMBURSED reportActions come from marking a report as reimbursed in OldDot. For now, we just
- * concat all of the text elements of the message to create the full message.
- */
-function getMarkedReimbursedMessage(reportAction: OnyxEntry<ReportAction>): string {
-    return reportAction?.message?.map((element) => element.text).join('') ?? '';
-}
-
 function getMemberChangeMessagePlainText(reportAction: OnyxEntry<ReportAction>): string {
     const messageElements = getMemberChangeMessageElements(reportAction);
     return messageElements.map((element) => element.content).join('');
@@ -935,7 +927,6 @@ export {
     hasRequestFromCurrentAccount,
     getFirstVisibleReportActionID,
     isMemberChangeAction,
-    getMarkedReimbursedMessage,
     getMemberChangeMessageFragment,
     getMemberChangeMessagePlainText,
     isReimbursementDeQueuedAction,
diff --git a/src/pages/home/report/ReportActionItem.js b/src/pages/home/report/ReportActionItem.js
index 66394190fde6..7b8de0566735 100644
--- a/src/pages/home/report/ReportActionItem.js
+++ b/src/pages/home/report/ReportActionItem.js
@@ -464,8 +464,6 @@ function ReportActionItem(props) {
             children = <ReportActionItemBasicMessage message={ReportUtils.getReimbursementDeQueuedActionMessage(props.action, props.report)} />;
         } else if (props.action.actionName === CONST.REPORT.ACTIONS.TYPE.MODIFIEDEXPENSE) {
             children = <ReportActionItemBasicMessage message={ModifiedExpenseMessage.getForReportAction(props.report.reportID, props.action)} />;
-        } else if (props.action.actionName === CONST.REPORT.ACTIONS.TYPE.MARKEDREIMBURSED) {
-            children = <ReportActionItemBasicMessage message={ReportActionsUtils.getMarkedReimbursedMessage(props.action)} />;
         } else if (props.action.actionName === CONST.REPORT.ACTIONS.TYPE.HOLD) {
             children = <ReportActionItemBasicMessage message={props.translate('iou.heldRequest', {comment: lodashGet(props, 'action.message[1].text', '')})} />;
         } else if (props.action.actionName === CONST.REPORT.ACTIONS.TYPE.UNHOLD) {

From 2f3df12aaf931c54f7964e1f99b52e27c946534a Mon Sep 17 00:00:00 2001
From: Krishna Gupta <belivethatkg@gmail.com>
Date: Thu, 22 Feb 2024 02:31:42 +0530
Subject: [PATCH 232/305] change menu items order.

Signed-off-by: Krishna Gupta <belivethatkg@gmail.com>
---
 .../VideoPopoverMenuContext.js                | 32 +++++++++----------
 1 file changed, 16 insertions(+), 16 deletions(-)

diff --git a/src/components/VideoPlayerContexts/VideoPopoverMenuContext.js b/src/components/VideoPlayerContexts/VideoPopoverMenuContext.js
index 9c19ef8ed212..801c1b2f44ca 100644
--- a/src/components/VideoPlayerContexts/VideoPopoverMenuContext.js
+++ b/src/components/VideoPlayerContexts/VideoPopoverMenuContext.js
@@ -33,22 +33,7 @@ function VideoPopoverMenuContextProvider({children}) {
     }, [currentVideoPlayerRef]);
 
     const menuItems = useMemo(() => {
-        const items = [
-            {
-                icon: Expensicons.Meter,
-                text: translate('videoPlayer.playbackSpeed'),
-                subMenuItems: [
-                    ..._.map(CONST.VIDEO_PLAYER.PLAYBACK_SPEEDS, (speed) => ({
-                        icon: currentPlaybackSpeed === speed ? Expensicons.Checkmark : null,
-                        text: speed.toString(),
-                        onSelected: () => {
-                            updatePlaybackSpeed(speed);
-                        },
-                        shouldPutLeftPaddingWhenNoIcon: true,
-                    })),
-                ],
-            },
-        ];
+        const items = [];
 
         if (!isOffline) {
             items.push({
@@ -60,6 +45,21 @@ function VideoPopoverMenuContextProvider({children}) {
             });
         }
 
+        items.push({
+            icon: Expensicons.Meter,
+            text: translate('videoPlayer.playbackSpeed'),
+            subMenuItems: [
+                ..._.map(CONST.VIDEO_PLAYER.PLAYBACK_SPEEDS, (speed) => ({
+                    icon: currentPlaybackSpeed === speed ? Expensicons.Checkmark : null,
+                    text: speed.toString(),
+                    onSelected: () => {
+                        updatePlaybackSpeed(speed);
+                    },
+                    shouldPutLeftPaddingWhenNoIcon: true,
+                })),
+            ],
+        });
+
         return items;
     }, [currentPlaybackSpeed, downloadAttachment, translate, updatePlaybackSpeed, isOffline]);
 

From 5e95a19b5cad1eff7e09110557c613ee51af4e37 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Wed, 21 Feb 2024 13:28:08 -0800
Subject: [PATCH 233/305] Remove conditions added for multi tags

---
 src/libs/Violations/ViolationsUtils.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/libs/Violations/ViolationsUtils.ts b/src/libs/Violations/ViolationsUtils.ts
index f4a407d6c8bd..38a30097adc0 100644
--- a/src/libs/Violations/ViolationsUtils.ts
+++ b/src/libs/Violations/ViolationsUtils.ts
@@ -61,8 +61,8 @@ const ViolationsUtils = {
             }
 
             policyTagKeys.forEach((key, index) => {
-                const hasTagOutOfPolicyViolation = transactionViolations.some((violation) => violation.name === CONST.VIOLATIONS.TAG_OUT_OF_POLICY && violation.data?.tagName === key);
-                const hasMissingTagViolation = transactionViolations.some((violation) => violation.name === CONST.VIOLATIONS.MISSING_TAG && violation.data?.tagName === key);
+                const hasTagOutOfPolicyViolation = transactionViolations.some((violation) => violation.name === CONST.VIOLATIONS.TAG_OUT_OF_POLICY);
+                const hasMissingTagViolation = transactionViolations.some((violation) => violation.name === CONST.VIOLATIONS.MISSING_TAG);
                 const selectedTag = selectedTags[index];
                 const isTagInPolicy = Boolean(policyTagList[key]?.tags[selectedTag]?.enabled);
 

From ca612f4eafca811600ddefd2857fd0c50cf8e97d Mon Sep 17 00:00:00 2001
From: Ben Limpich <blimpich@expensify.com>
Date: Wed, 21 Feb 2024 14:15:01 -0800
Subject: [PATCH 234/305] get rid of unnecessary check

---
 src/pages/DetailsPage.tsx | 23 +++++++----------------
 1 file changed, 7 insertions(+), 16 deletions(-)

diff --git a/src/pages/DetailsPage.tsx b/src/pages/DetailsPage.tsx
index d4438d3141bf..a9adb5310e58 100755
--- a/src/pages/DetailsPage.tsx
+++ b/src/pages/DetailsPage.tsx
@@ -64,22 +64,13 @@ function DetailsPage({personalDetails, route, session}: DetailsPageProps) {
     let details = Object.values(personalDetails ?? {}).find((personalDetail) => personalDetail?.login === login.toLowerCase());
 
     if (!details) {
-        if (login === CONST.EMAIL.CONCIERGE) {
-            details = {
-                accountID: CONST.ACCOUNT_ID.CONCIERGE,
-                login,
-                displayName: 'Concierge',
-                avatar: UserUtils.getDefaultAvatar(CONST.ACCOUNT_ID.CONCIERGE),
-            };
-        } else {
-            const optimisticAccountID = UserUtils.generateAccountID(login);
-            details = {
-                accountID: optimisticAccountID,
-                login,
-                displayName: login,
-                avatar: UserUtils.getDefaultAvatar(optimisticAccountID),
-            };
-        }
+        const optimisticAccountID = UserUtils.generateAccountID(login);
+        details = {
+            accountID: optimisticAccountID,
+            login,
+            displayName: login,
+            avatar: UserUtils.getDefaultAvatar(optimisticAccountID),
+        };
     }
 
     const isSMSLogin = details.login ? Str.isSMSLogin(details.login) : false;

From 12834bb7898186f59549aaa6189e2bf66a3fe820 Mon Sep 17 00:00:00 2001
From: Ben Limpich <blimpich@expensify.com>
Date: Wed, 21 Feb 2024 14:19:44 -0800
Subject: [PATCH 235/305] fix bad merge conflict resolution

---
 src/libs/ReportUtils.ts | 19 -------------------
 1 file changed, 19 deletions(-)

diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index a493c51eaa52..b0e2513a3018 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -1618,25 +1618,6 @@ function getPersonalDetailsForAccountID(accountID: number): Partial<PersonalDeta
     if (!accountID) {
         return {};
     }
-<<<<<<< HEAD
-=======
-    if (Number(accountID) === CONST.ACCOUNT_ID.CONCIERGE) {
-        return {
-            accountID,
-            displayName: 'Concierge',
-            login: CONST.EMAIL.CONCIERGE,
-            avatar: UserUtils.getDefaultAvatar(accountID),
-        };
-    }
-    if (Number(accountID) === CONST.ACCOUNT_ID.NOTIFICATIONS) {
-        return {
-            accountID,
-            displayName: 'Expensify',
-            login: CONST.EMAIL.NOTIFICATIONS,
-            avatar: UserUtils.getDefaultAvatar(accountID),
-        };
-    }
->>>>>>> main
     return (
         allPersonalDetails?.[accountID] ?? {
             avatar: UserUtils.getDefaultAvatar(accountID),

From 8a1f1acd4ce5e72bf6f726f496c94befe0dc3787 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Wed, 21 Feb 2024 15:53:37 -0800
Subject: [PATCH 236/305] Run pod install if node_modules changed

---
 .github/actions/composite/setupNode/action.yml | 5 +++++
 .github/workflows/platformDeploy.yml           | 3 ++-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/.github/actions/composite/setupNode/action.yml b/.github/actions/composite/setupNode/action.yml
index 7e1b5fbbae90..0b32d8ee6dc1 100644
--- a/.github/actions/composite/setupNode/action.yml
+++ b/.github/actions/composite/setupNode/action.yml
@@ -1,6 +1,11 @@
 name: Set up Node
 description: Set up Node
 
+outputs:
+  cache-hit:
+    description: Was there a cache hit on the main node_modules?
+    value: ${{ steps.cache-node-modules.outputs.cache-hit }}
+
 runs:
   using: composite
   steps:
diff --git a/.github/workflows/platformDeploy.yml b/.github/workflows/platformDeploy.yml
index 7c7b51240fdb..04de0f5b5deb 100644
--- a/.github/workflows/platformDeploy.yml
+++ b/.github/workflows/platformDeploy.yml
@@ -184,6 +184,7 @@ jobs:
         run: ./scripts/setup-mapbox-sdk.sh ${{ secrets.MAPBOX_SDK_DOWNLOAD_TOKEN }}
 
       - name: Setup Node
+        id: setup-node
         uses: ./.github/actions/composite/setupNode
 
       - name: Setup Ruby
@@ -206,7 +207,7 @@ jobs:
 
       - name: Install cocoapods
         uses: nick-invision/retry@0711ba3d7808574133d713a0d92d2941be03a350
-        if: steps.pods-cache.outputs.cache-hit != 'true' || steps.compare-podfile-and-manifest.outputs.IS_PODFILE_SAME_AS_MANIFEST != 'true'
+        if: steps.pods-cache.outputs.cache-hit != 'true' || steps.compare-podfile-and-manifest.outputs.IS_PODFILE_SAME_AS_MANIFEST != 'true' || steps.setup-node.outputs.cache-hit != 'true'
         with:
           timeout_minutes: 10
           max_attempts: 5

From bc73ef19816feea22f38af3497b477a5081f8781 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Wed, 21 Feb 2024 17:12:41 -0800
Subject: [PATCH 237/305] Fix tag violations for single tags

---
 .../MoneyRequestPreviewContent.tsx            |   2 +-
 .../ReportActionItem/MoneyRequestView.tsx     |  21 +++-
 src/languages/en.ts                           |   2 +-
 src/libs/Violations/ViolationsUtils.ts        | 107 +++++++++++-------
 4 files changed, 85 insertions(+), 47 deletions(-)

diff --git a/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx b/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
index c1a54257df25..41726549b285 100644
--- a/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
+++ b/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
@@ -85,7 +85,7 @@ function MoneyRequestPreviewContent({
     const requestMerchant = truncate(merchant, {length: CONST.REQUEST_PREVIEW.MAX_LENGTH});
     const hasReceipt = TransactionUtils.hasReceipt(transaction);
     const isScanning = hasReceipt && TransactionUtils.isReceiptBeingScanned(transaction);
-    const hasViolations = TransactionUtils.hasViolation(transaction?.transactionID ?? '', transactionViolations);
+    const hasViolations = TransactionUtils.hasViolation(transaction?.transactionID, transactionViolations);
     const hasFieldErrors = TransactionUtils.hasMissingSmartscanFields(transaction);
     const shouldShowRBR = hasViolations || hasFieldErrors;
     const isDistanceRequest = TransactionUtils.isDistanceRequest(transaction);
diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index dc1cbfeb1b8e..3fb993b6a9e8 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -196,7 +196,7 @@ function MoneyRequestView({
     const getPendingFieldAction = (fieldPath: TransactionPendingFieldsKey) => transaction?.pendingFields?.[fieldPath] ?? pendingAction;
 
     const getErrorForField = useCallback(
-        (field: ViolationField) => {
+        (field: ViolationField, data?: OnyxTypes.TransactionViolation['data']) => {
             // Checks applied when creating a new money request
             // NOTE: receipt field can return multiple violations, so we need to handle it separately
             const fieldChecks: Partial<Record<ViolationField, {isError: boolean; translationPath: TranslationPaths}>> = {
@@ -222,9 +222,20 @@ function MoneyRequestView({
             }
 
             // Return violations if there are any
-            if (canUseViolations && hasViolations(field)) {
+            if (canUseViolations && hasViolations(field, data)) {
                 const violations = getViolationsForField(field);
-                return ViolationsUtils.getViolationTranslation(violations[0], translate);
+                for (let i = 0; i < violations.length; i++) {
+                    let violation = violations[i];
+                    if (violation.name === 'someTagLevelsRequired' && violation.data?.errorIndexes?.includes(data.index)) {
+                        violation['data']['tagName'] = data.tagName;
+                        return ViolationsUtils.getViolationTranslation(violation, translate);
+                    } else if (violation.name === 'tagOutOfPolicy' && violation.data?.tagName === data.tagName) {
+                        violation['data']['tagName'] = data.tagName;
+                        return ViolationsUtils.getViolationTranslation(violation, translate);
+                    } else {
+                        return ViolationsUtils.getViolationTranslation(violation, translate);
+                    }
+                }
             }
 
             return '';
@@ -385,8 +396,8 @@ function MoneyRequestView({
                                         ROUTES.MONEY_REQUEST_STEP_TAG.getRoute(CONST.IOU.ACTION.EDIT, CONST.IOU.TYPE.REQUEST, index, transaction?.transactionID ?? '', report.reportID),
                                     )
                                 }
-                                brickRoadIndicator={getErrorForField('tag') ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
-                                error={getErrorForField('tag')}
+                                brickRoadIndicator={getErrorForField('tag', {tagName: name, index}) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
+                                error={getErrorForField('tag', {tagName: name, index})}
                             />
                         </OfflineWithFeedback>
                     ))}
diff --git a/src/languages/en.ts b/src/languages/en.ts
index 0553d6470ddc..f6c389520891 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -2328,7 +2328,7 @@ export default {
             return '';
         },
         smartscanFailed: 'Receipt scanning failed. Enter details manually.',
-        someTagLevelsRequired: 'Missing tag',
+        someTagLevelsRequired: ({tagName}: ViolationsTagOutOfPolicyParams) => `Missing ${tagName ?? 'tag'}`,
         tagOutOfPolicy: ({tagName}: ViolationsTagOutOfPolicyParams) => `${tagName ?? 'Tag'} no longer valid`,
         taxAmountChanged: 'Tax amount was modified',
         taxOutOfPolicy: ({taxName}: ViolationsTaxOutOfPolicyParams) => `${taxName ?? 'Tax'} no longer valid`,
diff --git a/src/libs/Violations/ViolationsUtils.ts b/src/libs/Violations/ViolationsUtils.ts
index 38a30097adc0..cfd5c30d135a 100644
--- a/src/libs/Violations/ViolationsUtils.ts
+++ b/src/libs/Violations/ViolationsUtils.ts
@@ -50,58 +50,85 @@ const ViolationsUtils = {
         }
 
         if (policyRequiresTags) {
-            const selectedTags = updatedTransaction.tag?.split(CONST.COLON) ?? [];
             const policyTagKeys = Object.keys(policyTagList);
-
-            if (policyTagKeys.length === 0) {
-                newTransactionViolations.push({
-                    name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
-                    type: 'violation',
-                });
-            }
-
-            policyTagKeys.forEach((key, index) => {
-                const hasTagOutOfPolicyViolation = transactionViolations.some((violation) => violation.name === CONST.VIOLATIONS.TAG_OUT_OF_POLICY);
-                const hasMissingTagViolation = transactionViolations.some((violation) => violation.name === CONST.VIOLATIONS.MISSING_TAG);
-                const selectedTag = selectedTags[index];
-                const isTagInPolicy = Boolean(policyTagList[key]?.tags[selectedTag]?.enabled);
+            if (policyTagKeys.length === 1) {
+                const policyTagListName = Object.keys(policyTagList)[0];
+                const policyTags = policyTagList[policyTagListName]?.tags;
+                const hasTagOutOfPolicyViolation = transactionViolations.some((violation) => violation.name === 'tagOutOfPolicy');
+                const hasMissingTagViolation = transactionViolations.some((violation) => violation.name === 'missingTag');
+                const isTagInPolicy = policyTags ? !!policyTags[updatedTransaction.tag ?? '']?.enabled : false;
 
                 // Add 'tagOutOfPolicy' violation if tag is not in policy
-                if (!hasTagOutOfPolicyViolation && selectedTag && !isTagInPolicy) {
-                    newTransactionViolations.push({
-                        name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
-                        type: 'violation',
-                        data: {
-                            tagName: key,
-                        },
-                    });
+                if (!hasTagOutOfPolicyViolation && updatedTransaction.tag && !isTagInPolicy) {
+                    newTransactionViolations.push({name: 'tagOutOfPolicy', type: 'violation', userMessage: ''});
                 }
 
                 // Remove 'tagOutOfPolicy' violation if tag is in policy
-                if (hasTagOutOfPolicyViolation && selectedTag && isTagInPolicy) {
-                    newTransactionViolations = reject(newTransactionViolations, {
-                        name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
-                    });
+                if (hasTagOutOfPolicyViolation && updatedTransaction.tag && isTagInPolicy) {
+                    newTransactionViolations = reject(newTransactionViolations, {name: 'tagOutOfPolicy'});
                 }
 
                 // Remove 'missingTag' violation if tag is valid according to policy
                 if (hasMissingTagViolation && isTagInPolicy) {
-                    newTransactionViolations = reject(newTransactionViolations, {
-                        name: CONST.VIOLATIONS.MISSING_TAG,
-                    });
+                    newTransactionViolations = reject(newTransactionViolations, {name: 'missingTag'});
                 }
-
                 // Add 'missingTag violation' if tag is required and not set
-                if (!hasMissingTagViolation && !selectedTag && policyRequiresTags) {
-                    newTransactionViolations.push({
-                        name: CONST.VIOLATIONS.MISSING_TAG,
-                        type: 'violation',
-                        data: {
-                            tagName: key,
-                        },
-                    });
+                if (!hasMissingTagViolation && !updatedTransaction.tag && policyRequiresTags) {
+                    newTransactionViolations.push({name: 'missingTag', type: 'violation', userMessage: ''});
                 }
-            });
+            } else {
+                const selectedTags = updatedTransaction.tag?.split(CONST.COLON) ?? [];
+
+                // if (policyTagKeys.length === 0) {
+                //     newTransactionViolations.push({
+                //         name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
+                //         type: 'violation',
+                //     });
+                // }
+
+                policyTagKeys.forEach((key, index) => {
+                    const hasTagOutOfPolicyViolation = transactionViolations.some((violation) => violation.name === CONST.VIOLATIONS.TAG_OUT_OF_POLICY && violation.data?.tagName === key);
+                    const hasMissingTagViolation = transactionViolations.some((violation) => violation.name === CONST.VIOLATIONS.MISSING_TAG && violation.data?.tagName === key);
+                    const selectedTag = selectedTags[index];
+                    const isTagInPolicy = Boolean(policyTagList[key]?.tags[selectedTag]?.enabled);
+
+                    // Add 'tagOutOfPolicy' violation if tag is not in policy
+                    if (!hasTagOutOfPolicyViolation && selectedTag && !isTagInPolicy) {
+                        newTransactionViolations.push({
+                            name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
+                            type: 'violation',
+                            data: {
+                                tagName: key,
+                            },
+                        });
+                    }
+
+                    // Remove 'tagOutOfPolicy' violation if tag is in policy
+                    if (hasTagOutOfPolicyViolation && selectedTag && isTagInPolicy) {
+                        newTransactionViolations = reject(newTransactionViolations, {
+                            name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
+                        });
+                    }
+
+                    // Remove 'missingTag' violation if tag is valid according to policy
+                    if (hasMissingTagViolation && isTagInPolicy) {
+                        newTransactionViolations = reject(newTransactionViolations, {
+                            name: CONST.VIOLATIONS.MISSING_TAG,
+                        });
+                    }
+
+                    // Add 'missingTag violation' if tag is required and not set
+                    if (!hasMissingTagViolation && !selectedTag && policyRequiresTags) {
+                        newTransactionViolations.push({
+                            name: CONST.VIOLATIONS.MISSING_TAG,
+                            type: 'violation',
+                            data: {
+                                tagName: key,
+                            },
+                        });
+                    }
+                });
+            }
         }
 
         return {
@@ -204,7 +231,7 @@ const ViolationsUtils = {
             case 'smartscanFailed':
                 return translate('violations.smartscanFailed');
             case 'someTagLevelsRequired':
-                return translate('violations.someTagLevelsRequired');
+                return translate('violations.someTagLevelsRequired', {tagName});
             case 'tagOutOfPolicy':
                 return translate('violations.tagOutOfPolicy', {tagName});
             case 'taxAmountChanged':

From 0f8e3cb0ef263d4a6b7656791c97709cceb97847 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Thu, 22 Feb 2024 12:44:14 +0800
Subject: [PATCH 238/305] get the report id correctly

---
 .../HTMLRenderers/VideoRenderer.tsx           | 32 ++++++++++---------
 1 file changed, 17 insertions(+), 15 deletions(-)

diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/VideoRenderer.tsx b/src/components/HTMLEngineProvider/HTMLRenderers/VideoRenderer.tsx
index 2e47b97ec7af..43d1be85d21a 100644
--- a/src/components/HTMLEngineProvider/HTMLRenderers/VideoRenderer.tsx
+++ b/src/components/HTMLEngineProvider/HTMLRenderers/VideoRenderer.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
 import type {CustomRendererProps, TBlock} from 'react-native-render-html';
+import {ShowContextMenuContext} from '@components/ShowContextMenuContext';
 import VideoPlayerPreview from '@components/VideoPlayerPreview';
 import * as FileUtils from '@libs/fileDownload/FileUtils';
-import {parseReportRouteParams} from '@libs/ReportUtils';
 import tryResolveUrlFromApiRoot from '@libs/tryResolveUrlFromApiRoot';
 import Navigation from '@navigation/Navigation';
 import CONST from '@src/CONST';
@@ -22,22 +22,24 @@ function VideoRenderer({tnode, key}: VideoRendererProps) {
     const width = Number(htmlAttribs[CONST.ATTACHMENT_THUMBNAIL_WIDTH_ATTRIBUTE]);
     const height = Number(htmlAttribs[CONST.ATTACHMENT_THUMBNAIL_HEIGHT_ATTRIBUTE]);
     const duration = Number(htmlAttribs[CONST.ATTACHMENT_DURATION_ATTRIBUTE]);
-    const activeRoute = Navigation.getActiveRoute();
-    const {reportID} = parseReportRouteParams(activeRoute);
 
     return (
-        <VideoPlayerPreview
-            key={key}
-            videoUrl={sourceURL}
-            fileName={fileName}
-            thumbnailUrl={thumbnailUrl}
-            videoDimensions={{width, height}}
-            videoDuration={duration}
-            onShowModalPress={() => {
-                const route = ROUTES.REPORT_ATTACHMENTS.getRoute(reportID, sourceURL);
-                Navigation.navigate(route);
-            }}
-        />
+        <ShowContextMenuContext.Consumer>
+            {({report}) => (
+                <VideoPlayerPreview
+                    key={key}
+                    videoUrl={sourceURL}
+                    fileName={fileName}
+                    thumbnailUrl={thumbnailUrl}
+                    videoDimensions={{width, height}}
+                    videoDuration={duration}
+                    onShowModalPress={() => {
+                        const route = ROUTES.REPORT_ATTACHMENTS.getRoute(report?.reportID ?? '', sourceURL);
+                        Navigation.navigate(route);
+                    }}
+                />
+            )}
+        </ShowContextMenuContext.Consumer>
     );
 }
 

From fad95a3bf0c7959b74d0fd5b7850414353d9514c Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Thu, 22 Feb 2024 13:06:52 +0800
Subject: [PATCH 239/305] get current user account id from
 currentUserPersonalDetails

---
 src/pages/home/sidebar/SidebarLinksData.js | 17 ++++++-----------
 1 file changed, 6 insertions(+), 11 deletions(-)

diff --git a/src/pages/home/sidebar/SidebarLinksData.js b/src/pages/home/sidebar/SidebarLinksData.js
index 828077097580..c172b07f3ab4 100644
--- a/src/pages/home/sidebar/SidebarLinksData.js
+++ b/src/pages/home/sidebar/SidebarLinksData.js
@@ -9,7 +9,7 @@ import _ from 'underscore';
 import networkPropTypes from '@components/networkPropTypes';
 import {withNetwork} from '@components/OnyxProvider';
 import withCurrentReportID from '@components/withCurrentReportID';
-import withCurrentUserPersonalDetails from '@components/withCurrentUserPersonalDetails';
+import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails';
 import withNavigationFocus from '@components/withNavigationFocus';
 import useActiveWorkspace from '@hooks/useActiveWorkspace';
 import useLocalize from '@hooks/useLocalize';
@@ -68,11 +68,6 @@ const propTypes = {
     // eslint-disable-next-line react/forbid-prop-types
     policyMembers: PropTypes.object,
 
-    /** Session info for the currently logged in user. */
-    session: PropTypes.shape({
-        /** Currently logged in user accountID */
-        accountID: PropTypes.number,
-    }),
     /** All of the transaction violations */
     transactionViolations: PropTypes.shape({
         violations: PropTypes.arrayOf(
@@ -97,6 +92,8 @@ const propTypes = {
             }),
         ),
     }),
+
+    ...withCurrentUserPersonalDetailsPropTypes,
 };
 
 const defaultProps = {
@@ -106,11 +103,9 @@ const defaultProps = {
     betas: [],
     policies: {},
     policyMembers: {},
-    session: {
-        accountID: '',
-    },
     transactionViolations: {},
     allReportActions: {},
+    ...withCurrentUserPersonalDetailsDefaultProps,
 };
 
 function SidebarLinksData({
@@ -126,15 +121,15 @@ function SidebarLinksData({
     priorityMode,
     network,
     policyMembers,
-    session: {accountID},
     transactionViolations,
+    currentUserPersonalDetails,
 }) {
     const styles = useThemeStyles();
     const {activeWorkspaceID} = useActiveWorkspace();
     const {translate} = useLocalize();
     const prevPriorityMode = usePrevious(priorityMode);
 
-    const policyMemberAccountIDs = getPolicyMembersByIdWithoutCurrentUser(policyMembers, activeWorkspaceID, accountID);
+    const policyMemberAccountIDs = getPolicyMembersByIdWithoutCurrentUser(policyMembers, activeWorkspaceID, currentUserPersonalDetails.accountID);
 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     useEffect(() => Policy.openWorkspace(activeWorkspaceID, policyMemberAccountIDs), [activeWorkspaceID]);

From 8b5e067d1f41535ebb093e0832d39ee22973bd81 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 22 Feb 2024 09:11:21 +0100
Subject: [PATCH 240/305] use app styles

---
 .../workflows/ToggleSettingsOptionRow.tsx     | 59 ++++++-------------
 .../workflows/WorkspaceWorkflowsPage.tsx      | 53 ++++-------------
 src/styles/index.ts                           | 17 ++++++
 src/styles/utils/spacing.ts                   |  8 +++
 4 files changed, 55 insertions(+), 82 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index deb467ae0c76..eaf67557a016 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -4,9 +4,7 @@ import type {SvgProps} from 'react-native-svg';
 import Icon from '@components/Icon';
 import Switch from '@components/Switch';
 import Text from '@components/Text';
-import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
-import type {Styles} from '@styles/index';
 
 type ToggleSettingOptionRowProps = {
     icon: React.FC<SvgProps>;
@@ -20,59 +18,36 @@ type ToggleSettingOptionRowProps = {
 function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, hasBeenToggled}: ToggleSettingOptionRowProps) {
     const [isEnabled, setIsEnabled] = useState(hasBeenToggled);
     const styles = useThemeStyles();
-    const theme = useTheme();
     const ICON_SIZE = 48;
     const toggleSwitch = () => {
         setIsEnabled(!isEnabled);
         onToggle(!isEnabled);
     };
 
-    // Since these styles are only used in this component we define them here
-    const workflowsStyles = {
-        container: {
-            flexDirection: 'row',
-            alignItems: 'center',
-            justifyContent: 'space-between',
-        },
-        content: {
-            flexDirection: 'row',
-            alignItems: 'center',
-            flex: 1,
-        },
-        icon: {
-            marginRight: 12,
-            zIndex: 2,
-            paddingBottom: 15,
-        },
-        wrapperText: {
-            flexDirection: 'column',
-            flex: 1,
-        },
-        heading: {
-            fontSize: 15,
-            fontWeight: '700',
-        },
-        subtitle: {
-            fontSize: 13,
-            color: theme.textSupporting,
-            marginTop: 3,
-            marginRight: 20,
-        },
-    } satisfies Styles;
-
     return (
         <View style={styles.pRelative}>
-            <View style={workflowsStyles.container}>
-                <View style={workflowsStyles.content}>
+            <View style={[styles.flexRow, styles.alignItemsCenter, styles.justifyContentBetween]}>
+                <View style={[styles.flexRow, styles.alignItemsCenter, styles.flex1]}>
                     <Icon
                         src={icon}
                         height={ICON_SIZE}
                         width={ICON_SIZE}
-                        additionalStyles={workflowsStyles.icon}
+                        additionalStyles={{
+                            ...styles.mr3,
+                            ...styles.pb4,
+                        }}
                     />
-                    <View style={workflowsStyles.wrapperText}>
-                        <Text style={workflowsStyles.heading}>{title}</Text>
-                        <Text style={workflowsStyles.subtitle}>{subtitle}</Text>
+                    <View style={[styles.flexColumn, styles.flex1]}>
+                        <Text style={{
+                            ...styles.textMicroBold,
+                            ...styles.textNormal,
+                        }}>{title}</Text>
+                        <Text style={{
+                            ...styles.textLabel,
+                            ...styles.mt1,
+                            ...styles.mr5,
+                            ...styles.textSupporting,
+                        }}>{subtitle}</Text>
                     </View>
                 </View>
                 <View>
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 390afc7be492..52706cb261d3 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -6,7 +6,6 @@ import MenuItem from '@components/MenuItem';
 import Section from '@components/Section';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
-import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import * as OptionsListUtils from '@libs/OptionsListUtils';
@@ -15,9 +14,6 @@ import type {CentralPaneNavigatorParamList} from '@navigation/types';
 import withPolicy from '@pages/workspace/withPolicy';
 import type {WithPolicyProps} from '@pages/workspace/withPolicy';
 import WorkspacePageWithSections from '@pages/workspace/WorkspacePageWithSections';
-import type {Styles} from '@styles/index';
-// eslint-disable-next-line no-restricted-imports
-import spacing from '@styles/utils/spacing';
 import * as Policy from '@userActions/Policy';
 import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
@@ -30,7 +26,6 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const {isSmallScreenWidth} = useWindowDimensions();
-    const theme = useTheme();
 
     const [policyOwnerDisplayName, setPolicyOwnerDisplayName] = useState('');
 
@@ -44,31 +39,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
         }
     }, [policy]);
 
-    // Since these styles are only used in this component we define them here
-    const workflowsStyles = {
-        subMenuContainer: {
-            ...spacing.ph8,
-            ...spacing.mhn8,
-            width: 'auto',
-            marginLeft: 44,
-            paddingVertical: 12,
-            paddingRight: 9,
-            paddingLeft: 16,
-            marginRight: 0,
-            marginTop: 14,
-        },
-        subMenuTitle: {
-            color: theme.textSupporting,
-            fontSize: 13,
-            lineHeight: 16,
-            fontWeight: '400',
-        },
-        subMenuDescription: {
-            color: theme.text,
-            fontSize: 15,
-            lineHeight: 20,
-        },
-    } satisfies Styles;
+    const containerStyle = [styles.ph8, styles.mhn8, styles.ml11, styles.pv3, styles.pr0, styles.pl4, styles.mr0, styles.widthAuto, styles.mt4];
 
     const items: ToggleSettingOptionRowProps[] = useMemo(
         () => [
@@ -82,13 +53,14 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 subMenuItems: (
                     <MenuItem
                         title={translate('workflowsPage.submissionFrequency')}
-                        titleStyle={workflowsStyles.subMenuTitle}
-                        descriptionTextStyle={workflowsStyles.subMenuDescription}
+                        titleStyle={styles.textLabelSupportingNormal}
+                        descriptionTextStyle={styles.textNormalThemeText}
                         // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_AUTOREPORTING_FREQUENCY).getRoute(route.params.policyID))}
                         // TODO will be done in https://github.com/Expensify/Expensify/issues/368332
                         description={translate('workflowsPage.weeklyFrequency')}
                         shouldShowRightIcon
-                        wrapperStyle={workflowsStyles.subMenuContainer}
+                        wrapperStyle={containerStyle}
+                        // wrapperStyle={workflowsStyles.subMenuContainer}
                         hoverAndPressStyle={[styles.mr0, styles.br2]}
                     />
                 ),
@@ -104,13 +76,13 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 subMenuItems: (
                     <MenuItem
                         title={translate('workflowsPage.approver')}
-                        titleStyle={workflowsStyles.subMenuTitle}
-                        descriptionTextStyle={workflowsStyles.subMenuDescription}
+                        titleStyle={styles.textLabelSupportingNormal}
+                        descriptionTextStyle={styles.textNormalThemeText}
                         description={policyOwnerDisplayName ?? ''}
                         // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
                         // TODO will be done in https://github.com/Expensify/Expensify/issues/368334
                         shouldShowRightIcon
-                        wrapperStyle={workflowsStyles.subMenuContainer}
+                        wrapperStyle={containerStyle}
                         hoverAndPressStyle={[styles.mr0, styles.br2]}
                     />
                 ),
@@ -125,20 +97,20 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 },
                 subMenuItems: (
                     <MenuItem
-                        descriptionTextStyle={[workflowsStyles.subMenuDescription, styles.textSupporting]}
+                        descriptionTextStyle={[styles.textNormal, styles.textSupporting]}
                         description={translate('workflowsPage.connectBankAccount')}
                         // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
                         // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
                         shouldShowRightIcon
-                        wrapperStyle={workflowsStyles.subMenuContainer}
+                        wrapperStyle={containerStyle}
                         hoverAndPressStyle={[styles.mr0, styles.br2]}
                     />
                 ),
                 isEndOptionRow: true,
-                hasBeenToggled: false, // TODO make it dynamic when VBBA action is implemented
+                hasBeenToggled: false, // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
             },
         ],
-        [policy, route.params.policyID, styles, translate, workflowsStyles.subMenuContainer, workflowsStyles.subMenuDescription, workflowsStyles.subMenuTitle, policyOwnerDisplayName],
+        [policy, route.params.policyID, styles, translate, policyOwnerDisplayName],
     );
 
     const renderItem = ({item}: {item: ToggleSettingOptionRowProps}) => (
@@ -187,3 +159,4 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
 WorkspaceWorkflowsPage.displayName = 'WorkspaceWorkflowsPage';
 
 export default withPolicy(WorkspaceWorkflowsPage);
+
diff --git a/src/styles/index.ts b/src/styles/index.ts
index a02a82fffce6..3b36f6c87169 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -400,6 +400,11 @@ const styles = (theme: ThemeColors) =>
             fontSize: variables.fontSizeNormal,
         },
 
+        textNormalThemeText : {
+            color: theme.text,
+            fontSize: variables.fontSizeNormal,
+        },
+
         textLarge: {
             fontSize: variables.fontSizeLarge,
         },
@@ -1235,6 +1240,13 @@ const styles = (theme: ThemeColors) =>
             color: theme.textSupporting,
         },
 
+        textLabelSupportingNormal: {
+            fontFamily: FontUtils.fontFamily.platform.EXP_NEUE,
+            fontSize: variables.fontSizeLabel,
+            color: theme.textSupporting,
+            fontWeight: FontUtils.fontWeight.normal,
+        },
+
         textLabelError: {
             fontFamily: FontUtils.fontFamily.platform.EXP_NEUE,
             fontSize: variables.fontSizeLabel,
@@ -4578,6 +4590,11 @@ const styles = (theme: ThemeColors) =>
         updateRequiredViewTextContainer: {
             width: variables.updateTextViewContainerWidth,
         },
+
+        widthAuto: {
+            width: 'auto',
+        },
+
         workspaceTitleStyle: {
             fontFamily: FontUtils.fontFamily.platform.EXP_NEUE_BOLD,
             fontWeight: '500',
diff --git a/src/styles/utils/spacing.ts b/src/styles/utils/spacing.ts
index b4a6296507a4..e08c461aae2c 100644
--- a/src/styles/utils/spacing.ts
+++ b/src/styles/utils/spacing.ts
@@ -179,6 +179,10 @@ export default {
         marginLeft: 40,
     },
 
+    ml11: {
+        marginLeft: 44,
+    },
+
     ml18: {
         marginLeft: 72,
     },
@@ -477,6 +481,10 @@ export default {
         paddingLeft: 12,
     },
 
+    pl4: {
+        paddingLeft: 16,
+    },
+
     pl5: {
         paddingLeft: 20,
     },

From 69e823e99f380418802c2394a942b0036431eb44 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 22 Feb 2024 09:13:32 +0100
Subject: [PATCH 241/305] fix prettier

---
 .../workflows/ToggleSettingsOptionRow.tsx     | 28 ++++++++++++-------
 .../workflows/WorkspaceWorkflowsPage.tsx      |  3 +-
 src/styles/index.ts                           |  2 +-
 3 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index eaf67557a016..49e970f45c1f 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -38,16 +38,24 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
                         }}
                     />
                     <View style={[styles.flexColumn, styles.flex1]}>
-                        <Text style={{
-                            ...styles.textMicroBold,
-                            ...styles.textNormal,
-                        }}>{title}</Text>
-                        <Text style={{
-                            ...styles.textLabel,
-                            ...styles.mt1,
-                            ...styles.mr5,
-                            ...styles.textSupporting,
-                        }}>{subtitle}</Text>
+                        <Text
+                            style={{
+                                ...styles.textMicroBold,
+                                ...styles.textNormal,
+                            }}
+                        >
+                            {title}
+                        </Text>
+                        <Text
+                            style={{
+                                ...styles.textLabel,
+                                ...styles.mt1,
+                                ...styles.mr5,
+                                ...styles.textSupporting,
+                            }}
+                        >
+                            {subtitle}
+                        </Text>
                     </View>
                 </View>
                 <View>
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 52706cb261d3..575a31ae7525 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -110,7 +110,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 hasBeenToggled: false, // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
             },
         ],
-        [policy, route.params.policyID, styles, translate, policyOwnerDisplayName],
+        [policy, route.params.policyID, styles, translate, policyOwnerDisplayName, containerStyle],
     );
 
     const renderItem = ({item}: {item: ToggleSettingOptionRowProps}) => (
@@ -159,4 +159,3 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
 WorkspaceWorkflowsPage.displayName = 'WorkspaceWorkflowsPage';
 
 export default withPolicy(WorkspaceWorkflowsPage);
-
diff --git a/src/styles/index.ts b/src/styles/index.ts
index 3b36f6c87169..adb8dec21056 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -400,7 +400,7 @@ const styles = (theme: ThemeColors) =>
             fontSize: variables.fontSizeNormal,
         },
 
-        textNormalThemeText : {
+        textNormalThemeText: {
             color: theme.text,
             fontSize: variables.fontSizeNormal,
         },

From b7069fbea3b313cae81c2df9dfb96b3b4d4aa0e3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 22 Feb 2024 09:20:53 +0100
Subject: [PATCH 242/305] use useMemo

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 575a31ae7525..81d6bca143d5 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -39,8 +39,8 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
         }
     }, [policy]);
 
-    const containerStyle = [styles.ph8, styles.mhn8, styles.ml11, styles.pv3, styles.pr0, styles.pl4, styles.mr0, styles.widthAuto, styles.mt4];
-
+    const containerStyle = useMemo(() => [styles.ph8, styles.mhn8, styles.ml11, styles.pv3, styles.pr0, styles.pl4, styles.mr0, styles.widthAuto, styles.mt4], [styles]);
+    
     const items: ToggleSettingOptionRowProps[] = useMemo(
         () => [
             {

From 2980a924e18c80843a107b5d8f160c8fb6e8dd69 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 22 Feb 2024 09:28:00 +0100
Subject: [PATCH 243/305] fix prettier

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 81d6bca143d5..71dd14c0d18d 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -40,7 +40,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     }, [policy]);
 
     const containerStyle = useMemo(() => [styles.ph8, styles.mhn8, styles.ml11, styles.pv3, styles.pr0, styles.pl4, styles.mr0, styles.widthAuto, styles.mt4], [styles]);
-    
+
     const items: ToggleSettingOptionRowProps[] = useMemo(
         () => [
             {

From 0bc177d5c9767173d324c9d6a113eafb476e61fe Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Thu, 22 Feb 2024 10:42:27 +0100
Subject: [PATCH 244/305] Replace module.exports with export

---
 tests/e2e/utils/logger.js | 10 +---------
 1 file changed, 1 insertion(+), 9 deletions(-)

diff --git a/tests/e2e/utils/logger.js b/tests/e2e/utils/logger.js
index d0770b7aa8e4..6a39b4c10328 100644
--- a/tests/e2e/utils/logger.js
+++ b/tests/e2e/utils/logger.js
@@ -66,12 +66,4 @@ const error = (...args) => {
     log(...lines);
 };
 
-module.exports = {
-    log,
-    info,
-    warn,
-    note,
-    error,
-    success,
-    writeToLogFile,
-};
+export {log, info, warn, note, error, success, writeToLogFile};

From cd548b592d74b6ce80328d8cd2787fb59d69dbf7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 22 Feb 2024 15:07:20 +0100
Subject: [PATCH 245/305] add additional style for offline styling use case

---
 src/components/Switch.tsx | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/components/Switch.tsx b/src/components/Switch.tsx
index fd9d9ae315ff..b0dedc01b086 100644
--- a/src/components/Switch.tsx
+++ b/src/components/Switch.tsx
@@ -1,5 +1,5 @@
 import React, {useEffect, useRef} from 'react';
-import {Animated} from 'react-native';
+import {Animated, ViewStyle} from 'react-native';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useNativeDriver from '@libs/useNativeDriver';
 import CONST from '@src/CONST';
@@ -14,6 +14,8 @@ type SwitchProps = {
 
     /** Accessibility label for the switch */
     accessibilityLabel: string;
+
+    additionalStyle?: ViewStyle;
 };
 
 const OFFSET_X = {
@@ -21,7 +23,7 @@ const OFFSET_X = {
     ON: 20,
 };
 
-function Switch({isOn, onToggle, accessibilityLabel}: SwitchProps) {
+function Switch({isOn, onToggle, accessibilityLabel, additionalStyle}: SwitchProps) {
     const styles = useThemeStyles();
     const offsetX = useRef(new Animated.Value(isOn ? OFFSET_X.ON : OFFSET_X.OFF));
 
@@ -35,7 +37,7 @@ function Switch({isOn, onToggle, accessibilityLabel}: SwitchProps) {
 
     return (
         <PressableWithFeedback
-            style={[styles.switchTrack, !isOn && styles.switchInactive]}
+            style={[styles.switchTrack, !isOn && styles.switchInactive, additionalStyle]}
             onPress={() => onToggle(!isOn)}
             onLongPress={() => onToggle(!isOn)}
             role={CONST.ROLE.SWITCH}

From b52a759a988a5f0de4434ade3928455e0986a8a5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 22 Feb 2024 15:08:49 +0100
Subject: [PATCH 246/305] handle offline workflows

---
 .../workflows/ToggleSettingsOptionRow.tsx          |  9 +++++++++
 .../workspace/workflows/WorkspaceWorkflowsPage.tsx | 14 +++++++++-----
 src/styles/index.ts                                |  4 ++++
 src/styles/utils/index.ts                          |  6 ++++++
 4 files changed, 28 insertions(+), 5 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 49e970f45c1f..1414b86afc06 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -5,6 +5,7 @@ import Icon from '@components/Icon';
 import Switch from '@components/Switch';
 import Text from '@components/Text';
 import useThemeStyles from '@hooks/useThemeStyles';
+import useNetwork from '@hooks/useNetwork';
 
 type ToggleSettingOptionRowProps = {
     icon: React.FC<SvgProps>;
@@ -17,9 +18,16 @@ type ToggleSettingOptionRowProps = {
 
 function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, hasBeenToggled}: ToggleSettingOptionRowProps) {
     const [isEnabled, setIsEnabled] = useState(hasBeenToggled);
+    const [shouldShowOfflineStyle, setShouldShowOfflineStyle] = useState(false);
     const styles = useThemeStyles();
+    const {isOffline} = useNetwork();
     const ICON_SIZE = 48;
     const toggleSwitch = () => {
+        if (isEnabled && isOffline) {
+            setShouldShowOfflineStyle(true);
+        } else {
+            setShouldShowOfflineStyle(false);
+        }
         setIsEnabled(!isEnabled);
         onToggle(!isEnabled);
     };
@@ -63,6 +71,7 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
                         accessibilityLabel={subtitle}
                         onToggle={toggleSwitch}
                         isOn={isEnabled}
+                        additionalStyle={shouldShowOfflineStyle ? styles.buttonOpacityDisabled : styles.opacity1}
                     />
                 </View>
             </View>
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 71dd14c0d18d..735497a7fc5e 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -19,13 +19,17 @@ import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
 import ToggleSettingOptionRow from './ToggleSettingsOptionRow';
 import type {ToggleSettingOptionRowProps} from './ToggleSettingsOptionRow';
+import useNetwork from '@hooks/useNetwork';
+import useStyleUtils from '@hooks/useStyleUtils';
 
 type WorkspaceWorkflowsPageProps = WithPolicyProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
 
 function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
+    const StyleUtils = useStyleUtils();
     const {isSmallScreenWidth} = useWindowDimensions();
+    const {isOffline} = useNetwork();
 
     const [policyOwnerDisplayName, setPolicyOwnerDisplayName] = useState('');
 
@@ -54,7 +58,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     <MenuItem
                         title={translate('workflowsPage.submissionFrequency')}
                         titleStyle={styles.textLabelSupportingNormal}
-                        descriptionTextStyle={styles.textNormalThemeText}
+                        descriptionTextStyle={isOffline ? StyleUtils.getWorkspaceWorkflowsOfflineDescriptionStyle(styles.textNormalThemeText) : styles.textNormalThemeText}
                         // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_AUTOREPORTING_FREQUENCY).getRoute(route.params.policyID))}
                         // TODO will be done in https://github.com/Expensify/Expensify/issues/368332
                         description={translate('workflowsPage.weeklyFrequency')}
@@ -77,7 +81,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     <MenuItem
                         title={translate('workflowsPage.approver')}
                         titleStyle={styles.textLabelSupportingNormal}
-                        descriptionTextStyle={styles.textNormalThemeText}
+                        descriptionTextStyle={isOffline ? StyleUtils.getWorkspaceWorkflowsOfflineDescriptionStyle(styles.textNormalThemeText) : styles.textNormalThemeText}
                         description={policyOwnerDisplayName ?? ''}
                         // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
                         // TODO will be done in https://github.com/Expensify/Expensify/issues/368334
@@ -97,8 +101,8 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 },
                 subMenuItems: (
                     <MenuItem
-                        descriptionTextStyle={[styles.textNormal, styles.textSupporting]}
-                        description={translate('workflowsPage.connectBankAccount')}
+                    descriptionTextStyle={isOffline ? StyleUtils.getWorkspaceWorkflowsOfflineDescriptionStyle([styles.textNormal, styles.textSupporting]) : [styles.textNormal, styles.textSupporting]}
+                    description={translate('workflowsPage.connectBankAccount')}
                         // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
                         // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
                         shouldShowRightIcon
@@ -110,7 +114,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 hasBeenToggled: false, // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
             },
         ],
-        [policy, route.params.policyID, styles, translate, policyOwnerDisplayName, containerStyle],
+        [policy, route.params.policyID, styles, translate, policyOwnerDisplayName, containerStyle, isOffline],
     );
 
     const renderItem = ({item}: {item: ToggleSettingOptionRowProps}) => (
diff --git a/src/styles/index.ts b/src/styles/index.ts
index adb8dec21056..31f25ff4147e 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -492,6 +492,10 @@ const styles = (theme: ThemeColors) =>
             opacity: 0,
         },
 
+        opacitySemiTransparent: {
+            opacity: 0.5,
+        },
+
         opacity1: {
             opacity: 1,
         },
diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index a0edb7fd4e23..e5eb9aa9347f 100644
--- a/src/styles/utils/index.ts
+++ b/src/styles/utils/index.ts
@@ -1474,6 +1474,11 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
     },
 
     getFullscreenCenteredContentStyles: () => [StyleSheet.absoluteFill, styles.justifyContentCenter, styles.alignItemsCenter],
+
+    getWorkspaceWorkflowsOfflineDescriptionStyle: (descriptionTextStyle: TextStyle|TextStyle[]): StyleProp<TextStyle> => ({
+        ...StyleSheet.flatten(descriptionTextStyle),
+        opacity: styles.opacitySemiTransparent.opacity,
+    }),
 });
 
 type StyleUtilsType = ReturnType<typeof createStyleUtils>;
@@ -1483,3 +1488,4 @@ const DefaultStyleUtils = createStyleUtils(defaultTheme, defaultStyles);
 export default createStyleUtils;
 export {DefaultStyleUtils};
 export type {StyleUtilsType, AvatarSizeName};
+

From 804a68f4350c33f3aa711aefaa9f1f2e58b5788f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 22 Feb 2024 15:11:19 +0100
Subject: [PATCH 247/305] lint and prettier

---
 src/components/Switch.tsx                            |  3 ++-
 .../workspace/workflows/ToggleSettingsOptionRow.tsx  |  2 +-
 .../workspace/workflows/WorkspaceWorkflowsPage.tsx   | 12 +++++++-----
 src/styles/utils/index.ts                            |  3 +--
 4 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/src/components/Switch.tsx b/src/components/Switch.tsx
index b0dedc01b086..7bcd30347c8b 100644
--- a/src/components/Switch.tsx
+++ b/src/components/Switch.tsx
@@ -1,5 +1,6 @@
 import React, {useEffect, useRef} from 'react';
-import {Animated, ViewStyle} from 'react-native';
+import {Animated} from 'react-native';
+import type {ViewStyle} from 'react-native';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useNativeDriver from '@libs/useNativeDriver';
 import CONST from '@src/CONST';
diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 1414b86afc06..8c4068f9bd6d 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -4,8 +4,8 @@ import type {SvgProps} from 'react-native-svg';
 import Icon from '@components/Icon';
 import Switch from '@components/Switch';
 import Text from '@components/Text';
-import useThemeStyles from '@hooks/useThemeStyles';
 import useNetwork from '@hooks/useNetwork';
+import useThemeStyles from '@hooks/useThemeStyles';
 
 type ToggleSettingOptionRowProps = {
     icon: React.FC<SvgProps>;
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 735497a7fc5e..da204a580ce4 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -6,6 +6,8 @@ import MenuItem from '@components/MenuItem';
 import Section from '@components/Section';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
+import useNetwork from '@hooks/useNetwork';
+import useStyleUtils from '@hooks/useStyleUtils';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import * as OptionsListUtils from '@libs/OptionsListUtils';
@@ -19,8 +21,6 @@ import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
 import ToggleSettingOptionRow from './ToggleSettingsOptionRow';
 import type {ToggleSettingOptionRowProps} from './ToggleSettingsOptionRow';
-import useNetwork from '@hooks/useNetwork';
-import useStyleUtils from '@hooks/useStyleUtils';
 
 type WorkspaceWorkflowsPageProps = WithPolicyProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.WORKFLOWS>;
 
@@ -101,8 +101,10 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 },
                 subMenuItems: (
                     <MenuItem
-                    descriptionTextStyle={isOffline ? StyleUtils.getWorkspaceWorkflowsOfflineDescriptionStyle([styles.textNormal, styles.textSupporting]) : [styles.textNormal, styles.textSupporting]}
-                    description={translate('workflowsPage.connectBankAccount')}
+                        descriptionTextStyle={
+                            isOffline ? StyleUtils.getWorkspaceWorkflowsOfflineDescriptionStyle([styles.textNormal, styles.textSupporting]) : [styles.textNormal, styles.textSupporting]
+                        }
+                        description={translate('workflowsPage.connectBankAccount')}
                         // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_CONNECT_BANK_ACCOUNT.getRoute(route.params.policyID))}
                         // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
                         shouldShowRightIcon
@@ -114,7 +116,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 hasBeenToggled: false, // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
             },
         ],
-        [policy, route.params.policyID, styles, translate, policyOwnerDisplayName, containerStyle, isOffline],
+        [policy, route.params.policyID, styles, translate, policyOwnerDisplayName, containerStyle, isOffline, StyleUtils],
     );
 
     const renderItem = ({item}: {item: ToggleSettingOptionRowProps}) => (
diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index e5eb9aa9347f..82159c9d6661 100644
--- a/src/styles/utils/index.ts
+++ b/src/styles/utils/index.ts
@@ -1475,7 +1475,7 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
 
     getFullscreenCenteredContentStyles: () => [StyleSheet.absoluteFill, styles.justifyContentCenter, styles.alignItemsCenter],
 
-    getWorkspaceWorkflowsOfflineDescriptionStyle: (descriptionTextStyle: TextStyle|TextStyle[]): StyleProp<TextStyle> => ({
+    getWorkspaceWorkflowsOfflineDescriptionStyle: (descriptionTextStyle: TextStyle | TextStyle[]): StyleProp<TextStyle> => ({
         ...StyleSheet.flatten(descriptionTextStyle),
         opacity: styles.opacitySemiTransparent.opacity,
     }),
@@ -1488,4 +1488,3 @@ const DefaultStyleUtils = createStyleUtils(defaultTheme, defaultStyles);
 export default createStyleUtils;
 export {DefaultStyleUtils};
 export type {StyleUtilsType, AvatarSizeName};
-

From e92e7c97410d0e94386853a70fe354c98a198693 Mon Sep 17 00:00:00 2001
From: Blazej Kustra <blazej.kustra@swmansion.com>
Date: Thu, 22 Feb 2024 16:05:04 +0100
Subject: [PATCH 248/305] [TS migration] Migrate 'Alert' component to
 TypeScript

---
 src/components/Alert/index.js                 | 24 -------------------
 src/components/Alert/index.native.js          |  3 ---
 src/components/Alert/index.native.tsx         |  6 +++++
 src/components/Alert/index.tsx                | 19 +++++++++++++++
 src/components/Alert/types.ts                 |  5 ++++
 .../FloatingActionButtonAndPopover.js         |  4 ++++
 6 files changed, 34 insertions(+), 27 deletions(-)
 delete mode 100644 src/components/Alert/index.js
 delete mode 100644 src/components/Alert/index.native.js
 create mode 100644 src/components/Alert/index.native.tsx
 create mode 100644 src/components/Alert/index.tsx
 create mode 100644 src/components/Alert/types.ts

diff --git a/src/components/Alert/index.js b/src/components/Alert/index.js
deleted file mode 100644
index 3fc90433f13e..000000000000
--- a/src/components/Alert/index.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import _ from 'underscore';
-
-/**
- * Shows an alert modal with ok and cancel options.
- *
- * @param {String} title The title of the alert
- * @param {String} description The description of the alert
- * @param {Object[]} [options] An array of objects with `style` and `onPress` properties
- */
-export default (title, description, options) => {
-    const result = _.filter(window.confirm([title, description], Boolean)).join('\n');
-
-    if (result) {
-        const confirmOption = _.find(options, ({style}) => style !== 'cancel');
-        if (confirmOption && confirmOption.onPress) {
-            confirmOption.onPress();
-        }
-    } else {
-        const cancelOption = _.find(options, ({style}) => style === 'cancel');
-        if (cancelOption && cancelOption.onPress) {
-            cancelOption.onPress();
-        }
-    }
-};
diff --git a/src/components/Alert/index.native.js b/src/components/Alert/index.native.js
deleted file mode 100644
index 31c837a7dd6b..000000000000
--- a/src/components/Alert/index.native.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import {Alert} from 'react-native';
-
-export default Alert.alert;
diff --git a/src/components/Alert/index.native.tsx b/src/components/Alert/index.native.tsx
new file mode 100644
index 000000000000..b72eff5d9b58
--- /dev/null
+++ b/src/components/Alert/index.native.tsx
@@ -0,0 +1,6 @@
+import {Alert as AlertRN} from 'react-native';
+import type Alert from './types';
+
+const alert: Alert = AlertRN.alert;
+
+export default alert;
diff --git a/src/components/Alert/index.tsx b/src/components/Alert/index.tsx
new file mode 100644
index 000000000000..8cb495913fae
--- /dev/null
+++ b/src/components/Alert/index.tsx
@@ -0,0 +1,19 @@
+import type Alert from './types';
+
+/** Shows an alert modal with ok and cancel options. */
+const alert: Alert = (title, description, options) => {
+    const result = window.confirm([title, description].filter(Boolean).join('\n'));
+    if (result) {
+        const confirmOption = options?.find(({style}) => style !== 'cancel');
+        if (confirmOption?.onPress) {
+            confirmOption.onPress();
+        }
+    } else {
+        const cancelOption = options?.find(({style}) => style === 'cancel');
+        if (cancelOption?.onPress) {
+            cancelOption.onPress();
+        }
+    }
+};
+
+export default alert;
diff --git a/src/components/Alert/types.ts b/src/components/Alert/types.ts
new file mode 100644
index 000000000000..25454abfe8b8
--- /dev/null
+++ b/src/components/Alert/types.ts
@@ -0,0 +1,5 @@
+import type {AlertStatic} from 'react-native';
+
+type Alert = AlertStatic['alert'];
+
+export default Alert;
diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js
index 573cbe370aa7..90055fafa3ee 100644
--- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js
+++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js
@@ -2,6 +2,7 @@ import PropTypes from 'prop-types';
 import React, {forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState} from 'react';
 import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
+import alert from '@components/Alert';
 import FloatingActionButton from '@components/FloatingActionButton';
 import * as Expensicons from '@components/Icon/Expensicons';
 import PopoverMenu from '@components/PopoverMenu';
@@ -76,6 +77,9 @@ function FloatingActionButtonAndPopover(props) {
     const [isCreateMenuActive, setIsCreateMenuActive] = useState(false);
     const fabRef = useRef(null);
 
+    useEffect(() => {
+        alert('title test', 'description, test');
+    }, []);
     const prevIsFocused = usePrevious(props.isFocused);
 
     /**

From 2140f7ea44b626f489c81878dc12e49d48cde18f Mon Sep 17 00:00:00 2001
From: Blazej Kustra <blazej.kustra@swmansion.com>
Date: Thu, 22 Feb 2024 16:10:31 +0100
Subject: [PATCH 249/305] Remove test code

---
 .../sidebar/SidebarScreen/FloatingActionButtonAndPopover.js   | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js
index 90055fafa3ee..573cbe370aa7 100644
--- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js
+++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js
@@ -2,7 +2,6 @@ import PropTypes from 'prop-types';
 import React, {forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState} from 'react';
 import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
-import alert from '@components/Alert';
 import FloatingActionButton from '@components/FloatingActionButton';
 import * as Expensicons from '@components/Icon/Expensicons';
 import PopoverMenu from '@components/PopoverMenu';
@@ -77,9 +76,6 @@ function FloatingActionButtonAndPopover(props) {
     const [isCreateMenuActive, setIsCreateMenuActive] = useState(false);
     const fabRef = useRef(null);
 
-    useEffect(() => {
-        alert('title test', 'description, test');
-    }, []);
     const prevIsFocused = usePrevious(props.isFocused);
 
     /**

From befeda98cf5370fedd31997a0c55a5c3e18e2b90 Mon Sep 17 00:00:00 2001
From: Adrian Covarrubias <adriancova@outlook.com>
Date: Thu, 22 Feb 2024 09:20:01 -0600
Subject: [PATCH 250/305] adding back merge to null for failure data

---
 src/libs/actions/IOU.ts | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts
index 3888e63bcd18..0de6efcd1b07 100644
--- a/src/libs/actions/IOU.ts
+++ b/src/libs/actions/IOU.ts
@@ -1639,6 +1639,11 @@ function createSplitsAndOnyxData(
                 errors: ErrorUtils.getMicroSecondOnyxError('iou.error.genericCreateFailureMessage'),
             },
         },
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${CONST.IOU.OPTIMISTIC_TRANSACTION_ID}`,
+            value: null,
+        },
     ];
 
     if (existingSplitChatReport) {

From 7b43b0d0f0653058c67aa4ceec2c78036f413d79 Mon Sep 17 00:00:00 2001
From: Adrian Covarrubias <adriancova@outlook.com>
Date: Thu, 22 Feb 2024 09:23:21 -0600
Subject: [PATCH 251/305] adding back merge to null for optimistic* data

---
 src/libs/actions/IOU.ts | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts
index 0de6efcd1b07..f95dc2569598 100644
--- a/src/libs/actions/IOU.ts
+++ b/src/libs/actions/IOU.ts
@@ -1605,6 +1605,11 @@ function createSplitsAndOnyxData(
             key: `${ONYXKEYS.COLLECTION.TRANSACTION}${splitTransaction.transactionID}`,
             value: splitTransaction,
         },
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${CONST.IOU.OPTIMISTIC_TRANSACTION_ID}`,
+            value: null,
+        },
     ];
 
     const successData: OnyxUpdate[] = [
@@ -1639,11 +1644,6 @@ function createSplitsAndOnyxData(
                 errors: ErrorUtils.getMicroSecondOnyxError('iou.error.genericCreateFailureMessage'),
             },
         },
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${CONST.IOU.OPTIMISTIC_TRANSACTION_ID}`,
-            value: null,
-        },
     ];
 
     if (existingSplitChatReport) {

From dbc8c1bb4a0e21024dde3056da044c519789a0ca Mon Sep 17 00:00:00 2001
From: Kamil Owczarz <kamil.owczarz@swmansion.com>
Date: Thu, 22 Feb 2024 17:13:59 +0100
Subject: [PATCH 252/305] Fix styles

---
 src/components/VideoPlayer/BaseVideoPlayer.js | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/VideoPlayer/BaseVideoPlayer.js b/src/components/VideoPlayer/BaseVideoPlayer.js
index da4306f2164a..44317a02c396 100644
--- a/src/components/VideoPlayer/BaseVideoPlayer.js
+++ b/src/components/VideoPlayer/BaseVideoPlayer.js
@@ -166,7 +166,10 @@ function BaseVideoPlayer({
     return (
         // We need to wrap the video component in a component that will catch unhandled pointer events. Otherwise, these
         // events will bubble up the tree, and it will cause unexpected press behavior.
-        <PressableWithoutFeedback accessibilityRole="button">
+        <PressableWithoutFeedback
+            accessibilityRole="button"
+            style={styles.flex1}
+        >
             <View style={style}>
                 <Hoverable>
                     {(isHovered) => (

From 4e1a7a8ccd4e4b1f1c5d6c6a740a273924224ce6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 22 Feb 2024 17:59:29 +0100
Subject: [PATCH 253/305] remove old code

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index da204a580ce4..db9fbbf0e61e 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -64,7 +64,6 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                         description={translate('workflowsPage.weeklyFrequency')}
                         shouldShowRightIcon
                         wrapperStyle={containerStyle}
-                        // wrapperStyle={workflowsStyles.subMenuContainer}
                         hoverAndPressStyle={[styles.mr0, styles.br2]}
                     />
                 ),

From 3f7a8df2dc66807ca5c6027fc2e04d6501a7d06d Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Thu, 22 Feb 2024 09:13:18 -0800
Subject: [PATCH 254/305] Make single tags work

---
 .../ReportActionItem/MoneyRequestView.tsx     | 20 ++-----
 src/libs/Violations/ViolationsUtils.ts        | 52 -------------------
 2 files changed, 5 insertions(+), 67 deletions(-)

diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index 3fb993b6a9e8..fcd44d6664ab 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -222,20 +222,10 @@ function MoneyRequestView({
             }
 
             // Return violations if there are any
-            if (canUseViolations && hasViolations(field, data)) {
+            // At the moment, we only return violations for tags for workspaces with single-level tags
+            if (canUseViolations && (data?.tagListCount ?? 1) === 1 && hasViolations(field, data)) {
                 const violations = getViolationsForField(field);
-                for (let i = 0; i < violations.length; i++) {
-                    let violation = violations[i];
-                    if (violation.name === 'someTagLevelsRequired' && violation.data?.errorIndexes?.includes(data.index)) {
-                        violation['data']['tagName'] = data.tagName;
-                        return ViolationsUtils.getViolationTranslation(violation, translate);
-                    } else if (violation.name === 'tagOutOfPolicy' && violation.data?.tagName === data.tagName) {
-                        violation['data']['tagName'] = data.tagName;
-                        return ViolationsUtils.getViolationTranslation(violation, translate);
-                    } else {
-                        return ViolationsUtils.getViolationTranslation(violation, translate);
-                    }
-                }
+                return ViolationsUtils.getViolationTranslation(violations[0], translate);
             }
 
             return '';
@@ -396,8 +386,8 @@ function MoneyRequestView({
                                         ROUTES.MONEY_REQUEST_STEP_TAG.getRoute(CONST.IOU.ACTION.EDIT, CONST.IOU.TYPE.REQUEST, index, transaction?.transactionID ?? '', report.reportID),
                                     )
                                 }
-                                brickRoadIndicator={getErrorForField('tag', {tagName: name, index}) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
-                                error={getErrorForField('tag', {tagName: name, index})}
+                                brickRoadIndicator={getErrorForField('tag', {tagListCount: policyTagLists.length}) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
+                                error={getErrorForField('tag', {tagListCount: policyTagLists.length})}
                             />
                         </OfflineWithFeedback>
                     ))}
diff --git a/src/libs/Violations/ViolationsUtils.ts b/src/libs/Violations/ViolationsUtils.ts
index cfd5c30d135a..164800024a5e 100644
--- a/src/libs/Violations/ViolationsUtils.ts
+++ b/src/libs/Violations/ViolationsUtils.ts
@@ -76,58 +76,6 @@ const ViolationsUtils = {
                 if (!hasMissingTagViolation && !updatedTransaction.tag && policyRequiresTags) {
                     newTransactionViolations.push({name: 'missingTag', type: 'violation', userMessage: ''});
                 }
-            } else {
-                const selectedTags = updatedTransaction.tag?.split(CONST.COLON) ?? [];
-
-                // if (policyTagKeys.length === 0) {
-                //     newTransactionViolations.push({
-                //         name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
-                //         type: 'violation',
-                //     });
-                // }
-
-                policyTagKeys.forEach((key, index) => {
-                    const hasTagOutOfPolicyViolation = transactionViolations.some((violation) => violation.name === CONST.VIOLATIONS.TAG_OUT_OF_POLICY && violation.data?.tagName === key);
-                    const hasMissingTagViolation = transactionViolations.some((violation) => violation.name === CONST.VIOLATIONS.MISSING_TAG && violation.data?.tagName === key);
-                    const selectedTag = selectedTags[index];
-                    const isTagInPolicy = Boolean(policyTagList[key]?.tags[selectedTag]?.enabled);
-
-                    // Add 'tagOutOfPolicy' violation if tag is not in policy
-                    if (!hasTagOutOfPolicyViolation && selectedTag && !isTagInPolicy) {
-                        newTransactionViolations.push({
-                            name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
-                            type: 'violation',
-                            data: {
-                                tagName: key,
-                            },
-                        });
-                    }
-
-                    // Remove 'tagOutOfPolicy' violation if tag is in policy
-                    if (hasTagOutOfPolicyViolation && selectedTag && isTagInPolicy) {
-                        newTransactionViolations = reject(newTransactionViolations, {
-                            name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY,
-                        });
-                    }
-
-                    // Remove 'missingTag' violation if tag is valid according to policy
-                    if (hasMissingTagViolation && isTagInPolicy) {
-                        newTransactionViolations = reject(newTransactionViolations, {
-                            name: CONST.VIOLATIONS.MISSING_TAG,
-                        });
-                    }
-
-                    // Add 'missingTag violation' if tag is required and not set
-                    if (!hasMissingTagViolation && !selectedTag && policyRequiresTags) {
-                        newTransactionViolations.push({
-                            name: CONST.VIOLATIONS.MISSING_TAG,
-                            type: 'violation',
-                            data: {
-                                tagName: key,
-                            },
-                        });
-                    }
-                });
             }
         }
 

From 08d76093a22d6c3725fa42c273a786341f130e74 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Thu, 22 Feb 2024 09:15:57 -0800
Subject: [PATCH 255/305] Update currency fix

---
 src/libs/actions/IOU.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts
index 26a7c9376239..6e610bd2860f 100644
--- a/src/libs/actions/IOU.ts
+++ b/src/libs/actions/IOU.ts
@@ -1140,7 +1140,7 @@ function getUpdateMoneyRequestParams(
                 ? IOUUtils.updateIOUOwnerAndTotal(iouReport, updatedReportAction.actorAccountID ?? -1, diff, TransactionUtils.getCurrency(transaction), false, true)
                 : {};
         }
-        updatedMoneyRequestReport.cachedTotal = CurrencyUtils.convertToDisplayString(updatedMoneyRequestReport.total, updatedTransaction?.currency);
+        updatedMoneyRequestReport.cachedTotal = CurrencyUtils.convertToDisplayString(updatedMoneyRequestReport.total, transactionDetails?.currency);
         optimisticData.push({
             onyxMethod: Onyx.METHOD.MERGE,
             key: `${ONYXKEYS.COLLECTION.REPORT}${iouReport?.reportID}`,

From 36c1eb42c23ec77625bbb651dfcd4dcf20d3b1d4 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Thu, 22 Feb 2024 09:17:02 -0800
Subject: [PATCH 256/305] Comment

---
 src/libs/Violations/ViolationsUtils.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/libs/Violations/ViolationsUtils.ts b/src/libs/Violations/ViolationsUtils.ts
index 164800024a5e..f5baf2ae7637 100644
--- a/src/libs/Violations/ViolationsUtils.ts
+++ b/src/libs/Violations/ViolationsUtils.ts
@@ -51,6 +51,8 @@ const ViolationsUtils = {
 
         if (policyRequiresTags) {
             const policyTagKeys = Object.keys(policyTagList);
+
+            // At the moment, we only return violations for tags for workspaces with single-level tags
             if (policyTagKeys.length === 1) {
                 const policyTagListName = Object.keys(policyTagList)[0];
                 const policyTags = policyTagList[policyTagListName]?.tags;

From a82d1524f826f7628ef068762a5044b602ccc72a Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Thu, 22 Feb 2024 10:08:20 -0800
Subject: [PATCH 257/305] Lint + Types

---
 .../MoneyRequestPreview/MoneyRequestPreviewContent.tsx |  2 +-
 src/components/ReportActionItem/MoneyRequestView.tsx   |  8 ++++----
 src/languages/en.ts                                    |  2 +-
 src/libs/Violations/ViolationsUtils.ts                 | 10 +++++-----
 4 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx b/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
index eacd6cd4285e..4656c0cb194f 100644
--- a/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
+++ b/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
@@ -86,7 +86,7 @@ function MoneyRequestPreviewContent({
     const requestMerchant = truncate(merchant, {length: CONST.REQUEST_PREVIEW.MAX_LENGTH});
     const hasReceipt = TransactionUtils.hasReceipt(transaction);
     const isScanning = hasReceipt && TransactionUtils.isReceiptBeingScanned(transaction);
-    const hasViolations = TransactionUtils.hasViolation(transaction?.transactionID, transactionViolations);
+    const hasViolations = TransactionUtils.hasViolation(transaction?.transactionID ?? '', transactionViolations);
     const hasFieldErrors = TransactionUtils.hasMissingSmartscanFields(transaction);
     const shouldShowRBR = hasViolations || hasFieldErrors;
     const isDistanceRequest = TransactionUtils.isDistanceRequest(transaction);
diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index d8b82e14fd8f..81037a5f75a1 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -199,7 +199,7 @@ function MoneyRequestView({
     const getPendingFieldAction = (fieldPath: TransactionPendingFieldsKey) => transaction?.pendingFields?.[fieldPath] ?? pendingAction;
 
     const getErrorForField = useCallback(
-        (field: ViolationField, data?: OnyxTypes.TransactionViolation['data']) => {
+        (field: ViolationField, data?: OnyxTypes.TransactionViolation['data'], shouldShowViolations: Boolean = true) => {
             // Checks applied when creating a new money request
             // NOTE: receipt field can return multiple violations, so we need to handle it separately
             const fieldChecks: Partial<Record<ViolationField, {isError: boolean; translationPath: TranslationPaths}>> = {
@@ -226,7 +226,7 @@ function MoneyRequestView({
 
             // Return violations if there are any
             // At the moment, we only return violations for tags for workspaces with single-level tags
-            if (canUseViolations && (data?.tagListCount ?? 1) === 1 && hasViolations(field, data)) {
+            if (canUseViolations && shouldShowViolations && hasViolations(field)) {
                 const violations = getViolationsForField(field);
                 return ViolationsUtils.getViolationTranslation(violations[0], translate);
             }
@@ -394,8 +394,8 @@ function MoneyRequestView({
                                         ROUTES.MONEY_REQUEST_STEP_TAG.getRoute(CONST.IOU.ACTION.EDIT, CONST.IOU.TYPE.REQUEST, index, transaction?.transactionID ?? '', report.reportID),
                                     )
                                 }
-                                brickRoadIndicator={getErrorForField('tag', {tagListCount: policyTagLists.length}) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
-                                error={getErrorForField('tag', {tagListCount: policyTagLists.length})}
+                                brickRoadIndicator={getErrorForField('tag', {}, policyTagLists.length === 1) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
+                                error={getErrorForField('tag', {}, policyTagLists.length === 1)}
                             />
                         </OfflineWithFeedback>
                     ))}
diff --git a/src/languages/en.ts b/src/languages/en.ts
index f6c389520891..0553d6470ddc 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -2328,7 +2328,7 @@ export default {
             return '';
         },
         smartscanFailed: 'Receipt scanning failed. Enter details manually.',
-        someTagLevelsRequired: ({tagName}: ViolationsTagOutOfPolicyParams) => `Missing ${tagName ?? 'tag'}`,
+        someTagLevelsRequired: 'Missing tag',
         tagOutOfPolicy: ({tagName}: ViolationsTagOutOfPolicyParams) => `${tagName ?? 'Tag'} no longer valid`,
         taxAmountChanged: 'Tax amount was modified',
         taxOutOfPolicy: ({taxName}: ViolationsTaxOutOfPolicyParams) => `${taxName ?? 'Tax'} no longer valid`,
diff --git a/src/libs/Violations/ViolationsUtils.ts b/src/libs/Violations/ViolationsUtils.ts
index f5baf2ae7637..b668b58a91f4 100644
--- a/src/libs/Violations/ViolationsUtils.ts
+++ b/src/libs/Violations/ViolationsUtils.ts
@@ -62,21 +62,21 @@ const ViolationsUtils = {
 
                 // Add 'tagOutOfPolicy' violation if tag is not in policy
                 if (!hasTagOutOfPolicyViolation && updatedTransaction.tag && !isTagInPolicy) {
-                    newTransactionViolations.push({name: 'tagOutOfPolicy', type: 'violation', userMessage: ''});
+                    newTransactionViolations.push({name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY, type: 'violation'});
                 }
 
                 // Remove 'tagOutOfPolicy' violation if tag is in policy
                 if (hasTagOutOfPolicyViolation && updatedTransaction.tag && isTagInPolicy) {
-                    newTransactionViolations = reject(newTransactionViolations, {name: 'tagOutOfPolicy'});
+                    newTransactionViolations = reject(newTransactionViolations, {name: CONST.VIOLATIONS.TAG_OUT_OF_POLICY});
                 }
 
                 // Remove 'missingTag' violation if tag is valid according to policy
                 if (hasMissingTagViolation && isTagInPolicy) {
-                    newTransactionViolations = reject(newTransactionViolations, {name: 'missingTag'});
+                    newTransactionViolations = reject(newTransactionViolations, {name: CONST.VIOLATIONS.MISSING_TAG});
                 }
                 // Add 'missingTag violation' if tag is required and not set
                 if (!hasMissingTagViolation && !updatedTransaction.tag && policyRequiresTags) {
-                    newTransactionViolations.push({name: 'missingTag', type: 'violation', userMessage: ''});
+                    newTransactionViolations.push({name: CONST.VIOLATIONS.MISSING_TAG, type: 'violation'});
                 }
             }
         }
@@ -181,7 +181,7 @@ const ViolationsUtils = {
             case 'smartscanFailed':
                 return translate('violations.smartscanFailed');
             case 'someTagLevelsRequired':
-                return translate('violations.someTagLevelsRequired', {tagName});
+                return translate('violations.someTagLevelsRequired');
             case 'tagOutOfPolicy':
                 return translate('violations.tagOutOfPolicy', {tagName});
             case 'taxAmountChanged':

From be7a804031e85d6419f848def6777a7a1bd057b5 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Thu, 22 Feb 2024 10:21:39 -0800
Subject: [PATCH 258/305] Fix violation tests

---
 tests/unit/ViolationUtilsTest.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/tests/unit/ViolationUtilsTest.js b/tests/unit/ViolationUtilsTest.js
index bc9207fb8021..ff86b5fc6753 100644
--- a/tests/unit/ViolationUtilsTest.js
+++ b/tests/unit/ViolationUtilsTest.js
@@ -153,7 +153,7 @@ describe('getViolationsOnyxData', () => {
 
             const result = ViolationsUtils.getViolationsOnyxData(transaction, transactionViolations, policyRequiresTags, policyTags, policyRequiresCategories, policyCategories);
 
-            expect(result.value).toEqual(expect.arrayContaining([{...missingTagViolation, data: {tagName: 'Meals'}}]));
+            expect(result.value).toEqual(expect.arrayContaining([{...missingTagViolation}]));
         });
 
         it('should add a tagOutOfPolicy violation when policy requires tags and tag is not in the policy', () => {
@@ -161,7 +161,7 @@ describe('getViolationsOnyxData', () => {
 
             const result = ViolationsUtils.getViolationsOnyxData(transaction, transactionViolations, policyRequiresTags, policyTags, policyRequiresCategories, policyCategories);
 
-            expect(result.value).toEqual(expect.arrayContaining([tagOutOfPolicyViolation]));
+            expect(result.value).toEqual([]);
         });
 
         it('should add tagOutOfPolicy violation to existing violations if transaction has tag that is not in the policy', () => {
@@ -173,7 +173,7 @@ describe('getViolationsOnyxData', () => {
 
             const result = ViolationsUtils.getViolationsOnyxData(transaction, transactionViolations, policyRequiresTags, policyTags, policyRequiresCategories, policyCategories);
 
-            expect(result.value).toEqual(expect.arrayContaining([{...tagOutOfPolicyViolation, data: {tagName: 'Meals'}}, ...transactionViolations]));
+            expect(result.value).toEqual(expect.arrayContaining([{...tagOutOfPolicyViolation}, ...transactionViolations]));
         });
 
         it('should add missingTag violation to existing violations if transaction does not have a tag', () => {
@@ -185,7 +185,7 @@ describe('getViolationsOnyxData', () => {
 
             const result = ViolationsUtils.getViolationsOnyxData(transaction, transactionViolations, policyRequiresTags, policyTags, policyRequiresCategories, policyCategories);
 
-            expect(result.value).toEqual(expect.arrayContaining([{...missingTagViolation, data: {tagName: 'Meals'}}, ...transactionViolations]));
+            expect(result.value).toEqual(expect.arrayContaining([{...missingTagViolation}, ...transactionViolations]));
         });
     });
 

From f1562e7dc7f8c99fc77899ae8834c5694da3cebd Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Thu, 22 Feb 2024 10:26:37 -0800
Subject: [PATCH 259/305] Update src/libs/ReportUtils.ts

Co-authored-by: Abdelhafidh Belalia <16493223+s77rt@users.noreply.github.com>
---
 src/libs/ReportUtils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index 8c18db1274b8..91c74bc1b37a 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -723,7 +723,7 @@ function hasParticipantInArray(report: Report, policyMemberAccountIDs: number[])
  * Whether the Money Request report is settled
  */
 function isSettled(reportID: string | undefined): boolean {
-    if (!allReports) {
+    if (!allReports || !reportID) {
         return false;
     }
     const report: Report | EmptyObject = allReports[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`] ?? {};

From b3d140ca34ef7cd879ee653d12f18e25c12597aa Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Thu, 22 Feb 2024 10:27:01 -0800
Subject: [PATCH 260/305] Lint

---
 src/components/ReportActionItem/MoneyRequestView.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index 81037a5f75a1..8851106ddd22 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -199,7 +199,7 @@ function MoneyRequestView({
     const getPendingFieldAction = (fieldPath: TransactionPendingFieldsKey) => transaction?.pendingFields?.[fieldPath] ?? pendingAction;
 
     const getErrorForField = useCallback(
-        (field: ViolationField, data?: OnyxTypes.TransactionViolation['data'], shouldShowViolations: Boolean = true) => {
+        (field: ViolationField, data?: OnyxTypes.TransactionViolation['data'], shouldShowViolations: boolean = true) => {
             // Checks applied when creating a new money request
             // NOTE: receipt field can return multiple violations, so we need to handle it separately
             const fieldChecks: Partial<Record<ViolationField, {isError: boolean; translationPath: TranslationPaths}>> = {

From 9a97869aa4110286f90c2a171609ef7d34cf31f1 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Thu, 22 Feb 2024 12:00:54 -0800
Subject: [PATCH 261/305] Lint

---
 src/components/ReportActionItem/MoneyRequestView.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx
index 8851106ddd22..a63299e43948 100644
--- a/src/components/ReportActionItem/MoneyRequestView.tsx
+++ b/src/components/ReportActionItem/MoneyRequestView.tsx
@@ -199,7 +199,7 @@ function MoneyRequestView({
     const getPendingFieldAction = (fieldPath: TransactionPendingFieldsKey) => transaction?.pendingFields?.[fieldPath] ?? pendingAction;
 
     const getErrorForField = useCallback(
-        (field: ViolationField, data?: OnyxTypes.TransactionViolation['data'], shouldShowViolations: boolean = true) => {
+        (field: ViolationField, data?: OnyxTypes.TransactionViolation['data'], shouldShowViolations = true) => {
             // Checks applied when creating a new money request
             // NOTE: receipt field can return multiple violations, so we need to handle it separately
             const fieldChecks: Partial<Record<ViolationField, {isError: boolean; translationPath: TranslationPaths}>> = {

From c3e9292dbc41e76449d45ba73c7669025051c0ea Mon Sep 17 00:00:00 2001
From: Yauheni <HorbachZhenja@yandex.by>
Date: Thu, 22 Feb 2024 21:31:44 +0100
Subject: [PATCH 262/305] Fix bug with Connect Bank Account - No limit for
 entering amount in transition field

---
 src/CONST.ts                                                   | 2 ++
 .../components/BankAccountValidationForm.tsx                   | 3 +++
 2 files changed, 5 insertions(+)

diff --git a/src/CONST.ts b/src/CONST.ts
index 008002a71078..147a88b724aa 100755
--- a/src/CONST.ts
+++ b/src/CONST.ts
@@ -3108,6 +3108,8 @@ const CONST = {
      */
     ADDITIONAL_ALLOWED_CHARACTERS: 20,
 
+    VALIDATION_REIMBURSEMENT_INPUT_LIMIT: 20,
+
     REFERRAL_PROGRAM: {
         CONTENT_TYPES: {
             MONEY_REQUEST: 'request',
diff --git a/src/pages/ReimbursementAccount/ConnectBankAccount/components/BankAccountValidationForm.tsx b/src/pages/ReimbursementAccount/ConnectBankAccount/components/BankAccountValidationForm.tsx
index 0e8192b60416..6a18fba22bf9 100644
--- a/src/pages/ReimbursementAccount/ConnectBankAccount/components/BankAccountValidationForm.tsx
+++ b/src/pages/ReimbursementAccount/ConnectBankAccount/components/BankAccountValidationForm.tsx
@@ -113,6 +113,7 @@ function BankAccountValidationForm({requiresTwoFactorAuth, reimbursementAccount,
                     containerStyles={[styles.mb6]}
                     inputMode={CONST.INPUT_MODE.DECIMAL}
                     label={`${translate('connectBankAccountStep.validationInputLabel')} 1`}
+                    maxLength={CONST.VALIDATION_REIMBURSEMENT_INPUT_LIMIT}
                 />
                 <InputWrapper
                     InputComponent={TextInput}
@@ -121,6 +122,7 @@ function BankAccountValidationForm({requiresTwoFactorAuth, reimbursementAccount,
                     containerStyles={[styles.mb6]}
                     inputMode={CONST.INPUT_MODE.DECIMAL}
                     label={`${translate('connectBankAccountStep.validationInputLabel')} 2`}
+                    maxLength={CONST.VALIDATION_REIMBURSEMENT_INPUT_LIMIT}
                 />
                 <InputWrapper
                     InputComponent={TextInput}
@@ -129,6 +131,7 @@ function BankAccountValidationForm({requiresTwoFactorAuth, reimbursementAccount,
                     containerStyles={[styles.mb6]}
                     inputMode={CONST.INPUT_MODE.DECIMAL}
                     label={`${translate('connectBankAccountStep.validationInputLabel')} 3`}
+                    maxLength={CONST.VALIDATION_REIMBURSEMENT_INPUT_LIMIT}
                 />
             </View>
             {!requiresTwoFactorAuth && (

From 81c228dfaecf92ca9603204de36e529901efaa96 Mon Sep 17 00:00:00 2001
From: Vit Horacek <vit@expensify.com>
Date: Thu, 22 Feb 2024 22:56:21 +0000
Subject: [PATCH 263/305] Use preventSelfApprovalEnabled policy prop

---
 src/libs/NextStepUtils.ts           | 4 ++--
 src/types/onyx/Policy.ts            | 5 ++++-
 tests/unit/NextStepUtilsTest.ts     | 2 +-
 tests/utils/LHNTestUtils.js         | 2 +-
 tests/utils/collections/policies.ts | 2 +-
 5 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/libs/NextStepUtils.ts b/src/libs/NextStepUtils.ts
index 8da35232112d..f03c34b1696e 100644
--- a/src/libs/NextStepUtils.ts
+++ b/src/libs/NextStepUtils.ts
@@ -73,7 +73,7 @@ function buildNextStep(
 
     const {policyID = '', ownerAccountID = -1, managerID = -1} = report;
     const policy = ReportUtils.getPolicy(policyID);
-    const {submitsTo, harvesting, isPreventSelfApprovalEnabled, autoReportingFrequency, autoReportingOffset} = policy;
+    const {submitsTo, harvesting, isPreventSelfApprovalEnabled, preventSelfApprovalEnabled, autoReportingFrequency, autoReportingOffset} = policy;
     const isOwner = currentUserAccountID === ownerAccountID;
     const isManager = currentUserAccountID === managerID;
     const isSelfApproval = currentUserAccountID === submitsTo;
@@ -164,7 +164,7 @@ function buildNextStep(
             }
 
             // Prevented self submitting
-            if (isPreventSelfApprovalEnabled && isSelfApproval) {
+            if ((isPreventSelfApprovalEnabled ?? preventSelfApprovalEnabled) && isSelfApproval) {
                 optimisticNextStep.message = [
                     {
                         text: "Oops! Looks like you're submitting to ",
diff --git a/src/types/onyx/Policy.ts b/src/types/onyx/Policy.ts
index ad3235d4eea4..c0f5a53d96d8 100644
--- a/src/types/onyx/Policy.ts
+++ b/src/types/onyx/Policy.ts
@@ -105,9 +105,12 @@ type Policy = {
         enabled: boolean;
     };
 
-    /** Whether the self approval or submitting is enabled */
+    /** @deprecated Whether the self approval or submitting is enabled */
     isPreventSelfApprovalEnabled?: boolean;
 
+    /** Whether the self approval or submitting is enabled */
+    preventSelfApprovalEnabled?: boolean;
+
     /** When the monthly scheduled submit should happen */
     autoReportingOffset?: AutoReportingOffset;
 
diff --git a/tests/unit/NextStepUtilsTest.ts b/tests/unit/NextStepUtilsTest.ts
index 6cf8b37aadab..622881bc7979 100644
--- a/tests/unit/NextStepUtilsTest.ts
+++ b/tests/unit/NextStepUtilsTest.ts
@@ -340,7 +340,7 @@ describe('libs/NextStepUtils', () => {
 
                 return Onyx.merge(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, {
                     submitsTo: currentUserAccountID,
-                    isPreventSelfApprovalEnabled: true,
+                    preventSelfApprovalEnabled: true,
                 }).then(() => {
                     const result = NextStepUtils.buildNextStep(report, CONST.REPORT.STATUS_NUM.OPEN);
 
diff --git a/tests/utils/LHNTestUtils.js b/tests/utils/LHNTestUtils.js
index 3e40063dd040..d44a63d51821 100644
--- a/tests/utils/LHNTestUtils.js
+++ b/tests/utils/LHNTestUtils.js
@@ -259,7 +259,7 @@ function getFakePolicy(id = 1, name = 'Workspace-Test-001') {
             enabled: true,
         },
         autoReportingOffset: 1,
-        isPreventSelfApprovalEnabled: true,
+        preventSelfApprovalEnabled: true,
         submitsTo: 123456,
         defaultBillable: false,
         disabledFields: {defaultBillable: true, reimbursable: false},
diff --git a/tests/utils/collections/policies.ts b/tests/utils/collections/policies.ts
index 7ecf152122d3..ba5108d49481 100644
--- a/tests/utils/collections/policies.ts
+++ b/tests/utils/collections/policies.ts
@@ -14,7 +14,7 @@ export default function createRandomPolicy(index: number): Policy {
             enabled: randBoolean(),
         },
         autoReportingOffset: 1,
-        isPreventSelfApprovalEnabled: randBoolean(),
+        preventSelfApprovalEnabled: randBoolean(),
         submitsTo: index,
         outputCurrency: randCurrencyCode(),
         role: rand(Object.values(CONST.POLICY.ROLE)),

From 9964278fbe173655347096347c4c827d0573a350 Mon Sep 17 00:00:00 2001
From: andreasnw <andreasnw93@gmail.com>
Date: Tue, 6 Feb 2024 22:44:04 +0700
Subject: [PATCH 264/305] fix: remove animation for offsetY.value

---
 src/components/MultiGestureCanvas/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/MultiGestureCanvas/index.tsx b/src/components/MultiGestureCanvas/index.tsx
index a7eca6baa18f..e889fe773f0f 100644
--- a/src/components/MultiGestureCanvas/index.tsx
+++ b/src/components/MultiGestureCanvas/index.tsx
@@ -130,7 +130,7 @@ function MultiGestureCanvas({
 
         if (animated) {
             offsetX.value = withSpring(0, SPRING_CONFIG);
-            offsetY.value = withSpring(0, SPRING_CONFIG);
+            offsetY.value = 0;
             panTranslateX.value = withSpring(0, SPRING_CONFIG);
             panTranslateY.value = withSpring(0, SPRING_CONFIG);
             pinchTranslateX.value = withSpring(0, SPRING_CONFIG);

From 6cb78bb0ab1c26f0d10ba5130b311ece7cac9cba Mon Sep 17 00:00:00 2001
From: Andreas Nandiwardhana <andreasnw93@gmail.com>
Date: Wed, 14 Feb 2024 10:31:37 +0700
Subject: [PATCH 265/305] fix: horizontal image cases

remove animation from offestX.value to handle horizontal image cases
---
 src/components/MultiGestureCanvas/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/MultiGestureCanvas/index.tsx b/src/components/MultiGestureCanvas/index.tsx
index e889fe773f0f..7e3512757b2a 100644
--- a/src/components/MultiGestureCanvas/index.tsx
+++ b/src/components/MultiGestureCanvas/index.tsx
@@ -129,7 +129,7 @@ function MultiGestureCanvas({
         pinchScale.value = 1;
 
         if (animated) {
-            offsetX.value = withSpring(0, SPRING_CONFIG);
+            offsetX.value = 0;
             offsetY.value = 0;
             panTranslateX.value = withSpring(0, SPRING_CONFIG);
             panTranslateY.value = withSpring(0, SPRING_CONFIG);

From bf3b8b8b9e7de6de3c3abb6849160b0452dcc7d6 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Fri, 23 Feb 2024 11:10:56 +0800
Subject: [PATCH 266/305] move the util code to new file

---
 src/pages/workspace/WorkspaceMembersPage.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/pages/workspace/WorkspaceMembersPage.tsx b/src/pages/workspace/WorkspaceMembersPage.tsx
index f28a435d26d9..f404f333458e 100644
--- a/src/pages/workspace/WorkspaceMembersPage.tsx
+++ b/src/pages/workspace/WorkspaceMembersPage.tsx
@@ -415,7 +415,8 @@ function WorkspaceMembersPage({policyMembers, personalDetails, route, policy, se
             <FullPageNotFoundView
                 shouldShow={(isEmptyObject(policy) && !isLoadingReportData) || !PolicyUtils.isPolicyAdmin(policy) || PolicyUtils.isPendingDeletePolicy(policy)}
                 subtitleKey={isEmptyObject(policy) ? undefined : 'workspace.common.notAuthorized'}
-                onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_WORKSPACES)}
+                onBackButtonPress={PolicyUtils.goBackFromInvalidPolicy}
+                onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
             >
                 <HeaderWithBackButton
                     title={translate('workspace.common.members')}

From 273e81aee0ad68cf7be1e4ee0f0730ca394fe667 Mon Sep 17 00:00:00 2001
From: burczu <b.dybowski@gmail.com>
Date: Fri, 23 Feb 2024 08:24:57 +0100
Subject: [PATCH 267/305] translation updated

---
 src/languages/es.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/languages/es.ts b/src/languages/es.ts
index fc6755519d6f..f0602250d071 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -195,7 +195,7 @@ export default {
         iAcceptThe: 'Acepto los ',
         remove: 'Eliminar',
         admin: 'Administrador',
-        owner: 'Poseedor',
+        owner: 'Dueño',
         dateFormat: 'AAAA-MM-DD',
         send: 'Enviar',
         notifications: 'Notificaciones',

From 85dc2f6938deb27e72d34ebc0c1d60f29e8d6e37 Mon Sep 17 00:00:00 2001
From: burczu <b.dybowski@gmail.com>
Date: Fri, 23 Feb 2024 08:25:17 +0100
Subject: [PATCH 268/305] page title color updated

---
 src/pages/workspace/WorkspaceMembersPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/workspace/WorkspaceMembersPage.tsx b/src/pages/workspace/WorkspaceMembersPage.tsx
index f28a435d26d9..d58488667df2 100644
--- a/src/pages/workspace/WorkspaceMembersPage.tsx
+++ b/src/pages/workspace/WorkspaceMembersPage.tsx
@@ -358,7 +358,7 @@ function WorkspaceMembersPage({policyMembers, personalDetails, route, policy, se
 
     const getHeaderContent = () => (
         <>
-            <Text style={[styles.pl5, styles.mb5, styles.mt3]}>{translate('workspace.people.membersListTitle')}</Text>
+            <Text style={[styles.pl5, styles.mb5, styles.mt3, styles.textSupporting]}>{translate('workspace.people.membersListTitle')}</Text>
             {!isEmptyObject(invitedPrimaryToSecondaryLogins) && (
                 <MessagesRow
                     type="success"

From adb4c63c504fe532b98cde893f3b6bcfacf894fe Mon Sep 17 00:00:00 2001
From: Ishpaul Singh <ishpaul207@gmail.com>
Date: Fri, 23 Feb 2024 01:06:00 +0530
Subject: [PATCH 269/305] fixes offline behaviour

---
 src/libs/actions/Policy.ts                    | 51 +++++++++-
 src/pages/workspace/WorkspaceInitialPage.tsx  |  2 +-
 .../workspace/WorkspacePageWithSections.tsx   |  6 +-
 .../workflows/ToggleSettingsOptionRow.tsx     | 92 +++++++++----------
 .../workflows/WorkspaceWorkflowsPage.tsx      | 28 +++---
 5 files changed, 111 insertions(+), 68 deletions(-)

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index e847f772f867..3a0584df249f 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -390,12 +390,34 @@ function setWorkspaceAutoReporting(policyID: string, enabled: boolean) {
             key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
             value: {
                 autoReporting: enabled,
+                pendingFields: {isAutoApprovalEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE},
+            },
+        },
+    ];
+
+    const failureData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                autoReporting: !enabled,
+                pendingFields: {isAutoApprovalEnabled: null},
+            },
+        },
+    ];
+
+    const successData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                pendingFields: {isAutoApprovalEnabled: null},
             },
         },
     ];
 
     const params: SetWorkspaceAutoReportingParams = {policyID, enabled};
-    API.write(WRITE_COMMANDS.SET_WORKSPACE_AUTO_REPORTING, params, {optimisticData});
+    API.write(WRITE_COMMANDS.SET_WORKSPACE_AUTO_REPORTING, params, {optimisticData, failureData, successData});
 }
 
 function setWorkspaceApprovalMode(policyID: string, approver: string, approvalMode: 'BASIC' | 'OPTIONAL') {
@@ -411,12 +433,35 @@ function setWorkspaceApprovalMode(policyID: string, approver: string, approvalMo
         {
             onyxMethod: Onyx.METHOD.MERGE,
             key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value,
+            value: {
+                ...value,
+                pendingFields: {approvalMode: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE},
+            },
+        },
+    ];
+
+    const failureData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                pendingFields: {approvalMode: null},
+            },
+        },
+    ];
+
+    const successData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                pendingFields: {approvalMode: null},
+            },
         },
     ];
 
     const params: SetWorkspaceApprovalModeParams = {policyID, value: JSON.stringify(value)};
-    API.write(WRITE_COMMANDS.SET_WORKSPACE_APPROVAL_MODE, params, {optimisticData});
+    API.write(WRITE_COMMANDS.SET_WORKSPACE_APPROVAL_MODE, params, {optimisticData, failureData, successData});
 }
 
 /**
diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index c23096bc1208..af8f709dc03f 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -173,7 +173,7 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
             brickRoadIndicator: hasGeneralSettingsError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             routeName: SCREENS.WORKSPACE.PROFILE,
         },
-        ...(isPaidGroupPolicy && shouldShowProtectedItems ? protectedCollectPolicyMenuItems : []),
+        ...(!isPaidGroupPolicy && shouldShowProtectedItems ? protectedCollectPolicyMenuItems : []),
         ...(isFreeGroupPolicy && shouldShowProtectedItems ? protectedFreePolicyMenuItems : []),
     ];
 
diff --git a/src/pages/workspace/WorkspacePageWithSections.tsx b/src/pages/workspace/WorkspacePageWithSections.tsx
index 8a6eff9f2ecf..af515397f2c3 100644
--- a/src/pages/workspace/WorkspacePageWithSections.tsx
+++ b/src/pages/workspace/WorkspacePageWithSections.tsx
@@ -68,6 +68,9 @@ type WorkspacePageWithSectionsProps = WithPolicyAndFullscreenLoadingProps &
         /** Whether to show this page to non admin policy members */
         shouldShowNonAdmin?: boolean;
 
+        /** Whether to show the not found page */
+        shouldShowNotFoundPage?: boolean;
+
         /** Policy values needed in the component */
         policy: OnyxEntry<Policy>;
 
@@ -105,6 +108,7 @@ function WorkspacePageWithSections({
     shouldShowLoading = true,
     shouldShowOfflineIndicatorInWideScreen = false,
     shouldShowNonAdmin = false,
+    shouldShowNotFoundPage = false,
 }: WorkspacePageWithSectionsProps) {
     const styles = useThemeStyles();
     const policyID = route.params?.policyID ?? '';
@@ -136,7 +140,7 @@ function WorkspacePageWithSections({
 
     const shouldShow = useMemo(() => {
         // If the policy object doesn't exist or contains only error data, we shouldn't display it.
-        if ((isEmptyObject(policy) || (Object.keys(policy).length === 1 && !isEmptyObject(policy.errors))) && isEmptyObject(policyDraft)) {
+        if (((isEmptyObject(policy) || (Object.keys(policy).length === 1 && !isEmptyObject(policy.errors))) && isEmptyObject(policyDraft)) || shouldShowNotFoundPage) {
             return true;
         }
 
diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 8c4068f9bd6d..252f36d381fe 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -1,11 +1,12 @@
-import React, {useState} from 'react';
-import {View} from 'react-native';
-import type {SvgProps} from 'react-native-svg';
+import React, { useState } from 'react';
+import { View } from 'react-native';
+import type { SvgProps } from 'react-native-svg';
 import Icon from '@components/Icon';
+import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import Switch from '@components/Switch';
 import Text from '@components/Text';
-import useNetwork from '@hooks/useNetwork';
 import useThemeStyles from '@hooks/useThemeStyles';
+import type { PendingAction } from '@src/types/onyx/OnyxCommon';
 
 type ToggleSettingOptionRowProps = {
     icon: React.FC<SvgProps>;
@@ -14,71 +15,64 @@ type ToggleSettingOptionRowProps = {
     hasBeenToggled: boolean;
     onToggle: (isEnabled: boolean) => void;
     subMenuItems?: React.ReactNode;
+    pendingAction?: PendingAction;
 };
+const ICON_SIZE = 48;
 
-function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, hasBeenToggled}: ToggleSettingOptionRowProps) {
+function ToggleSettingOptionRow({ icon, title, subtitle, onToggle, subMenuItems, hasBeenToggled, pendingAction }: ToggleSettingOptionRowProps) {
     const [isEnabled, setIsEnabled] = useState(hasBeenToggled);
-    const [shouldShowOfflineStyle, setShouldShowOfflineStyle] = useState(false);
     const styles = useThemeStyles();
-    const {isOffline} = useNetwork();
-    const ICON_SIZE = 48;
     const toggleSwitch = () => {
-        if (isEnabled && isOffline) {
-            setShouldShowOfflineStyle(true);
-        } else {
-            setShouldShowOfflineStyle(false);
-        }
         setIsEnabled(!isEnabled);
         onToggle(!isEnabled);
     };
 
     return (
-        <View style={styles.pRelative}>
-            <View style={[styles.flexRow, styles.alignItemsCenter, styles.justifyContentBetween]}>
-                <View style={[styles.flexRow, styles.alignItemsCenter, styles.flex1]}>
-                    <Icon
-                        src={icon}
-                        height={ICON_SIZE}
-                        width={ICON_SIZE}
-                        additionalStyles={{
-                            ...styles.mr3,
-                            ...styles.pb4,
-                        }}
-                    />
-                    <View style={[styles.flexColumn, styles.flex1]}>
-                        <Text
-                            style={{
-                                ...styles.textMicroBold,
-                                ...styles.textNormal,
-                            }}
-                        >
-                            {title}
-                        </Text>
-                        <Text
-                            style={{
-                                ...styles.textLabel,
-                                ...styles.mt1,
-                                ...styles.mr5,
-                                ...styles.textSupporting,
+        <OfflineWithFeedback pendingAction={pendingAction}>
+            <View style={styles.pRelative}>
+                <View style={[styles.flexRow, styles.alignItemsCenter, styles.justifyContentBetween]}>
+                    <View style={[styles.flexRow, styles.alignItemsCenter, styles.flex1]}>
+                        <Icon
+                            src={icon}
+                            height={ICON_SIZE}
+                            width={ICON_SIZE}
+                            additionalStyles={{
+                                ...styles.mr3,
+                                ...styles.pb4,
                             }}
-                        >
-                            {subtitle}
-                        </Text>
+                        />
+                        <View style={[styles.flexColumn, styles.flex1]}>
+                            <Text
+                                style={{
+                                    ...styles.textMicroBold,
+                                    ...styles.textNormal,
+                                }}
+                            >
+                                {title}
+                            </Text>
+                            <Text
+                                style={{
+                                    ...styles.textLabel,
+                                    ...styles.mt1,
+                                    ...styles.mr5,
+                                    ...styles.textSupporting,
+                                }}
+                            >
+                                {subtitle}
+                            </Text>
+                        </View>
                     </View>
-                </View>
-                <View>
                     <Switch
                         accessibilityLabel={subtitle}
                         onToggle={toggleSwitch}
                         isOn={isEnabled}
-                        additionalStyle={shouldShowOfflineStyle ? styles.buttonOpacityDisabled : styles.opacity1}
                     />
                 </View>
+                {isEnabled && subMenuItems}
             </View>
-            {isEnabled && subMenuItems}
-        </View>
+        </OfflineWithFeedback>
     );
 }
 
-export type {ToggleSettingOptionRowProps};
+export type { ToggleSettingOptionRowProps };
 export default ToggleSettingOptionRow;
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index db9fbbf0e61e..00416be9dedb 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -1,5 +1,5 @@
 import type {StackScreenProps} from '@react-navigation/stack';
-import React, {useEffect, useMemo, useState} from 'react';
+import React, {useMemo} from 'react';
 import {FlatList, View} from 'react-native';
 import * as Illustrations from '@components/Icon/Illustrations';
 import MenuItem from '@components/MenuItem';
@@ -11,6 +11,7 @@ import useStyleUtils from '@hooks/useStyleUtils';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import * as OptionsListUtils from '@libs/OptionsListUtils';
+import * as PolicyUtils from '@libs/PolicyUtils';
 import * as ReportUtils from '@libs/ReportUtils';
 import type {CentralPaneNavigatorParamList} from '@navigation/types';
 import withPolicy from '@pages/workspace/withPolicy';
@@ -19,6 +20,7 @@ import WorkspacePageWithSections from '@pages/workspace/WorkspacePageWithSection
 import * as Policy from '@userActions/Policy';
 import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
+import type {PendingAction} from '@src/types/onyx/OnyxCommon';
 import ToggleSettingOptionRow from './ToggleSettingsOptionRow';
 import type {ToggleSettingOptionRowProps} from './ToggleSettingsOptionRow';
 
@@ -31,17 +33,8 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const {isSmallScreenWidth} = useWindowDimensions();
     const {isOffline} = useNetwork();
 
-    const [policyOwnerDisplayName, setPolicyOwnerDisplayName] = useState('');
-
-    useEffect(() => {
-        if (!policy?.ownerAccountID) {
-            return;
-        }
-        const ownerPersonalDetails = ReportUtils.getDisplayNamesWithTooltips(OptionsListUtils.getPersonalDetailsForAccountIDs([policy.ownerAccountID], CONST.EMPTY_OBJECT), false);
-        if (ownerPersonalDetails.length > 0 && ownerPersonalDetails[0].displayName) {
-            setPolicyOwnerDisplayName(ownerPersonalDetails[0].displayName);
-        }
-    }, [policy]);
+    const ownerPersonalDetails = ReportUtils.getDisplayNamesWithTooltips(OptionsListUtils.getPersonalDetailsForAccountIDs([policy?.ownerAccountID ?? 0], CONST.EMPTY_OBJECT), false);
+    const policyOwnerDisplayName = ownerPersonalDetails[0].displayName;
 
     const containerStyle = useMemo(() => [styles.ph8, styles.mhn8, styles.ml11, styles.pv3, styles.pr0, styles.pl4, styles.mr0, styles.widthAuto, styles.mt4], [styles]);
 
@@ -58,7 +51,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     <MenuItem
                         title={translate('workflowsPage.submissionFrequency')}
                         titleStyle={styles.textLabelSupportingNormal}
-                        descriptionTextStyle={isOffline ? StyleUtils.getWorkspaceWorkflowsOfflineDescriptionStyle(styles.textNormalThemeText) : styles.textNormalThemeText}
+                        descriptionTextStyle={styles.textNormalThemeText}
                         // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_AUTOREPORTING_FREQUENCY).getRoute(route.params.policyID))}
                         // TODO will be done in https://github.com/Expensify/Expensify/issues/368332
                         description={translate('workflowsPage.weeklyFrequency')}
@@ -68,6 +61,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     />
                 ),
                 hasBeenToggled: policy?.harvesting?.enabled ?? false,
+                pendingAction: policy?.pendingFields?.isAutoApprovalEnabled as PendingAction,
             },
             {
                 icon: Illustrations.Approval,
@@ -80,7 +74,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     <MenuItem
                         title={translate('workflowsPage.approver')}
                         titleStyle={styles.textLabelSupportingNormal}
-                        descriptionTextStyle={isOffline ? StyleUtils.getWorkspaceWorkflowsOfflineDescriptionStyle(styles.textNormalThemeText) : styles.textNormalThemeText}
+                        descriptionTextStyle={styles.textNormalThemeText}
                         description={policyOwnerDisplayName ?? ''}
                         // onPress={() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS_APPROVER.getRoute(route.params.policyID))}
                         // TODO will be done in https://github.com/Expensify/Expensify/issues/368334
@@ -90,6 +84,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     />
                 ),
                 hasBeenToggled: policy?.isAutoApprovalEnabled ?? false,
+                pendingAction: policy?.pendingFields?.approvalMode as PendingAction,
             },
             {
                 icon: Illustrations.WalletAlt,
@@ -127,10 +122,14 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 onToggle={item.onToggle}
                 subMenuItems={item.subMenuItems}
                 hasBeenToggled={item.hasBeenToggled}
+                pendingAction={item.pendingAction}
             />
         </View>
     );
 
+    const isPaidGroupPolicy = PolicyUtils.isPaidGroupPolicy(policy);
+    const shouldPageVisible = useMemo(() => isPaidGroupPolicy && !!policy?.ownerAccountID, [isPaidGroupPolicy, policy?.ownerAccountID]);
+
     return (
         <WorkspacePageWithSections
             headerText={translate('workspace.common.workflows')}
@@ -138,6 +137,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             route={route}
             guidesCallTaskID={CONST.GUIDES_CALL_TASK_IDS.WORKSPACE_WORKFLOWS}
             shouldShowOfflineIndicatorInWideScreen
+            shouldShowNotFoundPage={shouldPageVisible}
         >
             {() => (
                 <View style={[styles.mt3, styles.textStrong, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>

From d476c6326d1eaec4d69e75e43cc689754ed0fc01 Mon Sep 17 00:00:00 2001
From: Ishpaul Singh <ishpaul207@gmail.com>
Date: Fri, 23 Feb 2024 01:24:02 +0530
Subject: [PATCH 270/305] fixes lint and type issues

---
 .../workspace/WorkspacePageWithSections.tsx   |  4 +-
 .../workflows/ToggleSettingsOptionRow.tsx     | 12 +++---
 .../workflows/WorkspaceWorkflowsPage.tsx      | 37 +++++++++----------
 3 files changed, 25 insertions(+), 28 deletions(-)

diff --git a/src/pages/workspace/WorkspacePageWithSections.tsx b/src/pages/workspace/WorkspacePageWithSections.tsx
index af515397f2c3..dced3bb8768b 100644
--- a/src/pages/workspace/WorkspacePageWithSections.tsx
+++ b/src/pages/workspace/WorkspacePageWithSections.tsx
@@ -42,7 +42,7 @@ type WorkspacePageWithSectionsProps = WithPolicyAndFullscreenLoadingProps &
         headerText: string;
 
         /** Main content of the page */
-        children: (hasVBA: boolean, policyID: string, isUsingECard: boolean) => ReactNode;
+        children: ((hasVBA: boolean, policyID: string, isUsingECard: boolean) => ReactNode) | ReactNode;
 
         /** Content to be added as fixed footer */
         footer?: ReactNode;
@@ -118,7 +118,7 @@ function WorkspacePageWithSections({
     const achState = reimbursementAccount?.achData?.state ?? '';
     const isUsingECard = user?.isUsingExpensifyCard ?? false;
     const hasVBA = achState === BankAccount.STATE.OPEN;
-    const content = children(hasVBA, policyID, isUsingECard);
+    const content = typeof children === 'function' ? children(hasVBA, policyID, isUsingECard) : children;
     const {isSmallScreenWidth} = useWindowDimensions();
     const firstRender = useRef(true);
 
diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 252f36d381fe..9ed3f2ec688c 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -1,12 +1,12 @@
-import React, { useState } from 'react';
-import { View } from 'react-native';
-import type { SvgProps } from 'react-native-svg';
+import React, {useState} from 'react';
+import {View} from 'react-native';
+import type {SvgProps} from 'react-native-svg';
 import Icon from '@components/Icon';
 import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import Switch from '@components/Switch';
 import Text from '@components/Text';
 import useThemeStyles from '@hooks/useThemeStyles';
-import type { PendingAction } from '@src/types/onyx/OnyxCommon';
+import type {PendingAction} from '@src/types/onyx/OnyxCommon';
 
 type ToggleSettingOptionRowProps = {
     icon: React.FC<SvgProps>;
@@ -19,7 +19,7 @@ type ToggleSettingOptionRowProps = {
 };
 const ICON_SIZE = 48;
 
-function ToggleSettingOptionRow({ icon, title, subtitle, onToggle, subMenuItems, hasBeenToggled, pendingAction }: ToggleSettingOptionRowProps) {
+function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, hasBeenToggled, pendingAction}: ToggleSettingOptionRowProps) {
     const [isEnabled, setIsEnabled] = useState(hasBeenToggled);
     const styles = useThemeStyles();
     const toggleSwitch = () => {
@@ -74,5 +74,5 @@ function ToggleSettingOptionRow({ icon, title, subtitle, onToggle, subMenuItems,
     );
 }
 
-export type { ToggleSettingOptionRowProps };
+export type {ToggleSettingOptionRowProps};
 export default ToggleSettingOptionRow;
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 00416be9dedb..585eb2a94110 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -128,7 +128,6 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     );
 
     const isPaidGroupPolicy = PolicyUtils.isPaidGroupPolicy(policy);
-    const shouldPageVisible = useMemo(() => isPaidGroupPolicy && !!policy?.ownerAccountID, [isPaidGroupPolicy, policy?.ownerAccountID]);
 
     return (
         <WorkspacePageWithSections
@@ -137,26 +136,24 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             route={route}
             guidesCallTaskID={CONST.GUIDES_CALL_TASK_IDS.WORKSPACE_WORKFLOWS}
             shouldShowOfflineIndicatorInWideScreen
-            shouldShowNotFoundPage={shouldPageVisible}
+            shouldShowNotFoundPage={!isPaidGroupPolicy}
         >
-            {() => (
-                <View style={[styles.mt3, styles.textStrong, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
-                    <Section
-                        title={translate('workflowsPage.workflowTitle')}
-                        titleStyles={styles.textStrong}
-                        containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
-                    >
-                        <View>
-                            <Text style={[styles.mt3, styles.textSupporting]}>{translate('workflowsPage.workflowDescription')}</Text>
-                            <FlatList
-                                data={items}
-                                renderItem={renderItem}
-                                keyExtractor={(item: ToggleSettingOptionRowProps) => item.title}
-                            />
-                        </View>
-                    </Section>
-                </View>
-            )}
+            <View style={[styles.mt3, styles.textStrong, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
+                <Section
+                    title={translate('workflowsPage.workflowTitle')}
+                    titleStyles={styles.textStrong}
+                    containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
+                >
+                    <View>
+                        <Text style={[styles.mt3, styles.textSupporting]}>{translate('workflowsPage.workflowDescription')}</Text>
+                        <FlatList
+                            data={items}
+                            renderItem={renderItem}
+                            keyExtractor={(item: ToggleSettingOptionRowProps) => item.title}
+                        />
+                    </View>
+                </Section>
+            </View>
         </WorkspacePageWithSections>
     );
 }

From 03481e38ed2570f3271e06b90350e25353658b3e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 23 Feb 2024 08:56:19 +0100
Subject: [PATCH 271/305] put back the paid group policy check

---
 src/pages/workspace/WorkspaceInitialPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index af8f709dc03f..c23096bc1208 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -173,7 +173,7 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
             brickRoadIndicator: hasGeneralSettingsError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             routeName: SCREENS.WORKSPACE.PROFILE,
         },
-        ...(!isPaidGroupPolicy && shouldShowProtectedItems ? protectedCollectPolicyMenuItems : []),
+        ...(isPaidGroupPolicy && shouldShowProtectedItems ? protectedCollectPolicyMenuItems : []),
         ...(isFreeGroupPolicy && shouldShowProtectedItems ? protectedFreePolicyMenuItems : []),
     ];
 

From f409821ff04b65144669376d354d266e979ee9a4 Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Fri, 23 Feb 2024 15:08:31 +0700
Subject: [PATCH 272/305] fix: add height and width to attachment

---
 .../AttachmentPicker/index.native.js          | 33 ++++++++++---------
 1 file changed, 17 insertions(+), 16 deletions(-)

diff --git a/src/components/AttachmentPicker/index.native.js b/src/components/AttachmentPicker/index.native.js
index a0fe760abcc1..d4d3d0696c59 100644
--- a/src/components/AttachmentPicker/index.native.js
+++ b/src/components/AttachmentPicker/index.native.js
@@ -1,7 +1,7 @@
 import lodashCompact from 'lodash/compact';
 import PropTypes from 'prop-types';
 import React, {useCallback, useMemo, useRef, useState} from 'react';
-import {Alert, View} from 'react-native';
+import {Alert, Image as RNImage, View} from 'react-native';
 import RNFetchBlob from 'react-native-blob-util';
 import RNDocumentPicker from 'react-native-document-picker';
 import {launchImageLibrary} from 'react-native-image-picker';
@@ -243,22 +243,23 @@ function AttachmentPicker({type, children, shouldHideCameraOption}) {
                 onCanceled.current();
                 return Promise.resolve();
             }
-
             const fileData = _.first(attachments);
-
-            if (fileData.width === -1 || fileData.height === -1) {
-                showImageCorruptionAlert();
-                return Promise.resolve();
-            }
-
-            return getDataForUpload(fileData)
-                .then((result) => {
-                    completeAttachmentSelection.current(result);
-                })
-                .catch((error) => {
-                    showGeneralAlert(error.message);
-                    throw error;
-                });
+            RNImage.getSize(fileData.uri, (width, height) => {
+                fileData.width = width;
+                fileData.height = height;
+                if (fileData.width === -1 || fileData.height === -1) {
+                    showImageCorruptionAlert();
+                    return Promise.resolve();
+                }
+                return getDataForUpload(fileData)
+                    .then((result) => {
+                        completeAttachmentSelection.current(result);
+                    })
+                    .catch((error) => {
+                        showGeneralAlert(error.message);
+                        throw error;
+                    });
+            });
         },
         [showGeneralAlert, showImageCorruptionAlert],
     );

From b400afbfccdb254edd22e42458ab2a9b0c44a6a2 Mon Sep 17 00:00:00 2001
From: Marcin Swornowski <swor71@gmail.com>
Date: Fri, 23 Feb 2024 10:44:10 +0100
Subject: [PATCH 273/305] fix: added isOffline check to the missing screen

---
 .../BeneficialOwnerInfo/substeps/CompanyOwnersListUBO.tsx      | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/CompanyOwnersListUBO.tsx b/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/CompanyOwnersListUBO.tsx
index 27838c65d12e..25ce2d7b81da 100644
--- a/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/CompanyOwnersListUBO.tsx
+++ b/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/CompanyOwnersListUBO.tsx
@@ -8,6 +8,7 @@ import * as Expensicons from '@components/Icon/Expensicons';
 import MenuItem from '@components/MenuItem';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
+import useNetwork from '@hooks/useNetwork';
 import useThemeStyles from '@hooks/useThemeStyles';
 import * as ErrorUtils from '@libs/ErrorUtils';
 import BankAccount from '@libs/models/BankAccount';
@@ -68,6 +69,7 @@ function CompanyOwnersListUBO({
 }: CompanyOwnersListUBOProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
+    const {isOffline} = useNetwork();
 
     const isLoading = reimbursementAccount?.isLoading ?? false;
     const requestorData = getSubstepValues(REQUESTOR_PERSONAL_INFO_KEYS, null, reimbursementAccount);
@@ -136,6 +138,7 @@ function CompanyOwnersListUBO({
             <Button
                 success
                 isLoading={isLoading}
+                isDisabled={isOffline}
                 style={[styles.w100, styles.mt2, styles.pb5, styles.ph5]}
                 onPress={handleUBOsConfirmation}
                 text={translate('common.confirm')}

From 3573c2b908df161067f54ed2a67fd6d7cebe8090 Mon Sep 17 00:00:00 2001
From: Blazej Kustra <blazej.kustra@swmansion.com>
Date: Fri, 23 Feb 2024 11:31:53 +0100
Subject: [PATCH 274/305] Address comments

---
 src/components/Alert/index.tsx | 9 +++------
 1 file changed, 3 insertions(+), 6 deletions(-)

diff --git a/src/components/Alert/index.tsx b/src/components/Alert/index.tsx
index 8cb495913fae..f212f06aa9d3 100644
--- a/src/components/Alert/index.tsx
+++ b/src/components/Alert/index.tsx
@@ -3,16 +3,13 @@ import type Alert from './types';
 /** Shows an alert modal with ok and cancel options. */
 const alert: Alert = (title, description, options) => {
     const result = window.confirm([title, description].filter(Boolean).join('\n'));
+
     if (result) {
         const confirmOption = options?.find(({style}) => style !== 'cancel');
-        if (confirmOption?.onPress) {
-            confirmOption.onPress();
-        }
+        confirmOption?.onPress?.();
     } else {
         const cancelOption = options?.find(({style}) => style === 'cancel');
-        if (cancelOption?.onPress) {
-            cancelOption.onPress();
-        }
+        cancelOption?.onPress?.();
     }
 };
 

From ab08f150a98059a26aaa22f5efc254f795829d68 Mon Sep 17 00:00:00 2001
From: Yauheni Pasiukevich <pasyukevich@live.com>
Date: Fri, 23 Feb 2024 13:37:50 +0100
Subject: [PATCH 275/305] revert key for Onyx mock

---
 tests/unit/ReportActionsUtilsTest.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/tests/unit/ReportActionsUtilsTest.ts b/tests/unit/ReportActionsUtilsTest.ts
index e3d6e50aa716..f28e2f2c3f14 100644
--- a/tests/unit/ReportActionsUtilsTest.ts
+++ b/tests/unit/ReportActionsUtilsTest.ts
@@ -595,7 +595,7 @@ describe('ReportActionsUtils', () => {
                         () =>
                             new Promise<void>((resolve) => {
                                 const connectionID = Onyx.connect({
-                                    key: 'reportActions_test',
+                                    key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report.reportID}`,
                                     waitForCollectionCallback: true,
                                     callback: () => {
                                         Onyx.disconnect(connectionID);

From 568fe63d652a0ee1cb15a1f119cd6b32ff8326d5 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 23 Feb 2024 04:44:14 -0800
Subject: [PATCH 276/305] Expose Onyx.get to window for easier debugging

---
 src/App.tsx | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/src/App.tsx b/src/App.tsx
index 9562ea647e25..b1e13fcdaf92 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -45,6 +45,23 @@ type AppProps = {
 // For easier debugging and development, when we are in web we expose Onyx to the window, so you can more easily set data into Onyx
 if (window && Environment.isDevelopment()) {
     window.Onyx = Onyx;
+
+    // We intentionally do not offer an Onyx.get API because we believe it will lead to code patterns we don't want to use in this repo, but we can offer a workaround for the sake of debugging
+    // @ts-expect-error TS233 - injecting additional utility for use in runtime debugging, should not be used in any compiled code
+    window.Onyx.get = function (key) {
+        return new Promise((resolve) => {
+            // eslint-disable-next-line rulesdir/prefer-onyx-connect-in-libs
+            const connectionID = Onyx.connect({
+                key,
+                callback: (value) => {
+                    Onyx.disconnect(connectionID);
+                    resolve(value);
+                },
+                waitForCollectionCallback: true,
+            });
+        });
+    };
+
     window.setSupportToken = Session.setSupportAuthToken;
 }
 

From 6849d450cb67d82080f5a6ac84094c86dbf4ea4c Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 23 Feb 2024 05:07:09 -0800
Subject: [PATCH 277/305] Add Environment.isProduction util

---
 src/libs/Environment/Environment.ts | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/libs/Environment/Environment.ts b/src/libs/Environment/Environment.ts
index 14c880edc593..204e78aa5458 100644
--- a/src/libs/Environment/Environment.ts
+++ b/src/libs/Environment/Environment.ts
@@ -24,6 +24,13 @@ function isDevelopment(): boolean {
     return (Config?.ENVIRONMENT ?? CONST.ENVIRONMENT.DEV) === CONST.ENVIRONMENT.DEV;
 }
 
+/**
+ * Are we running the app in production?
+ */
+function isProduction(): Promise<boolean> {
+    return getEnvironment().then((environment) => environment === CONST.ENVIRONMENT.PRODUCTION);
+}
+
 /**
  * Are we running an internal test build?
  */
@@ -47,4 +54,4 @@ function getOldDotEnvironmentURL(): Promise<string> {
     return getEnvironment().then((environment) => OLDDOT_ENVIRONMENT_URLS[environment]);
 }
 
-export {getEnvironment, isInternalTestBuild, isDevelopment, getEnvironmentURL, getOldDotEnvironmentURL};
+export {getEnvironment, isInternalTestBuild, isDevelopment, isProduction, getEnvironmentURL, getOldDotEnvironmentURL};

From e340b4e6ac78d795a2205712d5cb922bd06bd256 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Fri, 23 Feb 2024 05:08:25 -0800
Subject: [PATCH 278/305] Move to setup lib instead of App component

---
 src/App.tsx                   | 26 -----------------------
 src/setup/addUtilsToWindow.ts | 39 +++++++++++++++++++++++++++++++++++
 src/setup/index.ts            |  3 +++
 3 files changed, 42 insertions(+), 26 deletions(-)
 create mode 100644 src/setup/addUtilsToWindow.ts

diff --git a/src/App.tsx b/src/App.tsx
index b1e13fcdaf92..cbe5948f8d4e 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -2,7 +2,6 @@ import {PortalProvider} from '@gorhom/portal';
 import React from 'react';
 import {LogBox} from 'react-native';
 import {GestureHandlerRootView} from 'react-native-gesture-handler';
-import Onyx from 'react-native-onyx';
 import {PickerStateProvider} from 'react-native-picker-select';
 import {SafeAreaProvider} from 'react-native-safe-area-context';
 import '../wdyr';
@@ -31,8 +30,6 @@ import {WindowDimensionsProvider} from './components/withWindowDimensions';
 import Expensify from './Expensify';
 import useDefaultDragAndDrop from './hooks/useDefaultDragAndDrop';
 import OnyxUpdateManager from './libs/actions/OnyxUpdateManager';
-import * as Session from './libs/actions/Session';
-import * as Environment from './libs/Environment/Environment';
 import InitialUrlContext from './libs/InitialUrlContext';
 import {ReportAttachmentsProvider} from './pages/home/report/ReportAttachmentsContext';
 import type {Route} from './ROUTES';
@@ -42,29 +39,6 @@ type AppProps = {
     url?: Route;
 };
 
-// For easier debugging and development, when we are in web we expose Onyx to the window, so you can more easily set data into Onyx
-if (window && Environment.isDevelopment()) {
-    window.Onyx = Onyx;
-
-    // We intentionally do not offer an Onyx.get API because we believe it will lead to code patterns we don't want to use in this repo, but we can offer a workaround for the sake of debugging
-    // @ts-expect-error TS233 - injecting additional utility for use in runtime debugging, should not be used in any compiled code
-    window.Onyx.get = function (key) {
-        return new Promise((resolve) => {
-            // eslint-disable-next-line rulesdir/prefer-onyx-connect-in-libs
-            const connectionID = Onyx.connect({
-                key,
-                callback: (value) => {
-                    Onyx.disconnect(connectionID);
-                    resolve(value);
-                },
-                waitForCollectionCallback: true,
-            });
-        });
-    };
-
-    window.setSupportToken = Session.setSupportAuthToken;
-}
-
 LogBox.ignoreLogs([
     // Basically it means that if the app goes in the background and back to foreground on Android,
     // the timer is lost. Currently Expensify is using a 30 minutes interval to refresh personal details.
diff --git a/src/setup/addUtilsToWindow.ts b/src/setup/addUtilsToWindow.ts
new file mode 100644
index 000000000000..2adb67926f9e
--- /dev/null
+++ b/src/setup/addUtilsToWindow.ts
@@ -0,0 +1,39 @@
+import Onyx from 'react-native-onyx';
+import * as Environment from '@libs/Environment/Environment';
+import * as Session from '@userActions/Session';
+
+/**
+ * This is used to inject development/debugging utilities into the window object on web and desktop.
+ * We do this only on non-production builds - these should not be used in any application code.
+ */
+export default function addUtilsToWindow() {
+    if (!window) {
+        return;
+    }
+
+    Environment.isProduction().then((isProduction) => {
+        if (isProduction) {
+            return;
+        }
+
+        window.Onyx = Onyx;
+
+        // We intentionally do not offer an Onyx.get API because we believe it will lead to code patterns we don't want to use in this repo, but we can offer a workaround for the sake of debugging
+        // @ts-expect-error TS233 - injecting additional utility for use in runtime debugging, should not be used in any compiled code
+        window.Onyx.get = function (key) {
+            return new Promise((resolve) => {
+                // eslint-disable-next-line rulesdir/prefer-onyx-connect-in-libs
+                const connectionID = Onyx.connect({
+                    key,
+                    callback: (value) => {
+                        Onyx.disconnect(connectionID);
+                        resolve(value);
+                    },
+                    waitForCollectionCallback: true,
+                });
+            });
+        };
+
+        window.setSupportToken = Session.setSupportAuthToken;
+    });
+}
diff --git a/src/setup/index.ts b/src/setup/index.ts
index 285b01792cc6..a97862df9ae7 100644
--- a/src/setup/index.ts
+++ b/src/setup/index.ts
@@ -6,6 +6,7 @@ import * as Device from '@userActions/Device';
 import exposeGlobalMemoryOnlyKeysMethods from '@userActions/MemoryOnlyKeys/exposeGlobalMemoryOnlyKeysMethods';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import addUtilsToWindow from './addUtilsToWindow';
 import initializeLastVisitedPath from './initializeLastVisitedPath';
 import platformSetup from './platformSetup';
 
@@ -59,4 +60,6 @@ export default function () {
 
     // Perform any other platform-specific setup
     platformSetup();
+
+    addUtilsToWindow();
 }

From 884d00ea1fb6bbf2ee2b1e2b1d83087d02eff30f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 23 Feb 2024 16:20:01 +0100
Subject: [PATCH 279/305] rename hasBeenToggled to clearer name

---
 .../workspace/workflows/ToggleSettingsOptionRow.tsx   |  6 +++---
 .../workspace/workflows/WorkspaceWorkflowsPage.tsx    | 11 +++++------
 2 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 9ed3f2ec688c..5e116f68c99b 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -12,15 +12,15 @@ type ToggleSettingOptionRowProps = {
     icon: React.FC<SvgProps>;
     title: string;
     subtitle: string;
-    hasBeenToggled: boolean;
+    isActive: boolean;
     onToggle: (isEnabled: boolean) => void;
     subMenuItems?: React.ReactNode;
     pendingAction?: PendingAction;
 };
 const ICON_SIZE = 48;
 
-function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, hasBeenToggled, pendingAction}: ToggleSettingOptionRowProps) {
-    const [isEnabled, setIsEnabled] = useState(hasBeenToggled);
+function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, isActive, pendingAction}: ToggleSettingOptionRowProps) {
+    const [isEnabled, setIsEnabled] = useState(isActive);
     const styles = useThemeStyles();
     const toggleSwitch = () => {
         setIsEnabled(!isEnabled);
diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 585eb2a94110..7a2d34947f26 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -34,8 +34,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     const {isOffline} = useNetwork();
 
     const ownerPersonalDetails = ReportUtils.getDisplayNamesWithTooltips(OptionsListUtils.getPersonalDetailsForAccountIDs([policy?.ownerAccountID ?? 0], CONST.EMPTY_OBJECT), false);
-    const policyOwnerDisplayName = ownerPersonalDetails[0].displayName;
-
+    const policyOwnerDisplayName = ownerPersonalDetails[0]?.displayName;
     const containerStyle = useMemo(() => [styles.ph8, styles.mhn8, styles.ml11, styles.pv3, styles.pr0, styles.pl4, styles.mr0, styles.widthAuto, styles.mt4], [styles]);
 
     const items: ToggleSettingOptionRowProps[] = useMemo(
@@ -60,7 +59,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                         hoverAndPressStyle={[styles.mr0, styles.br2]}
                     />
                 ),
-                hasBeenToggled: policy?.harvesting?.enabled ?? false,
+                isActive: policy?.harvesting?.enabled ?? false,
                 pendingAction: policy?.pendingFields?.isAutoApprovalEnabled as PendingAction,
             },
             {
@@ -83,7 +82,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                         hoverAndPressStyle={[styles.mr0, styles.br2]}
                     />
                 ),
-                hasBeenToggled: policy?.isAutoApprovalEnabled ?? false,
+                isActive: policy?.isAutoApprovalEnabled ?? false,
                 pendingAction: policy?.pendingFields?.approvalMode as PendingAction,
             },
             {
@@ -107,7 +106,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     />
                 ),
                 isEndOptionRow: true,
-                hasBeenToggled: false, // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
+                isActive: false, // TODO will be done in https://github.com/Expensify/Expensify/issues/368335
             },
         ],
         [policy, route.params.policyID, styles, translate, policyOwnerDisplayName, containerStyle, isOffline, StyleUtils],
@@ -121,7 +120,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 subtitle={item.subtitle}
                 onToggle={item.onToggle}
                 subMenuItems={item.subMenuItems}
-                hasBeenToggled={item.hasBeenToggled}
+                isActive={item.isActive}
                 pendingAction={item.pendingAction}
             />
         </View>

From e612ec39fa388854072e5fc93c0778bf99d45333 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 23 Feb 2024 16:20:20 +0100
Subject: [PATCH 280/305] use consts for workspace approval mode

---
 src/libs/actions/Policy.ts | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index 3a0584df249f..7bdb762363e0 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -6,6 +6,7 @@ import lodashClone from 'lodash/clone';
 import lodashUnion from 'lodash/union';
 import type {NullishDeep, OnyxCollection, OnyxEntry, OnyxUpdate} from 'react-native-onyx';
 import Onyx from 'react-native-onyx';
+import type {ValueOf} from 'type-fest';
 import * as API from '@libs/API';
 import type {
     AddMembersToWorkspaceParams,
@@ -420,8 +421,8 @@ function setWorkspaceAutoReporting(policyID: string, enabled: boolean) {
     API.write(WRITE_COMMANDS.SET_WORKSPACE_AUTO_REPORTING, params, {optimisticData, failureData, successData});
 }
 
-function setWorkspaceApprovalMode(policyID: string, approver: string, approvalMode: 'BASIC' | 'OPTIONAL') {
-    const isAutoApprovalEnabled = approvalMode === 'BASIC';
+function setWorkspaceApprovalMode(policyID: string, approver: string, approvalMode: ValueOf<typeof CONST.POLICY.APPROVAL_MODE>) {
+    const isAutoApprovalEnabled = approvalMode === CONST.POLICY.APPROVAL_MODE.BASIC;
 
     const value = {
         approver,

From 73e4b6cb36f03dee8c2ed27319cc9b5778edaa71 Mon Sep 17 00:00:00 2001
From: adriancova <adriancova.95@gmail.com>
Date: Fri, 23 Feb 2024 09:27:49 -0600
Subject: [PATCH 281/305] removed transaction_draft set to null in failureData
 since its done in optimisticData

---
 src/libs/actions/IOU.ts | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts
index f95dc2569598..42096fe9fb20 100644
--- a/src/libs/actions/IOU.ts
+++ b/src/libs/actions/IOU.ts
@@ -614,14 +614,6 @@ function buildOnyxDataForMoneyRequest(
                 pendingFields: null,
             },
         },
-
-        // Remove the temporary transaction used during the creation flow
-        {
-            onyxMethod: Onyx.METHOD.SET,
-            key: `${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${CONST.IOU.OPTIMISTIC_TRANSACTION_ID}`,
-            value: null,
-        },
-
         {
             onyxMethod: Onyx.METHOD.MERGE,
             key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${chatReport?.reportID}`,

From 5e28f33766e079b09dadfd29aeaba2a7cb0868c2 Mon Sep 17 00:00:00 2001
From: Sheena Trepanier <sheena@expensify.com>
Date: Fri, 23 Feb 2024 08:18:51 -0800
Subject: [PATCH 282/305] Update
 docs/articles/expensify-classic/billing-and-subscriptions/Billing-Overview.md

Co-authored-by: Daniel Gale-Rosen <5487802+dangrous@users.noreply.github.com>
---
 .../billing-and-subscriptions/Billing-Overview.md               | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/articles/expensify-classic/billing-and-subscriptions/Billing-Overview.md b/docs/articles/expensify-classic/billing-and-subscriptions/Billing-Overview.md
index 922a60a7f4da..3fe5ec41f5f6 100644
--- a/docs/articles/expensify-classic/billing-and-subscriptions/Billing-Overview.md
+++ b/docs/articles/expensify-classic/billing-and-subscriptions/Billing-Overview.md
@@ -23,7 +23,7 @@ Bundling the Expensify Card with an annual subscription ensures you pay the lowe
 
 If at least 50% of your approved USD spend in a given month is on your company’s Expensify Cards, you will receive an additional 50% discount on the price per member. This additional 50% discount, when coupled with an annual subscription, brings the price per member to $5 on a Collect plan and $9 on a Control plan.
 
-Additionally, every month, you receive 1% cash back on all Expensify Card purchases, and 2% if the spend across your Expensify Cards is $250k or more (_Applies to USD purchases only._) Any cash back from the Expensify Card is first applied to your Expensify bill, further reducing your price per member. Any leftover cash back is deposited directly into your connected bank account.
+Additionally, every month, you receive 1% cash back on all Expensify Card purchases, and 2% if the spend across your Expensify Cards is $250k or more (_applies to USD purchases only_). Any cash back from the Expensify Card is first applied to your Expensify bill, further reducing your price per member. Any leftover cash back is deposited directly into your connected bank account.
 ## Savings calculator
 To see how much money you can save (and even earn!) by using the Expensify Card, check out our [savings calculator](https://use.expensify.com/price-savings-calculator). Just enter a few details and see how much you’ll save!
 {% include faq-begin.md %}

From ba73d0d0bfa430a2c5220d1dee94a3fb02640164 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 23 Feb 2024 17:41:23 +0100
Subject: [PATCH 283/305] remove unneeded prop

---
 src/components/Switch.tsx | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/src/components/Switch.tsx b/src/components/Switch.tsx
index 7bcd30347c8b..8f9d967bdfbf 100644
--- a/src/components/Switch.tsx
+++ b/src/components/Switch.tsx
@@ -15,8 +15,6 @@ type SwitchProps = {
 
     /** Accessibility label for the switch */
     accessibilityLabel: string;
-
-    additionalStyle?: ViewStyle;
 };
 
 const OFFSET_X = {
@@ -24,7 +22,7 @@ const OFFSET_X = {
     ON: 20,
 };
 
-function Switch({isOn, onToggle, accessibilityLabel, additionalStyle}: SwitchProps) {
+function Switch({isOn, onToggle, accessibilityLabel}: SwitchProps) {
     const styles = useThemeStyles();
     const offsetX = useRef(new Animated.Value(isOn ? OFFSET_X.ON : OFFSET_X.OFF));
 
@@ -38,7 +36,7 @@ function Switch({isOn, onToggle, accessibilityLabel, additionalStyle}: SwitchPro
 
     return (
         <PressableWithFeedback
-            style={[styles.switchTrack, !isOn && styles.switchInactive, additionalStyle]}
+            style={[styles.switchTrack, !isOn && styles.switchInactive]}
             onPress={() => onToggle(!isOn)}
             onLongPress={() => onToggle(!isOn)}
             role={CONST.ROLE.SWITCH}

From fae8db32901c337f738abcd7979c48eadac82600 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 23 Feb 2024 17:43:57 +0100
Subject: [PATCH 284/305] remove useless type

---
 src/components/Switch.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/Switch.tsx b/src/components/Switch.tsx
index 8f9d967bdfbf..fd9d9ae315ff 100644
--- a/src/components/Switch.tsx
+++ b/src/components/Switch.tsx
@@ -1,6 +1,5 @@
 import React, {useEffect, useRef} from 'react';
 import {Animated} from 'react-native';
-import type {ViewStyle} from 'react-native';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useNativeDriver from '@libs/useNativeDriver';
 import CONST from '@src/CONST';

From 325419b52aadfe65fe6f6ce7db1f8fedee6e267b Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Fri, 23 Feb 2024 23:44:09 +0700
Subject: [PATCH 285/305] Add comment

---
 src/libs/OptionsListUtils.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/libs/OptionsListUtils.ts b/src/libs/OptionsListUtils.ts
index eafda5ee1ce7..6f2a46de4f65 100644
--- a/src/libs/OptionsListUtils.ts
+++ b/src/libs/OptionsListUtils.ts
@@ -1121,6 +1121,7 @@ function getTagListSections(tags: Tag[], recentlyUsedTags: string[], selectedOpt
     if (selectedOptions.length) {
         const selectedTagOptions = selectedOptions.map((option) => ({
             name: option.name,
+            // Should be marked as enabled to be able to unselect even though the selected category is disabled
             enabled: true,
         }));
 

From 6f83c0b9a510b58c55a8452ce58bdd4748a54b4b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 23 Feb 2024 17:53:13 +0100
Subject: [PATCH 286/305] use const

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 7a2d34947f26..4f30d14add37 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -67,7 +67,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 title: translate('workflowsPage.addApprovalsTitle'),
                 subtitle: translate('workflowsPage.addApprovalsDescription'),
                 onToggle: (isEnabled: boolean) => {
-                    Policy.setWorkspaceApprovalMode(route.params.policyID, policy?.owner ?? '', isEnabled ? 'BASIC' : 'OPTIONAL');
+                    Policy.setWorkspaceApprovalMode(route.params.policyID, policy?.owner ?? '', isEnabled ? CONST.POLICY.APPROVAL_MODE.BASIC : CONST.POLICY.APPROVAL_MODE.BASIC);
                 },
                 subMenuItems: (
                     <MenuItem

From be01e31c4d4ad21c54f40618104e06a9860b6896 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 23 Feb 2024 17:54:39 +0100
Subject: [PATCH 287/305] fix typo

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 4f30d14add37..1f7d4e1c5f75 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -67,7 +67,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                 title: translate('workflowsPage.addApprovalsTitle'),
                 subtitle: translate('workflowsPage.addApprovalsDescription'),
                 onToggle: (isEnabled: boolean) => {
-                    Policy.setWorkspaceApprovalMode(route.params.policyID, policy?.owner ?? '', isEnabled ? CONST.POLICY.APPROVAL_MODE.BASIC : CONST.POLICY.APPROVAL_MODE.BASIC);
+                    Policy.setWorkspaceApprovalMode(route.params.policyID, policy?.owner ?? '', isEnabled ? CONST.POLICY.APPROVAL_MODE.BASIC : CONST.POLICY.APPROVAL_MODE.OPTIONAL);
                 },
                 subMenuItems: (
                     <MenuItem

From b4dab190da2270a80d34634377fd0a877f37ac3c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 23 Feb 2024 17:59:45 +0100
Subject: [PATCH 288/305] add jsdoc

---
 src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 5e116f68c99b..62f32992601a 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -9,12 +9,19 @@ import useThemeStyles from '@hooks/useThemeStyles';
 import type {PendingAction} from '@src/types/onyx/OnyxCommon';
 
 type ToggleSettingOptionRowProps = {
+    /** Icon to be shown for the option */
     icon: React.FC<SvgProps>;
+    /** Title of the option */
     title: string;
+    /** Subtitle of the option */
     subtitle: string;
+    /** Whether the option is enabled or not */
     isActive: boolean;
+    /** Callback to be called when the switch is toggled */
     onToggle: (isEnabled: boolean) => void;
+    /** SubMenuItems will be shown when the option is enabled */
     subMenuItems?: React.ReactNode;
+    /** If there is a pending action, we will grey out the option */
     pendingAction?: PendingAction;
 };
 const ICON_SIZE = 48;

From fc0aa465b1208de79b4d2726681ff5c807de9bcc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 23 Feb 2024 18:12:11 +0100
Subject: [PATCH 289/305] add todo comment

---
 src/styles/utils/index.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index 8fc8a83f357d..21af5398232f 100644
--- a/src/styles/utils/index.ts
+++ b/src/styles/utils/index.ts
@@ -1486,6 +1486,7 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
         ...(isDisabled && styles.buttonOpacityDisabled),
     }),
 
+    // TODO: remove it when we'll implement the callback to handle this toggle in Expensify/Expensify#368335
     getWorkspaceWorkflowsOfflineDescriptionStyle: (descriptionTextStyle: TextStyle | TextStyle[]): StyleProp<TextStyle> => ({
         ...StyleSheet.flatten(descriptionTextStyle),
         opacity: styles.opacitySemiTransparent.opacity,

From 6b5810519d1c63ed9814dc3d297a8be83fac7ba6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 23 Feb 2024 18:39:28 +0100
Subject: [PATCH 290/305] add policy admin check for not found page

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 1f7d4e1c5f75..9160d5a6ad3a 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -127,7 +127,8 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
     );
 
     const isPaidGroupPolicy = PolicyUtils.isPaidGroupPolicy(policy);
-
+    const isPolicyAdmin = PolicyUtils.isPolicyAdmin(policy);
+    
     return (
         <WorkspacePageWithSections
             headerText={translate('workspace.common.workflows')}
@@ -135,7 +136,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
             route={route}
             guidesCallTaskID={CONST.GUIDES_CALL_TASK_IDS.WORKSPACE_WORKFLOWS}
             shouldShowOfflineIndicatorInWideScreen
-            shouldShowNotFoundPage={!isPaidGroupPolicy}
+            shouldShowNotFoundPage={!isPaidGroupPolicy || !isPolicyAdmin}
         >
             <View style={[styles.mt3, styles.textStrong, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
                 <Section

From 54e25858716d2c63618f2c65f591346b5f8277f9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Fri, 23 Feb 2024 18:44:56 +0100
Subject: [PATCH 291/305] fix prettier

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index 9160d5a6ad3a..d1cb3e066d99 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -128,7 +128,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
 
     const isPaidGroupPolicy = PolicyUtils.isPaidGroupPolicy(policy);
     const isPolicyAdmin = PolicyUtils.isPolicyAdmin(policy);
-    
+
     return (
         <WorkspacePageWithSections
             headerText={translate('workspace.common.workflows')}

From a441ade26d235fedae2bb64d2b7b504896599f99 Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Fri, 23 Feb 2024 10:54:08 -0800
Subject: [PATCH 292/305] Lint

---
 src/libs/Violations/ViolationsUtils.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/libs/Violations/ViolationsUtils.ts b/src/libs/Violations/ViolationsUtils.ts
index 9834d7268444..b668b58a91f4 100644
--- a/src/libs/Violations/ViolationsUtils.ts
+++ b/src/libs/Violations/ViolationsUtils.ts
@@ -2,7 +2,6 @@ import reject from 'lodash/reject';
 import Onyx from 'react-native-onyx';
 import type {OnyxUpdate} from 'react-native-onyx';
 import type {Phrase, PhraseParameters} from '@libs/Localize';
-import * as TransactionUtils from '@libs/TransactionUtils';
 import CONST from '@src/CONST';
 import type {TranslationPaths} from '@src/languages/types';
 import ONYXKEYS from '@src/ONYXKEYS';

From 1ee821d1ddab9657f9875b2b7be8428b5b40661b Mon Sep 17 00:00:00 2001
From: Carlos Alvarez <carlos@expensify.com>
Date: Fri, 23 Feb 2024 11:10:45 -0800
Subject: [PATCH 293/305] Apply suggestions from code review

Co-authored-by: Abdelhafidh Belalia <16493223+s77rt@users.noreply.github.com>
---
 src/libs/Violations/ViolationsUtils.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/libs/Violations/ViolationsUtils.ts b/src/libs/Violations/ViolationsUtils.ts
index b668b58a91f4..6153ea62cd0d 100644
--- a/src/libs/Violations/ViolationsUtils.ts
+++ b/src/libs/Violations/ViolationsUtils.ts
@@ -54,10 +54,10 @@ const ViolationsUtils = {
 
             // At the moment, we only return violations for tags for workspaces with single-level tags
             if (policyTagKeys.length === 1) {
-                const policyTagListName = Object.keys(policyTagList)[0];
+                const policyTagListName = policyTagKeys[0];
                 const policyTags = policyTagList[policyTagListName]?.tags;
-                const hasTagOutOfPolicyViolation = transactionViolations.some((violation) => violation.name === 'tagOutOfPolicy');
-                const hasMissingTagViolation = transactionViolations.some((violation) => violation.name === 'missingTag');
+                const hasTagOutOfPolicyViolation = transactionViolations.some((violation) => violation.name === CONST.VIOLATIONS.TAG_OUT_OF_POLICY);
+                const hasMissingTagViolation = transactionViolations.some((violation) => violation.name === CONST.VIOLATIONS.MISSING_TAG);
                 const isTagInPolicy = policyTags ? !!policyTags[updatedTransaction.tag ?? '']?.enabled : false;
 
                 // Add 'tagOutOfPolicy' violation if tag is not in policy

From 2adf02fd98abe7432d683e03a3974c62196a3b15 Mon Sep 17 00:00:00 2001
From: OSBotify <infra+osbotify@expensify.com>
Date: Fri, 23 Feb 2024 19:38:03 +0000
Subject: [PATCH 294/305] Update version to 1.4.43-15

---
 android/app/build.gradle                    | 4 ++--
 ios/NewExpensify/Info.plist                 | 2 +-
 ios/NewExpensifyTests/Info.plist            | 2 +-
 ios/NotificationServiceExtension/Info.plist | 2 +-
 package-lock.json                           | 4 ++--
 package.json                                | 2 +-
 6 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/android/app/build.gradle b/android/app/build.gradle
index 28ed5dec455f..7a2b2a14350e 100644
--- a/android/app/build.gradle
+++ b/android/app/build.gradle
@@ -98,8 +98,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001044314
-        versionName "1.4.43-14"
+        versionCode 1001044315
+        versionName "1.4.43-15"
     }
 
     flavorDimensions "default"
diff --git a/ios/NewExpensify/Info.plist b/ios/NewExpensify/Info.plist
index 509e95136326..b78e03a878fb 100644
--- a/ios/NewExpensify/Info.plist
+++ b/ios/NewExpensify/Info.plist
@@ -40,7 +40,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.4.43.14</string>
+	<string>1.4.43.15</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>
diff --git a/ios/NewExpensifyTests/Info.plist b/ios/NewExpensifyTests/Info.plist
index e2bd6b2648c0..a3ce657d2d01 100644
--- a/ios/NewExpensifyTests/Info.plist
+++ b/ios/NewExpensifyTests/Info.plist
@@ -19,6 +19,6 @@
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.4.43.14</string>
+	<string>1.4.43.15</string>
 </dict>
 </plist>
diff --git a/ios/NotificationServiceExtension/Info.plist b/ios/NotificationServiceExtension/Info.plist
index 55c91be9521d..e4e9ccc5a61d 100644
--- a/ios/NotificationServiceExtension/Info.plist
+++ b/ios/NotificationServiceExtension/Info.plist
@@ -13,7 +13,7 @@
 	<key>CFBundleShortVersionString</key>
 	<string>1.4.43</string>
 	<key>CFBundleVersion</key>
-	<string>1.4.43.14</string>
+	<string>1.4.43.15</string>
 	<key>NSExtension</key>
 	<dict>
 		<key>NSExtensionPointIdentifier</key>
diff --git a/package-lock.json b/package-lock.json
index 91b5708d6485..966cb47cb1c6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "new.expensify",
-  "version": "1.4.43-14",
+  "version": "1.4.43-15",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "new.expensify",
-      "version": "1.4.43-14",
+      "version": "1.4.43-15",
       "hasInstallScript": true,
       "license": "MIT",
       "dependencies": {
diff --git a/package.json b/package.json
index a6c16d3dedd1..ab5cc149d85c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.4.43-14",
+  "version": "1.4.43-15",
   "author": "Expensify, Inc.",
   "homepage": "https://new.expensify.com",
   "description": "New Expensify is the next generation of Expensify: a reimagination of payments based atop a foundation of chat.",

From 55d92d5f7b84c95cd6de77774aa431610ae43bb7 Mon Sep 17 00:00:00 2001
From: Francois Laithier <francois@expensify.com>
Date: Fri, 23 Feb 2024 11:41:18 -0800
Subject: [PATCH 295/305] Revert "Fix app returns to previous thread when
 scrubbing video in thread"

---
 src/components/VideoPlayer/BaseVideoPlayer.js | 9 ++-------
 1 file changed, 2 insertions(+), 7 deletions(-)

diff --git a/src/components/VideoPlayer/BaseVideoPlayer.js b/src/components/VideoPlayer/BaseVideoPlayer.js
index 5f63703b462f..df79c7ef18da 100644
--- a/src/components/VideoPlayer/BaseVideoPlayer.js
+++ b/src/components/VideoPlayer/BaseVideoPlayer.js
@@ -168,12 +168,7 @@ function BaseVideoPlayer({
     }, [bindFunctions, currentVideoPlayerRef, currentlyPlayingURL, isSmallScreenWidth, originalParent, sharedElement, shouldUseSharedVideoElement, url]);
 
     return (
-        // We need to wrap the video component in a component that will catch unhandled pointer events. Otherwise, these
-        // events will bubble up the tree, and it will cause unexpected press behavior.
-        <PressableWithoutFeedback
-            accessibilityRole="button"
-            style={styles.flex1}
-        >
+        <>
             <View style={style}>
                 <Hoverable>
                     {(isHovered) => (
@@ -252,7 +247,7 @@ function BaseVideoPlayer({
                 hidePopover={hidePopoverMenu}
                 anchorPosition={popoverAnchorPosition}
             />
-        </PressableWithoutFeedback>
+        </>
     );
 }
 

From a709122f65fb69d74cfadc85c6224b62490eeb2e Mon Sep 17 00:00:00 2001
From: OSBotify <infra+osbotify@expensify.com>
Date: Fri, 23 Feb 2024 19:59:11 +0000
Subject: [PATCH 296/305] Update version to 1.4.43-16

---
 android/app/build.gradle                    | 4 ++--
 ios/NewExpensify/Info.plist                 | 2 +-
 ios/NewExpensifyTests/Info.plist            | 2 +-
 ios/NotificationServiceExtension/Info.plist | 2 +-
 package-lock.json                           | 4 ++--
 package.json                                | 2 +-
 6 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/android/app/build.gradle b/android/app/build.gradle
index 7a2b2a14350e..9c9253af1d13 100644
--- a/android/app/build.gradle
+++ b/android/app/build.gradle
@@ -98,8 +98,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001044315
-        versionName "1.4.43-15"
+        versionCode 1001044316
+        versionName "1.4.43-16"
     }
 
     flavorDimensions "default"
diff --git a/ios/NewExpensify/Info.plist b/ios/NewExpensify/Info.plist
index b78e03a878fb..83b5bca46810 100644
--- a/ios/NewExpensify/Info.plist
+++ b/ios/NewExpensify/Info.plist
@@ -40,7 +40,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.4.43.15</string>
+	<string>1.4.43.16</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>
diff --git a/ios/NewExpensifyTests/Info.plist b/ios/NewExpensifyTests/Info.plist
index a3ce657d2d01..570c7118bfd7 100644
--- a/ios/NewExpensifyTests/Info.plist
+++ b/ios/NewExpensifyTests/Info.plist
@@ -19,6 +19,6 @@
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.4.43.15</string>
+	<string>1.4.43.16</string>
 </dict>
 </plist>
diff --git a/ios/NotificationServiceExtension/Info.plist b/ios/NotificationServiceExtension/Info.plist
index e4e9ccc5a61d..2dcfd5e383e3 100644
--- a/ios/NotificationServiceExtension/Info.plist
+++ b/ios/NotificationServiceExtension/Info.plist
@@ -13,7 +13,7 @@
 	<key>CFBundleShortVersionString</key>
 	<string>1.4.43</string>
 	<key>CFBundleVersion</key>
-	<string>1.4.43.15</string>
+	<string>1.4.43.16</string>
 	<key>NSExtension</key>
 	<dict>
 		<key>NSExtensionPointIdentifier</key>
diff --git a/package-lock.json b/package-lock.json
index 966cb47cb1c6..daf0c3b778c1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "new.expensify",
-  "version": "1.4.43-15",
+  "version": "1.4.43-16",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "new.expensify",
-      "version": "1.4.43-15",
+      "version": "1.4.43-16",
       "hasInstallScript": true,
       "license": "MIT",
       "dependencies": {
diff --git a/package.json b/package.json
index ab5cc149d85c..f0c24246d5b8 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.4.43-15",
+  "version": "1.4.43-16",
   "author": "Expensify, Inc.",
   "homepage": "https://new.expensify.com",
   "description": "New Expensify is the next generation of Expensify: a reimagination of payments based atop a foundation of chat.",

From cad3114c05754a2a3ec40faf8b99163b35d72bc3 Mon Sep 17 00:00:00 2001
From: OSBotify <infra+osbotify@expensify.com>
Date: Fri, 23 Feb 2024 20:06:46 +0000
Subject: [PATCH 297/305] Update version to 1.4.43-17

---
 android/app/build.gradle                    | 4 ++--
 ios/NewExpensify/Info.plist                 | 2 +-
 ios/NewExpensifyTests/Info.plist            | 2 +-
 ios/NotificationServiceExtension/Info.plist | 2 +-
 package-lock.json                           | 4 ++--
 package.json                                | 2 +-
 6 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/android/app/build.gradle b/android/app/build.gradle
index 9c9253af1d13..2f09f9d87c67 100644
--- a/android/app/build.gradle
+++ b/android/app/build.gradle
@@ -98,8 +98,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001044316
-        versionName "1.4.43-16"
+        versionCode 1001044317
+        versionName "1.4.43-17"
     }
 
     flavorDimensions "default"
diff --git a/ios/NewExpensify/Info.plist b/ios/NewExpensify/Info.plist
index 83b5bca46810..7671cf534ac3 100644
--- a/ios/NewExpensify/Info.plist
+++ b/ios/NewExpensify/Info.plist
@@ -40,7 +40,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.4.43.16</string>
+	<string>1.4.43.17</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>
diff --git a/ios/NewExpensifyTests/Info.plist b/ios/NewExpensifyTests/Info.plist
index 570c7118bfd7..87b685ecf2d3 100644
--- a/ios/NewExpensifyTests/Info.plist
+++ b/ios/NewExpensifyTests/Info.plist
@@ -19,6 +19,6 @@
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.4.43.16</string>
+	<string>1.4.43.17</string>
 </dict>
 </plist>
diff --git a/ios/NotificationServiceExtension/Info.plist b/ios/NotificationServiceExtension/Info.plist
index 2dcfd5e383e3..a417fa9bbcd5 100644
--- a/ios/NotificationServiceExtension/Info.plist
+++ b/ios/NotificationServiceExtension/Info.plist
@@ -13,7 +13,7 @@
 	<key>CFBundleShortVersionString</key>
 	<string>1.4.43</string>
 	<key>CFBundleVersion</key>
-	<string>1.4.43.16</string>
+	<string>1.4.43.17</string>
 	<key>NSExtension</key>
 	<dict>
 		<key>NSExtensionPointIdentifier</key>
diff --git a/package-lock.json b/package-lock.json
index daf0c3b778c1..b953d862dda2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "new.expensify",
-  "version": "1.4.43-16",
+  "version": "1.4.43-17",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "new.expensify",
-      "version": "1.4.43-16",
+      "version": "1.4.43-17",
       "hasInstallScript": true,
       "license": "MIT",
       "dependencies": {
diff --git a/package.json b/package.json
index f0c24246d5b8..b791ab92d5a5 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.4.43-16",
+  "version": "1.4.43-17",
   "author": "Expensify, Inc.",
   "homepage": "https://new.expensify.com",
   "description": "New Expensify is the next generation of Expensify: a reimagination of payments based atop a foundation of chat.",

From 1d2016b22c1f33819b54549bb4d8a4c85bbd8c77 Mon Sep 17 00:00:00 2001
From: OSBotify <infra+osbotify@expensify.com>
Date: Fri, 23 Feb 2024 20:50:31 +0000
Subject: [PATCH 298/305] Update version to 1.4.43-18

---
 android/app/build.gradle                    | 4 ++--
 ios/NewExpensify/Info.plist                 | 2 +-
 ios/NewExpensifyTests/Info.plist            | 2 +-
 ios/NotificationServiceExtension/Info.plist | 2 +-
 package-lock.json                           | 4 ++--
 package.json                                | 2 +-
 6 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/android/app/build.gradle b/android/app/build.gradle
index 2f09f9d87c67..99d7a186e7ee 100644
--- a/android/app/build.gradle
+++ b/android/app/build.gradle
@@ -98,8 +98,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001044317
-        versionName "1.4.43-17"
+        versionCode 1001044318
+        versionName "1.4.43-18"
     }
 
     flavorDimensions "default"
diff --git a/ios/NewExpensify/Info.plist b/ios/NewExpensify/Info.plist
index 7671cf534ac3..574657c8c3f4 100644
--- a/ios/NewExpensify/Info.plist
+++ b/ios/NewExpensify/Info.plist
@@ -40,7 +40,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.4.43.17</string>
+	<string>1.4.43.18</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>
diff --git a/ios/NewExpensifyTests/Info.plist b/ios/NewExpensifyTests/Info.plist
index 87b685ecf2d3..e4962c94df8d 100644
--- a/ios/NewExpensifyTests/Info.plist
+++ b/ios/NewExpensifyTests/Info.plist
@@ -19,6 +19,6 @@
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.4.43.17</string>
+	<string>1.4.43.18</string>
 </dict>
 </plist>
diff --git a/ios/NotificationServiceExtension/Info.plist b/ios/NotificationServiceExtension/Info.plist
index a417fa9bbcd5..308c4314ee68 100644
--- a/ios/NotificationServiceExtension/Info.plist
+++ b/ios/NotificationServiceExtension/Info.plist
@@ -13,7 +13,7 @@
 	<key>CFBundleShortVersionString</key>
 	<string>1.4.43</string>
 	<key>CFBundleVersion</key>
-	<string>1.4.43.17</string>
+	<string>1.4.43.18</string>
 	<key>NSExtension</key>
 	<dict>
 		<key>NSExtensionPointIdentifier</key>
diff --git a/package-lock.json b/package-lock.json
index b953d862dda2..6090b2b1c0d2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "new.expensify",
-  "version": "1.4.43-17",
+  "version": "1.4.43-18",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "new.expensify",
-      "version": "1.4.43-17",
+      "version": "1.4.43-18",
       "hasInstallScript": true,
       "license": "MIT",
       "dependencies": {
diff --git a/package.json b/package.json
index b791ab92d5a5..b99272e453b9 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.4.43-17",
+  "version": "1.4.43-18",
   "author": "Expensify, Inc.",
   "homepage": "https://new.expensify.com",
   "description": "New Expensify is the next generation of Expensify: a reimagination of payments based atop a foundation of chat.",

From 6040f50f4b74442d0fa9516d32d40be0232ebee3 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Sat, 24 Feb 2024 09:14:52 -0800
Subject: [PATCH 299/305] Fix package-lock.json after conflict resolution

---
 package-lock.json | 35 ++++++++++++++++++++++++-----------
 1 file changed, 24 insertions(+), 11 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 6090b2b1c0d2..aab783e8bbb7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -237,7 +237,7 @@
         "style-loader": "^2.0.0",
         "time-analytics-webpack-plugin": "^0.1.17",
         "ts-node": "^10.9.2",
-        "type-fest": "^3.12.0",
+        "type-fest": "^4.10.2",
         "typescript": "^5.3.2",
         "wait-port": "^0.2.9",
         "webpack": "^5.76.0",
@@ -8139,9 +8139,9 @@
       }
     },
     "node_modules/@pmmmwh/react-refresh-webpack-plugin": {
-      "version": "0.5.10",
-      "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.10.tgz",
-      "integrity": "sha512-j0Ya0hCFZPd4x40qLzbhGsh9TMtdb+CJQiso+WxLOPNasohq9cc5SNUcwsZaRH6++Xh91Xkm/xHCkuIiIu0LUA==",
+      "version": "0.5.11",
+      "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.11.tgz",
+      "integrity": "sha512-7j/6vdTym0+qZ6u4XbSAxrWBGYSdCfTzySkj7WAFgDLmSyWlOrWvpyzxlFh5jtw9dn0oL/jtW+06XfFiisN3JQ==",
       "dev": true,
       "dependencies": {
         "ansi-html-community": "^0.0.8",
@@ -8161,7 +8161,7 @@
         "@types/webpack": "4.x || 5.x",
         "react-refresh": ">=0.10.0 <1.0.0",
         "sockjs-client": "^1.4.0",
-        "type-fest": ">=0.17.0 <4.0.0",
+        "type-fest": ">=0.17.0 <5.0.0",
         "webpack": ">=4.43.0 <6.0.0",
         "webpack-dev-server": "3.x || 4.x",
         "webpack-hot-middleware": "2.x",
@@ -26870,10 +26870,11 @@
       }
     },
     "node_modules/core-js-pure": {
-      "version": "3.24.1",
+      "version": "3.36.0",
+      "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.36.0.tgz",
+      "integrity": "sha512-cN28qmhRNgbMZZMc/RFu5w8pK9VJzpb2rJVR/lHuZJKwmXnoWOpXmMkxqBB514igkp1Hu8WGROsiOAzUcKdHOQ==",
       "dev": true,
       "hasInstallScript": true,
-      "license": "MIT",
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/core-js"
@@ -38622,6 +38623,17 @@
         "node": ">=8"
       }
     },
+    "node_modules/jest-watch-typeahead/node_modules/type-fest": {
+      "version": "3.13.1",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-3.13.1.tgz",
+      "integrity": "sha512-tLq3bSNx+xSpwvAJnzrK0Ep5CLNWjvFTOp71URMaAEWBfRb9nnJiBoUe0tF8bI4ZFO3omgBR6NvnbzVUT3Ly4g==",
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/jest-watcher": {
       "version": "29.4.1",
       "license": "MIT",
@@ -50849,11 +50861,12 @@
       }
     },
     "node_modules/type-fest": {
-      "version": "3.13.1",
-      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-3.13.1.tgz",
-      "integrity": "sha512-tLq3bSNx+xSpwvAJnzrK0Ep5CLNWjvFTOp71URMaAEWBfRb9nnJiBoUe0tF8bI4ZFO3omgBR6NvnbzVUT3Ly4g==",
+      "version": "4.10.3",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.10.3.tgz",
+      "integrity": "sha512-JLXyjizi072smKGGcZiAJDCNweT8J+AuRxmPZ1aG7TERg4ijx9REl8CNhbr36RV4qXqL1gO1FF9HL8OkVmmrsA==",
+      "dev": true,
       "engines": {
-        "node": ">=14.16"
+        "node": ">=16"
       },
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"

From c98c48fc0e21803294aa182d618985028055ff5b Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Sat, 24 Feb 2024 09:24:22 -0800
Subject: [PATCH 300/305] Fix TS errors

---
 src/types/form/ExitSurveyReasonForm.ts   |  9 ++++++---
 src/types/form/ExitSurveyResponseForm.ts | 10 +++++++---
 2 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/src/types/form/ExitSurveyReasonForm.ts b/src/types/form/ExitSurveyReasonForm.ts
index 48f10d4d163d..48eddb026010 100644
--- a/src/types/form/ExitSurveyReasonForm.ts
+++ b/src/types/form/ExitSurveyReasonForm.ts
@@ -8,9 +8,12 @@ const INPUT_IDS = {
     REASON: 'reason',
 } as const;
 
-type ExitSurveyReasonForm = Form<{
-    [INPUT_IDS.REASON]: ExitReason;
-}>;
+type ExitSurveyReasonForm = Form<
+    ValueOf<typeof INPUT_IDS>,
+    {
+        [INPUT_IDS.REASON]: ExitReason;
+    }
+>;
 
 export type {ExitSurveyReasonForm, ExitReason};
 export default INPUT_IDS;
diff --git a/src/types/form/ExitSurveyResponseForm.ts b/src/types/form/ExitSurveyResponseForm.ts
index 6776b29b8054..6e3458bd8e38 100644
--- a/src/types/form/ExitSurveyResponseForm.ts
+++ b/src/types/form/ExitSurveyResponseForm.ts
@@ -1,12 +1,16 @@
+import type {ValueOf} from 'type-fest';
 import type Form from './Form';
 
 const INPUT_IDS = {
     RESPONSE: 'response',
 } as const;
 
-type ExitSurveyResponseForm = Form<{
-    [INPUT_IDS.RESPONSE]: string;
-}>;
+type ExitSurveyResponseForm = Form<
+    ValueOf<typeof INPUT_IDS>,
+    {
+        [INPUT_IDS.RESPONSE]: string;
+    }
+>;
 
 export type {ExitSurveyResponseForm};
 export default INPUT_IDS;

From 182e6450f38611d297b2307f8587fbbe266f6c49 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Sat, 24 Feb 2024 09:28:31 -0800
Subject: [PATCH 301/305] Fix failing TS on main

---
 tests/e2e/utils/execAsync.ts | 2 ++
 tests/e2e/utils/killApp.ts   | 3 ++-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/tests/e2e/utils/execAsync.ts b/tests/e2e/utils/execAsync.ts
index 8f1a4ec10c6b..9ec8ca892a50 100644
--- a/tests/e2e/utils/execAsync.ts
+++ b/tests/e2e/utils/execAsync.ts
@@ -48,3 +48,5 @@ export default (command: string, env: NodeJS.ProcessEnv = {}): PromiseWithAbort
 
     return promise;
 };
+
+export type {PromiseWithAbort};
diff --git a/tests/e2e/utils/killApp.ts b/tests/e2e/utils/killApp.ts
index 889f345cf222..0e281d79f5e1 100644
--- a/tests/e2e/utils/killApp.ts
+++ b/tests/e2e/utils/killApp.ts
@@ -1,7 +1,8 @@
 import config from '../config';
 import execAsync from './execAsync';
+import type {PromiseWithAbort};
 
-const killApp = function (platform = 'android', packageName = config.MAIN_APP_PACKAGE): Promise<void> {
+const killApp = function (platform = 'android', packageName = config.MAIN_APP_PACKAGE): PromiseWithAbort {
     if (platform !== 'android') {
         throw new Error(`killApp() missing implementation for platform: ${platform}`);
     }

From 8ab800022b955f1b7622b56f82ee612fcd0a6403 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Sat, 24 Feb 2024 09:30:32 -0800
Subject: [PATCH 302/305] Fix typo

---
 tests/e2e/utils/killApp.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/tests/e2e/utils/killApp.ts b/tests/e2e/utils/killApp.ts
index 0e281d79f5e1..f2d7bb56112f 100644
--- a/tests/e2e/utils/killApp.ts
+++ b/tests/e2e/utils/killApp.ts
@@ -1,6 +1,6 @@
 import config from '../config';
 import execAsync from './execAsync';
-import type {PromiseWithAbort};
+import type {PromiseWithAbort} from './execAsync';
 
 const killApp = function (platform = 'android', packageName = config.MAIN_APP_PACKAGE): PromiseWithAbort {
     if (platform !== 'android') {

From 3784fd952645c368189de9f82769c7ed567e7d55 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Sun, 25 Feb 2024 09:04:51 -0800
Subject: [PATCH 303/305] Fix onImageSelected type

---
 src/components/AvatarWithImagePicker.tsx     | 3 ++-
 src/pages/workspace/WorkspaceProfilePage.tsx | 2 +-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/AvatarWithImagePicker.tsx b/src/components/AvatarWithImagePicker.tsx
index 07c535ccd96c..1dd71408799e 100644
--- a/src/components/AvatarWithImagePicker.tsx
+++ b/src/components/AvatarWithImagePicker.tsx
@@ -6,6 +6,7 @@ import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import * as Browser from '@libs/Browser';
+import type {CustomRNImageManipulatorResult} from '@libs/cropOrRotateImage/types';
 import * as FileUtils from '@libs/fileDownload/FileUtils';
 import getImageResolution from '@libs/fileDownload/getImageResolution';
 import type {AvatarSource} from '@libs/UserUtils';
@@ -54,7 +55,7 @@ type AvatarWithImagePickerProps = {
     disabledStyle?: StyleProp<ViewStyle>;
 
     /** Executed once an image has been selected */
-    onImageSelected?: () => void;
+    onImageSelected?: (file: File | CustomRNImageManipulatorResult) => void;
 
     /** Execute when the user taps "remove" */
     onImageRemoved?: () => void;
diff --git a/src/pages/workspace/WorkspaceProfilePage.tsx b/src/pages/workspace/WorkspaceProfilePage.tsx
index 4ce5822dfaa0..2f41d0bbd3b9 100644
--- a/src/pages/workspace/WorkspaceProfilePage.tsx
+++ b/src/pages/workspace/WorkspaceProfilePage.tsx
@@ -102,7 +102,7 @@ function WorkspaceProfilePage({policy, currencyList = {}, route}: WorkSpaceProfi
                                 fallbackIcon={Expensicons.FallbackWorkspaceAvatar}
                                 style={[styles.mb3, isSmallScreenWidth ? styles.mtn17 : styles.mtn20, styles.alignItemsStart, styles.sectionMenuItemTopDescription]}
                                 isUsingDefaultAvatar={!policy?.avatar ?? null}
-                                onImageSelected={(file: File) => Policy.updateWorkspaceAvatar(policy?.id ?? '', file)}
+                                onImageSelected={(file) => Policy.updateWorkspaceAvatar(policy?.id ?? '', file as File)}
                                 onImageRemoved={() => Policy.deleteWorkspaceAvatar(policy?.id ?? '')}
                                 editorMaskImage={Expensicons.ImageCropSquareMask}
                                 pendingAction={policy?.pendingFields?.avatar ?? null}

From 44fe4276ef2fbd155595ddc7db73aac85aba0c49 Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Sun, 25 Feb 2024 09:11:45 -0800
Subject: [PATCH 304/305] Fix pendingFields and errors

---
 src/components/AvatarWithImagePicker.tsx     |  2 +-
 src/pages/workspace/WorkspaceProfilePage.tsx | 11 +++++------
 src/types/onyx/Policy.ts                     |  2 +-
 3 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/src/components/AvatarWithImagePicker.tsx b/src/components/AvatarWithImagePicker.tsx
index 1dd71408799e..fa8a6d71516f 100644
--- a/src/components/AvatarWithImagePicker.tsx
+++ b/src/components/AvatarWithImagePicker.tsx
@@ -88,7 +88,7 @@ type AvatarWithImagePickerProps = {
     pendingAction?: OnyxCommon.PendingAction;
 
     /** The errors to display  */
-    errors?: OnyxCommon.Errors;
+    errors?: OnyxCommon.Errors | null;
 
     /** Title for avatar preview modal */
     headerTitle?: string;
diff --git a/src/pages/workspace/WorkspaceProfilePage.tsx b/src/pages/workspace/WorkspaceProfilePage.tsx
index 2f41d0bbd3b9..48dfe10a2a0e 100644
--- a/src/pages/workspace/WorkspaceProfilePage.tsx
+++ b/src/pages/workspace/WorkspaceProfilePage.tsx
@@ -26,7 +26,6 @@ import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import type {CurrencyList} from '@src/types/onyx';
-import type * as OnyxCommon from '@src/types/onyx/OnyxCommon';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
 import withPolicy from './withPolicy';
 import type {WithPolicyProps} from './withPolicy';
@@ -105,8 +104,8 @@ function WorkspaceProfilePage({policy, currencyList = {}, route}: WorkSpaceProfi
                                 onImageSelected={(file) => Policy.updateWorkspaceAvatar(policy?.id ?? '', file as File)}
                                 onImageRemoved={() => Policy.deleteWorkspaceAvatar(policy?.id ?? '')}
                                 editorMaskImage={Expensicons.ImageCropSquareMask}
-                                pendingAction={policy?.pendingFields?.avatar ?? null}
-                                errors={policy?.errorFields?.avatar ?? null}
+                                pendingAction={policy?.pendingFields?.avatar}
+                                errors={policy?.errorFields?.avatar}
                                 onErrorClose={() => Policy.clearAvatarErrors(policy?.id ?? '')}
                                 previewSource={UserUtils.getFullSizeAvatar(policy?.avatar ?? '')}
                                 headerTitle={translate('workspace.common.workspaceAvatar')}
@@ -115,7 +114,7 @@ function WorkspaceProfilePage({policy, currencyList = {}, route}: WorkSpaceProfi
                                 disabledStyle={styles.cursorDefault}
                                 errorRowStyles={undefined}
                             />
-                            <OfflineWithFeedback pendingAction={policy?.pendingFields?.generalSettings as OnyxCommon.PendingAction}>
+                            <OfflineWithFeedback pendingAction={policy?.pendingFields?.generalSettings}>
                                 <MenuItemWithTopDescription
                                     title={policyName}
                                     titleStyle={styles.workspaceTitleStyle}
@@ -129,7 +128,7 @@ function WorkspaceProfilePage({policy, currencyList = {}, route}: WorkSpaceProfi
                                 />
                             </OfflineWithFeedback>
                             {(!StringUtils.isEmptyString(policy?.description ?? '') || !readOnly) && (
-                                <OfflineWithFeedback pendingAction={policy?.pendingFields?.description as OnyxCommon.PendingAction}>
+                                <OfflineWithFeedback pendingAction={policy?.pendingFields?.description}>
                                     <MenuItemWithTopDescription
                                         title={policyDescription}
                                         description={translate('workspace.editor.descriptionInputLabel')}
@@ -143,7 +142,7 @@ function WorkspaceProfilePage({policy, currencyList = {}, route}: WorkSpaceProfi
                                     />
                                 </OfflineWithFeedback>
                             )}
-                            <OfflineWithFeedback pendingAction={policy?.pendingFields?.generalSettings as OnyxCommon.PendingAction}>
+                            <OfflineWithFeedback pendingAction={policy?.pendingFields?.generalSettings}>
                                 <View>
                                     <MenuItemWithTopDescription
                                         title={formattedCurrency}
diff --git a/src/types/onyx/Policy.ts b/src/types/onyx/Policy.ts
index 87974619ffc8..2844f63ab433 100644
--- a/src/types/onyx/Policy.ts
+++ b/src/types/onyx/Policy.ts
@@ -130,7 +130,7 @@ type Policy = {
     makeMeAdmin?: boolean;
 
     /** Pending fields for the policy */
-    pendingFields?: Record<string, unknown>;
+    pendingFields?: Record<string, OnyxCommon.PendingAction>;
 
     /** Original file name which is used for the policy avatar */
     originalFileName?: string;

From 1ceaddfd8a1a0fe0611982e9b72783436414e36d Mon Sep 17 00:00:00 2001
From: rory <rory@expensify.com>
Date: Sun, 25 Feb 2024 09:21:09 -0800
Subject: [PATCH 305/305] Fix lint

---
 src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
index d1cb3e066d99..fc1ed1d19560 100644
--- a/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
+++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPage.tsx
@@ -20,7 +20,6 @@ import WorkspacePageWithSections from '@pages/workspace/WorkspacePageWithSection
 import * as Policy from '@userActions/Policy';
 import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
-import type {PendingAction} from '@src/types/onyx/OnyxCommon';
 import ToggleSettingOptionRow from './ToggleSettingsOptionRow';
 import type {ToggleSettingOptionRowProps} from './ToggleSettingsOptionRow';
 
@@ -60,7 +59,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     />
                 ),
                 isActive: policy?.harvesting?.enabled ?? false,
-                pendingAction: policy?.pendingFields?.isAutoApprovalEnabled as PendingAction,
+                pendingAction: policy?.pendingFields?.isAutoApprovalEnabled,
             },
             {
                 icon: Illustrations.Approval,
@@ -83,7 +82,7 @@ function WorkspaceWorkflowsPage({policy, route}: WorkspaceWorkflowsPageProps) {
                     />
                 ),
                 isActive: policy?.isAutoApprovalEnabled ?? false,
-                pendingAction: policy?.pendingFields?.approvalMode as PendingAction,
+                pendingAction: policy?.pendingFields?.approvalMode,
             },
             {
                 icon: Illustrations.WalletAlt,