From b557ccf2ce7369a3b0f5d71a95724779efcd041a Mon Sep 17 00:00:00 2001
From: Jasper Huang <jasper@expensify.com>
Date: Thu, 18 Jan 2024 13:35:40 -0800
Subject: [PATCH 001/110] remove shouldAllowActionableMentionWhispers unused
 param

---
 src/libs/actions/Report.ts | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/libs/actions/Report.ts b/src/libs/actions/Report.ts
index 2ac85dfafa27..402fc939dc86 100644
--- a/src/libs/actions/Report.ts
+++ b/src/libs/actions/Report.ts
@@ -350,7 +350,6 @@ function addActions(reportID: string, text = '', file?: File) {
         reportComment?: string;
         file?: File;
         timezone?: string;
-        shouldAllowActionableMentionWhispers?: boolean;
         clientCreatedTime?: string;
         isOldDotConciergeChat?: boolean;
     };
@@ -361,7 +360,6 @@ function addActions(reportID: string, text = '', file?: File) {
         commentReportActionID: file && reportCommentAction ? reportCommentAction.reportActionID : null,
         reportComment: reportCommentText,
         file,
-        shouldAllowActionableMentionWhispers: true,
         clientCreatedTime: file ? attachmentAction?.created : reportCommentAction?.created,
     };
 

From 1e2a42d6650617a813e1909b37e86279c6675cc1 Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Thu, 1 Feb 2024 14:08:09 +0100
Subject: [PATCH 002/110] Migrate FloatingMessageCounter to TypeScript

---
 ...loatingMessageCounterContainerPropTypes.js | 11 --------
 .../{index.android.js => index.android.tsx}   | 10 +++----
 .../FloatingMessageCounterContainer/index.js  | 21 ---------------
 .../FloatingMessageCounterContainer/index.tsx | 21 +++++++++++++++
 .../FloatingMessageCounterContainer/types.ts  | 12 +++++++++
 .../{index.js => index.tsx}                   | 27 +++++++------------
 6 files changed, 47 insertions(+), 55 deletions(-)
 delete mode 100644 src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/floatingMessageCounterContainerPropTypes.js
 rename src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/{index.android.js => index.android.tsx} (60%)
 delete mode 100644 src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.js
 create mode 100644 src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.tsx
 create mode 100644 src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/types.ts
 rename src/pages/home/report/FloatingMessageCounter/{index.js => index.tsx} (83%)

diff --git a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/floatingMessageCounterContainerPropTypes.js b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/floatingMessageCounterContainerPropTypes.js
deleted file mode 100644
index af0f22208457..000000000000
--- a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/floatingMessageCounterContainerPropTypes.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import PropTypes from 'prop-types';
-
-const propTypes = {
-    /** Styles to be assigned to Container */
-    containerStyles: PropTypes.arrayOf(PropTypes.object).isRequired,
-
-    /** Rendered child component */
-    children: PropTypes.element.isRequired,
-};
-
-export default propTypes;
diff --git a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.android.js b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.android.tsx
similarity index 60%
rename from src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.android.js
rename to src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.android.tsx
index 700a2fb399e4..64391909b197 100644
--- a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.android.js
+++ b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.android.tsx
@@ -1,18 +1,18 @@
 import React from 'react';
 import {Animated, View} from 'react-native';
 import useThemeStyles from '@hooks/useThemeStyles';
-import floatingMessageCounterContainerPropTypes from './floatingMessageCounterContainerPropTypes';
+import type FloatingMessageCounterContainerProps from './types';
 
-function FloatingMessageCounterContainer(props) {
+function FloatingMessageCounterContainer({containerStyles, children}: FloatingMessageCounterContainerProps) {
     const styles = useThemeStyles();
+
     return (
-        <Animated.View style={[styles.floatingMessageCounterWrapperAndroid, ...props.containerStyles]}>
-            <View style={styles.floatingMessageCounterSubWrapperAndroid}>{props.children}</View>
+        <Animated.View style={[styles.floatingMessageCounterWrapperAndroid, containerStyles]}>
+            <View style={styles.floatingMessageCounterSubWrapperAndroid}>{children}</View>
         </Animated.View>
     );
 }
 
-FloatingMessageCounterContainer.propTypes = floatingMessageCounterContainerPropTypes;
 FloatingMessageCounterContainer.displayName = 'FloatingMessageCounterContainer';
 
 export default FloatingMessageCounterContainer;
diff --git a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.js b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.js
deleted file mode 100644
index 19123e65cbf2..000000000000
--- a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.js
+++ /dev/null
@@ -1,21 +0,0 @@
-import React from 'react';
-import {Animated} from 'react-native';
-import useThemeStyles from '@hooks/useThemeStyles';
-import floatingMessageCounterContainerPropTypes from './floatingMessageCounterContainerPropTypes';
-
-function FloatingMessageCounterContainer(props) {
-    const styles = useThemeStyles();
-    return (
-        <Animated.View
-            accessibilityHint={props.accessibilityHint}
-            style={[styles.floatingMessageCounterWrapper, ...props.containerStyles]}
-        >
-            {props.children}
-        </Animated.View>
-    );
-}
-
-FloatingMessageCounterContainer.propTypes = floatingMessageCounterContainerPropTypes;
-FloatingMessageCounterContainer.displayName = 'FloatingMessageCounterContainer';
-
-export default FloatingMessageCounterContainer;
diff --git a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.tsx b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.tsx
new file mode 100644
index 000000000000..8757d66160c4
--- /dev/null
+++ b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.tsx
@@ -0,0 +1,21 @@
+import React from 'react';
+import {Animated} from 'react-native';
+import useThemeStyles from '@hooks/useThemeStyles';
+import type FloatingMessageCounterContainerProps from './types';
+
+function FloatingMessageCounterContainer({accessibilityHint, containerStyles, children}: FloatingMessageCounterContainerProps) {
+    const styles = useThemeStyles();
+
+    return (
+        <Animated.View
+            accessibilityHint={accessibilityHint}
+            style={[styles.floatingMessageCounterWrapper, containerStyles]}
+        >
+            {children}
+        </Animated.View>
+    );
+}
+
+FloatingMessageCounterContainer.displayName = 'FloatingMessageCounterContainer';
+
+export default FloatingMessageCounterContainer;
diff --git a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/types.ts b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/types.ts
new file mode 100644
index 000000000000..96aae0b6d4e7
--- /dev/null
+++ b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/types.ts
@@ -0,0 +1,12 @@
+import type {StyleProp, ViewStyle} from 'react-native';
+import type ChildrenProps from '@src/types/utils/ChildrenProps';
+
+type FloatingMessageCounterContainerProps = ChildrenProps & {
+    /** Styles to be assigned to Container */
+    containerStyles: StyleProp<ViewStyle>;
+
+    /** Specifies the accessibility hint for the component */
+    accessibilityHint?: string;
+};
+
+export default FloatingMessageCounterContainerProps;
diff --git a/src/pages/home/report/FloatingMessageCounter/index.js b/src/pages/home/report/FloatingMessageCounter/index.tsx
similarity index 83%
rename from src/pages/home/report/FloatingMessageCounter/index.js
rename to src/pages/home/report/FloatingMessageCounter/index.tsx
index 07138104bf74..d3048848936d 100644
--- a/src/pages/home/report/FloatingMessageCounter/index.js
+++ b/src/pages/home/report/FloatingMessageCounter/index.tsx
@@ -1,4 +1,3 @@
-import PropTypes from 'prop-types';
 import React, {useCallback, useEffect, useMemo} from 'react';
 import {Animated, View} from 'react-native';
 import Button from '@components/Button';
@@ -12,23 +11,18 @@ import useNativeDriver from '@libs/useNativeDriver';
 import CONST from '@src/CONST';
 import FloatingMessageCounterContainer from './FloatingMessageCounterContainer';
 
-const propTypes = {
+type FloatingMessageCounterProps = {
     /** Whether the New Messages indicator is active */
-    isActive: PropTypes.bool,
+    isActive?: boolean;
 
     /** Callback to be called when user clicks the New Messages indicator */
-    onClick: PropTypes.func,
-};
-
-const defaultProps = {
-    isActive: false,
-    onClick: () => {},
+    onClick?: () => void;
 };
 
 const MARKER_INACTIVE_TRANSLATE_Y = -40;
 const MARKER_ACTIVE_TRANSLATE_Y = 10;
 
-function FloatingMessageCounter(props) {
+function FloatingMessageCounter({isActive = false, onClick = () => {}}: FloatingMessageCounterProps) {
     const theme = useTheme();
     const styles = useThemeStyles();
     const {translate} = useLocalize();
@@ -37,7 +31,6 @@ function FloatingMessageCounter(props) {
     const show = useCallback(() => {
         Animated.spring(translateY, {
             toValue: MARKER_ACTIVE_TRANSLATE_Y,
-            duration: 80,
             useNativeDriver,
         }).start();
     }, [translateY]);
@@ -45,30 +38,29 @@ function FloatingMessageCounter(props) {
     const hide = useCallback(() => {
         Animated.spring(translateY, {
             toValue: MARKER_INACTIVE_TRANSLATE_Y,
-            duration: 80,
             useNativeDriver,
         }).start();
     }, [translateY]);
 
     useEffect(() => {
-        if (props.isActive) {
+        if (isActive) {
             show();
         } else {
             hide();
         }
-    }, [props.isActive, show, hide]);
+    }, [isActive, show, hide]);
 
     return (
         <FloatingMessageCounterContainer
             accessibilityHint={translate('accessibilityHints.scrollToNewestMessages')}
-            containerStyles={[styles.floatingMessageCounterTransformation(translateY)]}
+            containerStyles={styles.floatingMessageCounterTransformation(translateY)}
         >
             <View style={styles.floatingMessageCounter}>
                 <View style={[styles.flexRow, styles.justifyContentBetween, styles.alignItemsCenter]}>
                     <Button
                         success
                         small
-                        onPress={props.onClick}
+                        onPress={onClick}
                     >
                         <View style={[styles.flexRow, styles.alignItemsCenter]}>
                             <Icon
@@ -91,7 +83,6 @@ function FloatingMessageCounter(props) {
     );
 }
 
-FloatingMessageCounter.propTypes = propTypes;
-FloatingMessageCounter.defaultProps = defaultProps;
 FloatingMessageCounter.displayName = 'FloatingMessageCounter';
+
 export default React.memo(FloatingMessageCounter);

From 67774bfbe13f9a56f2aef2fdf76bfd7ea9022d60 Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Thu, 1 Feb 2024 16:01:15 +0100
Subject: [PATCH 003/110] Migrate ReportActionsListItemRenderer and
 ListBoundaryLoader to TypeScript

---
 src/libs/ReportActionsUtils.ts                |   2 +-
 ...undaryLoader.js => ListBoundaryLoader.tsx} |  33 +++---
 src/pages/home/report/ReportActionsList.js    |   2 +-
 ...r.js => ReportActionsListItemRenderer.tsx} | 103 ++++++++----------
 src/types/onyx/ReportAction.ts                |   3 +
 5 files changed, 67 insertions(+), 76 deletions(-)
 rename src/pages/home/report/{ListBoundaryLoader/ListBoundaryLoader.js => ListBoundaryLoader.tsx} (74%)
 rename src/pages/home/report/{ReportActionsListItemRenderer.js => ReportActionsListItemRenderer.tsx} (57%)

diff --git a/src/libs/ReportActionsUtils.ts b/src/libs/ReportActionsUtils.ts
index 453d69e3041c..561fe1a19893 100644
--- a/src/libs/ReportActionsUtils.ts
+++ b/src/libs/ReportActionsUtils.ts
@@ -169,7 +169,7 @@ function isSentMoneyReportAction(reportAction: OnyxEntry<ReportAction>): boolean
  * Returns whether the thread is a transaction thread, which is any thread with IOU parent
  * report action from requesting money (type - create) or from sending money (type - pay with IOUDetails field)
  */
-function isTransactionThread(parentReportAction: OnyxEntry<ReportAction>): boolean {
+function isTransactionThread(parentReportAction: OnyxEntry<ReportAction> | EmptyObject): boolean {
     return (
         parentReportAction?.actionName === CONST.REPORT.ACTIONS.TYPE.IOU &&
         (parentReportAction.originalMessage.type === CONST.IOU.REPORT_ACTION_TYPE.CREATE ||
diff --git a/src/pages/home/report/ListBoundaryLoader/ListBoundaryLoader.js b/src/pages/home/report/ListBoundaryLoader.tsx
similarity index 74%
rename from src/pages/home/report/ListBoundaryLoader/ListBoundaryLoader.js
rename to src/pages/home/report/ListBoundaryLoader.tsx
index e059c2f06019..a359606b9ed5 100644
--- a/src/pages/home/report/ListBoundaryLoader/ListBoundaryLoader.js
+++ b/src/pages/home/report/ListBoundaryLoader.tsx
@@ -1,37 +1,36 @@
-import PropTypes from 'prop-types';
 import React from 'react';
 import {ActivityIndicator, View} from 'react-native';
+import type {ValueOf} from 'type-fest';
 import ReportActionsSkeletonView from '@components/ReportActionsSkeletonView';
 import useNetwork from '@hooks/useNetwork';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import CONST from '@src/CONST';
 
-const propTypes = {
+type ListBoundaryLoaderProps = {
     /** type of rendered loader. Can be 'header' or 'footer' */
-    type: PropTypes.oneOf([CONST.LIST_COMPONENTS.HEADER, CONST.LIST_COMPONENTS.FOOTER]).isRequired,
+    type: ValueOf<typeof CONST.LIST_COMPONENTS>;
 
     /** Shows if we call fetching older report action */
-    isLoadingOlderReportActions: PropTypes.bool,
+    isLoadingOlderReportActions?: boolean;
 
-    /* Shows if we call initial loading of report action */
-    isLoadingInitialReportActions: PropTypes.bool,
+    /** Shows if we call initial loading of report action */
+    isLoadingInitialReportActions?: boolean;
 
     /** Shows if we call fetching newer report action */
-    isLoadingNewerReportActions: PropTypes.bool,
+    isLoadingNewerReportActions?: boolean;
 
     /** Name of the last report action */
-    lastReportActionName: PropTypes.string,
+    lastReportActionName?: string;
 };
 
-const defaultProps = {
-    isLoadingOlderReportActions: false,
-    isLoadingInitialReportActions: false,
-    isLoadingNewerReportActions: false,
-    lastReportActionName: '',
-};
-
-function ListBoundaryLoader({type, isLoadingOlderReportActions, isLoadingInitialReportActions, lastReportActionName, isLoadingNewerReportActions}) {
+function ListBoundaryLoader({
+    type,
+    isLoadingOlderReportActions = false,
+    isLoadingInitialReportActions = false,
+    lastReportActionName = '',
+    isLoadingNewerReportActions = false,
+}: ListBoundaryLoaderProps) {
     const theme = useTheme();
     const styles = useThemeStyles();
     const {isOffline} = useNetwork();
@@ -66,8 +65,6 @@ function ListBoundaryLoader({type, isLoadingOlderReportActions, isLoadingInitial
     }
 }
 
-ListBoundaryLoader.propTypes = propTypes;
-ListBoundaryLoader.defaultProps = defaultProps;
 ListBoundaryLoader.displayName = 'ListBoundaryLoader';
 
 export default ListBoundaryLoader;
diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js
index 2f9e3222206b..aa6535388582 100644
--- a/src/pages/home/report/ReportActionsList.js
+++ b/src/pages/home/report/ReportActionsList.js
@@ -23,7 +23,7 @@ import variables from '@styles/variables';
 import * as Report from '@userActions/Report';
 import CONST from '@src/CONST';
 import FloatingMessageCounter from './FloatingMessageCounter';
-import ListBoundaryLoader from './ListBoundaryLoader/ListBoundaryLoader';
+import ListBoundaryLoader from './ListBoundaryLoader';
 import reportActionPropTypes from './reportActionPropTypes';
 import ReportActionsListItemRenderer from './ReportActionsListItemRenderer';
 
diff --git a/src/pages/home/report/ReportActionsListItemRenderer.js b/src/pages/home/report/ReportActionsListItemRenderer.tsx
similarity index 57%
rename from src/pages/home/report/ReportActionsListItemRenderer.js
rename to src/pages/home/report/ReportActionsListItemRenderer.tsx
index b28a90f496ce..8e03cb533780 100644
--- a/src/pages/home/report/ReportActionsListItemRenderer.js
+++ b/src/pages/home/report/ReportActionsListItemRenderer.tsx
@@ -1,43 +1,35 @@
-import PropTypes from 'prop-types';
 import React, {memo, useMemo} from 'react';
-import _ from 'underscore';
 import * as ReportActionsUtils from '@libs/ReportActionsUtils';
 import * as ReportUtils from '@libs/ReportUtils';
-import reportPropTypes from '@pages/reportPropTypes';
 import CONST from '@src/CONST';
+import type {Report, ReportAction} from '@src/types/onyx';
 import ReportActionItem from './ReportActionItem';
 import ReportActionItemParentAction from './ReportActionItemParentAction';
-import reportActionPropTypes from './reportActionPropTypes';
 
-const propTypes = {
+type ReportActionsListItemRendererProps = {
     /** All the data of the action item */
-    reportAction: PropTypes.shape(reportActionPropTypes).isRequired,
+    reportAction: ReportAction;
 
     /** Position index of the report action in the overall report FlatList view */
-    index: PropTypes.number.isRequired,
+    index: number;
 
     /** Report for this action */
-    report: reportPropTypes.isRequired,
+    report: Report;
 
     /** Should the comment have the appearance of being grouped with the previous comment? */
-    displayAsGroup: PropTypes.bool.isRequired,
+    displayAsGroup: boolean;
 
     /** The ID of the most recent IOU report action connected with the shown report */
-    mostRecentIOUReportActionID: PropTypes.string,
+    mostRecentIOUReportActionID?: string;
 
     /** If the thread divider line should be hidden */
-    shouldHideThreadDividerLine: PropTypes.bool.isRequired,
+    shouldHideThreadDividerLine: boolean;
 
     /** Should we display the new marker on top of the comment? */
-    shouldDisplayNewMarker: PropTypes.bool.isRequired,
+    shouldDisplayNewMarker: boolean;
 
     /** Linked report action ID */
-    linkedReportActionID: PropTypes.string,
-};
-
-const defaultProps = {
-    mostRecentIOUReportActionID: '',
-    linkedReportActionID: '',
+    linkedReportActionID?: string;
 };
 
 function ReportActionsListItemRenderer({
@@ -45,11 +37,11 @@ function ReportActionsListItemRenderer({
     index,
     report,
     displayAsGroup,
-    mostRecentIOUReportActionID,
+    mostRecentIOUReportActionID = '',
     shouldHideThreadDividerLine,
     shouldDisplayNewMarker,
-    linkedReportActionID,
-}) {
+    linkedReportActionID = '',
+}: ReportActionsListItemRendererProps) {
     const shouldDisplayParentAction =
         reportAction.actionName === CONST.REPORT.ACTIONS.TYPE.CREATED &&
         ReportUtils.isChatThread(report) &&
@@ -59,36 +51,37 @@ function ReportActionsListItemRenderer({
      * Create a lightweight ReportAction so as to keep the re-rendering as light as possible by
      * passing in only the required props.
      */
-    const action = useMemo(
-        () => ({
-            reportActionID: reportAction.reportActionID,
-            message: reportAction.message,
-            pendingAction: reportAction.pendingAction,
-            actionName: reportAction.actionName,
-            errors: reportAction.errors,
-            originalMessage: reportAction.originalMessage,
-            childCommenterCount: reportAction.childCommenterCount,
-            linkMetadata: reportAction.linkMetadata,
-            childReportID: reportAction.childReportID,
-            childLastVisibleActionCreated: reportAction.childLastVisibleActionCreated,
-            whisperedToAccountIDs: reportAction.whisperedToAccountIDs,
-            error: reportAction.error,
-            created: reportAction.created,
-            actorAccountID: reportAction.actorAccountID,
-            childVisibleActionCount: reportAction.childVisibleActionCount,
-            childOldestFourAccountIDs: reportAction.childOldestFourAccountIDs,
-            childType: reportAction.childType,
-            person: reportAction.person,
-            isOptimisticAction: reportAction.isOptimisticAction,
-            delegateAccountID: reportAction.delegateAccountID,
-            previousMessage: reportAction.previousMessage,
-            attachmentInfo: reportAction.attachmentInfo,
-            childStateNum: reportAction.childStateNum,
-            childStatusNum: reportAction.childStatusNum,
-            childReportName: reportAction.childReportName,
-            childManagerAccountID: reportAction.childManagerAccountID,
-            childMoneyRequestCount: reportAction.childMoneyRequestCount,
-        }),
+    const action: ReportAction = useMemo(
+        () =>
+            ({
+                reportActionID: reportAction.reportActionID,
+                message: reportAction.message,
+                pendingAction: reportAction.pendingAction,
+                actionName: reportAction.actionName,
+                errors: reportAction.errors,
+                originalMessage: reportAction.originalMessage,
+                childCommenterCount: reportAction.childCommenterCount,
+                linkMetadata: reportAction.linkMetadata,
+                childReportID: reportAction.childReportID,
+                childLastVisibleActionCreated: reportAction.childLastVisibleActionCreated,
+                whisperedToAccountIDs: reportAction.whisperedToAccountIDs,
+                error: reportAction.error,
+                created: reportAction.created,
+                actorAccountID: reportAction.actorAccountID,
+                childVisibleActionCount: reportAction.childVisibleActionCount,
+                childOldestFourAccountIDs: reportAction.childOldestFourAccountIDs,
+                childType: reportAction.childType,
+                person: reportAction.person,
+                isOptimisticAction: reportAction.isOptimisticAction,
+                delegateAccountID: reportAction.delegateAccountID,
+                previousMessage: reportAction.previousMessage,
+                attachmentInfo: reportAction.attachmentInfo,
+                childStateNum: reportAction.childStateNum,
+                childStatusNum: reportAction.childStatusNum,
+                childReportName: reportAction.childReportName,
+                childManagerAccountID: reportAction.childManagerAccountID,
+                childMoneyRequestCount: reportAction.childMoneyRequestCount,
+            } as ReportAction),
         [
             reportAction.actionName,
             reportAction.childCommenterCount,
@@ -130,6 +123,7 @@ function ReportActionsListItemRenderer({
         />
     ) : (
         <ReportActionItem
+            // @ts-expect-error TODO: Remove this once ReportActionItem (https://github.com/Expensify/App/issues/31982) is migrated to TypeScript.
             shouldHideThreadDividerLine={shouldHideThreadDividerLine}
             report={report}
             action={action}
@@ -138,9 +132,8 @@ function ReportActionsListItemRenderer({
             shouldDisplayNewMarker={shouldDisplayNewMarker}
             shouldShowSubscriptAvatar={
                 (ReportUtils.isPolicyExpenseChat(report) || ReportUtils.isExpenseReport(report)) &&
-                _.contains(
-                    [CONST.REPORT.ACTIONS.TYPE.IOU, CONST.REPORT.ACTIONS.TYPE.REPORTPREVIEW, CONST.REPORT.ACTIONS.TYPE.SUBMITTED, CONST.REPORT.ACTIONS.TYPE.APPROVED],
-                    reportAction.actionName,
+                [CONST.REPORT.ACTIONS.TYPE.IOU, CONST.REPORT.ACTIONS.TYPE.REPORTPREVIEW, CONST.REPORT.ACTIONS.TYPE.SUBMITTED, CONST.REPORT.ACTIONS.TYPE.APPROVED].some(
+                    (type) => type === reportAction.actionName,
                 )
             }
             isMostRecentIOUReportAction={reportAction.reportActionID === mostRecentIOUReportActionID}
@@ -149,8 +142,6 @@ function ReportActionsListItemRenderer({
     );
 }
 
-ReportActionsListItemRenderer.propTypes = propTypes;
-ReportActionsListItemRenderer.defaultProps = defaultProps;
 ReportActionsListItemRenderer.displayName = 'ReportActionsListItemRenderer';
 
 export default memo(ReportActionsListItemRenderer);
diff --git a/src/types/onyx/ReportAction.ts b/src/types/onyx/ReportAction.ts
index d2f0afad5b7a..fa791cb4bf91 100644
--- a/src/types/onyx/ReportAction.ts
+++ b/src/types/onyx/ReportAction.ts
@@ -180,6 +180,9 @@ type ReportActionBase = {
     /** Server side errors keyed by microtime */
     errors?: OnyxCommon.Errors;
 
+    /** Error associated with the report action */
+    error: string;
+
     /** Whether the report action is attachment */
     isAttachment?: boolean;
 

From 0fc1dece5e7054d83ddcea770ca0a93aa353400b Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Thu, 1 Feb 2024 16:42:53 +0100
Subject: [PATCH 004/110] Migrate ReportFooter to TypeScript

---
 src/libs/actions/Task.ts                      |   2 +-
 .../{ReportFooter.js => ReportFooter.tsx}     | 138 +++++++++---------
 src/types/onyx/PersonalDetails.ts             |   4 +
 src/types/onyx/ReportAction.ts                |   2 +-
 4 files changed, 72 insertions(+), 74 deletions(-)
 rename src/pages/home/report/{ReportFooter.js => ReportFooter.tsx} (54%)

diff --git a/src/libs/actions/Task.ts b/src/libs/actions/Task.ts
index 60c05d0cb677..53232908783e 100644
--- a/src/libs/actions/Task.ts
+++ b/src/libs/actions/Task.ts
@@ -83,7 +83,7 @@ function createTaskAndNavigate(
     assigneeEmail: string,
     assigneeAccountID = 0,
     assigneeChatReport: OnyxEntry<OnyxTypes.Report> = null,
-    policyID = CONST.POLICY.OWNER_EMAIL_FAKE,
+    policyID: string = CONST.POLICY.OWNER_EMAIL_FAKE,
 ) {
     const optimisticTaskReport = ReportUtils.buildOptimisticTaskReport(currentUserAccountID, assigneeAccountID, parentReportID, title, description, policyID);
 
diff --git a/src/pages/home/report/ReportFooter.js b/src/pages/home/report/ReportFooter.tsx
similarity index 54%
rename from src/pages/home/report/ReportFooter.js
rename to src/pages/home/report/ReportFooter.tsx
index 1761e135481a..9c60fe478120 100644
--- a/src/pages/home/report/ReportFooter.js
+++ b/src/pages/home/report/ReportFooter.tsx
@@ -1,78 +1,79 @@
-import PropTypes from 'prop-types';
+import lodashIsEqual from 'lodash/isEqual';
 import React, {memo, useCallback} from 'react';
 import {Keyboard, View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
-import _, {isEqual} from 'underscore';
+import type {OnyxEntry} from 'react-native-onyx';
 import AnonymousReportFooter from '@components/AnonymousReportFooter';
 import ArchivedReportFooter from '@components/ArchivedReportFooter';
 import OfflineIndicator from '@components/OfflineIndicator';
 import {usePersonalDetails} from '@components/OnyxProvider';
 import SwipeableView from '@components/SwipeableView';
-import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions';
 import useNetwork from '@hooks/useNetwork';
 import useThemeStyles from '@hooks/useThemeStyles';
-import compose from '@libs/compose';
+import useWindowDimensions from '@hooks/useWindowDimensions';
 import * as ReportUtils from '@libs/ReportUtils';
-import reportPropTypes from '@pages/reportPropTypes';
 import variables from '@styles/variables';
 import * as Report from '@userActions/Report';
 import * as Session from '@userActions/Session';
 import * as Task from '@userActions/Task';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import type * as OnyxTypes from '@src/types/onyx';
+import type {PendingAction} from '@src/types/onyx/OnyxCommon';
+import type {EmptyObject} from '@src/types/utils/EmptyObject';
 import ReportActionCompose from './ReportActionCompose/ReportActionCompose';
-import reportActionPropTypes from './reportActionPropTypes';
 
-const propTypes = {
+type ReportFooterOnyxProps = {
+    /** Whether to show the compose input */
+    shouldShowComposeInput: OnyxEntry<boolean>;
+};
+
+type ReportFooterProps = ReportFooterOnyxProps & {
     /** Report object for the current report */
-    report: reportPropTypes,
+    report?: OnyxTypes.Report;
 
-    lastReportAction: PropTypes.shape(reportActionPropTypes),
+    /** The last report action */
+    lastReportAction?: OnyxTypes.ReportAction;
 
-    isEmptyChat: PropTypes.bool,
+    /** Whether the chat is empty */
+    isEmptyChat?: boolean;
 
     /** The pending action when we are adding a chat */
-    pendingAction: PropTypes.string,
+    pendingAction?: PendingAction;
 
     /** Height of the list which the composer is part of */
-    listHeight: PropTypes.number,
+    listHeight?: number;
 
     /** Whetjer the report is ready for display */
-    isReportReadyForDisplay: PropTypes.bool,
-
-    /** Whether to show the compose input */
-    shouldShowComposeInput: PropTypes.bool,
+    isReportReadyForDisplay?: boolean;
 
-    ...windowDimensionsPropTypes,
+    isComposerFullSize?: boolean;
 };
 
-const defaultProps = {
-    report: {reportID: '0'},
-    pendingAction: null,
-    listHeight: 0,
-    isReportReadyForDisplay: true,
-    lastReportAction: null,
-    isEmptyChat: true,
-    shouldShowComposeInput: false,
-};
-
-function ReportFooter(props) {
+function ReportFooter({
+    lastReportAction,
+    pendingAction,
+    report = {reportID: '0'},
+    shouldShowComposeInput = false,
+    isEmptyChat = true,
+    isReportReadyForDisplay = true,
+    listHeight = 0,
+    isComposerFullSize = false,
+}: ReportFooterProps) {
     const styles = useThemeStyles();
     const {isOffline} = useNetwork();
+    const {windowWidth, isSmallScreenWidth} = useWindowDimensions();
     const chatFooterStyles = {...styles.chatFooter, minHeight: !isOffline ? CONST.CHAT_FOOTER_MIN_HEIGHT : 0};
-    const isArchivedRoom = ReportUtils.isArchivedRoom(props.report);
+    const isArchivedRoom = ReportUtils.isArchivedRoom(report);
     const isAnonymousUser = Session.isAnonymousUser();
 
-    const isSmallSizeLayout = props.windowWidth - (props.isSmallScreenWidth ? 0 : variables.sideBarWidth) < variables.anonymousReportFooterBreakpoint;
-    const hideComposer = !ReportUtils.canUserPerformWriteAction(props.report);
+    const isSmallSizeLayout = windowWidth - (isSmallScreenWidth ? 0 : variables.sideBarWidth) < variables.anonymousReportFooterBreakpoint;
+    const hideComposer = !ReportUtils.canUserPerformWriteAction(report);
 
     const allPersonalDetails = usePersonalDetails();
 
-    /**
-     * @param {String} text
-     */
     const handleCreateTask = useCallback(
-        (text) => {
+        (text: string): boolean => {
             /**
              * Matching task rule by group
              * Group 1: Start task rule with []
@@ -90,57 +91,56 @@ function ReportFooter(props) {
                 return false;
             }
             const email = match[1] ? match[1].trim() : undefined;
-            let assignee = {};
+            let assignee: OnyxTypes.PersonalDetails | EmptyObject = {};
             if (email) {
-                assignee = _.find(_.values(allPersonalDetails), (p) => p.login === email) || {};
+                assignee = Object.values(allPersonalDetails).find((value) => value?.login === email) ?? {};
             }
-            Task.createTaskAndNavigate(props.report.reportID, title, '', assignee.login, assignee.accountID, assignee.assigneeChatReport, props.report.policyID);
+            Task.createTaskAndNavigate(report.reportID, title, '', assignee?.login ?? '', assignee.accountID, assignee.assigneeChatReport, report.policyID);
             return true;
         },
-        [allPersonalDetails, props.report.policyID, props.report.reportID],
+        [allPersonalDetails, report.policyID, report.reportID],
     );
 
     const onSubmitComment = useCallback(
-        (text) => {
+        (text: string) => {
             const isTaskCreated = handleCreateTask(text);
             if (isTaskCreated) {
                 return;
             }
-            Report.addComment(props.report.reportID, text);
+            Report.addComment(report.reportID, text);
         },
         // eslint-disable-next-line react-hooks/exhaustive-deps
-        [props.report.reportID, handleCreateTask],
+        [report.reportID, handleCreateTask],
     );
 
     return (
         <>
             {hideComposer && (
-                <View style={[styles.chatFooter, isArchivedRoom || isAnonymousUser ? styles.mt4 : {}, props.isSmallScreenWidth ? styles.mb5 : null]}>
+                <View style={[styles.chatFooter, isArchivedRoom || isAnonymousUser ? styles.mt4 : {}, isSmallScreenWidth ? styles.mb5 : null]}>
                     {isAnonymousUser && !isArchivedRoom && (
                         <AnonymousReportFooter
-                            report={props.report}
+                            report={report}
                             isSmallSizeLayout={isSmallSizeLayout}
                         />
                     )}
-                    {isArchivedRoom && <ArchivedReportFooter report={props.report} />}
-                    {!props.isSmallScreenWidth && (
-                        <View style={styles.offlineIndicatorRow}>{hideComposer && <OfflineIndicator containerStyles={[styles.chatItemComposeSecondaryRow]} />}</View>
-                    )}
+                    {isArchivedRoom && <ArchivedReportFooter report={report} />}
+                    {!isSmallScreenWidth && <View style={styles.offlineIndicatorRow}>{hideComposer && <OfflineIndicator containerStyles={[styles.chatItemComposeSecondaryRow]} />}</View>}
                 </View>
             )}
-            {!hideComposer && (props.shouldShowComposeInput || !props.isSmallScreenWidth) && (
-                <View style={[chatFooterStyles, props.isComposerFullSize && styles.chatFooterFullCompose]}>
+            {!hideComposer && (!!shouldShowComposeInput || !isSmallScreenWidth) && (
+                <View style={[chatFooterStyles, isComposerFullSize && styles.chatFooterFullCompose]}>
                     <SwipeableView onSwipeDown={Keyboard.dismiss}>
                         <ReportActionCompose
+                            // @ts-expect-error TODO: Remove this once ReportActionCompose (https://github.com/Expensify/App/issues/31984) is migrated to TypeScript.
                             onSubmit={onSubmitComment}
-                            reportID={props.report.reportID}
-                            report={props.report}
-                            isEmptyChat={props.isEmptyChat}
-                            lastReportAction={props.lastReportAction}
-                            pendingAction={props.pendingAction}
-                            isComposerFullSize={props.isComposerFullSize}
-                            listHeight={props.listHeight}
-                            isReportReadyForDisplay={props.isReportReadyForDisplay}
+                            reportID={report.reportID}
+                            report={report}
+                            isEmptyChat={isEmptyChat}
+                            lastReportAction={lastReportAction}
+                            pendingAction={pendingAction}
+                            isComposerFullSize={isComposerFullSize}
+                            listHeight={listHeight}
+                            isReportReadyForDisplay={isReportReadyForDisplay}
                         />
                     </SwipeableView>
                 </View>
@@ -150,29 +150,23 @@ function ReportFooter(props) {
 }
 
 ReportFooter.displayName = 'ReportFooter';
-ReportFooter.propTypes = propTypes;
-ReportFooter.defaultProps = defaultProps;
-export default compose(
-    withWindowDimensions,
-    withOnyx({
-        shouldShowComposeInput: {
-            key: ONYXKEYS.SHOULD_SHOW_COMPOSE_INPUT,
-            initialValue: false,
-        },
-    }),
-)(
+
+export default withOnyx<ReportFooterProps, ReportFooterOnyxProps>({
+    shouldShowComposeInput: {
+        key: ONYXKEYS.SHOULD_SHOW_COMPOSE_INPUT,
+        initialValue: false,
+    },
+})(
     memo(
         ReportFooter,
         (prevProps, nextProps) =>
-            isEqual(prevProps.report, nextProps.report) &&
+            lodashIsEqual(prevProps.report, nextProps.report) &&
             prevProps.pendingAction === nextProps.pendingAction &&
             prevProps.listHeight === nextProps.listHeight &&
             prevProps.isComposerFullSize === nextProps.isComposerFullSize &&
             prevProps.isEmptyChat === nextProps.isEmptyChat &&
             prevProps.lastReportAction === nextProps.lastReportAction &&
             prevProps.shouldShowComposeInput === nextProps.shouldShowComposeInput &&
-            prevProps.windowWidth === nextProps.windowWidth &&
-            prevProps.isSmallScreenWidth === nextProps.isSmallScreenWidth &&
             prevProps.isReportReadyForDisplay === nextProps.isReportReadyForDisplay,
     ),
 );
diff --git a/src/types/onyx/PersonalDetails.ts b/src/types/onyx/PersonalDetails.ts
index 8d02d7cf26fc..6177a3bb13b4 100644
--- a/src/types/onyx/PersonalDetails.ts
+++ b/src/types/onyx/PersonalDetails.ts
@@ -1,6 +1,7 @@
 import type {AvatarSource} from '@libs/UserUtils';
 import type TIMEZONES from '@src/TIMEZONES';
 import type * as OnyxCommon from './OnyxCommon';
+import type Report from './Report';
 
 type SelectedTimezone = (typeof TIMEZONES)[number];
 
@@ -82,6 +83,9 @@ type PersonalDetails = {
 
     /** Status of the current user from their personal details */
     status?: Status;
+
+    /** Chat report with assignee of task */
+    assigneeChatReport?: Report;
 };
 
 type PersonalDetailsList = Record<string, PersonalDetails | null>;
diff --git a/src/types/onyx/ReportAction.ts b/src/types/onyx/ReportAction.ts
index fa791cb4bf91..cc56e4cdc02a 100644
--- a/src/types/onyx/ReportAction.ts
+++ b/src/types/onyx/ReportAction.ts
@@ -181,7 +181,7 @@ type ReportActionBase = {
     errors?: OnyxCommon.Errors;
 
     /** Error associated with the report action */
-    error: string;
+    error?: string;
 
     /** Whether the report action is attachment */
     isAttachment?: boolean;

From eac55235d074b5c0972814c263e20c3ae208e47a Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Thu, 1 Feb 2024 17:57:27 +0100
Subject: [PATCH 005/110] Migrate ReportActionsList to TypeScript

---
 ...rtActionsList.js => ReportActionsList.tsx} | 137 +++++++-----------
 src/pages/home/report/ReportFooter.tsx        |   3 +-
 2 files changed, 57 insertions(+), 83 deletions(-)
 rename src/pages/home/report/{ReportActionsList.js => ReportActionsList.tsx} (84%)

diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.tsx
similarity index 84%
rename from src/pages/home/report/ReportActionsList.js
rename to src/pages/home/report/ReportActionsList.tsx
index aa6535388582..420327abffca 100644
--- a/src/pages/home/report/ReportActionsList.js
+++ b/src/pages/home/report/ReportActionsList.tsx
@@ -1,84 +1,66 @@
+import type {ListRenderItemInfo} from '@react-native/virtualized-lists/Lists/VirtualizedList';
 import {useRoute} from '@react-navigation/native';
-import lodashGet from 'lodash/get';
-import PropTypes from 'prop-types';
+import type {RouteProp} from '@react-navigation/native';
 import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
 import {DeviceEventEmitter, InteractionManager} from 'react-native';
+import type {LayoutChangeEvent, NativeScrollEvent, NativeSyntheticEvent, StyleProp, ViewStyle} from 'react-native';
 import Animated, {useAnimatedStyle, useSharedValue, withTiming} from 'react-native-reanimated';
-import _ from 'underscore';
 import InvertedFlatList from '@components/InvertedFlatList';
 import {usePersonalDetails} from '@components/OnyxProvider';
-import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails';
-import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions';
+import withCurrentUserPersonalDetails from '@components/withCurrentUserPersonalDetails';
+import type {WithCurrentUserPersonalDetailsProps} from '@components/withCurrentUserPersonalDetails';
 import useLocalize from '@hooks/useLocalize';
 import useNetwork from '@hooks/useNetwork';
 import useReportScrollManager from '@hooks/useReportScrollManager';
 import useThemeStyles from '@hooks/useThemeStyles';
-import compose from '@libs/compose';
+import useWindowDimensions from '@hooks/useWindowDimensions';
 import DateUtils from '@libs/DateUtils';
 import * as ReportActionsUtils from '@libs/ReportActionsUtils';
 import * as ReportUtils from '@libs/ReportUtils';
 import Visibility from '@libs/Visibility';
-import reportPropTypes from '@pages/reportPropTypes';
+import type {CentralPaneNavigatorParamList} from '@navigation/types';
 import variables from '@styles/variables';
 import * as Report from '@userActions/Report';
 import CONST from '@src/CONST';
+import type * as OnyxTypes from '@src/types/onyx';
+import type {EmptyObject} from '@src/types/utils/EmptyObject';
 import FloatingMessageCounter from './FloatingMessageCounter';
 import ListBoundaryLoader from './ListBoundaryLoader';
-import reportActionPropTypes from './reportActionPropTypes';
 import ReportActionsListItemRenderer from './ReportActionsListItemRenderer';
 
-const propTypes = {
+type ReportActionsListProps = WithCurrentUserPersonalDetailsProps & {
     /** The report currently being looked at */
-    report: reportPropTypes.isRequired,
+    report: OnyxTypes.Report;
 
     /** Sorted actions prepared for display */
-    sortedReportActions: PropTypes.arrayOf(PropTypes.shape(reportActionPropTypes)).isRequired,
+    sortedReportActions: OnyxTypes.ReportAction[];
 
     /** The ID of the most recent IOU report action connected with the shown report */
-    mostRecentIOUReportActionID: PropTypes.string,
+    mostRecentIOUReportActionID?: string;
 
     /** The report metadata loading states */
-    isLoadingInitialReportActions: PropTypes.bool,
+    isLoadingInitialReportActions?: boolean;
 
     /** Are we loading more report actions? */
-    isLoadingOlderReportActions: PropTypes.bool,
+    isLoadingOlderReportActions?: boolean;
 
     /** Are we loading newer report actions? */
-    isLoadingNewerReportActions: PropTypes.bool,
+    isLoadingNewerReportActions?: boolean;
 
     /** Callback executed on list layout */
-    onLayout: PropTypes.func.isRequired,
+    onLayout: (event: LayoutChangeEvent) => void;
 
     /** Callback executed on scroll */
-    onScroll: PropTypes.func,
+    onScroll?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
 
     /** Function to load more chats */
-    loadOlderChats: PropTypes.func.isRequired,
+    loadOlderChats: () => void;
 
     /** Function to load newer chats */
-    loadNewerChats: PropTypes.func.isRequired,
+    loadNewerChats: () => void;
 
-    /** The policy object for the current route */
-    policy: PropTypes.shape({
-        /** The name of the policy */
-        name: PropTypes.string,
-
-        /** The URL for the policy avatar */
-        avatar: PropTypes.string,
-    }),
-
-    ...windowDimensionsPropTypes,
-    ...withCurrentUserPersonalDetailsPropTypes,
-};
-
-const defaultProps = {
-    onScroll: () => {},
-    mostRecentIOUReportActionID: '',
-    isLoadingInitialReportActions: false,
-    isLoadingOlderReportActions: false,
-    isLoadingNewerReportActions: false,
-    ...withCurrentUserPersonalDetailsDefaultProps,
-    policy: {},
+    /** Whether the composer is in full size */
+    isComposerFullSize?: boolean;
 };
 
 const VERTICAL_OFFSET_THRESHOLD = 200;
@@ -88,62 +70,58 @@ const MSG_VISIBLE_THRESHOLD = 250;
 // As there is the possibility that there are multiple instances of a ReportScreen
 // for the same report, we only ever want one subscription to be active, as
 // the subscriptions could otherwise be conflicting.
-const newActionUnsubscribeMap = {};
+const newActionUnsubscribeMap: Record<string, () => void> = {};
 
 // Caching the reportID and reportActionID for unread markers ensures persistent tracking
 // across multiple reports, preserving the green line placement and allowing retrieval
 // of the relevant reportActionID for displaying the green line.
 // We need to persist it across reports because there are at least 3 ReportScreen components created so the
 // internal states are resetted or recreated.
-const cacheUnreadMarkers = new Map();
+const cacheUnreadMarkers = new Map<string, string>();
 
 // Seems that there is an architecture issue that prevents us from using the reportID with useRef
 // the useRef value gets reset when the reportID changes, so we use a global variable to keep track
-let prevReportID = null;
+let prevReportID: string | null = null;
 
 /**
  * Create a unique key for each action in the FlatList.
  * We use the reportActionID that is a string representation of a random 64-bit int, which should be
  * random enough to avoid collisions
- * @param {Object} item
- * @param {Object} item.action
- * @return {String}
  */
-function keyExtractor(item) {
+function keyExtractor(item: OnyxTypes.ReportAction): string {
     return item.reportActionID;
 }
 
-function isMessageUnread(message, lastReadTime) {
+function isMessageUnread(message: OnyxTypes.ReportAction, lastReadTime?: string): boolean {
     if (!lastReadTime) {
-        return Boolean(!ReportActionsUtils.isCreatedAction(message));
+        return !ReportActionsUtils.isCreatedAction(message);
     }
 
-    return Boolean(message && lastReadTime && message.created && lastReadTime < message.created);
+    return !!(message && lastReadTime && message.created && lastReadTime < message.created);
 }
 
 function ReportActionsList({
     report,
-    isLoadingInitialReportActions,
-    isLoadingOlderReportActions,
-    isLoadingNewerReportActions,
+    isLoadingInitialReportActions = false,
+    isLoadingOlderReportActions = false,
+    isLoadingNewerReportActions = false,
     sortedReportActions,
-    windowHeight,
     onScroll,
-    mostRecentIOUReportActionID,
-    isSmallScreenWidth,
+    mostRecentIOUReportActionID = '',
     currentUserPersonalDetails,
     loadNewerChats,
     loadOlderChats,
     onLayout,
     isComposerFullSize,
-}) {
+}: ReportActionsListProps) {
     const personalDetailsList = usePersonalDetails() || CONST.EMPTY_OBJECT;
     const styles = useThemeStyles();
     const {translate} = useLocalize();
+    const {isSmallScreenWidth, windowHeight} = useWindowDimensions();
     const {isOffline} = useNetwork();
-    const route = useRoute();
+    const route = useRoute<RouteProp<CentralPaneNavigatorParamList>>();
     const opacity = useSharedValue(0);
-    const userActiveSince = useRef(null);
+    const userActiveSince = useRef<string | null>(null);
 
     const markerInit = () => {
         if (!cacheUnreadMarkers.has(report.reportID)) {
@@ -161,15 +139,15 @@ function ReportActionsList({
     const lastReadTimeRef = useRef(report.lastReadTime);
 
     const sortedVisibleReportActions = useMemo(
-        () => _.filter(sortedReportActions, (s) => isOffline || s.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE || s.errors),
+        () => sortedReportActions.filter((reportAction) => !!isOffline || reportAction.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE || reportAction.errors),
         [sortedReportActions, isOffline],
     );
-    const lastActionIndex = lodashGet(sortedVisibleReportActions, [0, 'reportActionID']);
+    const lastActionIndex = sortedVisibleReportActions[0]?.reportActionID;
     const reportActionSize = useRef(sortedVisibleReportActions.length);
 
     const previousLastIndex = useRef(lastActionIndex);
 
-    const linkedReportActionID = lodashGet(route, 'params.reportActionID', '');
+    const linkedReportActionID = route.params.reportActionID ?? '';
 
     // This state is used to force a re-render when the user manually marks a message as unread
     // by using a timestamp you can force re-renders without having to worry about if another message was marked as unread before
@@ -216,7 +194,7 @@ function ReportActionsList({
             }
         }
 
-        if (currentUnreadMarker || lastVisibleActionCreatedRef.current === report.lastVisibleActionCreated) {
+        if (!!currentUnreadMarker || lastVisibleActionCreatedRef.current === report.lastVisibleActionCreated) {
             return;
         }
 
@@ -230,7 +208,7 @@ function ReportActionsList({
         if (!userActiveSince.current || report.reportID !== prevReportID) {
             return;
         }
-        if (!messageManuallyMarkedUnread && (lastReadTimeRef.current || '') < report.lastReadTime) {
+        if (!messageManuallyMarkedUnread && (lastReadTimeRef.current ?? '') < (report.lastReadTime ?? '')) {
             cacheUnreadMarkers.delete(report.reportID);
         }
         lastReadTimeRef.current = report.lastReadTime;
@@ -240,7 +218,7 @@ function ReportActionsList({
     }, [report.lastReadTime, report.reportID]);
 
     useEffect(() => {
-        const resetUnreadMarker = (newLastReadTime) => {
+        const resetUnreadMarker = (newLastReadTime: string) => {
             cacheUnreadMarkers.delete(report.reportID);
             lastReadTimeRef.current = newLastReadTime;
             setCurrentUnreadMarker(null);
@@ -324,10 +302,10 @@ function ReportActionsList({
         }
     };
 
-    const trackVerticalScrolling = (event) => {
+    const trackVerticalScrolling = (event: NativeSyntheticEvent<NativeScrollEvent>) => {
         scrollingVerticalOffset.current = event.nativeEvent.contentOffset.y;
         handleUnreadFloatingButton();
-        onScroll(event);
+        onScroll?.(event);
     };
 
     const scrollToBottomAndMarkReportAsRead = () => {
@@ -339,9 +317,8 @@ function ReportActionsList({
     /**
      * Calculates the ideal number of report actions to render in the first render, based on the screen height and on
      * the height of the smallest report action possible.
-     * @return {Number}
      */
-    const initialNumToRender = useMemo(() => {
+    const initialNumToRender = useMemo((): number | undefined => {
         const minimumReportActionHeight = styles.chatItem.paddingTop + styles.chatItem.paddingBottom + variables.fontSizeNormalHeight;
         const availableHeight = windowHeight - (CONST.CHAT_FOOTER_MIN_HEIGHT + variables.contentHeaderHeight);
         const itemsToRender = Math.ceil(availableHeight / minimumReportActionHeight);
@@ -353,24 +330,22 @@ function ReportActionsList({
      * This is so that it will not be conflicting with header's separator line.
      */
     const shouldHideThreadDividerLine = useMemo(
-        () => ReportActionsUtils.getFirstVisibleReportActionID(sortedReportActions, isOffline) === currentUnreadMarker,
+        (): boolean => ReportActionsUtils.getFirstVisibleReportActionID(sortedReportActions, isOffline) === currentUnreadMarker,
         [sortedReportActions, isOffline, currentUnreadMarker],
     );
 
     /**
      * Evaluate new unread marker visibility for each of the report actions.
-     * @returns boolean
      */
-
     const shouldDisplayNewMarker = useCallback(
-        (reportAction, index) => {
+        (reportAction: OnyxTypes.ReportAction, index: number): boolean => {
             let shouldDisplay = false;
             if (!currentUnreadMarker) {
                 const nextMessage = sortedVisibleReportActions[index + 1];
                 const isCurrentMessageUnread = isMessageUnread(reportAction, lastReadTimeRef.current);
                 shouldDisplay = isCurrentMessageUnread && (!nextMessage || !isMessageUnread(nextMessage, lastReadTimeRef.current)) && !ReportActionsUtils.shouldHideNewMarker(reportAction);
                 if (shouldDisplay && !messageManuallyMarkedUnread) {
-                    const isWithinVisibleThreshold = scrollingVerticalOffset.current < MSG_VISIBLE_THRESHOLD ? reportAction.created < userActiveSince.current : true;
+                    const isWithinVisibleThreshold = scrollingVerticalOffset.current < MSG_VISIBLE_THRESHOLD ? reportAction.created < (userActiveSince.current ?? '') : true;
                     // Prevent displaying a new marker line when report action is of type "REPORTPREVIEW" and last actor is the current user
                     shouldDisplay =
                         (ReportActionsUtils.isReportPreviewAction(reportAction) ? !reportAction.childLastActorAccountID : reportAction.actorAccountID) !== Report.getCurrentUserAccountID() &&
@@ -393,7 +368,7 @@ function ReportActionsList({
         // This is to avoid a warning of:
         // Cannot update a component (ReportActionsList) while rendering a different component (CellRenderer).
         let markerFound = false;
-        _.each(sortedVisibleReportActions, (reportAction, index) => {
+        sortedVisibleReportActions.forEach((reportAction, index) => {
             if (!shouldDisplayNewMarker(reportAction, index)) {
                 return;
             }
@@ -409,7 +384,7 @@ function ReportActionsList({
     }, [sortedVisibleReportActions, report.lastReadTime, report.reportID, messageManuallyMarkedUnread, shouldDisplayNewMarker, currentUnreadMarker]);
 
     const renderItem = useCallback(
-        ({item: reportAction, index}) => (
+        ({item: reportAction, index}: ListRenderItemInfo<OnyxTypes.ReportAction>) => (
             <ReportActionsListItemRenderer
                 reportAction={reportAction}
                 index={index}
@@ -430,12 +405,12 @@ function ReportActionsList({
     const hideComposer = !ReportUtils.canUserPerformWriteAction(report);
     const shouldShowReportRecipientLocalTime = ReportUtils.canShowReportRecipientLocalTime(personalDetailsList, report, currentUserPersonalDetails.accountID) && !isComposerFullSize;
 
-    const contentContainerStyle = useMemo(
+    const contentContainerStyle: StyleProp<ViewStyle> = useMemo(
         () => [styles.chatContentScrollView, isLoadingNewerReportActions ? styles.chatContentScrollViewWithHeaderLoader : {}],
         [isLoadingNewerReportActions, styles.chatContentScrollView, styles.chatContentScrollViewWithHeaderLoader],
     );
 
-    const lastReportAction = useMemo(() => _.last(sortedReportActions) || {}, [sortedReportActions]);
+    const lastReportAction: OnyxTypes.ReportAction | EmptyObject = useMemo(() => sortedReportActions.at(-1) ?? {}, [sortedReportActions]);
 
     const listFooterComponent = useCallback(() => {
         // Skip this hook on the first render (when online), as we are not sure if more actions are going to be loaded,
@@ -457,7 +432,7 @@ function ReportActionsList({
     }, [isLoadingInitialReportActions, isLoadingOlderReportActions, lastReportAction.actionName, isOffline]);
 
     const onLayoutInner = useCallback(
-        (event) => {
+        (event: LayoutChangeEvent) => {
             onLayout(event);
         },
         [onLayout],
@@ -511,8 +486,6 @@ function ReportActionsList({
     );
 }
 
-ReportActionsList.propTypes = propTypes;
-ReportActionsList.defaultProps = defaultProps;
 ReportActionsList.displayName = 'ReportActionsList';
 
-export default compose(withWindowDimensions, withCurrentUserPersonalDetails)(ReportActionsList);
+export default withCurrentUserPersonalDetails(ReportActionsList);
diff --git a/src/pages/home/report/ReportFooter.tsx b/src/pages/home/report/ReportFooter.tsx
index 9c60fe478120..a7de44279f36 100644
--- a/src/pages/home/report/ReportFooter.tsx
+++ b/src/pages/home/report/ReportFooter.tsx
@@ -44,9 +44,10 @@ type ReportFooterProps = ReportFooterOnyxProps & {
     /** Height of the list which the composer is part of */
     listHeight?: number;
 
-    /** Whetjer the report is ready for display */
+    /** Whether the report is ready for display */
     isReportReadyForDisplay?: boolean;
 
+    /** Whether the composer is in full size */
     isComposerFullSize?: boolean;
 };
 

From 5e7f24de076255985c3d9d7a62f48b2898ffb7c7 Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Fri, 2 Feb 2024 15:17:05 +0100
Subject: [PATCH 006/110] Migrate ReportActionsView to TypeScript

---
 src/pages/home/report/ReportActionsList.tsx   |   9 +-
 .../report/ReportActionsListItemRenderer.tsx  |   2 +-
 ...rtActionsView.js => ReportActionsView.tsx} | 197 +++++++-----------
 3 files changed, 80 insertions(+), 128 deletions(-)
 rename src/pages/home/report/{ReportActionsView.js => ReportActionsView.tsx} (61%)

diff --git a/src/pages/home/report/ReportActionsList.tsx b/src/pages/home/report/ReportActionsList.tsx
index 420327abffca..6e2cecb73673 100644
--- a/src/pages/home/report/ReportActionsList.tsx
+++ b/src/pages/home/report/ReportActionsList.tsx
@@ -1,6 +1,7 @@
 import type {ListRenderItemInfo} from '@react-native/virtualized-lists/Lists/VirtualizedList';
 import {useRoute} from '@react-navigation/native';
 import type {RouteProp} from '@react-navigation/native';
+import type {DebouncedFunc} from 'lodash';
 import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
 import {DeviceEventEmitter, InteractionManager} from 'react-native';
 import type {LayoutChangeEvent, NativeScrollEvent, NativeSyntheticEvent, StyleProp, ViewStyle} from 'react-native';
@@ -28,6 +29,8 @@ import FloatingMessageCounter from './FloatingMessageCounter';
 import ListBoundaryLoader from './ListBoundaryLoader';
 import ReportActionsListItemRenderer from './ReportActionsListItemRenderer';
 
+type LoadNewerChats = DebouncedFunc<(params: {distanceFromStart: number}) => void>;
+
 type ReportActionsListProps = WithCurrentUserPersonalDetailsProps & {
     /** The report currently being looked at */
     report: OnyxTypes.Report;
@@ -36,7 +39,7 @@ type ReportActionsListProps = WithCurrentUserPersonalDetailsProps & {
     sortedReportActions: OnyxTypes.ReportAction[];
 
     /** The ID of the most recent IOU report action connected with the shown report */
-    mostRecentIOUReportActionID?: string;
+    mostRecentIOUReportActionID?: string | null;
 
     /** The report metadata loading states */
     isLoadingInitialReportActions?: boolean;
@@ -57,7 +60,7 @@ type ReportActionsListProps = WithCurrentUserPersonalDetailsProps & {
     loadOlderChats: () => void;
 
     /** Function to load newer chats */
-    loadNewerChats: () => void;
+    loadNewerChats: LoadNewerChats;
 
     /** Whether the composer is in full size */
     isComposerFullSize?: boolean;
@@ -489,3 +492,5 @@ function ReportActionsList({
 ReportActionsList.displayName = 'ReportActionsList';
 
 export default withCurrentUserPersonalDetails(ReportActionsList);
+
+export type {LoadNewerChats};
diff --git a/src/pages/home/report/ReportActionsListItemRenderer.tsx b/src/pages/home/report/ReportActionsListItemRenderer.tsx
index 8e03cb533780..460f75b29f62 100644
--- a/src/pages/home/report/ReportActionsListItemRenderer.tsx
+++ b/src/pages/home/report/ReportActionsListItemRenderer.tsx
@@ -20,7 +20,7 @@ type ReportActionsListItemRendererProps = {
     displayAsGroup: boolean;
 
     /** The ID of the most recent IOU report action connected with the shown report */
-    mostRecentIOUReportActionID?: string;
+    mostRecentIOUReportActionID?: string | null;
 
     /** If the thread divider line should be hidden */
     shouldHideThreadDividerLine: boolean;
diff --git a/src/pages/home/report/ReportActionsView.js b/src/pages/home/report/ReportActionsView.tsx
similarity index 61%
rename from src/pages/home/report/ReportActionsView.js
rename to src/pages/home/report/ReportActionsView.tsx
index 7e6a6a0b95ff..3d41b592c671 100755
--- a/src/pages/home/report/ReportActionsView.js
+++ b/src/pages/home/report/ReportActionsView.tsx
@@ -1,111 +1,84 @@
 import {useIsFocused} from '@react-navigation/native';
-import lodashGet from 'lodash/get';
-import PropTypes from 'prop-types';
+import lodashIsEqual from 'lodash/isEqual';
+import lodashThrottle from 'lodash/throttle';
 import React, {useContext, useEffect, useMemo, useRef} from 'react';
 import {withOnyx} from 'react-native-onyx';
-import _ from 'underscore';
-import networkPropTypes from '@components/networkPropTypes';
-import {withNetwork} from '@components/OnyxProvider';
-import withLocalize, {withLocalizePropTypes} from '@components/withLocalize';
-import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions';
+import type {OnyxEntry} from 'react-native-onyx';
 import useCopySelectionHelper from '@hooks/useCopySelectionHelper';
 import useInitialValue from '@hooks/useInitialValue';
+import useNetwork from '@hooks/useNetwork';
 import usePrevious from '@hooks/usePrevious';
-import compose from '@libs/compose';
+import useWindowDimensions from '@hooks/useWindowDimensions';
 import getIsReportFullyVisible from '@libs/getIsReportFullyVisible';
 import Performance from '@libs/Performance';
 import * as ReportActionsUtils from '@libs/ReportActionsUtils';
 import {isUserCreatedPolicyRoom} from '@libs/ReportUtils';
 import {didUserLogInDuringSession} from '@libs/SessionUtils';
 import {ReactionListContext} from '@pages/home/ReportScreenContext';
-import reportPropTypes from '@pages/reportPropTypes';
 import * as Report from '@userActions/Report';
 import Timing from '@userActions/Timing';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import type * as OnyxTypes from '@src/types/onyx';
+import {isEmptyObject} from '@src/types/utils/EmptyObject';
 import PopoverReactionList from './ReactionList/PopoverReactionList';
-import reportActionPropTypes from './reportActionPropTypes';
 import ReportActionsList from './ReportActionsList';
+import type {LoadNewerChats} from './ReportActionsList';
 
-const propTypes = {
+type ReportActionsViewOnyxProps = {
+    /** Session info for the currently logged in user. */
+    session: OnyxEntry<OnyxTypes.Session>;
+};
+
+type ReportActionsViewProps = ReportActionsViewOnyxProps & {
     /** The report currently being looked at */
-    report: reportPropTypes.isRequired,
+    report: OnyxTypes.Report;
 
     /** Array of report actions for this report */
-    reportActions: PropTypes.arrayOf(PropTypes.shape(reportActionPropTypes)),
+    reportActions?: OnyxTypes.ReportAction[];
 
     /** The report metadata loading states */
-    isLoadingInitialReportActions: PropTypes.bool,
+    isLoadingInitialReportActions?: boolean;
 
     /** The report actions are loading more data */
-    isLoadingOlderReportActions: PropTypes.bool,
+    isLoadingOlderReportActions?: boolean;
 
     /** The report actions are loading newer data */
-    isLoadingNewerReportActions: PropTypes.bool,
-
-    /** Whether the composer is full size */
-    /* eslint-disable-next-line react/no-unused-prop-types */
-    isComposerFullSize: PropTypes.bool.isRequired,
-
-    /** Information about the network */
-    network: networkPropTypes.isRequired,
-
-    /** The policy object for the current route */
-    policy: PropTypes.shape({
-        /** The name of the policy */
-        name: PropTypes.string,
-
-        /** The URL for the policy avatar */
-        avatar: PropTypes.string,
-    }),
-
-    /** Session info for the currently logged in user. */
-    session: PropTypes.shape({
-        /** Currently logged in user authToken */
-        authToken: PropTypes.string,
-    }),
-
-    ...windowDimensionsPropTypes,
-    ...withLocalizePropTypes,
-};
-
-const defaultProps = {
-    reportActions: [],
-    policy: null,
-    isLoadingInitialReportActions: false,
-    isLoadingOlderReportActions: false,
-    isLoadingNewerReportActions: false,
-    session: {
-        authTokenType: '',
-    },
+    isLoadingNewerReportActions?: boolean;
 };
 
-function ReportActionsView(props) {
+function ReportActionsView({
+    report,
+    session,
+    reportActions = [],
+    isLoadingInitialReportActions = false,
+    isLoadingOlderReportActions = false,
+    isLoadingNewerReportActions = false,
+}: ReportActionsViewProps) {
     useCopySelectionHelper();
     const reactionListRef = useContext(ReactionListContext);
     const didLayout = useRef(false);
     const didSubscribeToReportTypingEvents = useRef(false);
     const isFirstRender = useRef(true);
-    const hasCachedActions = useInitialValue(() => _.size(props.reportActions) > 0);
-    const mostRecentIOUReportActionID = useMemo(() => ReportActionsUtils.getMostRecentIOURequestActionID(props.reportActions), [props.reportActions]);
-    const prevNetworkRef = useRef(props.network);
-    const prevAuthTokenType = usePrevious(props.session.authTokenType);
+    const hasCachedActions = useInitialValue(() => reportActions.length > 0);
+    const mostRecentIOUReportActionID = useMemo(() => ReportActionsUtils.getMostRecentIOURequestActionID(reportActions), [reportActions]);
+    const network = useNetwork();
+    const {isSmallScreenWidth} = useWindowDimensions();
+    const prevNetworkRef = useRef(network);
+    const prevAuthTokenType = usePrevious(session?.authTokenType);
 
-    const prevIsSmallScreenWidthRef = useRef(props.isSmallScreenWidth);
+    const prevIsSmallScreenWidthRef = useRef(isSmallScreenWidth);
 
     const isFocused = useIsFocused();
-    const reportID = props.report.reportID;
-    const hasNewestReportAction = lodashGet(props.reportActions[0], 'isNewestReportAction');
+    const reportID = report.reportID;
+    const hasNewestReportAction = reportActions[0]?.isNewestReportAction;
 
-    /**
-     * @returns {Boolean}
-     */
-    const isReportFullyVisible = useMemo(() => getIsReportFullyVisible(isFocused), [isFocused]);
+    const isReportFullyVisible = useMemo((): boolean => getIsReportFullyVisible(isFocused), [isFocused]);
 
     const openReportIfNecessary = () => {
-        const createChatError = _.get(props.report, ['errorFields', 'createChat']);
+        const createChatError = report.errorFields?.createChat;
         // If the report is optimistic (AKA not yet created) we don't need to call openReport again
-        if (props.report.isOptimisticReport || !_.isEmpty(createChatError)) {
+        if (!!report.isOptimisticReport || !isEmptyObject(createChatError)) {
             return;
         }
 
@@ -122,7 +95,7 @@ function ReportActionsView(props) {
         // When returning from offline to online state we want to trigger a request to OpenReport which
         // will fetch the reportActions data and mark the report as read. If the report is not fully visible
         // then we call ReconnectToReport which only loads the reportActions data without marking the report as read.
-        const wasNetworkChangeDetected = lodashGet(prevNetwork, 'isOffline') && !lodashGet(props.network, 'isOffline');
+        const wasNetworkChangeDetected = prevNetwork.isOffline && !network.isOffline;
         if (wasNetworkChangeDetected) {
             if (isReportFullyVisible) {
                 openReportIfNecessary();
@@ -131,13 +104,13 @@ function ReportActionsView(props) {
             }
         }
         // update ref with current network state
-        prevNetworkRef.current = props.network;
+        prevNetworkRef.current = network;
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [props.network, isReportFullyVisible]);
+    }, [network, isReportFullyVisible]);
 
     useEffect(() => {
-        const wasLoginChangedDetected = prevAuthTokenType === 'anonymousAccount' && !props.session.authTokenType;
-        if (wasLoginChangedDetected && didUserLogInDuringSession() && isUserCreatedPolicyRoom(props.report)) {
+        const wasLoginChangedDetected = prevAuthTokenType === 'anonymousAccount' && !session?.authTokenType;
+        if (wasLoginChangedDetected && didUserLogInDuringSession() && isUserCreatedPolicyRoom(report)) {
             if (isReportFullyVisible) {
                 openReportIfNecessary();
             } else {
@@ -145,33 +118,33 @@ function ReportActionsView(props) {
             }
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [props.session, props.report, isReportFullyVisible]);
+    }, [session, report, isReportFullyVisible]);
 
     useEffect(() => {
         const prevIsSmallScreenWidth = prevIsSmallScreenWidthRef.current;
         // If the view is expanded from mobile to desktop layout
         // we update the new marker position, mark the report as read, and fetch new report actions
-        const didScreenSizeIncrease = prevIsSmallScreenWidth && !props.isSmallScreenWidth;
+        const didScreenSizeIncrease = prevIsSmallScreenWidth && !isSmallScreenWidth;
         const didReportBecomeVisible = isReportFullyVisible && didScreenSizeIncrease;
         if (didReportBecomeVisible) {
             openReportIfNecessary();
         }
         // update ref with current state
-        prevIsSmallScreenWidthRef.current = props.isSmallScreenWidth;
+        prevIsSmallScreenWidthRef.current = isSmallScreenWidth;
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [props.isSmallScreenWidth, props.reportActions, isReportFullyVisible]);
+    }, [isSmallScreenWidth, reportActions, isReportFullyVisible]);
 
     useEffect(() => {
         // Ensures subscription event succeeds when the report/workspace room is created optimistically.
         // Check if the optimistic `OpenReport` or `AddWorkspaceRoom` has succeeded by confirming
         // any `pendingFields.createChat` or `pendingFields.addWorkspaceRoom` fields are set to null.
         // Existing reports created will have empty fields for `pendingFields`.
-        const didCreateReportSuccessfully = !props.report.pendingFields || (!props.report.pendingFields.addWorkspaceRoom && !props.report.pendingFields.createChat);
+        const didCreateReportSuccessfully = !report.pendingFields || (!report.pendingFields.addWorkspaceRoom && !report.pendingFields.createChat);
         if (!didSubscribeToReportTypingEvents.current && didCreateReportSuccessfully) {
             Report.subscribeToReportTypingEvents(reportID);
             didSubscribeToReportTypingEvents.current = true;
         }
-    }, [props.report.pendingFields, didSubscribeToReportTypingEvents, reportID]);
+    }, [report.pendingFields, didSubscribeToReportTypingEvents, reportID]);
 
     /**
      * Retrieves the next set of report actions for the chat once we are nearing the end of what we are currently
@@ -179,11 +152,11 @@ function ReportActionsView(props) {
      */
     const loadOlderChats = () => {
         // Only fetch more if we are neither already fetching (so that we don't initiate duplicate requests) nor offline.
-        if (props.network.isOffline || props.isLoadingOlderReportActions) {
+        if (!!network.isOffline || isLoadingOlderReportActions) {
             return;
         }
 
-        const oldestReportAction = _.last(props.reportActions);
+        const oldestReportAction = reportActions.at(-1);
 
         // Don't load more chats if we're already at the beginning of the chat history
         if (!oldestReportAction || oldestReportAction.actionName === CONST.REPORT.ACTIONS.TYPE.CREATED) {
@@ -197,10 +170,10 @@ function ReportActionsView(props) {
      * Retrieves the next set of report actions for the chat once we are nearing the end of what we are currently
      * displaying.
      */
-    const loadNewerChats = useMemo(
+    const loadNewerChats: LoadNewerChats = useMemo(
         () =>
-            _.throttle(({distanceFromStart}) => {
-                if (props.isLoadingNewerReportActions || props.isLoadingInitialReportActions || hasNewestReportAction) {
+            lodashThrottle(({distanceFromStart}) => {
+                if (isLoadingNewerReportActions || isLoadingInitialReportActions || hasNewestReportAction) {
                     return;
                 }
 
@@ -219,10 +192,10 @@ function ReportActionsView(props) {
                     return;
                 }
 
-                const newestReportAction = _.first(props.reportActions);
+                const newestReportAction = reportActions[0];
                 Report.getNewerActions(reportID, newestReportAction.reportActionID);
             }, 500),
-        [props.isLoadingNewerReportActions, props.isLoadingInitialReportActions, props.reportActions, reportID, hasNewestReportAction],
+        [isLoadingNewerReportActions, isLoadingInitialReportActions, reportActions, reportID, hasNewestReportAction],
     );
 
     /**
@@ -246,43 +219,37 @@ function ReportActionsView(props) {
     };
 
     // Comments have not loaded at all yet do nothing
-    if (!_.size(props.reportActions)) {
+    if (!reportActions.length) {
         return null;
     }
 
     return (
         <>
             <ReportActionsList
-                report={props.report}
+                report={report}
                 onLayout={recordTimeToMeasureItemLayout}
-                sortedReportActions={props.reportActions}
+                sortedReportActions={reportActions}
                 mostRecentIOUReportActionID={mostRecentIOUReportActionID}
                 loadOlderChats={loadOlderChats}
                 loadNewerChats={loadNewerChats}
-                isLoadingInitialReportActions={props.isLoadingInitialReportActions}
-                isLoadingOlderReportActions={props.isLoadingOlderReportActions}
-                isLoadingNewerReportActions={props.isLoadingNewerReportActions}
-                policy={props.policy}
+                isLoadingInitialReportActions={isLoadingInitialReportActions}
+                isLoadingOlderReportActions={isLoadingOlderReportActions}
+                isLoadingNewerReportActions={isLoadingNewerReportActions}
             />
             <PopoverReactionList ref={reactionListRef} />
         </>
     );
 }
 
-ReportActionsView.propTypes = propTypes;
-ReportActionsView.defaultProps = defaultProps;
 ReportActionsView.displayName = 'ReportActionsView';
+ReportActionsView.initMeasured = false;
 
-function arePropsEqual(oldProps, newProps) {
-    if (!_.isEqual(oldProps.reportActions, newProps.reportActions)) {
+function arePropsEqual(oldProps: ReportActionsViewProps, newProps: ReportActionsViewProps): boolean {
+    if (!lodashIsEqual(oldProps.reportActions, newProps.reportActions)) {
         return false;
     }
 
-    if (lodashGet(oldProps.network, 'isOffline') !== lodashGet(newProps.network, 'isOffline')) {
-        return false;
-    }
-
-    if (lodashGet(oldProps.session, 'authTokenType') !== lodashGet(newProps.session, 'authTokenType')) {
+    if (oldProps.session?.authTokenType !== newProps.session?.authTokenType) {
         return false;
     }
 
@@ -298,42 +265,22 @@ function arePropsEqual(oldProps, newProps) {
         return false;
     }
 
-    if (newProps.isSmallScreenWidth !== oldProps.isSmallScreenWidth) {
-        return false;
-    }
-
-    if (newProps.isComposerFullSize !== oldProps.isComposerFullSize) {
-        return false;
-    }
-
-    if (lodashGet(newProps, 'policy.avatar') !== lodashGet(oldProps, 'policy.avatar')) {
-        return false;
-    }
-
-    if (lodashGet(newProps, 'policy.name') !== lodashGet(oldProps, 'policy.name')) {
-        return false;
-    }
-
     return (
         oldProps.report.lastReadTime === newProps.report.lastReadTime &&
         oldProps.report.reportID === newProps.report.reportID &&
         oldProps.report.policyID === newProps.report.policyID &&
         oldProps.report.lastVisibleActionCreated === newProps.report.lastVisibleActionCreated &&
         oldProps.report.isOptimisticReport === newProps.report.isOptimisticReport &&
-        _.isEqual(oldProps.report.pendingFields, newProps.report.pendingFields)
+        lodashIsEqual(oldProps.report.pendingFields, newProps.report.pendingFields)
     );
 }
 
 const MemoizedReportActionsView = React.memo(ReportActionsView, arePropsEqual);
 
-export default compose(
-    Performance.withRenderTrace({id: '<ReportActionsView> rendering'}),
-    withWindowDimensions,
-    withLocalize,
-    withNetwork(),
-    withOnyx({
+export default Performance.withRenderTrace({id: '<ReportActionsView> rendering'})(
+    withOnyx<ReportActionsViewProps, ReportActionsViewOnyxProps>({
         session: {
             key: ONYXKEYS.SESSION,
         },
-    }),
-)(MemoizedReportActionsView);
+    })(MemoizedReportActionsView),
+);

From 600aaec77d8685842afb0b7eaf2b949fffd5097a Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Mon, 5 Feb 2024 14:19:23 +0100
Subject: [PATCH 007/110] Migrate HeaderView to TypeScript

---
 .../reportWithoutHasDraftSelector.ts          |   9 +-
 src/libs/ReportActionsUtils.ts                |   2 +-
 src/libs/actions/Session/index.ts             |   2 +-
 .../home/{HeaderView.js => HeaderView.tsx}    | 177 ++++++++----------
 src/pages/home/report/ReportActionsList.tsx   |   3 +-
 5 files changed, 92 insertions(+), 101 deletions(-)
 rename src/pages/home/{HeaderView.js => HeaderView.tsx} (74%)

diff --git a/src/libs/OnyxSelectors/reportWithoutHasDraftSelector.ts b/src/libs/OnyxSelectors/reportWithoutHasDraftSelector.ts
index 1062aa4b45c6..255081a86c7d 100644
--- a/src/libs/OnyxSelectors/reportWithoutHasDraftSelector.ts
+++ b/src/libs/OnyxSelectors/reportWithoutHasDraftSelector.ts
@@ -1,9 +1,14 @@
-import type {OnyxKeyValue} from '@src/ONYXKEYS';
+import type {OnyxEntry} from 'react-native-onyx';
+import type {Report} from '@src/types/onyx';
 
-export default function reportWithoutHasDraftSelector(report: OnyxKeyValue<'report_'>) {
+type ReportWithoutHasDraft = Omit<Report, 'hasDraft'>;
+
+export default function reportWithoutHasDraftSelector(report: OnyxEntry<Report>): OnyxEntry<ReportWithoutHasDraft> {
     if (!report) {
         return report;
     }
     const {hasDraft, ...reportWithoutHasDraft} = report;
     return reportWithoutHasDraft;
 }
+
+export type {ReportWithoutHasDraft};
diff --git a/src/libs/ReportActionsUtils.ts b/src/libs/ReportActionsUtils.ts
index f8923cfa28fd..97c3e8dbdbfd 100644
--- a/src/libs/ReportActionsUtils.ts
+++ b/src/libs/ReportActionsUtils.ts
@@ -113,7 +113,7 @@ function isModifiedExpenseAction(reportAction: OnyxEntry<ReportAction>): boolean
     return reportAction?.actionName === CONST.REPORT.ACTIONS.TYPE.MODIFIEDEXPENSE;
 }
 
-function isWhisperAction(reportAction: OnyxEntry<ReportAction>): boolean {
+function isWhisperAction(reportAction: OnyxEntry<ReportAction> | EmptyObject): boolean {
     return (reportAction?.whisperedToAccountIDs ?? []).length > 0;
 }
 
diff --git a/src/libs/actions/Session/index.ts b/src/libs/actions/Session/index.ts
index 4fbeba0abaa6..b0660e605358 100644
--- a/src/libs/actions/Session/index.ts
+++ b/src/libs/actions/Session/index.ts
@@ -139,7 +139,7 @@ function signOutAndRedirectToSignIn(shouldReplaceCurrentScreen?: boolean) {
  * @returns same callback if the action is allowed, otherwise a function that signs out and redirects to sign in
  */
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-function checkIfActionIsAllowed<TCallback extends (...args: any[]) => any>(callback: TCallback, isAnonymousAction = false): TCallback | (() => void) {
+function checkIfActionIsAllowed<TCallback extends ((...args: any[]) => any) | void>(callback: TCallback, isAnonymousAction = false): TCallback | (() => void) {
     if (isAnonymousUser() && !isAnonymousAction) {
         return () => signOutAndRedirectToSignIn();
     }
diff --git a/src/pages/home/HeaderView.js b/src/pages/home/HeaderView.tsx
similarity index 74%
rename from src/pages/home/HeaderView.js
rename to src/pages/home/HeaderView.tsx
index e3185eea2731..90ac2a845640 100644
--- a/src/pages/home/HeaderView.js
+++ b/src/pages/home/HeaderView.tsx
@@ -1,19 +1,17 @@
-import lodashGet from 'lodash/get';
-import PropTypes from 'prop-types';
 import React, {memo, useMemo} from 'react';
 import {View} from 'react-native';
+import type {OnyxEntry} from 'react-native-onyx';
 import {withOnyx} from 'react-native-onyx';
-import _ from 'underscore';
 import GoogleMeetIcon from '@assets/images/google-meet.svg';
 import ZoomIcon from '@assets/images/zoom-icon.svg';
 import Button from '@components/Button';
 import ConfirmModal from '@components/ConfirmModal';
 import DisplayNames from '@components/DisplayNames';
+import type {ThreeDotsMenuItem} from '@components/HeaderWithBackButton/types';
 import Icon from '@components/Icon';
 import * as Expensicons from '@components/Icon/Expensicons';
 import MultipleAvatars from '@components/MultipleAvatars';
 import ParentNavigationSubtitle from '@components/ParentNavigationSubtitle';
-import participantPropTypes from '@components/participantPropTypes';
 import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback';
 import ReportHeaderSkeletonView from '@components/ReportHeaderSkeletonView';
 import SubscriptAvatar from '@components/SubscriptAvatar';
@@ -27,109 +25,97 @@ import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import {getGroupChatName} from '@libs/GroupChatUtils';
 import * as HeaderUtils from '@libs/HeaderUtils';
+import type {ReportWithoutHasDraft} from '@libs/OnyxSelectors/reportWithoutHasDraftSelector';
 import reportWithoutHasDraftSelector from '@libs/OnyxSelectors/reportWithoutHasDraftSelector';
 import * as OptionsListUtils from '@libs/OptionsListUtils';
 import * as ReportActionsUtils from '@libs/ReportActionsUtils';
 import * as ReportUtils from '@libs/ReportUtils';
-import reportPropTypes from '@pages/reportPropTypes';
 import * as Link from '@userActions/Link';
 import * as Report from '@userActions/Report';
 import * as Session from '@userActions/Session';
 import * as Task from '@userActions/Task';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import type * as OnyxTypes from '@src/types/onyx';
+import type {EmptyObject} from '@src/types/utils/EmptyObject';
+import {isEmptyObject} from '@src/types/utils/EmptyObject';
 
-const propTypes = {
-    /** Toggles the navigationMenu open and closed */
-    onNavigationMenuButtonClicked: PropTypes.func.isRequired,
-
-    /** The report currently being looked at */
-    report: reportPropTypes,
-
-    /** Personal details of all the users */
-    personalDetails: PropTypes.objectOf(participantPropTypes),
-
-    /** Onyx Props */
-    parentReport: reportPropTypes,
+type PickedPolicyValues = Pick<OnyxTypes.Policy, 'name' | 'avatar' | 'pendingAction'>;
 
+type HeaderViewOnyxProps = {
     /** URL to the assigned guide's appointment booking calendar */
-    guideCalendarLink: PropTypes.string,
+    guideCalendarLink: OnyxEntry<string>;
 
     /** Current user session */
-    session: PropTypes.shape({
-        accountID: PropTypes.number,
-    }),
+    session: OnyxEntry<OnyxTypes.Session>;
 
-    /** The current policy of the report */
-    policy: PropTypes.shape({
-        /** The policy name */
-        name: PropTypes.string,
+    /** Personal details of all the users */
+    personalDetails: OnyxEntry<OnyxTypes.PersonalDetailsList>;
 
-        /** The URL for the policy avatar */
-        avatar: PropTypes.string,
-    }),
+    /** Parent report */
+    parentReport: OnyxEntry<ReportWithoutHasDraft>;
 
-    /** The reportID of the request */
-    reportID: PropTypes.string.isRequired,
+    /** The current policy of the report */
+    policy: PickedPolicyValues | EmptyObject;
 };
 
-const defaultProps = {
-    personalDetails: {},
-    report: null,
-    guideCalendarLink: null,
-    parentReport: {},
-    session: {
-        accountID: 0,
-    },
-    policy: {},
+type HeaderViewProps = HeaderViewOnyxProps & {
+    /** Toggles the navigationMenu open and closed */
+    onNavigationMenuButtonClicked: () => void;
+
+    /** The report currently being looked at */
+    report: OnyxTypes.Report;
+
+    /** The reportID of the request */
+    reportID: string;
 };
 
-function HeaderView(props) {
+function HeaderView({report, personalDetails, parentReport, policy, session, reportID, guideCalendarLink, onNavigationMenuButtonClicked}: HeaderViewProps) {
     const [isDeleteTaskConfirmModalVisible, setIsDeleteTaskConfirmModalVisible] = React.useState(false);
     const {isSmallScreenWidth, windowWidth} = useWindowDimensions();
     const {translate} = useLocalize();
     const theme = useTheme();
     const styles = useThemeStyles();
-    const participants = lodashGet(props.report, 'participantAccountIDs', []);
-    const participantPersonalDetails = OptionsListUtils.getPersonalDetailsForAccountIDs(participants, props.personalDetails);
+    const participants = report.participantAccountIDs ?? [];
+    const participantPersonalDetails = OptionsListUtils.getPersonalDetailsForAccountIDs(participants, personalDetails);
     const isMultipleParticipant = participants.length > 1;
     const displayNamesWithTooltips = ReportUtils.getDisplayNamesWithTooltips(participantPersonalDetails, isMultipleParticipant);
-    const isChatThread = ReportUtils.isChatThread(props.report);
-    const isChatRoom = ReportUtils.isChatRoom(props.report);
-    const isPolicyExpenseChat = ReportUtils.isPolicyExpenseChat(props.report);
-    const isTaskReport = ReportUtils.isTaskReport(props.report);
-    const reportHeaderData = !isTaskReport && !isChatThread && props.report.parentReportID ? props.parentReport : props.report;
+    const isChatThread = ReportUtils.isChatThread(report);
+    const isChatRoom = ReportUtils.isChatRoom(report);
+    const isPolicyExpenseChat = ReportUtils.isPolicyExpenseChat(report);
+    const isTaskReport = ReportUtils.isTaskReport(report);
+    const reportHeaderData = !isTaskReport && !isChatThread && report.parentReportID ? parentReport : report;
     // Use sorted display names for the title for group chats on native small screen widths
-    const title = ReportUtils.isGroupChat(props.report) ? getGroupChatName(props.report) : ReportUtils.getReportName(reportHeaderData);
+    const title = ReportUtils.isGroupChat(report) ? getGroupChatName(report) : ReportUtils.getReportName(reportHeaderData);
     const subtitle = ReportUtils.getChatRoomSubtitle(reportHeaderData);
     const parentNavigationSubtitleData = ReportUtils.getParentNavigationSubtitle(reportHeaderData);
-    const isConcierge = ReportUtils.hasSingleParticipant(props.report) && _.contains(participants, CONST.ACCOUNT_ID.CONCIERGE);
-    const isAutomatedExpensifyAccount = ReportUtils.hasSingleParticipant(props.report) && ReportUtils.hasAutomatedExpensifyAccountIDs(participants);
-    const parentReportAction = ReportActionsUtils.getParentReportAction(props.report);
-    const isCanceledTaskReport = ReportUtils.isCanceledTaskReport(props.report, parentReportAction);
+    const isConcierge = ReportUtils.hasSingleParticipant(report) && participants.includes(CONST.ACCOUNT_ID.CONCIERGE);
+    const isAutomatedExpensifyAccount = ReportUtils.hasSingleParticipant(report) && ReportUtils.hasAutomatedExpensifyAccountIDs(participants);
+    const parentReportAction = ReportActionsUtils.getParentReportAction(report);
+    const isCanceledTaskReport = ReportUtils.isCanceledTaskReport(report, parentReportAction);
     const isWhisperAction = ReportActionsUtils.isWhisperAction(parentReportAction);
-    const isUserCreatedPolicyRoom = ReportUtils.isUserCreatedPolicyRoom(props.report);
-    const isPolicyMember = useMemo(() => !_.isEmpty(props.policy), [props.policy]);
-    const canLeaveRoom = ReportUtils.canLeaveRoom(props.report, isPolicyMember);
-    const isArchivedRoom = ReportUtils.isArchivedRoom(props.report);
+    const isUserCreatedPolicyRoom = ReportUtils.isUserCreatedPolicyRoom(report);
+    const isPolicyMember = useMemo(() => !isEmptyObject(policy), [policy]);
+    const canLeaveRoom = ReportUtils.canLeaveRoom(report, isPolicyMember);
+    const isArchivedRoom = ReportUtils.isArchivedRoom(report);
 
     // We hide the button when we are chatting with an automated Expensify account since it's not possible to contact
     // these users via alternative means. It is possible to request a call with Concierge so we leave the option for them.
-    const threeDotMenuItems = [];
+    const threeDotMenuItems: ThreeDotsMenuItem[] = [];
     if (isTaskReport && !isCanceledTaskReport) {
-        const canModifyTask = Task.canModifyTask(props.report, props.session.accountID);
+        const canModifyTask = Task.canModifyTask(report, session?.accountID ?? -1);
 
         // Task is marked as completed
-        if (ReportUtils.isCompletedTaskReport(props.report) && canModifyTask) {
+        if (ReportUtils.isCompletedTaskReport(report) && canModifyTask) {
             threeDotMenuItems.push({
                 icon: Expensicons.Checkmark,
                 text: translate('task.markAsIncomplete'),
-                onSelected: Session.checkIfActionIsAllowed(() => Task.reopenTask(props.report)),
+                onSelected: Session.checkIfActionIsAllowed(() => Task.reopenTask(report)),
             });
         }
 
         // Task is not closed
-        if (props.report.stateNum !== CONST.REPORT.STATE_NUM.APPROVED && props.report.statusNum !== CONST.REPORT.STATUS_NUM.CLOSED && canModifyTask) {
+        if (report.stateNum !== CONST.REPORT.STATE_NUM.APPROVED && report.statusNum !== CONST.REPORT.STATUS_NUM.CLOSED && canModifyTask) {
             threeDotMenuItems.push({
                 icon: Expensicons.Trashcan,
                 text: translate('common.delete'),
@@ -139,19 +125,12 @@ function HeaderView(props) {
     }
 
     const join = Session.checkIfActionIsAllowed(() =>
-        Report.updateNotificationPreference(
-            props.reportID,
-            props.report.notificationPreference,
-            CONST.REPORT.NOTIFICATION_PREFERENCE.ALWAYS,
-            false,
-            props.report.parentReportID,
-            props.report.parentReportActionID,
-        ),
+        Report.updateNotificationPreference(reportID, report.notificationPreference, CONST.REPORT.NOTIFICATION_PREFERENCE.ALWAYS, false, report.parentReportID, report.parentReportActionID),
     );
 
     const canJoinOrLeave = isChatThread || isUserCreatedPolicyRoom || canLeaveRoom;
-    const canJoin = canJoinOrLeave && !isWhisperAction && props.report.notificationPreference === CONST.REPORT.NOTIFICATION_PREFERENCE.HIDDEN;
-    const canLeave = canJoinOrLeave && ((isChatThread && props.report.notificationPreference.length) || isUserCreatedPolicyRoom || canLeaveRoom);
+    const canJoin = canJoinOrLeave && !isWhisperAction && report.notificationPreference === CONST.REPORT.NOTIFICATION_PREFERENCE.HIDDEN;
+    const canLeave = canJoinOrLeave && ((isChatThread && !!report.notificationPreference?.length) || isUserCreatedPolicyRoom || canLeaveRoom);
     if (canJoin) {
         threeDotMenuItems.push({
             icon: Expensicons.ChatBubbles,
@@ -159,11 +138,11 @@ function HeaderView(props) {
             onSelected: join,
         });
     } else if (canLeave) {
-        const isWorkspaceMemberLeavingWorkspaceRoom = !isChatThread && lodashGet(props.report, 'visibility', '') === CONST.REPORT.VISIBILITY.RESTRICTED && isPolicyMember;
+        const isWorkspaceMemberLeavingWorkspaceRoom = !isChatThread && report.visibility === CONST.REPORT.VISIBILITY.RESTRICTED && isPolicyMember;
         threeDotMenuItems.push({
             icon: Expensicons.ChatBubbles,
             text: translate('common.leave'),
-            onSelected: Session.checkIfActionIsAllowed(() => Report.leaveRoom(props.reportID, isWorkspaceMemberLeavingWorkspaceRoom)),
+            onSelected: Session.checkIfActionIsAllowed(() => Report.leaveRoom(reportID, isWorkspaceMemberLeavingWorkspaceRoom)),
         });
     }
 
@@ -176,14 +155,14 @@ function HeaderView(props) {
         />
     );
 
-    threeDotMenuItems.push(HeaderUtils.getPinMenuItem(props.report));
+    threeDotMenuItems.push(HeaderUtils.getPinMenuItem(report));
 
-    if (isConcierge && props.guideCalendarLink) {
+    if (isConcierge && guideCalendarLink) {
         threeDotMenuItems.push({
             icon: Expensicons.Phone,
             text: translate('videoChatButtonAndMenu.tooltip'),
             onSelected: Session.checkIfActionIsAllowed(() => {
-                Link.openExternalLink(props.guideCalendarLink);
+                Link.openExternalLink(guideCalendarLink);
             }),
         });
     } else if (!isAutomatedExpensifyAccount && !isTaskReport && !isArchivedRoom) {
@@ -205,14 +184,14 @@ function HeaderView(props) {
 
     const shouldShowThreeDotsButton = !!threeDotMenuItems.length;
 
-    const shouldShowSubscript = ReportUtils.shouldReportShowSubscript(props.report);
-    const defaultSubscriptSize = ReportUtils.isExpenseRequest(props.report) ? CONST.AVATAR_SIZE.SMALL_NORMAL : CONST.AVATAR_SIZE.DEFAULT;
-    const icons = ReportUtils.getIcons(reportHeaderData, props.personalDetails);
-    const brickRoadIndicator = ReportUtils.hasReportNameError(props.report) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : '';
+    const shouldShowSubscript = ReportUtils.shouldReportShowSubscript(report);
+    const defaultSubscriptSize = ReportUtils.isExpenseRequest(report) ? CONST.AVATAR_SIZE.SMALL_NORMAL : CONST.AVATAR_SIZE.DEFAULT;
+    const icons = ReportUtils.getIcons(reportHeaderData, personalDetails);
+    const brickRoadIndicator = ReportUtils.hasReportNameError(report) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : '';
     const shouldShowBorderBottom = !isTaskReport || !isSmallScreenWidth;
-    const shouldDisableDetailPage = ReportUtils.shouldDisableDetailPage(props.report);
+    const shouldDisableDetailPage = ReportUtils.shouldDisableDetailPage(report);
 
-    const isLoading = !props.report || !props.report.reportID || !title;
+    const isLoading = !report.reportID || !title;
 
     return (
         <View
@@ -222,12 +201,12 @@ function HeaderView(props) {
             <View style={[styles.appContentHeader]}>
                 <View style={[styles.appContentHeaderTitle, !isSmallScreenWidth && styles.pl5]}>
                     {isLoading ? (
-                        <ReportHeaderSkeletonView onBackButtonPress={props.onNavigationMenuButtonClicked} />
+                        <ReportHeaderSkeletonView onBackButtonPress={onNavigationMenuButtonClicked} />
                     ) : (
                         <>
                             {isSmallScreenWidth && (
                                 <PressableWithoutFeedback
-                                    onPress={props.onNavigationMenuButtonClicked}
+                                    onPress={onNavigationMenuButtonClicked}
                                     style={[styles.LHNToggle]}
                                     accessibilityHint={translate('accessibilityHints.navigateToChatsList')}
                                     accessibilityLabel={translate('common.back')}
@@ -248,7 +227,7 @@ function HeaderView(props) {
                             )}
                             <View style={[styles.flex1, styles.flexRow, styles.alignItemsCenter, styles.justifyContentBetween]}>
                                 <PressableWithoutFeedback
-                                    onPress={() => ReportUtils.navigateToDetailsPage(props.report)}
+                                    onPress={() => ReportUtils.navigateToDetailsPage(report)}
                                     style={[styles.flexRow, styles.alignItemsCenter, styles.flex1]}
                                     disabled={shouldDisableDetailPage}
                                     accessibilityLabel={title}
@@ -275,14 +254,14 @@ function HeaderView(props) {
                                             textStyles={[styles.headerText, styles.pre]}
                                             shouldUseFullTitle={isChatRoom || isPolicyExpenseChat || isChatThread || isTaskReport}
                                         />
-                                        {!_.isEmpty(parentNavigationSubtitleData) && (
+                                        {!isEmptyObject(parentNavigationSubtitleData) && (
                                             <ParentNavigationSubtitle
                                                 parentNavigationSubtitleData={parentNavigationSubtitleData}
-                                                parentReportID={props.report.parentReportID}
+                                                parentReportID={report.parentReportID}
                                                 pressableStyles={[styles.alignSelfStart, styles.mw100]}
                                             />
                                         )}
-                                        {!_.isEmpty(subtitle) && (
+                                        {!!subtitle && (
                                             <Text
                                                 style={[styles.sidebarLinkText, styles.optionAlternateText, styles.textLabelSupporting]}
                                                 numberOfLines={1}
@@ -301,7 +280,7 @@ function HeaderView(props) {
                                     )}
                                 </PressableWithoutFeedback>
                                 <View style={[styles.reportOptions, styles.flexRow, styles.alignItemsCenter]}>
-                                    {isTaskReport && !isSmallScreenWidth && ReportUtils.isOpenTaskReport(props.report) && <TaskHeaderActionButton report={props.report} />}
+                                    {isTaskReport && !isSmallScreenWidth && ReportUtils.isOpenTaskReport(report) && <TaskHeaderActionButton report={report} />}
                                     {canJoin && !isSmallScreenWidth && joinButton}
                                     {shouldShowThreeDotsButton && (
                                         <ThreeDotsMenu
@@ -316,7 +295,7 @@ function HeaderView(props) {
                                 isVisible={isDeleteTaskConfirmModalVisible}
                                 onConfirm={() => {
                                     setIsDeleteTaskConfirmModalVisible(false);
-                                    Session.checkIfActionIsAllowed(Task.deleteTask(props.reportID, props.report.reportName, props.report.stateNum, props.report.statusNum));
+                                    Session.checkIfActionIsAllowed(Task.deleteTask(reportID, report.reportName ?? '', report.stateNum ?? 0, report.statusNum ?? 0));
                                 }}
                                 onCancel={() => setIsDeleteTaskConfirmModalVisible(false)}
                                 title={translate('task.deleteTask')}
@@ -333,19 +312,18 @@ function HeaderView(props) {
         </View>
     );
 }
-HeaderView.propTypes = propTypes;
+
 HeaderView.displayName = 'HeaderView';
-HeaderView.defaultProps = defaultProps;
 
 export default memo(
-    withOnyx({
+    withOnyx<HeaderViewProps, HeaderViewOnyxProps>({
         guideCalendarLink: {
             key: ONYXKEYS.ACCOUNT,
-            selector: (account) => (account && account.guideCalendarLink) || null,
+            selector: (account) => account?.guideCalendarLink ?? null,
             initialValue: null,
         },
         parentReport: {
-            key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT}${report.parentReportID || report.reportID}`,
+            key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT}${report?.parentReportID ?? report?.reportID}`,
             selector: reportWithoutHasDraftSelector,
         },
         session: {
@@ -353,7 +331,14 @@ export default memo(
         },
         policy: {
             key: ({report}) => `${ONYXKEYS.COLLECTION.POLICY}${report ? report.policyID : '0'}`,
-            selector: (policy) => _.pick(policy, ['name', 'avatar', 'pendingAction']),
+            selector: (policy: OnyxEntry<OnyxTypes.Policy> | undefined): PickedPolicyValues | EmptyObject => {
+                if (!policy) {
+                    return {};
+                }
+
+                const valuesToPick = ['name', 'avatar', 'pendingAction'] as const;
+                return valuesToPick.reduce((values, key) => (key in policy ? {...values, [key]: policy[key]} : values), {});
+            },
         },
         personalDetails: {
             key: ONYXKEYS.PERSONAL_DETAILS_LIST,
diff --git a/src/pages/home/report/ReportActionsList.tsx b/src/pages/home/report/ReportActionsList.tsx
index 6e2cecb73673..f9b647c9db8f 100644
--- a/src/pages/home/report/ReportActionsList.tsx
+++ b/src/pages/home/report/ReportActionsList.tsx
@@ -23,6 +23,7 @@ import type {CentralPaneNavigatorParamList} from '@navigation/types';
 import variables from '@styles/variables';
 import * as Report from '@userActions/Report';
 import CONST from '@src/CONST';
+import type SCREENS from '@src/SCREENS';
 import type * as OnyxTypes from '@src/types/onyx';
 import type {EmptyObject} from '@src/types/utils/EmptyObject';
 import FloatingMessageCounter from './FloatingMessageCounter';
@@ -122,7 +123,7 @@ function ReportActionsList({
     const {translate} = useLocalize();
     const {isSmallScreenWidth, windowHeight} = useWindowDimensions();
     const {isOffline} = useNetwork();
-    const route = useRoute<RouteProp<CentralPaneNavigatorParamList>>();
+    const route = useRoute<RouteProp<CentralPaneNavigatorParamList, typeof SCREENS.REPORT>>();
     const opacity = useSharedValue(0);
     const userActiveSince = useRef<string | null>(null);
 

From 005e09c7f659a4f1d0fc81424314bc9219744679 Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Tue, 6 Feb 2024 11:33:57 +0100
Subject: [PATCH 008/110] Migrate ReportScreen to TypeScript

---
 src/components/DragAndDrop/Provider/types.ts  |   2 +-
 src/components/MoneyReportHeader.tsx          |   6 +-
 src/components/ScreenWrapper.tsx              |   4 +-
 src/components/withViewportOffsetTop.tsx      |   2 +
 .../AppNavigator/ReportScreenWrapper.tsx      |   1 -
 src/libs/ReportUtils.ts                       |   4 +-
 src/libs/actions/IOU.js                       |   4 +-
 src/pages/home/HeaderView.tsx                 |   2 +-
 .../{ReportScreen.js => ReportScreen.tsx}     | 507 ++++++++----------
 src/pages/home/ReportScreenContext.ts         |   6 +-
 src/pages/home/report/ReportFooter.tsx        |   2 +-
 11 files changed, 246 insertions(+), 294 deletions(-)
 rename src/pages/home/{ReportScreen.js => ReportScreen.tsx} (60%)

diff --git a/src/components/DragAndDrop/Provider/types.ts b/src/components/DragAndDrop/Provider/types.ts
index b4394056cac5..57d0fb47c637 100644
--- a/src/components/DragAndDrop/Provider/types.ts
+++ b/src/components/DragAndDrop/Provider/types.ts
@@ -8,7 +8,7 @@ type DragAndDropProviderProps = {
     isDisabled?: boolean;
 
     /** Indicate that users are dragging file or not */
-    setIsDraggingOver: (value: boolean) => void;
+    setIsDraggingOver?: (value: boolean) => void;
 };
 
 type SetOnDropHandlerCallback = (event: DragEvent) => void;
diff --git a/src/components/MoneyReportHeader.tsx b/src/components/MoneyReportHeader.tsx
index 5209ab894828..5f58640d7fc7 100644
--- a/src/components/MoneyReportHeader.tsx
+++ b/src/components/MoneyReportHeader.tsx
@@ -43,7 +43,7 @@ type MoneyReportHeaderProps = MoneyReportHeaderOnyxProps & {
     report: OnyxTypes.Report;
 
     /** The policy tied to the money request report */
-    policy: OnyxTypes.Policy;
+    policy: OnyxEntry<OnyxTypes.Policy>;
 };
 
 function MoneyReportHeader({session, policy, chatReport, nextStep, report: moneyRequestReport}: MoneyReportHeaderProps) {
@@ -85,8 +85,8 @@ function MoneyReportHeader({session, policy, chatReport, nextStep, report: money
 
     // The submit button should be success green colour only if the user is submitter and the policy does not have Scheduled Submit turned on
     const isWaitingForSubmissionFromCurrentUser = useMemo(
-        () => chatReport?.isOwnPolicyExpenseChat && !(policy.harvesting?.enabled ?? policy.isHarvestingEnabled),
-        [chatReport?.isOwnPolicyExpenseChat, policy.harvesting?.enabled, policy.isHarvestingEnabled],
+        () => chatReport?.isOwnPolicyExpenseChat && !(policy?.harvesting?.enabled ?? policy?.isHarvestingEnabled),
+        [chatReport?.isOwnPolicyExpenseChat, policy?.harvesting?.enabled, policy?.isHarvestingEnabled],
     );
 
     const threeDotsMenuItems = [HeaderUtils.getPinMenuItem(moneyRequestReport)];
diff --git a/src/components/ScreenWrapper.tsx b/src/components/ScreenWrapper.tsx
index a7d05a335d43..d9a3f12fd9c3 100644
--- a/src/components/ScreenWrapper.tsx
+++ b/src/components/ScreenWrapper.tsx
@@ -13,7 +13,7 @@ import useNetwork from '@hooks/useNetwork';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import * as Browser from '@libs/Browser';
-import type {RootStackParamList} from '@libs/Navigation/types';
+import type {CentralPaneNavigatorParamList, RootStackParamList} from '@libs/Navigation/types';
 import toggleTestToolsModal from '@userActions/TestTool';
 import CONST from '@src/CONST';
 import CustomDevMenu from './CustomDevMenu';
@@ -85,7 +85,7 @@ type ScreenWrapperProps = {
      *
      * This is required because transitionEnd event doesn't trigger in the testing environment.
      */
-    navigation?: StackNavigationProp<RootStackParamList>;
+    navigation?: StackNavigationProp<RootStackParamList> | StackNavigationProp<CentralPaneNavigatorParamList>;
 
     /** Whether to show offline indicator on wide screens */
     shouldShowOfflineIndicatorInWideScreen?: boolean;
diff --git a/src/components/withViewportOffsetTop.tsx b/src/components/withViewportOffsetTop.tsx
index d3e9b63ad3ee..2b659ac608b5 100644
--- a/src/components/withViewportOffsetTop.tsx
+++ b/src/components/withViewportOffsetTop.tsx
@@ -40,3 +40,5 @@ export default function withViewportOffsetTop<TProps extends ViewportOffsetTopPr
 
     return forwardRef(WithViewportOffsetTop);
 }
+
+export type {ViewportOffsetTopProps};
diff --git a/src/libs/Navigation/AppNavigator/ReportScreenWrapper.tsx b/src/libs/Navigation/AppNavigator/ReportScreenWrapper.tsx
index fd764cdb5861..5d710afa69e9 100644
--- a/src/libs/Navigation/AppNavigator/ReportScreenWrapper.tsx
+++ b/src/libs/Navigation/AppNavigator/ReportScreenWrapper.tsx
@@ -13,7 +13,6 @@ function ReportScreenWrapper({route, navigation}: ReportScreenWrapperProps) {
     return (
         <>
             <ReportScreen
-                // @ts-expect-error Error will be resolved after ReportScreen migration to TypeScript
                 route={route}
                 navigation={navigation}
             />
diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index 568ce49ff961..d7d0dbf64e34 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -1180,7 +1180,7 @@ function isMoneyRequest(reportOrID: OnyxEntry<Report> | string): boolean {
 /**
  * Checks if a report is an IOU or expense report.
  */
-function isMoneyRequestReport(reportOrID: OnyxEntry<Report> | string): boolean {
+function isMoneyRequestReport(reportOrID: OnyxEntry<Report> | EmptyObject | string): boolean {
     const report = typeof reportOrID === 'object' ? reportOrID : allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${reportOrID}`] ?? null;
     return isIOUReport(report) || isExpenseReport(report);
 }
@@ -4209,7 +4209,7 @@ function getAddWorkspaceRoomOrChatReportErrors(report: OnyxEntry<Report>): Recor
 /**
  * Return true if the Money Request report is marked for deletion.
  */
-function isMoneyRequestReportPendingDeletion(report: OnyxEntry<Report>): boolean {
+function isMoneyRequestReportPendingDeletion(report: OnyxEntry<Report> | EmptyObject): boolean {
     if (!isMoneyRequestReport(report)) {
         return false;
     }
diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js
index 4db89a1e926b..88d308d2470e 100644
--- a/src/libs/actions/IOU.js
+++ b/src/libs/actions/IOU.js
@@ -867,8 +867,8 @@ function getMoneyRequestInformation(
         chatReport,
         transaction: optimisticTransaction,
         iouAction,
-        createdChatReportActionID: isNewChatReport ? optimisticCreatedActionForChat.reportActionID : 0,
-        createdIOUReportActionID: shouldCreateNewMoneyRequestReport ? optimisticCreatedActionForIOU.reportActionID : 0,
+        createdChatReportActionID: isNewChatReport ? optimisticCreatedActionForChat.reportActionID : '',
+        createdIOUReportActionID: shouldCreateNewMoneyRequestReport ? optimisticCreatedActionForIOU.reportActionID : '',
         reportPreviewAction,
         onyxData: {
             optimisticData,
diff --git a/src/pages/home/HeaderView.tsx b/src/pages/home/HeaderView.tsx
index 90ac2a845640..e22c3278c6c4 100644
--- a/src/pages/home/HeaderView.tsx
+++ b/src/pages/home/HeaderView.tsx
@@ -331,7 +331,7 @@ export default memo(
         },
         policy: {
             key: ({report}) => `${ONYXKEYS.COLLECTION.POLICY}${report ? report.policyID : '0'}`,
-            selector: (policy: OnyxEntry<OnyxTypes.Policy> | undefined): PickedPolicyValues | EmptyObject => {
+            selector: (policy: OnyxEntry<OnyxTypes.Policy>): PickedPolicyValues | EmptyObject => {
                 if (!policy) {
                     return {};
                 }
diff --git a/src/pages/home/ReportScreen.js b/src/pages/home/ReportScreen.tsx
similarity index 60%
rename from src/pages/home/ReportScreen.js
rename to src/pages/home/ReportScreen.tsx
index bfe27910c943..24fcd45d3339 100644
--- a/src/pages/home/ReportScreen.js
+++ b/src/pages/home/ReportScreen.tsx
@@ -1,10 +1,13 @@
 import {useIsFocused} from '@react-navigation/native';
-import lodashGet from 'lodash/get';
-import PropTypes from 'prop-types';
+import type {StackScreenProps} from '@react-navigation/stack';
+import lodashIsEqual from 'lodash/isEqual';
 import React, {memo, useCallback, useEffect, useMemo, useRef, useState} from 'react';
 import {View} from 'react-native';
+import type {FlatList, ViewStyle} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
-import _ from 'underscore';
+import type {OnyxCollection, OnyxEntry} from 'react-native-onyx';
+import type {WithOnyxInstanceState} from 'react-native-onyx/dist/types';
+import type {LayoutChangeEvent} from 'react-native/Libraries/Types/CoreEventTypes';
 import Banner from '@components/Banner';
 import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView';
 import DragAndDropProvider from '@components/DragAndDrop/Provider';
@@ -14,154 +17,119 @@ import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import ReportActionsSkeletonView from '@components/ReportActionsSkeletonView';
 import ScreenWrapper from '@components/ScreenWrapper';
 import TaskHeaderActionButton from '@components/TaskHeaderActionButton';
-import withCurrentReportID, {withCurrentReportIDDefaultProps, withCurrentReportIDPropTypes} from '@components/withCurrentReportID';
+import withCurrentReportID from '@components/withCurrentReportID';
+import type {CurrentReportIDContextValue} from '@components/withCurrentReportID';
 import withViewportOffsetTop from '@components/withViewportOffsetTop';
+import type {ViewportOffsetTopProps} from '@components/withViewportOffsetTop';
 import useAppFocusEvent from '@hooks/useAppFocusEvent';
 import useLocalize from '@hooks/useLocalize';
 import usePrevious from '@hooks/usePrevious';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import Timing from '@libs/actions/Timing';
-import compose from '@libs/compose';
 import Navigation from '@libs/Navigation/Navigation';
 import clearReportNotifications from '@libs/Notification/clearReportNotifications';
 import reportWithoutHasDraftSelector from '@libs/OnyxSelectors/reportWithoutHasDraftSelector';
+import type {ReportWithoutHasDraft} from '@libs/OnyxSelectors/reportWithoutHasDraftSelector';
 import Performance from '@libs/Performance';
 import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils';
 import * as ReportActionsUtils from '@libs/ReportActionsUtils';
 import * as ReportUtils from '@libs/ReportUtils';
-import reportMetadataPropTypes from '@pages/reportMetadataPropTypes';
-import reportPropTypes from '@pages/reportPropTypes';
+import type {CentralPaneNavigatorParamList} from '@navigation/types';
 import * as ComposerActions from '@userActions/Composer';
 import * as Report from '@userActions/Report';
 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 {isEmptyObject} from '@src/types/utils/EmptyObject';
 import HeaderView from './HeaderView';
-import reportActionPropTypes from './report/reportActionPropTypes';
 import ReportActionsView from './report/ReportActionsView';
 import ReportFooter from './report/ReportFooter';
 import {ActionListContext, ReactionListContext} from './ReportScreenContext';
+import type {ActionListContextType, ReactionListRef, ScrollPosition} from './ReportScreenContext';
 
-const propTypes = {
-    /** Navigation route context info provided by react navigation */
-    route: PropTypes.shape({
-        /** Route specific parameters used on this screen */
-        params: PropTypes.shape({
-            /** The ID of the report this screen should display */
-            reportID: PropTypes.string,
-
-            /** The reportActionID to scroll to */
-            reportActionID: PropTypes.string,
-        }).isRequired,
-    }).isRequired,
-
+type ReportScreenOnyxProps = {
     /** Tells us if the sidebar has rendered */
-    isSidebarLoaded: PropTypes.bool,
+    isSidebarLoaded: OnyxEntry<boolean>;
 
-    /** The report currently being looked at */
-    report: reportPropTypes,
+    /** Beta features list */
+    betas: OnyxEntry<OnyxTypes.Beta[]>;
 
-    /** The report metadata loading states */
-    reportMetadata: reportMetadataPropTypes,
+    /** The policies which the user has access to */
+    policies: OnyxCollection<OnyxTypes.Policy>;
 
-    /** All the report actions for this report */
-    reportActions: PropTypes.objectOf(PropTypes.shape(reportActionPropTypes)),
+    /** The account manager report ID */
+    accountManagerReportID: OnyxEntry<string>;
 
-    /** The report's parentReportAction */
-    parentReportAction: PropTypes.shape(reportActionPropTypes),
+    /** Whether user is leaving the current report */
+    userLeavingStatus: OnyxEntry<boolean>;
 
     /** Whether the composer is full size */
-    isComposerFullSize: PropTypes.bool,
+    isComposerFullSize: OnyxEntry<boolean>;
 
-    /** Beta features list */
-    betas: PropTypes.arrayOf(PropTypes.string),
+    /** All the report actions for this report */
+    reportActions: OnyxTypes.ReportAction[];
 
-    /** The policies which the user has access to */
-    policies: PropTypes.objectOf(
-        PropTypes.shape({
-            /** The policy name */
-            name: PropTypes.string,
+    /** The report currently being looked at */
+    report: OnyxEntry<ReportWithoutHasDraft>;
 
-            /** The type of the policy */
-            type: PropTypes.string,
-        }),
-    ),
+    /** The report metadata loading states */
+    reportMetadata: OnyxEntry<OnyxTypes.ReportMetadata>;
 
-    /** The account manager report ID */
-    accountManagerReportID: PropTypes.string,
+    /** The report's parentReportAction */
+    parentReportAction: OnyxEntry<OnyxTypes.ReportAction>;
+};
 
+type OnyxHOCProps = {
     /** Onyx function that marks the component ready for hydration */
-    markReadyForHydration: PropTypes.func,
-
-    /** Whether user is leaving the current report */
-    userLeavingStatus: PropTypes.bool,
-
-    viewportOffsetTop: PropTypes.number.isRequired,
-    ...withCurrentReportIDPropTypes,
+    markReadyForHydration?: () => void;
 };
 
-const defaultProps = {
-    isSidebarLoaded: false,
-    reportActions: {},
-    parentReportAction: {},
-    report: {},
-    reportMetadata: {
-        isLoadingInitialReportActions: true,
-        isLoadingOlderReportActions: false,
-        isLoadingNewerReportActions: false,
-    },
-    isComposerFullSize: false,
-    betas: [],
-    policies: {},
-    accountManagerReportID: null,
-    userLeavingStatus: false,
-    markReadyForHydration: null,
-    ...withCurrentReportIDDefaultProps,
-};
+type ReportScreenNavigationProps = StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.REPORT>;
+
+type ReportScreenProps = OnyxHOCProps & ViewportOffsetTopProps & CurrentReportIDContextValue & ReportScreenOnyxProps & ReportScreenNavigationProps;
 
-/**
- * Get the currently viewed report ID as number
- *
- * @param {Object} route
- * @param {Object} route.params
- * @param {String} route.params.reportID
- * @returns {String}
- */
-function getReportID(route) {
+/** Get the currently viewed report ID as number */
+function getReportID(route: ReportScreenNavigationProps['route']): string {
     // The report ID is used in an onyx key. If it's an empty string, onyx will return
     // a collection instead of an individual report.
     // We can't use the default value functionality of `lodash.get()` because it only
     // provides a default value on `undefined`, and will return an empty string.
     // Placing the default value outside of `lodash.get()` is intentional.
-    return String(lodashGet(route, 'params.reportID') || 0);
+    return String(route.params?.reportID ?? 0);
 }
 
 function ReportScreen({
-    betas,
+    betas = [],
     route,
     report: reportProp,
-    reportMetadata,
-    reportActions,
+    reportMetadata = {
+        isLoadingInitialReportActions: true,
+        isLoadingOlderReportActions: false,
+        isLoadingNewerReportActions: false,
+    },
+    reportActions = [],
     parentReportAction,
     accountManagerReportID,
     markReadyForHydration,
-    policies,
-    isSidebarLoaded,
+    policies = {},
+    isSidebarLoaded = false,
     viewportOffsetTop,
-    isComposerFullSize,
-    errors,
-    userLeavingStatus,
-    currentReportID,
+    isComposerFullSize = false,
+    userLeavingStatus = false,
+    currentReportID = '',
     navigation,
-}) {
+}: ReportScreenProps) {
     const styles = useThemeStyles();
     const {translate} = useLocalize();
     const {isSmallScreenWidth} = useWindowDimensions();
+    const isFocused = useIsFocused();
 
     const firstRenderRef = useRef(true);
-    const flatListRef = useRef();
-    const reactionListRef = useRef();
+    const flatListRef = useRef<FlatList>(null);
+    const reactionListRef = useRef<ReactionListRef>(null);
     /**
      * Create a lightweight Report so as to keep the re-rendering as light as possible by
      * passing in only the required props.
@@ -171,77 +139,77 @@ function ReportScreen({
      * put this into onyx selector as it will be the same.
      */
     const report = useMemo(
-        () => ({
-            lastReadTime: reportProp.lastReadTime,
-            reportID: reportProp.reportID,
-            policyID: reportProp.policyID,
-            lastVisibleActionCreated: reportProp.lastVisibleActionCreated,
-            statusNum: reportProp.statusNum,
-            stateNum: reportProp.stateNum,
-            writeCapability: reportProp.writeCapability,
-            type: reportProp.type,
-            errorFields: reportProp.errorFields,
-            isPolicyExpenseChat: reportProp.isPolicyExpenseChat,
-            parentReportID: reportProp.parentReportID,
-            parentReportActionID: reportProp.parentReportActionID,
-            chatType: reportProp.chatType,
-            pendingFields: reportProp.pendingFields,
-            isDeletedParentAction: reportProp.isDeletedParentAction,
-            reportName: reportProp.reportName,
-            description: reportProp.description,
-            managerID: reportProp.managerID,
-            total: reportProp.total,
-            nonReimbursableTotal: reportProp.nonReimbursableTotal,
-            reportFields: reportProp.reportFields,
-            ownerAccountID: reportProp.ownerAccountID,
-            currency: reportProp.currency,
-            participantAccountIDs: reportProp.participantAccountIDs,
-            isWaitingOnBankAccount: reportProp.isWaitingOnBankAccount,
-            iouReportID: reportProp.iouReportID,
-            isOwnPolicyExpenseChat: reportProp.isOwnPolicyExpenseChat,
-            notificationPreference: reportProp.notificationPreference,
-            isPinned: reportProp.isPinned,
-            chatReportID: reportProp.chatReportID,
-            visibility: reportProp.visibility,
-            oldPolicyName: reportProp.oldPolicyName,
-            policyName: reportProp.policyName,
-            isOptimisticReport: reportProp.isOptimisticReport,
+        (): OnyxTypes.Report => ({
+            lastReadTime: reportProp?.lastReadTime,
+            reportID: reportProp?.reportID ?? '',
+            policyID: reportProp?.policyID,
+            lastVisibleActionCreated: reportProp?.lastVisibleActionCreated,
+            statusNum: reportProp?.statusNum,
+            stateNum: reportProp?.stateNum,
+            writeCapability: reportProp?.writeCapability,
+            type: reportProp?.type,
+            errorFields: reportProp?.errorFields,
+            isPolicyExpenseChat: reportProp?.isPolicyExpenseChat,
+            parentReportID: reportProp?.parentReportID,
+            parentReportActionID: reportProp?.parentReportActionID,
+            chatType: reportProp?.chatType,
+            pendingFields: reportProp?.pendingFields,
+            isDeletedParentAction: reportProp?.isDeletedParentAction,
+            reportName: reportProp?.reportName,
+            description: reportProp?.description,
+            managerID: reportProp?.managerID,
+            total: reportProp?.total,
+            nonReimbursableTotal: reportProp?.nonReimbursableTotal,
+            reportFields: reportProp?.reportFields,
+            ownerAccountID: reportProp?.ownerAccountID,
+            currency: reportProp?.currency,
+            participantAccountIDs: reportProp?.participantAccountIDs,
+            isWaitingOnBankAccount: reportProp?.isWaitingOnBankAccount,
+            iouReportID: reportProp?.iouReportID,
+            isOwnPolicyExpenseChat: reportProp?.isOwnPolicyExpenseChat,
+            notificationPreference: reportProp?.notificationPreference,
+            isPinned: reportProp?.isPinned,
+            chatReportID: reportProp?.chatReportID,
+            visibility: reportProp?.visibility,
+            oldPolicyName: reportProp?.oldPolicyName,
+            policyName: reportProp?.policyName,
+            isOptimisticReport: reportProp?.isOptimisticReport,
         }),
         [
-            reportProp.lastReadTime,
-            reportProp.reportID,
-            reportProp.policyID,
-            reportProp.lastVisibleActionCreated,
-            reportProp.statusNum,
-            reportProp.stateNum,
-            reportProp.writeCapability,
-            reportProp.type,
-            reportProp.errorFields,
-            reportProp.isPolicyExpenseChat,
-            reportProp.parentReportID,
-            reportProp.parentReportActionID,
-            reportProp.chatType,
-            reportProp.pendingFields,
-            reportProp.isDeletedParentAction,
-            reportProp.reportName,
-            reportProp.description,
-            reportProp.managerID,
-            reportProp.total,
-            reportProp.nonReimbursableTotal,
-            reportProp.reportFields,
-            reportProp.ownerAccountID,
-            reportProp.currency,
-            reportProp.participantAccountIDs,
-            reportProp.isWaitingOnBankAccount,
-            reportProp.iouReportID,
-            reportProp.isOwnPolicyExpenseChat,
-            reportProp.notificationPreference,
-            reportProp.isPinned,
-            reportProp.chatReportID,
-            reportProp.visibility,
-            reportProp.oldPolicyName,
-            reportProp.policyName,
-            reportProp.isOptimisticReport,
+            reportProp?.lastReadTime,
+            reportProp?.reportID,
+            reportProp?.policyID,
+            reportProp?.lastVisibleActionCreated,
+            reportProp?.statusNum,
+            reportProp?.stateNum,
+            reportProp?.writeCapability,
+            reportProp?.type,
+            reportProp?.errorFields,
+            reportProp?.isPolicyExpenseChat,
+            reportProp?.parentReportID,
+            reportProp?.parentReportActionID,
+            reportProp?.chatType,
+            reportProp?.pendingFields,
+            reportProp?.isDeletedParentAction,
+            reportProp?.reportName,
+            reportProp?.description,
+            reportProp?.managerID,
+            reportProp?.total,
+            reportProp?.nonReimbursableTotal,
+            reportProp?.reportFields,
+            reportProp?.ownerAccountID,
+            reportProp?.currency,
+            reportProp?.participantAccountIDs,
+            reportProp?.isWaitingOnBankAccount,
+            reportProp?.iouReportID,
+            reportProp?.isOwnPolicyExpenseChat,
+            reportProp?.notificationPreference,
+            reportProp?.isPinned,
+            reportProp?.chatReportID,
+            reportProp?.visibility,
+            reportProp?.oldPolicyName,
+            reportProp?.policyName,
+            reportProp?.isOptimisticReport,
         ],
     );
 
@@ -249,7 +217,7 @@ function ReportScreen({
     const prevUserLeavingStatus = usePrevious(userLeavingStatus);
     const [isBannerVisible, setIsBannerVisible] = useState(true);
     const [listHeight, setListHeight] = useState(0);
-    const [scrollPosition, setScrollPosition] = useState({});
+    const [scrollPosition, setScrollPosition] = useState<ScrollPosition>({});
 
     const wasReportAccessibleRef = useRef(false);
     if (firstRenderRef.current) {
@@ -259,28 +227,28 @@ function ReportScreen({
 
     const reportID = getReportID(route);
     const {addWorkspaceRoomOrChatPendingAction, addWorkspaceRoomOrChatErrors} = ReportUtils.getReportOfflinePendingActionAndErrors(report);
-    const screenWrapperStyle = [styles.appContent, styles.flex1, {marginTop: viewportOffsetTop}];
-    const isEmptyChat = useMemo(() => _.isEmpty(reportActions), [reportActions]);
+    const screenWrapperStyle: ViewStyle[] = [styles.appContent, styles.flex1, {marginTop: viewportOffsetTop}];
+    const isEmptyChat = useMemo((): boolean => reportActions.length === 0, [reportActions]);
     // There are no reportActions at all to display and we are still in the process of loading the next set of actions.
-    const isLoadingInitialReportActions = _.isEmpty(reportActions) && reportMetadata.isLoadingInitialReportActions;
-    const isOptimisticDelete = lodashGet(report, 'statusNum') === CONST.REPORT.STATUS_NUM.CLOSED;
+    const isLoadingInitialReportActions = reportActions.length === 0 && !!reportMetadata?.isLoadingInitialReportActions;
+    const isOptimisticDelete = report.statusNum === CONST.REPORT.STATUS_NUM.CLOSED;
     const shouldHideReport = !ReportUtils.canAccessReport(report, policies, betas);
 
     const isLoading = !reportID || !isSidebarLoaded || PersonalDetailsUtils.isPersonalDetailsEmpty();
-    const lastReportAction = useMemo(
+    const lastReportAction: OnyxEntry<OnyxTypes.ReportAction> = useMemo(
         () =>
             reportActions.length
-                ? _.find([...reportActions, parentReportAction], (action) => ReportUtils.canEditReportAction(action) && !ReportActionsUtils.isMoneyRequestAction(action))
-                : {},
+                ? [...reportActions, parentReportAction].find((action) => ReportUtils.canEditReportAction(action) && !ReportActionsUtils.isMoneyRequestAction(action)) ?? null
+                : null,
         [reportActions, parentReportAction],
     );
     const isSingleTransactionView = ReportUtils.isMoneyRequest(report);
-    const policy = policies[`${ONYXKEYS.COLLECTION.POLICY}${report.policyID}`] || {};
+    const policy = policies?.[`${ONYXKEYS.COLLECTION.POLICY}${report.policyID}`] ?? null;
     const isTopMostReportId = currentReportID === getReportID(route);
     const didSubscribeToReportLeavingEvents = useRef(false);
 
     useEffect(() => {
-        if (!report || !report.reportID || shouldHideReport) {
+        if (!report.reportID || shouldHideReport) {
             return;
         }
         wasReportAccessibleRef.current = true;
@@ -301,6 +269,7 @@ function ReportScreen({
     if (isSingleTransactionView) {
         headerView = (
             <MoneyRequestHeader
+                // @ts-expect-error TODO: Remove this once MoneyRequestHeader (https://github.com/Expensify/App/issues/25111) is migrated to TypeScript.
                 report={report}
                 policy={policy}
                 isSingleTransactionView={isSingleTransactionView}
@@ -314,25 +283,21 @@ function ReportScreen({
             <MoneyReportHeader
                 report={report}
                 policy={policy}
-                isSingleTransactionView={isSingleTransactionView}
             />
         );
     }
 
     /**
      * When false the ReportActionsView will completely unmount and we will show a loader until it returns true.
-     *
-     * @returns {Boolean}
      */
-    const isReportReadyForDisplay = useMemo(() => {
+    const isReportReadyForDisplay = useMemo((): boolean => {
         const reportIDFromPath = getReportID(route);
 
         // This is necessary so that when we are retrieving the next report data from Onyx the ReportActionsView will remount completely
         const isTransitioning = report && report.reportID !== reportIDFromPath;
-        return reportIDFromPath !== '' && report.reportID && !isTransitioning;
+        return reportIDFromPath !== '' && !!report.reportID && !isTransitioning;
     }, [route, report]);
 
-    const isFocused = useIsFocused();
     useEffect(() => {
         if (!report.reportID || !isFocused) {
             return;
@@ -352,7 +317,7 @@ function ReportScreen({
         // It possible that we may not have the report object yet in Onyx yet e.g. we navigated to a URL for an accessible report that
         // is not stored locally yet. If report.reportID exists, then the report has been stored locally and nothing more needs to be done.
         // If it doesn't exist, then we fetch the report from the API.
-        if (report.reportID && report.reportID === getReportID(route) && !isLoadingInitialReportActions) {
+        if (report.reportID === getReportID(route) && !isLoadingInitialReportActions) {
             return;
         }
 
@@ -364,7 +329,7 @@ function ReportScreen({
     }, []);
 
     const chatWithAccountManager = useCallback(() => {
-        Navigation.navigate(ROUTES.REPORT_WITH_ID.getRoute(accountManagerReportID));
+        Navigation.navigate(ROUTES.REPORT_WITH_ID.getRoute(accountManagerReportID ?? ''));
     }, [accountManagerReportID]);
 
     // Clear notifications for the current report when it's opened and re-focused
@@ -376,6 +341,7 @@ function ReportScreen({
 
         clearReportNotifications(report.reportID);
     }, [report.reportID, isTopMostReportId]);
+
     useEffect(clearNotifications, [clearNotifications]);
     useAppFocusEvent(clearNotifications);
 
@@ -411,14 +377,14 @@ function ReportScreen({
         // Navigate to the Concierge chat if the room was removed from another device (e.g. user leaving a room or removed from a room)
         if (
             // non-optimistic case
-            (!prevUserLeavingStatus && userLeavingStatus) ||
+            (!prevUserLeavingStatus && !!userLeavingStatus) ||
             // optimistic case
-            (prevOnyxReportID &&
+            (!!prevOnyxReportID &&
                 prevOnyxReportID === routeReportID &&
                 !onyxReportID &&
                 prevReport.statusNum === CONST.REPORT.STATUS_NUM.OPEN &&
                 (report.statusNum === CONST.REPORT.STATUS_NUM.CLOSED || (!report.statusNum && !prevReport.parentReportID && prevReport.chatType === CONST.REPORT.CHAT_TYPE.POLICY_ROOM))) ||
-            ((ReportUtils.isMoneyRequest(prevReport) || ReportUtils.isMoneyRequestReport(prevReport)) && _.isEmpty(report))
+            ((ReportUtils.isMoneyRequest(prevReport) || ReportUtils.isMoneyRequestReport(prevReport)) && isEmptyObject(report))
         ) {
             Navigation.dismissModal();
             if (Navigation.getTopmostReportId() === prevOnyxReportID) {
@@ -448,19 +414,7 @@ function ReportScreen({
 
         fetchReportIfNeeded();
         ComposerActions.setShouldShowComposeInput(true);
-    }, [
-        route,
-        report,
-        errors,
-        fetchReportIfNeeded,
-        prevReport.reportID,
-        prevUserLeavingStatus,
-        userLeavingStatus,
-        prevReport.statusNum,
-        prevReport.parentReportID,
-        prevReport.chatType,
-        prevReport,
-    ]);
+    }, [route, report, fetchReportIfNeeded, prevReport.reportID, prevUserLeavingStatus, userLeavingStatus, prevReport.statusNum, prevReport.parentReportID, prevReport.chatType, prevReport]);
 
     useEffect(() => {
         if (!ReportUtils.isValidReportIDFromPath(reportID)) {
@@ -477,8 +431,8 @@ function ReportScreen({
         }
     }, [report, didSubscribeToReportLeavingEvents, reportID]);
 
-    const onListLayout = useCallback((e) => {
-        setListHeight((prev) => lodashGet(e, 'nativeEvent.layout.height', prev));
+    const onListLayout = useCallback((event: LayoutChangeEvent) => {
+        setListHeight((prev) => event.nativeEvent.layout.height ?? prev);
         if (!markReadyForHydration) {
             return;
         }
@@ -489,19 +443,19 @@ function ReportScreen({
 
     // eslint-disable-next-line rulesdir/no-negated-variables
     const shouldShowNotFoundPage = useMemo(
-        () =>
+        (): boolean =>
             (!wasReportAccessibleRef.current &&
                 !firstRenderRef.current &&
                 !report.reportID &&
                 !isOptimisticDelete &&
-                !reportMetadata.isLoadingInitialReportActions &&
+                !reportMetadata?.isLoadingInitialReportActions &&
                 !isLoading &&
                 !userLeavingStatus) ||
             shouldHideReport,
         [report, reportMetadata, isLoading, shouldHideReport, isOptimisticDelete, userLeavingStatus],
     );
 
-    const actionListValue = useMemo(() => ({flatListRef, scrollPosition, setScrollPosition}), [flatListRef, scrollPosition, setScrollPosition]);
+    const actionListValue = useMemo((): ActionListContextType => ({flatListRef, scrollPosition, setScrollPosition}), [flatListRef, scrollPosition, setScrollPosition]);
 
     return (
         <ActionListContext.Provider value={actionListValue}>
@@ -515,7 +469,6 @@ function ReportScreen({
                     <FullPageNotFoundView
                         shouldShow={shouldShowNotFoundPage}
                         subtitleKey="notFound.noAccess"
-                        shouldShowCloseButton={false}
                         shouldShowBackButton={isSmallScreenWidth}
                         onBackButtonPress={Navigation.goBack}
                         shouldShowLink={false}
@@ -556,11 +509,9 @@ function ReportScreen({
                                     <ReportActionsView
                                         reportActions={reportActions}
                                         report={report}
-                                        isLoadingInitialReportActions={reportMetadata.isLoadingInitialReportActions}
-                                        isLoadingNewerReportActions={reportMetadata.isLoadingNewerReportActions}
-                                        isLoadingOlderReportActions={reportMetadata.isLoadingOlderReportActions}
-                                        isComposerFullSize={isComposerFullSize}
-                                        policy={policy}
+                                        isLoadingInitialReportActions={reportMetadata?.isLoadingInitialReportActions}
+                                        isLoadingNewerReportActions={reportMetadata?.isLoadingNewerReportActions}
+                                        isLoadingOlderReportActions={reportMetadata?.isLoadingOlderReportActions}
                                     />
                                 )}
 
@@ -573,7 +524,7 @@ function ReportScreen({
                                     <ReportFooter
                                         report={report}
                                         pendingAction={addWorkspaceRoomOrChatPendingAction}
-                                        isComposerFullSize={isComposerFullSize}
+                                        isComposerFullSize={!!isComposerFullSize}
                                         listHeight={listHeight}
                                         isEmptyChat={isEmptyChat}
                                         lastReportAction={lastReportAction}
@@ -590,83 +541,81 @@ function ReportScreen({
     );
 }
 
-ReportScreen.propTypes = propTypes;
-ReportScreen.defaultProps = defaultProps;
 ReportScreen.displayName = 'ReportScreen';
 
-export default compose(
-    withViewportOffsetTop,
-    withCurrentReportID,
-    withOnyx(
-        {
-            isSidebarLoaded: {
-                key: ONYXKEYS.IS_SIDEBAR_LOADED,
-            },
-            reportActions: {
-                key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${getReportID(route)}`,
-                canEvict: false,
-                selector: (reportActions) => ReportActionsUtils.getSortedReportActionsForDisplay(reportActions, true),
-            },
-            report: {
-                key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT}${getReportID(route)}`,
-                allowStaleData: true,
-                selector: reportWithoutHasDraftSelector,
-            },
-            reportMetadata: {
-                key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT_METADATA}${getReportID(route)}`,
-                initialValue: {
-                    isLoadingInitialReportActions: true,
-                    isLoadingOlderReportActions: false,
-                    isLoadingNewerReportActions: false,
+export default withViewportOffsetTop(
+    withCurrentReportID(
+        withOnyx<ReportScreenProps, ReportScreenOnyxProps>(
+            {
+                isSidebarLoaded: {
+                    key: ONYXKEYS.IS_SIDEBAR_LOADED,
                 },
-            },
-            isComposerFullSize: {
-                key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT_IS_COMPOSER_FULL_SIZE}${getReportID(route)}`,
-                initialValue: false,
-            },
-            betas: {
-                key: ONYXKEYS.BETAS,
-            },
-            policies: {
-                key: ONYXKEYS.COLLECTION.POLICY,
-                allowStaleData: true,
-            },
-            accountManagerReportID: {
-                key: ONYXKEYS.ACCOUNT_MANAGER_REPORT_ID,
-                initialValue: null,
-            },
-            userLeavingStatus: {
-                key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT_USER_IS_LEAVING_ROOM}${getReportID(route)}`,
-                initialValue: false,
-            },
-            parentReportAction: {
-                key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report ? report.parentReportID : 0}`,
-                selector: (parentReportActions, props) => {
-                    const parentReportActionID = lodashGet(props, 'report.parentReportActionID');
-                    if (!parentReportActionID) {
-                        return {};
-                    }
-                    return lodashGet(parentReportActions, parentReportActionID);
+                reportActions: {
+                    key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${getReportID(route)}`,
+                    canEvict: false,
+                    selector: (reportActions: OnyxEntry<OnyxTypes.ReportActions>) => ReportActionsUtils.getSortedReportActionsForDisplay(reportActions, true),
+                },
+                report: {
+                    key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT}${getReportID(route)}`,
+                    allowStaleData: true,
+                    selector: reportWithoutHasDraftSelector,
+                },
+                reportMetadata: {
+                    key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT_METADATA}${getReportID(route)}`,
+                    initialValue: {
+                        isLoadingInitialReportActions: true,
+                        isLoadingOlderReportActions: false,
+                        isLoadingNewerReportActions: false,
+                    },
+                },
+                isComposerFullSize: {
+                    key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT_IS_COMPOSER_FULL_SIZE}${getReportID(route)}`,
+                    initialValue: false,
+                },
+                betas: {
+                    key: ONYXKEYS.BETAS,
+                },
+                policies: {
+                    key: ONYXKEYS.COLLECTION.POLICY,
+                    allowStaleData: true,
+                },
+                accountManagerReportID: {
+                    key: ONYXKEYS.ACCOUNT_MANAGER_REPORT_ID,
+                    initialValue: null,
+                },
+                userLeavingStatus: {
+                    key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT_USER_IS_LEAVING_ROOM}${getReportID(route)}`,
+                    initialValue: false,
+                },
+                parentReportAction: {
+                    key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report ? report.parentReportID : 0}`,
+                    selector: (parentReportActions: OnyxEntry<OnyxTypes.ReportActions>, props: WithOnyxInstanceState<ReportScreenOnyxProps>): OnyxEntry<OnyxTypes.ReportAction> => {
+                        const parentReportActionID = props?.report?.parentReportActionID;
+                        if (!parentReportActionID) {
+                            return null;
+                        }
+                        return parentReportActions?.[parentReportActionID] ?? null;
+                    },
+                    canEvict: false,
                 },
-                canEvict: false,
             },
-        },
-        true,
-    ),
-)(
-    memo(
-        ReportScreen,
-        (prevProps, nextProps) =>
-            prevProps.isSidebarLoaded === nextProps.isSidebarLoaded &&
-            _.isEqual(prevProps.reportActions, nextProps.reportActions) &&
-            _.isEqual(prevProps.reportMetadata, nextProps.reportMetadata) &&
-            prevProps.isComposerFullSize === nextProps.isComposerFullSize &&
-            _.isEqual(prevProps.betas, nextProps.betas) &&
-            _.isEqual(prevProps.policies, nextProps.policies) &&
-            prevProps.accountManagerReportID === nextProps.accountManagerReportID &&
-            prevProps.userLeavingStatus === nextProps.userLeavingStatus &&
-            prevProps.currentReportID === nextProps.currentReportID &&
-            prevProps.viewportOffsetTop === nextProps.viewportOffsetTop &&
-            _.isEqual(prevProps.report, nextProps.report),
+            true,
+        )(
+            memo(
+                ReportScreen,
+                (prevProps, nextProps) =>
+                    prevProps.isSidebarLoaded === nextProps.isSidebarLoaded &&
+                    lodashIsEqual(prevProps.reportActions, nextProps.reportActions) &&
+                    lodashIsEqual(prevProps.reportMetadata, nextProps.reportMetadata) &&
+                    prevProps.isComposerFullSize === nextProps.isComposerFullSize &&
+                    lodashIsEqual(prevProps.betas, nextProps.betas) &&
+                    lodashIsEqual(prevProps.policies, nextProps.policies) &&
+                    prevProps.accountManagerReportID === nextProps.accountManagerReportID &&
+                    prevProps.userLeavingStatus === nextProps.userLeavingStatus &&
+                    prevProps.currentReportID === nextProps.currentReportID &&
+                    prevProps.viewportOffsetTop === nextProps.viewportOffsetTop &&
+                    lodashIsEqual(prevProps.report, nextProps.report),
+            ),
+        ),
     ),
 );
diff --git a/src/pages/home/ReportScreenContext.ts b/src/pages/home/ReportScreenContext.ts
index 3b4e574e01a1..b96ef1f16fb6 100644
--- a/src/pages/home/ReportScreenContext.ts
+++ b/src/pages/home/ReportScreenContext.ts
@@ -14,9 +14,11 @@ type ReactionListRef = {
 
 type FlatListRefType = RefObject<FlatList<unknown>> | null;
 
+type ScrollPosition = {offset?: number};
+
 type ActionListContextType = {
     flatListRef: FlatListRefType;
-    scrollPosition: {offset: number} | null;
+    scrollPosition: ScrollPosition | null;
     setScrollPosition: (position: {offset: number}) => void;
 };
 type ReactionListContextType = RefObject<ReactionListRef> | null;
@@ -25,4 +27,4 @@ const ActionListContext = createContext<ActionListContextType>({flatListRef: nul
 const ReactionListContext = createContext<ReactionListContextType>(null);
 
 export {ActionListContext, ReactionListContext};
-export type {ReactionListRef, ActionListContextType, ReactionListContextType, FlatListRefType, ReactionListAnchor, ReactionListEvent};
+export type {ReactionListRef, ActionListContextType, ReactionListContextType, FlatListRefType, ReactionListAnchor, ReactionListEvent, ScrollPosition};
diff --git a/src/pages/home/report/ReportFooter.tsx b/src/pages/home/report/ReportFooter.tsx
index a7de44279f36..895771617d3c 100644
--- a/src/pages/home/report/ReportFooter.tsx
+++ b/src/pages/home/report/ReportFooter.tsx
@@ -33,7 +33,7 @@ type ReportFooterProps = ReportFooterOnyxProps & {
     report?: OnyxTypes.Report;
 
     /** The last report action */
-    lastReportAction?: OnyxTypes.ReportAction;
+    lastReportAction?: OnyxEntry<OnyxTypes.ReportAction>;
 
     /** Whether the chat is empty */
     isEmptyChat?: boolean;

From 5ebe244242aa45a311dec4340c0329c576914089 Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Tue, 6 Feb 2024 13:54:47 +0100
Subject: [PATCH 009/110] TS updates for the new code

---
 src/libs/ReportUtils.ts             |  2 +-
 src/pages/home/HeaderView.tsx       | 28 ++++++++++++++--------------
 src/styles/utils/FontUtils/index.ts |  2 +-
 3 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index 9719866b783a..f57ccda90c19 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -4572,7 +4572,7 @@ function getRoom(type: ValueOf<typeof CONST.REPORT.CHAT_TYPE>, policyID: string)
 /**
  *  We only want policy members who are members of the report to be able to modify the report description, but not in thread chat.
  */
-function canEditReportDescription(report: OnyxEntry<Report>, policy: OnyxEntry<Policy> | undefined): boolean {
+function canEditReportDescription(report: OnyxEntry<Report>, policy: OnyxEntry<Partial<Policy>> | undefined): boolean {
     return (
         !isMoneyRequestReport(report) &&
         !isArchivedRoom(report) &&
diff --git a/src/pages/home/HeaderView.tsx b/src/pages/home/HeaderView.tsx
index 6f38242ce798..b621fa53e4b0 100644
--- a/src/pages/home/HeaderView.tsx
+++ b/src/pages/home/HeaderView.tsx
@@ -37,10 +37,10 @@ import * as Session from '@userActions/Session';
 import * as Task from '@userActions/Task';
 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 {EmptyObject} from '@src/types/utils/EmptyObject';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
-import ROUTES from '@src/ROUTES';
 
 type PickedPolicyValues = Pick<OnyxTypes.Policy, 'name' | 'avatar' | 'pendingAction'>;
 
@@ -96,12 +96,12 @@ function HeaderView({report, personalDetails, parentReport, policy, session, rep
     const parentReportAction = ReportActionsUtils.getParentReportAction(report);
     const isCanceledTaskReport = ReportUtils.isCanceledTaskReport(report, parentReportAction);
     const isWhisperAction = ReportActionsUtils.isWhisperAction(parentReportAction);
-    const isUserCreatedPolicyRoom = ReportUtils.isUserCreatedPolicyRoom(props.report);
-    const isPolicyMember = useMemo(() => !_.isEmpty(props.policy), [props.policy]);
-    const canLeaveRoom = ReportUtils.canLeaveRoom(props.report, isPolicyMember);
-    const isArchivedRoom = ReportUtils.isArchivedRoom(props.report);
-    const reportDescription = ReportUtils.getReportDescriptionText(props.report);
-    const policyName = ReportUtils.getPolicyName(props.report);
+    const isUserCreatedPolicyRoom = ReportUtils.isUserCreatedPolicyRoom(report);
+    const isPolicyMember = useMemo(() => !isEmptyObject(policy), [policy]);
+    const canLeaveRoom = ReportUtils.canLeaveRoom(report, isPolicyMember);
+    const isArchivedRoom = ReportUtils.isArchivedRoom(report);
+    const reportDescription = ReportUtils.getReportDescriptionText(report);
+    const policyName = ReportUtils.getPolicyName(report);
 
     // We hide the button when we are chatting with an automated Expensify account since it's not possible to contact
     // these users via alternative means. It is possible to request a call with Concierge so we leave the option for them.
@@ -160,7 +160,7 @@ function HeaderView({report, personalDetails, parentReport, policy, session, rep
     );
 
     const renderAdditionalText = () => {
-        if (_.isEmpty(policyName) || _.isEmpty(reportDescription) || !_.isEmpty(parentNavigationSubtitleData)) {
+        if (!policyName || !reportDescription || !isEmptyObject(parentNavigationSubtitleData)) {
             return null;
         }
         return (
@@ -171,7 +171,7 @@ function HeaderView({report, personalDetails, parentReport, policy, session, rep
         );
     };
 
-    threeDotMenuItems.push(HeaderUtils.getPinMenuItem(props.report));
+    threeDotMenuItems.push(HeaderUtils.getPinMenuItem(report));
 
     if (isConcierge && guideCalendarLink) {
         threeDotMenuItems.push({
@@ -278,7 +278,7 @@ function HeaderView({report, personalDetails, parentReport, policy, session, rep
                                                 pressableStyles={[styles.alignSelfStart, styles.mw100]}
                                             />
                                         )}
-                                        {!_.isEmpty(subtitle) && _.isEmpty(reportDescription) && (
+                                        {!!subtitle && !reportDescription && (
                                             <Text
                                                 style={[styles.sidebarLinkText, styles.optionAlternateText, styles.textLabelSupporting]}
                                                 numberOfLines={1}
@@ -286,14 +286,14 @@ function HeaderView({report, personalDetails, parentReport, policy, session, rep
                                                 {subtitle}
                                             </Text>
                                         )}
-                                        {!_.isEmpty(reportDescription) && _.isEmpty(parentNavigationSubtitleData) && (
+                                        {!!reportDescription && isEmptyObject(parentNavigationSubtitleData) && (
                                             <PressableWithoutFeedback
                                                 onPress={() => {
-                                                    if (ReportUtils.canEditReportDescription(props.report, props.policy)) {
-                                                        Navigation.navigate(ROUTES.REPORT_DESCRIPTION.getRoute(props.reportID));
+                                                    if (ReportUtils.canEditReportDescription(report, policy)) {
+                                                        Navigation.navigate(ROUTES.REPORT_DESCRIPTION.getRoute(reportID));
                                                         return;
                                                     }
-                                                    Navigation.navigate(ROUTES.REPORT_WITH_ID_DETAILS.getRoute(props.reportID));
+                                                    Navigation.navigate(ROUTES.REPORT_WITH_ID_DETAILS.getRoute(reportID));
                                                 }}
                                                 style={[styles.alignSelfStart, styles.mw100]}
                                                 accessibilityLabel={translate('reportDescriptionPage.roomDescription')}
diff --git a/src/styles/utils/FontUtils/index.ts b/src/styles/utils/FontUtils/index.ts
index b93655fdf63d..c6f1a2f3a4f5 100644
--- a/src/styles/utils/FontUtils/index.ts
+++ b/src/styles/utils/FontUtils/index.ts
@@ -11,7 +11,7 @@ const FontUtils = {
     },
     fontWeight: {
         bold: fontWeightBold,
-        normal: '400',
+        normal: '400' as const,
     },
 };
 

From d3fdc7282d1190e9bd07ed3eeba5a3451f29f9bd Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Wed, 7 Feb 2024 12:30:54 +0100
Subject: [PATCH 010/110] Use || instead of ?? to prevent regression

---
 src/pages/home/ReportScreen.tsx | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/src/pages/home/ReportScreen.tsx b/src/pages/home/ReportScreen.tsx
index 24fcd45d3339..530b2b5ae179 100644
--- a/src/pages/home/ReportScreen.tsx
+++ b/src/pages/home/ReportScreen.tsx
@@ -95,10 +95,7 @@ type ReportScreenProps = OnyxHOCProps & ViewportOffsetTopProps & CurrentReportID
 function getReportID(route: ReportScreenNavigationProps['route']): string {
     // The report ID is used in an onyx key. If it's an empty string, onyx will return
     // a collection instead of an individual report.
-    // We can't use the default value functionality of `lodash.get()` because it only
-    // provides a default value on `undefined`, and will return an empty string.
-    // Placing the default value outside of `lodash.get()` is intentional.
-    return String(route.params?.reportID ?? 0);
+    return String(route.params?.reportID || 0);
 }
 
 function ReportScreen({

From 174895b18026bcaa176856e9a3074f104b7028a7 Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Wed, 7 Feb 2024 14:35:50 +0100
Subject: [PATCH 011/110] Create pick utils function

---
 src/pages/home/HeaderView.tsx | 12 +++---------
 src/utils/pick.ts             | 11 +++++++++++
 2 files changed, 14 insertions(+), 9 deletions(-)
 create mode 100644 src/utils/pick.ts

diff --git a/src/pages/home/HeaderView.tsx b/src/pages/home/HeaderView.tsx
index b621fa53e4b0..4799ec5194f7 100644
--- a/src/pages/home/HeaderView.tsx
+++ b/src/pages/home/HeaderView.tsx
@@ -41,6 +41,7 @@ import ROUTES from '@src/ROUTES';
 import type * as OnyxTypes from '@src/types/onyx';
 import type {EmptyObject} from '@src/types/utils/EmptyObject';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
+import pick from '@src/utils/pick';
 
 type PickedPolicyValues = Pick<OnyxTypes.Policy, 'name' | 'avatar' | 'pendingAction'>;
 
@@ -223,7 +224,7 @@ function HeaderView({report, personalDetails, parentReport, policy, session, rep
                             {isSmallScreenWidth && (
                                 <PressableWithoutFeedback
                                     onPress={onNavigationMenuButtonClicked}
-                                    style={[styles.LHNToggle]}
+                                    style={styles.LHNToggle}
                                     accessibilityHint={translate('accessibilityHints.navigateToChatsList')}
                                     accessibilityLabel={translate('common.back')}
                                     role={CONST.ROLE.BUTTON}
@@ -368,14 +369,7 @@ export default memo(
         },
         policy: {
             key: ({report}) => `${ONYXKEYS.COLLECTION.POLICY}${report ? report.policyID : '0'}`,
-            selector: (policy: OnyxEntry<OnyxTypes.Policy>): PickedPolicyValues | EmptyObject => {
-                if (!policy) {
-                    return {};
-                }
-
-                const valuesToPick = ['name', 'avatar', 'pendingAction'] as const;
-                return valuesToPick.reduce((values, key) => (key in policy ? {...values, [key]: policy[key]} : values), {});
-            },
+            selector: (policy: OnyxEntry<OnyxTypes.Policy>): PickedPolicyValues | EmptyObject => pick(policy, ['name', 'avatar', 'pendingAction']),
         },
         personalDetails: {
             key: ONYXKEYS.PERSONAL_DETAILS_LIST,
diff --git a/src/utils/pick.ts b/src/utils/pick.ts
new file mode 100644
index 000000000000..47d29cbc4f88
--- /dev/null
+++ b/src/utils/pick.ts
@@ -0,0 +1,11 @@
+import type {EmptyObject} from '@src/types/utils/EmptyObject';
+
+function pick<TValue extends Record<string, unknown>, TKey extends keyof TValue>(object: TValue | null | undefined, keys: TKey[]): Pick<TValue, TKey> | EmptyObject {
+    if (!object) {
+        return {};
+    }
+
+    return keys.reduce((values, key) => (key in object ? {...values, [key]: object[key]} : values), {});
+}
+
+export default pick;

From ba7c5fe8a6df33f85ba3174fa1f98709c51acfac Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Fri, 9 Feb 2024 11:34:28 +0100
Subject: [PATCH 012/110] TS migration for updated code parts

---
 src/components/MoneyRequestHeader.tsx | 10 +++++++---
 src/pages/home/HeaderView.tsx         | 18 ++++++++----------
 src/pages/home/ReportScreen.tsx       |  2 --
 3 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/components/MoneyRequestHeader.tsx b/src/components/MoneyRequestHeader.tsx
index 97f967a32d29..b213abcb2bfe 100644
--- a/src/components/MoneyRequestHeader.tsx
+++ b/src/components/MoneyRequestHeader.tsx
@@ -43,10 +43,10 @@ type MoneyRequestHeaderProps = MoneyRequestHeaderOnyxProps & {
     report: Report;
 
     /** The policy which the report is tied to */
-    policy: Policy;
+    policy: OnyxEntry<Policy>;
 
     /** The report action the transaction is tied to from the parent report */
-    parentReportAction: ReportAction & OriginalMessageIOU;
+    parentReportAction: OnyxEntry<ReportAction>;
 };
 
 function MoneyRequestHeader({session, parentReport, report, parentReportAction, transaction, policy}: MoneyRequestHeaderProps) {
@@ -63,7 +63,11 @@ function MoneyRequestHeader({session, parentReport, report, parentReportAction,
     const isActionOwner = typeof parentReportAction?.actorAccountID === 'number' && typeof session?.accountID === 'number' && parentReportAction.actorAccountID === session?.accountID;
 
     const deleteTransaction = useCallback(() => {
-        IOU.deleteMoneyRequest(parentReportAction?.originalMessage?.IOUTransactionID ?? '', parentReportAction, true);
+        if (parentReportAction) {
+            const iouTransactionID = parentReportAction.actionName === CONST.REPORT.ACTIONS.TYPE.IOU ? parentReportAction.originalMessage?.IOUTransactionID ?? '' : '';
+            IOU.deleteMoneyRequest(iouTransactionID, parentReportAction, true);
+        }
+
         setIsDeleteModalVisible(false);
     }, [parentReportAction, setIsDeleteModalVisible]);
 
diff --git a/src/pages/home/HeaderView.tsx b/src/pages/home/HeaderView.tsx
index 2fdabaa715a1..14c1986f6cb9 100644
--- a/src/pages/home/HeaderView.tsx
+++ b/src/pages/home/HeaderView.tsx
@@ -2,8 +2,6 @@ import React, {memo, useMemo} from 'react';
 import {View} from 'react-native';
 import type {OnyxEntry} from 'react-native-onyx';
 import {withOnyx} from 'react-native-onyx';
-import GoogleMeetIcon from '@assets/images/google-meet.svg';
-import ZoomIcon from '@assets/images/zoom-icon.svg';
 import Button from '@components/Button';
 import ConfirmModal from '@components/ConfirmModal';
 import DisplayNames from '@components/DisplayNames';
@@ -92,15 +90,15 @@ function HeaderView({report, personalDetails, parentReport, policy, session, rep
     const title = ReportUtils.isGroupChat(report) ? getGroupChatName(report) : ReportUtils.getReportName(reportHeaderData);
     const subtitle = ReportUtils.getChatRoomSubtitle(reportHeaderData);
     const parentNavigationSubtitleData = ReportUtils.getParentNavigationSubtitle(reportHeaderData);
-    const isConcierge = ReportUtils.hasSingleParticipant(props.report) && _.contains(participants, CONST.ACCOUNT_ID.CONCIERGE);
-    const parentReportAction = ReportActionsUtils.getParentReportAction(props.report);
-    const isCanceledTaskReport = ReportUtils.isCanceledTaskReport(props.report, parentReportAction);
+    const isConcierge = ReportUtils.hasSingleParticipant(report) && participants.includes(CONST.ACCOUNT_ID.CONCIERGE);
+    const parentReportAction = ReportActionsUtils.getParentReportAction(report);
+    const isCanceledTaskReport = ReportUtils.isCanceledTaskReport(report, parentReportAction);
     const isWhisperAction = ReportActionsUtils.isWhisperAction(parentReportAction);
-    const isUserCreatedPolicyRoom = ReportUtils.isUserCreatedPolicyRoom(props.report);
-    const isPolicyMember = useMemo(() => !_.isEmpty(props.policy), [props.policy]);
-    const canLeaveRoom = ReportUtils.canLeaveRoom(props.report, isPolicyMember);
-    const reportDescription = ReportUtils.getReportDescriptionText(props.report);
-    const policyName = ReportUtils.getPolicyName(props.report);
+    const isUserCreatedPolicyRoom = ReportUtils.isUserCreatedPolicyRoom(report);
+    const isPolicyMember = useMemo(() => !isEmptyObject(policy), [policy]);
+    const canLeaveRoom = ReportUtils.canLeaveRoom(report, isPolicyMember);
+    const reportDescription = ReportUtils.getReportDescriptionText(report);
+    const policyName = ReportUtils.getPolicyName(report);
 
     // We hide the button when we are chatting with an automated Expensify account since it's not possible to contact
     // these users via alternative means. It is possible to request a call with Concierge so we leave the option for them.
diff --git a/src/pages/home/ReportScreen.tsx b/src/pages/home/ReportScreen.tsx
index 3830c8afaedc..6df473e460dd 100644
--- a/src/pages/home/ReportScreen.tsx
+++ b/src/pages/home/ReportScreen.tsx
@@ -266,10 +266,8 @@ function ReportScreen({
     if (isSingleTransactionView) {
         headerView = (
             <MoneyRequestHeader
-                // @ts-expect-error TODO: Remove this once MoneyRequestHeader (https://github.com/Expensify/App/issues/25111) is migrated to TypeScript.
                 report={report}
                 policy={policy}
-                isSingleTransactionView={isSingleTransactionView}
                 parentReportAction={parentReportAction}
             />
         );

From 6b791b16600962aaf0f54267a7a47cc4de4c1ab0 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Tue, 13 Feb 2024 15:19:16 +0100
Subject: [PATCH 013/110] install react-native-release-profiler

---
 .../NewExpensifyDebugDevelopment.entitlements | 16 +++++++++++
 ios/Podfile.lock                              | 16 ++++++++---
 package-lock.json                             | 28 +++++++++++++++++++
 package.json                                  |  1 +
 4 files changed, 57 insertions(+), 4 deletions(-)
 create mode 100644 ios/NewExpensify/NewExpensifyDebugDevelopment.entitlements

diff --git a/ios/NewExpensify/NewExpensifyDebugDevelopment.entitlements b/ios/NewExpensify/NewExpensifyDebugDevelopment.entitlements
new file mode 100644
index 000000000000..1d9bc86a21de
--- /dev/null
+++ b/ios/NewExpensify/NewExpensifyDebugDevelopment.entitlements
@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>aps-environment</key>
+	<string>development</string>
+	<key>com.apple.developer.associated-domains</key>
+	<array>
+		<string>applinks:new.expensify.com</string>
+		<string>applinks:staging.new.expensify.com</string>
+		<string>webcredentials:new.expensify.com</string>
+	</array>
+	<key>com.apple.developer.usernotifications.communication</key>
+	<true/>
+</dict>
+</plist>
diff --git a/ios/Podfile.lock b/ios/Podfile.lock
index 19a579b846e8..a6b61dc6f1ff 100644
--- a/ios/Podfile.lock
+++ b/ios/Podfile.lock
@@ -1193,6 +1193,10 @@ PODS:
     - React
     - React-callinvoker
     - React-Core
+  - react-native-release-profiler (0.1.6):
+    - glog
+    - RCT-Folly (= 2022.05.16.00)
+    - React-Core
   - react-native-render-html (6.3.1):
     - React-Core
   - react-native-safe-area-context (4.7.4):
@@ -1443,7 +1447,7 @@ PODS:
     - RNSound/Core (= 0.11.2)
   - RNSound/Core (0.11.2):
     - React-Core
-  - RNSVG (14.0.0):
+  - RNSVG (14.1.0):
     - React-Core
   - SDWebImage (5.17.0):
     - SDWebImage/Core (= 5.17.0)
@@ -1458,7 +1462,7 @@ PODS:
     - SDWebImage/Core (~> 5.17)
   - SocketRocket (0.6.1)
   - Turf (2.7.0)
-  - VisionCamera (2.16.5):
+  - VisionCamera (2.16.8):
     - React
     - React-callinvoker
     - React-Core
@@ -1540,6 +1544,7 @@ DEPENDENCIES:
   - react-native-performance (from `../node_modules/react-native-performance`)
   - react-native-plaid-link-sdk (from `../node_modules/react-native-plaid-link-sdk`)
   - react-native-quick-sqlite (from `../node_modules/react-native-quick-sqlite`)
+  - react-native-release-profiler (from `../node_modules/react-native-release-profiler`)
   - react-native-render-html (from `../node_modules/react-native-render-html`)
   - react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`)
   - react-native-view-shot (from `../node_modules/react-native-view-shot`)
@@ -1743,6 +1748,8 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native-plaid-link-sdk"
   react-native-quick-sqlite:
     :path: "../node_modules/react-native-quick-sqlite"
+  react-native-release-profiler:
+    :path: "../node_modules/react-native-release-profiler"
   react-native-render-html:
     :path: "../node_modules/react-native-render-html"
   react-native-safe-area-context:
@@ -1936,6 +1943,7 @@ SPEC CHECKSUMS:
   react-native-performance: cef2b618d47b277fb5c3280b81a3aad1e72f2886
   react-native-plaid-link-sdk: df1618a85a615d62ff34e34b76abb7a56497fbc1
   react-native-quick-sqlite: bcc7a7a250a40222f18913a97cd356bf82d0a6c4
+  react-native-release-profiler: 86f2004d5f8c4fff17d90a5580513519a685d7ae
   react-native-render-html: 96c979fe7452a0a41559685d2f83b12b93edac8c
   react-native-safe-area-context: 2cd91d532de12acdb0a9cbc8d43ac72a8e4c897c
   react-native-view-shot: 6b7ed61d77d88580fed10954d45fad0eb2d47688
@@ -1982,14 +1990,14 @@ SPEC CHECKSUMS:
   RNReanimated: 57f436e7aa3d277fbfed05e003230b43428157c0
   RNScreens: b582cb834dc4133307562e930e8fa914b8c04ef2
   RNSound: 6c156f925295bdc83e8e422e7d8b38d33bc71852
-  RNSVG: 255767813dac22db1ec2062c8b7e7b856d4e5ae6
+  RNSVG: ba3e7232f45e34b7b47e74472386cf4e1a676d0a
   SDWebImage: 750adf017a315a280c60fde706ab1e552a3ae4e9
   SDWebImageAVIFCoder: 8348fef6d0ec69e129c66c9fe4d74fbfbf366112
   SDWebImageSVGCoder: 15a300a97ec1c8ac958f009c02220ac0402e936c
   SDWebImageWebPCoder: af09429398d99d524cae2fe00f6f0f6e491ed102
   SocketRocket: f32cd54efbe0f095c4d7594881e52619cfe80b17
   Turf: 13d1a92d969ca0311bbc26e8356cca178ce95da2
-  VisionCamera: fda554d8751e395effcc87749f8b7c198c1031be
+  VisionCamera: 0a6794d1974aed5d653d0d0cb900493e2583e35a
   Yoga: 13c8ef87792450193e117976337b8527b49e8c03
 
 PODFILE CHECKSUM: 0ccbb4f2406893c6e9f266dc1e7470dcd72885d2
diff --git a/package-lock.json b/package-lock.json
index d499a59df097..7b99e43e4d2c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -106,6 +106,7 @@
         "react-native-qrcode-svg": "^6.2.0",
         "react-native-quick-sqlite": "^8.0.0-beta.2",
         "react-native-reanimated": "^3.6.1",
+        "react-native-release-profiler": "^0.1.6",
         "react-native-render-html": "6.3.1",
         "react-native-safe-area-context": "4.7.4",
         "react-native-screens": "3.29.0",
@@ -45281,6 +45282,33 @@
       "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
       "license": "MIT"
     },
+    "node_modules/react-native-release-profiler": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/react-native-release-profiler/-/react-native-release-profiler-0.1.6.tgz",
+      "integrity": "sha512-kSAPYjO3PDzV4xbjgj2NoiHtL7EaXmBira/WOcyz6S7mz1MVBoF0Bj74z5jAZo6BoBJRKqmQWI4ep+m0xvoF+g==",
+      "dependencies": {
+        "@react-native-community/cli": "^12.2.1",
+        "commander": "^11.1.0"
+      },
+      "bin": {
+        "react-native-release-profiler": "lib/commonjs/cli.js"
+      },
+      "engines": {
+        "node": ">= 18.0.0"
+      },
+      "peerDependencies": {
+        "react": "*",
+        "react-native": "*"
+      }
+    },
+    "node_modules/react-native-release-profiler/node_modules/commander": {
+      "version": "11.1.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-11.1.0.tgz",
+      "integrity": "sha512-yPVavfyCcRhmorC7rWlkHn15b4wDVgVmBA7kV4QVBsF7kv/9TKJAbAXVTxvTnwP8HHKjRCJDClKbciiYS7p0DQ==",
+      "engines": {
+        "node": ">=16"
+      }
+    },
     "node_modules/react-native-render-html": {
       "version": "6.3.1",
       "resolved": "https://registry.npmjs.org/react-native-render-html/-/react-native-render-html-6.3.1.tgz",
diff --git a/package.json b/package.json
index 7157b28faf4b..ebbb3c58a944 100644
--- a/package.json
+++ b/package.json
@@ -154,6 +154,7 @@
     "react-native-qrcode-svg": "^6.2.0",
     "react-native-quick-sqlite": "^8.0.0-beta.2",
     "react-native-reanimated": "^3.6.1",
+    "react-native-release-profiler": "^0.1.6",
     "react-native-render-html": "6.3.1",
     "react-native-safe-area-context": "4.7.4",
     "react-native-screens": "3.29.0",

From 9c189c3a85de452f06fe9fb7a85d1f3df9a50473 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Tue, 13 Feb 2024 15:22:13 +0100
Subject: [PATCH 014/110] ProfilingToolMenu

---
 src/ONYXKEYS.ts                      |  2 +
 src/components/ProfilingToolMenu.tsx | 76 ++++++++++++++++++++++++++++
 src/components/ScreenWrapper.tsx     |  4 +-
 src/components/TestToolsModal.tsx    |  6 ++-
 src/libs/actions/ProfilingTool.ts    | 22 ++++++++
 5 files changed, 107 insertions(+), 3 deletions(-)
 create mode 100644 src/components/ProfilingToolMenu.tsx
 create mode 100644 src/libs/actions/ProfilingTool.ts

diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts
index 4a9c809485e5..0d93f1b88d70 100755
--- a/src/ONYXKEYS.ts
+++ b/src/ONYXKEYS.ts
@@ -201,6 +201,7 @@ const ONYXKEYS = {
 
     /** Is the test tools modal open? */
     IS_TEST_TOOLS_MODAL_OPEN: 'isTestToolsModalOpen',
+    IS_APP_PROFILING: 'isAppProfiling',
 
     /** Stores information about active wallet transfer amount, selectedAccountID, status, etc */
     WALLET_TRANSFER: 'walletTransfer',
@@ -443,6 +444,7 @@ type OnyxValues = {
     [ONYXKEYS.IS_LOADING_PAYMENT_METHODS]: boolean;
     [ONYXKEYS.IS_LOADING_REPORT_DATA]: boolean;
     [ONYXKEYS.IS_TEST_TOOLS_MODAL_OPEN]: boolean;
+    [ONYXKEYS.IS_APP_PROFILING]: boolean;
     [ONYXKEYS.IS_LOADING_APP]: boolean;
     [ONYXKEYS.WALLET_TRANSFER]: OnyxTypes.WalletTransfer;
     [ONYXKEYS.LAST_ACCESSED_WORKSPACE_POLICY_ID]: string;
diff --git a/src/components/ProfilingToolMenu.tsx b/src/components/ProfilingToolMenu.tsx
new file mode 100644
index 000000000000..26e92ee327a2
--- /dev/null
+++ b/src/components/ProfilingToolMenu.tsx
@@ -0,0 +1,76 @@
+import React, {useCallback, useState} from 'react';
+import {withOnyx} from 'react-native-onyx';
+import type {OnyxEntry} from 'react-native-onyx';
+import {startProfiling, stopProfiling} from 'react-native-release-profiler';
+import useThemeStyles from '@hooks/useThemeStyles';
+import toggleProfileToolsModal from '@libs/actions/ProfilingTool';
+import ONYXKEYS from '@src/ONYXKEYS';
+import Switch from './Switch';
+import TestToolRow from './TestToolRow';
+import Text from './Text';
+
+type ProfilingToolMenuOnyxProps = {
+    isAppProfiling: OnyxEntry<boolean>;
+};
+
+type ProfilingToolMenuProps = ProfilingToolMenuOnyxProps;
+
+function ProfilingToolMenu({isAppProfiling = false}: ProfilingToolMenuProps) {
+    const styles = useThemeStyles();
+    const [pathIOS, setPathIOS] = useState('');
+
+    // eslint-disable-next-line @lwc/lwc/no-async-await
+    const stop = useCallback(async () => {
+        const path = await stopProfiling(true);
+        if (path) {
+            setPathIOS(path);
+        }
+        return path;
+    }, []);
+
+    const onToggleProfiling = useCallback(() => {
+        const shouldProfiling = !isAppProfiling;
+        if (shouldProfiling) {
+            startProfiling();
+        } else {
+            stop();
+        }
+        toggleProfileToolsModal();
+        return () => {
+            stop();
+        };
+    }, [isAppProfiling, stop]);
+
+    return (
+        <>
+            <Text
+                style={[styles.textLabelSupporting, styles.mb4]}
+                numberOfLines={1}
+            >
+                Release options
+            </Text>
+
+            <TestToolRow title="Use release Profiling">
+                <Switch
+                    accessibilityLabel="Use release Profiling"
+                    isOn={!!isAppProfiling}
+                    onToggle={onToggleProfiling}
+                />
+            </TestToolRow>
+                <Text
+                    style={[styles.textLabelSupporting, styles.mb4]}
+                    // numberOfLines={1}
+                >
+                    {!!pathIOS && `path: ${pathIOS}`}
+                </Text>
+        </>
+    );
+}
+
+ProfilingToolMenu.displayName = 'ProfilingToolMenu';
+
+export default withOnyx<ProfilingToolMenuProps, ProfilingToolMenuOnyxProps>({
+    isAppProfiling: {
+        key: ONYXKEYS.IS_APP_PROFILING,
+    },
+})(ProfilingToolMenu);
diff --git a/src/components/ScreenWrapper.tsx b/src/components/ScreenWrapper.tsx
index 8b6a894cdd51..687ab68160c6 100644
--- a/src/components/ScreenWrapper.tsx
+++ b/src/components/ScreenWrapper.tsx
@@ -218,7 +218,7 @@ function ScreenWrapper(
                         ref={ref}
                         style={[styles.flex1, {minHeight}]}
                         // eslint-disable-next-line react/jsx-props-no-spreading
-                        {...(isDevelopment ? panResponder.panHandlers : {})}
+                        {...panResponder.panHandlers}
                         testID={testID}
                     >
                         <View
@@ -236,7 +236,7 @@ function ScreenWrapper(
                                     enabled={shouldEnablePickerAvoiding}
                                 >
                                     <HeaderGap styles={headerGapStyles} />
-                                    {isDevelopment && <TestToolsModal />}
+                                    <TestToolsModal />
                                     {isDevelopment && <CustomDevMenu />}
                                     {
                                         // If props.children is a function, call it to provide the insets to the children.
diff --git a/src/components/TestToolsModal.tsx b/src/components/TestToolsModal.tsx
index 2b1ec1e84c5b..5f469e750882 100644
--- a/src/components/TestToolsModal.tsx
+++ b/src/components/TestToolsModal.tsx
@@ -2,11 +2,13 @@ import React from 'react';
 import {View} from 'react-native';
 import type {OnyxEntry} from 'react-native-onyx';
 import {withOnyx} from 'react-native-onyx';
+import useEnvironment from '@hooks/useEnvironment';
 import useThemeStyles from '@hooks/useThemeStyles';
 import toggleTestToolsModal from '@userActions/TestTool';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import Modal from './Modal';
+import ProfilingToolMenu from './ProfilingToolMenu';
 import TestToolMenu from './TestToolMenu';
 
 type TestToolsModalOnyxProps = {
@@ -17,6 +19,7 @@ type TestToolsModalOnyxProps = {
 type TestToolsModalProps = TestToolsModalOnyxProps;
 
 function TestToolsModal({isTestToolsModalOpen = false}: TestToolsModalProps) {
+    const {isDevelopment} = useEnvironment();
     const styles = useThemeStyles();
 
     return (
@@ -26,7 +29,8 @@ function TestToolsModal({isTestToolsModalOpen = false}: TestToolsModalProps) {
             onClose={toggleTestToolsModal}
         >
             <View style={[styles.settingsPageBody, styles.p5]}>
-                <TestToolMenu />
+                {isDevelopment && <TestToolMenu />}
+                <ProfilingToolMenu />
             </View>
         </Modal>
     );
diff --git a/src/libs/actions/ProfilingTool.ts b/src/libs/actions/ProfilingTool.ts
new file mode 100644
index 000000000000..9c820c673866
--- /dev/null
+++ b/src/libs/actions/ProfilingTool.ts
@@ -0,0 +1,22 @@
+import throttle from 'lodash/throttle';
+import Onyx from 'react-native-onyx';
+import CONST from '@src/CONST';
+import ONYXKEYS from '@src/ONYXKEYS';
+
+let isAppProfiling = false;
+Onyx.connect({
+    key: ONYXKEYS.IS_APP_PROFILING,
+    callback: (val) => (isAppProfiling = val ?? false),
+});
+
+/**
+ * Toggle the test tools modal open or closed.
+ * Throttle the toggle to make the modal stay open if you accidentally tap an extra time, which is easy to do.
+ */
+function toggleProfileToolsModal() {
+    const toggle = () => Onyx.set(ONYXKEYS.IS_APP_PROFILING, !isAppProfiling);
+    const throttledToggle = throttle(toggle, CONST.TIMING.TEST_TOOLS_MODAL_THROTTLE_TIME);
+    throttledToggle();
+}
+
+export default toggleProfileToolsModal;

From ce7179460a34f6bf4665df9578f6e394e8126a28 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Tue, 13 Feb 2024 15:27:40 +0100
Subject: [PATCH 015/110] set width for TestToolsModal

---
 src/components/TestToolsModal.tsx | 8 +++++---
 src/styles/utils/index.ts         | 5 +++++
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/components/TestToolsModal.tsx b/src/components/TestToolsModal.tsx
index 5f469e750882..824162e63c51 100644
--- a/src/components/TestToolsModal.tsx
+++ b/src/components/TestToolsModal.tsx
@@ -3,7 +3,8 @@ import {View} from 'react-native';
 import type {OnyxEntry} from 'react-native-onyx';
 import {withOnyx} from 'react-native-onyx';
 import useEnvironment from '@hooks/useEnvironment';
-import useThemeStyles from '@hooks/useThemeStyles';
+import useStyleUtils from '@hooks/useStyleUtils';
+import useWindowDimensions from '@hooks/useWindowDimensions';
 import toggleTestToolsModal from '@userActions/TestTool';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
@@ -20,7 +21,8 @@ type TestToolsModalProps = TestToolsModalOnyxProps;
 
 function TestToolsModal({isTestToolsModalOpen = false}: TestToolsModalProps) {
     const {isDevelopment} = useEnvironment();
-    const styles = useThemeStyles();
+    const {windowWidth} = useWindowDimensions();
+    const StyleUtils = useStyleUtils();
 
     return (
         <Modal
@@ -28,7 +30,7 @@ function TestToolsModal({isTestToolsModalOpen = false}: TestToolsModalProps) {
             type={CONST.MODAL.MODAL_TYPE.CENTERED_SMALL}
             onClose={toggleTestToolsModal}
         >
-            <View style={[styles.settingsPageBody, styles.p5]}>
+            <View style={[StyleUtils.getTestToolsModalStyle(windowWidth)]}>
                 {isDevelopment && <TestToolMenu />}
                 <ProfilingToolMenu />
             </View>
diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index d4d2b427cbe8..14222ede67ba 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],
+
+    /**
+     * Returns the styles for the Tools modal
+     */
+    getTestToolsModalStyle: (windowWidth: number): ViewStyle[] => [styles.settingsPageBody, styles.p5, {width: windowWidth * 0.9}],
 });
 
 type StyleUtilsType = ReturnType<typeof createStyleUtils>;

From fc0c2dd9dbcba618a6ef228288420614dd371c46 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Tue, 13 Feb 2024 15:30:45 +0100
Subject: [PATCH 016/110] clean up

---
 .../NewExpensifyDebugDevelopment.entitlements    | 16 ----------------
 src/components/ProfilingToolMenu.tsx             |  7 +------
 2 files changed, 1 insertion(+), 22 deletions(-)
 delete mode 100644 ios/NewExpensify/NewExpensifyDebugDevelopment.entitlements

diff --git a/ios/NewExpensify/NewExpensifyDebugDevelopment.entitlements b/ios/NewExpensify/NewExpensifyDebugDevelopment.entitlements
deleted file mode 100644
index 1d9bc86a21de..000000000000
--- a/ios/NewExpensify/NewExpensifyDebugDevelopment.entitlements
+++ /dev/null
@@ -1,16 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
-<plist version="1.0">
-<dict>
-	<key>aps-environment</key>
-	<string>development</string>
-	<key>com.apple.developer.associated-domains</key>
-	<array>
-		<string>applinks:new.expensify.com</string>
-		<string>applinks:staging.new.expensify.com</string>
-		<string>webcredentials:new.expensify.com</string>
-	</array>
-	<key>com.apple.developer.usernotifications.communication</key>
-	<true/>
-</dict>
-</plist>
diff --git a/src/components/ProfilingToolMenu.tsx b/src/components/ProfilingToolMenu.tsx
index 26e92ee327a2..e9bcb661cf61 100644
--- a/src/components/ProfilingToolMenu.tsx
+++ b/src/components/ProfilingToolMenu.tsx
@@ -57,12 +57,7 @@ function ProfilingToolMenu({isAppProfiling = false}: ProfilingToolMenuProps) {
                     onToggle={onToggleProfiling}
                 />
             </TestToolRow>
-                <Text
-                    style={[styles.textLabelSupporting, styles.mb4]}
-                    // numberOfLines={1}
-                >
-                    {!!pathIOS && `path: ${pathIOS}`}
-                </Text>
+            <Text style={[styles.textLabelSupporting, styles.mb4]}>{!!pathIOS && `path: ${pathIOS}`}</Text>
         </>
     );
 }

From fda4e961db2c5bd81013f7d91444daae3a36f065 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Tue, 13 Feb 2024 16:12:51 +0100
Subject: [PATCH 017/110] remove ProfilingToolMenu from web

---
 .../index.native.tsx}                                      | 6 +++---
 src/components/ProfilingToolMenu/index.tsx                 | 7 +++++++
 2 files changed, 10 insertions(+), 3 deletions(-)
 rename src/components/{ProfilingToolMenu.tsx => ProfilingToolMenu/index.native.tsx} (94%)
 create mode 100644 src/components/ProfilingToolMenu/index.tsx

diff --git a/src/components/ProfilingToolMenu.tsx b/src/components/ProfilingToolMenu/index.native.tsx
similarity index 94%
rename from src/components/ProfilingToolMenu.tsx
rename to src/components/ProfilingToolMenu/index.native.tsx
index e9bcb661cf61..a14263d9a89b 100644
--- a/src/components/ProfilingToolMenu.tsx
+++ b/src/components/ProfilingToolMenu/index.native.tsx
@@ -5,9 +5,9 @@ import {startProfiling, stopProfiling} from 'react-native-release-profiler';
 import useThemeStyles from '@hooks/useThemeStyles';
 import toggleProfileToolsModal from '@libs/actions/ProfilingTool';
 import ONYXKEYS from '@src/ONYXKEYS';
-import Switch from './Switch';
-import TestToolRow from './TestToolRow';
-import Text from './Text';
+import Switch from '@components/Switch';
+import Text from '@components/Text';
+import TestToolRow from '@components/TestToolRow';
 
 type ProfilingToolMenuOnyxProps = {
     isAppProfiling: OnyxEntry<boolean>;
diff --git a/src/components/ProfilingToolMenu/index.tsx b/src/components/ProfilingToolMenu/index.tsx
new file mode 100644
index 000000000000..71eef72b7c25
--- /dev/null
+++ b/src/components/ProfilingToolMenu/index.tsx
@@ -0,0 +1,7 @@
+function ProfilingToolMenu() {
+  return null;
+}
+
+ProfilingToolMenu.displayName = 'ProfilingToolMenu';
+
+export default ProfilingToolMenu;

From 2597243b07872df7a630d6efb60375881b1e0b72 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Tue, 13 Feb 2024 16:43:01 +0100
Subject: [PATCH 018/110] rename

---
 src/ONYXKEYS.ts                               |  6 ++--
 .../ProfilingToolMenu/index.native.tsx        | 28 +++++++++----------
 src/components/ProfilingToolMenu/index.tsx    |  2 +-
 src/libs/actions/ProfilingTool.ts             | 12 ++++----
 4 files changed, 25 insertions(+), 23 deletions(-)

diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts
index 0d93f1b88d70..04e26d776d12 100755
--- a/src/ONYXKEYS.ts
+++ b/src/ONYXKEYS.ts
@@ -201,7 +201,9 @@ const ONYXKEYS = {
 
     /** Is the test tools modal open? */
     IS_TEST_TOOLS_MODAL_OPEN: 'isTestToolsModalOpen',
-    IS_APP_PROFILING: 'isAppProfiling',
+
+    /** Is app in profiling mode */
+    APP_PROFILING_IN_PROGRESS: 'isProfilingInProgress',
 
     /** Stores information about active wallet transfer amount, selectedAccountID, status, etc */
     WALLET_TRANSFER: 'walletTransfer',
@@ -444,7 +446,7 @@ type OnyxValues = {
     [ONYXKEYS.IS_LOADING_PAYMENT_METHODS]: boolean;
     [ONYXKEYS.IS_LOADING_REPORT_DATA]: boolean;
     [ONYXKEYS.IS_TEST_TOOLS_MODAL_OPEN]: boolean;
-    [ONYXKEYS.IS_APP_PROFILING]: boolean;
+    [ONYXKEYS.APP_PROFILING_IN_PROGRESS]: boolean;
     [ONYXKEYS.IS_LOADING_APP]: boolean;
     [ONYXKEYS.WALLET_TRANSFER]: OnyxTypes.WalletTransfer;
     [ONYXKEYS.LAST_ACCESSED_WORKSPACE_POLICY_ID]: string;
diff --git a/src/components/ProfilingToolMenu/index.native.tsx b/src/components/ProfilingToolMenu/index.native.tsx
index a14263d9a89b..affbcfab3c6e 100644
--- a/src/components/ProfilingToolMenu/index.native.tsx
+++ b/src/components/ProfilingToolMenu/index.native.tsx
@@ -2,20 +2,20 @@ import React, {useCallback, useState} from 'react';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
 import {startProfiling, stopProfiling} from 'react-native-release-profiler';
-import useThemeStyles from '@hooks/useThemeStyles';
-import toggleProfileToolsModal from '@libs/actions/ProfilingTool';
-import ONYXKEYS from '@src/ONYXKEYS';
 import Switch from '@components/Switch';
-import Text from '@components/Text';
 import TestToolRow from '@components/TestToolRow';
+import Text from '@components/Text';
+import useThemeStyles from '@hooks/useThemeStyles';
+import toggleProfileTool from '@libs/actions/ProfilingTool';
+import ONYXKEYS from '@src/ONYXKEYS';
 
 type ProfilingToolMenuOnyxProps = {
-    isAppProfiling: OnyxEntry<boolean>;
+    isProfilingInProgress: OnyxEntry<boolean>;
 };
 
 type ProfilingToolMenuProps = ProfilingToolMenuOnyxProps;
 
-function ProfilingToolMenu({isAppProfiling = false}: ProfilingToolMenuProps) {
+function ProfilingToolMenu({isProfilingInProgress = false}: ProfilingToolMenuProps) {
     const styles = useThemeStyles();
     const [pathIOS, setPathIOS] = useState('');
 
@@ -29,17 +29,17 @@ function ProfilingToolMenu({isAppProfiling = false}: ProfilingToolMenuProps) {
     }, []);
 
     const onToggleProfiling = useCallback(() => {
-        const shouldProfiling = !isAppProfiling;
+        const shouldProfiling = !isProfilingInProgress;
         if (shouldProfiling) {
             startProfiling();
         } else {
             stop();
         }
-        toggleProfileToolsModal();
+        toggleProfileTool();
         return () => {
             stop();
         };
-    }, [isAppProfiling, stop]);
+    }, [isProfilingInProgress, stop]);
 
     return (
         <>
@@ -50,10 +50,10 @@ function ProfilingToolMenu({isAppProfiling = false}: ProfilingToolMenuProps) {
                 Release options
             </Text>
 
-            <TestToolRow title="Use release Profiling">
+            <TestToolRow title="Use Profiling">
                 <Switch
-                    accessibilityLabel="Use release Profiling"
-                    isOn={!!isAppProfiling}
+                    accessibilityLabel="Use Profiling"
+                    isOn={!!isProfilingInProgress}
                     onToggle={onToggleProfiling}
                 />
             </TestToolRow>
@@ -65,7 +65,7 @@ function ProfilingToolMenu({isAppProfiling = false}: ProfilingToolMenuProps) {
 ProfilingToolMenu.displayName = 'ProfilingToolMenu';
 
 export default withOnyx<ProfilingToolMenuProps, ProfilingToolMenuOnyxProps>({
-    isAppProfiling: {
-        key: ONYXKEYS.IS_APP_PROFILING,
+    isProfilingInProgress: {
+        key: ONYXKEYS.APP_PROFILING_IN_PROGRESS,
     },
 })(ProfilingToolMenu);
diff --git a/src/components/ProfilingToolMenu/index.tsx b/src/components/ProfilingToolMenu/index.tsx
index 71eef72b7c25..ab12fff27ef8 100644
--- a/src/components/ProfilingToolMenu/index.tsx
+++ b/src/components/ProfilingToolMenu/index.tsx
@@ -1,5 +1,5 @@
 function ProfilingToolMenu() {
-  return null;
+    return null;
 }
 
 ProfilingToolMenu.displayName = 'ProfilingToolMenu';
diff --git a/src/libs/actions/ProfilingTool.ts b/src/libs/actions/ProfilingTool.ts
index 9c820c673866..ac03eac213c1 100644
--- a/src/libs/actions/ProfilingTool.ts
+++ b/src/libs/actions/ProfilingTool.ts
@@ -3,20 +3,20 @@ import Onyx from 'react-native-onyx';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 
-let isAppProfiling = false;
+let isProfilingInProgress = false;
 Onyx.connect({
-    key: ONYXKEYS.IS_APP_PROFILING,
-    callback: (val) => (isAppProfiling = val ?? false),
+    key: ONYXKEYS.APP_PROFILING_IN_PROGRESS,
+    callback: (val) => (isProfilingInProgress = val ?? false),
 });
 
 /**
  * Toggle the test tools modal open or closed.
  * Throttle the toggle to make the modal stay open if you accidentally tap an extra time, which is easy to do.
  */
-function toggleProfileToolsModal() {
-    const toggle = () => Onyx.set(ONYXKEYS.IS_APP_PROFILING, !isAppProfiling);
+function toggleProfileTool() {
+    const toggle = () => Onyx.set(ONYXKEYS.APP_PROFILING_IN_PROGRESS, !isProfilingInProgress);
     const throttledToggle = throttle(toggle, CONST.TIMING.TEST_TOOLS_MODAL_THROTTLE_TIME);
     throttledToggle();
 }
 
-export default toggleProfileToolsModal;
+export default toggleProfileTool;

From 112e08b76225728611f4e05e8dbe58ca5ae5cc87 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Wed, 14 Feb 2024 12:41:31 +0100
Subject: [PATCH 019/110] add trace sharing

---
 package-lock.json                             |  9 ++++
 package.json                                  |  1 +
 .../ProfilingToolMenu/index.native.tsx        | 46 +++++++++++++++++--
 3 files changed, 51 insertions(+), 5 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 90fe6779b8ab..6246a23dfef0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -110,6 +110,7 @@
         "react-native-render-html": "6.3.1",
         "react-native-safe-area-context": "4.7.4",
         "react-native-screens": "3.29.0",
+        "react-native-share": "^10.0.2",
         "react-native-sound": "^0.11.2",
         "react-native-svg": "14.1.0",
         "react-native-tab-view": "^3.5.2",
@@ -45378,6 +45379,14 @@
         "react-native": "*"
       }
     },
+    "node_modules/react-native-share": {
+      "version": "10.0.2",
+      "resolved": "https://registry.npmjs.org/react-native-share/-/react-native-share-10.0.2.tgz",
+      "integrity": "sha512-EZs4MtsyauAI1zP8xXT1hIFB/pXOZJNDCKcgCpEfTZFXgCUzz8MDVbI1ocP2hA59XHRSkqAQdbJ0BFTpjxOBlg==",
+      "engines": {
+        "node": ">=16"
+      }
+    },
     "node_modules/react-native-sound": {
       "version": "0.11.2",
       "resolved": "https://registry.npmjs.org/react-native-sound/-/react-native-sound-0.11.2.tgz",
diff --git a/package.json b/package.json
index 25e0042ee60d..e6bc3a77d02e 100644
--- a/package.json
+++ b/package.json
@@ -158,6 +158,7 @@
     "react-native-render-html": "6.3.1",
     "react-native-safe-area-context": "4.7.4",
     "react-native-screens": "3.29.0",
+    "react-native-share": "^10.0.2",
     "react-native-sound": "^0.11.2",
     "react-native-svg": "14.1.0",
     "react-native-tab-view": "^3.5.2",
diff --git a/src/components/ProfilingToolMenu/index.native.tsx b/src/components/ProfilingToolMenu/index.native.tsx
index affbcfab3c6e..222c2fae482e 100644
--- a/src/components/ProfilingToolMenu/index.native.tsx
+++ b/src/components/ProfilingToolMenu/index.native.tsx
@@ -1,13 +1,20 @@
 import React, {useCallback, useState} from 'react';
+import RNFS from 'react-native-fs';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
 import {startProfiling, stopProfiling} from 'react-native-release-profiler';
+import Share from 'react-native-share';
+import Button from '@components/Button';
 import Switch from '@components/Switch';
 import TestToolRow from '@components/TestToolRow';
 import Text from '@components/Text';
 import useThemeStyles from '@hooks/useThemeStyles';
 import toggleProfileTool from '@libs/actions/ProfilingTool';
+import getPlatform from '@libs/getPlatform';
+import Log from '@libs/Log';
+import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import pkg from '../../../package.json';
 
 type ProfilingToolMenuOnyxProps = {
     isProfilingInProgress: OnyxEntry<boolean>;
@@ -21,11 +28,8 @@ function ProfilingToolMenu({isProfilingInProgress = false}: ProfilingToolMenuPro
 
     // eslint-disable-next-line @lwc/lwc/no-async-await
     const stop = useCallback(async () => {
-        const path = await stopProfiling(true);
-        if (path) {
-            setPathIOS(path);
-        }
-        return path;
+        const path = await stopProfiling(getPlatform() === CONST.PLATFORM.IOS);
+        setPathIOS(path);
     }, []);
 
     const onToggleProfiling = useCallback(() => {
@@ -41,6 +45,29 @@ function ProfilingToolMenu({isProfilingInProgress = false}: ProfilingToolMenuPro
         };
     }, [isProfilingInProgress, stop]);
 
+    // eslint-disable-next-line @lwc/lwc/no-async-await
+    const onDownloadProfiling = useCallback(async () => {
+        const newFileName = `Profile_trace_for_${pkg.version}.json`;
+        const newFilePath = `${RNFS.DocumentDirectoryPath}/${newFileName}`;
+
+        // Copy the file to a new location with the desired filename
+        await RNFS.copyFile(pathIOS, newFilePath)
+            .then(() => {
+                Log.hmmm('[ProfilingToolMenu] file copied successfully');
+            })
+            .catch((error) => {
+                Log.hmmm('[ProfilingToolMenu] error copying file: ', error);
+            });
+
+        const actualPath = `file://${newFilePath}`;
+
+        await Share.open({
+            url: actualPath,
+            title: `Profile_trace_for_${pkg.version}`,
+            type: 'application/json',
+        });
+    }, [pathIOS]);
+
     return (
         <>
             <Text
@@ -58,6 +85,15 @@ function ProfilingToolMenu({isProfilingInProgress = false}: ProfilingToolMenuPro
                 />
             </TestToolRow>
             <Text style={[styles.textLabelSupporting, styles.mb4]}>{!!pathIOS && `path: ${pathIOS}`}</Text>
+            {!!pathIOS && (
+                <TestToolRow title="Profile trace">
+                    <Button
+                        small
+                        text="Share"
+                        onPress={onDownloadProfiling}
+                    />
+                </TestToolRow>
+            )}
         </>
     );
 }

From 5208371e9fadef15c4e51bccf5c1bc766595993d Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Wed, 14 Feb 2024 17:18:20 +0100
Subject: [PATCH 020/110] add more metrics

---
 .../ProfilingToolMenu/index.native.tsx        | 62 +++++++++++++++++--
 1 file changed, 58 insertions(+), 4 deletions(-)

diff --git a/src/components/ProfilingToolMenu/index.native.tsx b/src/components/ProfilingToolMenu/index.native.tsx
index 222c2fae482e..6f2289c1c9e6 100644
--- a/src/components/ProfilingToolMenu/index.native.tsx
+++ b/src/components/ProfilingToolMenu/index.native.tsx
@@ -1,4 +1,6 @@
 import React, {useCallback, useState} from 'react';
+import Config from 'react-native-config';
+import DeviceInfo from 'react-native-device-info';
 import RNFS from 'react-native-fs';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
@@ -12,6 +14,7 @@ import useThemeStyles from '@hooks/useThemeStyles';
 import toggleProfileTool from '@libs/actions/ProfilingTool';
 import getPlatform from '@libs/getPlatform';
 import Log from '@libs/Log';
+import CONFIG from '@src/CONFIG';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import pkg from '../../../package.json';
@@ -22,14 +25,35 @@ type ProfilingToolMenuOnyxProps = {
 
 type ProfilingToolMenuProps = ProfilingToolMenuOnyxProps;
 
+function formatBytes(bytes: number, decimals = 2) {
+    if (!+bytes) {
+        return '0 Bytes';
+    }
+
+    const k = 1024;
+    const dm = decimals < 0 ? 0 : decimals;
+    const sizes = ['Bytes', 'KB', 'MB', 'GB'];
+
+    const i = Math.floor(Math.log(bytes) / Math.log(k));
+
+    return `${parseFloat((bytes / k ** i).toFixed(dm))} ${sizes[i]}`;
+}
+
 function ProfilingToolMenu({isProfilingInProgress = false}: ProfilingToolMenuProps) {
     const styles = useThemeStyles();
     const [pathIOS, setPathIOS] = useState('');
+    const [totalMemory, setTotalMemory] = useState(0);
+    const [usedMemory, setUsedMemory] = useState(0);
 
     // eslint-disable-next-line @lwc/lwc/no-async-await
     const stop = useCallback(async () => {
         const path = await stopProfiling(getPlatform() === CONST.PLATFORM.IOS);
         setPathIOS(path);
+
+        const amountOfTotalMemory = await DeviceInfo.getTotalMemory();
+        const amountOfUsedMemory = await DeviceInfo.getUsedMemory();
+        setTotalMemory(amountOfTotalMemory);
+        setUsedMemory(amountOfUsedMemory);
     }, []);
 
     const onToggleProfiling = useCallback(() => {
@@ -45,10 +69,36 @@ function ProfilingToolMenu({isProfilingInProgress = false}: ProfilingToolMenuPro
         };
     }, [isProfilingInProgress, stop]);
 
+    const getAppInfo = useCallback(
+        () =>
+            JSON.stringify({
+                appVersion: pkg.version,
+                environment: CONFIG.ENVIRONMENT,
+                buildVariant: __DEV__ ? 'debug' : 'release',
+                platform: getPlatform(),
+                totalMemory: formatBytes(totalMemory, 2),
+                usedMemory: formatBytes(usedMemory, 2),
+            }),
+        [totalMemory, usedMemory],
+    );
+
     // eslint-disable-next-line @lwc/lwc/no-async-await
     const onDownloadProfiling = useCallback(async () => {
         const newFileName = `Profile_trace_for_${pkg.version}.json`;
         const newFilePath = `${RNFS.DocumentDirectoryPath}/${newFileName}`;
+        const actualPath = `file://${newFilePath}`;
+
+        // Check if the file already exists and delete it if it does
+        try {
+            const fileExists = await RNFS.exists(newFilePath);
+            if (fileExists) {
+                await RNFS.unlink(newFilePath);
+                Log.hmmm('[ProfilingToolMenu] existing file deleted successfully');
+            }
+        } catch (error) {
+            const typedError = error as Error;
+            Log.hmmm('[ProfilingToolMenu] error checking/deleting existing file: ', typedError.message);
+        }
 
         // Copy the file to a new location with the desired filename
         await RNFS.copyFile(pathIOS, newFilePath)
@@ -59,14 +109,18 @@ function ProfilingToolMenu({isProfilingInProgress = false}: ProfilingToolMenuPro
                 Log.hmmm('[ProfilingToolMenu] error copying file: ', error);
             });
 
-        const actualPath = `file://${newFilePath}`;
+        // Define new filename and path for the app info file
+        const infoFileName = `App_Info_${pkg.version}.json`;
+        const infoFilePath = `${RNFS.DocumentDirectoryPath}/${infoFileName}`;
+        const actualInfoFile = `file://${infoFilePath}`;
+
+        await RNFS.writeFile(infoFilePath, getAppInfo(), 'utf8');
 
         await Share.open({
-            url: actualPath,
-            title: `Profile_trace_for_${pkg.version}`,
+            urls: [actualPath, actualInfoFile],
             type: 'application/json',
         });
-    }, [pathIOS]);
+    }, [getAppInfo, pathIOS]);
 
     return (
         <>

From c1086d220d67d2356b26dc72160ad21e0c14b7eb Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Fri, 16 Feb 2024 10:13:57 +0700
Subject: [PATCH 021/110] fix breadcumbs font auto scaling

---
 src/components/Breadcrumbs.tsx | 9 ++++++++-
 src/components/Text.tsx        | 7 +++++--
 src/styles/index.ts            | 2 --
 3 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/components/Breadcrumbs.tsx b/src/components/Breadcrumbs.tsx
index 34bc3f7e30c8..d4c1a980e13d 100644
--- a/src/components/Breadcrumbs.tsx
+++ b/src/components/Breadcrumbs.tsx
@@ -58,6 +58,7 @@ function Breadcrumbs({breadcrumbs, style}: BreadcrumbsProps) {
                 <Text
                     numberOfLines={1}
                     style={[styles.flexShrink1, styles.breadcrumb, styles.breadcrumbStrong]}
+                    allowFontScaling
                 >
                     {primaryBreadcrumb.text}
                 </Text>
@@ -65,10 +66,16 @@ function Breadcrumbs({breadcrumbs, style}: BreadcrumbsProps) {
 
             {!!secondaryBreadcrumb && (
                 <>
-                    <Text style={[styles.breadcrumbSeparator]}>/</Text>
+                    <Text
+                        style={[styles.breadcrumbSeparator]}
+                        allowFontScaling
+                    >
+                        /
+                    </Text>
                     <Text
                         numberOfLines={1}
                         style={[styles.mw75, styles.flexShrink0, styles.breadcrumb]}
+                        allowFontScaling
                     >
                         {secondaryBreadcrumb.text}
                     </Text>
diff --git a/src/components/Text.tsx b/src/components/Text.tsx
index b94530a423f7..05807b1b4b74 100644
--- a/src/components/Text.tsx
+++ b/src/components/Text.tsx
@@ -27,7 +27,10 @@ type TextProps = RNTextProps &
         family?: keyof FontUtilsType['fontFamily']['platform'];
     };
 
-function Text({color, fontSize = variables.fontSizeNormal, textAlign = 'left', children, family = 'EXP_NEUE', style = {}, ...props}: TextProps, ref: ForwardedRef<RNText>) {
+function Text(
+    {color, fontSize = variables.fontSizeNormal, textAlign = 'left', allowFontScaling = false, children, family = 'EXP_NEUE', style = {}, ...props}: TextProps,
+    ref: ForwardedRef<RNText>,
+) {
     const theme = useTheme();
 
     const componentStyle: TextStyle = {
@@ -44,7 +47,7 @@ function Text({color, fontSize = variables.fontSizeNormal, textAlign = 'left', c
 
     return (
         <RNText
-            allowFontScaling={false}
+            allowFontScaling={allowFontScaling}
             ref={ref}
             style={componentStyle}
             // eslint-disable-next-line react/jsx-props-no-spreading
diff --git a/src/styles/index.ts b/src/styles/index.ts
index 856f8ece917c..91e55161e6fe 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -1477,7 +1477,6 @@ const styles = (theme: ThemeColors) =>
         breadcrumb: {
             color: theme.textSupporting,
             fontSize: variables.fontSizeh1,
-            lineHeight: variables.lineHeightSizeh1,
             ...headlineFont,
         },
 
@@ -1489,7 +1488,6 @@ const styles = (theme: ThemeColors) =>
         breadcrumbSeparator: {
             color: theme.icon,
             fontSize: variables.fontSizeXLarge,
-            lineHeight: variables.lineHeightSizeh1,
             ...headlineFont,
         },
 

From 1860b286765e791d59d8286b4428335ec78d0e65 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Fri, 16 Feb 2024 14:35:49 +0100
Subject: [PATCH 022/110] add release-profile script

---
 scripts/release-profile.sh | 61 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 61 insertions(+)
 create mode 100755 scripts/release-profile.sh

diff --git a/scripts/release-profile.sh b/scripts/release-profile.sh
new file mode 100755
index 000000000000..5c894d01aade
--- /dev/null
+++ b/scripts/release-profile.sh
@@ -0,0 +1,61 @@
+#!/usr/bin/env node
+
+const fs = require('fs');
+const { execSync } = require('child_process');
+
+// Function to parse command-line arguments into a key-value object
+function parseCommandLineArguments() {
+  const args = process.argv.slice(2); // Skip node and script paths
+  const argsMap = {};
+  args.forEach(arg => {
+    const [key, value] = arg.split('=');
+    if (key.startsWith('--')) {
+      argsMap[key.substring(2)] = value;
+    }
+  });
+  return argsMap;
+}
+
+// Function to find .cpuprofile files in the current directory
+function findCpuProfileFiles() {
+  const files = fs.readdirSync(process.cwd());
+  return files.filter(file => file.endsWith('.cpuprofile'));
+}
+
+const argsMap = parseCommandLineArguments();
+
+// Determine sourcemapPath based on the platform flag passed
+let sourcemapPath;
+if (argsMap.platform === "ios") {
+    sourcemapPath = 'main.jsbundle.map';
+} else if (argsMap.platform === "android") {
+    sourcemapPath = 'android/app/build/generated/sourcemaps/react/productionRelease/index.android.bundle.map';
+} else {
+    console.error('Please specify the platform using --platform=ios or --platform=android');
+    process.exit(1);
+}
+
+// Attempt to find .cpuprofile files
+const cpuProfiles = findCpuProfileFiles();
+if (cpuProfiles.length === 0) {
+  console.error('No .cpuprofile files found in the root directory.');
+  process.exit(1);
+} else if (cpuProfiles.length > 1) {
+  console.error('Multiple .cpuprofile files found. Please specify which one to use by placing only one .cpuprofile in the root or specifying the filename as an argument.');
+  process.exit(1);
+} else {
+  // Construct the command
+  const cpuprofileName = cpuProfiles[0];
+  const command = `npx react-native-release-profiler --local ${cpuprofileName} --sourcemap-path ${sourcemapPath}`;
+
+  console.log(`Executing: ${command}`);
+  
+  // Execute the command
+  try {
+    const output = execSync(command, { stdio: 'inherit' });
+    console.log(output.toString());
+  } catch (error) {
+    console.error(`Error executing command: ${error}`);
+    process.exit(1);
+  }
+}

From 94e680a8d82dd576aaf63c299575b4552b466cff Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Fri, 16 Feb 2024 14:36:44 +0100
Subject: [PATCH 023/110] add commands to package

---
 package.json | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/package.json b/package.json
index ca7e523b1971..f264e01abb68 100644
--- a/package.json
+++ b/package.json
@@ -50,6 +50,8 @@
     "analyze-packages": "ANALYZE_BUNDLE=true webpack --config config/webpack/webpack.common.js --env envFile=.env.production",
     "symbolicate:android": "npx metro-symbolicate android/app/build/generated/sourcemaps/react/release/index.android.bundle.map",
     "symbolicate:ios": "npx metro-symbolicate main.jsbundle.map",
+    "symbolicate-release:ios": "scripts/release-profile.sh --platform=ios",
+    "symbolicate-release:android": "scripts/release-profile.sh --platform=android",
     "test:e2e": "ts-node tests/e2e/testRunner.js --development --skipCheckout --skipInstallDeps --buildMode none",
     "test:e2e:dev": "ts-node tests/e2e/testRunner.js --development --skipCheckout --config ./config.dev.js --buildMode skip --skipInstallDeps",
     "gh-actions-unused-styles": "./.github/scripts/findUnusedKeys.sh",
@@ -325,5 +327,5 @@
   "engines": {
     "node": "20.10.0",
     "npm": "10.2.3"
-  }
+    }  
 }

From 521c97264233a8b5cfa0f21ae62a2589c3769940 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Fri, 16 Feb 2024 14:39:01 +0100
Subject: [PATCH 024/110] refactor ProfilingToolMenu

---
 .../ProfilingToolMenu/index.native.tsx        | 100 +++++++++++-------
 1 file changed, 59 insertions(+), 41 deletions(-)

diff --git a/src/components/ProfilingToolMenu/index.native.tsx b/src/components/ProfilingToolMenu/index.native.tsx
index 6f2289c1c9e6..dd33ae3f1746 100644
--- a/src/components/ProfilingToolMenu/index.native.tsx
+++ b/src/components/ProfilingToolMenu/index.native.tsx
@@ -1,5 +1,4 @@
-import React, {useCallback, useState} from 'react';
-import Config from 'react-native-config';
+import React, {useCallback, useEffect, useState} from 'react';
 import DeviceInfo from 'react-native-device-info';
 import RNFS from 'react-native-fs';
 import {withOnyx} from 'react-native-onyx';
@@ -32,7 +31,7 @@ function formatBytes(bytes: number, decimals = 2) {
 
     const k = 1024;
     const dm = decimals < 0 ? 0 : decimals;
-    const sizes = ['Bytes', 'KB', 'MB', 'GB'];
+    const sizes = ['Bytes', 'KiB', 'MiB', 'GiB'];
 
     const i = Math.floor(Math.log(bytes) / Math.log(k));
 
@@ -42,6 +41,7 @@ function formatBytes(bytes: number, decimals = 2) {
 function ProfilingToolMenu({isProfilingInProgress = false}: ProfilingToolMenuProps) {
     const styles = useThemeStyles();
     const [pathIOS, setPathIOS] = useState('');
+    const [sharePath, setSharePath] = useState('');
     const [totalMemory, setTotalMemory] = useState(0);
     const [usedMemory, setUsedMemory] = useState(0);
 
@@ -74,7 +74,6 @@ function ProfilingToolMenu({isProfilingInProgress = false}: ProfilingToolMenuPro
             JSON.stringify({
                 appVersion: pkg.version,
                 environment: CONFIG.ENVIRONMENT,
-                buildVariant: __DEV__ ? 'debug' : 'release',
                 platform: getPlatform(),
                 totalMemory: formatBytes(totalMemory, 2),
                 usedMemory: formatBytes(usedMemory, 2),
@@ -82,45 +81,64 @@ function ProfilingToolMenu({isProfilingInProgress = false}: ProfilingToolMenuPro
         [totalMemory, usedMemory],
     );
 
-    // eslint-disable-next-line @lwc/lwc/no-async-await
-    const onDownloadProfiling = useCallback(async () => {
-        const newFileName = `Profile_trace_for_${pkg.version}.json`;
-        const newFilePath = `${RNFS.DocumentDirectoryPath}/${newFileName}`;
-        const actualPath = `file://${newFilePath}`;
-
-        // Check if the file already exists and delete it if it does
-        try {
-            const fileExists = await RNFS.exists(newFilePath);
-            if (fileExists) {
-                await RNFS.unlink(newFilePath);
-                Log.hmmm('[ProfilingToolMenu] existing file deleted successfully');
-            }
-        } catch (error) {
-            const typedError = error as Error;
-            Log.hmmm('[ProfilingToolMenu] error checking/deleting existing file: ', typedError.message);
+    useEffect(() => {
+        if (!pathIOS) {
+            return;
         }
 
-        // Copy the file to a new location with the desired filename
-        await RNFS.copyFile(pathIOS, newFilePath)
-            .then(() => {
-                Log.hmmm('[ProfilingToolMenu] file copied successfully');
-            })
-            .catch((error) => {
-                Log.hmmm('[ProfilingToolMenu] error copying file: ', error);
-            });
-
-        // Define new filename and path for the app info file
-        const infoFileName = `App_Info_${pkg.version}.json`;
-        const infoFilePath = `${RNFS.DocumentDirectoryPath}/${infoFileName}`;
-        const actualInfoFile = `file://${infoFilePath}`;
-
-        await RNFS.writeFile(infoFilePath, getAppInfo(), 'utf8');
-
-        await Share.open({
-            urls: [actualPath, actualInfoFile],
-            type: 'application/json',
-        });
-    }, [getAppInfo, pathIOS]);
+        // eslint-disable-next-line @lwc/lwc/no-async-await
+        const rename = async () => {
+            const newFileName = `Profile_trace_for_${pkg.version}.cpuprofile`;
+            const newFilePath = `${RNFS.DocumentDirectoryPath}/${newFileName}`;
+
+            try {
+                const fileExists = await RNFS.exists(newFilePath);
+                if (fileExists) {
+                    await RNFS.unlink(newFilePath);
+                    Log.hmmm('[ProfilingToolMenu] existing file deleted successfully');
+                }
+            } catch (error) {
+                const typedError = error as Error;
+                Log.hmmm('[ProfilingToolMenu] error checking/deleting existing file: ', typedError.message);
+            }
+
+            // Copy the file to a new location with the desired filename
+            await RNFS.copyFile(pathIOS, newFilePath)
+                .then(() => {
+                    Log.hmmm('[ProfilingToolMenu] file copied successfully');
+                })
+                .catch((error) => {
+                    Log.hmmm('[ProfilingToolMenu] error copying file: ', error);
+                });
+
+            setSharePath(newFilePath);
+        };
+
+        rename();
+    }, [pathIOS]);
+
+    const onDownloadProfiling = useCallback(() => {
+        // eslint-disable-next-line @lwc/lwc/no-async-await
+        const shareFiles = async () => {
+            try {
+                // Define new filename and path for the app info file
+                const infoFileName = `App_Info_${pkg.version}.json`;
+                const infoFilePath = `${RNFS.DocumentDirectoryPath}/${infoFileName}`;
+                const actualInfoFile = `file://${infoFilePath}`;
+
+                await RNFS.writeFile(infoFilePath, getAppInfo(), 'utf8');
+
+                const shareOptions = {
+                    urls: [`file://${sharePath}`, actualInfoFile],
+                };
+
+                await Share.open(shareOptions);
+            } catch (error) {
+                console.error('Error renaming and sharing file:', error);
+            }
+        };
+        shareFiles();
+    }, [getAppInfo, sharePath]);
 
     return (
         <>

From bcd5b33a43640ce15973a8844abb1a274eb6b2d2 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Fri, 16 Feb 2024 14:55:39 +0100
Subject: [PATCH 025/110] update README

---
 README.md | 62 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 62 insertions(+)

diff --git a/README.md b/README.md
index 24fa343f0d45..f45dfb0ec679 100644
--- a/README.md
+++ b/README.md
@@ -185,6 +185,68 @@ Our React Native Android app now uses the `Hermes` JS engine which requires your
 
 To make it easier to test things in web, we expose the Onyx object to the window, so you can easily do `Onyx.set('bla', 1)`.
 
+----
+
+# Profiling
+### Record a trace:
+1. Launch the app.
+2. Navigate to the feature you wish to test.
+3. Tap with four fingers to open a menu.
+4. In the menu, enable **`Use Profiling`**.
+5. Close the menu and interact with the app.
+6. Tap with four fingers again and select to stop profiling.
+7. A **`Share`** option appears for sharing the trace.
+8. Two files will be available: the trace file(`Profile<app version>.cpuprofile`) and another with build info(`AppInfo<app version>.json`).
+
+Build info:
+```jsx
+{
+    appVersion: "1.0.0",
+    environment: "production",
+    platform: "IOS",
+    totalMemory: "3GB",
+    usedMemory: "300MB"
+}
+```
+
+### How to generate source map to symbolicate trace record:
+1. You have two files: `AppInfo<app version>.json` and `Profile<app version>.cpuprofile`
+2. Put `Profile<app version>.cpuprofile` in the root of the project.
+3. Get the app version from **`AppInfo<app version>.json`** and switch to that branch for accurate source maps creation. 
+4. Enable source maps on Android 
+Ensure the following is set in your app's `android/app/build.gradle` file.
+
+    ```jsx
+    project.ext.react = [
+        enableHermes: true,
+        hermesFlagsRelease: ["-O", "-output-source-map"], // plus whichever flag was required to set this away from default
+    ]
+    ```
+    
+5. Enable source maps on IOS 
+Within Xcode head to the build phase - `Bundle React Native code and images`.
+    
+    ```jsx
+    export SOURCEMAP_FILE="$(pwd)/../main.jsbundle.map";
+    
+    export NODE_BINARY=node
+    ../node_modules/react-native/scripts/react-native-xcode.sh
+    ```
+    
+6. Do `npm i` and `npm run pod-install` 
+7. Depend on platform you want to test run Android/IOS app in production mode
+8. After build was completed you would see generated source map
+Android: `android/app/build/generated/sourcemaps/react/productionRelease/index.android.bundle.map` 
+IOS: `main.jsbundle.map` 
+9. Next you need to symbolicate your trace. 
+Android: `npm run symbolicate-release:android`
+IOS: `npm run symbolicate-release:ios` 
+10. You would see that file`Profile_trace_for_<app version>-converted.json` appeared in you app root folder
+11. Open the performance trace file in your tool of choice:
+    - SpeedScope ([https://www.speedscope.app](https://www.speedscope.app/))
+    - Perfetto UI (https://ui.perfetto.dev/)
+    - Google Chrome's Tracing UI (chrome://tracing)
+
 ---
 
 # App Structure and Conventions

From f0803b280f341c545b3b844df7998f4f52c1b79a Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Fri, 16 Feb 2024 16:18:21 +0100
Subject: [PATCH 026/110] update scripts

---
 package.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/package.json b/package.json
index 93b9f7572bff..81ea0496a2c7 100644
--- a/package.json
+++ b/package.json
@@ -50,8 +50,8 @@
     "analyze-packages": "ANALYZE_BUNDLE=true webpack --config config/webpack/webpack.common.js --env envFile=.env.production",
     "symbolicate:android": "npx metro-symbolicate android/app/build/generated/sourcemaps/react/release/index.android.bundle.map",
     "symbolicate:ios": "npx metro-symbolicate main.jsbundle.map",
-    "symbolicate-release:ios": "scripts/release-profile.sh --platform=ios",
-    "symbolicate-release:android": "scripts/release-profile.sh --platform=android",
+    "symbolicate-release:ios": "node scripts/release-profile.sh --platform=ios",
+    "symbolicate-release:android": "node scripts/release-profile.sh --platform=android",
     "test:e2e": "ts-node tests/e2e/testRunner.js --development --skipCheckout --skipInstallDeps --buildMode none",
     "test:e2e:dev": "ts-node tests/e2e/testRunner.js --development --skipCheckout --config ./config.dev.js --buildMode skip --skipInstallDeps",
     "gh-actions-unused-styles": "./.github/scripts/findUnusedKeys.sh",

From 3622df55a68465ef566e391ef5177c3a583e2181 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Fri, 16 Feb 2024 16:40:06 +0100
Subject: [PATCH 027/110] switch sh to js

---
 scripts/{release-profile.sh => release-profile.js} | 2 ++
 1 file changed, 2 insertions(+)
 rename scripts/{release-profile.sh => release-profile.js} (95%)

diff --git a/scripts/release-profile.sh b/scripts/release-profile.js
similarity index 95%
rename from scripts/release-profile.sh
rename to scripts/release-profile.js
index 5c894d01aade..defa0ca7a9b7 100755
--- a/scripts/release-profile.sh
+++ b/scripts/release-profile.js
@@ -1,4 +1,5 @@
 #!/usr/bin/env node
+/* eslint-disable no-console */
 
 const fs = require('fs');
 const { execSync } = require('child_process');
@@ -19,6 +20,7 @@ function parseCommandLineArguments() {
 // Function to find .cpuprofile files in the current directory
 function findCpuProfileFiles() {
   const files = fs.readdirSync(process.cwd());
+  // eslint-disable-next-line rulesdir/prefer-underscore-method
   return files.filter(file => file.endsWith('.cpuprofile'));
 }
 

From 016f21e2d11edee4a370e95db36e5e85cd4eb629 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Fri, 16 Feb 2024 16:50:40 +0100
Subject: [PATCH 028/110] lint

---
 package.json               |  4 +--
 scripts/release-profile.js | 66 +++++++++++++++++++-------------------
 2 files changed, 35 insertions(+), 35 deletions(-)

diff --git a/package.json b/package.json
index 81ea0496a2c7..eae61a638792 100644
--- a/package.json
+++ b/package.json
@@ -50,8 +50,8 @@
     "analyze-packages": "ANALYZE_BUNDLE=true webpack --config config/webpack/webpack.common.js --env envFile=.env.production",
     "symbolicate:android": "npx metro-symbolicate android/app/build/generated/sourcemaps/react/release/index.android.bundle.map",
     "symbolicate:ios": "npx metro-symbolicate main.jsbundle.map",
-    "symbolicate-release:ios": "node scripts/release-profile.sh --platform=ios",
-    "symbolicate-release:android": "node scripts/release-profile.sh --platform=android",
+    "symbolicate-release:ios": "scripts/release-profile.js --platform=ios",
+    "symbolicate-release:android": "scripts/release-profile.js --platform=android",
     "test:e2e": "ts-node tests/e2e/testRunner.js --development --skipCheckout --skipInstallDeps --buildMode none",
     "test:e2e:dev": "ts-node tests/e2e/testRunner.js --development --skipCheckout --config ./config.dev.js --buildMode skip --skipInstallDeps",
     "gh-actions-unused-styles": "./.github/scripts/findUnusedKeys.sh",
diff --git a/scripts/release-profile.js b/scripts/release-profile.js
index defa0ca7a9b7..0f96232bcdca 100755
--- a/scripts/release-profile.js
+++ b/scripts/release-profile.js
@@ -2,35 +2,35 @@
 /* eslint-disable no-console */
 
 const fs = require('fs');
-const { execSync } = require('child_process');
+const {execSync} = require('child_process');
 
 // Function to parse command-line arguments into a key-value object
 function parseCommandLineArguments() {
-  const args = process.argv.slice(2); // Skip node and script paths
-  const argsMap = {};
-  args.forEach(arg => {
-    const [key, value] = arg.split('=');
-    if (key.startsWith('--')) {
-      argsMap[key.substring(2)] = value;
-    }
-  });
-  return argsMap;
+    const args = process.argv.slice(2); // Skip node and script paths
+    const argsMap = {};
+    args.forEach((arg) => {
+        const [key, value] = arg.split('=');
+        if (key.startsWith('--')) {
+            argsMap[key.substring(2)] = value;
+        }
+    });
+    return argsMap;
 }
 
 // Function to find .cpuprofile files in the current directory
 function findCpuProfileFiles() {
-  const files = fs.readdirSync(process.cwd());
-  // eslint-disable-next-line rulesdir/prefer-underscore-method
-  return files.filter(file => file.endsWith('.cpuprofile'));
+    const files = fs.readdirSync(process.cwd());
+    // eslint-disable-next-line rulesdir/prefer-underscore-method
+    return files.filter((file) => file.endsWith('.cpuprofile'));
 }
 
 const argsMap = parseCommandLineArguments();
 
 // Determine sourcemapPath based on the platform flag passed
 let sourcemapPath;
-if (argsMap.platform === "ios") {
+if (argsMap.platform === 'ios') {
     sourcemapPath = 'main.jsbundle.map';
-} else if (argsMap.platform === "android") {
+} else if (argsMap.platform === 'android') {
     sourcemapPath = 'android/app/build/generated/sourcemaps/react/productionRelease/index.android.bundle.map';
 } else {
     console.error('Please specify the platform using --platform=ios or --platform=android');
@@ -40,24 +40,24 @@ if (argsMap.platform === "ios") {
 // Attempt to find .cpuprofile files
 const cpuProfiles = findCpuProfileFiles();
 if (cpuProfiles.length === 0) {
-  console.error('No .cpuprofile files found in the root directory.');
-  process.exit(1);
+    console.error('No .cpuprofile files found in the root directory.');
+    process.exit(1);
 } else if (cpuProfiles.length > 1) {
-  console.error('Multiple .cpuprofile files found. Please specify which one to use by placing only one .cpuprofile in the root or specifying the filename as an argument.');
-  process.exit(1);
-} else {
-  // Construct the command
-  const cpuprofileName = cpuProfiles[0];
-  const command = `npx react-native-release-profiler --local ${cpuprofileName} --sourcemap-path ${sourcemapPath}`;
-
-  console.log(`Executing: ${command}`);
-  
-  // Execute the command
-  try {
-    const output = execSync(command, { stdio: 'inherit' });
-    console.log(output.toString());
-  } catch (error) {
-    console.error(`Error executing command: ${error}`);
+    console.error('Multiple .cpuprofile files found. Please specify which one to use by placing only one .cpuprofile in the root or specifying the filename as an argument.');
     process.exit(1);
-  }
+} else {
+    // Construct the command
+    const cpuprofileName = cpuProfiles[0];
+    const command = `npx react-native-release-profiler --local ${cpuprofileName} --sourcemap-path ${sourcemapPath}`;
+
+    console.log(`Executing: ${command}`);
+
+    // Execute the command
+    try {
+        const output = execSync(command, {stdio: 'inherit'});
+        console.log(output.toString());
+    } catch (error) {
+        console.error(`Error executing command: ${error}`);
+        process.exit(1);
+    }
 }

From bfcd7dc57ada3d3d57a54cf1061ad726d9ad994a Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Sun, 18 Feb 2024 11:56:43 +0100
Subject: [PATCH 029/110] mock react-native-share

---
 jest/setup.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/jest/setup.ts b/jest/setup.ts
index 4a23a85edb83..b0bb0829dd08 100644
--- a/jest/setup.ts
+++ b/jest/setup.ts
@@ -42,3 +42,7 @@ jest.mock('react-native-sound', () => {
 
     return SoundMock;
 });
+
+jest.mock('react-native-share', () => ({
+    default: jest.fn(),
+}));

From 9c34421cfdd8b8263584a7db05efd902e2b02abd Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Sun, 18 Feb 2024 12:59:33 +0100
Subject: [PATCH 030/110] update README

---
 README.md | 85 +++++++++++++++++++++++++++++++------------------------
 1 file changed, 48 insertions(+), 37 deletions(-)

diff --git a/README.md b/README.md
index e379cdd5bbef..cb41ba264c83 100644
--- a/README.md
+++ b/README.md
@@ -189,62 +189,73 @@ To make it easier to test things in web, we expose the Onyx object to the window
 
 ----
 
-# Profiling
-### Record a trace:
-1. Launch the app.
-2. Navigate to the feature you wish to test.
-3. Tap with four fingers to open a menu.
-4. In the menu, enable **`Use Profiling`**.
-5. Close the menu and interact with the app.
-6. Tap with four fingers again and select to stop profiling.
-7. A **`Share`** option appears for sharing the trace.
-8. Two files will be available: the trace file(`Profile<app version>.cpuprofile`) and another with build info(`AppInfo<app version>.json`).
+# Release Profiler
+Often, performance issue debugging occurs in debug builds, which can introduce errors from elements such as JS Garbage Collection, Hermes debug markers, or LLDB pauses.
 
-Build info:
-```jsx
-{
-    appVersion: "1.0.0",
-    environment: "production",
-    platform: "IOS",
-    totalMemory: "3GB",
-    usedMemory: "300MB"
-}
-```
+`react-native-release-profiler` facilitates profiling within release builds for accurate local problem-solving and broad performance analysis in production to spot regressions or collect extensive device data. Therefore, we will utilize the production build version
 
-### How to generate source map to symbolicate trace record:
-1. You have two files: `AppInfo<app version>.json` and `Profile<app version>.cpuprofile`
-2. Put `Profile<app version>.cpuprofile` in the root of the project.
-3. Get the app version from **`AppInfo<app version>.json`** and switch to that branch for accurate source maps creation. 
-4. Enable source maps on Android 
+### Getting Started with Source Maps
+To accurately profile your application, generating source maps for Android and iOS is crucial. Here's how to enable them:
+1. Enable source maps on Android 
 Ensure the following is set in your app's `android/app/build.gradle` file.
 
     ```jsx
     project.ext.react = [
         enableHermes: true,
-        hermesFlagsRelease: ["-O", "-output-source-map"], // plus whichever flag was required to set this away from default
+        hermesFlagsRelease: ["-O", "-output-source-map"], // <-- here, plus whichever flag was required to set this away from default
     ]
     ```
     
-5. Enable source maps on IOS 
+2. Enable source maps on IOS 
 Within Xcode head to the build phase - `Bundle React Native code and images`.
     
     ```jsx
-    export SOURCEMAP_FILE="$(pwd)/../main.jsbundle.map";
+    export SOURCEMAP_FILE="$(pwd)/../main.jsbundle.map" // <-- here;
     
     export NODE_BINARY=node
     ../node_modules/react-native/scripts/react-native-xcode.sh
     ```
-    
-6. Do `npm i` and `npm run pod-install` 
-7. Depend on platform you want to test run Android/IOS app in production mode
-8. After build was completed you would see generated source map
-Android: `android/app/build/generated/sourcemaps/react/productionRelease/index.android.bundle.map` 
-IOS: `main.jsbundle.map` 
-9. Next you need to symbolicate your trace. 
+3. Install the necessary packages and CocoaPods dependencies:
+    ```jsx
+    npm i && npm run pod-install
+    ```
+7. Depending on the platform you are targeting, run your Android/iOS app in production mode.
+8. Upon completion, the generated source map can be found at:
+  Android: `android/app/build/generated/sourcemaps/react/productionRelease/index.android.bundle.map` 
+  IOS: `main.jsbundle.map` 
+
+### Recording a Trace:
+1. Ensure you have generated the source map as outlined above.
+2. Launch the app in production mode.
+2. Navigate to the feature you wish to profile.
+3. Initiate the profiling session by tapping with four fingers to open the menu and selecting **`Use Profiling`**.
+4. Close the menu and interact with the app.
+5. After completing your interactions, tap with four fingers again and select to stop profiling.
+6. You will be presented with a **`Share`** option to export the trace, which includes a trace file (`Profile<app version>.cpuprofile`) and build info (`AppInfo<app version>.json`).
+
+Build info:
+```jsx
+{
+    appVersion: "1.0.0",
+    environment: "production",
+    platform: "IOS",
+    totalMemory: "3GB",
+    usedMemory: "300MB"
+}
+```
+
+### How to symbolicate trace record:
+1. You have two files: `AppInfo<app version>.json` and `Profile<app version>.cpuprofile`
+2. Place the `Profile<app version>.cpuprofile` file at the root of your project.
+3. If you have already generated a source map from the steps above for this branch, you can skip to the next step. Otherwise, obtain the app version from `AppInfo<app version>.json` switch to that branch and generate the source map as described.
+
+`IMPORTANT:` You should generate the source map from the same branch as the trace was recorded.
+
+4. Use the following commands to symbolicate the trace for Android and iOS, respectively:
 Android: `npm run symbolicate-release:android`
 IOS: `npm run symbolicate-release:ios` 
-10. You would see that file`Profile_trace_for_<app version>-converted.json` appeared in you app root folder
-11. Open the performance trace file in your tool of choice:
+5. A new file named `Profile_trace_for_<app version>-converted.json` will appear in your project's root folder.
+6. Open this file in your tool of choice:
     - SpeedScope ([https://www.speedscope.app](https://www.speedscope.app/))
     - Perfetto UI (https://ui.perfetto.dev/)
     - Google Chrome's Tracing UI (chrome://tracing)

From 8d09e60158b027e3c4abc8d2ff994687a0a0c201 Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Tue, 20 Feb 2024 11:22:28 +0700
Subject: [PATCH 031/110] fix: breadcrums height

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

diff --git a/src/styles/index.ts b/src/styles/index.ts
index 91e55161e6fe..43edcccc2c83 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -1471,7 +1471,7 @@ const styles = (theme: ThemeColors) =>
         },
 
         breadcrumsContainer: {
-            height: 24,
+            minHeight: 24,
         },
 
         breadcrumb: {

From 03695f673af3b575bc582c4dc0fd6d8bf5c0f30e Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Tue, 20 Feb 2024 09:35:37 +0100
Subject: [PATCH 032/110] Fix TS issues in the updated code

---
 src/components/MoneyRequestHeader.tsx       |  6 +++--
 src/libs/ReportUtils.ts                     |  4 ++--
 src/pages/home/HeaderView.tsx               | 26 +++++++++------------
 src/pages/home/ReportScreen.tsx             |  8 +++----
 src/pages/home/report/ReportActionsView.tsx |  4 ++--
 src/utils/pick.ts                           | 11 ---------
 6 files changed, 23 insertions(+), 36 deletions(-)
 delete mode 100644 src/utils/pick.ts

diff --git a/src/components/MoneyRequestHeader.tsx b/src/components/MoneyRequestHeader.tsx
index d63e9e50ae3c..553b2cab0aa5 100644
--- a/src/components/MoneyRequestHeader.tsx
+++ b/src/components/MoneyRequestHeader.tsx
@@ -93,11 +93,13 @@ function MoneyRequestHeader({session, parentReport, report, parentReportAction,
     }
 
     const changeMoneyRequestStatus = () => {
+        const iouTransactionID = parentReportAction?.actionName === CONST.REPORT.ACTIONS.TYPE.IOU ? parentReportAction.originalMessage?.IOUTransactionID ?? '' : '';
+
         if (isOnHold) {
-            IOU.unholdRequest(parentReportAction?.originalMessage?.IOUTransactionID ?? '', report?.reportID);
+            IOU.unholdRequest(iouTransactionID, report?.reportID);
         } else {
             const activeRoute = encodeURIComponent(Navigation.getActiveRouteWithoutParams());
-            Navigation.navigate(ROUTES.MONEY_REQUEST_HOLD_REASON.getRoute(policy?.type, parentReportAction?.originalMessage?.IOUTransactionID ?? '', report?.reportID, activeRoute));
+            Navigation.navigate(ROUTES.MONEY_REQUEST_HOLD_REASON.getRoute(policy?.type ?? '', iouTransactionID, report?.reportID, activeRoute));
         }
     };
 
diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index 8d810fe80918..47f95a02790b 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -2699,8 +2699,8 @@ function getReportDescriptionText(report: Report): string {
     return parser.htmlToText(report.description);
 }
 
-function getPolicyDescriptionText(policy: Policy): string {
-    if (!policy.description) {
+function getPolicyDescriptionText(policy: OnyxEntry<Policy>): string {
+    if (!policy?.description) {
         return '';
     }
 
diff --git a/src/pages/home/HeaderView.tsx b/src/pages/home/HeaderView.tsx
index a85c40a9c368..5f36a9494a21 100644
--- a/src/pages/home/HeaderView.tsx
+++ b/src/pages/home/HeaderView.tsx
@@ -37,11 +37,7 @@ 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 {EmptyObject} from '@src/types/utils/EmptyObject';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
-import pick from '@src/utils/pick';
-
-type PickedPolicyValues = Pick<OnyxTypes.Policy, 'name' | 'avatar' | 'pendingAction'>;
 
 type HeaderViewOnyxProps = {
     /** URL to the assigned guide's appointment booking calendar */
@@ -57,7 +53,7 @@ type HeaderViewOnyxProps = {
     parentReport: OnyxEntry<ReportWithoutHasDraft>;
 
     /** The current policy of the report */
-    policy: PickedPolicyValues | EmptyObject;
+    policy: OnyxEntry<OnyxTypes.Policy>;
 };
 
 type HeaderViewProps = HeaderViewOnyxProps & {
@@ -99,17 +95,17 @@ function HeaderView({report, personalDetails, parentReport, policy, session, rep
     const canLeaveRoom = ReportUtils.canLeaveRoom(report, isPolicyMember);
     const reportDescription = ReportUtils.getReportDescriptionText(report);
     const policyName = ReportUtils.getPolicyName(report, true);
-    const policyDescription = ReportUtils.getPolicyDescriptionText(props.policy);
-    const isPersonalExpenseChat = isPolicyExpenseChat && ReportUtils.isCurrentUserSubmitter(props.report.reportID);
+    const policyDescription = ReportUtils.getPolicyDescriptionText(policy);
+    const isPersonalExpenseChat = isPolicyExpenseChat && ReportUtils.isCurrentUserSubmitter(report.reportID);
     const shouldShowSubtitle = () => {
-        if (_.isEmpty(subtitle)) {
+        if (!subtitle) {
             return false;
         }
         if (isChatRoom) {
-            return _.isEmpty(reportDescription);
+            return !reportDescription;
         }
         if (isPolicyExpenseChat) {
-            return _.isEmpty(policyDescription);
+            return !policyDescription;
         }
         return true;
     };
@@ -171,7 +167,7 @@ function HeaderView({report, personalDetails, parentReport, policy, session, rep
     );
 
     const renderAdditionalText = () => {
-        if (shouldShowSubtitle() || isPersonalExpenseChat || _.isEmpty(policyName) || !_.isEmpty(parentNavigationSubtitleData)) {
+        if (shouldShowSubtitle() || isPersonalExpenseChat || !policyName || !isEmptyObject(parentNavigationSubtitleData)) {
             return null;
         }
         return (
@@ -302,14 +298,14 @@ function HeaderView({report, personalDetails, parentReport, policy, session, rep
                                                 </Text>
                                             </PressableWithoutFeedback>
                                         )}
-                                        {isPolicyExpenseChat && !_.isEmpty(policyDescription) && _.isEmpty(parentNavigationSubtitleData) && (
+                                        {isPolicyExpenseChat && !!policyDescription && isEmptyObject(parentNavigationSubtitleData) && (
                                             <PressableWithoutFeedback
                                                 onPress={() => {
-                                                    if (ReportUtils.canEditPolicyDescription(props.policy)) {
-                                                        Navigation.navigate(ROUTES.WORKSPACE_DESCRIPTION.getRoute(props.report.policyID));
+                                                    if (ReportUtils.canEditPolicyDescription(policy)) {
+                                                        Navigation.navigate(ROUTES.WORKSPACE_PROFILE_DESCRIPTION.getRoute(report.policyID ?? ''));
                                                         return;
                                                     }
-                                                    Navigation.navigate(ROUTES.REPORT_WITH_ID_DETAILS.getRoute(props.reportID));
+                                                    Navigation.navigate(ROUTES.REPORT_WITH_ID_DETAILS.getRoute(reportID));
                                                 }}
                                                 style={[styles.alignSelfStart, styles.mw100]}
                                                 accessibilityLabel={translate('workspace.editor.descriptionInputLabel')}
diff --git a/src/pages/home/ReportScreen.tsx b/src/pages/home/ReportScreen.tsx
index 42a76a29e43d..fac96b9ccdaf 100644
--- a/src/pages/home/ReportScreen.tsx
+++ b/src/pages/home/ReportScreen.tsx
@@ -171,7 +171,7 @@ function ReportScreen({
             oldPolicyName: reportProp?.oldPolicyName,
             policyName: reportProp?.policyName,
             isOptimisticReport: reportProp?.isOptimisticReport,
-            lastMentionedTime: reportProp.lastMentionedTime,
+            lastMentionedTime: reportProp?.lastMentionedTime,
         }),
         [
             reportProp?.lastReadTime,
@@ -208,7 +208,7 @@ function ReportScreen({
             reportProp?.oldPolicyName,
             reportProp?.policyName,
             reportProp?.isOptimisticReport,
-            reportProp.lastMentionedTime,
+            reportProp?.lastMentionedTime,
         ],
     );
 
@@ -439,7 +439,7 @@ function ReportScreen({
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
 
-    const reportIDFromParams = lodashGet(route.params, 'reportID');
+    const reportIDFromParams = route.params.reportID;
     // eslint-disable-next-line rulesdir/no-negated-variables
     const shouldShowNotFoundPage = useMemo(
         (): boolean =>
@@ -451,7 +451,7 @@ function ReportScreen({
                 !isLoading &&
                 !userLeavingStatus) ||
             shouldHideReport ||
-            (reportIDFromParams && !ReportUtils.isValidReportIDFromPath(reportIDFromParams)),
+            (!!reportIDFromParams && !ReportUtils.isValidReportIDFromPath(reportIDFromParams)),
         [report, reportMetadata, isLoading, shouldHideReport, isOptimisticDelete, userLeavingStatus, reportIDFromParams],
     );
 
diff --git a/src/pages/home/report/ReportActionsView.tsx b/src/pages/home/report/ReportActionsView.tsx
index b87e1eede809..3571b3064420 100755
--- a/src/pages/home/report/ReportActionsView.tsx
+++ b/src/pages/home/report/ReportActionsView.tsx
@@ -146,7 +146,7 @@ function ReportActionsView({
         }
     }, [report.pendingFields, didSubscribeToReportTypingEvents, reportID]);
 
-    const oldestReportAction = useMemo(() => _.last(props.reportActions), [props.reportActions]);
+    const oldestReportAction = useMemo(() => reportActions?.at(-1), [reportActions]);
 
     /**
      * Retrieves the next set of report actions for the chat once we are nearing the end of what we are currently
@@ -164,7 +164,7 @@ function ReportActionsView({
         }
         // Retrieve the next REPORT.ACTIONS.LIMIT sized page of comments
         Report.getOlderActions(reportID, oldestReportAction.reportActionID);
-    }, [props.isLoadingOlderReportActions, props.network.isOffline, oldestReportAction, reportID]);
+    }, [isLoadingOlderReportActions, network.isOffline, oldestReportAction, reportID]);
 
     /**
      * Retrieves the next set of report actions for the chat once we are nearing the end of what we are currently
diff --git a/src/utils/pick.ts b/src/utils/pick.ts
deleted file mode 100644
index 47d29cbc4f88..000000000000
--- a/src/utils/pick.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import type {EmptyObject} from '@src/types/utils/EmptyObject';
-
-function pick<TValue extends Record<string, unknown>, TKey extends keyof TValue>(object: TValue | null | undefined, keys: TKey[]): Pick<TValue, TKey> | EmptyObject {
-    if (!object) {
-        return {};
-    }
-
-    return keys.reduce((values, key) => (key in object ? {...values, [key]: object[key]} : values), {});
-}
-
-export default pick;

From bc444cfba92e78f317a0fdbd312dc1c1fa5e427b Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Tue, 20 Feb 2024 09:55:35 +0100
Subject: [PATCH 033/110] Minor type improvement

---
 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 47f95a02790b..b3b76d90d71b 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -4745,7 +4745,7 @@ function getRoom(type: ValueOf<typeof CONST.REPORT.CHAT_TYPE>, policyID: string)
 /**
  *  We only want policy members who are members of the report to be able to modify the report description, but not in thread chat.
  */
-function canEditReportDescription(report: OnyxEntry<Report>, policy: OnyxEntry<Partial<Policy>> | undefined): boolean {
+function canEditReportDescription(report: OnyxEntry<Report>, policy: OnyxEntry<Policy> | undefined): boolean {
     return (
         !isMoneyRequestReport(report) &&
         !isArchivedRoom(report) &&

From fe6e43f6139865fb1e399dd1d8bd103ab393185d Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Tue, 20 Feb 2024 13:50:26 +0100
Subject: [PATCH 034/110] Update condition, type improvement

---
 src/libs/OnyxSelectors/reportWithoutHasDraftSelector.ts         | 2 +-
 .../FloatingMessageCounterContainer/types.ts                    | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/libs/OnyxSelectors/reportWithoutHasDraftSelector.ts b/src/libs/OnyxSelectors/reportWithoutHasDraftSelector.ts
index 255081a86c7d..8305fa217f79 100644
--- a/src/libs/OnyxSelectors/reportWithoutHasDraftSelector.ts
+++ b/src/libs/OnyxSelectors/reportWithoutHasDraftSelector.ts
@@ -5,7 +5,7 @@ type ReportWithoutHasDraft = Omit<Report, 'hasDraft'>;
 
 export default function reportWithoutHasDraftSelector(report: OnyxEntry<Report>): OnyxEntry<ReportWithoutHasDraft> {
     if (!report) {
-        return report;
+        return null;
     }
     const {hasDraft, ...reportWithoutHasDraft} = report;
     return reportWithoutHasDraft;
diff --git a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/types.ts b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/types.ts
index 96aae0b6d4e7..cfe791eed79c 100644
--- a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/types.ts
+++ b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/types.ts
@@ -3,7 +3,7 @@ import type ChildrenProps from '@src/types/utils/ChildrenProps';
 
 type FloatingMessageCounterContainerProps = ChildrenProps & {
     /** Styles to be assigned to Container */
-    containerStyles: StyleProp<ViewStyle>;
+    containerStyles?: StyleProp<ViewStyle>;
 
     /** Specifies the accessibility hint for the component */
     accessibilityHint?: string;

From 443bf0e490ded4a78f4118b4d38913723dc1b72c Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Tue, 20 Feb 2024 14:10:49 +0100
Subject: [PATCH 035/110] Fix perf test

---
 src/pages/home/report/ReportActionsList.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/home/report/ReportActionsList.tsx b/src/pages/home/report/ReportActionsList.tsx
index 916fff8d9515..6f0e8b2aa793 100644
--- a/src/pages/home/report/ReportActionsList.tsx
+++ b/src/pages/home/report/ReportActionsList.tsx
@@ -151,7 +151,7 @@ function ReportActionsList({
 
     const previousLastIndex = useRef(lastActionIndex);
 
-    const linkedReportActionID = route.params.reportActionID ?? '';
+    const linkedReportActionID = route.params?.reportActionID ?? '';
 
     // This state is used to force a re-render when the user manually marks a message as unread
     // by using a timestamp you can force re-renders without having to worry about if another message was marked as unread before

From 12a6970e89cab2b0d1685f1b056c148eb0885981 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Hanno=20J=2E=20G=C3=B6decke?= <die.drei99@yahoo.de>
Date: Wed, 21 Feb 2024 20:33:15 +0100
Subject: [PATCH 036/110] undo spacing

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 0dd1fe87056f..7beb426932aa 100644
--- a/package.json
+++ b/package.json
@@ -328,5 +328,5 @@
   "engines": {
     "node": "20.10.0",
     "npm": "10.2.3"
-    }  
+  }  
 }

From 08629dfa7d74c3368f02b1d0ad8ed9ebe9ff30e5 Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Tue, 27 Feb 2024 17:32:51 +0100
Subject: [PATCH 037/110] Minor code improvement

---
 src/styles/utils/FontUtils/index.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/styles/utils/FontUtils/index.ts b/src/styles/utils/FontUtils/index.ts
index c6f1a2f3a4f5..c460a20d855d 100644
--- a/src/styles/utils/FontUtils/index.ts
+++ b/src/styles/utils/FontUtils/index.ts
@@ -11,9 +11,9 @@ const FontUtils = {
     },
     fontWeight: {
         bold: fontWeightBold,
-        normal: '400' as const,
+        normal: '400',
     },
-};
+} as const;
 
 type FontUtilsType = typeof FontUtils;
 

From d6fdc99cc86d4f34a8896a98f162017ca9160ae5 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Wed, 28 Feb 2024 18:17:22 +0100
Subject: [PATCH 038/110] add strings

---
 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 cf8823f5b2be..62c9d5d09f78 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -1732,6 +1732,7 @@ export default {
             workspaceType: 'Workspace type',
             workspaceAvatar: 'Workspace avatar',
             mustBeOnlineToViewMembers: 'You must be online in order to view members of this workspace.',
+            features: 'Features',
         },
         type: {
             free: 'Free',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index b3a8eef73d7c..96f4bbb710fd 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -1756,6 +1756,7 @@ export default {
             workspaceType: 'Tipo de espacio de trabajo',
             workspaceAvatar: 'Espacio de trabajo avatar',
             mustBeOnlineToViewMembers: 'Debes estar en línea para poder ver los miembros de este espacio de trabajo.',
+            features: 'Características',
         },
         type: {
             free: 'Gratis',

From 042ddb9b5a180b7a2e4d759392f49068f7818fa6 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Wed, 28 Feb 2024 18:17:40 +0100
Subject: [PATCH 039/110] Implement draft page

---
 .../workspace/WorkspaceMoreFeaturesPage.tsx   | 94 +++++++++++++++++++
 1 file changed, 94 insertions(+)
 create mode 100644 src/pages/workspace/WorkspaceMoreFeaturesPage.tsx

diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
new file mode 100644
index 000000000000..8cc6e7ef4670
--- /dev/null
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -0,0 +1,94 @@
+import type {StackScreenProps} from '@react-navigation/stack';
+import React, {useMemo} from 'react';
+import {FlatList, View} from 'react-native';
+import HeaderWithBackButton from '@components/HeaderWithBackButton';
+import * as Illustrations from '@components/Icon/Illustrations';
+import ScreenWrapper from '@components/ScreenWrapper';
+import Text from '@components/Text';
+import WorkspaceEmptyStateSection from '@components/WorkspaceEmptyStateSection';
+import useLocalize from '@hooks/useLocalize';
+import useThemeStyles from '@hooks/useThemeStyles';
+import useWindowDimensions from '@hooks/useWindowDimensions';
+import type {CentralPaneNavigatorParamList} from '@libs/Navigation/types';
+import type SCREENS from '@src/SCREENS';
+import AdminPolicyAccessOrNotFoundWrapper from './AdminPolicyAccessOrNotFoundWrapper';
+import PaidPolicyAccessOrNotFoundWrapper from './PaidPolicyAccessOrNotFoundWrapper';
+import ToggleSettingOptionRow from './workflows/ToggleSettingsOptionRow';
+
+type WorkspaceMoreFeaturesPageProps = StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.CATEGORIES>;
+
+type FeatureForList = {
+    value: string;
+    text: string;
+    keyForList: string;
+    isSelected: boolean;
+};
+
+function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
+    const styles = useThemeStyles();
+    const {isSmallScreenWidth} = useWindowDimensions();
+    const {translate} = useLocalize();
+
+    const featureList = useMemo<FeatureForList[]>(
+        () =>
+            [].map((name, index) => ({
+                // ['Feature 1', 'Feature 2', 'Feature 3'].map((name, index) => ({
+                value: name,
+                text: name,
+                keyForList: name,
+                isSelected: index % 2 === 0,
+            })),
+        [],
+    );
+
+    return (
+        <AdminPolicyAccessOrNotFoundWrapper policyID={route.params.policyID}>
+            <PaidPolicyAccessOrNotFoundWrapper policyID={route.params.policyID}>
+                <ScreenWrapper
+                    includeSafeAreaPaddingBottom={false}
+                    style={[styles.defaultModalContainer]}
+                    testID={WorkspaceMoreFeaturesPage.displayName}
+                    shouldShowOfflineIndicatorInWideScreen
+                >
+                    <HeaderWithBackButton
+                        icon={Illustrations.FolderOpen}
+                        title={translate('workspace.common.features')}
+                        shouldShowBackButton={isSmallScreenWidth}
+                    />
+
+                    <View style={[styles.ph5, styles.pb5]}>
+                        <Text style={[styles.textNormal, styles.colorMuted]}>Page subtitle...</Text>
+                    </View>
+
+                    {featureList.length ? (
+                        <FlatList
+                            style={styles.flex1}
+                            contentContainerStyle={[styles.pl3, styles.pr9]}
+                            keyExtractor={(item) => item.keyForList}
+                            data={featureList}
+                            renderItem={({item}) => (
+                                <ToggleSettingOptionRow
+                                    icon={Illustrations.FolderOpen}
+                                    title={item.text}
+                                    subtitle={item.text}
+                                    onToggle={() => {}}
+                                    isActive={false}
+                                />
+                            )}
+                        />
+                    ) : (
+                        <WorkspaceEmptyStateSection
+                            title="Empty features title"
+                            icon={Illustrations.EmptyStateExpenses}
+                            subtitle="Empty features subtitle"
+                        />
+                    )}
+                </ScreenWrapper>
+            </PaidPolicyAccessOrNotFoundWrapper>
+        </AdminPolicyAccessOrNotFoundWrapper>
+    );
+}
+
+WorkspaceMoreFeaturesPage.displayName = 'WorkspaceMoreFeaturesPage';
+
+export default WorkspaceMoreFeaturesPage;

From f0d0feafd8f0d18cb4a37bd48bac06aa45bf9ba3 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Wed, 28 Feb 2024 18:17:51 +0100
Subject: [PATCH 040/110] connect the page

---
 src/ROUTES.ts                                               | 4 ++++
 src/SCREENS.ts                                              | 1 +
 src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx   | 1 +
 .../CentralPaneNavigator/BaseCentralPaneNavigator.tsx       | 1 +
 .../Navigation/linkingConfig/TAB_TO_CENTRAL_PANE_MAPPING.ts | 1 +
 src/libs/Navigation/linkingConfig/config.ts                 | 3 +++
 src/libs/Navigation/types.ts                                | 3 +++
 src/pages/workspace/WorkspaceInitialPage.tsx                | 6 ++++++
 8 files changed, 20 insertions(+)

diff --git a/src/ROUTES.ts b/src/ROUTES.ts
index 22ebffd52eec..6d0a5b48abe2 100644
--- a/src/ROUTES.ts
+++ b/src/ROUTES.ts
@@ -530,6 +530,10 @@ const ROUTES = {
         route: 'workspace/:policyID/categories/settings',
         getRoute: (policyID: string) => `workspace/${policyID}/categories/settings` as const,
     },
+    WORKSPACE_MORE_FEATURES: {
+        route: 'workspace/:policyID/more-features',
+        getRoute: (policyID: string) => `workspace/${policyID}/more-features` as const,
+    },
 
     // Referral program promotion
     REFERRAL_DETAILS_MODAL: {
diff --git a/src/SCREENS.ts b/src/SCREENS.ts
index ac75968e68b9..c12eede4e23a 100644
--- a/src/SCREENS.ts
+++ b/src/SCREENS.ts
@@ -220,6 +220,7 @@ const SCREENS = {
         SHARE: 'Workspace_Profile_Share',
         NAME: 'Workspace_Profile_Name',
         CATEGORIES_SETTINGS: 'Categories_Settings',
+        MORE_FEATURES: 'More_Features',
     },
 
     EDIT_REQUEST: {
diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
index 3d0144d8cf77..b022f7d886e2 100644
--- a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
+++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
@@ -249,6 +249,7 @@ const SettingsModalStackNavigator = createModalStackNavigator<SettingsNavigatorP
     [SCREENS.WORKSPACE.SHARE]: () => require('../../../pages/workspace/WorkspaceProfileSharePage').default as React.ComponentType,
     [SCREENS.WORKSPACE.CURRENCY]: () => require('../../../pages/workspace/WorkspaceProfileCurrencyPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.CATEGORIES_SETTINGS]: () => require('../../../pages/workspace/categories/WorkspaceCategoriesSettingsPage').default as React.ComponentType,
+    [SCREENS.WORKSPACE.MORE_FEATURES]: () => require('../../../pages/workspace/WorkspaceMoreFeaturesPage').default as React.ComponentType,
     [SCREENS.REIMBURSEMENT_ACCOUNT]: () => require('../../../pages/ReimbursementAccount/ReimbursementAccountPage').default as React.ComponentType,
     [SCREENS.GET_ASSISTANCE]: () => require('../../../pages/GetAssistancePage').default as React.ComponentType,
     [SCREENS.SETTINGS.TWO_FACTOR_AUTH]: () => require('../../../pages/settings/Security/TwoFactorAuth/TwoFactorAuthPage').default as React.ComponentType,
diff --git a/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx b/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx
index 1e5d3639a32f..4dbb049bf9bb 100644
--- a/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx
+++ b/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx
@@ -24,6 +24,7 @@ const workspaceSettingsScreens = {
     [SCREENS.WORKSPACE.TRAVEL]: () => require('../../../../../pages/workspace/travel/WorkspaceTravelPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.MEMBERS]: () => require('../../../../../pages/workspace/WorkspaceMembersPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.CATEGORIES]: () => require('../../../../../pages/workspace/categories/WorkspaceCategoriesPage').default as React.ComponentType,
+    [SCREENS.WORKSPACE.MORE_FEATURES]: () => require('../../../../../pages/workspace/WorkspaceMoreFeaturesPage').default as React.ComponentType,
 } satisfies Screens;
 
 function BaseCentralPaneNavigator() {
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 f4316009b70b..68fe6aa9b227 100755
--- a/src/libs/Navigation/linkingConfig/TAB_TO_CENTRAL_PANE_MAPPING.ts
+++ b/src/libs/Navigation/linkingConfig/TAB_TO_CENTRAL_PANE_MAPPING.ts
@@ -14,6 +14,7 @@ const TAB_TO_CENTRAL_PANE_MAPPING: Record<BottomTabName, CentralPaneName[]> = {
         SCREENS.WORKSPACE.TRAVEL,
         SCREENS.WORKSPACE.MEMBERS,
         SCREENS.WORKSPACE.CATEGORIES,
+        SCREENS.WORKSPACE.MORE_FEATURES,
     ],
 };
 
diff --git a/src/libs/Navigation/linkingConfig/config.ts b/src/libs/Navigation/linkingConfig/config.ts
index 7a6211ebd283..fa685f780017 100644
--- a/src/libs/Navigation/linkingConfig/config.ts
+++ b/src/libs/Navigation/linkingConfig/config.ts
@@ -67,6 +67,9 @@ const config: LinkingOptions<RootStackParamList>['config'] = {
                 [SCREENS.WORKSPACE.CATEGORIES]: {
                     path: ROUTES.WORKSPACE_CATEGORIES.route,
                 },
+                [SCREENS.WORKSPACE.MORE_FEATURES]: {
+                    path: ROUTES.WORKSPACE_MORE_FEATURES.route,
+                },
             },
         },
         [SCREENS.NOT_FOUND]: '*',
diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts
index a997e783deb0..2f38e61c23f3 100644
--- a/src/libs/Navigation/types.ts
+++ b/src/libs/Navigation/types.ts
@@ -81,6 +81,9 @@ type CentralPaneNavigatorParamList = {
     [SCREENS.WORKSPACE.CATEGORIES]: {
         policyID: string;
     };
+    [SCREENS.WORKSPACE.MORE_FEATURES]: {
+        policyID: string;
+    };
 };
 
 type WorkspaceSwitcherNavigatorParamList = {
diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index 571e4cafce74..3b7b770d124b 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -169,6 +169,12 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
             action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_CATEGORIES.getRoute(policyID)))),
             routeName: SCREENS.WORKSPACE.CATEGORIES,
         },
+        {
+            translationKey: 'workspace.common.features',
+            icon: Expensicons.Checkmark,
+            action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_MORE_FEATURES.getRoute(policyID)))),
+            routeName: SCREENS.WORKSPACE.MORE_FEATURES,
+        },
     ];
 
     const menuItems: WorkspaceMenuItem[] = [

From 744cba65080fb47a051821fc324fcd4adf460b5c Mon Sep 17 00:00:00 2001
From: wikuskriek <wikus.kriek.2w@gmail.com>
Date: Thu, 29 Feb 2024 09:51:43 +0200
Subject: [PATCH 041/110] fix: error when you can't hold request

---
 src/languages/en.ts              |  1 +
 src/pages/iou/HoldReasonPage.tsx | 17 ++++++++++++++---
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index 4fa22d8e255d..cf845d2523b2 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -225,6 +225,7 @@ export default {
             acceptTerms: 'You must accept the Terms of Service to continue',
             phoneNumber: `Please enter a valid phone number, with the country code (e.g. ${CONST.EXAMPLE_PHONE_NUMBER})`,
             fieldRequired: 'This field is required.',
+            transactionModified: 'This transaction has been modified',
             characterLimit: ({limit}: CharacterLimitParams) => `Exceeds the maximum length of ${limit} characters`,
             characterLimitExceedCounter: ({length, limit}) => `Character limit exceeded (${length}/${limit})`,
             dateInvalid: 'Please select a valid date',
diff --git a/src/pages/iou/HoldReasonPage.tsx b/src/pages/iou/HoldReasonPage.tsx
index 0e3df33358c0..d9eaee7f22c5 100644
--- a/src/pages/iou/HoldReasonPage.tsx
+++ b/src/pages/iou/HoldReasonPage.tsx
@@ -1,5 +1,5 @@
 import type {RouteProp} from '@react-navigation/native';
-import React, {useCallback} from 'react';
+import React, {useCallback, useEffect} from 'react';
 import {View} from 'react-native';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
@@ -13,9 +13,11 @@ import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@libs/Navigation/Navigation';
 import * as ValidationUtils from '@libs/ValidationUtils';
 import * as IOU from '@userActions/IOU';
-import type ONYXKEYS from '@src/ONYXKEYS';
+import ONYXKEYS from '@src/ONYXKEYS';
 import type {Route} from '@src/ROUTES';
 import INPUT_IDS from '@src/types/form/MoneyRequestHoldReasonForm';
+import * as FormActions from '@userActions/FormActions';
+import * as ReportUtils from '@libs/ReportUtils';
 
 type HoldReasonPageRouteParams = {
     /** ID of the transaction the page was opened for */
@@ -44,6 +46,10 @@ function HoldReasonPage({route}: HoldReasonPageProps) {
     };
 
     const onSubmit = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM>) => {
+        if (!ReportUtils.isReportApproved(reportID) && !ReportUtils.isSettled(reportID)) {
+            FormActions.setErrors(ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM, {reportModified: translate('common.error.transactionModified')});
+            return;
+        }
         IOU.putOnHold(transactionID, values.comment, reportID);
         navigateBack();
     };
@@ -51,13 +57,18 @@ function HoldReasonPage({route}: HoldReasonPageProps) {
     const validate = useCallback((values: FormOnyxValues<typeof ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM>) => {
         const errors: FormInputErrors<typeof ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM> = ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.COMMENT]);
 
-        if (!values.comment) {
+                if (!values.comment) {
             errors.comment = 'common.error.fieldRequired';
         }
 
         return errors;
     }, []);
 
+    useEffect(() => {
+        FormActions.clearErrors(ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM);
+        FormActions.clearErrorFields(ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM);
+    }   , []);
+
     return (
         <ScreenWrapper
             includeSafeAreaPaddingBottom={false}

From 40b868b0865a1f6e02a9c60ffca842f57de8a19a Mon Sep 17 00:00:00 2001
From: wikuskriek <wikus.kriek.2w@gmail.com>
Date: Thu, 29 Feb 2024 09:57:42 +0200
Subject: [PATCH 042/110] fix: format

---
 src/pages/iou/HoldReasonPage.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/pages/iou/HoldReasonPage.tsx b/src/pages/iou/HoldReasonPage.tsx
index d9eaee7f22c5..11c3378b3ec9 100644
--- a/src/pages/iou/HoldReasonPage.tsx
+++ b/src/pages/iou/HoldReasonPage.tsx
@@ -11,13 +11,13 @@ import TextInput from '@components/TextInput';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@libs/Navigation/Navigation';
+import * as ReportUtils from '@libs/ReportUtils';
 import * as ValidationUtils from '@libs/ValidationUtils';
+import * as FormActions from '@userActions/FormActions';
 import * as IOU from '@userActions/IOU';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type {Route} from '@src/ROUTES';
 import INPUT_IDS from '@src/types/form/MoneyRequestHoldReasonForm';
-import * as FormActions from '@userActions/FormActions';
-import * as ReportUtils from '@libs/ReportUtils';
 
 type HoldReasonPageRouteParams = {
     /** ID of the transaction the page was opened for */
@@ -57,7 +57,7 @@ function HoldReasonPage({route}: HoldReasonPageProps) {
     const validate = useCallback((values: FormOnyxValues<typeof ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM>) => {
         const errors: FormInputErrors<typeof ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM> = ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.COMMENT]);
 
-                if (!values.comment) {
+        if (!values.comment) {
             errors.comment = 'common.error.fieldRequired';
         }
 
@@ -67,7 +67,7 @@ function HoldReasonPage({route}: HoldReasonPageProps) {
     useEffect(() => {
         FormActions.clearErrors(ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM);
         FormActions.clearErrorFields(ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM);
-    }   , []);
+    }, []);
 
     return (
         <ScreenWrapper

From f46fa4fcef884088fb99602b850423ee74196e2e Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 29 Feb 2024 10:47:03 +0100
Subject: [PATCH 043/110] update strings

---
 src/languages/en.ts                               | 2 +-
 src/languages/es.ts                               | 2 +-
 src/pages/workspace/WorkspaceInitialPage.tsx      | 2 +-
 src/pages/workspace/WorkspaceMoreFeaturesPage.tsx | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index 2a279b1cf376..a1019c70c22b 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -1732,7 +1732,7 @@ export default {
             workspaceType: 'Workspace type',
             workspaceAvatar: 'Workspace avatar',
             mustBeOnlineToViewMembers: 'You must be online in order to view members of this workspace.',
-            features: 'Features',
+            moreFeatures: 'More features',
         },
         type: {
             free: 'Free',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 8a16b740e1ae..6749c0690de9 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -1756,7 +1756,7 @@ export default {
             workspaceType: 'Tipo de espacio de trabajo',
             workspaceAvatar: 'Espacio de trabajo avatar',
             mustBeOnlineToViewMembers: 'Debes estar en línea para poder ver los miembros de este espacio de trabajo.',
-            features: 'Características',
+            moreFeatures: 'Más características',
         },
         type: {
             free: 'Gratis',
diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index 3b7b770d124b..4ad8d1936aee 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -170,7 +170,7 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
             routeName: SCREENS.WORKSPACE.CATEGORIES,
         },
         {
-            translationKey: 'workspace.common.features',
+            translationKey: 'workspace.common.moreFeatures',
             icon: Expensicons.Checkmark,
             action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_MORE_FEATURES.getRoute(policyID)))),
             routeName: SCREENS.WORKSPACE.MORE_FEATURES,
diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index 8cc6e7ef4670..f036ec60f077 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -52,7 +52,7 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                 >
                     <HeaderWithBackButton
                         icon={Illustrations.FolderOpen}
-                        title={translate('workspace.common.features')}
+                        title={translate('workspace.common.moreFeatures')}
                         shouldShowBackButton={isSmallScreenWidth}
                     />
 

From 723d90d2f7c206bb66800d5fb94a7dd42e34dcfd Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Thu, 29 Feb 2024 12:32:46 +0100
Subject: [PATCH 044/110] Fix TS errors in the updated code

---
 .../ComposerWithSuggestions/ComposerWithSuggestions.tsx      | 2 +-
 src/pages/home/report/ReportActionsList.tsx                  | 3 ++-
 src/pages/home/report/ReportActionsListItemRenderer.tsx      | 3 ++-
 src/pages/home/report/ReportActionsView.tsx                  | 5 +++--
 4 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions/ComposerWithSuggestions.tsx b/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions/ComposerWithSuggestions.tsx
index af2d0b9eab56..6bbe5b10802f 100644
--- a/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions/ComposerWithSuggestions.tsx
+++ b/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions/ComposerWithSuggestions.tsx
@@ -159,7 +159,7 @@ type ComposerWithSuggestionsProps = ComposerWithSuggestionsOnyxProps &
         isEmptyChat?: boolean;
 
         /** The last report action */
-        lastReportAction?: OnyxTypes.ReportAction;
+        lastReportAction?: OnyxEntry<OnyxTypes.ReportAction>;
 
         /** Whether to include chronos */
         includeChronos?: boolean;
diff --git a/src/pages/home/report/ReportActionsList.tsx b/src/pages/home/report/ReportActionsList.tsx
index caf8c60ee0f1..04c99de565fc 100644
--- a/src/pages/home/report/ReportActionsList.tsx
+++ b/src/pages/home/report/ReportActionsList.tsx
@@ -5,6 +5,7 @@ import type {DebouncedFunc} from 'lodash';
 import React, {memo, useCallback, useEffect, useMemo, useRef, useState} from 'react';
 import {DeviceEventEmitter, InteractionManager} from 'react-native';
 import type {LayoutChangeEvent, NativeScrollEvent, NativeSyntheticEvent, StyleProp, ViewStyle} from 'react-native';
+import type {OnyxEntry} from 'react-native-onyx';
 import Animated, {useAnimatedStyle, useSharedValue, withTiming} from 'react-native-reanimated';
 import InvertedFlatList from '@components/InvertedFlatList';
 import {usePersonalDetails} from '@components/OnyxProvider';
@@ -37,7 +38,7 @@ type ReportActionsListProps = WithCurrentUserPersonalDetailsProps & {
     report: OnyxTypes.Report;
 
     /** The report's parentReportAction */
-    parentReportAction: PropTypes.shape(reportActionPropTypes),
+    parentReportAction: OnyxEntry<OnyxTypes.ReportAction>;
 
     /** Sorted actions prepared for display */
     sortedReportActions: OnyxTypes.ReportAction[];
diff --git a/src/pages/home/report/ReportActionsListItemRenderer.tsx b/src/pages/home/report/ReportActionsListItemRenderer.tsx
index 3195d9531c84..b4ea6fc5da86 100644
--- a/src/pages/home/report/ReportActionsListItemRenderer.tsx
+++ b/src/pages/home/report/ReportActionsListItemRenderer.tsx
@@ -1,4 +1,5 @@
 import React, {memo, useMemo} from 'react';
+import type {OnyxEntry} from 'react-native-onyx';
 import * as ReportActionsUtils from '@libs/ReportActionsUtils';
 import * as ReportUtils from '@libs/ReportUtils';
 import CONST from '@src/CONST';
@@ -11,7 +12,7 @@ type ReportActionsListItemRendererProps = {
     reportAction: ReportAction;
 
     /** The report's parentReportAction */
-    parentReportAction: PropTypes.shape(reportActionPropTypes),
+    parentReportAction: OnyxEntry<ReportAction>;
 
     /** Position index of the report action in the overall report FlatList view */
     index: number;
diff --git a/src/pages/home/report/ReportActionsView.tsx b/src/pages/home/report/ReportActionsView.tsx
index ae88f3457cb9..9e7d5540ca6a 100755
--- a/src/pages/home/report/ReportActionsView.tsx
+++ b/src/pages/home/report/ReportActionsView.tsx
@@ -38,7 +38,7 @@ type ReportActionsViewProps = ReportActionsViewOnyxProps & {
     reportActions?: OnyxTypes.ReportAction[];
 
     /** The report's parentReportAction */
-    parentReportAction: PropTypes.shape(reportActionPropTypes),
+    parentReportAction: OnyxEntry<OnyxTypes.ReportAction>;
 
     /** The report metadata loading states */
     isLoadingInitialReportActions?: boolean;
@@ -53,6 +53,7 @@ type ReportActionsViewProps = ReportActionsViewOnyxProps & {
 function ReportActionsView({
     report,
     session,
+    parentReportAction,
     reportActions = [],
     isLoadingInitialReportActions = false,
     isLoadingOlderReportActions = false,
@@ -230,7 +231,7 @@ function ReportActionsView({
         <>
             <ReportActionsList
                 report={report}
-                parentReportAction={props.parentReportAction}
+                parentReportAction={parentReportAction}
                 onLayout={recordTimeToMeasureItemLayout}
                 sortedReportActions={reportActions}
                 mostRecentIOUReportActionID={mostRecentIOUReportActionID}

From a00866aacf877a04a23dfd522e00d811032f39e0 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 29 Feb 2024 16:44:08 +0100
Subject: [PATCH 045/110] add icons

---
 .../simple-illustration__accounting.svg       | 32 +++++++++++++++++++
 .../simple-illustration__car.svg              | 25 +++++++++++++++
 .../simple-illustration__coins.svg            | 26 +++++++++++++++
 .../simple-illustration__pencil.svg           | 20 ++++++++++++
 .../simple-illustration__tag.svg              | 15 +++++++++
 src/components/Icon/Illustrations.ts          | 10 ++++++
 6 files changed, 128 insertions(+)
 create mode 100644 assets/images/simple-illustrations/simple-illustration__accounting.svg
 create mode 100644 assets/images/simple-illustrations/simple-illustration__car.svg
 create mode 100644 assets/images/simple-illustrations/simple-illustration__coins.svg
 create mode 100644 assets/images/simple-illustrations/simple-illustration__pencil.svg
 create mode 100644 assets/images/simple-illustrations/simple-illustration__tag.svg

diff --git a/assets/images/simple-illustrations/simple-illustration__accounting.svg b/assets/images/simple-illustrations/simple-illustration__accounting.svg
new file mode 100644
index 000000000000..f7634141e966
--- /dev/null
+++ b/assets/images/simple-illustrations/simple-illustration__accounting.svg
@@ -0,0 +1,32 @@
+<?xml version="1.0" encoding="utf-8"?><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 68 68" style="enable-background:new 0 0 68 68;" xml:space="preserve"><style type="text/css">
+	.st0{fill:#4ED7DE;}
+	.st1{fill:#D18000;}
+	.st2{fill:#FFFAF0;}
+	.st3{fill:#002140;}
+	.st4{fill:none;stroke:#002140;stroke-width:0.8571;stroke-linecap:round;stroke-linejoin:round;}
+</style><path class="st0" d="M39.716,9.121V9h9.284c3.815-0.188,6.111,2.239,6.111,6.109v32.697c0,1.959-0.589,3.548-1.665,4.615
+	L53.41,52.46c-1.047,1.017-2.548,1.549-4.409,1.457H29.697c-3.813,0.188-6.109-2.239-6.109-6.109V15.109
+	c0-1.816,0.505-3.313,1.44-4.372c0.51-0.584,1.146-1.032,1.9-1.329c0.587-0.232,1.24-0.369,1.96-0.406
+	C29.148,8.987,29.42,8.987,29.697,9h0.651"/><path class="st1" d="M33.616,9h-0.651c-0.277-0.013-0.549-0.013-0.809,0.002c-0.72,0.037-0.527-0.255-1.113-0.022l-0.905,0.2V8.085
+	c0-2.207,1.393-3.263,3.593-3.263h5.659c2.202,0,3.593,1.056,3.593,3.263v9.882c0,0.784-0.696,1.264-1.393,0.696l-2.244-2.039
+	c-0.802-0.74-1.314-0.74-2.095,0l-2.247,2.039c-0.697,0.567-1.393,0.087-1.393-0.696V9H33.616z"/><path class="st2" d="M23.588,47.806c0,3.872,2.298,6.299,6.109,6.109h19.304c1.861,0.092,3.362-0.44,4.409-1.457l-5.127,5.127
+	c-1.046,0.98-2.526,1.492-4.352,1.401H24.627c-3.615,0.178-5.869-1.994-6.092-5.523c-0.012-0.191-0.018-0.386-0.018-0.587v-6.827
+	h5.072v1.755V47.806z"/><path class="st2" d="M47.005,23.096c1.349,0,1.839,0.634,1.839,1.838v8.655c0,1.203-0.492,1.841-1.839,1.841H34.185
+	c-1.349,0-1.839-0.638-1.839-1.841v-8.655c0-1.203,0.492-1.838,1.839-1.838H47.005z"/><path class="st3" d="M25.684,17.441c0.352-0.587,0.995-0.982,1.73-0.982c1.114,0,2.017,0.903,2.017,2.017
+	c0,1.114-0.903,2.014-2.017,2.014c-0.735,0-1.378-0.391-1.73-0.982h0.698c0.572,0,1.032-0.465,1.032-1.032
+	c0-0.567-0.462-1.034-1.032-1.034h-0.698V17.441z"/><path class="st3" d="M25.684,30.656c0.352-0.589,0.995-0.982,1.73-0.982c1.114,0,2.017,0.903,2.017,2.017
+	c0,1.114-0.903,2.014-2.017,2.014c-0.725,0-1.358-0.379-1.712-0.953h0.68c0.572,0,1.032-0.465,1.032-1.034
+	c0-0.569-0.462-1.032-1.032-1.032h-0.698V30.656z"/><path class="st3" d="M25.684,43.984c0.352-0.589,0.995-0.982,1.73-0.982c1.114,0,2.017,0.903,2.017,2.016
+	c0,1.113-0.903,2.016-2.017,2.016c-0.735,0-1.378-0.393-1.73-0.982h0.698c0.572,0,1.032-0.465,1.032-1.034
+	c0-0.569-0.462-1.032-1.032-1.032h-0.698V43.984z"/><path class="st3" d="M27.226,17.441c0.572,0,1.032,0.463,1.032,1.034c0,0.571-0.462,1.032-1.032,1.032h-8.71
+	c-2.586,0-3.765,1.386-3.765,2.675c0,1.289,1.177,2.675,3.765,2.675v2.066c-3.828,0-5.831-2.386-5.831-4.743
+	c0-2.356,2.002-4.743,5.831-4.743h8.71V17.441z"/><path class="st3" d="M27.226,30.685c0.572,0,1.032,0.463,1.032,1.032c0,0.569-0.462,1.034-1.032,1.034h-8.71
+	c-2.586,0-3.765,1.386-3.765,2.674c0,1.287,1.177,2.677,3.765,2.677v2.064c-3.828,0-5.831-2.385-5.831-4.743
+	c0-2.358,2.002-4.741,5.831-4.741h8.71V30.685z"/><path class="st2" d="M25.028,10.736c-0.935,1.059-1.44,2.556-1.44,4.372v2.333h-4.55v-0.138c0.193-0.473,0.44-0.898,0.733-1.279
+	l0.109-0.131l5.144-5.159h0.003V10.736z"/><path class="st2" d="M23.588,32.752v11.233h-5.072v-3.817v-2.064v-5.352H23.588z"/><path class="st2" d="M23.588,19.51v11.176h-5.072V20.181c0-0.174,0.007-0.347,0.015-0.515v-0.158h5.057V19.51z"/><path class="st3" d="M27.226,43.984c0.572,0,1.032,0.463,1.032,1.032c0,0.569-0.462,1.034-1.032,1.034h-8.71
+	c-2.586,0-3.765,1.386-3.765,2.674c0,1.287,1.177,2.677,3.765,2.677v1.477c0,0.2,0.007,0.394,0.018,0.587l-0.018,0.003
+	c-3.828,0-5.831-2.387-5.831-4.744c0-2.358,2.002-4.741,5.831-4.741h8.71V43.984z"/><path class="st4" d="M55.113,15.109v32.697"/><path class="st4" d="M55.113,15.108c0-3.872-2.298-6.299-6.111-6.109"/><path class="st4" d="M23.588,46.051v1.756"/><path class="st4" d="M23.588,32.752v11.233"/><path class="st4" d="M23.588,19.51v11.176"/><path class="st4" d="M23.588,15.109v2.333"/><path class="st4" d="M23.588,15.109c0-1.816,0.505-3.313,1.44-4.372c0.51-0.584,1.146-1.032,1.9-1.329
+	c0.587-0.232,1.24-0.369,1.96-0.406C29.148,8.987,29.42,8.987,29.697,9"/><path class="st4" d="M29.698,9h3.847"/><path class="st4" d="M43.25,9h5.752"/><path class="st4" d="M53.411,52.461c-1.047,1.017-2.548,1.549-4.409,1.457"/><path class="st4" d="M55.113,47.807c0,1.959-0.589,3.548-1.665,4.615"/><path class="st4" d="M23.588,47.807c0,3.872,2.298,6.299,6.109,6.109"/><path class="st4" d="M29.698,53.916h19.304"/><path class="st4" d="M18.516,20.18v4.679v2.066v3.759"/><path class="st4" d="M18.516,32.752v5.352v2.064v3.817"/><path class="st4" d="M18.516,46.051v5.352v1.477"/><path class="st4" d="M19.038,17.304c0.193-0.473,0.44-0.898,0.733-1.279"/><path class="st4" d="M18.516,20.181c0-0.175,0.007-0.347,0.015-0.515"/><path class="st4" d="M48.285,57.584c-1.046,0.982-2.526,1.494-4.352,1.403"/><path class="st4" d="M18.516,52.879c0,0.2,0.007,0.394,0.018,0.587c0.223,3.528,2.477,5.701,6.092,5.523"/><path class="st4" d="M24.627,58.988h19.304"/><path class="st4" d="M19.881,15.894l5.144-5.159"/><path class="st4" d="M48.284,57.588l5.127-5.127l0.037-0.039"/><path class="st4" d="M32.345,24.934c0-1.203,0.492-1.838,1.839-1.838"/><path class="st4" d="M48.845,24.934c0-1.203-0.492-1.838-1.839-1.838"/><path class="st4" d="M32.345,24.934v8.655"/><path class="st4" d="M34.185,23.096h12.821"/><path class="st4" d="M32.345,33.586c0,1.203,0.492,1.841,1.839,1.841"/><path class="st4" d="M48.845,33.586c0,1.203-0.492,1.841-1.839,1.841"/><path class="st4" d="M34.185,35.43h12.821"/><path class="st4" d="M48.845,24.934v8.655"/><path class="st4" d="M18.516,17.441h7.323c0.572,0,1.032,0.463,1.032,1.034c0,0.571-0.462,1.032-1.032,1.032h-7.323"/><path class="st4" d="M18.516,19.51c-2.586,0-3.764,1.386-3.764,2.675s1.176,2.675,3.764,2.675"/><path class="st4" d="M18.516,26.925c-3.828,0-5.831-2.387-5.831-4.743c0-2.356,2.002-4.743,5.831-4.743"/><path class="st4" d="M18.516,30.685h7.323c0.572,0,1.032,0.463,1.032,1.032c0,0.569-0.462,1.034-1.032,1.034h-7.323"/><path class="st4" d="M18.516,32.752c-2.586,0-3.764,1.386-3.764,2.674s1.176,2.677,3.764,2.677"/><path class="st4" d="M18.516,40.168c-3.828,0-5.831-2.385-5.831-4.743c0-2.358,2.002-4.741,5.831-4.741"/><path class="st4" d="M18.516,43.984h7.323c0.572,0,1.032,0.463,1.032,1.032c0,0.569-0.462,1.034-1.032,1.034h-7.323"/><path class="st4" d="M18.516,46.051c-2.586,0-3.764,1.386-3.764,2.674c0,1.287,1.176,2.677,3.764,2.677"/><path class="st4" d="M18.516,53.468c-3.828,0-5.831-2.387-5.831-4.744c0-2.358,2.002-4.741,5.831-4.741"/><path class="st4" d="M25.684,17.441c0.352-0.587,0.995-0.982,1.73-0.982c1.114,0,2.017,0.903,2.017,2.017
+	c0,1.114-0.903,2.014-2.017,2.014c-0.735,0-1.378-0.391-1.73-0.982"/><path class="st4" d="M25.684,30.656c0.352-0.589,0.995-0.982,1.73-0.982c1.114,0,2.017,0.903,2.017,2.017
+	c0,1.114-0.903,2.014-2.017,2.014c-0.725,0-1.358-0.379-1.712-0.953c-0.008-0.01-0.013-0.02-0.018-0.029"/><path class="st4" d="M25.684,43.984c0.352-0.589,0.995-0.982,1.73-0.982c1.114,0,2.017,0.903,2.017,2.016
+	c0,1.113-0.903,2.016-2.017,2.016c-0.735,0-1.378-0.393-1.73-0.982"/><path class="st4" d="M33.616,8.084V9v0.121v8.845"/><path class="st4" d="M35.009,18.662l2.246-2.041"/><path class="st4" d="M35.009,18.661c-0.697,0.567-1.393,0.087-1.393-0.697"/><path class="st4" d="M42.984,8.084V9v0.121v8.845"/><path class="st4" d="M41.591,18.662l-2.242-2.041"/><path class="st4" d="M41.592,18.661c0.697,0.567,1.393,0.087,1.393-0.697"/><path class="st4" d="M37.254,16.62c0.78-0.74,1.292-0.74,2.095,0"/><path class="st4" d="M42.984,8.083c0-2.207-1.393-3.263-3.593-3.263"/><path class="st4" d="M30.063,8.897c0-3.348,1.467-4.077,3.669-4.077"/><path class="st4" d="M39.391,4.82h-5.659"/></svg>
diff --git a/assets/images/simple-illustrations/simple-illustration__car.svg b/assets/images/simple-illustrations/simple-illustration__car.svg
new file mode 100644
index 000000000000..2d420be6c3a9
--- /dev/null
+++ b/assets/images/simple-illustrations/simple-illustration__car.svg
@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="utf-8"?><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 68 68" style="enable-background:new 0 0 68 68;" xml:space="preserve"><style type="text/css">
+	.st0{fill:#4ED7DE;}
+	.st1{fill:#4BA6A6;}
+	.st2{fill:#28736D;}
+	.st3{fill:#FFED8F;}
+	.st4{fill:none;stroke:#002140;stroke-width:0.8571;stroke-linecap:round;stroke-linejoin:round;}
+</style><path class="st0" d="M49.708,27.953c0,0-3.324-9.358-5.152-9.753c-1.828-0.395-11.801-2.123-20.018-0.156
+	c0,0-3.065,2.99-4.107,5.504c-1.042,2.517-1.564,4.484-1.564,4.484s-3.52,2.123-4.565,5.504c-1.042,3.381-0.391,11.247-0.391,11.247
+	s0.846,0.786,2.414,1.259c1.568,0.473,6.066,1.102,8.15,1.102s23.151-0.157,23.151-0.157l6.389-1.572c0,0,0.914-1.337,0.978-2.279
+	c0.064-0.942-0.26-8.494-0.26-8.494s-0.846-2.752-1.5-3.46c-0.654-0.708-3.52-3.225-3.52-3.225L49.708,27.953z"/><path class="st1" d="M18.931,27.563l-1.109-2.752l-2.478,0.708l-0.391,1.415l1.305,0.786L18.931,27.563z"/><path class="st1" d="M50.035,27.717l4.107-0.473v-1.021l-0.782-1.102l-2.542-0.235L50.035,27.717z"/><path class="st2" d="M23.496,46.751l21.974,0.078l-2.087-1.888H24.865L23.496,46.751z"/><path class="st2" d="M15.475,46.045l0.914,3.616l1.301,0.868l4.37-0.316l0.914-1.259l0.523-2.201L15.475,46.045z"/><path class="st2" d="M45.601,47.304l0.519,2.436l1.177,0.868l4.889-0.078l1.042-1.415l0.327-3.147l-8.086,0.864"/><path class="st3" d="M20.754,34.404l-2.997-2.044l-1.045,0.942l-0.26,2.283l0.978,1.02l3.129,1.259l1.305-1.099L20.754,34.404z"/><path class="st3" d="M51.6,32.514l-0.914-0.469l-2.87,2.279l-0.846,2.044l0.523,0.864l1.693-0.156l3.001-1.65L51.6,32.514z"/><path class="st3" d="M22.319,27.324l0.914,0.629h22.76l0.391-1.024l-3.001-6.294c0,0-5.479-1.181-9.977-1.024
+	c-4.498,0.156-8.477,1.102-8.477,1.102l-2.61,6.606V27.324z"/><path class="st4" d="M44.265,18.161c-4.27-1.376-13.728-1.849-20.05,0"/><path class="st4" d="M24.21,18.16c0,0-2.837,1.653-5.085,9.675c0,0-5.38,2.83-5.38,8.612c0,0-0.391,3.893,19.759,3.893
+	s21.423-3.776,21.423-3.776c0-5.782-5.38-8.612-5.38-8.612c-2.251-8.021-5.085-9.675-5.085-9.675"/><path class="st4" d="M13.747,36.447v6.923c0,1.241,0.757,2.29,1.774,2.468l6.23,1.074c0.572,0.1,1.152-0.096,1.6-0.537l0.878-0.868
+	c0.37-0.363,0.832-0.562,1.309-0.562h9.241"/><path class="st4" d="M54.906,36.434v6.923c0,1.241-0.757,2.29-1.774,2.468l-6.229,1.074c-0.573,0.099-1.152-0.096-1.6-0.537
+	l-0.878-0.868c-0.37-0.363-0.832-0.562-1.308-0.562h-9.241"/><path class="st4" d="M22.433,46.891l23.787-0.014"/><path class="st4" d="M15.521,45.838l0.412,2.667c0.178,1.148,1.01,1.984,1.981,1.984h3.264c0.946,0,1.764-0.793,1.966-1.906
+	l0.288-1.575"/><path class="st4" d="M53.505,46.016l-0.412,2.667c-0.178,1.148-1.01,1.984-1.981,1.984h-3.264c-0.946,0-1.764-0.793-1.966-1.906
+	l-0.288-1.575"/><path class="st4" d="M18.88,27.836l-0.544-2.35c-0.103-0.441-0.462-0.722-0.839-0.651l-1.888,0.356
+	c-0.245,0.046-0.455,0.235-0.562,0.508l-0.242,0.622c-0.228,0.579,0.107,1.252,0.636,1.287l3.438,0.231"/><path class="st4" d="M49.946,27.719l0.544-2.35c0.103-0.441,0.462-0.722,0.839-0.651l1.888,0.356
+	c0.245,0.046,0.455,0.235,0.562,0.508l0.242,0.622c0.228,0.58-0.107,1.252-0.636,1.287l-3.438,0.231"/><path class="st4" d="M16.833,33.047l-0.501,1.728c-0.185,0.633,0.092,1.323,0.615,1.547l2.869,1.223
+	c0.128,0.053,0.263,0.085,0.398,0.085l0.533,0.011c0.853,0.018,1.337-1.173,0.8-1.973l-0.764-1.145
+	c-0.06-0.092-0.135-0.174-0.217-0.242l-2.219-1.835c-0.548-0.452-1.298-0.156-1.518,0.597L16.833,33.047z"/><path class="st4" d="M51.678,32.811l0.501,1.728c0.185,0.633-0.092,1.323-0.615,1.547l-2.869,1.223
+	c-0.128,0.053-0.263,0.085-0.398,0.085l-0.533,0.011c-0.853,0.018-1.337-1.173-0.8-1.973l0.764-1.145
+	c0.06-0.093,0.135-0.174,0.217-0.242l2.219-1.835c0.548-0.452,1.298-0.157,1.518,0.597L51.678,32.811z"/><path class="st4" d="M45.53,28.111H23.197c-0.576,0-0.956-0.672-0.715-1.259l2.4-5.856c0.103-0.249,0.295-0.43,0.533-0.491
+	c1.589-0.42,8.118-1.852,17.668,0.028c0.245,0.05,0.459,0.228,0.569,0.48l2.581,5.817c0.263,0.59-0.117,1.284-0.704,1.284V28.111z"
+	/><path class="st4" d="M25.843,35.819c-0.686,0-3.065-0.395-3.324-3.069c-0.26-2.674-0.103-5.643-0.103-5.643"/><path class="st4" d="M42.71,35.778c0.722,0,3.221-0.395,3.499-3.069c0.277-2.674,0.107-5.643,0.107-5.643"/><path class="st4" d="M42.711,35.779c0,0-16.185,0.039-16.868,0.039"/></svg>
diff --git a/assets/images/simple-illustrations/simple-illustration__coins.svg b/assets/images/simple-illustrations/simple-illustration__coins.svg
new file mode 100644
index 000000000000..5350886402c6
--- /dev/null
+++ b/assets/images/simple-illustrations/simple-illustration__coins.svg
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="utf-8"?><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 68 68" style="enable-background:new 0 0 68 68;" xml:space="preserve"><style type="text/css">
+	.st0{fill:#FED607;}
+	.st1{fill:#D18000;}
+	.st2{fill:none;stroke:#002140;stroke-width:0.9999;stroke-linecap:round;stroke-linejoin:round;}
+	.st3{fill:none;stroke:#D18000;stroke-width:0.9999;stroke-miterlimit:10;}
+	.st4{fill:#FFED8F;}
+</style><path class="st0" d="M10.957,45.597c0,0,2.703,5.551,21.067,4.98c18.364-0.57,20.496-4.127,20.496-5.268
+	c0-1.141-8.399-4.98-19.501-4.839c-11.102,0.142-21.633,1.424-22.062,5.122V45.597z"/><path class="st1" d="M11.24,46.592v6.121c0,0,7.687,4.127,21.491,4.127c13.804,0,19.926-4.414,19.926-4.414v-6.121
+	c0,0-6.405,4.839-20.638,4.268S12.951,47.729,11.24,46.592z"/><path class="st2" d="M31.882,50.336c11.476,0,20.779-2.166,20.779-4.839c0-2.672-9.303-4.839-20.779-4.839
+	s-20.779,2.166-20.779,4.839C11.103,48.169,20.406,50.336,31.882,50.336z"/><path class="st2" d="M11.099,45.498v6.357c0,2.673,9.304,4.839,20.779,4.839c11.475,0,20.779-2.166,20.779-4.839v-6.357"/><path class="st3" d="M31.976,46.922c4.402,0,7.97-0.718,7.97-1.604c0-0.886-3.568-1.604-7.97-1.604c-4.402,0-7.97,0.718-7.97,1.604
+	C24.006,46.203,27.574,46.922,31.976,46.922z"/><path class="st0" d="M16.367,35.819c0,0,2.702,5.551,21.066,4.98c18.364-0.571,20.496-4.127,20.496-5.268
+	c0-1.141-8.399-4.98-19.501-4.839c-11.102,0.142-21.633,1.424-22.062,5.122V35.819z"/><path class="st1" d="M16.649,36.819v6.121c0,0,7.687,4.127,21.491,4.127c13.804,0,19.926-4.414,19.926-4.414v-6.121
+	c0,0-6.404,4.839-20.638,4.268c-14.233-0.57-19.072-2.848-20.779-3.985V36.819z"/><path class="st2" d="M37.286,40.564c11.476,0,20.779-2.166,20.779-4.839c0-2.672-9.303-4.839-20.779-4.839
+	s-20.779,2.166-20.779,4.839C16.507,38.398,25.81,40.564,37.286,40.564z"/><path class="st2" d="M16.507,35.725v6.357c0,2.672,9.304,4.839,20.779,4.839c11.475,0,20.779-2.166,20.779-4.839v-6.357"/><path class="st3" d="M37.381,37.15c4.402,0,7.97-0.718,7.97-1.604c0-0.886-3.568-1.604-7.97-1.604s-7.97,0.718-7.97,1.604
+	C29.41,36.432,32.979,37.15,37.381,37.15z"/><path class="st0" d="M10.721,26.941c0,0,2.702,5.551,21.067,4.98c18.364-0.57,20.496-4.127,20.496-5.268
+	c0-1.141-8.399-4.98-19.501-4.839c-11.102,0.142-21.633,1.424-22.062,5.122V26.941z"/><path class="st1" d="M11.003,27.936v6.121c0,0,7.687,4.127,21.491,4.127c13.804,0,19.926-4.414,19.926-4.414v-6.121
+	c0,0-6.404,4.839-20.638,4.268C17.549,31.346,12.711,29.077,11.003,27.936z"/><path class="st2" d="M31.642,31.685c11.476,0,20.779-2.166,20.779-4.839c0-2.672-9.303-4.839-20.779-4.839
+	s-20.779,2.166-20.779,4.839C10.863,29.519,20.166,31.685,31.642,31.685z"/><path class="st2" d="M10.863,26.846v6.357c0,2.673,9.304,4.839,20.779,4.839c11.475,0,20.779-2.166,20.779-4.839v-6.357"/><path class="st3" d="M31.736,28.265c4.402,0,7.97-0.718,7.97-1.604c0-0.886-3.568-1.604-7.97-1.604s-7.97,0.718-7.97,1.604
+	C23.766,27.547,27.334,28.265,31.736,28.265z"/><path class="st0" d="M16.178,17.13c0,0,2.703,5.551,21.066,4.98c18.364-0.57,20.496-4.127,20.496-5.268
+	c0-1.141-8.399-4.98-19.501-4.839c-11.102,0.142-21.633,1.424-22.062,5.122V17.13z"/><path class="st4" d="M17.718,15.426c1.78,1.253,4.131,1.377,6.284,1.055c2.153-0.322,4.234-1.038,6.396-1.304
+	c2.497-0.309,5.027-0.009,7.545-0.009c1.017,0,2.068-0.06,2.973-0.523c0.905-0.463,1.617-1.437,1.484-2.441
+	c0,0-7.618-0.27-13.431,0.172c-5.812,0.442-11.248,3.054-11.248,3.054L17.718,15.426z"/><path class="st1" d="M16.461,18.125v6.121c0,0,7.687,4.127,21.491,4.127c13.804,0,19.925-4.414,19.925-4.414v-6.121
+	c0,0-6.404,4.839-20.638,4.268s-19.072-2.848-20.779-3.985V18.125z"/><path class="st2" d="M37.098,21.875c11.476,0,20.779-2.166,20.779-4.839s-9.303-4.839-20.779-4.839s-20.779,2.166-20.779,4.839
+	S25.622,21.875,37.098,21.875z"/><path class="st2" d="M16.319,17.035v6.357c0,2.672,9.304,4.839,20.779,4.839c11.475,0,20.779-2.166,20.779-4.839v-6.357"/><path class="st3" d="M37.193,18.455c4.402,0,7.97-0.718,7.97-1.604c0-0.886-3.568-1.604-7.97-1.604s-7.97,0.718-7.97,1.604
+	C29.223,17.736,32.791,18.455,37.193,18.455z"/></svg>
diff --git a/assets/images/simple-illustrations/simple-illustration__pencil.svg b/assets/images/simple-illustrations/simple-illustration__pencil.svg
new file mode 100644
index 000000000000..8d9f06991612
--- /dev/null
+++ b/assets/images/simple-illustrations/simple-illustration__pencil.svg
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?><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 68 68" style="enable-background:new 0 0 68 68;" xml:space="preserve"><style type="text/css">
+	.st0{fill:#8DC8FF;}
+	.st1{fill:#002140;}
+	.st2{fill:#FFC68C;}
+	.st3{fill:#FED607;}
+	.st4{fill:#F9B5FE;}
+	.st5{fill:none;stroke:#002140;stroke-linecap:round;stroke-linejoin:round;}
+	.st6{fill:none;stroke:#003C73;stroke-linecap:round;stroke-linejoin:round;}
+</style><path class="st0" d="M52.266,26.492c0.472,0.849,0.244,1.659-0.657,2.611l0.02,0.02l-2.422,2.41c-0.778,0.617-1.423,0.523-1.982,0
+	c1.046-1.14,0.672-2.115-0.531-3.255l-0.393-0.393l-3.071-3.071l-3.071-3.071l-1.046-1.05c-1.03-1.089-1.978-0.955-2.811-0.09
+	c-0.405-0.704-0.491-1.368,0-1.946l2.811-2.878c0.743-0.684,1.561-0.684,2.265-0.252c0.118,0.071,0.232,0.157,0.342,0.252
+	l9.892,9.892c0.287,0.283,0.503,0.554,0.657,0.818L52.266,26.492z"/><path class="st1" d="M24.398,47.271l-2.347,0.157c-0.495,0.028-0.849,0-1.097-0.126l-0.212-0.169h-0.004
+	c-0.212-0.252-0.275-0.68-0.244-1.368l0.142-2.316c1.258,1.007,2.508,2.28,3.763,3.818V47.271z"/><path class="st2" d="M28.389,42.961l3.424-0.59l0.059,4.227c-0.393,0.157-0.841,0.236-1.317,0.259l-6.157,0.413
+	c-1.254-1.537-2.504-2.811-3.763-3.818l0.377-6.137c0.055-0.818,0.153-1.238,0.397-1.655l4.262,0.57l-0.605,3.255l3.676-0.185
+	l-0.358,3.653v0.008H28.389z"/><path class="st3" d="M21.811,35.093L36.3,20.605c0.833-0.869,1.781-0.999,2.811,0.09l1.046,1.05L25.672,36.229l-4.262-0.57
+	C21.517,35.479,21.646,35.306,21.811,35.093z"/><path class="st3" d="M43.227,24.816l3.071,3.071L31.814,42.371l-3.424,0.59l-0.004-0.008l0.358-3.653L43.227,24.816z"/><path class="st3" d="M40.156,21.746l3.071,3.071L28.743,39.301l-3.672,0.185l0.601-3.255L40.156,21.746z"/><path class="st3" d="M46.691,28.28c1.203,1.14,1.581,2.115,0.531,3.255L32.734,46.023c-0.248,0.263-0.539,0.452-0.865,0.578
+	l-0.059-4.227l14.484-14.484l0.393,0.393L46.691,28.28z"/><path class="st4" d="M41.375,15.534l4.545-4.549c0.605-0.547,2.048-0.889,3.063-0.012l7.875,7.875
+	c0.719,0.786,0.841,2.151-0.012,3.059l-4.584,4.584c-0.149-0.267-0.369-0.539-0.657-0.818l-9.892-9.892
+	c-0.11-0.094-0.224-0.181-0.342-0.252L41.375,15.534z"/><path class="st5" d="M21.811,35.094l14.488-14.484"/><path class="st5" d="M36.3,18.659l2.811-2.878"/><path class="st5" d="M32.737,46.019l14.488-14.488"/><path class="st5" d="M49.207,31.531l2.422-2.41"/><path class="st5" d="M39.111,20.697l1.046,1.05l3.071,3.071l3.071,3.071l0.393,0.393"/><path class="st5" d="M51.61,25.673l-9.892-9.892"/><path class="st5" d="M36.3,20.609c0.833-0.869,1.781-0.999,2.811,0.09"/><path class="st5" d="M47.226,31.533c1.046-1.14,0.672-2.115-0.531-3.256"/><path class="st5" d="M47.226,31.531c0.562,0.523,1.207,0.617,1.982,0"/><path class="st5" d="M36.3,20.61c-0.405-0.704-0.491-1.368,0-1.946"/><path class="st5" d="M41.717,15.781c-0.11-0.094-0.224-0.181-0.342-0.252c-0.704-0.436-1.521-0.436-2.265,0.252"/><path class="st5" d="M51.609,25.674c0.287,0.283,0.503,0.554,0.657,0.818c0.472,0.849,0.244,1.659-0.657,2.611"/><path class="st5" d="M52.262,26.496l0.004-0.004l4.584-4.584"/><path class="st5" d="M41.375,15.533l4.549-4.553"/><path class="st5" d="M48.987,10.973l7.875,7.875"/><path class="st5" d="M45.924,10.981c0.605-0.547,2.048-0.889,3.063-0.012"/><path class="st5" d="M56.862,18.848c0.72,0.786,0.841,2.151-0.012,3.059"/><path class="st5" d="M20.494,45.77l0.146-2.316l0.373-6.137"/><path class="st5" d="M22.051,47.431l2.347-0.161l6.157-0.409"/><path class="st5" d="M21.812,35.094c-0.165,0.208-0.295,0.385-0.401,0.566c-0.244,0.417-0.342,0.837-0.397,1.655"/><path class="st5" d="M30.555,46.861c0.476-0.028,0.924-0.102,1.317-0.26c0.326-0.13,0.617-0.315,0.865-0.574"/><path class="st5" d="M20.742,47.137c0.059,0.071,0.13,0.122,0.212,0.169c0.244,0.13,0.598,0.153,1.097,0.126"/><path class="st5" d="M20.494,45.768c-0.031,0.684,0.031,1.113,0.244,1.36"/><path class="st5" d="M20.636,43.453c1.258,1.007,2.508,2.28,3.763,3.818"/><path class="st5" d="M43.227,24.816L28.743,39.301"/><path class="st5" d="M40.157,21.746L25.672,36.23"/><path class="st5" d="M46.298,27.887L31.814,42.371"/><path class="st5" d="M31.814,42.371l0.059,4.226"/><path class="st5" d="M25.672,36.23l-4.262-0.57"/><path class="st5" d="M25.071,39.486l3.672-0.185"/><path class="st5" d="M28.385,42.953l0.358-3.653"/><path class="st5" d="M31.813,42.371l-3.424,0.59h-0.016"/><path class="st5" d="M25.672,36.23l-0.601,3.255"/><path class="st6" d="M20.738,47.133l0.004,0.004l0.212,0.169l5.559,4.396"/><path class="st6" d="M16.02,50.443l5.776,4.569"/><path class="st6" d="M12.226,53.848l2.984,2.363"/><path class="st6" d="M16.02,50.444c-4.686-3.841-7.25,0.995-3.794,3.409"/><path class="st6" d="M21.796,55.012c5.61,4.502,10.049,0.468,4.718-3.31"/></svg>
diff --git a/assets/images/simple-illustrations/simple-illustration__tag.svg b/assets/images/simple-illustrations/simple-illustration__tag.svg
new file mode 100644
index 000000000000..c8e431c89abb
--- /dev/null
+++ b/assets/images/simple-illustrations/simple-illustration__tag.svg
@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="utf-8"?><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 68 68" style="enable-background:new 0 0 68 68;" xml:space="preserve"><style type="text/css">
+	.st0{fill:#FFD7B0;}
+	.st1{fill:#E4BC07;}
+	.st2{fill:#FFED8F;}
+	.st3{fill:none;stroke:#002140;stroke-width:0.8563;stroke-linecap:round;stroke-linejoin:round;}
+</style><path class="st0" d="M30.437,20.394L19.721,17.41l-8.508,9.724l4.529,10.716l26.074,22.87l15.138-16.683L30.437,20.394z
+	 M21.486,30.381c-1.648,0-2.984-1.335-2.984-2.984c0-1.648,1.335-2.984,2.984-2.984c1.648,0,2.984,1.335,2.984,2.984
+	C24.47,29.045,23.134,30.381,21.486,30.381z"/><path class="st1" d="M51.319,44.595l-3.317-2.874l-9.72,10.939l3.203,2.651L51.319,44.595z"/><path class="st2" d="M15.225,20.984c0,0-1.988,0.443-2.211,1.399c-0.223,0.956,1.585,3.53,3.61,4.642
+	c2.025,1.109,4.272,1.842,5.155,0.809c0.882-1.032-0.296-3.42-0.296-3.42s-1.692,2.314-3.976,0.546s-2.284-2.651-1.768-3.167
+	c0.516-0.516-0.516-0.809-0.516-0.809H15.225z"/><path class="st2" d="M15.961,21.499l2.431-2.597c0,0-0.882-8.342,6.354-8.452c4.915-0.11,11.382,4.585,16.85,4.529
+	c5.468-0.057,6.187-0.996,6.187-0.996s0.606-2.098-0.606-2.098s-2.321,0.883-5.028,0.496c-2.707-0.386-13.48-4.199-16.297-4.252
+	C23.034,8.075,15.299,8.462,15.961,21.499z"/><path class="st3" d="M15.495,22.195l4.489-5.022l10.383,3.307l26.357,23.57L41.796,60.74l-26.354-23.57L11,27.22l2.454-2.74"/><path class="st3" d="M19.282,25.464c1.059-1.182,2.874-1.285,4.059-0.226c1.182,1.059,1.285,2.874,0.226,4.059
+	c-1.059,1.182-2.874,1.285-4.059,0.226c-0.43-0.383-0.716-0.869-0.859-1.389"/><path class="st3" d="M48.035,41.33l-9.877,11.043l3.294,2.946l9.877-11.043L48.035,41.33z"/><path class="st3" d="M26.997,42.811l5.671-6.34"/><path class="st3" d="M29.635,45.168l5.671-6.34"/><path class="st3" d="M21.463,24.6c0.749,1.039,0.996,2.071,0.553,2.774c-0.769,1.222-3.333,0.992-5.721-0.513
+	c-2.391-1.505-3.706-3.716-2.934-4.938c0.47-0.749,1.612-0.952,2.977-0.653"/><path class="st3" d="M20.917,25.122c-0.49,0.776-2.081,0.649-3.556-0.28c-1.475-0.929-2.274-2.311-1.788-3.087"/><path class="st3" d="M15.852,21.279c0,0-1.988-10.716,6.52-12.927c8.508-2.211,16.683,6.85,24.859,3.313"/><path class="st3" d="M18.373,18.976c-0.423-2.394,0.333-7.739,5.997-8.465c5.661-0.726,14.905,6.953,23.47,3.583"/><path class="st3" d="M47.84,14.097c0,0,1.049-1.602-0.606-2.431"/></svg>
diff --git a/src/components/Icon/Illustrations.ts b/src/components/Icon/Illustrations.ts
index e03b393dc81f..0d6c7ff3b451 100644
--- a/src/components/Icon/Illustrations.ts
+++ b/src/components/Icon/Illustrations.ts
@@ -28,12 +28,15 @@ 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 Accounting from '@assets/images/simple-illustrations/simple-illustration__accounting.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';
+import Car from '@assets/images/simple-illustrations/simple-illustration__car.svg';
 import ChatBubbles from '@assets/images/simple-illustrations/simple-illustration__chatbubbles.svg';
 import CoffeeMug from '@assets/images/simple-illustrations/simple-illustration__coffeemug.svg';
+import Coins from '@assets/images/simple-illustrations/simple-illustration__coins.svg';
 import CommentBubbles from '@assets/images/simple-illustrations/simple-illustration__commentbubbles.svg';
 import ConciergeBubble from '@assets/images/simple-illustrations/simple-illustration__concierge-bubble.svg';
 import ConciergeNew from '@assets/images/simple-illustrations/simple-illustration__concierge.svg';
@@ -57,6 +60,7 @@ import MoneyIntoWallet from '@assets/images/simple-illustrations/simple-illustra
 import MoneyWings from '@assets/images/simple-illustrations/simple-illustration__moneywings.svg';
 import OpenSafe from '@assets/images/simple-illustrations/simple-illustration__opensafe.svg';
 import PalmTree from '@assets/images/simple-illustrations/simple-illustration__palmtree.svg';
+import Pencil from '@assets/images/simple-illustrations/simple-illustration__pencil.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';
@@ -64,6 +68,7 @@ import ReceiptWrangler from '@assets/images/simple-illustrations/simple-illustra
 import SanFrancisco from '@assets/images/simple-illustrations/simple-illustration__sanfrancisco.svg';
 import ShieldYellow from '@assets/images/simple-illustrations/simple-illustration__shield.svg';
 import SmallRocket from '@assets/images/simple-illustrations/simple-illustration__smallrocket.svg';
+import Tag from '@assets/images/simple-illustrations/simple-illustration__tag.svg';
 import ThumbsUpStars from '@assets/images/simple-illustrations/simple-illustration__thumbsupstars.svg';
 import TrackShoe from '@assets/images/simple-illustrations/simple-illustration__track-shoe.svg';
 import TrashCan from '@assets/images/simple-illustrations/simple-illustration__trashcan.svg';
@@ -144,4 +149,9 @@ export {
     WalletAlt,
     Workflows,
     House,
+    Accounting,
+    Car,
+    Coins,
+    Pencil,
+    Tag,
 };

From a80209335dc2ab5366dcd80fc2e18b7acbcd352c Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 29 Feb 2024 16:44:26 +0100
Subject: [PATCH 046/110] use correct icons

---
 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 4ad8d1936aee..94a1622c6e2f 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -171,7 +171,7 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
         },
         {
             translationKey: 'workspace.common.moreFeatures',
-            icon: Expensicons.Checkmark,
+            icon: Expensicons.Gear,
             action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_MORE_FEATURES.getRoute(policyID)))),
             routeName: SCREENS.WORKSPACE.MORE_FEATURES,
         },

From a144cbe383e193bf22f1d06e4886d63ea09e6bc3 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 29 Feb 2024 16:44:51 +0100
Subject: [PATCH 047/110] build draft sections

---
 .../workspace/WorkspaceMoreFeaturesPage.tsx   | 190 +++++++++++++-----
 1 file changed, 144 insertions(+), 46 deletions(-)

diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index f036ec60f077..b33c236f2915 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -1,11 +1,11 @@
+/* eslint-disable no-console */
 import type {StackScreenProps} from '@react-navigation/stack';
 import React, {useMemo} from 'react';
-import {FlatList, View} from 'react-native';
+import {ScrollView, View} from 'react-native';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import * as Illustrations from '@components/Icon/Illustrations';
 import ScreenWrapper from '@components/ScreenWrapper';
-import Text from '@components/Text';
-import WorkspaceEmptyStateSection from '@components/WorkspaceEmptyStateSection';
+import Section from '@components/Section';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
@@ -13,34 +13,134 @@ import type {CentralPaneNavigatorParamList} from '@libs/Navigation/types';
 import type SCREENS from '@src/SCREENS';
 import AdminPolicyAccessOrNotFoundWrapper from './AdminPolicyAccessOrNotFoundWrapper';
 import PaidPolicyAccessOrNotFoundWrapper from './PaidPolicyAccessOrNotFoundWrapper';
+import type {ToggleSettingOptionRowProps} from './workflows/ToggleSettingsOptionRow';
 import ToggleSettingOptionRow from './workflows/ToggleSettingsOptionRow';
 
-type WorkspaceMoreFeaturesPageProps = StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.CATEGORIES>;
+/**
+areCategoriesEnabled
+areTagsEnabled
+areDistanceRatesEnabled
+areWorkflowsEnabled
+areReportFieldsEnabled
+areConnectionsEnabled
+tax.trackingEnabled (see above)
+*/
 
-type FeatureForList = {
-    value: string;
-    text: string;
-    keyForList: string;
-    isSelected: boolean;
-};
+type WorkspaceMoreFeaturesPageProps = StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.CATEGORIES>;
 
 function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
     const styles = useThemeStyles();
     const {isSmallScreenWidth} = useWindowDimensions();
     const {translate} = useLocalize();
 
-    const featureList = useMemo<FeatureForList[]>(
-        () =>
-            [].map((name, index) => ({
-                // ['Feature 1', 'Feature 2', 'Feature 3'].map((name, index) => ({
-                value: name,
-                text: name,
-                keyForList: name,
-                isSelected: index % 2 === 0,
-            })),
+    const spendItems: ToggleSettingOptionRowProps[] = useMemo(
+        () => [
+            {
+                icon: Illustrations.Car,
+                title: 'Distance rates',
+                subtitle: 'Add, update and enforce rates',
+                onToggle: (isEnabled: boolean) => {
+                    console.log('isEnabled', isEnabled);
+                },
+                isActive: false,
+                pendingAction: undefined,
+            },
+            {
+                icon: Illustrations.HandCard,
+                title: 'Expensify card',
+                subtitle: 'Gain insights and control over spend',
+                onToggle: (isEnabled: boolean) => {
+                    console.log('isEnabled', isEnabled);
+                },
+                isActive: false,
+                pendingAction: undefined,
+            },
+            {
+                icon: Illustrations.Workflows,
+                title: 'Workflows',
+                subtitle: 'Configure how spend is approved and paid',
+                onToggle: (isEnabled: boolean) => {
+                    console.log('isEnabled', isEnabled);
+                },
+                isActive: false,
+                pendingAction: undefined,
+            },
+        ],
         [],
     );
 
+    const organizeItems: ToggleSettingOptionRowProps[] = useMemo(
+        () => [
+            {
+                icon: Illustrations.FolderOpen,
+                title: 'Categories',
+                subtitle: 'Track and organize spend',
+                onToggle: (isEnabled: boolean) => {
+                    console.log('isEnabled', isEnabled);
+                },
+                isActive: false,
+                pendingAction: undefined,
+            },
+            {
+                icon: Illustrations.Tag,
+                title: 'Tags',
+                subtitle: 'Add additional ways to classify spend',
+                onToggle: (isEnabled: boolean) => {
+                    console.log('isEnabled', isEnabled);
+                },
+                isActive: false,
+                pendingAction: undefined,
+            },
+            {
+                icon: Illustrations.Coins,
+                title: 'Taxes',
+                subtitle: 'Document and reclaim eligible taxes.',
+                onToggle: (isEnabled: boolean) => {
+                    console.log('isEnabled', isEnabled);
+                },
+                isActive: false,
+                pendingAction: undefined,
+            },
+            {
+                icon: Illustrations.Pencil,
+                title: 'Report fields',
+                subtitle: 'Subtitle...',
+                onToggle: (isEnabled: boolean) => {
+                    console.log('isEnabled', isEnabled);
+                },
+                isActive: false,
+                pendingAction: undefined,
+            },
+            {
+                icon: Illustrations.Accounting,
+                title: 'Connections',
+                subtitle: 'Subtitle...',
+                onToggle: (isEnabled: boolean) => {
+                    console.log('isEnabled', isEnabled);
+                },
+                isActive: false,
+                pendingAction: undefined,
+            },
+        ],
+        [],
+    );
+
+    const renderItem = (item: ToggleSettingOptionRowProps) => (
+        <View
+            key={item.title}
+            style={styles.mt7}
+        >
+            <ToggleSettingOptionRow
+                icon={item.icon}
+                title={item.title}
+                subtitle={item.subtitle}
+                onToggle={item.onToggle}
+                isActive={item.isActive}
+                pendingAction={item.pendingAction}
+            />
+        </View>
+    );
+
     return (
         <AdminPolicyAccessOrNotFoundWrapper policyID={route.params.policyID}>
             <PaidPolicyAccessOrNotFoundWrapper policyID={route.params.policyID}>
@@ -51,38 +151,36 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                     shouldShowOfflineIndicatorInWideScreen
                 >
                     <HeaderWithBackButton
-                        icon={Illustrations.FolderOpen}
+                        icon={Illustrations.Gears}
                         title={translate('workspace.common.moreFeatures')}
                         shouldShowBackButton={isSmallScreenWidth}
                     />
 
-                    <View style={[styles.ph5, styles.pb5]}>
-                        <Text style={[styles.textNormal, styles.colorMuted]}>Page subtitle...</Text>
-                    </View>
+                    <ScrollView>
+                        <View style={[styles.mt3, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
+                            <Section
+                                containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
+                                title="Spend"
+                                titleStyles={styles.textStrong}
+                                subtitle="Enable optional functionality that helps you scale your team."
+                                subtitleMuted
+                            >
+                                {spendItems.map(renderItem)}
+                            </Section>
+                        </View>
 
-                    {featureList.length ? (
-                        <FlatList
-                            style={styles.flex1}
-                            contentContainerStyle={[styles.pl3, styles.pr9]}
-                            keyExtractor={(item) => item.keyForList}
-                            data={featureList}
-                            renderItem={({item}) => (
-                                <ToggleSettingOptionRow
-                                    icon={Illustrations.FolderOpen}
-                                    title={item.text}
-                                    subtitle={item.text}
-                                    onToggle={() => {}}
-                                    isActive={false}
-                                />
-                            )}
-                        />
-                    ) : (
-                        <WorkspaceEmptyStateSection
-                            title="Empty features title"
-                            icon={Illustrations.EmptyStateExpenses}
-                            subtitle="Empty features subtitle"
-                        />
-                    )}
+                        <View style={[styles.mt3, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
+                            <Section
+                                containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
+                                title="Organize"
+                                titleStyles={styles.textStrong}
+                                subtitle="Group and analyze spend, record every tax paid."
+                                subtitleMuted
+                            >
+                                {organizeItems.map(renderItem)}
+                            </Section>
+                        </View>
+                    </ScrollView>
                 </ScreenWrapper>
             </PaidPolicyAccessOrNotFoundWrapper>
         </AdminPolicyAccessOrNotFoundWrapper>

From 719972cc03216e24e8b484400597d2bbccad360e Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 29 Feb 2024 16:59:11 +0100
Subject: [PATCH 048/110] add strings

---
 src/languages/en.ts                           | 42 ++++++++++++++++++
 src/languages/es.ts                           | 42 ++++++++++++++++++
 .../workspace/WorkspaceMoreFeaturesPage.tsx   | 44 +++++++++----------
 3 files changed, 106 insertions(+), 22 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index a1019c70c22b..24cd17343b10 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -1748,6 +1748,48 @@ export default {
                 subtitle: 'Add a category to organize your spend.',
             },
         },
+        moreFeatures: {
+            spendSection: {
+                title: 'Spend',
+                subtitle: 'Enable optional functionality that helps you scale your team.',
+            },
+            organizeSection: {
+                title: 'Organize',
+                subtitle: 'Group and analyze spend, record every tax paid.',
+            },
+            distanceRates: {
+                title: 'Distance rates',
+                subtitle: 'Add, update and enforce rates.',
+            },
+            expensifyCard: {
+                title: 'Expensify card',
+                subtitle: 'Gain insights and control over spend.',
+            },
+            workflows: {
+                title: 'Workflows',
+                subtitle: 'Configure how spend is approved and paid.',
+            },
+            categories: {
+                title: 'Categories',
+                subtitle: 'Track and organize spend.',
+            },
+            tags: {
+                title: 'Tags',
+                subtitle: 'Add additional ways to classify spend.',
+            },
+            taxes: {
+                title: 'Taxes',
+                subtitle: 'Document and reclaim eligible taxes.',
+            },
+            reportFields: {
+                title: 'Report fields',
+                subtitle: 'Subtitle...',
+            },
+            connections: {
+                title: 'Connections',
+                subtitle: 'Subtitle...',
+            },
+        },
         emptyWorkspace: {
             title: 'Create a workspace',
             subtitle: 'Workspaces are where you’ll chat with your team, reimburse expenses, issue cards, send invoices, pay bills, and more - all in one place.',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 6749c0690de9..97d50d7ca214 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -1772,6 +1772,48 @@ export default {
                 subtitle: 'Añade una categoría para organizar tu gasto.',
             },
         },
+        moreFeatures: {
+            spendSection: {
+                title: 'Gastar',
+                subtitle: 'Habilitar una funcionalidad opcional que lo ayude a escalar su equipo.',
+            },
+            organizeSection: {
+                title: 'Organizar',
+                subtitle: 'Agrupar y analizar el gasto, registrar cada impuesto pagado.',
+            },
+            distanceRates: {
+                title: 'Tasas de distancia',
+                subtitle: 'Agregar, actualizar y hacer cumplir las tarifas.',
+            },
+            expensifyCard: {
+                title: 'Tarjeta de expensas',
+                subtitle: 'Obtener ideas y control sobre el gasto.',
+            },
+            workflows: {
+                title: 'Flujos de trabajo',
+                subtitle: 'Configure cómo se aprueba y paga el gasto.',
+            },
+            categories: {
+                title: 'Categorías',
+                subtitle: 'Rastrear y organizar el gasto.',
+            },
+            tags: {
+                title: 'Etiquetas',
+                subtitle: 'Agregue formas adicionales de clasificar el gasto.',
+            },
+            taxes: {
+                title: 'Impuestos',
+                subtitle: 'Documentar y reclamar impuestos elegibles.',
+            },
+            reportFields: {
+                title: 'Campos de informes',
+                subtitle: 'Subtitle...',
+            },
+            connections: {
+                title: 'Conexión',
+                subtitle: 'Subtitle...',
+            },
+        },
         emptyWorkspace: {
             title: 'Crea un espacio de trabajo',
             subtitle: 'En los espacios de trabajo podrás chatear con tu equipo, reembolsar gastos, emitir tarjetas, enviar y pagar facturas, y mucho más - todo en un mismo lugar.',
diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index b33c236f2915..47dd45d51670 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -37,8 +37,8 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
         () => [
             {
                 icon: Illustrations.Car,
-                title: 'Distance rates',
-                subtitle: 'Add, update and enforce rates',
+                title: translate('workspace.moreFeatures.distanceRates.title'),
+                subtitle: translate('workspace.moreFeatures.distanceRates.subtitle'),
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
@@ -47,8 +47,8 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
             },
             {
                 icon: Illustrations.HandCard,
-                title: 'Expensify card',
-                subtitle: 'Gain insights and control over spend',
+                title: translate('workspace.moreFeatures.expensifyCard.title'),
+                subtitle: translate('workspace.moreFeatures.expensifyCard.subtitle'),
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
@@ -57,8 +57,8 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
             },
             {
                 icon: Illustrations.Workflows,
-                title: 'Workflows',
-                subtitle: 'Configure how spend is approved and paid',
+                title: translate('workspace.moreFeatures.workflows.title'),
+                subtitle: translate('workspace.moreFeatures.workflows.subtitle'),
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
@@ -66,15 +66,15 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                 pendingAction: undefined,
             },
         ],
-        [],
+        [translate],
     );
 
     const organizeItems: ToggleSettingOptionRowProps[] = useMemo(
         () => [
             {
                 icon: Illustrations.FolderOpen,
-                title: 'Categories',
-                subtitle: 'Track and organize spend',
+                title: translate('workspace.moreFeatures.categories.title'),
+                subtitle: translate('workspace.moreFeatures.categories.subtitle'),
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
@@ -83,8 +83,8 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
             },
             {
                 icon: Illustrations.Tag,
-                title: 'Tags',
-                subtitle: 'Add additional ways to classify spend',
+                title: translate('workspace.moreFeatures.tags.title'),
+                subtitle: translate('workspace.moreFeatures.tags.subtitle'),
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
@@ -93,8 +93,8 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
             },
             {
                 icon: Illustrations.Coins,
-                title: 'Taxes',
-                subtitle: 'Document and reclaim eligible taxes.',
+                title: translate('workspace.moreFeatures.taxes.title'),
+                subtitle: translate('workspace.moreFeatures.taxes.subtitle'),
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
@@ -103,8 +103,8 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
             },
             {
                 icon: Illustrations.Pencil,
-                title: 'Report fields',
-                subtitle: 'Subtitle...',
+                title: translate('workspace.moreFeatures.reportFields.title'),
+                subtitle: translate('workspace.moreFeatures.reportFields.subtitle'),
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
@@ -113,8 +113,8 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
             },
             {
                 icon: Illustrations.Accounting,
-                title: 'Connections',
-                subtitle: 'Subtitle...',
+                title: translate('workspace.moreFeatures.connections.title'),
+                subtitle: translate('workspace.moreFeatures.connections.subtitle'),
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
@@ -122,7 +122,7 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                 pendingAction: undefined,
             },
         ],
-        [],
+        [translate],
     );
 
     const renderItem = (item: ToggleSettingOptionRowProps) => (
@@ -160,9 +160,9 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                         <View style={[styles.mt3, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
                             <Section
                                 containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
-                                title="Spend"
+                                title={translate('workspace.moreFeatures.spendSection.title')}
                                 titleStyles={styles.textStrong}
-                                subtitle="Enable optional functionality that helps you scale your team."
+                                subtitle={translate('workspace.moreFeatures.spendSection.subtitle')}
                                 subtitleMuted
                             >
                                 {spendItems.map(renderItem)}
@@ -172,9 +172,9 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                         <View style={[styles.mt3, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
                             <Section
                                 containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
-                                title="Organize"
+                                title={translate('workspace.moreFeatures.organizeSection.title')}
                                 titleStyles={styles.textStrong}
-                                subtitle="Group and analyze spend, record every tax paid."
+                                subtitle={translate('workspace.moreFeatures.organizeSection.subtitle')}
                                 subtitleMuted
                             >
                                 {organizeItems.map(renderItem)}

From 7849b7fb1b9bc78be099b990fb713550aedabb38 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 1 Mar 2024 17:03:48 +0100
Subject: [PATCH 049/110] add strings

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

diff --git a/src/languages/en.ts b/src/languages/en.ts
index 71768935e174..467061b59bfb 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -1760,6 +1760,10 @@ export default {
                 title: 'Organize',
                 subtitle: 'Group and analyze spend, record every tax paid.',
             },
+            integrateSection: {
+                title: 'Integrate',
+                subtitle: 'Connect Expensify to popular financial products.',
+            },
             distanceRates: {
                 title: 'Distance rates',
                 subtitle: 'Add, update and enforce rates.',
@@ -1786,11 +1790,11 @@ export default {
             },
             reportFields: {
                 title: 'Report fields',
-                subtitle: 'Subtitle...',
+                subtitle: 'Set up custom fields for spend.',
             },
             connections: {
                 title: 'Connections',
-                subtitle: 'Subtitle...',
+                subtitle: 'Sync your chart of accounts and more.',
             },
         },
         emptyWorkspace: {
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 2764d0596125..6c594cd849ca 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -1784,6 +1784,10 @@ export default {
                 title: 'Organizar',
                 subtitle: 'Agrupar y analizar el gasto, registrar cada impuesto pagado.',
             },
+            integrateSection: {
+                title: 'Integrar',
+                subtitle: 'Conectar gastos de expensización a productos financieros populares.',
+            },
             distanceRates: {
                 title: 'Tasas de distancia',
                 subtitle: 'Agregar, actualizar y hacer cumplir las tarifas.',
@@ -1810,11 +1814,11 @@ export default {
             },
             reportFields: {
                 title: 'Campos de informes',
-                subtitle: 'Subtitle...',
+                subtitle: 'Configurar campos personalizados para gastar.',
             },
             connections: {
                 title: 'Conexión',
-                subtitle: 'Subtitle...',
+                subtitle: 'Sincronice su gráfico de cuentas y más.',
             },
         },
         emptyWorkspace: {

From 08e89a4037820ba4cd97577f078b1b0b9c39f424 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 1 Mar 2024 17:04:10 +0100
Subject: [PATCH 050/110] implement integrate section

---
 .../workspace/WorkspaceMoreFeaturesPage.tsx    | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index 47dd45d51670..3b227b410f39 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -111,6 +111,12 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                 isActive: false,
                 pendingAction: undefined,
             },
+        ],
+        [translate],
+    );
+
+    const integrateItems: ToggleSettingOptionRowProps[] = useMemo(
+        () => [
             {
                 icon: Illustrations.Accounting,
                 title: translate('workspace.moreFeatures.connections.title'),
@@ -180,6 +186,18 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                                 {organizeItems.map(renderItem)}
                             </Section>
                         </View>
+
+                        <View style={[styles.mt3, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
+                            <Section
+                                containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
+                                title={translate('workspace.moreFeatures.integrateSection.title')}
+                                titleStyles={styles.textStrong}
+                                subtitle={translate('workspace.moreFeatures.integrateSection.subtitle')}
+                                subtitleMuted
+                            >
+                                {integrateItems.map(renderItem)}
+                            </Section>
+                        </View>
                     </ScrollView>
                 </ScreenWrapper>
             </PaidPolicyAccessOrNotFoundWrapper>

From 82a78036aef1258a4e7724be23e6ce2e51fdf848 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 1 Mar 2024 17:09:15 +0100
Subject: [PATCH 051/110] integrate section renderer

---
 .../workspace/WorkspaceMoreFeaturesPage.tsx   | 76 ++++++++++---------
 1 file changed, 39 insertions(+), 37 deletions(-)

diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index 3b227b410f39..7f319ddf877f 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -131,6 +131,27 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
         [translate],
     );
 
+    const sections = useMemo(
+        () => [
+            {
+                title: translate('workspace.moreFeatures.spendSection.title'),
+                subtitle: translate('workspace.moreFeatures.spendSection.subtitle'),
+                items: spendItems,
+            },
+            {
+                title: translate('workspace.moreFeatures.organizeSection.title'),
+                subtitle: translate('workspace.moreFeatures.organizeSection.subtitle'),
+                items: organizeItems,
+            },
+            {
+                title: translate('workspace.moreFeatures.integrateSection.title'),
+                subtitle: translate('workspace.moreFeatures.integrateSection.subtitle'),
+                items: integrateItems,
+            },
+        ],
+        [integrateItems, organizeItems, spendItems, translate],
+    );
+
     const renderItem = (item: ToggleSettingOptionRowProps) => (
         <View
             key={item.title}
@@ -147,6 +168,23 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
         </View>
     );
 
+    const renderSection = (section: (typeof sections)[0]) => (
+        <View
+            key={section.title}
+            style={[styles.mt3, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}
+        >
+            <Section
+                containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
+                title={section.title}
+                titleStyles={styles.textStrong}
+                subtitle={section.subtitle}
+                subtitleMuted
+            >
+                {section.items.map(renderItem)}
+            </Section>
+        </View>
+    );
+
     return (
         <AdminPolicyAccessOrNotFoundWrapper policyID={route.params.policyID}>
             <PaidPolicyAccessOrNotFoundWrapper policyID={route.params.policyID}>
@@ -162,43 +200,7 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                         shouldShowBackButton={isSmallScreenWidth}
                     />
 
-                    <ScrollView>
-                        <View style={[styles.mt3, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
-                            <Section
-                                containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
-                                title={translate('workspace.moreFeatures.spendSection.title')}
-                                titleStyles={styles.textStrong}
-                                subtitle={translate('workspace.moreFeatures.spendSection.subtitle')}
-                                subtitleMuted
-                            >
-                                {spendItems.map(renderItem)}
-                            </Section>
-                        </View>
-
-                        <View style={[styles.mt3, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
-                            <Section
-                                containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
-                                title={translate('workspace.moreFeatures.organizeSection.title')}
-                                titleStyles={styles.textStrong}
-                                subtitle={translate('workspace.moreFeatures.organizeSection.subtitle')}
-                                subtitleMuted
-                            >
-                                {organizeItems.map(renderItem)}
-                            </Section>
-                        </View>
-
-                        <View style={[styles.mt3, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}>
-                            <Section
-                                containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
-                                title={translate('workspace.moreFeatures.integrateSection.title')}
-                                titleStyles={styles.textStrong}
-                                subtitle={translate('workspace.moreFeatures.integrateSection.subtitle')}
-                                subtitleMuted
-                            >
-                                {integrateItems.map(renderItem)}
-                            </Section>
-                        </View>
-                    </ScrollView>
+                    <ScrollView>{sections.map(renderSection)}</ScrollView>
                 </ScreenWrapper>
             </PaidPolicyAccessOrNotFoundWrapper>
         </AdminPolicyAccessOrNotFoundWrapper>

From c64d1a555a19aa227da11e1c909f96a1aa4ebc3d Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 1 Mar 2024 17:18:34 +0100
Subject: [PATCH 052/110] connect active values

---
 .../workspace/WorkspaceMoreFeaturesPage.tsx   | 38 ++++++++-----------
 1 file changed, 15 insertions(+), 23 deletions(-)

diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index 7f319ddf877f..146cb6dab311 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -13,22 +13,14 @@ import type {CentralPaneNavigatorParamList} from '@libs/Navigation/types';
 import type SCREENS from '@src/SCREENS';
 import AdminPolicyAccessOrNotFoundWrapper from './AdminPolicyAccessOrNotFoundWrapper';
 import PaidPolicyAccessOrNotFoundWrapper from './PaidPolicyAccessOrNotFoundWrapper';
+import type {WithPolicyAndFullscreenLoadingProps} from './withPolicyAndFullscreenLoading';
+import withPolicyAndFullscreenLoading from './withPolicyAndFullscreenLoading';
 import type {ToggleSettingOptionRowProps} from './workflows/ToggleSettingsOptionRow';
 import ToggleSettingOptionRow from './workflows/ToggleSettingsOptionRow';
 
-/**
-areCategoriesEnabled
-areTagsEnabled
-areDistanceRatesEnabled
-areWorkflowsEnabled
-areReportFieldsEnabled
-areConnectionsEnabled
-tax.trackingEnabled (see above)
-*/
+type WorkspaceMoreFeaturesPageProps = WithPolicyAndFullscreenLoadingProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.CATEGORIES>;
 
-type WorkspaceMoreFeaturesPageProps = StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.CATEGORIES>;
-
-function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
+function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPageProps) {
     const styles = useThemeStyles();
     const {isSmallScreenWidth} = useWindowDimensions();
     const {translate} = useLocalize();
@@ -42,7 +34,7 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
-                isActive: false,
+                isActive: policy?.areDistanceRatesEnabled ?? false,
                 pendingAction: undefined,
             },
             {
@@ -62,11 +54,11 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
-                isActive: false,
+                isActive: policy?.areWorkflowsEnabled ?? false,
                 pendingAction: undefined,
             },
         ],
-        [translate],
+        [policy?.areDistanceRatesEnabled, policy?.areWorkflowsEnabled, translate],
     );
 
     const organizeItems: ToggleSettingOptionRowProps[] = useMemo(
@@ -78,7 +70,7 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
-                isActive: false,
+                isActive: policy?.areCategoriesEnabled ?? false,
                 pendingAction: undefined,
             },
             {
@@ -88,7 +80,7 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
-                isActive: false,
+                isActive: policy?.areTagsEnabled ?? false,
                 pendingAction: undefined,
             },
             {
@@ -98,7 +90,7 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
-                isActive: false,
+                isActive: policy?.tax?.trackingEnabled ?? false,
                 pendingAction: undefined,
             },
             {
@@ -108,11 +100,11 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
-                isActive: false,
+                isActive: policy?.areReportFieldsEnabled ?? false,
                 pendingAction: undefined,
             },
         ],
-        [translate],
+        [policy?.areCategoriesEnabled, policy?.areReportFieldsEnabled, policy?.areTagsEnabled, policy?.tax?.trackingEnabled, translate],
     );
 
     const integrateItems: ToggleSettingOptionRowProps[] = useMemo(
@@ -124,11 +116,11 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
                 onToggle: (isEnabled: boolean) => {
                     console.log('isEnabled', isEnabled);
                 },
-                isActive: false,
+                isActive: policy?.areConnectionsEnabled ?? false,
                 pendingAction: undefined,
             },
         ],
-        [translate],
+        [policy?.areConnectionsEnabled, translate],
     );
 
     const sections = useMemo(
@@ -209,4 +201,4 @@ function WorkspaceMoreFeaturesPage({route}: WorkspaceMoreFeaturesPageProps) {
 
 WorkspaceMoreFeaturesPage.displayName = 'WorkspaceMoreFeaturesPage';
 
-export default WorkspaceMoreFeaturesPage;
+export default withPolicyAndFullscreenLoading(WorkspaceMoreFeaturesPage);

From f8797c19dbe6dede6b75700e1ab38b04a9409259 Mon Sep 17 00:00:00 2001
From: wikuskriek <wikus.kriek.2w@gmail.com>
Date: Sat, 2 Mar 2024 18:10:50 +0200
Subject: [PATCH 053/110] fix: copy

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

diff --git a/src/languages/en.ts b/src/languages/en.ts
index cf845d2523b2..b67423cf17b2 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -225,7 +225,7 @@ export default {
             acceptTerms: 'You must accept the Terms of Service to continue',
             phoneNumber: `Please enter a valid phone number, with the country code (e.g. ${CONST.EXAMPLE_PHONE_NUMBER})`,
             fieldRequired: 'This field is required.',
-            transactionModified: 'This transaction has been modified',
+            requestModified: 'This request is being modified by another member.',
             characterLimit: ({limit}: CharacterLimitParams) => `Exceeds the maximum length of ${limit} characters`,
             characterLimitExceedCounter: ({length, limit}) => `Character limit exceeded (${length}/${limit})`,
             dateInvalid: 'Please select a valid date',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 7bea48d71d36..5c86d5602ddc 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -215,6 +215,7 @@ export default {
             acceptTerms: 'Debes aceptar los Términos de Servicio para continuar',
             phoneNumber: `Introduce un teléfono válido, incluyendo el código del país (p. ej. ${CONST.EXAMPLE_PHONE_NUMBER})`,
             fieldRequired: 'Este campo es obligatorio.',
+            requestModified: 'Esta solicitud está siendo modificada por otro miembro.',
             characterLimit: ({limit}: CharacterLimitParams) => `Supera el límite de ${limit} caracteres`,
             characterLimitExceedCounter: ({length, limit}) => `Se superó el límite de caracteres (${length}/${limit})`,
             dateInvalid: 'Por favor, selecciona una fecha válida',

From bc681c3d73fd60147c26abc26e61793379c853db Mon Sep 17 00:00:00 2001
From: wikuskriek <wikus.kriek.2w@gmail.com>
Date: Sat, 2 Mar 2024 18:14:26 +0200
Subject: [PATCH 054/110] fix: used canEditMoneyRequest

---
 src/pages/iou/HoldReasonPage.tsx | 31 ++++++++++++++++++++++---------
 1 file changed, 22 insertions(+), 9 deletions(-)

diff --git a/src/pages/iou/HoldReasonPage.tsx b/src/pages/iou/HoldReasonPage.tsx
index 11c3378b3ec9..3b579d583b7b 100644
--- a/src/pages/iou/HoldReasonPage.tsx
+++ b/src/pages/iou/HoldReasonPage.tsx
@@ -10,7 +10,9 @@ import Text from '@components/Text';
 import TextInput from '@components/TextInput';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
+import * as ErrorUtils from '@libs/ErrorUtils';
 import Navigation from '@libs/Navigation/Navigation';
+import * as ReportActionsUtils from '@libs/ReportActionsUtils';
 import * as ReportUtils from '@libs/ReportUtils';
 import * as ValidationUtils from '@libs/ValidationUtils';
 import * as FormActions from '@userActions/FormActions';
@@ -41,28 +43,39 @@ function HoldReasonPage({route}: HoldReasonPageProps) {
 
     const {transactionID, reportID, backTo} = route.params;
 
+    const reportData = ReportUtils.getReport(reportID);
+    const parentReportAction = ReportActionsUtils.getReportAction(reportData?.parentReportID ?? '', reportData?.parentReportActionID ?? '');
+
     const navigateBack = () => {
         Navigation.navigate(backTo);
     };
 
     const onSubmit = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM>) => {
-        if (!ReportUtils.isReportApproved(reportID) && !ReportUtils.isSettled(reportID)) {
-            FormActions.setErrors(ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM, {reportModified: translate('common.error.transactionModified')});
+        if (!ReportUtils.canEditMoneyRequest(parentReportAction)) {
             return;
         }
+
         IOU.putOnHold(transactionID, values.comment, reportID);
         navigateBack();
     };
 
-    const validate = useCallback((values: FormOnyxValues<typeof ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM>) => {
-        const errors: FormInputErrors<typeof ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM> = ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.COMMENT]);
+    const validate = useCallback(
+        (values: FormOnyxValues<typeof ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM>) => {
+            const errors: FormInputErrors<typeof ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM> = ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.COMMENT]);
 
-        if (!values.comment) {
-            errors.comment = 'common.error.fieldRequired';
-        }
+            if (!values.comment) {
+                errors.comment = 'common.error.fieldRequired';
+            }
+            if (!ReportUtils.canEditMoneyRequest(parentReportAction)) {
+                const formErrors = {};
+                ErrorUtils.addErrorMessage(formErrors, 'reportModified', 'common.error.requestModified');
+                FormActions.setErrors(ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM, formErrors);
+            }
 
-        return errors;
-    }, []);
+            return errors;
+        },
+        [parentReportAction],
+    );
 
     useEffect(() => {
         FormActions.clearErrors(ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM);

From 05434042afcc5c2ce4adbbb6449802496a317cd8 Mon Sep 17 00:00:00 2001
From: wikuskriek <wikus.kriek.2w@gmail.com>
Date: Sat, 2 Mar 2024 18:47:42 +0200
Subject: [PATCH 055/110] Refactor variable names

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

diff --git a/src/pages/iou/HoldReasonPage.tsx b/src/pages/iou/HoldReasonPage.tsx
index 3b579d583b7b..0d5c5b8a327b 100644
--- a/src/pages/iou/HoldReasonPage.tsx
+++ b/src/pages/iou/HoldReasonPage.tsx
@@ -43,8 +43,8 @@ function HoldReasonPage({route}: HoldReasonPageProps) {
 
     const {transactionID, reportID, backTo} = route.params;
 
-    const reportData = ReportUtils.getReport(reportID);
-    const parentReportAction = ReportActionsUtils.getReportAction(reportData?.parentReportID ?? '', reportData?.parentReportActionID ?? '');
+    const report = ReportUtils.getReport(reportID);
+    const parentReportAction = ReportActionsUtils.getReportAction(report?.parentReportID ?? '', report?.parentReportActionID ?? '');
 
     const navigateBack = () => {
         Navigation.navigate(backTo);

From 5098f5b999f543d7a876fcec76ab3ce688d15427 Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Mon, 4 Mar 2024 10:36:13 +0100
Subject: [PATCH 056/110] Update new parts of the code

---
 src/pages/home/HeaderView.tsx          | 6 +++---
 src/pages/home/report/ReportFooter.tsx | 9 +++------
 2 files changed, 6 insertions(+), 9 deletions(-)

diff --git a/src/pages/home/HeaderView.tsx b/src/pages/home/HeaderView.tsx
index 12fb109e2c41..81ba56bde0cb 100644
--- a/src/pages/home/HeaderView.tsx
+++ b/src/pages/home/HeaderView.tsx
@@ -73,10 +73,10 @@ function HeaderView({report, personalDetails, parentReport, policy, session, rep
     const {translate} = useLocalize();
     const theme = useTheme();
     const styles = useThemeStyles();
-    const isSelfDM = ReportUtils.isSelfDM(props.report);
+    const isSelfDM = ReportUtils.isSelfDM(report);
     // Currently, currentUser is not included in participantAccountIDs, so for selfDM, we need to add the currentUser as participants.
-    const participants = isSelfDM ? [props.session.accountID] : lodashGet(props.report, 'participantAccountIDs', []);
-    const participantPersonalDetails = OptionsListUtils.getPersonalDetailsForAccountIDs(participants, props.personalDetails);
+    const participants = isSelfDM ? [session?.accountID ?? -1] : report?.participantAccountIDs ?? [];
+    const participantPersonalDetails = OptionsListUtils.getPersonalDetailsForAccountIDs(participants, personalDetails);
     const isMultipleParticipant = participants.length > 1;
     const displayNamesWithTooltips = ReportUtils.getDisplayNamesWithTooltips(participantPersonalDetails, isMultipleParticipant, undefined, isSelfDM);
 
diff --git a/src/pages/home/report/ReportFooter.tsx b/src/pages/home/report/ReportFooter.tsx
index b1a51e6535c1..3ce49c43bc69 100644
--- a/src/pages/home/report/ReportFooter.tsx
+++ b/src/pages/home/report/ReportFooter.tsx
@@ -27,10 +27,7 @@ type ReportFooterOnyxProps = {
     shouldShowComposeInput: OnyxEntry<boolean>;
 
     /** Session info for the currently logged in user. */
-    session: PropTypes.shape({
-                                 /** Currently logged in user auth token type */
-                                 authTokenType: PropTypes.string,
-                             }),
+    session: OnyxEntry<OnyxTypes.Session>;
 };
 
 type ReportFooterProps = ReportFooterOnyxProps & {
@@ -72,7 +69,7 @@ function ReportFooter({
     const {windowWidth, isSmallScreenWidth} = useWindowDimensions();
     const chatFooterStyles = {...styles.chatFooter, minHeight: !isOffline ? CONST.CHAT_FOOTER_MIN_HEIGHT : 0};
     const isArchivedRoom = ReportUtils.isArchivedRoom(report);
-    const isAnonymousUser = session.authTokenType === CONST.AUTH_TOKEN_TYPE.ANONYMOUS;
+    const isAnonymousUser = session?.authTokenType === CONST.AUTH_TOKEN_TYPE.ANONYMOUS;
 
     const isSmallSizeLayout = windowWidth - (isSmallScreenWidth ? 0 : variables.sideBarWidth) < variables.anonymousReportFooterBreakpoint;
     const hideComposer = !ReportUtils.canUserPerformWriteAction(report);
@@ -164,7 +161,7 @@ export default withOnyx<ReportFooterProps, ReportFooterOnyxProps>({
         initialValue: false,
     },
     session: {
-            key: ONYXKEYS.SESSION,
+        key: ONYXKEYS.SESSION,
     },
 })(
     memo(

From 7653ea8210dae78ac0a6c9398fc14d8985247df3 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Mon, 4 Mar 2024 13:30:13 +0100
Subject: [PATCH 057/110] remove expensify card option

---
 src/languages/en.ts                               |  4 ----
 src/languages/es.ts                               |  4 ----
 src/pages/workspace/WorkspaceMoreFeaturesPage.tsx | 10 ----------
 3 files changed, 18 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index e782d486b1ff..1ec2108bbb72 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -1786,10 +1786,6 @@ export default {
                 title: 'Distance rates',
                 subtitle: 'Add, update and enforce rates.',
             },
-            expensifyCard: {
-                title: 'Expensify card',
-                subtitle: 'Gain insights and control over spend.',
-            },
             workflows: {
                 title: 'Workflows',
                 subtitle: 'Configure how spend is approved and paid.',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 12e2672ef67e..83f5eaa1e4f1 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -1810,10 +1810,6 @@ export default {
                 title: 'Tasas de distancia',
                 subtitle: 'Agregar, actualizar y hacer cumplir las tarifas.',
             },
-            expensifyCard: {
-                title: 'Tarjeta de expensas',
-                subtitle: 'Obtener ideas y control sobre el gasto.',
-            },
             workflows: {
                 title: 'Flujos de trabajo',
                 subtitle: 'Configure cómo se aprueba y paga el gasto.',
diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index 146cb6dab311..6207579272f1 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -37,16 +37,6 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
                 isActive: policy?.areDistanceRatesEnabled ?? false,
                 pendingAction: undefined,
             },
-            {
-                icon: Illustrations.HandCard,
-                title: translate('workspace.moreFeatures.expensifyCard.title'),
-                subtitle: translate('workspace.moreFeatures.expensifyCard.subtitle'),
-                onToggle: (isEnabled: boolean) => {
-                    console.log('isEnabled', isEnabled);
-                },
-                isActive: false,
-                pendingAction: undefined,
-            },
             {
                 icon: Illustrations.Workflows,
                 title: translate('workspace.moreFeatures.workflows.title'),

From 9a824a62bd7f30569caa36503d2abb2380999183 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Mon, 4 Mar 2024 15:18:36 +0100
Subject: [PATCH 058/110] integrate API commands

---
 .../EnablePolicyCategoriesParams.ts           |   6 +
 .../EnablePolicyConnectionsParams.ts          |   6 +
 .../EnablePolicyDistanceRatesParams.ts        |   6 +
 .../EnablePolicyReportFieldsParams.ts         |   6 +
 .../API/parameters/EnablePolicyTagsParams.ts  |   6 +
 .../API/parameters/EnablePolicyTaxesParams.ts |   6 +
 .../parameters/EnablePolicyWorkflowsParams.ts |   6 +
 src/libs/API/parameters/index.ts              |   7 +
 src/libs/API/types.ts                         |  14 +
 src/libs/actions/Policy.ts                    | 361 ++++++++++++++++++
 .../workspace/WorkspaceMoreFeaturesPage.tsx   |  71 ++--
 11 files changed, 470 insertions(+), 25 deletions(-)
 create mode 100644 src/libs/API/parameters/EnablePolicyCategoriesParams.ts
 create mode 100644 src/libs/API/parameters/EnablePolicyConnectionsParams.ts
 create mode 100644 src/libs/API/parameters/EnablePolicyDistanceRatesParams.ts
 create mode 100644 src/libs/API/parameters/EnablePolicyReportFieldsParams.ts
 create mode 100644 src/libs/API/parameters/EnablePolicyTagsParams.ts
 create mode 100644 src/libs/API/parameters/EnablePolicyTaxesParams.ts
 create mode 100644 src/libs/API/parameters/EnablePolicyWorkflowsParams.ts

diff --git a/src/libs/API/parameters/EnablePolicyCategoriesParams.ts b/src/libs/API/parameters/EnablePolicyCategoriesParams.ts
new file mode 100644
index 000000000000..6d994f9dca37
--- /dev/null
+++ b/src/libs/API/parameters/EnablePolicyCategoriesParams.ts
@@ -0,0 +1,6 @@
+type EnablePolicyCategoriesParams = {
+    policyID: string;
+    isEnabled: boolean;
+};
+
+export default EnablePolicyCategoriesParams;
diff --git a/src/libs/API/parameters/EnablePolicyConnectionsParams.ts b/src/libs/API/parameters/EnablePolicyConnectionsParams.ts
new file mode 100644
index 000000000000..312c93c42b30
--- /dev/null
+++ b/src/libs/API/parameters/EnablePolicyConnectionsParams.ts
@@ -0,0 +1,6 @@
+type EnablePolicyConnectionsParams = {
+    policyID: string;
+    isEnabled: boolean;
+};
+
+export default EnablePolicyConnectionsParams;
diff --git a/src/libs/API/parameters/EnablePolicyDistanceRatesParams.ts b/src/libs/API/parameters/EnablePolicyDistanceRatesParams.ts
new file mode 100644
index 000000000000..18718670af25
--- /dev/null
+++ b/src/libs/API/parameters/EnablePolicyDistanceRatesParams.ts
@@ -0,0 +1,6 @@
+type EnablePolicyDistanceRatesParams = {
+    policyID: string;
+    isEnabled: boolean;
+};
+
+export default EnablePolicyDistanceRatesParams;
diff --git a/src/libs/API/parameters/EnablePolicyReportFieldsParams.ts b/src/libs/API/parameters/EnablePolicyReportFieldsParams.ts
new file mode 100644
index 000000000000..341716563f53
--- /dev/null
+++ b/src/libs/API/parameters/EnablePolicyReportFieldsParams.ts
@@ -0,0 +1,6 @@
+type EnablePolicyReportFieldsParams = {
+    policyID: string;
+    isEnabled: boolean;
+};
+
+export default EnablePolicyReportFieldsParams;
diff --git a/src/libs/API/parameters/EnablePolicyTagsParams.ts b/src/libs/API/parameters/EnablePolicyTagsParams.ts
new file mode 100644
index 000000000000..f85fabd30f1f
--- /dev/null
+++ b/src/libs/API/parameters/EnablePolicyTagsParams.ts
@@ -0,0 +1,6 @@
+type EnablePolicyTagsParams = {
+    policyID: string;
+    isEnabled: boolean;
+};
+
+export default EnablePolicyTagsParams;
diff --git a/src/libs/API/parameters/EnablePolicyTaxesParams.ts b/src/libs/API/parameters/EnablePolicyTaxesParams.ts
new file mode 100644
index 000000000000..c180bab572b0
--- /dev/null
+++ b/src/libs/API/parameters/EnablePolicyTaxesParams.ts
@@ -0,0 +1,6 @@
+type EnablePolicyTaxesParams = {
+    policyID: string;
+    isEnabled: boolean;
+};
+
+export default EnablePolicyTaxesParams;
diff --git a/src/libs/API/parameters/EnablePolicyWorkflowsParams.ts b/src/libs/API/parameters/EnablePolicyWorkflowsParams.ts
new file mode 100644
index 000000000000..ab472197f7b7
--- /dev/null
+++ b/src/libs/API/parameters/EnablePolicyWorkflowsParams.ts
@@ -0,0 +1,6 @@
+type EnablePolicyWorkflowsParams = {
+    policyID: string;
+    isEnabled: boolean;
+};
+
+export default EnablePolicyWorkflowsParams;
diff --git a/src/libs/API/parameters/index.ts b/src/libs/API/parameters/index.ts
index 4fbc597b8186..eedfc6406f05 100644
--- a/src/libs/API/parameters/index.ts
+++ b/src/libs/API/parameters/index.ts
@@ -153,3 +153,10 @@ export type {default as SetWorkspaceAutoReportingFrequencyParams} from './SetWor
 export type {default as SetWorkspaceAutoReportingMonthlyOffsetParams} from './SetWorkspaceAutoReportingMonthlyOffsetParams';
 export type {default as SetWorkspaceApprovalModeParams} from './SetWorkspaceApprovalModeParams';
 export type {default as SwitchToOldDotParams} from './SwitchToOldDotParams';
+export type {default as EnablePolicyCategoriesParams} from './EnablePolicyCategoriesParams';
+export type {default as EnablePolicyConnectionsParams} from './EnablePolicyConnectionsParams';
+export type {default as EnablePolicyDistanceRatesParams} from './EnablePolicyDistanceRatesParams';
+export type {default as EnablePolicyTagsParams} from './EnablePolicyTagsParams';
+export type {default as EnablePolicyTaxesParams} from './EnablePolicyTaxesParams';
+export type {default as EnablePolicyWorkflowsParams} from './EnablePolicyWorkflowsParams';
+export type {default as EnablePolicyReportFieldsParams} from './EnablePolicyReportFieldsParams';
diff --git a/src/libs/API/types.ts b/src/libs/API/types.ts
index ba49bc5fa27b..9a937a8cc2ff 100644
--- a/src/libs/API/types.ts
+++ b/src/libs/API/types.ts
@@ -156,6 +156,13 @@ const WRITE_COMMANDS = {
     CANCEL_PAYMENT: 'CancelPayment',
     ACCEPT_ACH_CONTRACT_FOR_BANK_ACCOUNT: 'AcceptACHContractForBankAccount',
     SWITCH_TO_OLD_DOT: 'SwitchToOldDot',
+    ENABLE_POLICY_CATEGORIES: 'EnablePolicyCategories',
+    ENABLE_POLICY_CONNECTIONS: 'EnablePolicyConnections',
+    ENABLE_POLICY_DISTANCE_RATES: 'EnablePolicyDistanceRates',
+    ENABLE_POLICY_TAGS: 'EnablePolicyTags',
+    ENABLE_POLICY_TAXES: 'EnablePolicyTaxes',
+    ENABLE_POLICY_WORKFLOWS: 'EnablePolicyWorkflows',
+    ENABLE_POLICY_REPORT_FIELDS: 'EnablePolicyReportFields',
 } as const;
 
 type WriteCommand = ValueOf<typeof WRITE_COMMANDS>;
@@ -310,6 +317,13 @@ type WriteCommandParameters = {
     [WRITE_COMMANDS.SET_WORKSPACE_AUTO_REPORTING_MONTHLY_OFFSET]: Parameters.SetWorkspaceAutoReportingMonthlyOffsetParams;
     [WRITE_COMMANDS.SET_WORKSPACE_APPROVAL_MODE]: Parameters.SetWorkspaceApprovalModeParams;
     [WRITE_COMMANDS.SWITCH_TO_OLD_DOT]: Parameters.SwitchToOldDotParams;
+    [WRITE_COMMANDS.ENABLE_POLICY_CATEGORIES]: Parameters.EnablePolicyCategoriesParams;
+    [WRITE_COMMANDS.ENABLE_POLICY_CONNECTIONS]: Parameters.EnablePolicyConnectionsParams;
+    [WRITE_COMMANDS.ENABLE_POLICY_DISTANCE_RATES]: Parameters.EnablePolicyDistanceRatesParams;
+    [WRITE_COMMANDS.ENABLE_POLICY_TAGS]: Parameters.EnablePolicyTagsParams;
+    [WRITE_COMMANDS.ENABLE_POLICY_TAXES]: Parameters.EnablePolicyTaxesParams;
+    [WRITE_COMMANDS.ENABLE_POLICY_WORKFLOWS]: Parameters.EnablePolicyWorkflowsParams;
+    [WRITE_COMMANDS.ENABLE_POLICY_REPORT_FIELDS]: Parameters.EnablePolicyReportFieldsParams;
 };
 
 const READ_COMMANDS = {
diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index 313c4deb9934..99c47d80bf67 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -15,6 +15,13 @@ import type {
     DeleteMembersFromWorkspaceParams,
     DeleteWorkspaceAvatarParams,
     DeleteWorkspaceParams,
+    EnablePolicyCategoriesParams,
+    EnablePolicyConnectionsParams,
+    EnablePolicyDistanceRatesParams,
+    EnablePolicyReportFieldsParams,
+    EnablePolicyTagsParams,
+    EnablePolicyTaxesParams,
+    EnablePolicyWorkflowsParams,
     OpenDraftWorkspaceRequestParams,
     OpenWorkspaceInvitePageParams,
     OpenWorkspaceMembersPageParams,
@@ -2487,6 +2494,353 @@ function clearCategoryErrors(policyID: string, categoryName: string) {
     });
 }
 
+function enablePolicyCategories(policyID: string, isEnabled: boolean) {
+    const optimisticData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                areCategoriesEnabled: isEnabled,
+                pendingFields: {
+                    areCategoriesEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                },
+                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+            },
+        },
+    ];
+    const successData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                pendingFields: {
+                    areCategoriesEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+    const failureData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                areCategoriesEnabled: !isEnabled,
+                pendingFields: {
+                    areCategoriesEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+
+    const parameters: EnablePolicyCategoriesParams = {policyID, isEnabled};
+
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_CATEGORIES, parameters, {
+        optimisticData,
+        successData,
+        failureData,
+    });
+}
+
+function enablePolicyConnections(policyID: string, isEnabled: boolean) {
+    const optimisticData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                areConnectionsEnabled: isEnabled,
+                pendingFields: {
+                    areConnectionsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                },
+                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+            },
+        },
+    ];
+    const successData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                pendingFields: {
+                    areConnectionsEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+    const failureData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                areConnectionsEnabled: !isEnabled,
+                pendingFields: {
+                    areConnectionsEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+
+    const parameters: EnablePolicyConnectionsParams = {policyID, isEnabled};
+
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_CONNECTIONS, parameters, {
+        optimisticData,
+        successData,
+        failureData,
+    });
+}
+
+function enablePolicyDistanceRates(policyID: string, isEnabled: boolean) {
+    const optimisticData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                areDistanceRatesEnabled: isEnabled,
+                pendingFields: {
+                    areDistanceRatesEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                },
+                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+            },
+        },
+    ];
+    const successData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                pendingFields: {
+                    areDistanceRatesEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+    const failureData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                areDistanceRatesEnabled: !isEnabled,
+                pendingFields: {
+                    areDistanceRatesEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+
+    const parameters: EnablePolicyDistanceRatesParams = {policyID, isEnabled};
+
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_DISTANCE_RATES, parameters, {
+        optimisticData,
+        successData,
+        failureData,
+    });
+}
+
+function enablePolicyReportFields(policyID: string, isEnabled: boolean) {
+    const optimisticData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                areReportFieldsEnabled: isEnabled,
+                pendingFields: {
+                    areReportFieldsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                },
+                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+            },
+        },
+    ];
+    const successData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                pendingFields: {
+                    areReportFieldsEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+    const failureData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                areReportFieldsEnabled: !isEnabled,
+                pendingFields: {
+                    areReportFieldsEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+
+    const parameters: EnablePolicyReportFieldsParams = {policyID, isEnabled};
+
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_REPORT_FIELDS, parameters, {
+        optimisticData,
+        successData,
+        failureData,
+    });
+}
+
+function enablePolicyTags(policyID: string, isEnabled: boolean) {
+    const optimisticData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                areTagsEnabled: isEnabled,
+                pendingFields: {
+                    areTagsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                },
+                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+            },
+        },
+    ];
+    const successData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                pendingFields: {
+                    areTagsEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+    const failureData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                areTagsEnabled: !isEnabled,
+                pendingFields: {
+                    areTagsEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+
+    const parameters: EnablePolicyTagsParams = {policyID, isEnabled};
+
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_TAGS, parameters, {
+        optimisticData,
+        successData,
+        failureData,
+    });
+}
+
+function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
+    const optimisticData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                tax: {
+                    trackingEnabled: isEnabled,
+                },
+                pendingFields: {
+                    isTaxTrackingEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                },
+                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+            },
+        },
+    ];
+    const successData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                pendingFields: {
+                    isTaxTrackingEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+    const failureData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                tax: {
+                    trackingEnabled: !isEnabled,
+                },
+                pendingFields: {
+                    isTaxTrackingEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+
+    const parameters: EnablePolicyTaxesParams = {policyID, isEnabled};
+
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_TAXES, parameters, {
+        optimisticData,
+        successData,
+        failureData,
+    });
+}
+
+function enablePolicyWorkflows(policyID: string, isEnabled: boolean) {
+    const optimisticData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                areWorkflowsEnabled: isEnabled,
+                pendingFields: {
+                    areWorkflowsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                },
+                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+            },
+        },
+    ];
+    const successData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                pendingFields: {
+                    areWorkflowsEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+    const failureData: OnyxUpdate[] = [
+        {
+            onyxMethod: Onyx.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                areWorkflowsEnabled: !isEnabled,
+                pendingFields: {
+                    areWorkflowsEnabled: null,
+                },
+                pendingAction: null,
+            },
+        },
+    ];
+
+    const parameters: EnablePolicyWorkflowsParams = {policyID, isEnabled};
+
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_WORKFLOWS, parameters, {
+        optimisticData,
+        successData,
+        failureData,
+    });
+}
+
 export {
     removeMembers,
     updateWorkspaceMembersRole,
@@ -2536,4 +2890,11 @@ export {
     setWorkspaceCategoryEnabled,
     setWorkspaceRequiresCategory,
     clearCategoryErrors,
+    enablePolicyCategories,
+    enablePolicyConnections,
+    enablePolicyDistanceRates,
+    enablePolicyReportFields,
+    enablePolicyTags,
+    enablePolicyTaxes,
+    enablePolicyWorkflows,
 };
diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index 6207579272f1..f09b74281b6c 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -10,6 +10,7 @@ import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import type {CentralPaneNavigatorParamList} from '@libs/Navigation/types';
+import * as Policy from '@userActions/Policy';
 import type SCREENS from '@src/SCREENS';
 import AdminPolicyAccessOrNotFoundWrapper from './AdminPolicyAccessOrNotFoundWrapper';
 import PaidPolicyAccessOrNotFoundWrapper from './PaidPolicyAccessOrNotFoundWrapper';
@@ -31,24 +32,32 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
                 icon: Illustrations.Car,
                 title: translate('workspace.moreFeatures.distanceRates.title'),
                 subtitle: translate('workspace.moreFeatures.distanceRates.subtitle'),
+                isActive: policy?.areDistanceRatesEnabled ?? false,
+                pendingAction: policy?.pendingFields?.areDistanceRatesEnabled && policy.pendingAction,
                 onToggle: (isEnabled: boolean) => {
-                    console.log('isEnabled', isEnabled);
+                    Policy.enablePolicyDistanceRates(policy?.id ?? '', isEnabled);
                 },
-                isActive: policy?.areDistanceRatesEnabled ?? false,
-                pendingAction: undefined,
             },
             {
                 icon: Illustrations.Workflows,
                 title: translate('workspace.moreFeatures.workflows.title'),
                 subtitle: translate('workspace.moreFeatures.workflows.subtitle'),
+                isActive: policy?.areWorkflowsEnabled ?? false,
+                pendingAction: policy?.pendingFields?.areWorkflowsEnabled && policy.pendingAction,
                 onToggle: (isEnabled: boolean) => {
-                    console.log('isEnabled', isEnabled);
+                    Policy.enablePolicyWorkflows(policy?.id ?? '', isEnabled);
                 },
-                isActive: policy?.areWorkflowsEnabled ?? false,
-                pendingAction: undefined,
             },
         ],
-        [policy?.areDistanceRatesEnabled, policy?.areWorkflowsEnabled, translate],
+        [
+            policy?.areDistanceRatesEnabled,
+            policy?.areWorkflowsEnabled,
+            policy?.id,
+            policy?.pendingAction,
+            policy?.pendingFields?.areDistanceRatesEnabled,
+            policy?.pendingFields?.areWorkflowsEnabled,
+            translate,
+        ],
     );
 
     const organizeItems: ToggleSettingOptionRowProps[] = useMemo(
@@ -57,44 +66,56 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
                 icon: Illustrations.FolderOpen,
                 title: translate('workspace.moreFeatures.categories.title'),
                 subtitle: translate('workspace.moreFeatures.categories.subtitle'),
+                isActive: policy?.areCategoriesEnabled ?? false,
+                pendingAction: policy?.pendingFields?.areCategoriesEnabled && policy.pendingAction,
                 onToggle: (isEnabled: boolean) => {
-                    console.log('isEnabled', isEnabled);
+                    Policy.enablePolicyCategories(policy?.id ?? '', isEnabled);
                 },
-                isActive: policy?.areCategoriesEnabled ?? false,
-                pendingAction: undefined,
             },
             {
                 icon: Illustrations.Tag,
                 title: translate('workspace.moreFeatures.tags.title'),
                 subtitle: translate('workspace.moreFeatures.tags.subtitle'),
+                isActive: policy?.areTagsEnabled ?? false,
+                pendingAction: policy?.pendingFields?.areTagsEnabled && policy.pendingAction,
                 onToggle: (isEnabled: boolean) => {
-                    console.log('isEnabled', isEnabled);
+                    Policy.enablePolicyTags(policy?.id ?? '', isEnabled);
                 },
-                isActive: policy?.areTagsEnabled ?? false,
-                pendingAction: undefined,
             },
             {
                 icon: Illustrations.Coins,
                 title: translate('workspace.moreFeatures.taxes.title'),
                 subtitle: translate('workspace.moreFeatures.taxes.subtitle'),
+                isActive: policy?.tax?.trackingEnabled ?? false,
+                pendingAction: policy?.pendingFields?.isTaxTrackingEnabled && policy.pendingAction,
                 onToggle: (isEnabled: boolean) => {
-                    console.log('isEnabled', isEnabled);
+                    Policy.enablePolicyTaxes(policy?.id ?? '', isEnabled);
                 },
-                isActive: policy?.tax?.trackingEnabled ?? false,
-                pendingAction: undefined,
             },
             {
                 icon: Illustrations.Pencil,
                 title: translate('workspace.moreFeatures.reportFields.title'),
                 subtitle: translate('workspace.moreFeatures.reportFields.subtitle'),
+                isActive: policy?.areReportFieldsEnabled ?? false,
+                pendingAction: policy?.pendingFields?.areReportFieldsEnabled && policy.pendingAction,
                 onToggle: (isEnabled: boolean) => {
-                    console.log('isEnabled', isEnabled);
+                    Policy.enablePolicyReportFields(policy?.id ?? '', isEnabled);
                 },
-                isActive: policy?.areReportFieldsEnabled ?? false,
-                pendingAction: undefined,
             },
         ],
-        [policy?.areCategoriesEnabled, policy?.areReportFieldsEnabled, policy?.areTagsEnabled, policy?.tax?.trackingEnabled, translate],
+        [
+            policy?.areCategoriesEnabled,
+            policy?.areReportFieldsEnabled,
+            policy?.areTagsEnabled,
+            policy?.id,
+            policy?.pendingAction,
+            policy?.pendingFields?.areCategoriesEnabled,
+            policy?.pendingFields?.areReportFieldsEnabled,
+            policy?.pendingFields?.areTagsEnabled,
+            policy?.pendingFields?.isTaxTrackingEnabled,
+            policy?.tax?.trackingEnabled,
+            translate,
+        ],
     );
 
     const integrateItems: ToggleSettingOptionRowProps[] = useMemo(
@@ -103,14 +124,14 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
                 icon: Illustrations.Accounting,
                 title: translate('workspace.moreFeatures.connections.title'),
                 subtitle: translate('workspace.moreFeatures.connections.subtitle'),
+                isActive: policy?.areConnectionsEnabled ?? false,
+                pendingAction: policy?.pendingFields?.areConnectionsEnabled && policy.pendingAction,
                 onToggle: (isEnabled: boolean) => {
-                    console.log('isEnabled', isEnabled);
+                    Policy.enablePolicyConnections(policy?.id ?? '', isEnabled);
                 },
-                isActive: policy?.areConnectionsEnabled ?? false,
-                pendingAction: undefined,
             },
         ],
-        [policy?.areConnectionsEnabled, translate],
+        [policy?.areConnectionsEnabled, policy?.id, policy?.pendingAction, policy?.pendingFields?.areConnectionsEnabled, translate],
     );
 
     const sections = useMemo(
@@ -143,9 +164,9 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
                 icon={item.icon}
                 title={item.title}
                 subtitle={item.subtitle}
-                onToggle={item.onToggle}
                 isActive={item.isActive}
                 pendingAction={item.pendingAction}
+                onToggle={item.onToggle}
             />
         </View>
     );

From 3358cba40501354dc4c7346f027281b78a48c688 Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Tue, 5 Mar 2024 10:42:27 +0700
Subject: [PATCH 059/110] fix: change logic scale breadscrumbs size

---
 src/components/Breadcrumbs.tsx | 9 +--------
 src/components/Text.tsx        | 7 ++-----
 src/styles/index.ts            | 4 ++--
 src/styles/variables.ts        | 1 +
 4 files changed, 6 insertions(+), 15 deletions(-)

diff --git a/src/components/Breadcrumbs.tsx b/src/components/Breadcrumbs.tsx
index d4c1a980e13d..34bc3f7e30c8 100644
--- a/src/components/Breadcrumbs.tsx
+++ b/src/components/Breadcrumbs.tsx
@@ -58,7 +58,6 @@ function Breadcrumbs({breadcrumbs, style}: BreadcrumbsProps) {
                 <Text
                     numberOfLines={1}
                     style={[styles.flexShrink1, styles.breadcrumb, styles.breadcrumbStrong]}
-                    allowFontScaling
                 >
                     {primaryBreadcrumb.text}
                 </Text>
@@ -66,16 +65,10 @@ function Breadcrumbs({breadcrumbs, style}: BreadcrumbsProps) {
 
             {!!secondaryBreadcrumb && (
                 <>
-                    <Text
-                        style={[styles.breadcrumbSeparator]}
-                        allowFontScaling
-                    >
-                        /
-                    </Text>
+                    <Text style={[styles.breadcrumbSeparator]}>/</Text>
                     <Text
                         numberOfLines={1}
                         style={[styles.mw75, styles.flexShrink0, styles.breadcrumb]}
-                        allowFontScaling
                     >
                         {secondaryBreadcrumb.text}
                     </Text>
diff --git a/src/components/Text.tsx b/src/components/Text.tsx
index 05807b1b4b74..b94530a423f7 100644
--- a/src/components/Text.tsx
+++ b/src/components/Text.tsx
@@ -27,10 +27,7 @@ type TextProps = RNTextProps &
         family?: keyof FontUtilsType['fontFamily']['platform'];
     };
 
-function Text(
-    {color, fontSize = variables.fontSizeNormal, textAlign = 'left', allowFontScaling = false, children, family = 'EXP_NEUE', style = {}, ...props}: TextProps,
-    ref: ForwardedRef<RNText>,
-) {
+function Text({color, fontSize = variables.fontSizeNormal, textAlign = 'left', children, family = 'EXP_NEUE', style = {}, ...props}: TextProps, ref: ForwardedRef<RNText>) {
     const theme = useTheme();
 
     const componentStyle: TextStyle = {
@@ -47,7 +44,7 @@ function Text(
 
     return (
         <RNText
-            allowFontScaling={allowFontScaling}
+            allowFontScaling={false}
             ref={ref}
             style={componentStyle}
             // eslint-disable-next-line react/jsx-props-no-spreading
diff --git a/src/styles/index.ts b/src/styles/index.ts
index 840b54beccc6..b30583f47559 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -1481,13 +1481,13 @@ const styles = (theme: ThemeColors) =>
 
         breadcrumb: {
             color: theme.textSupporting,
-            fontSize: variables.fontSizeh1,
+            fontSize: variables.breadcrumbsFontSize,
             ...headlineFont,
         },
 
         breadcrumbStrong: {
             color: theme.text,
-            fontSize: variables.fontSizeXLarge,
+            fontSize: variables.breadcrumbsFontSize,
         },
 
         breadcrumbSeparator: {
diff --git a/src/styles/variables.ts b/src/styles/variables.ts
index c6c29fdc4b79..a6a084f466d0 100644
--- a/src/styles/variables.ts
+++ b/src/styles/variables.ts
@@ -47,6 +47,7 @@ export default {
     avatarSizeSmallSubscript: 12,
     defaultAvatarPreviewSize: 360,
     fabBottom: 25,
+    breadcrumbsFontSize: getValueUsingPixelRatio(19, 32),
     fontSizeOnlyEmojis: 30,
     fontSizeOnlyEmojisHeight: 35,
     fontSizeSmall: getValueUsingPixelRatio(11, 17),

From 3d988c8502cba7c79fcd07a8998112ebb7717c6e Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Tue, 5 Mar 2024 13:11:14 +0100
Subject: [PATCH 060/110] integrate navigation on a screen once enable a
 feature

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

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index 99c47d80bf67..6dd1ecd5f1af 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -41,6 +41,7 @@ import {READ_COMMANDS, WRITE_COMMANDS} from '@libs/API/types';
 import DateUtils from '@libs/DateUtils';
 import * as ErrorUtils from '@libs/ErrorUtils';
 import Log from '@libs/Log';
+import Navigation from '@libs/Navigation/Navigation';
 import * as NumberUtils from '@libs/NumberUtils';
 import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils';
 import * as PhoneNumber from '@libs/PhoneNumber';
@@ -49,6 +50,7 @@ import * as ReportUtils from '@libs/ReportUtils';
 import * as TransactionUtils from '@libs/TransactionUtils';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import ROUTES from '@src/ROUTES';
 import type {
     InvitedEmailsToAccountIDs,
     PersonalDetailsList,
@@ -2541,6 +2543,10 @@ function enablePolicyCategories(policyID: string, isEnabled: boolean) {
         successData,
         failureData,
     });
+
+    if (isEnabled) {
+        Navigation.navigate(ROUTES.WORKSPACE_CATEGORIES.getRoute(policyID));
+    }
 }
 
 function enablePolicyConnections(policyID: string, isEnabled: boolean) {
@@ -2590,6 +2596,11 @@ function enablePolicyConnections(policyID: string, isEnabled: boolean) {
         successData,
         failureData,
     });
+
+    // TODO: Integrate navigation to a screen, once it appears
+    // if (isEnabled) {
+    //     Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
+    // }
 }
 
 function enablePolicyDistanceRates(policyID: string, isEnabled: boolean) {
@@ -2639,6 +2650,11 @@ function enablePolicyDistanceRates(policyID: string, isEnabled: boolean) {
         successData,
         failureData,
     });
+
+    // TODO: Integrate navigation to a screen, once it appears
+    // if (isEnabled) {
+    //     Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
+    // }
 }
 
 function enablePolicyReportFields(policyID: string, isEnabled: boolean) {
@@ -2688,6 +2704,11 @@ function enablePolicyReportFields(policyID: string, isEnabled: boolean) {
         successData,
         failureData,
     });
+
+    // TODO: Integrate navigation to a screen, once it appears
+    // if (isEnabled) {
+    //     Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
+    // }
 }
 
 function enablePolicyTags(policyID: string, isEnabled: boolean) {
@@ -2737,6 +2758,10 @@ function enablePolicyTags(policyID: string, isEnabled: boolean) {
         successData,
         failureData,
     });
+
+    if (isEnabled) {
+        Navigation.navigate(ROUTES.WORKSPACE_TAGS.getRoute(policyID));
+    }
 }
 
 function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
@@ -2790,6 +2815,11 @@ function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
         successData,
         failureData,
     });
+
+    // TODO: Integrate navigation to a screen, once it appears
+    // if (isEnabled) {
+    //     Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
+    // }
 }
 
 function enablePolicyWorkflows(policyID: string, isEnabled: boolean) {
@@ -2839,6 +2869,10 @@ function enablePolicyWorkflows(policyID: string, isEnabled: boolean) {
         successData,
         failureData,
     });
+
+    if (isEnabled) {
+        Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID));
+    }
 }
 
 export {

From b57beee0d3e1a8bc337049d2493f83b706b9e5d4 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Tue, 5 Mar 2024 13:35:09 +0100
Subject: [PATCH 061/110] use IconAsset type for icon of ToggleSettingOptionRow

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

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 62f32992601a..51b8b5091218 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -1,16 +1,16 @@
 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 IconAsset from '@src/types/utils/IconAsset';
 
 type ToggleSettingOptionRowProps = {
     /** Icon to be shown for the option */
-    icon: React.FC<SvgProps>;
+    icon: IconAsset;
     /** Title of the option */
     title: string;
     /** Subtitle of the option */

From 745523198797d784c0eeed828597e9e1c65ef80e Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Tue, 5 Mar 2024 13:35:19 +0100
Subject: [PATCH 062/110] improve perf. of WorkspaceMoreFeaturesPage

---
 .../workspace/WorkspaceMoreFeaturesPage.tsx   | 242 ++++++++----------
 1 file changed, 113 insertions(+), 129 deletions(-)

diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index f09b74281b6c..ef37e58348a7 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -1,6 +1,5 @@
-/* eslint-disable no-console */
 import type {StackScreenProps} from '@react-navigation/stack';
-import React, {useMemo} from 'react';
+import React from 'react';
 import {ScrollView, View} from 'react-native';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import * as Illustrations from '@components/Icon/Illustrations';
@@ -11,176 +10,161 @@ import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import type {CentralPaneNavigatorParamList} from '@libs/Navigation/types';
 import * as Policy from '@userActions/Policy';
+import type {TranslationPaths} from '@src/languages/types';
 import type SCREENS from '@src/SCREENS';
+import type {PendingAction} from '@src/types/onyx/OnyxCommon';
+import type IconAsset from '@src/types/utils/IconAsset';
 import AdminPolicyAccessOrNotFoundWrapper from './AdminPolicyAccessOrNotFoundWrapper';
 import PaidPolicyAccessOrNotFoundWrapper from './PaidPolicyAccessOrNotFoundWrapper';
 import type {WithPolicyAndFullscreenLoadingProps} from './withPolicyAndFullscreenLoading';
 import withPolicyAndFullscreenLoading from './withPolicyAndFullscreenLoading';
-import type {ToggleSettingOptionRowProps} from './workflows/ToggleSettingsOptionRow';
 import ToggleSettingOptionRow from './workflows/ToggleSettingsOptionRow';
 
 type WorkspaceMoreFeaturesPageProps = WithPolicyAndFullscreenLoadingProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.CATEGORIES>;
 
+type Item = {
+    icon: IconAsset;
+    titleTranslationKey: TranslationPaths;
+    subtitleTranslationKey: TranslationPaths;
+    isActive: boolean;
+    action: (isEnabled: boolean) => void;
+    pendingAction: PendingAction | undefined;
+};
+
+type SectionObject = {
+    titleTranslationKey: TranslationPaths;
+    subtitleTranslationKey: TranslationPaths;
+    items: Item[];
+};
+
 function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPageProps) {
     const styles = useThemeStyles();
     const {isSmallScreenWidth} = useWindowDimensions();
     const {translate} = useLocalize();
 
-    const spendItems: ToggleSettingOptionRowProps[] = useMemo(
-        () => [
-            {
-                icon: Illustrations.Car,
-                title: translate('workspace.moreFeatures.distanceRates.title'),
-                subtitle: translate('workspace.moreFeatures.distanceRates.subtitle'),
-                isActive: policy?.areDistanceRatesEnabled ?? false,
-                pendingAction: policy?.pendingFields?.areDistanceRatesEnabled && policy.pendingAction,
-                onToggle: (isEnabled: boolean) => {
-                    Policy.enablePolicyDistanceRates(policy?.id ?? '', isEnabled);
-                },
+    const spendItems: Item[] = [
+        {
+            icon: Illustrations.Car,
+            titleTranslationKey: 'workspace.moreFeatures.distanceRates.title',
+            subtitleTranslationKey: 'workspace.moreFeatures.distanceRates.subtitle',
+            isActive: policy?.areDistanceRatesEnabled ?? false,
+            pendingAction: policy?.pendingFields?.areDistanceRatesEnabled && policy.pendingAction,
+            action: (isEnabled: boolean) => {
+                Policy.enablePolicyDistanceRates(policy?.id ?? '', isEnabled);
             },
-            {
-                icon: Illustrations.Workflows,
-                title: translate('workspace.moreFeatures.workflows.title'),
-                subtitle: translate('workspace.moreFeatures.workflows.subtitle'),
-                isActive: policy?.areWorkflowsEnabled ?? false,
-                pendingAction: policy?.pendingFields?.areWorkflowsEnabled && policy.pendingAction,
-                onToggle: (isEnabled: boolean) => {
-                    Policy.enablePolicyWorkflows(policy?.id ?? '', isEnabled);
-                },
+        },
+        {
+            icon: Illustrations.Workflows,
+            titleTranslationKey: 'workspace.moreFeatures.workflows.title',
+            subtitleTranslationKey: 'workspace.moreFeatures.workflows.subtitle',
+            isActive: policy?.areWorkflowsEnabled ?? false,
+            pendingAction: policy?.pendingFields?.areWorkflowsEnabled && policy.pendingAction,
+            action: (isEnabled: boolean) => {
+                Policy.enablePolicyWorkflows(policy?.id ?? '', isEnabled);
             },
-        ],
-        [
-            policy?.areDistanceRatesEnabled,
-            policy?.areWorkflowsEnabled,
-            policy?.id,
-            policy?.pendingAction,
-            policy?.pendingFields?.areDistanceRatesEnabled,
-            policy?.pendingFields?.areWorkflowsEnabled,
-            translate,
-        ],
-    );
+        },
+    ];
 
-    const organizeItems: ToggleSettingOptionRowProps[] = useMemo(
-        () => [
-            {
-                icon: Illustrations.FolderOpen,
-                title: translate('workspace.moreFeatures.categories.title'),
-                subtitle: translate('workspace.moreFeatures.categories.subtitle'),
-                isActive: policy?.areCategoriesEnabled ?? false,
-                pendingAction: policy?.pendingFields?.areCategoriesEnabled && policy.pendingAction,
-                onToggle: (isEnabled: boolean) => {
-                    Policy.enablePolicyCategories(policy?.id ?? '', isEnabled);
-                },
+    const organizeItems: Item[] = [
+        {
+            icon: Illustrations.FolderOpen,
+            titleTranslationKey: 'workspace.moreFeatures.categories.title',
+            subtitleTranslationKey: 'workspace.moreFeatures.categories.subtitle',
+            isActive: policy?.areCategoriesEnabled ?? false,
+            pendingAction: policy?.pendingFields?.areCategoriesEnabled && policy.pendingAction,
+            action: (isEnabled: boolean) => {
+                Policy.enablePolicyCategories(policy?.id ?? '', isEnabled);
             },
-            {
-                icon: Illustrations.Tag,
-                title: translate('workspace.moreFeatures.tags.title'),
-                subtitle: translate('workspace.moreFeatures.tags.subtitle'),
-                isActive: policy?.areTagsEnabled ?? false,
-                pendingAction: policy?.pendingFields?.areTagsEnabled && policy.pendingAction,
-                onToggle: (isEnabled: boolean) => {
-                    Policy.enablePolicyTags(policy?.id ?? '', isEnabled);
-                },
+        },
+        {
+            icon: Illustrations.Tag,
+            titleTranslationKey: 'workspace.moreFeatures.tags.title',
+            subtitleTranslationKey: 'workspace.moreFeatures.tags.subtitle',
+            isActive: policy?.areTagsEnabled ?? false,
+            pendingAction: policy?.pendingFields?.areTagsEnabled && policy.pendingAction,
+            action: (isEnabled: boolean) => {
+                Policy.enablePolicyTags(policy?.id ?? '', isEnabled);
             },
-            {
-                icon: Illustrations.Coins,
-                title: translate('workspace.moreFeatures.taxes.title'),
-                subtitle: translate('workspace.moreFeatures.taxes.subtitle'),
-                isActive: policy?.tax?.trackingEnabled ?? false,
-                pendingAction: policy?.pendingFields?.isTaxTrackingEnabled && policy.pendingAction,
-                onToggle: (isEnabled: boolean) => {
-                    Policy.enablePolicyTaxes(policy?.id ?? '', isEnabled);
-                },
+        },
+        {
+            icon: Illustrations.Coins,
+            titleTranslationKey: 'workspace.moreFeatures.taxes.title',
+            subtitleTranslationKey: 'workspace.moreFeatures.taxes.subtitle',
+            isActive: policy?.tax?.trackingEnabled ?? false,
+            pendingAction: policy?.pendingFields?.isTaxTrackingEnabled && policy.pendingAction,
+            action: (isEnabled: boolean) => {
+                Policy.enablePolicyTaxes(policy?.id ?? '', isEnabled);
             },
-            {
-                icon: Illustrations.Pencil,
-                title: translate('workspace.moreFeatures.reportFields.title'),
-                subtitle: translate('workspace.moreFeatures.reportFields.subtitle'),
-                isActive: policy?.areReportFieldsEnabled ?? false,
-                pendingAction: policy?.pendingFields?.areReportFieldsEnabled && policy.pendingAction,
-                onToggle: (isEnabled: boolean) => {
-                    Policy.enablePolicyReportFields(policy?.id ?? '', isEnabled);
-                },
+        },
+        {
+            icon: Illustrations.Pencil,
+            titleTranslationKey: 'workspace.moreFeatures.reportFields.title',
+            subtitleTranslationKey: 'workspace.moreFeatures.reportFields.subtitle',
+            isActive: policy?.areReportFieldsEnabled ?? false,
+            pendingAction: policy?.pendingFields?.areReportFieldsEnabled && policy.pendingAction,
+            action: (isEnabled: boolean) => {
+                Policy.enablePolicyReportFields(policy?.id ?? '', isEnabled);
             },
-        ],
-        [
-            policy?.areCategoriesEnabled,
-            policy?.areReportFieldsEnabled,
-            policy?.areTagsEnabled,
-            policy?.id,
-            policy?.pendingAction,
-            policy?.pendingFields?.areCategoriesEnabled,
-            policy?.pendingFields?.areReportFieldsEnabled,
-            policy?.pendingFields?.areTagsEnabled,
-            policy?.pendingFields?.isTaxTrackingEnabled,
-            policy?.tax?.trackingEnabled,
-            translate,
-        ],
-    );
+        },
+    ];
 
-    const integrateItems: ToggleSettingOptionRowProps[] = useMemo(
-        () => [
-            {
-                icon: Illustrations.Accounting,
-                title: translate('workspace.moreFeatures.connections.title'),
-                subtitle: translate('workspace.moreFeatures.connections.subtitle'),
-                isActive: policy?.areConnectionsEnabled ?? false,
-                pendingAction: policy?.pendingFields?.areConnectionsEnabled && policy.pendingAction,
-                onToggle: (isEnabled: boolean) => {
-                    Policy.enablePolicyConnections(policy?.id ?? '', isEnabled);
-                },
+    const integrateItems: Item[] = [
+        {
+            icon: Illustrations.Accounting,
+            titleTranslationKey: 'workspace.moreFeatures.connections.title',
+            subtitleTranslationKey: 'workspace.moreFeatures.connections.subtitle',
+            isActive: policy?.areConnectionsEnabled ?? false,
+            pendingAction: policy?.pendingFields?.areConnectionsEnabled && policy.pendingAction,
+            action: (isEnabled: boolean) => {
+                Policy.enablePolicyConnections(policy?.id ?? '', isEnabled);
             },
-        ],
-        [policy?.areConnectionsEnabled, policy?.id, policy?.pendingAction, policy?.pendingFields?.areConnectionsEnabled, translate],
-    );
+        },
+    ];
 
-    const sections = useMemo(
-        () => [
-            {
-                title: translate('workspace.moreFeatures.spendSection.title'),
-                subtitle: translate('workspace.moreFeatures.spendSection.subtitle'),
-                items: spendItems,
-            },
-            {
-                title: translate('workspace.moreFeatures.organizeSection.title'),
-                subtitle: translate('workspace.moreFeatures.organizeSection.subtitle'),
-                items: organizeItems,
-            },
-            {
-                title: translate('workspace.moreFeatures.integrateSection.title'),
-                subtitle: translate('workspace.moreFeatures.integrateSection.subtitle'),
-                items: integrateItems,
-            },
-        ],
-        [integrateItems, organizeItems, spendItems, translate],
-    );
+    const sections: SectionObject[] = [
+        {
+            titleTranslationKey: 'workspace.moreFeatures.spendSection.title',
+            subtitleTranslationKey: 'workspace.moreFeatures.spendSection.subtitle',
+            items: spendItems,
+        },
+        {
+            titleTranslationKey: 'workspace.moreFeatures.organizeSection.title',
+            subtitleTranslationKey: 'workspace.moreFeatures.organizeSection.subtitle',
+            items: organizeItems,
+        },
+        {
+            titleTranslationKey: 'workspace.moreFeatures.integrateSection.title',
+            subtitleTranslationKey: 'workspace.moreFeatures.integrateSection.subtitle',
+            items: integrateItems,
+        },
+    ];
 
-    const renderItem = (item: ToggleSettingOptionRowProps) => (
+    const renderItem = (item: Item) => (
         <View
-            key={item.title}
+            key={item.titleTranslationKey}
             style={styles.mt7}
         >
             <ToggleSettingOptionRow
                 icon={item.icon}
-                title={item.title}
-                subtitle={item.subtitle}
+                title={translate(item.titleTranslationKey)}
+                subtitle={translate(item.subtitleTranslationKey)}
                 isActive={item.isActive}
                 pendingAction={item.pendingAction}
-                onToggle={item.onToggle}
+                onToggle={item.action}
             />
         </View>
     );
 
     const renderSection = (section: (typeof sections)[0]) => (
         <View
-            key={section.title}
+            key={section.titleTranslationKey}
             style={[styles.mt3, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}
         >
             <Section
                 containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
-                title={section.title}
+                title={translate(section.titleTranslationKey)}
                 titleStyles={styles.textStrong}
-                subtitle={section.subtitle}
+                subtitle={translate(section.subtitleTranslationKey)}
                 subtitleMuted
             >
                 {section.items.map(renderItem)}

From ddc0e5caa99f09ac146bf8773c6835eaf9ed8d67 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Tue, 5 Mar 2024 13:48:33 +0100
Subject: [PATCH 063/110] use another tax key

---
 src/libs/actions/Policy.ts                        | 6 +++---
 src/pages/workspace/WorkspaceMoreFeaturesPage.tsx | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index 6dd1ecd5f1af..021f972697c3 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -2774,7 +2774,7 @@ function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
                     trackingEnabled: isEnabled,
                 },
                 pendingFields: {
-                    isTaxTrackingEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                    tax: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                 },
                 pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
             },
@@ -2786,7 +2786,7 @@ function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
             key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
             value: {
                 pendingFields: {
-                    isTaxTrackingEnabled: null,
+                    tax: null,
                 },
                 pendingAction: null,
             },
@@ -2801,7 +2801,7 @@ function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
                     trackingEnabled: !isEnabled,
                 },
                 pendingFields: {
-                    isTaxTrackingEnabled: null,
+                    tax: null,
                 },
                 pendingAction: null,
             },
diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index ef37e58348a7..343093ddb577 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -91,7 +91,7 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
             titleTranslationKey: 'workspace.moreFeatures.taxes.title',
             subtitleTranslationKey: 'workspace.moreFeatures.taxes.subtitle',
             isActive: policy?.tax?.trackingEnabled ?? false,
-            pendingAction: policy?.pendingFields?.isTaxTrackingEnabled && policy.pendingAction,
+            pendingAction: policy?.pendingFields?.tax && policy.pendingAction,
             action: (isEnabled: boolean) => {
                 Policy.enablePolicyTaxes(policy?.id ?? '', isEnabled);
             },

From bdb03c09e10882112e5736336813713d3e938998 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Tue, 5 Mar 2024 14:04:19 +0100
Subject: [PATCH 064/110] show only enabled policy features

---
 src/pages/workspace/WorkspaceInitialPage.tsx | 52 ++++++++++++--------
 1 file changed, 31 insertions(+), 21 deletions(-)

diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index 45f8365e82bb..c7f71e43a485 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -149,39 +149,49 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
         },
     ];
 
-    const protectedCollectPolicyMenuItems: WorkspaceMenuItem[] = [
-        {
+    const protectedCollectPolicyMenuItems: WorkspaceMenuItem[] = [];
+
+    if (policy?.areWorkflowsEnabled) {
+        protectedCollectPolicyMenuItems.push({
             translationKey: 'workspace.common.workflows',
             icon: Expensicons.Workflows,
             action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID)))),
             routeName: SCREENS.WORKSPACE.WORKFLOWS,
-        },
-        {
-            translationKey: 'workspace.common.members',
-            icon: Expensicons.Users,
-            action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_MEMBERS.getRoute(policyID)))),
-            brickRoadIndicator: hasMembersError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
-            routeName: SCREENS.WORKSPACE.MEMBERS,
-        },
-        {
+        });
+    }
+
+    protectedCollectPolicyMenuItems.push({
+        translationKey: 'workspace.common.members',
+        icon: Expensicons.Users,
+        action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_MEMBERS.getRoute(policyID)))),
+        brickRoadIndicator: hasMembersError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
+        routeName: SCREENS.WORKSPACE.MEMBERS,
+    });
+
+    if (policy?.areCategoriesEnabled) {
+        protectedCollectPolicyMenuItems.push({
             translationKey: 'workspace.common.categories',
             icon: Expensicons.Folder,
             action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_CATEGORIES.getRoute(policyID)))),
             routeName: SCREENS.WORKSPACE.CATEGORIES,
-        },
-        {
+        });
+    }
+
+    if (policy?.areTagsEnabled) {
+        protectedCollectPolicyMenuItems.push({
             translationKey: 'workspace.common.tags',
             icon: Expensicons.Tag,
             action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_TAGS.getRoute(policyID)))),
             routeName: SCREENS.WORKSPACE.TAGS,
-        },
-        {
-            translationKey: 'workspace.common.moreFeatures',
-            icon: Expensicons.Gear,
-            action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_MORE_FEATURES.getRoute(policyID)))),
-            routeName: SCREENS.WORKSPACE.MORE_FEATURES,
-        },
-    ];
+        });
+    }
+
+    protectedCollectPolicyMenuItems.push({
+        translationKey: 'workspace.common.moreFeatures',
+        icon: Expensicons.Gear,
+        action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_MORE_FEATURES.getRoute(policyID)))),
+        routeName: SCREENS.WORKSPACE.MORE_FEATURES,
+    });
 
     const menuItems: WorkspaceMenuItem[] = [
         {

From 40f31a396f7be1a12cb9a06d5175cf9220e3e04f Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Wed, 6 Mar 2024 07:03:50 +0700
Subject: [PATCH 065/110] fix selected parent category is not displayed as
 selected

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

diff --git a/src/libs/OptionsListUtils.ts b/src/libs/OptionsListUtils.ts
index 07f0df962455..f71a19340ef8 100644
--- a/src/libs/OptionsListUtils.ts
+++ b/src/libs/OptionsListUtils.ts
@@ -908,7 +908,7 @@ function sortTags(tags: Record<string, Tag> | Tag[]) {
  * @param options[].name - a name of an option
  * @param [isOneLine] - a flag to determine if text should be one line
  */
-function getCategoryOptionTree(options: Record<string, Category> | Category[], isOneLine = false): OptionTree[] {
+function getCategoryOptionTree(options: Record<string, Category> | Category[], isOneLine = false, selectedOptionsName: string[] = []): OptionTree[] {
     const optionCollection = new Map<string, OptionTree>();
     Object.values(options).forEach((option) => {
         if (isOneLine) {
@@ -943,7 +943,7 @@ function getCategoryOptionTree(options: Record<string, Category> | Category[], i
                 searchText,
                 tooltipText: optionName,
                 isDisabled: isChild ? !option.enabled : true,
-                isSelected: !!option.isSelected,
+                isSelected: isChild ? !!option.isSelected : selectedOptionsName.includes(searchText),
             });
         });
     });
@@ -1051,7 +1051,7 @@ function getCategoryListSections(
         title: Localize.translateLocal('common.all'),
         shouldShow: true,
         indexOffset,
-        data: getCategoryOptionTree(filteredCategories),
+        data: getCategoryOptionTree(filteredCategories, false, selectedOptionNames),
     });
 
     return categorySections;

From da62731ec3cb747332b14accdf0d30d87b0e5b9e Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Wed, 6 Mar 2024 09:17:51 +0100
Subject: [PATCH 066/110] Fix TS issues in the new parts of the code

---
 src/pages/home/report/ReportActionsList.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/pages/home/report/ReportActionsList.tsx b/src/pages/home/report/ReportActionsList.tsx
index a78e59133e26..cfb00126cb91 100644
--- a/src/pages/home/report/ReportActionsList.tsx
+++ b/src/pages/home/report/ReportActionsList.tsx
@@ -131,7 +131,7 @@ function ReportActionsList({
     const route = useRoute<RouteProp<CentralPaneNavigatorParamList, typeof SCREENS.REPORT>>();
     const opacity = useSharedValue(0);
     const userActiveSince = useRef<string | null>(null);
-    const lastMessageTime = useRef(null);
+    const lastMessageTime = useRef<string | null>(null);
 
     const [isVisible, setIsVisible] = useState(false);
     const isFocused = useIsFocused();
@@ -415,22 +415,22 @@ function ReportActionsList({
 
         if (!isVisible || !isFocused) {
             if (!lastMessageTime.current) {
-                lastMessageTime.current = lodashGet(sortedVisibleReportActions, '[0].created', '');
+                lastMessageTime.current = sortedVisibleReportActions[0]?.created ?? '';
             }
             return;
         }
 
         // In case the user read new messages (after being inactive) with other device we should
         // show marker based on report.lastReadTime
-        const newMessageTimeReference = lastMessageTime.current > report.lastReadTime ? userActiveSince.current : report.lastReadTime;
+        const newMessageTimeReference = lastMessageTime.current && report.lastReadTime && lastMessageTime.current > report.lastReadTime ? userActiveSince.current : report.lastReadTime;
         lastMessageTime.current = null;
         if (
             scrollingVerticalOffset.current >= MSG_VISIBLE_THRESHOLD ||
             !(
                 sortedVisibleReportActions &&
-                _.some(
-                    sortedVisibleReportActions,
+                sortedVisibleReportActions.some(
                     (reportAction) =>
+                        newMessageTimeReference &&
                         newMessageTimeReference < reportAction.created &&
                         (ReportActionsUtils.isReportPreviewAction(reportAction) ? reportAction.childLastActorAccountID : reportAction.actorAccountID) !== Report.getCurrentUserAccountID(),
                 )

From e06a768abdeb0ced101bd0f08674a907ceed6a16 Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Wed, 6 Mar 2024 09:19:47 +0100
Subject: [PATCH 067/110] Minor code improvement

---
 src/pages/home/report/ReportActionsList.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/home/report/ReportActionsList.tsx b/src/pages/home/report/ReportActionsList.tsx
index cfb00126cb91..eba17a234112 100644
--- a/src/pages/home/report/ReportActionsList.tsx
+++ b/src/pages/home/report/ReportActionsList.tsx
@@ -160,7 +160,7 @@ function ReportActionsList({
     const lastReadTimeRef = useRef(report.lastReadTime);
 
     const sortedVisibleReportActions = useMemo(
-        () => sortedReportActions.filter((reportAction) => !!isOffline || reportAction.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE || reportAction.errors),
+        () => sortedReportActions.filter((reportAction) => isOffline || reportAction.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE || reportAction.errors),
         [sortedReportActions, isOffline],
     );
     const lastActionIndex = sortedVisibleReportActions[0]?.reportActionID;

From 12d6e5eefdca1749450fe39593ec4b097d3c7944 Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Wed, 6 Mar 2024 17:16:05 +0700
Subject: [PATCH 068/110] fix: add logo scale

---
 src/components/Breadcrumbs.tsx | 8 ++++----
 src/styles/index.ts            | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/Breadcrumbs.tsx b/src/components/Breadcrumbs.tsx
index 34bc3f7e30c8..a50f2dafb878 100644
--- a/src/components/Breadcrumbs.tsx
+++ b/src/components/Breadcrumbs.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import type {StyleProp, ViewStyle} from 'react-native';
-import {View} from 'react-native';
+import {PixelRatio, View} from 'react-native';
 import LogoComponent from '@assets/images/expensify-wordmark.svg';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
@@ -36,7 +36,7 @@ function Breadcrumbs({breadcrumbs, style}: BreadcrumbsProps) {
     const theme = useTheme();
     const styles = useThemeStyles();
     const [primaryBreadcrumb, secondaryBreadcrumb] = breadcrumbs;
-
+    const fontScale = PixelRatio.getFontScale() > 1.5 ? 1.5 : PixelRatio.getFontScale();
     return (
         <View style={[styles.flexRow, styles.alignItemsCenter, styles.gap1, styles.w100, styles.breadcrumsContainer, style]}>
             {primaryBreadcrumb.type === CONST.BREADCRUMB_TYPE.ROOT ? (
@@ -47,8 +47,8 @@ function Breadcrumbs({breadcrumbs, style}: BreadcrumbsProps) {
                                 contentFit="contain"
                                 src={LogoComponent}
                                 fill={theme.text}
-                                width={variables.lhnLogoWidth}
-                                height={variables.lhnLogoHeight}
+                                width={variables.lhnLogoWidth * fontScale}
+                                height={variables.lhnLogoHeight * fontScale}
                             />
                         }
                         shouldShowEnvironmentBadge
diff --git a/src/styles/index.ts b/src/styles/index.ts
index fdd1e33d9920..c672fdb8948c 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -1528,7 +1528,7 @@ const styles = (theme: ThemeColors) =>
 
         breadcrumbSeparator: {
             color: theme.icon,
-            fontSize: variables.fontSizeXLarge,
+            fontSize: variables.breadcrumbsFontSize,
             ...headlineFont,
         },
 

From 9350c1a61cbebe15211f33877629d4d0c518bc87 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Wed, 6 Mar 2024 17:02:35 +0100
Subject: [PATCH 069/110] improve ToggleSettingOptionRow state updates

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

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 51b8b5091218..b63f6aa93a87 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} from 'react-native';
 import Icon from '@components/Icon';
 import OfflineWithFeedback from '@components/OfflineWithFeedback';
@@ -29,11 +29,19 @@ const ICON_SIZE = 48;
 function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, isActive, pendingAction}: ToggleSettingOptionRowProps) {
     const [isEnabled, setIsEnabled] = useState(isActive);
     const styles = useThemeStyles();
+
     const toggleSwitch = () => {
-        setIsEnabled(!isEnabled);
-        onToggle(!isEnabled);
+        setIsEnabled((prev) => {
+            onToggle(!prev);
+
+            return !prev;
+        });
     };
 
+    useEffect(() => {
+        setIsEnabled(isActive);
+    }, [isActive]);
+
     return (
         <OfflineWithFeedback pendingAction={pendingAction}>
             <View style={styles.pRelative}>

From e9594bc0e31fbe5a96f37e0ffc3cde09ca0032f2 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Wed, 6 Mar 2024 18:46:01 +0100
Subject: [PATCH 070/110] simplify states of ToggleSettingOptionRow

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

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index b63f6aa93a87..673e9f59a2f6 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 from 'react';
 import {View} from 'react-native';
 import Icon from '@components/Icon';
 import OfflineWithFeedback from '@components/OfflineWithFeedback';
@@ -27,21 +27,12 @@ type ToggleSettingOptionRowProps = {
 const ICON_SIZE = 48;
 
 function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, isActive, pendingAction}: ToggleSettingOptionRowProps) {
-    const [isEnabled, setIsEnabled] = useState(isActive);
     const styles = useThemeStyles();
 
     const toggleSwitch = () => {
-        setIsEnabled((prev) => {
-            onToggle(!prev);
-
-            return !prev;
-        });
+        onToggle(!isActive);
     };
 
-    useEffect(() => {
-        setIsEnabled(isActive);
-    }, [isActive]);
-
     return (
         <OfflineWithFeedback pendingAction={pendingAction}>
             <View style={styles.pRelative}>
@@ -80,10 +71,10 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
                     <Switch
                         accessibilityLabel={subtitle}
                         onToggle={toggleSwitch}
-                        isOn={isEnabled}
+                        isOn={isActive}
                     />
                 </View>
-                {isEnabled && subMenuItems}
+                {isActive && subMenuItems}
             </View>
         </OfflineWithFeedback>
     );

From b328f492ab68bdb1de4de993a40a252527143521 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Wed, 6 Mar 2024 19:21:52 +0100
Subject: [PATCH 071/110] fix translations

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

diff --git a/src/languages/es.ts b/src/languages/es.ts
index 5b0da518f5e8..294841385cb0 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -1798,44 +1798,44 @@ export default {
         },
         moreFeatures: {
             spendSection: {
-                title: 'Gastar',
-                subtitle: 'Habilitar una funcionalidad opcional que lo ayude a escalar su equipo.',
+                title: 'Gasto',
+                subtitle: 'Habilita otras funcionalidades que ayudan a aumentar tu equipo.',
             },
             organizeSection: {
                 title: 'Organizar',
-                subtitle: 'Agrupar y analizar el gasto, registrar cada impuesto pagado.',
+                subtitle: 'Agrupa y analiza el gasto, registra cada impuesto pagado.',
             },
             integrateSection: {
                 title: 'Integrar',
-                subtitle: 'Conectar gastos de expensización a productos financieros populares.',
+                subtitle: 'Conecta Expensify a otros productos financieros populares.',
             },
             distanceRates: {
                 title: 'Tasas de distancia',
-                subtitle: 'Agregar, actualizar y hacer cumplir las tarifas.',
+                subtitle: 'Añade, actualiza y haz cumplir las tasas.',
             },
             workflows: {
                 title: 'Flujos de trabajo',
-                subtitle: 'Configure cómo se aprueba y paga el gasto.',
+                subtitle: 'Configura cómo se aprueba y paga los gastos.',
             },
             categories: {
                 title: 'Categorías',
-                subtitle: 'Rastrear y organizar el gasto.',
+                subtitle: 'Monitoriza y organiza los gastos.',
             },
             tags: {
                 title: 'Etiquetas',
-                subtitle: 'Agregue formas adicionales de clasificar el gasto.',
+                subtitle: 'Añade formas adicionales de clasificar los gastos.',
             },
             taxes: {
                 title: 'Impuestos',
-                subtitle: 'Documentar y reclamar impuestos elegibles.',
+                subtitle: 'Documenta y reclama los impuestos aplicables.',
             },
             reportFields: {
                 title: 'Campos de informes',
-                subtitle: 'Configurar campos personalizados para gastar.',
+                subtitle: 'Configura campos personalizados para los gastos.',
             },
             connections: {
                 title: 'Conexión',
-                subtitle: 'Sincronice su gráfico de cuentas y más.',
+                subtitle: 'Sincroniza tu plan de cuentas y otras opciones.',
             },
         },
         tags: {

From a20914a06bf29f0038f0cb847918560f7ceca091 Mon Sep 17 00:00:00 2001
From: jeremy-croff <jeremycroff@gmail.com>
Date: Wed, 6 Mar 2024 19:32:19 -0600
Subject: [PATCH 072/110] fix(36381): blur composer on edit

---
 src/components/BaseMiniContextMenuItem.tsx             | 10 ++++++++--
 src/components/ContextMenuItem.tsx                     |  4 ++++
 .../report/ContextMenu/BaseReportActionContextMenu.tsx |  1 +
 .../home/report/ContextMenu/ContextMenuActions.tsx     |  2 ++
 4 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/components/BaseMiniContextMenuItem.tsx b/src/components/BaseMiniContextMenuItem.tsx
index 7bed44cd8f13..86dac7371643 100644
--- a/src/components/BaseMiniContextMenuItem.tsx
+++ b/src/components/BaseMiniContextMenuItem.tsx
@@ -32,13 +32,17 @@ type BaseMiniContextMenuItemProps = {
      * Whether the button should be in the active state
      */
     isDelayButtonStateComplete: boolean;
+    /**
+     * Can be used to control the click event, and for example whether or not to lose focus from the composer when pressing the item
+     */
+    shouldPreventDefault?: boolean;
 };
 
 /**
  * Component that renders a mini context menu item with a
  * pressable. Also renders a tooltip when hovering the item.
  */
-function BaseMiniContextMenuItem({tooltipText, onPress, children, isDelayButtonStateComplete = true}: BaseMiniContextMenuItemProps, ref: ForwardedRef<View>) {
+function BaseMiniContextMenuItem({tooltipText, onPress, children, isDelayButtonStateComplete = true, shouldPreventDefault = true}: BaseMiniContextMenuItemProps, ref: ForwardedRef<View>) {
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     return (
@@ -64,7 +68,9 @@ function BaseMiniContextMenuItem({tooltipText, onPress, children, isDelayButtonS
                     }
 
                     // Prevent text input blur on left click
-                    event.preventDefault();
+                    if (shouldPreventDefault) {
+                        event.preventDefault();
+                    }
                 }}
                 accessibilityLabel={tooltipText}
                 role={CONST.ROLE.BUTTON}
diff --git a/src/components/ContextMenuItem.tsx b/src/components/ContextMenuItem.tsx
index d6c8fd973983..af4b78f7b195 100644
--- a/src/components/ContextMenuItem.tsx
+++ b/src/components/ContextMenuItem.tsx
@@ -44,6 +44,8 @@ type ContextMenuItemProps = {
 
     /** Styles to apply to ManuItem wrapper */
     wrapperStyle?: StyleProp<ViewStyle>;
+
+    shouldPreventDefault?: boolean;
 };
 
 type ContextMenuItemHandle = {
@@ -63,6 +65,7 @@ function ContextMenuItem(
         isFocused = false,
         shouldLimitWidth = true,
         wrapperStyle,
+        shouldPreventDefault = true,
     }: ContextMenuItemProps,
     ref: ForwardedRef<ContextMenuItemHandle>,
 ) {
@@ -94,6 +97,7 @@ function ContextMenuItem(
             tooltipText={itemText}
             onPress={triggerPressAndUpdateSuccess}
             isDelayButtonStateComplete={!isThrottledButtonActive}
+            shouldPreventDefault={shouldPreventDefault}
         >
             {({hovered, pressed}) => (
                 <Icon
diff --git a/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.tsx b/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.tsx
index 52b62c2d15b3..d15b7d13e0e2 100755
--- a/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.tsx
+++ b/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.tsx
@@ -257,6 +257,7 @@ function BaseReportActionContextMenu({
                             description={contextAction.getDescription?.(selection) ?? ''}
                             isAnonymousAction={contextAction.isAnonymousAction}
                             isFocused={focusedIndex === index}
+                            shouldPreventDefault={contextAction.shouldPreventDefault}
                         />
                     );
                 })}
diff --git a/src/pages/home/report/ContextMenu/ContextMenuActions.tsx b/src/pages/home/report/ContextMenu/ContextMenuActions.tsx
index 2fd0d0a964a8..f5a4ac6e7b29 100644
--- a/src/pages/home/report/ContextMenu/ContextMenuActions.tsx
+++ b/src/pages/home/report/ContextMenu/ContextMenuActions.tsx
@@ -100,6 +100,7 @@ type ContextMenuActionWithIcon = {
 type ContextMenuAction = (ContextMenuActionWithContent | ContextMenuActionWithIcon) & {
     isAnonymousAction: boolean;
     shouldShow: ShouldShow;
+    shouldPreventDefault?: boolean;
 };
 
 // A list of all the context actions in this menu.
@@ -485,6 +486,7 @@ const ContextMenuActions: ContextMenuAction[] = [
             openOverflowMenu(event as GestureResponderEvent | MouseEvent);
         },
         getDescription: () => {},
+        shouldPreventDefault: false,
     },
 ];
 

From 0dd0413552ff08951bf3441f38f9350a9e3d8bd1 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Thu, 7 Mar 2024 15:27:32 +0800
Subject: [PATCH 073/110] add safe area padding bottom

---
 .../BankInfo/substeps/Confirmation.tsx        |  99 ++++++-----
 .../ConfirmationUBO.tsx                       | 157 +++++++++--------
 .../substeps/CompanyOwnersListUBO.tsx         |  87 +++++-----
 .../PersonalInfo/substeps/Confirmation.tsx    | 163 +++++++++---------
 4 files changed, 263 insertions(+), 243 deletions(-)

diff --git a/src/pages/ReimbursementAccount/BankInfo/substeps/Confirmation.tsx b/src/pages/ReimbursementAccount/BankInfo/substeps/Confirmation.tsx
index b128d6dc75e8..cadd6aef0975 100644
--- a/src/pages/ReimbursementAccount/BankInfo/substeps/Confirmation.tsx
+++ b/src/pages/ReimbursementAccount/BankInfo/substeps/Confirmation.tsx
@@ -5,6 +5,7 @@ import {withOnyx} from 'react-native-onyx';
 import Button from '@components/Button';
 import DotIndicatorMessage from '@components/DotIndicatorMessage';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
+import SafeAreaConsumer from '@components/SafeAreaConsumer';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
 import useNetwork from '@hooks/useNetwork';
@@ -47,55 +48,59 @@ function Confirmation({reimbursementAccount, reimbursementAccountDraft, onNext,
     };
 
     return (
-        <ScrollView
-            style={styles.pt0}
-            contentContainerStyle={styles.flexGrow1}
-        >
-            <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5]}>{translate('bankAccount.letsDoubleCheck')}</Text>
-            <Text style={[styles.mt3, styles.mb3, styles.ph5, styles.textSupporting]}>{translate('bankAccount.thisBankAccount')}</Text>
-            {setupType === CONST.BANK_ACCOUNT.SUBSTEP.MANUAL && (
-                <View style={[styles.mb5]}>
-                    <MenuItemWithTopDescription
-                        description={translate('bankAccount.routingNumber')}
-                        title={values[BANK_INFO_STEP_KEYS.ROUTING_NUMBER]}
-                        shouldShowRightIcon={!bankAccountID}
-                        onPress={handleModifyAccountNumbers}
-                    />
+        <SafeAreaConsumer>
+            {({safeAreaPaddingBottomStyle}) => (
+                <ScrollView
+                    style={styles.pt0}
+                    contentContainerStyle={[styles.flexGrow1, safeAreaPaddingBottomStyle]}
+                >
+                    <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5]}>{translate('bankAccount.letsDoubleCheck')}</Text>
+                    <Text style={[styles.mt3, styles.mb3, styles.ph5, styles.textSupporting]}>{translate('bankAccount.thisBankAccount')}</Text>
+                    {setupType === CONST.BANK_ACCOUNT.SUBSTEP.MANUAL && (
+                        <View style={[styles.mb5]}>
+                            <MenuItemWithTopDescription
+                                description={translate('bankAccount.routingNumber')}
+                                title={values[BANK_INFO_STEP_KEYS.ROUTING_NUMBER]}
+                                shouldShowRightIcon={!bankAccountID}
+                                onPress={handleModifyAccountNumbers}
+                            />
 
-                    <MenuItemWithTopDescription
-                        description={translate('bankAccount.accountNumber')}
-                        title={values[BANK_INFO_STEP_KEYS.ACCOUNT_NUMBER]}
-                        shouldShowRightIcon={!bankAccountID}
-                        onPress={handleModifyAccountNumbers}
-                    />
-                </View>
+                            <MenuItemWithTopDescription
+                                description={translate('bankAccount.accountNumber')}
+                                title={values[BANK_INFO_STEP_KEYS.ACCOUNT_NUMBER]}
+                                shouldShowRightIcon={!bankAccountID}
+                                onPress={handleModifyAccountNumbers}
+                            />
+                        </View>
+                    )}
+                    {setupType === CONST.BANK_ACCOUNT.SUBSTEP.PLAID && (
+                        <MenuItemWithTopDescription
+                            description={values[BANK_INFO_STEP_KEYS.BANK_NAME]}
+                            title={`${translate('bankAccount.accountEnding')} ${(values[BANK_INFO_STEP_KEYS.ACCOUNT_NUMBER] ?? '').slice(-4)}`}
+                            shouldShowRightIcon={!bankAccountID}
+                            onPress={handleModifyAccountNumbers}
+                        />
+                    )}
+                    <View style={[styles.ph5, styles.pb5, styles.flexGrow1, styles.justifyContentEnd]}>
+                        {error && error.length > 0 && (
+                            <DotIndicatorMessage
+                                textStyles={[styles.formError]}
+                                type="error"
+                                messages={{error}}
+                            />
+                        )}
+                        <Button
+                            isLoading={isLoading}
+                            isDisabled={isLoading || isOffline}
+                            success
+                            style={[styles.w100]}
+                            onPress={onNext}
+                            text={translate('common.confirm')}
+                        />
+                    </View>
+                </ScrollView>
             )}
-            {setupType === CONST.BANK_ACCOUNT.SUBSTEP.PLAID && (
-                <MenuItemWithTopDescription
-                    description={values[BANK_INFO_STEP_KEYS.BANK_NAME]}
-                    title={`${translate('bankAccount.accountEnding')} ${(values[BANK_INFO_STEP_KEYS.ACCOUNT_NUMBER] ?? '').slice(-4)}`}
-                    shouldShowRightIcon={!bankAccountID}
-                    onPress={handleModifyAccountNumbers}
-                />
-            )}
-            <View style={[styles.ph5, styles.pb5, styles.flexGrow1, styles.justifyContentEnd]}>
-                {error && error.length > 0 && (
-                    <DotIndicatorMessage
-                        textStyles={[styles.formError]}
-                        type="error"
-                        messages={{error}}
-                    />
-                )}
-                <Button
-                    isLoading={isLoading}
-                    isDisabled={isLoading || isOffline}
-                    success
-                    style={[styles.w100]}
-                    onPress={onNext}
-                    text={translate('common.confirm')}
-                />
-            </View>
-        </ScrollView>
+        </SafeAreaConsumer>
     );
 }
 
diff --git a/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/BeneficialOwnerDetailsFormSubsteps/ConfirmationUBO.tsx b/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/BeneficialOwnerDetailsFormSubsteps/ConfirmationUBO.tsx
index 2b742ad65699..ee3f299b44a6 100644
--- a/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/BeneficialOwnerDetailsFormSubsteps/ConfirmationUBO.tsx
+++ b/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/BeneficialOwnerDetailsFormSubsteps/ConfirmationUBO.tsx
@@ -5,6 +5,7 @@ import {withOnyx} from 'react-native-onyx';
 import Button from '@components/Button';
 import DotIndicatorMessage from '@components/DotIndicatorMessage';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
+import SafeAreaConsumer from '@components/SafeAreaConsumer';
 import Text from '@components/Text';
 import TextLink from '@components/TextLink';
 import useLocalize from '@hooks/useLocalize';
@@ -38,84 +39,88 @@ function ConfirmationUBO({reimbursementAccount, reimbursementAccountDraft, onNex
     const error = reimbursementAccount ? ErrorUtils.getLatestErrorMessage(reimbursementAccount) : '';
 
     return (
-        <ScrollView
-            style={styles.pt0}
-            contentContainerStyle={styles.flexGrow1}
-        >
-            <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mb3]}>{translate('beneficialOwnerInfoStep.letsDoubleCheck')}</Text>
-            <MenuItemWithTopDescription
-                description={translate('beneficialOwnerInfoStep.legalName')}
-                title={`${values.firstName} ${values.lastName}`}
-                shouldShowRightIcon
-                onPress={() => {
-                    onMove(UBO_STEP_INDEXES.LEGAL_NAME);
-                }}
-            />
-            <MenuItemWithTopDescription
-                description={translate('common.dob')}
-                title={values.dob}
-                shouldShowRightIcon
-                onPress={() => {
-                    onMove(UBO_STEP_INDEXES.DATE_OF_BIRTH);
-                }}
-            />
-            <MenuItemWithTopDescription
-                description={translate('beneficialOwnerInfoStep.last4SSN')}
-                title={values.ssnLast4}
-                shouldShowRightIcon
-                onPress={() => {
-                    onMove(UBO_STEP_INDEXES.SSN);
-                }}
-            />
-            <MenuItemWithTopDescription
-                description={translate('beneficialOwnerInfoStep.address')}
-                title={`${values.street}, ${values.city}, ${values.state} ${values.zipCode}`}
-                shouldShowRightIcon
-                onPress={() => {
-                    onMove(UBO_STEP_INDEXES.ADDRESS);
-                }}
-            />
-
-            <Text style={[styles.mt3, styles.ph5, styles.textMicroSupporting]}>
-                {`${translate('beneficialOwnerInfoStep.byAddingThisBankAccount')} `}
-                <TextLink
-                    href={CONST.ONFIDO_FACIAL_SCAN_POLICY_URL}
-                    style={[styles.textMicro]}
-                >
-                    {translate('onfidoStep.facialScan')}
-                </TextLink>
-                {', '}
-                <TextLink
-                    href={CONST.ONFIDO_PRIVACY_POLICY_URL}
-                    style={[styles.textMicro]}
+        <SafeAreaConsumer>
+            {({safeAreaPaddingBottomStyle}) => (
+                <ScrollView
+                    style={styles.pt0}
+                    contentContainerStyle={[styles.flexGrow1, safeAreaPaddingBottomStyle]}
                 >
-                    {translate('common.privacy')}
-                </TextLink>
-                {` ${translate('common.and')} `}
-                <TextLink
-                    href={CONST.ONFIDO_TERMS_OF_SERVICE_URL}
-                    style={[styles.textMicro]}
-                >
-                    {translate('common.termsOfService')}
-                </TextLink>
-            </Text>
-            <View style={[styles.ph5, styles.mtAuto]}>
-                {error && error.length > 0 && (
-                    <DotIndicatorMessage
-                        textStyles={[styles.formError]}
-                        type="error"
-                        messages={{error}}
+                    <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mb3]}>{translate('beneficialOwnerInfoStep.letsDoubleCheck')}</Text>
+                    <MenuItemWithTopDescription
+                        description={translate('beneficialOwnerInfoStep.legalName')}
+                        title={`${values.firstName} ${values.lastName}`}
+                        shouldShowRightIcon
+                        onPress={() => {
+                            onMove(UBO_STEP_INDEXES.LEGAL_NAME);
+                        }}
+                    />
+                    <MenuItemWithTopDescription
+                        description={translate('common.dob')}
+                        title={values.dob}
+                        shouldShowRightIcon
+                        onPress={() => {
+                            onMove(UBO_STEP_INDEXES.DATE_OF_BIRTH);
+                        }}
                     />
-                )}
-                <Button
-                    isDisabled={isOffline}
-                    success
-                    style={[styles.w100, styles.mt2, styles.pb5]}
-                    onPress={onNext}
-                    text={translate('common.confirm')}
-                />
-            </View>
-        </ScrollView>
+                    <MenuItemWithTopDescription
+                        description={translate('beneficialOwnerInfoStep.last4SSN')}
+                        title={values.ssnLast4}
+                        shouldShowRightIcon
+                        onPress={() => {
+                            onMove(UBO_STEP_INDEXES.SSN);
+                        }}
+                    />
+                    <MenuItemWithTopDescription
+                        description={translate('beneficialOwnerInfoStep.address')}
+                        title={`${values.street}, ${values.city}, ${values.state} ${values.zipCode}`}
+                        shouldShowRightIcon
+                        onPress={() => {
+                            onMove(UBO_STEP_INDEXES.ADDRESS);
+                        }}
+                    />
+
+                    <Text style={[styles.mt3, styles.ph5, styles.textMicroSupporting]}>
+                        {`${translate('beneficialOwnerInfoStep.byAddingThisBankAccount')} `}
+                        <TextLink
+                            href={CONST.ONFIDO_FACIAL_SCAN_POLICY_URL}
+                            style={[styles.textMicro]}
+                        >
+                            {translate('onfidoStep.facialScan')}
+                        </TextLink>
+                        {', '}
+                        <TextLink
+                            href={CONST.ONFIDO_PRIVACY_POLICY_URL}
+                            style={[styles.textMicro]}
+                        >
+                            {translate('common.privacy')}
+                        </TextLink>
+                        {` ${translate('common.and')} `}
+                        <TextLink
+                            href={CONST.ONFIDO_TERMS_OF_SERVICE_URL}
+                            style={[styles.textMicro]}
+                        >
+                            {translate('common.termsOfService')}
+                        </TextLink>
+                    </Text>
+                    <View style={[styles.ph5, styles.mtAuto]}>
+                        {error && error.length > 0 && (
+                            <DotIndicatorMessage
+                                textStyles={[styles.formError]}
+                                type="error"
+                                messages={{error}}
+                            />
+                        )}
+                        <Button
+                            isDisabled={isOffline}
+                            success
+                            style={[styles.w100, styles.mt2, styles.pb5]}
+                            onPress={onNext}
+                            text={translate('common.confirm')}
+                        />
+                    </View>
+                </ScrollView>
+            )}
+        </SafeAreaConsumer>
     );
 }
 
diff --git a/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/CompanyOwnersListUBO.tsx b/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/CompanyOwnersListUBO.tsx
index 25ce2d7b81da..98c0dc34e54f 100644
--- a/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/CompanyOwnersListUBO.tsx
+++ b/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/CompanyOwnersListUBO.tsx
@@ -6,6 +6,7 @@ import Button from '@components/Button';
 import DotIndicatorMessage from '@components/DotIndicatorMessage';
 import * as Expensicons from '@components/Icon/Expensicons';
 import MenuItem from '@components/MenuItem';
+import SafeAreaConsumer from '@components/SafeAreaConsumer';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
 import useNetwork from '@hooks/useNetwork';
@@ -102,48 +103,52 @@ function CompanyOwnersListUBO({
         });
 
     return (
-        <ScrollView
-            style={styles.pt0}
-            contentContainerStyle={[styles.flexGrow1, styles.ph0]}
-        >
-            <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5]}>{translate('beneficialOwnerInfoStep.letsDoubleCheck')}</Text>
-            <Text style={[styles.p5, styles.textSupporting]}>{translate('beneficialOwnerInfoStep.regulationRequiresUsToVerifyTheIdentity')}</Text>
-            <View>
-                <Text style={[styles.textSupporting, styles.pv1, styles.ph5]}>{`${translate('beneficialOwnerInfoStep.owners')}:`}</Text>
-                {isUserUBO && (
-                    <MenuItem
-                        title={`${requestorData.firstName} ${requestorData.lastName}`}
-                        description={`${requestorData.requestorAddressStreet}, ${requestorData.requestorAddressCity}, ${requestorData.requestorAddressState} ${requestorData.requestorAddressZipCode}`}
-                        wrapperStyle={[styles.ph5]}
-                        icon={Expensicons.FallbackAvatar}
-                        iconWidth={40}
-                        iconHeight={40}
-                        interactive={false}
-                        shouldShowRightIcon={false}
-                        displayInDefaultIconColor
+        <SafeAreaConsumer>
+            {({safeAreaPaddingBottomStyle}) => (
+                <ScrollView
+                    style={styles.pt0}
+                    contentContainerStyle={[styles.flexGrow1, styles.ph0, safeAreaPaddingBottomStyle]}
+                >
+                    <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5]}>{translate('beneficialOwnerInfoStep.letsDoubleCheck')}</Text>
+                    <Text style={[styles.p5, styles.textSupporting]}>{translate('beneficialOwnerInfoStep.regulationRequiresUsToVerifyTheIdentity')}</Text>
+                    <View>
+                        <Text style={[styles.textSupporting, styles.pv1, styles.ph5]}>{`${translate('beneficialOwnerInfoStep.owners')}:`}</Text>
+                        {isUserUBO && (
+                            <MenuItem
+                                title={`${requestorData.firstName} ${requestorData.lastName}`}
+                                description={`${requestorData.requestorAddressStreet}, ${requestorData.requestorAddressCity}, ${requestorData.requestorAddressState} ${requestorData.requestorAddressZipCode}`}
+                                wrapperStyle={[styles.ph5]}
+                                icon={Expensicons.FallbackAvatar}
+                                iconWidth={40}
+                                iconHeight={40}
+                                interactive={false}
+                                shouldShowRightIcon={false}
+                                displayInDefaultIconColor
+                            />
+                        )}
+                        {extraBeneficialOwners}
+                    </View>
+
+                    <View style={[styles.ph5, styles.mtAuto]}>
+                        {error && error.length > 0 && (
+                            <DotIndicatorMessage
+                                textStyles={[styles.formError]}
+                                type="error"
+                                messages={{error}}
+                            />
+                        )}
+                    </View>
+                    <Button
+                        success
+                        isLoading={isLoading}
+                        isDisabled={isOffline}
+                        style={[styles.w100, styles.mt2, styles.pb5, styles.ph5]}
+                        onPress={handleUBOsConfirmation}
+                        text={translate('common.confirm')}
                     />
-                )}
-                {extraBeneficialOwners}
-            </View>
-
-            <View style={[styles.ph5, styles.mtAuto]}>
-                {error && error.length > 0 && (
-                    <DotIndicatorMessage
-                        textStyles={[styles.formError]}
-                        type="error"
-                        messages={{error}}
-                    />
-                )}
-            </View>
-            <Button
-                success
-                isLoading={isLoading}
-                isDisabled={isOffline}
-                style={[styles.w100, styles.mt2, styles.pb5, styles.ph5]}
-                onPress={handleUBOsConfirmation}
-                text={translate('common.confirm')}
-            />
-        </ScrollView>
+                </ScrollView>
+            )}
+        </SafeAreaConsumer>
     );
 }
 
diff --git a/src/pages/ReimbursementAccount/PersonalInfo/substeps/Confirmation.tsx b/src/pages/ReimbursementAccount/PersonalInfo/substeps/Confirmation.tsx
index b4272f094071..a9444b8550ba 100644
--- a/src/pages/ReimbursementAccount/PersonalInfo/substeps/Confirmation.tsx
+++ b/src/pages/ReimbursementAccount/PersonalInfo/substeps/Confirmation.tsx
@@ -5,6 +5,7 @@ import {withOnyx} from 'react-native-onyx';
 import Button from '@components/Button';
 import DotIndicatorMessage from '@components/DotIndicatorMessage';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
+import SafeAreaConsumer from '@components/SafeAreaConsumer';
 import Text from '@components/Text';
 import TextLink from '@components/TextLink';
 import useLocalize from '@hooks/useLocalize';
@@ -42,87 +43,91 @@ function Confirmation({reimbursementAccount, reimbursementAccountDraft, onNext,
     const error = ErrorUtils.getLatestErrorMessage(reimbursementAccount ?? {});
 
     return (
-        <ScrollView
-            style={styles.pt0}
-            contentContainerStyle={styles.flexGrow1}
-        >
-            <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mb3]}>{translate('personalInfoStep.letsDoubleCheck')}</Text>
-            <MenuItemWithTopDescription
-                description={translate('personalInfoStep.legalName')}
-                title={`${values[PERSONAL_INFO_STEP_KEYS.FIRST_NAME]} ${values[PERSONAL_INFO_STEP_KEYS.LAST_NAME]}`}
-                shouldShowRightIcon
-                onPress={() => {
-                    onMove(PERSONAL_INFO_STEP_INDEXES.LEGAL_NAME);
-                }}
-            />
-            <MenuItemWithTopDescription
-                description={translate('common.dob')}
-                title={values[PERSONAL_INFO_STEP_KEYS.DOB]}
-                shouldShowRightIcon
-                onPress={() => {
-                    onMove(PERSONAL_INFO_STEP_INDEXES.DATE_OF_BIRTH);
-                }}
-            />
-            <MenuItemWithTopDescription
-                description={translate('personalInfoStep.last4SSN')}
-                title={values[PERSONAL_INFO_STEP_KEYS.SSN_LAST_4]}
-                shouldShowRightIcon
-                onPress={() => {
-                    onMove(PERSONAL_INFO_STEP_INDEXES.SSN);
-                }}
-            />
-            <MenuItemWithTopDescription
-                description={translate('personalInfoStep.address')}
-                title={`${values[PERSONAL_INFO_STEP_KEYS.STREET]}, ${values[PERSONAL_INFO_STEP_KEYS.CITY]}, ${values[PERSONAL_INFO_STEP_KEYS.STATE]} ${
-                    values[PERSONAL_INFO_STEP_KEYS.ZIP_CODE]
-                }`}
-                shouldShowRightIcon
-                onPress={() => {
-                    onMove(PERSONAL_INFO_STEP_INDEXES.ADDRESS);
-                }}
-            />
-
-            <Text style={[styles.mt3, styles.ph5, styles.textMicroSupporting]}>
-                {`${translate('personalInfoStep.byAddingThisBankAccount')} `}
-                <TextLink
-                    href={CONST.ONFIDO_FACIAL_SCAN_POLICY_URL}
-                    style={[styles.textMicro]}
-                >
-                    {translate('onfidoStep.facialScan')}
-                </TextLink>
-                {', '}
-                <TextLink
-                    href={CONST.ONFIDO_PRIVACY_POLICY_URL}
-                    style={[styles.textMicro]}
+        <SafeAreaConsumer>
+            {({safeAreaPaddingBottomStyle}) => (
+                <ScrollView
+                    style={styles.pt0}
+                    contentContainerStyle={[styles.flexGrow1, safeAreaPaddingBottomStyle]}
                 >
-                    {translate('common.privacy')}
-                </TextLink>
-                {` ${translate('common.and')} `}
-                <TextLink
-                    href={CONST.ONFIDO_TERMS_OF_SERVICE_URL}
-                    style={[styles.textMicro]}
-                >
-                    {translate('common.termsOfService')}
-                </TextLink>
-            </Text>
-            <View style={[styles.ph5, styles.pb5, styles.flexGrow1, styles.justifyContentEnd]}>
-                {error && error.length > 0 && (
-                    <DotIndicatorMessage
-                        textStyles={[styles.formError]}
-                        type="error"
-                        messages={{error}}
+                    <Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mb3]}>{translate('personalInfoStep.letsDoubleCheck')}</Text>
+                    <MenuItemWithTopDescription
+                        description={translate('personalInfoStep.legalName')}
+                        title={`${values[PERSONAL_INFO_STEP_KEYS.FIRST_NAME]} ${values[PERSONAL_INFO_STEP_KEYS.LAST_NAME]}`}
+                        shouldShowRightIcon
+                        onPress={() => {
+                            onMove(PERSONAL_INFO_STEP_INDEXES.LEGAL_NAME);
+                        }}
+                    />
+                    <MenuItemWithTopDescription
+                        description={translate('common.dob')}
+                        title={values[PERSONAL_INFO_STEP_KEYS.DOB]}
+                        shouldShowRightIcon
+                        onPress={() => {
+                            onMove(PERSONAL_INFO_STEP_INDEXES.DATE_OF_BIRTH);
+                        }}
                     />
-                )}
-                <Button
-                    isDisabled={isOffline}
-                    success
-                    isLoading={isLoading}
-                    style={[styles.w100]}
-                    onPress={onNext}
-                    text={translate('common.confirm')}
-                />
-            </View>
-        </ScrollView>
+                    <MenuItemWithTopDescription
+                        description={translate('personalInfoStep.last4SSN')}
+                        title={values[PERSONAL_INFO_STEP_KEYS.SSN_LAST_4]}
+                        shouldShowRightIcon
+                        onPress={() => {
+                            onMove(PERSONAL_INFO_STEP_INDEXES.SSN);
+                        }}
+                    />
+                    <MenuItemWithTopDescription
+                        description={translate('personalInfoStep.address')}
+                        title={`${values[PERSONAL_INFO_STEP_KEYS.STREET]}, ${values[PERSONAL_INFO_STEP_KEYS.CITY]}, ${values[PERSONAL_INFO_STEP_KEYS.STATE]} ${
+                            values[PERSONAL_INFO_STEP_KEYS.ZIP_CODE]
+                        }`}
+                        shouldShowRightIcon
+                        onPress={() => {
+                            onMove(PERSONAL_INFO_STEP_INDEXES.ADDRESS);
+                        }}
+                    />
+
+                    <Text style={[styles.mt3, styles.ph5, styles.textMicroSupporting]}>
+                        {`${translate('personalInfoStep.byAddingThisBankAccount')} `}
+                        <TextLink
+                            href={CONST.ONFIDO_FACIAL_SCAN_POLICY_URL}
+                            style={[styles.textMicro]}
+                        >
+                            {translate('onfidoStep.facialScan')}
+                        </TextLink>
+                        {', '}
+                        <TextLink
+                            href={CONST.ONFIDO_PRIVACY_POLICY_URL}
+                            style={[styles.textMicro]}
+                        >
+                            {translate('common.privacy')}
+                        </TextLink>
+                        {` ${translate('common.and')} `}
+                        <TextLink
+                            href={CONST.ONFIDO_TERMS_OF_SERVICE_URL}
+                            style={[styles.textMicro]}
+                        >
+                            {translate('common.termsOfService')}
+                        </TextLink>
+                    </Text>
+                    <View style={[styles.ph5, styles.pb5, styles.flexGrow1, styles.justifyContentEnd]}>
+                        {error && error.length > 0 && (
+                            <DotIndicatorMessage
+                                textStyles={[styles.formError]}
+                                type="error"
+                                messages={{error}}
+                            />
+                        )}
+                        <Button
+                            isDisabled={isOffline}
+                            success
+                            isLoading={isLoading}
+                            style={[styles.w100]}
+                            onPress={onNext}
+                            text={translate('common.confirm')}
+                        />
+                    </View>
+                </ScrollView>
+            )}
+        </SafeAreaConsumer>
     );
 }
 

From 20bf80204756b40e295f10d50cfbb603468097ea Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Mar 2024 15:38:34 +0100
Subject: [PATCH 074/110] align icon of ToggleSettingOptionRow

---
 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 673e9f59a2f6..6616310b1001 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -44,7 +44,6 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
                             width={ICON_SIZE}
                             additionalStyles={{
                                 ...styles.mr3,
-                                ...styles.pb4,
                             }}
                         />
                         <View style={[styles.flexColumn, styles.flex1]}>

From a14dbdc3f56573e2089749da6613d1b0bd0bc3e1 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Mar 2024 16:02:21 +0100
Subject: [PATCH 075/110] navigate to initial settings for narrow devices

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

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index aaabf9322000..07113b00ddd1 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -41,6 +41,7 @@ import type {
 import {READ_COMMANDS, WRITE_COMMANDS} from '@libs/API/types';
 import DateUtils from '@libs/DateUtils';
 import * as ErrorUtils from '@libs/ErrorUtils';
+import getIsNarrowLayout from '@libs/getIsNarrowLayout';
 import Log from '@libs/Log';
 import Navigation from '@libs/Navigation/Navigation';
 import * as NumberUtils from '@libs/NumberUtils';
@@ -2611,7 +2612,9 @@ function enablePolicyCategories(policyID: string, isEnabled: boolean) {
     });
 
     if (isEnabled) {
-        Navigation.navigate(ROUTES.WORKSPACE_CATEGORIES.getRoute(policyID));
+        const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_CATEGORIES.getRoute(policyID));
+
+        navigationAction();
     }
 }
 
@@ -2665,7 +2668,9 @@ function enablePolicyConnections(policyID: string, isEnabled: boolean) {
 
     // TODO: Integrate navigation to a screen, once it appears
     // if (isEnabled) {
-    //     Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
+    //     const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
+
+    //     navigationAction();
     // }
 }
 
@@ -2719,7 +2724,9 @@ function enablePolicyDistanceRates(policyID: string, isEnabled: boolean) {
 
     // TODO: Integrate navigation to a screen, once it appears
     // if (isEnabled) {
-    //     Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
+    //     const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
+
+    //     navigationAction();
     // }
 }
 
@@ -2773,7 +2780,9 @@ function enablePolicyReportFields(policyID: string, isEnabled: boolean) {
 
     // TODO: Integrate navigation to a screen, once it appears
     // if (isEnabled) {
-    //     Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
+    //     const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
+
+    //     navigationAction();
     // }
 }
 
@@ -2826,7 +2835,9 @@ function enablePolicyTags(policyID: string, isEnabled: boolean) {
     });
 
     if (isEnabled) {
-        Navigation.navigate(ROUTES.WORKSPACE_TAGS.getRoute(policyID));
+        const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_TAGS.getRoute(policyID));
+
+        navigationAction();
     }
 }
 
@@ -2884,7 +2895,9 @@ function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
 
     // TODO: Integrate navigation to a screen, once it appears
     // if (isEnabled) {
-    //     Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
+    //     const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
+
+    //     navigationAction();
     // }
 }
 
@@ -2937,7 +2950,9 @@ function enablePolicyWorkflows(policyID: string, isEnabled: boolean) {
     });
 
     if (isEnabled) {
-        Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID));
+        const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID));
+
+        navigationAction();
     }
 }
 

From 32905202beeffadb633bc53ee630b707b8538d7e Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Mar 2024 16:09:24 +0100
Subject: [PATCH 076/110] use own ScrollView

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

diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index 343093ddb577..9ba50a86c274 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -1,9 +1,10 @@
 import type {StackScreenProps} from '@react-navigation/stack';
 import React from 'react';
-import {ScrollView, View} from 'react-native';
+import {View} from 'react-native';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import * as Illustrations from '@components/Icon/Illustrations';
 import ScreenWrapper from '@components/ScreenWrapper';
+import ScrollView from '@components/ScrollView';
 import Section from '@components/Section';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';

From 5b634a978576841b17f12a49545afc5f350ce5c1 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Mar 2024 16:33:06 +0100
Subject: [PATCH 077/110] update workflows icon

---
 .../simple-illustration__workflows.svg        | 154 +++++++++++++++++-
 1 file changed, 153 insertions(+), 1 deletion(-)

diff --git a/assets/images/simple-illustrations/simple-illustration__workflows.svg b/assets/images/simple-illustrations/simple-illustration__workflows.svg
index 47d30d54310f..b684c58126f7 100644
--- a/assets/images/simple-illustrations/simple-illustration__workflows.svg
+++ b/assets/images/simple-illustrations/simple-illustration__workflows.svg
@@ -1 +1,153 @@
-<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
+<?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 68 68" style="enable-background:new 0 0 68 68;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#5AB0FF;}
+	.st1{fill:#B0D9FF;}
+	.st2{fill:#003C73;}
+	.st3{fill:none;stroke:#003C73;stroke-linecap:round;stroke-linejoin:round;}
+</style>
+<path class="st0" d="M42.092,53.935v4.182c0,1.066-0.564,1.569-1.602,1.569h-9.171c-0.568,0-0.991-0.155-1.264-0.465l-0.042-0.056
+	c-0.197-0.254-0.291-0.601-0.291-1.048v-4.182c0-1.071,0.564-1.574,1.597-1.574h9.171c0.55,0,0.968,0.141,1.236,0.432v0.009
+	C41.97,53.061,42.092,53.437,42.092,53.935z"/>
+<path class="st0" d="M42.092,33.019v4.182c0,1.066-0.564,1.569-1.602,1.569h-9.171c-0.568,0-0.991-0.155-1.264-0.465l-0.042-0.056
+	c-0.197-0.254-0.291-0.601-0.291-1.048v-4.182c0-1.071,0.564-1.574,1.597-1.574h9.171c0.55,0,0.968,0.141,1.236,0.432v0.009
+	C41.97,32.145,42.092,32.521,42.092,33.019z"/>
+<path class="st0" d="M42.092,12.105v4.182c0,1.067-0.564,1.569-1.602,1.569h-9.171c-0.568,0-0.991-0.155-1.264-0.465l-0.042-0.056
+	c-0.197-0.254-0.291-0.601-0.291-1.048v-4.182c0-1.071,0.564-1.574,1.597-1.574h9.171c0.55,0,0.968,0.141,1.236,0.432v0.009
+	C41.97,11.231,42.092,11.607,42.092,12.105z"/>
+<path class="st1" d="M12.958,49.139H9.308c-0.569,0-0.991-0.155-1.264-0.465l-0.042-0.056C7.804,48.364,7.71,48.016,7.71,47.57
+	v-4.182c0-1.071,0.564-1.574,1.597-1.574h9.171c0.55,0,0.968,0.141,1.236,0.432v0.009c0.244,0.258,0.366,0.634,0.366,1.132v4.182
+	c0,1.067-0.564,1.569-1.602,1.569H12.958z"/>
+<path class="st1" d="M62,22.471v4.181c0,1.067-0.564,1.569-1.602,1.569h-9.171c-0.568,0-0.991-0.155-1.264-0.465L49.92,27.7
+	c-0.197-0.254-0.291-0.601-0.291-1.048v-4.181c0-1.071,0.564-1.574,1.597-1.574h9.171c0.55,0,0.968,0.141,1.236,0.432v0.009
+	C61.878,21.597,62,21.972,62,22.471z"/>
+<path class="st1" d="M17.567,11.626c0.536,0.714,0.85,1.607,0.85,2.57c0,2.377-1.926,4.304-4.304,4.304
+	c-1.184,0-2.265-0.484-3.045-1.259c-0.78-0.78-1.264-1.856-1.264-3.045c0-2.377,1.931-4.304,4.304-4.304
+	c1.414,0,2.664,0.677,3.449,1.729c0,0,0.005,0,0.005,0.005H17.567z"/>
+<path class="st2" d="M56.531,55.687l-5.826,4.506v-9.012L56.531,55.687z"/>
+<path class="st2" d="M29.722,53.936v4.181c0,0.446,0.099,0.794,0.291,1.048l-1.071-1.372l-0.038-0.07
+	c-0.127-0.235-0.188-0.531-0.188-0.893v-4.182c0-1.071,0.564-1.574,1.597-1.574h9.171c0.489,0,0.874,0.113,1.142,0.348l0.066,0.066
+	l1.034,1.311c-0.268-0.291-0.686-0.432-1.236-0.432h-9.171c-1.038,0-1.597,0.503-1.597,1.574V53.936z"/>
+<path class="st2" d="M18.478,41.809H9.307c-1.038,0-1.597,0.503-1.597,1.574v4.182c0,0.446,0.099,0.794,0.291,1.048L6.929,47.24
+	l-0.038-0.07c-0.127-0.235-0.188-0.531-0.188-0.893v-4.181c0-1.071,0.564-1.574,1.597-1.574h9.171c0.489,0,0.874,0.113,1.142,0.348
+	l0.066,0.066l1.034,1.311c-0.268-0.291-0.686-0.432-1.236-0.432V41.809z"/>
+<path class="st2" d="M60.6,20.022l1.034,1.311c-0.268-0.291-0.686-0.432-1.236-0.432h-9.171c-1.038,0-1.597,0.503-1.597,1.574v4.182
+	c0,0.446,0.099,0.794,0.291,1.048l-1.071-1.372l-0.038-0.071c-0.127-0.235-0.188-0.531-0.188-0.893v-4.181
+	c0-1.071,0.564-1.574,1.597-1.574h9.171c0.489,0,0.874,0.113,1.142,0.348l0.066,0.066V20.022z"/>
+<path class="st2" d="M29.722,12.107v4.182c0,0.446,0.099,0.794,0.291,1.048l-1.071-1.372l-0.038-0.07
+	c-0.127-0.235-0.188-0.531-0.188-0.893v-4.177c0-1.071,0.564-1.574,1.597-1.574h9.171c0.489,0,0.874,0.113,1.142,0.348l0.066,0.066
+	l1.034,1.311c-0.268-0.291-0.686-0.432-1.236-0.432h-9.171c-1.038,0-1.597,0.503-1.597,1.574V12.107z"/>
+<path class="st2" d="M16.045,9.766l0.127,0.127c0.677,0.677,1.071,1.222,1.391,1.729c-0.785-1.052-2.034-1.729-3.449-1.729
+	c-2.377,0-4.304,1.931-4.304,4.304c0,1.189,0.484,2.265,1.264,3.045l-0.019,0.019c-0.667-0.625-1.146-1.297-1.55-1.992
+	C9.063,14.591,8.8,13.783,8.8,12.909c0-2.373,1.931-4.304,4.304-4.304c1.132,0,2.166,0.442,2.937,1.161H16.045z"/>
+<path class="st2" d="M29.722,33.018v4.182c0,0.446,0.099,0.794,0.291,1.048l-1.071-1.372l-0.038-0.07
+	c-0.127-0.235-0.188-0.531-0.188-0.893V31.73c0-1.071,0.564-1.574,1.597-1.574h9.171c0.489,0,0.874,0.113,1.142,0.348l0.066,0.066
+	l1.034,1.311c-0.268-0.291-0.686-0.432-1.236-0.432h-9.171c-1.038,0-1.597,0.503-1.597,1.574V33.018z"/>
+<path class="st3" d="M17.567,11.626c0.536,0.714,0.85,1.607,0.85,2.57c0,2.377-1.926,4.304-4.304,4.304
+	c-1.184,0-2.265-0.484-3.045-1.259c-0.78-0.78-1.264-1.856-1.264-3.045c0-2.377,1.931-4.304,4.304-4.304
+	c1.414,0,2.664,0.677,3.449,1.729"/>
+<path class="st3" d="M31.323,10.531h9.167"/>
+<path class="st3" d="M31.323,17.857h9.167"/>
+<path class="st3" d="M42.092,12.106v1.757v2.424"/>
+<path class="st3" d="M29.721,12.106v4.182"/>
+<path class="st3" d="M29.721,12.105c0-1.071,0.564-1.574,1.597-1.574"/>
+<path class="st3" d="M41.726,10.964c-0.268-0.291-0.686-0.432-1.236-0.432"/>
+<path class="st3" d="M42.092,12.105c0-0.493-0.122-0.869-0.362-1.132"/>
+<path class="st3" d="M30.06,17.391c0.268,0.31,0.695,0.465,1.264,0.465"/>
+<path class="st3" d="M29.721,16.287c0,0.446,0.099,0.794,0.291,1.048"/>
+<path class="st3" d="M42.092,16.287c0,1.067-0.564,1.569-1.602,1.569"/>
+<path class="st3" d="M9.505,15.268C9.063,14.591,8.8,13.783,8.8,12.909c0-2.373,1.931-4.304,4.304-4.304
+	c1.132,0,2.166,0.442,2.937,1.161"/>
+<path class="st3" d="M30.314,9.25h9.171"/>
+<path class="st3" d="M28.716,10.822v4.177"/>
+<path class="st3" d="M28.716,10.824c0-1.071,0.564-1.574,1.597-1.574"/>
+<path class="st3" d="M40.627,9.592c-0.268-0.23-0.653-0.348-1.142-0.348"/>
+<path class="st3" d="M28.716,15c0,0.362,0.066,0.658,0.188,0.893"/>
+<path class="st3" d="M17.567,11.626c0,0,0,0-0.005-0.005c-0.319-0.507-0.714-1.057-1.391-1.729"/>
+<path class="st3" d="M11.092,17.293c0,0-0.023-0.024-0.038-0.033c-0.667-0.625-1.146-1.297-1.551-1.992"/>
+<path class="st3" d="M30.059,17.391l-0.042-0.056l-1.076-1.372"/>
+<path class="st3" d="M41.731,10.974l-0.005-0.009l-1.034-1.306"/>
+<path class="st3" d="M51.227,20.896h9.171"/>
+<path class="st3" d="M51.227,28.221h4.492h4.68"/>
+<path class="st3" d="M61.995,22.471v4.182"/>
+<path class="st3" d="M49.629,22.471v4.182"/>
+<path class="st3" d="M49.629,22.471c0-1.071,0.564-1.574,1.597-1.574"/>
+<path class="st3" d="M61.633,21.329c-0.268-0.291-0.686-0.432-1.236-0.432"/>
+<path class="st3" d="M62,22.47c0-0.493-0.122-0.869-0.362-1.132"/>
+<path class="st3" d="M49.963,27.756c0.268,0.31,0.695,0.465,1.264,0.465"/>
+<path class="st3" d="M49.629,26.652c0,0.446,0.099,0.794,0.291,1.048"/>
+<path class="st3" d="M62,26.652c0,1.067-0.564,1.569-1.602,1.569"/>
+<path class="st3" d="M50.216,19.613h5.272h3.9"/>
+<path class="st3" d="M48.619,21.188v4.182"/>
+<path class="st3" d="M48.619,21.187c0-1.071,0.564-1.574,1.597-1.574"/>
+<path class="st3" d="M60.529,19.957c-0.268-0.23-0.653-0.348-1.142-0.348"/>
+<path class="st3" d="M48.619,25.369c0,0.362,0.066,0.658,0.188,0.893"/>
+<path class="st3" d="M49.962,27.756L49.92,27.7l-1.071-1.372"/>
+<path class="st3" d="M61.638,21.339l-0.005-0.009l-1.034-1.306"/>
+<path class="st3" d="M9.307,41.809h9.171"/>
+<path class="st3" d="M9.307,49.139h3.651h5.521"/>
+<path class="st3" d="M20.076,43.383v4.182"/>
+<path class="st3" d="M7.71,43.383v4.182"/>
+<path class="st3" d="M7.71,43.383c0-1.071,0.564-1.574,1.597-1.574"/>
+<path class="st3" d="M19.715,42.247c-0.268-0.291-0.686-0.432-1.236-0.432"/>
+<path class="st3" d="M20.081,43.382c0-0.493-0.122-0.869-0.362-1.132"/>
+<path class="st3" d="M8.043,48.674c0.268,0.31,0.695,0.465,1.264,0.465"/>
+<path class="st3" d="M7.71,47.564c0,0.446,0.099,0.794,0.291,1.048"/>
+<path class="st3" d="M20.081,47.564c0,1.067-0.564,1.569-1.602,1.569"/>
+<path class="st3" d="M8.297,40.527h4.891h4.28"/>
+<path class="st3" d="M6.699,42.1v4.182"/>
+<path class="st3" d="M6.699,42.101c0-1.071,0.564-1.574,1.597-1.574"/>
+<path class="st3" d="M18.61,40.875c-0.268-0.23-0.653-0.348-1.142-0.348"/>
+<path class="st3" d="M6.699,46.281c0,0.362,0.066,0.658,0.188,0.893"/>
+<path class="st3" d="M8.043,48.674l-0.042-0.061L6.93,47.246"/>
+<path class="st3" d="M19.719,42.256l-0.005-0.009l-1.034-1.311"/>
+<path class="st3" d="M31.323,31.445h9.167"/>
+<path class="st3" d="M31.323,38.77h9.167"/>
+<path class="st3" d="M42.092,33.018v4.182"/>
+<path class="st3" d="M29.721,33.018v4.182"/>
+<path class="st3" d="M29.721,33.019c0-1.071,0.564-1.574,1.597-1.574"/>
+<path class="st3" d="M41.726,31.882c-0.268-0.291-0.686-0.432-1.236-0.432"/>
+<path class="st3" d="M42.092,33.019c0-0.493-0.122-0.869-0.362-1.132"/>
+<path class="st3" d="M30.06,38.309c0.268,0.31,0.695,0.465,1.264,0.465"/>
+<path class="st3" d="M29.721,37.199c0,0.446,0.099,0.794,0.291,1.048"/>
+<path class="st3" d="M42.092,37.199c0,1.067-0.564,1.569-1.602,1.569"/>
+<path class="st3" d="M30.314,30.162h9.171"/>
+<path class="st3" d="M28.716,31.736v4.182"/>
+<path class="st3" d="M28.716,31.736c0-1.071,0.564-1.574,1.597-1.574"/>
+<path class="st3" d="M40.627,30.504c-0.268-0.23-0.653-0.348-1.142-0.348"/>
+<path class="st3" d="M28.716,35.918c0,0.362,0.066,0.658,0.188,0.893"/>
+<path class="st3" d="M30.059,38.309l-0.042-0.061l-1.076-1.367"/>
+<path class="st3" d="M41.731,31.891l-0.005-0.009l-1.034-1.311"/>
+<path class="st3" d="M31.323,52.357h9.167"/>
+<path class="st3" d="M31.323,59.688h9.167"/>
+<path class="st3" d="M42.092,53.936v4.177"/>
+<path class="st3" d="M29.721,53.936v4.177"/>
+<path class="st3" d="M29.721,53.935c0-1.071,0.564-1.574,1.597-1.574"/>
+<path class="st3" d="M41.726,52.794c-0.268-0.291-0.686-0.432-1.236-0.432"/>
+<path class="st3" d="M42.092,53.935c0-0.493-0.122-0.869-0.362-1.132"/>
+<path class="st3" d="M30.06,59.221c0.268,0.31,0.695,0.465,1.264,0.465"/>
+<path class="st3" d="M29.721,58.113c0,0.446,0.099,0.794,0.291,1.048"/>
+<path class="st3" d="M42.092,58.113c0,1.066-0.564,1.569-1.602,1.569"/>
+<path class="st3" d="M30.314,51.074h9.171"/>
+<path class="st3" d="M28.716,52.648v4.182"/>
+<path class="st3" d="M28.716,52.648c0-1.071,0.564-1.574,1.597-1.574"/>
+<path class="st3" d="M40.627,51.422c-0.268-0.23-0.653-0.348-1.142-0.348"/>
+<path class="st3" d="M28.716,56.83c0,0.362,0.066,0.658,0.188,0.893"/>
+<path class="st3" d="M30.059,59.221l-0.042-0.061l-1.076-1.367"/>
+<path class="st3" d="M41.731,52.803l-0.005-0.009l-1.034-1.311"/>
+<path class="st3" d="M20.081,34.775h8.466"/>
+<path class="st3" d="M42.092,34.775h6.714"/>
+<path class="st3" d="M18.418,13.863h10.191"/>
+<path class="st3" d="M42.092,13.863h6.714"/>
+<path class="st3" d="M20.081,55.688h8.466"/>
+<path class="st3" d="M42.356,55.688h8.213"/>
+<path class="st3" d="M55.488,19.614c-1.052-3.261-3.28-5.751-6.676-5.751"/>
+<path class="st3" d="M48.807,34.775c3.674,0,5.976-2.904,6.911-6.554"/>
+<path class="st3" d="M13.188,40.526c1.057-3.261,3.28-5.751,6.676-5.751"/>
+<path class="st3" d="M19.865,55.688c-3.674,0-5.976-2.904-6.907-6.554c0-0.005,0-0.014-0.005-0.019"/>
+<path class="st3" d="M50.705,51.182v9.012"/>
+<path class="st3" d="M50.705,51.182l5.826,4.506"/>
+<path class="st3" d="M50.705,60.193l5.826-4.506"/>
+</svg>

From 4a9895d56f6ba08eda5a9f43a140253d333582ff Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Mar 2024 17:51:37 +0100
Subject: [PATCH 078/110] use bigger line height

---
 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 6616310b1001..9ef35b0f7e07 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -51,6 +51,7 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
                                 style={{
                                     ...styles.textMicroBold,
                                     ...styles.textNormal,
+                                    ...styles.lh20,
                                 }}
                             >
                                 {title}

From 09503fa7bdb637d8ffadfea4787ce4f9180be225 Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Fri, 8 Mar 2024 11:54:11 +0700
Subject: [PATCH 079/110] Hide delete option for fail scan request

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

diff --git a/src/components/AttachmentModal.tsx b/src/components/AttachmentModal.tsx
index eed40d75387e..c22958ff53c0 100755
--- a/src/components/AttachmentModal.tsx
+++ b/src/components/AttachmentModal.tsx
@@ -446,7 +446,7 @@ function AttachmentModal({
                 onSelected: () => downloadAttachment(),
             });
         }
-        if (TransactionUtils.hasReceipt(transaction) && !TransactionUtils.isReceiptBeingScanned(transaction) && canEditReceipt) {
+        if (TransactionUtils.hasReceipt(transaction) && !TransactionUtils.isReceiptBeingScanned(transaction) && canEditReceipt && !TransactionUtils.hasMissingSmartscanFields(transaction)) {
             menuItems.push({
                 icon: Expensicons.Trashcan,
                 text: translate('receipt.deleteReceipt'),

From 8e0eba89fb6cb823e84bbfb1ada5fdf92d1b67f1 Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Fri, 8 Mar 2024 12:35:02 +0100
Subject: [PATCH 080/110] Remove outdated TODOs

---
 src/pages/home/report/ReportActionItem.tsx              | 1 -
 src/pages/home/report/ReportActionsListItemRenderer.tsx | 1 -
 2 files changed, 2 deletions(-)

diff --git a/src/pages/home/report/ReportActionItem.tsx b/src/pages/home/report/ReportActionItem.tsx
index a37138b43039..09ab618ce164 100644
--- a/src/pages/home/report/ReportActionItem.tsx
+++ b/src/pages/home/report/ReportActionItem.tsx
@@ -865,7 +865,6 @@ function ReportActionItem({
                 )}
             </Hoverable>
             <View style={styles.reportActionSystemMessageContainer}>
-                {/* @ts-expect-error TODO check if there is a field on the reportAction object */}
                 <InlineSystemMessage message={action.error} />
             </View>
         </PressableWithSecondaryInteraction>
diff --git a/src/pages/home/report/ReportActionsListItemRenderer.tsx b/src/pages/home/report/ReportActionsListItemRenderer.tsx
index b4ea6fc5da86..47902ead9ed5 100644
--- a/src/pages/home/report/ReportActionsListItemRenderer.tsx
+++ b/src/pages/home/report/ReportActionsListItemRenderer.tsx
@@ -124,7 +124,6 @@ function ReportActionsListItemRenderer({
         />
     ) : (
         <ReportActionItem
-            // @ts-expect-error TODO: Remove this once ReportActionItem (https://github.com/Expensify/App/issues/31982) is migrated to TypeScript.
             shouldHideThreadDividerLine={shouldHideThreadDividerLine}
             report={report}
             action={action}

From 6e0735145e2f80484cdfaaa3201ec3fe2108801f Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 8 Mar 2024 12:37:41 +0100
Subject: [PATCH 081/110] add empty lines

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

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index bfe3c49af4d9..ec90a5d727e7 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -3040,6 +3040,7 @@ function acceptJoinRequest(reportID: string, reportAction: OnyxEntry<ReportActio
             },
         },
     ];
+
     const parameters = {
         requests: JSON.stringify({
             [(reportAction.originalMessage as OriginalMessageJoinPolicyChangeLog['originalMessage']).policyID]: {
@@ -3097,6 +3098,7 @@ function declineJoinRequest(reportID: string, reportAction: OnyxEntry<ReportActi
             },
         },
     ];
+
     const parameters = {
         requests: JSON.stringify({
             [(reportAction.originalMessage as OriginalMessageJoinPolicyChangeLog['originalMessage']).policyID]: {

From 5a765747099399c0577acc6171d6322b4fb47097 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 8 Mar 2024 14:36:44 +0100
Subject: [PATCH 082/110] remove the page from the modal stack

---
 src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
index 763acc1c0ead..978e338796ea 100644
--- a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
+++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx
@@ -251,7 +251,6 @@ const SettingsModalStackNavigator = createModalStackNavigator<SettingsNavigatorP
     [SCREENS.WORKSPACE.CURRENCY]: () => require('../../../pages/workspace/WorkspaceProfileCurrencyPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.CATEGORY_SETTINGS]: () => require('../../../pages/workspace/categories/CategorySettingsPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.CATEGORIES_SETTINGS]: () => require('../../../pages/workspace/categories/WorkspaceCategoriesSettingsPage').default as React.ComponentType,
-    [SCREENS.WORKSPACE.MORE_FEATURES]: () => require('../../../pages/workspace/WorkspaceMoreFeaturesPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.MEMBER_DETAILS]: () => require('../../../pages/workspace/members/WorkspaceMemberDetailsPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.MEMBER_DETAILS_ROLE_SELECTION]: () => require('../../../pages/workspace/members/WorkspaceMemberDetailsRoleSelectionPage').default as React.ComponentType,
     [SCREENS.WORKSPACE.CATEGORY_CREATE]: () => require('../../../pages/workspace/categories/CreateCategoryPage').default as React.ComponentType,

From 46dcb4c335bf61640d78d1a98829a067ae0fe817 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 8 Mar 2024 14:37:54 +0100
Subject: [PATCH 083/110] tweak Switch handler

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

diff --git a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
index 9ef35b0f7e07..c5c4465937b9 100644
--- a/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
+++ b/src/pages/workspace/workflows/ToggleSettingsOptionRow.tsx
@@ -29,10 +29,6 @@ const ICON_SIZE = 48;
 function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems, isActive, pendingAction}: ToggleSettingOptionRowProps) {
     const styles = useThemeStyles();
 
-    const toggleSwitch = () => {
-        onToggle(!isActive);
-    };
-
     return (
         <OfflineWithFeedback pendingAction={pendingAction}>
             <View style={styles.pRelative}>
@@ -70,7 +66,7 @@ function ToggleSettingOptionRow({icon, title, subtitle, onToggle, subMenuItems,
                     </View>
                     <Switch
                         accessibilityLabel={subtitle}
-                        onToggle={toggleSwitch}
+                        onToggle={onToggle}
                         isOn={isActive}
                     />
                 </View>

From 1567a46ac6cd50a952fedc787ac00938fa0717fa Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 8 Mar 2024 14:39:29 +0100
Subject: [PATCH 084/110] clarify types of WorkspaceMoreFeaturesPage

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

diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index 9ba50a86c274..7b541df3df1d 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -21,7 +21,7 @@ import type {WithPolicyAndFullscreenLoadingProps} from './withPolicyAndFullscree
 import withPolicyAndFullscreenLoading from './withPolicyAndFullscreenLoading';
 import ToggleSettingOptionRow from './workflows/ToggleSettingsOptionRow';
 
-type WorkspaceMoreFeaturesPageProps = WithPolicyAndFullscreenLoadingProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.CATEGORIES>;
+type WorkspaceMoreFeaturesPageProps = WithPolicyAndFullscreenLoadingProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.MORE_FEATURES>;
 
 type Item = {
     icon: IconAsset;
@@ -156,7 +156,7 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
         </View>
     );
 
-    const renderSection = (section: (typeof sections)[0]) => (
+    const renderSection = (section: SectionObject) => (
         <View
             key={section.titleTranslationKey}
             style={[styles.mt3, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}

From 5c91f02d826152bef740694811ae748dae31e1a8 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 8 Mar 2024 14:41:54 +0100
Subject: [PATCH 085/110] memorize render functions

---
 .../workspace/WorkspaceMoreFeaturesPage.tsx   | 64 ++++++++++---------
 1 file changed, 35 insertions(+), 29 deletions(-)

diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index 7b541df3df1d..ca380c4bec5c 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -1,5 +1,5 @@
 import type {StackScreenProps} from '@react-navigation/stack';
-import React from 'react';
+import React, {useCallback} from 'react';
 import {View} from 'react-native';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import * as Illustrations from '@components/Icon/Illustrations';
@@ -140,37 +140,43 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
         },
     ];
 
-    const renderItem = (item: Item) => (
-        <View
-            key={item.titleTranslationKey}
-            style={styles.mt7}
-        >
-            <ToggleSettingOptionRow
-                icon={item.icon}
-                title={translate(item.titleTranslationKey)}
-                subtitle={translate(item.subtitleTranslationKey)}
-                isActive={item.isActive}
-                pendingAction={item.pendingAction}
-                onToggle={item.action}
-            />
-        </View>
+    const renderItem = useCallback(
+        (item: Item) => (
+            <View
+                key={item.titleTranslationKey}
+                style={styles.mt7}
+            >
+                <ToggleSettingOptionRow
+                    icon={item.icon}
+                    title={translate(item.titleTranslationKey)}
+                    subtitle={translate(item.subtitleTranslationKey)}
+                    isActive={item.isActive}
+                    pendingAction={item.pendingAction}
+                    onToggle={item.action}
+                />
+            </View>
+        ),
+        [styles.mt7, translate],
     );
 
-    const renderSection = (section: SectionObject) => (
-        <View
-            key={section.titleTranslationKey}
-            style={[styles.mt3, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}
-        >
-            <Section
-                containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
-                title={translate(section.titleTranslationKey)}
-                titleStyles={styles.textStrong}
-                subtitle={translate(section.subtitleTranslationKey)}
-                subtitleMuted
+    const renderSection = useCallback(
+        (section: SectionObject) => (
+            <View
+                key={section.titleTranslationKey}
+                style={[styles.mt3, isSmallScreenWidth ? styles.workspaceSectionMobile : styles.workspaceSection]}
             >
-                {section.items.map(renderItem)}
-            </Section>
-        </View>
+                <Section
+                    containerStyles={isSmallScreenWidth ? styles.p5 : styles.p8}
+                    title={translate(section.titleTranslationKey)}
+                    titleStyles={styles.textStrong}
+                    subtitle={translate(section.subtitleTranslationKey)}
+                    subtitleMuted
+                >
+                    {section.items.map(renderItem)}
+                </Section>
+            </View>
+        ),
+        [isSmallScreenWidth, renderItem, styles.mt3, styles.p5, styles.p8, styles.textStrong, styles.workspaceSection, styles.workspaceSectionMobile, translate],
     );
 
     return (

From 83e22a6bb9ecfe16b0f4e4a07d09ad38a8a16328 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 8 Mar 2024 14:42:33 +0100
Subject: [PATCH 086/110] remove todo comments

---
 src/libs/actions/Policy.ts | 28 ----------------------------
 1 file changed, 28 deletions(-)

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index ec90a5d727e7..23345415eb54 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -2702,13 +2702,6 @@ function enablePolicyConnections(policyID: string, isEnabled: boolean) {
         successData,
         failureData,
     });
-
-    // TODO: Integrate navigation to a screen, once it appears
-    // if (isEnabled) {
-    //     const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
-
-    //     navigationAction();
-    // }
 }
 
 function enablePolicyDistanceRates(policyID: string, isEnabled: boolean) {
@@ -2758,13 +2751,6 @@ function enablePolicyDistanceRates(policyID: string, isEnabled: boolean) {
         successData,
         failureData,
     });
-
-    // TODO: Integrate navigation to a screen, once it appears
-    // if (isEnabled) {
-    //     const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
-
-    //     navigationAction();
-    // }
 }
 
 function enablePolicyReportFields(policyID: string, isEnabled: boolean) {
@@ -2814,13 +2800,6 @@ function enablePolicyReportFields(policyID: string, isEnabled: boolean) {
         successData,
         failureData,
     });
-
-    // TODO: Integrate navigation to a screen, once it appears
-    // if (isEnabled) {
-    //     const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
-
-    //     navigationAction();
-    // }
 }
 
 function enablePolicyTags(policyID: string, isEnabled: boolean) {
@@ -2929,13 +2908,6 @@ function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
         successData,
         failureData,
     });
-
-    // TODO: Integrate navigation to a screen, once it appears
-    // if (isEnabled) {
-    //     const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_.getRoute(policyID));
-
-    //     navigationAction();
-    // }
 }
 
 function enablePolicyWorkflows(policyID: string, isEnabled: boolean) {

From 42eeb3ed3bc3ea17b518557dc39228a813a60dd2 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 8 Mar 2024 14:53:16 +0100
Subject: [PATCH 087/110] remove pendingAction

---
 src/libs/actions/Policy.ts                    | 21 -------------------
 .../workspace/WorkspaceMoreFeaturesPage.tsx   | 14 ++++++-------
 2 files changed, 7 insertions(+), 28 deletions(-)

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index 23345415eb54..31f1dae8ebf5 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -2610,7 +2610,6 @@ function enablePolicyCategories(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areCategoriesEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                 },
-                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
             },
         },
     ];
@@ -2622,7 +2621,6 @@ function enablePolicyCategories(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areCategoriesEnabled: null,
                 },
-                pendingAction: null,
             },
         },
     ];
@@ -2635,7 +2633,6 @@ function enablePolicyCategories(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areCategoriesEnabled: null,
                 },
-                pendingAction: null,
             },
         },
     ];
@@ -2665,7 +2662,6 @@ function enablePolicyConnections(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areConnectionsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                 },
-                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
             },
         },
     ];
@@ -2677,7 +2673,6 @@ function enablePolicyConnections(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areConnectionsEnabled: null,
                 },
-                pendingAction: null,
             },
         },
     ];
@@ -2690,7 +2685,6 @@ function enablePolicyConnections(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areConnectionsEnabled: null,
                 },
-                pendingAction: null,
             },
         },
     ];
@@ -2714,7 +2708,6 @@ function enablePolicyDistanceRates(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areDistanceRatesEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                 },
-                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
             },
         },
     ];
@@ -2726,7 +2719,6 @@ function enablePolicyDistanceRates(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areDistanceRatesEnabled: null,
                 },
-                pendingAction: null,
             },
         },
     ];
@@ -2739,7 +2731,6 @@ function enablePolicyDistanceRates(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areDistanceRatesEnabled: null,
                 },
-                pendingAction: null,
             },
         },
     ];
@@ -2763,7 +2754,6 @@ function enablePolicyReportFields(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areReportFieldsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                 },
-                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
             },
         },
     ];
@@ -2775,7 +2765,6 @@ function enablePolicyReportFields(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areReportFieldsEnabled: null,
                 },
-                pendingAction: null,
             },
         },
     ];
@@ -2788,7 +2777,6 @@ function enablePolicyReportFields(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areReportFieldsEnabled: null,
                 },
-                pendingAction: null,
             },
         },
     ];
@@ -2812,7 +2800,6 @@ function enablePolicyTags(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areTagsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                 },
-                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
             },
         },
     ];
@@ -2824,7 +2811,6 @@ function enablePolicyTags(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areTagsEnabled: null,
                 },
-                pendingAction: null,
             },
         },
     ];
@@ -2837,7 +2823,6 @@ function enablePolicyTags(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areTagsEnabled: null,
                 },
-                pendingAction: null,
             },
         },
     ];
@@ -2869,7 +2854,6 @@ function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     tax: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                 },
-                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
             },
         },
     ];
@@ -2881,7 +2865,6 @@ function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     tax: null,
                 },
-                pendingAction: null,
             },
         },
     ];
@@ -2896,7 +2879,6 @@ function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     tax: null,
                 },
-                pendingAction: null,
             },
         },
     ];
@@ -2920,7 +2902,6 @@ function enablePolicyWorkflows(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areWorkflowsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                 },
-                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
             },
         },
     ];
@@ -2932,7 +2913,6 @@ function enablePolicyWorkflows(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areWorkflowsEnabled: null,
                 },
-                pendingAction: null,
             },
         },
     ];
@@ -2945,7 +2925,6 @@ function enablePolicyWorkflows(policyID: string, isEnabled: boolean) {
                 pendingFields: {
                     areWorkflowsEnabled: null,
                 },
-                pendingAction: null,
             },
         },
     ];
diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index ca380c4bec5c..6c268d977dfc 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -49,7 +49,7 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
             titleTranslationKey: 'workspace.moreFeatures.distanceRates.title',
             subtitleTranslationKey: 'workspace.moreFeatures.distanceRates.subtitle',
             isActive: policy?.areDistanceRatesEnabled ?? false,
-            pendingAction: policy?.pendingFields?.areDistanceRatesEnabled && policy.pendingAction,
+            pendingAction: policy?.pendingFields?.areDistanceRatesEnabled,
             action: (isEnabled: boolean) => {
                 Policy.enablePolicyDistanceRates(policy?.id ?? '', isEnabled);
             },
@@ -59,7 +59,7 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
             titleTranslationKey: 'workspace.moreFeatures.workflows.title',
             subtitleTranslationKey: 'workspace.moreFeatures.workflows.subtitle',
             isActive: policy?.areWorkflowsEnabled ?? false,
-            pendingAction: policy?.pendingFields?.areWorkflowsEnabled && policy.pendingAction,
+            pendingAction: policy?.pendingFields?.areWorkflowsEnabled,
             action: (isEnabled: boolean) => {
                 Policy.enablePolicyWorkflows(policy?.id ?? '', isEnabled);
             },
@@ -72,7 +72,7 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
             titleTranslationKey: 'workspace.moreFeatures.categories.title',
             subtitleTranslationKey: 'workspace.moreFeatures.categories.subtitle',
             isActive: policy?.areCategoriesEnabled ?? false,
-            pendingAction: policy?.pendingFields?.areCategoriesEnabled && policy.pendingAction,
+            pendingAction: policy?.pendingFields?.areCategoriesEnabled,
             action: (isEnabled: boolean) => {
                 Policy.enablePolicyCategories(policy?.id ?? '', isEnabled);
             },
@@ -82,7 +82,7 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
             titleTranslationKey: 'workspace.moreFeatures.tags.title',
             subtitleTranslationKey: 'workspace.moreFeatures.tags.subtitle',
             isActive: policy?.areTagsEnabled ?? false,
-            pendingAction: policy?.pendingFields?.areTagsEnabled && policy.pendingAction,
+            pendingAction: policy?.pendingFields?.areTagsEnabled,
             action: (isEnabled: boolean) => {
                 Policy.enablePolicyTags(policy?.id ?? '', isEnabled);
             },
@@ -92,7 +92,7 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
             titleTranslationKey: 'workspace.moreFeatures.taxes.title',
             subtitleTranslationKey: 'workspace.moreFeatures.taxes.subtitle',
             isActive: policy?.tax?.trackingEnabled ?? false,
-            pendingAction: policy?.pendingFields?.tax && policy.pendingAction,
+            pendingAction: policy?.pendingFields?.tax,
             action: (isEnabled: boolean) => {
                 Policy.enablePolicyTaxes(policy?.id ?? '', isEnabled);
             },
@@ -102,7 +102,7 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
             titleTranslationKey: 'workspace.moreFeatures.reportFields.title',
             subtitleTranslationKey: 'workspace.moreFeatures.reportFields.subtitle',
             isActive: policy?.areReportFieldsEnabled ?? false,
-            pendingAction: policy?.pendingFields?.areReportFieldsEnabled && policy.pendingAction,
+            pendingAction: policy?.pendingFields?.areReportFieldsEnabled,
             action: (isEnabled: boolean) => {
                 Policy.enablePolicyReportFields(policy?.id ?? '', isEnabled);
             },
@@ -115,7 +115,7 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
             titleTranslationKey: 'workspace.moreFeatures.connections.title',
             subtitleTranslationKey: 'workspace.moreFeatures.connections.subtitle',
             isActive: policy?.areConnectionsEnabled ?? false,
-            pendingAction: policy?.pendingFields?.areConnectionsEnabled && policy.pendingAction,
+            pendingAction: policy?.pendingFields?.areConnectionsEnabled,
             action: (isEnabled: boolean) => {
                 Policy.enablePolicyConnections(policy?.id ?? '', isEnabled);
             },

From 6bed5e1dd3643c5aedf553cf54ab06c032cb95d3 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 8 Mar 2024 15:01:13 +0100
Subject: [PATCH 088/110] use onyxData arrays

---
 src/libs/actions/Policy.ts | 470 ++++++++++++++++++-------------------
 1 file changed, 228 insertions(+), 242 deletions(-)

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index 31f1dae8ebf5..dbe84ab61f97 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -2601,49 +2601,47 @@ function clearCategoryErrors(policyID: string, categoryName: string) {
 }
 
 function enablePolicyCategories(policyID: string, isEnabled: boolean) {
-    const optimisticData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                areCategoriesEnabled: isEnabled,
-                pendingFields: {
-                    areCategoriesEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+    const onyxData: OnyxData = {
+        optimisticData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    areCategoriesEnabled: isEnabled,
+                    pendingFields: {
+                        areCategoriesEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                    },
                 },
             },
-        },
-    ];
-    const successData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                pendingFields: {
-                    areCategoriesEnabled: null,
+        ],
+        successData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    pendingFields: {
+                        areCategoriesEnabled: null,
+                    },
                 },
             },
-        },
-    ];
-    const failureData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                areCategoriesEnabled: !isEnabled,
-                pendingFields: {
-                    areCategoriesEnabled: null,
+        ],
+        failureData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    areCategoriesEnabled: !isEnabled,
+                    pendingFields: {
+                        areCategoriesEnabled: null,
+                    },
                 },
             },
-        },
-    ];
+        ],
+    };
 
     const parameters: EnablePolicyCategoriesParams = {policyID, isEnabled};
 
-    API.write(WRITE_COMMANDS.ENABLE_POLICY_CATEGORIES, parameters, {
-        optimisticData,
-        successData,
-        failureData,
-    });
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_CATEGORIES, parameters, onyxData);
 
     if (isEnabled) {
         const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_CATEGORIES.getRoute(policyID));
@@ -2653,187 +2651,179 @@ function enablePolicyCategories(policyID: string, isEnabled: boolean) {
 }
 
 function enablePolicyConnections(policyID: string, isEnabled: boolean) {
-    const optimisticData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                areConnectionsEnabled: isEnabled,
-                pendingFields: {
-                    areConnectionsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+    const onyxData: OnyxData = {
+        optimisticData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    areConnectionsEnabled: isEnabled,
+                    pendingFields: {
+                        areConnectionsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                    },
                 },
             },
-        },
-    ];
-    const successData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                pendingFields: {
-                    areConnectionsEnabled: null,
+        ],
+        successData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    pendingFields: {
+                        areConnectionsEnabled: null,
+                    },
                 },
             },
-        },
-    ];
-    const failureData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                areConnectionsEnabled: !isEnabled,
-                pendingFields: {
-                    areConnectionsEnabled: null,
+        ],
+        failureData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    areConnectionsEnabled: !isEnabled,
+                    pendingFields: {
+                        areConnectionsEnabled: null,
+                    },
                 },
             },
-        },
-    ];
+        ],
+    };
 
     const parameters: EnablePolicyConnectionsParams = {policyID, isEnabled};
 
-    API.write(WRITE_COMMANDS.ENABLE_POLICY_CONNECTIONS, parameters, {
-        optimisticData,
-        successData,
-        failureData,
-    });
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_CONNECTIONS, parameters, onyxData);
 }
 
 function enablePolicyDistanceRates(policyID: string, isEnabled: boolean) {
-    const optimisticData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                areDistanceRatesEnabled: isEnabled,
-                pendingFields: {
-                    areDistanceRatesEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+    const onyxData: OnyxData = {
+        optimisticData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    areDistanceRatesEnabled: isEnabled,
+                    pendingFields: {
+                        areDistanceRatesEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                    },
                 },
             },
-        },
-    ];
-    const successData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                pendingFields: {
-                    areDistanceRatesEnabled: null,
+        ],
+        successData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    pendingFields: {
+                        areDistanceRatesEnabled: null,
+                    },
                 },
             },
-        },
-    ];
-    const failureData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                areDistanceRatesEnabled: !isEnabled,
-                pendingFields: {
-                    areDistanceRatesEnabled: null,
+        ],
+        failureData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    areDistanceRatesEnabled: !isEnabled,
+                    pendingFields: {
+                        areDistanceRatesEnabled: null,
+                    },
                 },
             },
-        },
-    ];
+        ],
+    };
 
     const parameters: EnablePolicyDistanceRatesParams = {policyID, isEnabled};
 
-    API.write(WRITE_COMMANDS.ENABLE_POLICY_DISTANCE_RATES, parameters, {
-        optimisticData,
-        successData,
-        failureData,
-    });
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_DISTANCE_RATES, parameters, onyxData);
 }
 
 function enablePolicyReportFields(policyID: string, isEnabled: boolean) {
-    const optimisticData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                areReportFieldsEnabled: isEnabled,
-                pendingFields: {
-                    areReportFieldsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+    const onyxData: OnyxData = {
+        optimisticData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    areReportFieldsEnabled: isEnabled,
+                    pendingFields: {
+                        areReportFieldsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                    },
                 },
             },
-        },
-    ];
-    const successData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                pendingFields: {
-                    areReportFieldsEnabled: null,
+        ],
+        successData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    pendingFields: {
+                        areReportFieldsEnabled: null,
+                    },
                 },
             },
-        },
-    ];
-    const failureData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                areReportFieldsEnabled: !isEnabled,
-                pendingFields: {
-                    areReportFieldsEnabled: null,
+        ],
+        failureData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    areReportFieldsEnabled: !isEnabled,
+                    pendingFields: {
+                        areReportFieldsEnabled: null,
+                    },
                 },
             },
-        },
-    ];
+        ],
+    };
 
     const parameters: EnablePolicyReportFieldsParams = {policyID, isEnabled};
 
-    API.write(WRITE_COMMANDS.ENABLE_POLICY_REPORT_FIELDS, parameters, {
-        optimisticData,
-        successData,
-        failureData,
-    });
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_REPORT_FIELDS, parameters, onyxData);
 }
 
 function enablePolicyTags(policyID: string, isEnabled: boolean) {
-    const optimisticData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                areTagsEnabled: isEnabled,
-                pendingFields: {
-                    areTagsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+    const onyxData: OnyxData = {
+        optimisticData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    areTagsEnabled: isEnabled,
+                    pendingFields: {
+                        areTagsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                    },
                 },
             },
-        },
-    ];
-    const successData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                pendingFields: {
-                    areTagsEnabled: null,
+        ],
+        successData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    pendingFields: {
+                        areTagsEnabled: null,
+                    },
                 },
             },
-        },
-    ];
-    const failureData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                areTagsEnabled: !isEnabled,
-                pendingFields: {
-                    areTagsEnabled: null,
+        ],
+        failureData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    areTagsEnabled: !isEnabled,
+                    pendingFields: {
+                        areTagsEnabled: null,
+                    },
                 },
             },
-        },
-    ];
+        ],
+    };
 
     const parameters: EnablePolicyTagsParams = {policyID, isEnabled};
 
-    API.write(WRITE_COMMANDS.ENABLE_POLICY_TAGS, parameters, {
-        optimisticData,
-        successData,
-        failureData,
-    });
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_TAGS, parameters, onyxData);
 
     if (isEnabled) {
         const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_TAGS.getRoute(policyID));
@@ -2843,99 +2833,95 @@ function enablePolicyTags(policyID: string, isEnabled: boolean) {
 }
 
 function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
-    const optimisticData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                tax: {
-                    trackingEnabled: isEnabled,
-                },
-                pendingFields: {
-                    tax: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+    const onyxData: OnyxData = {
+        optimisticData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    tax: {
+                        trackingEnabled: isEnabled,
+                    },
+                    pendingFields: {
+                        tax: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                    },
                 },
             },
-        },
-    ];
-    const successData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                pendingFields: {
-                    tax: null,
+        ],
+        successData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    pendingFields: {
+                        tax: null,
+                    },
                 },
             },
-        },
-    ];
-    const failureData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                tax: {
-                    trackingEnabled: !isEnabled,
-                },
-                pendingFields: {
-                    tax: null,
+        ],
+        failureData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    tax: {
+                        trackingEnabled: !isEnabled,
+                    },
+                    pendingFields: {
+                        tax: null,
+                    },
                 },
             },
-        },
-    ];
+        ],
+    };
 
     const parameters: EnablePolicyTaxesParams = {policyID, isEnabled};
 
-    API.write(WRITE_COMMANDS.ENABLE_POLICY_TAXES, parameters, {
-        optimisticData,
-        successData,
-        failureData,
-    });
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_TAXES, parameters, onyxData);
 }
 
 function enablePolicyWorkflows(policyID: string, isEnabled: boolean) {
-    const optimisticData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                areWorkflowsEnabled: isEnabled,
-                pendingFields: {
-                    areWorkflowsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+    const onyxData: OnyxData = {
+        optimisticData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    areWorkflowsEnabled: isEnabled,
+                    pendingFields: {
+                        areWorkflowsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
+                    },
                 },
             },
-        },
-    ];
-    const successData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                pendingFields: {
-                    areWorkflowsEnabled: null,
+        ],
+        successData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    pendingFields: {
+                        areWorkflowsEnabled: null,
+                    },
                 },
             },
-        },
-    ];
-    const failureData: OnyxUpdate[] = [
-        {
-            onyxMethod: Onyx.METHOD.MERGE,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: {
-                areWorkflowsEnabled: !isEnabled,
-                pendingFields: {
-                    areWorkflowsEnabled: null,
+        ],
+        failureData: [
+            {
+                onyxMethod: Onyx.METHOD.MERGE,
+                key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+                value: {
+                    areWorkflowsEnabled: !isEnabled,
+                    pendingFields: {
+                        areWorkflowsEnabled: null,
+                    },
                 },
             },
-        },
-    ];
+        ],
+    };
 
     const parameters: EnablePolicyWorkflowsParams = {policyID, isEnabled};
 
-    API.write(WRITE_COMMANDS.ENABLE_POLICY_WORKFLOWS, parameters, {
-        optimisticData,
-        successData,
-        failureData,
-    });
+    API.write(WRITE_COMMANDS.ENABLE_POLICY_WORKFLOWS, parameters, onyxData);
 
     if (isEnabled) {
         const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID));

From 129bac585490db92e79075ad4690cddbd4302407 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 8 Mar 2024 15:01:58 +0100
Subject: [PATCH 089/110] clarify screen name

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

diff --git a/src/SCREENS.ts b/src/SCREENS.ts
index 699f1b4b3a00..ba378b28b4be 100644
--- a/src/SCREENS.ts
+++ b/src/SCREENS.ts
@@ -227,7 +227,7 @@ const SCREENS = {
         CATEGORY_CREATE: 'Category_Create',
         CATEGORY_SETTINGS: 'Category_Settings',
         CATEGORIES_SETTINGS: 'Categories_Settings',
-        MORE_FEATURES: 'More_Features',
+        MORE_FEATURES: 'Workspace_More_Features',
         MEMBER_DETAILS: 'Workspace_Member_Details',
         MEMBER_DETAILS_ROLE_SELECTION: 'Workspace_Member_Details_Role_Selection',
     },

From ad9b75bbb03ec97db1ec1733f5019bc093ac0043 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 8 Mar 2024 16:55:54 +0100
Subject: [PATCH 090/110] simplify deps. arrays

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

diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index 6c268d977dfc..8b539ad58f9d 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -156,7 +156,7 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
                 />
             </View>
         ),
-        [styles.mt7, translate],
+        [styles, translate],
     );
 
     const renderSection = useCallback(
@@ -176,7 +176,7 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
                 </Section>
             </View>
         ),
-        [isSmallScreenWidth, renderItem, styles.mt3, styles.p5, styles.p8, styles.textStrong, styles.workspaceSection, styles.workspaceSectionMobile, translate],
+        [isSmallScreenWidth, styles, renderItem, translate],
     );
 
     return (

From 50aaeca20e72ac2c556b85a9c7a86b34ac74f86b Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Sat, 9 Mar 2024 01:50:13 +0800
Subject: [PATCH 091/110] don't use fallback route

---
 src/pages/settings/Wallet/TransferBalancePage.tsx | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/pages/settings/Wallet/TransferBalancePage.tsx b/src/pages/settings/Wallet/TransferBalancePage.tsx
index 85b7bef0550c..b50e5520a999 100644
--- a/src/pages/settings/Wallet/TransferBalancePage.tsx
+++ b/src/pages/settings/Wallet/TransferBalancePage.tsx
@@ -156,12 +156,10 @@ function TransferBalancePage({bankAccountList, fundList, userWallet, walletTrans
                 titleKey="notFound.pageNotFound"
                 subtitleKey="transferAmountPage.notHereSubTitle"
                 linkKey="transferAmountPage.goToWallet"
-                onLinkPress={() => Navigation.goBack(ROUTES.SETTINGS_WALLET)}
             >
                 <HeaderWithBackButton
                     title={translate('common.transferBalance')}
                     shouldShowBackButton
-                    onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_WALLET)}
                 />
                 <View style={[styles.flexGrow1, styles.flexShrink1, styles.flexBasisAuto, styles.justifyContentCenter]}>
                     <CurrentWalletBalance balanceStyles={[styles.transferBalanceBalance]} />

From ee9a78a05f6e5059e0a580caaec542fc4513f124 Mon Sep 17 00:00:00 2001
From: ShridharGoel <35566748+ShridharGoel@users.noreply.github.com>
Date: Fri, 1 Mar 2024 16:53:15 +0530
Subject: [PATCH 092/110] Show only one update available notification at a time

---
 .../LocalNotification/BrowserNotifications.ts | 25 ++++++++++++++++---
 1 file changed, 21 insertions(+), 4 deletions(-)

diff --git a/src/libs/Notification/LocalNotification/BrowserNotifications.ts b/src/libs/Notification/LocalNotification/BrowserNotifications.ts
index 8908b91c4f42..2a0dfc1cd91a 100644
--- a/src/libs/Notification/LocalNotification/BrowserNotifications.ts
+++ b/src/libs/Notification/LocalNotification/BrowserNotifications.ts
@@ -44,7 +44,15 @@ function canUseBrowserNotifications(): Promise<boolean> {
  * @param icon Path to icon
  * @param data extra data to attach to the notification
  */
-function push(title: string, body = '', icon: string | ImageSourcePropType = '', data: LocalNotificationData = {}, onClick: LocalNotificationClickHandler = () => {}, silent = false) {
+function push(
+    title: string,
+    body = '',
+    icon: string | ImageSourcePropType = '',
+    data: LocalNotificationData = {},
+    onClick: LocalNotificationClickHandler = () => {},
+    silent = false,
+    tag = '',
+) {
     canUseBrowserNotifications().then((canUseNotifications) => {
         if (!canUseNotifications) {
             return;
@@ -57,6 +65,7 @@ function push(title: string, body = '', icon: string | ImageSourcePropType = '',
             icon: String(icon),
             data,
             silent,
+            tag,
         });
         notificationCache[notificationID].onclick = () => {
             onClick();
@@ -124,9 +133,17 @@ export default {
      * Create a notification to indicate that an update is available.
      */
     pushUpdateAvailableNotification() {
-        push('Update available', 'A new version of this app is available!', '', {}, () => {
-            AppUpdate.triggerUpdateAvailable();
-        });
+        push(
+            'Update available',
+            'A new version of this app is available!',
+            '',
+            {},
+            () => {
+                AppUpdate.triggerUpdateAvailable();
+            },
+            false,
+            'UpdateAvailable',
+        );
     },
 
     /**

From 54bed631cf894298e88ffe6caf9b3d83c3e8e633 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Sat, 9 Mar 2024 10:30:22 +0100
Subject: [PATCH 093/110] add bottom padding

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

diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index 8b539ad58f9d..e2539c60d234 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -194,7 +194,7 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
                         shouldShowBackButton={isSmallScreenWidth}
                     />
 
-                    <ScrollView>{sections.map(renderSection)}</ScrollView>
+                    <ScrollView contentContainerStyle={styles.pb2}>{sections.map(renderSection)}</ScrollView>
                 </ScreenWrapper>
             </PaidPolicyAccessOrNotFoundWrapper>
         </AdminPolicyAccessOrNotFoundWrapper>

From 4b816cf500a88e653277222c409776bda1da8150 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Sat, 9 Mar 2024 10:33:00 +0100
Subject: [PATCH 094/110] rename to enabled

---
 .../EnablePolicyCategoriesParams.ts           |  2 +-
 .../EnablePolicyConnectionsParams.ts          |  2 +-
 .../EnablePolicyDistanceRatesParams.ts        |  2 +-
 .../EnablePolicyReportFieldsParams.ts         |  2 +-
 .../API/parameters/EnablePolicyTagsParams.ts  |  2 +-
 .../API/parameters/EnablePolicyTaxesParams.ts |  2 +-
 .../parameters/EnablePolicyWorkflowsParams.ts |  2 +-
 src/libs/actions/Policy.ts                    | 62 +++++++++----------
 8 files changed, 38 insertions(+), 38 deletions(-)

diff --git a/src/libs/API/parameters/EnablePolicyCategoriesParams.ts b/src/libs/API/parameters/EnablePolicyCategoriesParams.ts
index 6d994f9dca37..61aa600b8ea0 100644
--- a/src/libs/API/parameters/EnablePolicyCategoriesParams.ts
+++ b/src/libs/API/parameters/EnablePolicyCategoriesParams.ts
@@ -1,6 +1,6 @@
 type EnablePolicyCategoriesParams = {
     policyID: string;
-    isEnabled: boolean;
+    enabled: boolean;
 };
 
 export default EnablePolicyCategoriesParams;
diff --git a/src/libs/API/parameters/EnablePolicyConnectionsParams.ts b/src/libs/API/parameters/EnablePolicyConnectionsParams.ts
index 312c93c42b30..cd2ac828b359 100644
--- a/src/libs/API/parameters/EnablePolicyConnectionsParams.ts
+++ b/src/libs/API/parameters/EnablePolicyConnectionsParams.ts
@@ -1,6 +1,6 @@
 type EnablePolicyConnectionsParams = {
     policyID: string;
-    isEnabled: boolean;
+    enabled: boolean;
 };
 
 export default EnablePolicyConnectionsParams;
diff --git a/src/libs/API/parameters/EnablePolicyDistanceRatesParams.ts b/src/libs/API/parameters/EnablePolicyDistanceRatesParams.ts
index 18718670af25..d66f898e6e10 100644
--- a/src/libs/API/parameters/EnablePolicyDistanceRatesParams.ts
+++ b/src/libs/API/parameters/EnablePolicyDistanceRatesParams.ts
@@ -1,6 +1,6 @@
 type EnablePolicyDistanceRatesParams = {
     policyID: string;
-    isEnabled: boolean;
+    enabled: boolean;
 };
 
 export default EnablePolicyDistanceRatesParams;
diff --git a/src/libs/API/parameters/EnablePolicyReportFieldsParams.ts b/src/libs/API/parameters/EnablePolicyReportFieldsParams.ts
index 341716563f53..7a5670e200c8 100644
--- a/src/libs/API/parameters/EnablePolicyReportFieldsParams.ts
+++ b/src/libs/API/parameters/EnablePolicyReportFieldsParams.ts
@@ -1,6 +1,6 @@
 type EnablePolicyReportFieldsParams = {
     policyID: string;
-    isEnabled: boolean;
+    enabled: boolean;
 };
 
 export default EnablePolicyReportFieldsParams;
diff --git a/src/libs/API/parameters/EnablePolicyTagsParams.ts b/src/libs/API/parameters/EnablePolicyTagsParams.ts
index f85fabd30f1f..8a8e21dd3371 100644
--- a/src/libs/API/parameters/EnablePolicyTagsParams.ts
+++ b/src/libs/API/parameters/EnablePolicyTagsParams.ts
@@ -1,6 +1,6 @@
 type EnablePolicyTagsParams = {
     policyID: string;
-    isEnabled: boolean;
+    enabled: boolean;
 };
 
 export default EnablePolicyTagsParams;
diff --git a/src/libs/API/parameters/EnablePolicyTaxesParams.ts b/src/libs/API/parameters/EnablePolicyTaxesParams.ts
index c180bab572b0..4a235d5d6a1f 100644
--- a/src/libs/API/parameters/EnablePolicyTaxesParams.ts
+++ b/src/libs/API/parameters/EnablePolicyTaxesParams.ts
@@ -1,6 +1,6 @@
 type EnablePolicyTaxesParams = {
     policyID: string;
-    isEnabled: boolean;
+    enabled: boolean;
 };
 
 export default EnablePolicyTaxesParams;
diff --git a/src/libs/API/parameters/EnablePolicyWorkflowsParams.ts b/src/libs/API/parameters/EnablePolicyWorkflowsParams.ts
index ab472197f7b7..1958ec8df581 100644
--- a/src/libs/API/parameters/EnablePolicyWorkflowsParams.ts
+++ b/src/libs/API/parameters/EnablePolicyWorkflowsParams.ts
@@ -1,6 +1,6 @@
 type EnablePolicyWorkflowsParams = {
     policyID: string;
-    isEnabled: boolean;
+    enabled: boolean;
 };
 
 export default EnablePolicyWorkflowsParams;
diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index d8aacd872b91..d12789091f2f 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -2652,14 +2652,14 @@ function clearCategoryErrors(policyID: string, categoryName: string) {
     });
 }
 
-function enablePolicyCategories(policyID: string, isEnabled: boolean) {
+function enablePolicyCategories(policyID: string, enabled: boolean) {
     const onyxData: OnyxData = {
         optimisticData: [
             {
                 onyxMethod: Onyx.METHOD.MERGE,
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
-                    areCategoriesEnabled: isEnabled,
+                    areCategoriesEnabled: enabled,
                     pendingFields: {
                         areCategoriesEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                     },
@@ -2682,7 +2682,7 @@ function enablePolicyCategories(policyID: string, isEnabled: boolean) {
                 onyxMethod: Onyx.METHOD.MERGE,
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
-                    areCategoriesEnabled: !isEnabled,
+                    areCategoriesEnabled: !enabled,
                     pendingFields: {
                         areCategoriesEnabled: null,
                     },
@@ -2691,25 +2691,25 @@ function enablePolicyCategories(policyID: string, isEnabled: boolean) {
         ],
     };
 
-    const parameters: EnablePolicyCategoriesParams = {policyID, isEnabled};
+    const parameters: EnablePolicyCategoriesParams = {policyID, enabled};
 
     API.write(WRITE_COMMANDS.ENABLE_POLICY_CATEGORIES, parameters, onyxData);
 
-    if (isEnabled) {
+    if (enabled) {
         const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_CATEGORIES.getRoute(policyID));
 
         navigationAction();
     }
 }
 
-function enablePolicyConnections(policyID: string, isEnabled: boolean) {
+function enablePolicyConnections(policyID: string, enabled: boolean) {
     const onyxData: OnyxData = {
         optimisticData: [
             {
                 onyxMethod: Onyx.METHOD.MERGE,
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
-                    areConnectionsEnabled: isEnabled,
+                    areConnectionsEnabled: enabled,
                     pendingFields: {
                         areConnectionsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                     },
@@ -2732,7 +2732,7 @@ function enablePolicyConnections(policyID: string, isEnabled: boolean) {
                 onyxMethod: Onyx.METHOD.MERGE,
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
-                    areConnectionsEnabled: !isEnabled,
+                    areConnectionsEnabled: !enabled,
                     pendingFields: {
                         areConnectionsEnabled: null,
                     },
@@ -2741,19 +2741,19 @@ function enablePolicyConnections(policyID: string, isEnabled: boolean) {
         ],
     };
 
-    const parameters: EnablePolicyConnectionsParams = {policyID, isEnabled};
+    const parameters: EnablePolicyConnectionsParams = {policyID, enabled};
 
     API.write(WRITE_COMMANDS.ENABLE_POLICY_CONNECTIONS, parameters, onyxData);
 }
 
-function enablePolicyDistanceRates(policyID: string, isEnabled: boolean) {
+function enablePolicyDistanceRates(policyID: string, enabled: boolean) {
     const onyxData: OnyxData = {
         optimisticData: [
             {
                 onyxMethod: Onyx.METHOD.MERGE,
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
-                    areDistanceRatesEnabled: isEnabled,
+                    areDistanceRatesEnabled: enabled,
                     pendingFields: {
                         areDistanceRatesEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                     },
@@ -2776,7 +2776,7 @@ function enablePolicyDistanceRates(policyID: string, isEnabled: boolean) {
                 onyxMethod: Onyx.METHOD.MERGE,
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
-                    areDistanceRatesEnabled: !isEnabled,
+                    areDistanceRatesEnabled: !enabled,
                     pendingFields: {
                         areDistanceRatesEnabled: null,
                     },
@@ -2785,19 +2785,19 @@ function enablePolicyDistanceRates(policyID: string, isEnabled: boolean) {
         ],
     };
 
-    const parameters: EnablePolicyDistanceRatesParams = {policyID, isEnabled};
+    const parameters: EnablePolicyDistanceRatesParams = {policyID, enabled};
 
     API.write(WRITE_COMMANDS.ENABLE_POLICY_DISTANCE_RATES, parameters, onyxData);
 }
 
-function enablePolicyReportFields(policyID: string, isEnabled: boolean) {
+function enablePolicyReportFields(policyID: string, enabled: boolean) {
     const onyxData: OnyxData = {
         optimisticData: [
             {
                 onyxMethod: Onyx.METHOD.MERGE,
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
-                    areReportFieldsEnabled: isEnabled,
+                    areReportFieldsEnabled: enabled,
                     pendingFields: {
                         areReportFieldsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                     },
@@ -2820,7 +2820,7 @@ function enablePolicyReportFields(policyID: string, isEnabled: boolean) {
                 onyxMethod: Onyx.METHOD.MERGE,
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
-                    areReportFieldsEnabled: !isEnabled,
+                    areReportFieldsEnabled: !enabled,
                     pendingFields: {
                         areReportFieldsEnabled: null,
                     },
@@ -2829,19 +2829,19 @@ function enablePolicyReportFields(policyID: string, isEnabled: boolean) {
         ],
     };
 
-    const parameters: EnablePolicyReportFieldsParams = {policyID, isEnabled};
+    const parameters: EnablePolicyReportFieldsParams = {policyID, enabled};
 
     API.write(WRITE_COMMANDS.ENABLE_POLICY_REPORT_FIELDS, parameters, onyxData);
 }
 
-function enablePolicyTags(policyID: string, isEnabled: boolean) {
+function enablePolicyTags(policyID: string, enabled: boolean) {
     const onyxData: OnyxData = {
         optimisticData: [
             {
                 onyxMethod: Onyx.METHOD.MERGE,
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
-                    areTagsEnabled: isEnabled,
+                    areTagsEnabled: enabled,
                     pendingFields: {
                         areTagsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                     },
@@ -2864,7 +2864,7 @@ function enablePolicyTags(policyID: string, isEnabled: boolean) {
                 onyxMethod: Onyx.METHOD.MERGE,
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
-                    areTagsEnabled: !isEnabled,
+                    areTagsEnabled: !enabled,
                     pendingFields: {
                         areTagsEnabled: null,
                     },
@@ -2873,18 +2873,18 @@ function enablePolicyTags(policyID: string, isEnabled: boolean) {
         ],
     };
 
-    const parameters: EnablePolicyTagsParams = {policyID, isEnabled};
+    const parameters: EnablePolicyTagsParams = {policyID, enabled};
 
     API.write(WRITE_COMMANDS.ENABLE_POLICY_TAGS, parameters, onyxData);
 
-    if (isEnabled) {
+    if (enabled) {
         const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_TAGS.getRoute(policyID));
 
         navigationAction();
     }
 }
 
-function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
+function enablePolicyTaxes(policyID: string, enabled: boolean) {
     const onyxData: OnyxData = {
         optimisticData: [
             {
@@ -2892,7 +2892,7 @@ function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
                     tax: {
-                        trackingEnabled: isEnabled,
+                        trackingEnabled: enabled,
                     },
                     pendingFields: {
                         tax: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
@@ -2917,7 +2917,7 @@ function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
                     tax: {
-                        trackingEnabled: !isEnabled,
+                        trackingEnabled: !enabled,
                     },
                     pendingFields: {
                         tax: null,
@@ -2927,19 +2927,19 @@ function enablePolicyTaxes(policyID: string, isEnabled: boolean) {
         ],
     };
 
-    const parameters: EnablePolicyTaxesParams = {policyID, isEnabled};
+    const parameters: EnablePolicyTaxesParams = {policyID, enabled};
 
     API.write(WRITE_COMMANDS.ENABLE_POLICY_TAXES, parameters, onyxData);
 }
 
-function enablePolicyWorkflows(policyID: string, isEnabled: boolean) {
+function enablePolicyWorkflows(policyID: string, enabled: boolean) {
     const onyxData: OnyxData = {
         optimisticData: [
             {
                 onyxMethod: Onyx.METHOD.MERGE,
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
-                    areWorkflowsEnabled: isEnabled,
+                    areWorkflowsEnabled: enabled,
                     pendingFields: {
                         areWorkflowsEnabled: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                     },
@@ -2962,7 +2962,7 @@ function enablePolicyWorkflows(policyID: string, isEnabled: boolean) {
                 onyxMethod: Onyx.METHOD.MERGE,
                 key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
                 value: {
-                    areWorkflowsEnabled: !isEnabled,
+                    areWorkflowsEnabled: !enabled,
                     pendingFields: {
                         areWorkflowsEnabled: null,
                     },
@@ -2971,11 +2971,11 @@ function enablePolicyWorkflows(policyID: string, isEnabled: boolean) {
         ],
     };
 
-    const parameters: EnablePolicyWorkflowsParams = {policyID, isEnabled};
+    const parameters: EnablePolicyWorkflowsParams = {policyID, enabled};
 
     API.write(WRITE_COMMANDS.ENABLE_POLICY_WORKFLOWS, parameters, onyxData);
 
-    if (isEnabled) {
+    if (enabled) {
         const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID));
 
         navigationAction();

From d3c611cea604288ab13614a0b8ddfa1d225db947 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Sat, 9 Mar 2024 10:37:30 +0100
Subject: [PATCH 095/110] remove unimplemented features from the list

---
 .../workspace/WorkspaceMoreFeaturesPage.tsx   | 38 -------------------
 1 file changed, 38 deletions(-)

diff --git a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
index e2539c60d234..45a950e0fafb 100644
--- a/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
+++ b/src/pages/workspace/WorkspaceMoreFeaturesPage.tsx
@@ -87,39 +87,6 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
                 Policy.enablePolicyTags(policy?.id ?? '', isEnabled);
             },
         },
-        {
-            icon: Illustrations.Coins,
-            titleTranslationKey: 'workspace.moreFeatures.taxes.title',
-            subtitleTranslationKey: 'workspace.moreFeatures.taxes.subtitle',
-            isActive: policy?.tax?.trackingEnabled ?? false,
-            pendingAction: policy?.pendingFields?.tax,
-            action: (isEnabled: boolean) => {
-                Policy.enablePolicyTaxes(policy?.id ?? '', isEnabled);
-            },
-        },
-        {
-            icon: Illustrations.Pencil,
-            titleTranslationKey: 'workspace.moreFeatures.reportFields.title',
-            subtitleTranslationKey: 'workspace.moreFeatures.reportFields.subtitle',
-            isActive: policy?.areReportFieldsEnabled ?? false,
-            pendingAction: policy?.pendingFields?.areReportFieldsEnabled,
-            action: (isEnabled: boolean) => {
-                Policy.enablePolicyReportFields(policy?.id ?? '', isEnabled);
-            },
-        },
-    ];
-
-    const integrateItems: Item[] = [
-        {
-            icon: Illustrations.Accounting,
-            titleTranslationKey: 'workspace.moreFeatures.connections.title',
-            subtitleTranslationKey: 'workspace.moreFeatures.connections.subtitle',
-            isActive: policy?.areConnectionsEnabled ?? false,
-            pendingAction: policy?.pendingFields?.areConnectionsEnabled,
-            action: (isEnabled: boolean) => {
-                Policy.enablePolicyConnections(policy?.id ?? '', isEnabled);
-            },
-        },
     ];
 
     const sections: SectionObject[] = [
@@ -133,11 +100,6 @@ function WorkspaceMoreFeaturesPage({policy, route}: WorkspaceMoreFeaturesPagePro
             subtitleTranslationKey: 'workspace.moreFeatures.organizeSection.subtitle',
             items: organizeItems,
         },
-        {
-            titleTranslationKey: 'workspace.moreFeatures.integrateSection.title',
-            subtitleTranslationKey: 'workspace.moreFeatures.integrateSection.subtitle',
-            items: integrateItems,
-        },
     ];
 
     const renderItem = useCallback(

From 5efcc2d676a3407c4f3b52af68c4df2bb9e21ecf Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Sat, 9 Mar 2024 10:38:07 +0100
Subject: [PATCH 096/110] add navigate to distance rates

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

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index d12789091f2f..978f400320f7 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -2788,6 +2788,12 @@ function enablePolicyDistanceRates(policyID: string, enabled: boolean) {
     const parameters: EnablePolicyDistanceRatesParams = {policyID, enabled};
 
     API.write(WRITE_COMMANDS.ENABLE_POLICY_DISTANCE_RATES, parameters, onyxData);
+
+    if (enabled) {
+        const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_DISTANCE_RATES.getRoute(policyID));
+
+        navigationAction();
+    }
 }
 
 function enablePolicyReportFields(policyID: string, enabled: boolean) {

From 4c1c1f9e0f827c0569588e3b347c5fef0afe1368 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Sat, 9 Mar 2024 10:39:56 +0100
Subject: [PATCH 097/110] remove extra empty lines

---
 src/libs/actions/Policy.ts | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index 978f400320f7..d0e3332ab918 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -2697,7 +2697,6 @@ function enablePolicyCategories(policyID: string, enabled: boolean) {
 
     if (enabled) {
         const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_CATEGORIES.getRoute(policyID));
-
         navigationAction();
     }
 }
@@ -2791,7 +2790,6 @@ function enablePolicyDistanceRates(policyID: string, enabled: boolean) {
 
     if (enabled) {
         const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_DISTANCE_RATES.getRoute(policyID));
-
         navigationAction();
     }
 }
@@ -2885,7 +2883,6 @@ function enablePolicyTags(policyID: string, enabled: boolean) {
 
     if (enabled) {
         const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_TAGS.getRoute(policyID));
-
         navigationAction();
     }
 }
@@ -2983,7 +2980,6 @@ function enablePolicyWorkflows(policyID: string, enabled: boolean) {
 
     if (enabled) {
         const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID));
-
         navigationAction();
     }
 }

From 87f0056e9ad756b5d89e16bff7f7c3e677eca7e6 Mon Sep 17 00:00:00 2001
From: Bernhard Owen Josephus <bernhard.josephus@gmail.com>
Date: Sat, 9 Mar 2024 22:26:47 +0800
Subject: [PATCH 098/110] don't use fallback route

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

diff --git a/src/libs/actions/PaymentMethods.ts b/src/libs/actions/PaymentMethods.ts
index 13e0a42e839f..dc8cefc0c30e 100644
--- a/src/libs/actions/PaymentMethods.ts
+++ b/src/libs/actions/PaymentMethods.ts
@@ -295,7 +295,7 @@ function saveWalletTransferMethodType(filterPaymentMethodType?: FilterMethodPaym
 
 function dismissSuccessfulTransferBalancePage() {
     Onyx.merge(ONYXKEYS.WALLET_TRANSFER, {shouldShowSuccess: false});
-    Navigation.goBack(ROUTES.SETTINGS_WALLET);
+    Navigation.goBack();
 }
 
 /**

From cde2ec0e6eec1a438574dfc99ac23ea0b33551c4 Mon Sep 17 00:00:00 2001
From: snyk-bot <snyk-bot@snyk.io>
Date: Sat, 9 Mar 2024 20:55:34 +0000
Subject: [PATCH 099/110] fix: upgrade electron-updater from 6.1.8 to 6.1.9

Snyk has created this PR to upgrade electron-updater from 6.1.8 to 6.1.9.

See this package in npm:
https://www.npmjs.com/package/electron-updater

See this project in Snyk:
https://app.snyk.io/org/expensify/project/9be44749-775a-47a6-be6b-781145c25b98?utm_source=github&utm_medium=referral&page=upgrade-pr
---
 desktop/package-lock.json | 30 +++++++++++++++---------------
 desktop/package.json      |  2 +-
 2 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/desktop/package-lock.json b/desktop/package-lock.json
index f6f96b647ae1..b8ae9d0a2be5 100644
--- a/desktop/package-lock.json
+++ b/desktop/package-lock.json
@@ -10,7 +10,7 @@
         "electron-context-menu": "^2.3.0",
         "electron-log": "^4.4.8",
         "electron-serve": "^1.3.0",
-        "electron-updater": "^6.1.8",
+        "electron-updater": "^6.1.9",
         "node-machine-id": "^1.1.12"
       }
     },
@@ -50,9 +50,9 @@
       }
     },
     "node_modules/builder-util-runtime": {
-      "version": "9.2.3",
-      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.3.tgz",
-      "integrity": "sha512-FGhkqXdFFZ5dNC4C+yuQB9ak311rpGAw+/ASz8ZdxwODCv1GGMWgLDeofRkdi0F3VCHQEWy/aXcJQozx2nOPiw==",
+      "version": "9.2.4",
+      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.4.tgz",
+      "integrity": "sha512-upp+biKpN/XZMLim7aguUyW8s0FUpDvOtK6sbanMFDAMBzpHDqdhgVYm6zc9HJ6nWo7u2Lxk60i2M6Jd3aiNrA==",
       "dependencies": {
         "debug": "^4.3.4",
         "sax": "^1.2.4"
@@ -156,11 +156,11 @@
       }
     },
     "node_modules/electron-updater": {
-      "version": "6.1.8",
-      "resolved": "https://registry.npmjs.org/electron-updater/-/electron-updater-6.1.8.tgz",
-      "integrity": "sha512-hhOTfaFAd6wRHAfUaBhnAOYc+ymSGCWJLtFkw4xJqOvtpHmIdNHnXDV9m1MHC+A6q08Abx4Ykgyz/R5DGKNAMQ==",
+      "version": "6.1.9",
+      "resolved": "https://registry.npmjs.org/electron-updater/-/electron-updater-6.1.9.tgz",
+      "integrity": "sha512-omoTwGSG+/H8G62cEZS/dc5Lmc4HohAd4198AP+JNv8H7bfxXUCKekaR6WpsN1n2DiWzvcqOusfGSogZv/uj9w==",
       "dependencies": {
-        "builder-util-runtime": "9.2.3",
+        "builder-util-runtime": "9.2.4",
         "fs-extra": "^10.1.0",
         "js-yaml": "^4.1.0",
         "lazy-val": "^1.0.5",
@@ -467,9 +467,9 @@
       "integrity": "sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ=="
     },
     "builder-util-runtime": {
-      "version": "9.2.3",
-      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.3.tgz",
-      "integrity": "sha512-FGhkqXdFFZ5dNC4C+yuQB9ak311rpGAw+/ASz8ZdxwODCv1GGMWgLDeofRkdi0F3VCHQEWy/aXcJQozx2nOPiw==",
+      "version": "9.2.4",
+      "resolved": "https://registry.npmjs.org/builder-util-runtime/-/builder-util-runtime-9.2.4.tgz",
+      "integrity": "sha512-upp+biKpN/XZMLim7aguUyW8s0FUpDvOtK6sbanMFDAMBzpHDqdhgVYm6zc9HJ6nWo7u2Lxk60i2M6Jd3aiNrA==",
       "requires": {
         "debug": "^4.3.4",
         "sax": "^1.2.4"
@@ -541,11 +541,11 @@
       "integrity": "sha512-OEC/48ZBJxR6XNSZtCl4cKPyQ1lvsu8yp8GdCplMWwGS1eEyMcEmzML5BRs/io/RLDnpgyf+7rSL+X6ICifRIg=="
     },
     "electron-updater": {
-      "version": "6.1.8",
-      "resolved": "https://registry.npmjs.org/electron-updater/-/electron-updater-6.1.8.tgz",
-      "integrity": "sha512-hhOTfaFAd6wRHAfUaBhnAOYc+ymSGCWJLtFkw4xJqOvtpHmIdNHnXDV9m1MHC+A6q08Abx4Ykgyz/R5DGKNAMQ==",
+      "version": "6.1.9",
+      "resolved": "https://registry.npmjs.org/electron-updater/-/electron-updater-6.1.9.tgz",
+      "integrity": "sha512-omoTwGSG+/H8G62cEZS/dc5Lmc4HohAd4198AP+JNv8H7bfxXUCKekaR6WpsN1n2DiWzvcqOusfGSogZv/uj9w==",
       "requires": {
-        "builder-util-runtime": "9.2.3",
+        "builder-util-runtime": "9.2.4",
         "fs-extra": "^10.1.0",
         "js-yaml": "^4.1.0",
         "lazy-val": "^1.0.5",
diff --git a/desktop/package.json b/desktop/package.json
index de5834b9ce7a..606fcac92500 100644
--- a/desktop/package.json
+++ b/desktop/package.json
@@ -7,7 +7,7 @@
     "electron-context-menu": "^2.3.0",
     "electron-log": "^4.4.8",
     "electron-serve": "^1.3.0",
-    "electron-updater": "^6.1.8",
+    "electron-updater": "^6.1.9",
     "node-machine-id": "^1.1.12"
   },
   "author": "Expensify, Inc.",

From f392a071cc5736c06c970cbd032d3fa91c7f5604 Mon Sep 17 00:00:00 2001
From: jeremy-croff <jeremycroff@gmail.com>
Date: Sun, 10 Mar 2024 12:45:11 -0500
Subject: [PATCH 100/110] fix(36381): Update variable name

---
 src/components/BaseMiniContextMenuItem.tsx                  | 6 +++---
 src/components/ContextMenuItem.tsx                          | 6 +++---
 .../home/report/ContextMenu/BaseReportActionContextMenu.tsx | 2 +-
 src/pages/home/report/ContextMenu/ContextMenuActions.tsx    | 4 ++--
 4 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/components/BaseMiniContextMenuItem.tsx b/src/components/BaseMiniContextMenuItem.tsx
index 86dac7371643..cc501e04be11 100644
--- a/src/components/BaseMiniContextMenuItem.tsx
+++ b/src/components/BaseMiniContextMenuItem.tsx
@@ -35,14 +35,14 @@ type BaseMiniContextMenuItemProps = {
     /**
      * Can be used to control the click event, and for example whether or not to lose focus from the composer when pressing the item
      */
-    shouldPreventDefault?: boolean;
+    shouldPreventDefaultFocusOnPress?: boolean;
 };
 
 /**
  * Component that renders a mini context menu item with a
  * pressable. Also renders a tooltip when hovering the item.
  */
-function BaseMiniContextMenuItem({tooltipText, onPress, children, isDelayButtonStateComplete = true, shouldPreventDefault = true}: BaseMiniContextMenuItemProps, ref: ForwardedRef<View>) {
+function BaseMiniContextMenuItem({tooltipText, onPress, children, isDelayButtonStateComplete = true, shouldPreventDefaultFocusOnPress = true}: BaseMiniContextMenuItemProps, ref: ForwardedRef<View>) {
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     return (
@@ -68,7 +68,7 @@ function BaseMiniContextMenuItem({tooltipText, onPress, children, isDelayButtonS
                     }
 
                     // Prevent text input blur on left click
-                    if (shouldPreventDefault) {
+                    if (shouldPreventDefaultFocusOnPress) {
                         event.preventDefault();
                     }
                 }}
diff --git a/src/components/ContextMenuItem.tsx b/src/components/ContextMenuItem.tsx
index af4b78f7b195..b80d6a138c9e 100644
--- a/src/components/ContextMenuItem.tsx
+++ b/src/components/ContextMenuItem.tsx
@@ -45,7 +45,7 @@ type ContextMenuItemProps = {
     /** Styles to apply to ManuItem wrapper */
     wrapperStyle?: StyleProp<ViewStyle>;
 
-    shouldPreventDefault?: boolean;
+    shouldPreventDefaultFocusOnPress?: boolean;
 };
 
 type ContextMenuItemHandle = {
@@ -65,7 +65,7 @@ function ContextMenuItem(
         isFocused = false,
         shouldLimitWidth = true,
         wrapperStyle,
-        shouldPreventDefault = true,
+        shouldPreventDefaultFocusOnPress = true,
     }: ContextMenuItemProps,
     ref: ForwardedRef<ContextMenuItemHandle>,
 ) {
@@ -97,7 +97,7 @@ function ContextMenuItem(
             tooltipText={itemText}
             onPress={triggerPressAndUpdateSuccess}
             isDelayButtonStateComplete={!isThrottledButtonActive}
-            shouldPreventDefault={shouldPreventDefault}
+            shouldPreventDefaultFocusOnPress={shouldPreventDefaultFocusOnPress}
         >
             {({hovered, pressed}) => (
                 <Icon
diff --git a/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.tsx b/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.tsx
index 51e48b620ea5..dc9e2179981e 100755
--- a/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.tsx
+++ b/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.tsx
@@ -265,7 +265,7 @@ function BaseReportActionContextMenu({
                             description={contextAction.getDescription?.(selection) ?? ''}
                             isAnonymousAction={contextAction.isAnonymousAction}
                             isFocused={focusedIndex === index}
-                            shouldPreventDefault={contextAction.shouldPreventDefault}
+                            shouldPreventDefaultFocusOnPress={contextAction.shouldPreventDefaultFocusOnPress}
                         />
                     );
                 })}
diff --git a/src/pages/home/report/ContextMenu/ContextMenuActions.tsx b/src/pages/home/report/ContextMenu/ContextMenuActions.tsx
index e0a1df9523cf..d5aeb83c72f4 100644
--- a/src/pages/home/report/ContextMenu/ContextMenuActions.tsx
+++ b/src/pages/home/report/ContextMenu/ContextMenuActions.tsx
@@ -97,7 +97,7 @@ type ContextMenuActionWithIcon = {
 type ContextMenuAction = (ContextMenuActionWithContent | ContextMenuActionWithIcon) & {
     isAnonymousAction: boolean;
     shouldShow: ShouldShow;
-    shouldPreventDefault?: boolean;
+    shouldPreventDefaultFocusOnPress?: boolean;
 };
 
 // A list of all the context actions in this menu.
@@ -496,7 +496,7 @@ const ContextMenuActions: ContextMenuAction[] = [
             openContextMenu();
         },
         getDescription: () => {},
-        shouldPreventDefault: false,
+        shouldPreventDefaultFocusOnPress: false,
     },
 ];
 

From 9d77850c217364b8aa4a20ee303a2de3ab5d806c Mon Sep 17 00:00:00 2001
From: dukenv0307 <dukenv0307@gmail.com>
Date: Mon, 11 Mar 2024 13:28:21 +0700
Subject: [PATCH 101/110] fix add const

---
 src/CONST.ts                   | 2 ++
 src/components/Breadcrumbs.tsx | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/CONST.ts b/src/CONST.ts
index 1e3b33d5d760..755691698286 100755
--- a/src/CONST.ts
+++ b/src/CONST.ts
@@ -92,6 +92,8 @@ const CONST = {
     AVATAR_MAX_WIDTH_PX: 4096,
     AVATAR_MAX_HEIGHT_PX: 4096,
 
+    LOGO_MAX_SCALE: 1.5,
+
     BREADCRUMB_TYPE: {
         ROOT: 'root',
         STRONG: 'strong',
diff --git a/src/components/Breadcrumbs.tsx b/src/components/Breadcrumbs.tsx
index a50f2dafb878..e5eb09691eba 100644
--- a/src/components/Breadcrumbs.tsx
+++ b/src/components/Breadcrumbs.tsx
@@ -36,7 +36,7 @@ function Breadcrumbs({breadcrumbs, style}: BreadcrumbsProps) {
     const theme = useTheme();
     const styles = useThemeStyles();
     const [primaryBreadcrumb, secondaryBreadcrumb] = breadcrumbs;
-    const fontScale = PixelRatio.getFontScale() > 1.5 ? 1.5 : PixelRatio.getFontScale();
+    const fontScale = PixelRatio.getFontScale() > CONST.LOGO_MAX_SCALE ? CONST.LOGO_MAX_SCALE : PixelRatio.getFontScale();
     return (
         <View style={[styles.flexRow, styles.alignItemsCenter, styles.gap1, styles.w100, styles.breadcrumsContainer, style]}>
             {primaryBreadcrumb.type === CONST.BREADCRUMB_TYPE.ROOT ? (

From 1ec02955d45c494b662687ddd58af9d9eec54c3b Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Mon, 11 Mar 2024 10:55:09 +0100
Subject: [PATCH 102/110] improve nav flow

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

diff --git a/src/libs/actions/Policy.ts b/src/libs/actions/Policy.ts
index d0e3332ab918..8bfa2a4a11fd 100644
--- a/src/libs/actions/Policy.ts
+++ b/src/libs/actions/Policy.ts
@@ -53,6 +53,7 @@ import * as ReportUtils from '@libs/ReportUtils';
 import * as TransactionUtils from '@libs/TransactionUtils';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import type {Route} from '@src/ROUTES';
 import ROUTES from '@src/ROUTES';
 import type {
     InvitedEmailsToAccountIDs,
@@ -2652,6 +2653,18 @@ function clearCategoryErrors(policyID: string, categoryName: string) {
     });
 }
 
+function navigateWhenEnableFeature(policyID: string, featureRoute: Route) {
+    const isNarrowLayout = getIsNarrowLayout();
+
+    if (isNarrowLayout) {
+        Navigation.navigate(ROUTES.WORKSPACE_INITIAL.getRoute(policyID), CONST.NAVIGATION.TYPE.FORCED_UP);
+
+        return;
+    }
+
+    Navigation.navigate(featureRoute);
+}
+
 function enablePolicyCategories(policyID: string, enabled: boolean) {
     const onyxData: OnyxData = {
         optimisticData: [
@@ -2696,8 +2709,7 @@ function enablePolicyCategories(policyID: string, enabled: boolean) {
     API.write(WRITE_COMMANDS.ENABLE_POLICY_CATEGORIES, parameters, onyxData);
 
     if (enabled) {
-        const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_CATEGORIES.getRoute(policyID));
-        navigationAction();
+        navigateWhenEnableFeature(policyID, ROUTES.WORKSPACE_CATEGORIES.getRoute(policyID));
     }
 }
 
@@ -2789,8 +2801,7 @@ function enablePolicyDistanceRates(policyID: string, enabled: boolean) {
     API.write(WRITE_COMMANDS.ENABLE_POLICY_DISTANCE_RATES, parameters, onyxData);
 
     if (enabled) {
-        const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_DISTANCE_RATES.getRoute(policyID));
-        navigationAction();
+        navigateWhenEnableFeature(policyID, ROUTES.WORKSPACE_DISTANCE_RATES.getRoute(policyID));
     }
 }
 
@@ -2882,8 +2893,7 @@ function enablePolicyTags(policyID: string, enabled: boolean) {
     API.write(WRITE_COMMANDS.ENABLE_POLICY_TAGS, parameters, onyxData);
 
     if (enabled) {
-        const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_TAGS.getRoute(policyID));
-        navigationAction();
+        navigateWhenEnableFeature(policyID, ROUTES.WORKSPACE_TAGS.getRoute(policyID));
     }
 }
 
@@ -2979,8 +2989,7 @@ function enablePolicyWorkflows(policyID: string, enabled: boolean) {
     API.write(WRITE_COMMANDS.ENABLE_POLICY_WORKFLOWS, parameters, onyxData);
 
     if (enabled) {
-        const navigationAction = getIsNarrowLayout() ? Navigation.goBack : () => Navigation.navigate(ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID));
-        navigationAction();
+        navigateWhenEnableFeature(policyID, ROUTES.WORKSPACE_WORKFLOWS.getRoute(policyID));
     }
 }
 

From c8282eafccffe53df9c25394967a202df2267629 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Mon, 11 Mar 2024 10:56:00 +0100
Subject: [PATCH 103/110] move distance rates up

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

diff --git a/src/pages/workspace/WorkspaceInitialPage.tsx b/src/pages/workspace/WorkspaceInitialPage.tsx
index 7b2f7631cea4..240a148110f7 100644
--- a/src/pages/workspace/WorkspaceInitialPage.tsx
+++ b/src/pages/workspace/WorkspaceInitialPage.tsx
@@ -145,6 +145,15 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
 
     const protectedCollectPolicyMenuItems: WorkspaceMenuItem[] = [];
 
+    if (policy?.areDistanceRatesEnabled) {
+        protectedCollectPolicyMenuItems.push({
+            translationKey: 'workspace.common.distanceRates',
+            icon: Expensicons.Car,
+            action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_DISTANCE_RATES.getRoute(policyID)))),
+            routeName: SCREENS.WORKSPACE.DISTANCE_RATES,
+        });
+    }
+
     if (policy?.areWorkflowsEnabled) {
         protectedCollectPolicyMenuItems.push({
             translationKey: 'workspace.common.workflows',
@@ -172,15 +181,6 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
         });
     }
 
-    if (policy?.areDistanceRatesEnabled) {
-        protectedCollectPolicyMenuItems.push({
-            translationKey: 'workspace.common.distanceRates',
-            icon: Expensicons.Car,
-            action: singleExecution(waitForNavigate(() => Navigation.navigate(ROUTES.WORKSPACE_DISTANCE_RATES.getRoute(policyID)))),
-            routeName: SCREENS.WORKSPACE.DISTANCE_RATES,
-        });
-    }
-
     protectedCollectPolicyMenuItems.push({
         translationKey: 'workspace.common.moreFeatures',
         icon: Expensicons.Gear,

From 4607e14af612ef76cf1c3099a7c3c66157d6df04 Mon Sep 17 00:00:00 2001
From: OSBotify <infra+osbotify@expensify.com>
Date: Mon, 11 Mar 2024 10:16:15 +0000
Subject: [PATCH 104/110] Update version to 1.4.50-0

---
 android/app/build.gradle                    | 4 ++--
 ios/NewExpensify/Info.plist                 | 4 ++--
 ios/NewExpensifyTests/Info.plist            | 4 ++--
 ios/NotificationServiceExtension/Info.plist | 4 ++--
 package-lock.json                           | 4 ++--
 package.json                                | 2 +-
 6 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/android/app/build.gradle b/android/app/build.gradle
index f714ed005740..0d5e615b07e3 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 1001044904
-        versionName "1.4.49-4"
+        versionCode 1001045000
+        versionName "1.4.50-0"
     }
 
     flavorDimensions "default"
diff --git a/ios/NewExpensify/Info.plist b/ios/NewExpensify/Info.plist
index 712909df6b61..6d84533376bd 100644
--- a/ios/NewExpensify/Info.plist
+++ b/ios/NewExpensify/Info.plist
@@ -19,7 +19,7 @@
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.4.49</string>
+	<string>1.4.50</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleURLTypes</key>
@@ -40,7 +40,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.4.49.4</string>
+	<string>1.4.50.0</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>
diff --git a/ios/NewExpensifyTests/Info.plist b/ios/NewExpensifyTests/Info.plist
index b1a4aa336ab8..79f0c5067463 100644
--- a/ios/NewExpensifyTests/Info.plist
+++ b/ios/NewExpensifyTests/Info.plist
@@ -15,10 +15,10 @@
 	<key>CFBundlePackageType</key>
 	<string>BNDL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.4.49</string>
+	<string>1.4.50</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.4.49.4</string>
+	<string>1.4.50.0</string>
 </dict>
 </plist>
diff --git a/ios/NotificationServiceExtension/Info.plist b/ios/NotificationServiceExtension/Info.plist
index c90bc159062b..43b714983252 100644
--- a/ios/NotificationServiceExtension/Info.plist
+++ b/ios/NotificationServiceExtension/Info.plist
@@ -11,9 +11,9 @@
 	<key>CFBundleName</key>
 	<string>$(PRODUCT_NAME)</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.4.49</string>
+	<string>1.4.50</string>
 	<key>CFBundleVersion</key>
-	<string>1.4.49.4</string>
+	<string>1.4.50.0</string>
 	<key>NSExtension</key>
 	<dict>
 		<key>NSExtensionPointIdentifier</key>
diff --git a/package-lock.json b/package-lock.json
index 81686286bf1c..0f11dc0a485a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "new.expensify",
-  "version": "1.4.49-4",
+  "version": "1.4.50-0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "new.expensify",
-      "version": "1.4.49-4",
+      "version": "1.4.50-0",
       "hasInstallScript": true,
       "license": "MIT",
       "dependencies": {
diff --git a/package.json b/package.json
index 7dab1aeaa386..46e41b04ab2c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.4.49-4",
+  "version": "1.4.50-0",
   "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 ac7a29f60c3fe03ff6539351ee7df05743960516 Mon Sep 17 00:00:00 2001
From: OSBotify <infra+osbotify@expensify.com>
Date: Mon, 11 Mar 2024 11:04:00 +0000
Subject: [PATCH 105/110] Update version to 1.4.50-1

---
 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 0d5e615b07e3..cb12616ee216 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 1001045000
-        versionName "1.4.50-0"
+        versionCode 1001045001
+        versionName "1.4.50-1"
     }
 
     flavorDimensions "default"
diff --git a/ios/NewExpensify/Info.plist b/ios/NewExpensify/Info.plist
index 6d84533376bd..97eb55747062 100644
--- a/ios/NewExpensify/Info.plist
+++ b/ios/NewExpensify/Info.plist
@@ -40,7 +40,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.4.50.0</string>
+	<string>1.4.50.1</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>
diff --git a/ios/NewExpensifyTests/Info.plist b/ios/NewExpensifyTests/Info.plist
index 79f0c5067463..af8e99100825 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.50.0</string>
+	<string>1.4.50.1</string>
 </dict>
 </plist>
diff --git a/ios/NotificationServiceExtension/Info.plist b/ios/NotificationServiceExtension/Info.plist
index 43b714983252..a4c7b52661b6 100644
--- a/ios/NotificationServiceExtension/Info.plist
+++ b/ios/NotificationServiceExtension/Info.plist
@@ -13,7 +13,7 @@
 	<key>CFBundleShortVersionString</key>
 	<string>1.4.50</string>
 	<key>CFBundleVersion</key>
-	<string>1.4.50.0</string>
+	<string>1.4.50.1</string>
 	<key>NSExtension</key>
 	<dict>
 		<key>NSExtensionPointIdentifier</key>
diff --git a/package-lock.json b/package-lock.json
index 21edda824bdc..ac65cd05115d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "new.expensify",
-  "version": "1.4.50-0",
+  "version": "1.4.50-1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "new.expensify",
-      "version": "1.4.50-0",
+      "version": "1.4.50-1",
       "hasInstallScript": true,
       "license": "MIT",
       "dependencies": {
diff --git a/package.json b/package.json
index 9f1342eed614..7af92881d627 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.4.50-0",
+  "version": "1.4.50-1",
   "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 45468551201464dd50e919952deaec7e929aabf8 Mon Sep 17 00:00:00 2001
From: Vit Horacek <36083550+mountiny@users.noreply.github.com>
Date: Mon, 11 Mar 2024 11:19:52 +0000
Subject: [PATCH 106/110] Revert "[No QA] Fix: Expensify engineer is not tagged
 and assigned in Deploy Checklist to complete the QA for PRs with Internal
 QA."

---
 .../javascript/authorChecklist/index.js       | 16 +++--
 .../javascript/awaitStagingDeploys/index.js   | 16 +++--
 .../javascript/checkDeployBlockers/index.js   | 16 +++--
 .../createOrUpdateStagingDeploy.js            | 11 +---
 .../createOrUpdateStagingDeploy/index.js      | 27 +++-----
 .../javascript/getArtifactInfo/index.js       | 16 +++--
 .../getDeployPullRequestList/index.js         | 16 +++--
 .../javascript/getPullRequestDetails/index.js | 16 +++--
 .../javascript/getReleaseBody/index.js        | 16 +++--
 .../javascript/isStagingDeployLocked/index.js | 16 +++--
 .../markPullRequestsAsDeployed/index.js       | 16 +++--
 .../javascript/postTestBuildComment/index.js  | 16 +++--
 .../reopenIssueWithComment/index.js           | 16 +++--
 .../javascript/reviewerChecklist/index.js     | 16 +++--
 .../javascript/verifySignedCommits/index.js   | 16 +++--
 .github/libs/GithubUtils.js                   | 16 +++--
 tests/unit/GithubUtilsTest.ts                 | 62 +++++++++----------
 17 files changed, 140 insertions(+), 184 deletions(-)

diff --git a/.github/actions/javascript/authorChecklist/index.js b/.github/actions/javascript/authorChecklist/index.js
index e267769dc457..528a0a11498a 100644
--- a/.github/actions/javascript/authorChecklist/index.js
+++ b/.github/actions/javascript/authorChecklist/index.js
@@ -283,14 +283,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -325,11 +325,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -359,9 +359,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/actions/javascript/awaitStagingDeploys/index.js b/.github/actions/javascript/awaitStagingDeploys/index.js
index dd2aef38e1ee..f042dbb38a91 100644
--- a/.github/actions/javascript/awaitStagingDeploys/index.js
+++ b/.github/actions/javascript/awaitStagingDeploys/index.js
@@ -395,14 +395,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -437,11 +437,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -471,9 +471,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/actions/javascript/checkDeployBlockers/index.js b/.github/actions/javascript/checkDeployBlockers/index.js
index 82092be7e0eb..8e10f8b1d8b6 100644
--- a/.github/actions/javascript/checkDeployBlockers/index.js
+++ b/.github/actions/javascript/checkDeployBlockers/index.js
@@ -362,14 +362,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -404,11 +404,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -438,9 +438,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/actions/javascript/createOrUpdateStagingDeploy/createOrUpdateStagingDeploy.js b/.github/actions/javascript/createOrUpdateStagingDeploy/createOrUpdateStagingDeploy.js
index 1752ae62f86c..4441348a3c36 100644
--- a/.github/actions/javascript/createOrUpdateStagingDeploy/createOrUpdateStagingDeploy.js
+++ b/.github/actions/javascript/createOrUpdateStagingDeploy/createOrUpdateStagingDeploy.js
@@ -40,11 +40,8 @@ async function run() {
 
         // Next, we generate the checklist body
         let checklistBody = '';
-        let checklistAssignees = [];
         if (shouldCreateNewDeployChecklist) {
-            const {issueBody, issueAssignees} = await GithubUtils.generateStagingDeployCashBody(newVersionTag, _.map(mergedPRs, GithubUtils.getPullRequestURLFromNumber));
-            checklistBody = issueBody;
-            checklistAssignees = issueAssignees;
+            checklistBody = await GithubUtils.generateStagingDeployCashBody(newVersionTag, _.map(mergedPRs, GithubUtils.getPullRequestURLFromNumber));
         } else {
             // Generate the updated PR list, preserving the previous state of `isVerified` for existing PRs
             const PRList = _.reduce(
@@ -97,7 +94,7 @@ async function run() {
             }
 
             const didVersionChange = newVersionTag !== currentChecklistData.tag;
-            const {issueBody, issueAssignees} = await GithubUtils.generateStagingDeployCashBody(
+            checklistBody = await GithubUtils.generateStagingDeployCashBody(
                 newVersionTag,
                 _.pluck(PRList, 'url'),
                 _.pluck(_.where(PRList, {isVerified: true}), 'url'),
@@ -108,8 +105,6 @@ async function run() {
                 didVersionChange ? false : currentChecklistData.isFirebaseChecked,
                 didVersionChange ? false : currentChecklistData.isGHStatusChecked,
             );
-            checklistBody = issueBody;
-            checklistAssignees = issueAssignees;
         }
 
         // Finally, create or update the checklist
@@ -124,7 +119,7 @@ async function run() {
                 ...defaultPayload,
                 title: `Deploy Checklist: New Expensify ${format(new Date(), CONST.DATE_FORMAT_STRING)}`,
                 labels: [CONST.LABELS.STAGING_DEPLOY],
-                assignees: [CONST.APPLAUSE_BOT].concat(checklistAssignees),
+                assignees: [CONST.APPLAUSE_BOT],
             });
             console.log(`Successfully created new StagingDeployCash! 🎉 ${newChecklist.html_url}`);
             return newChecklist;
diff --git a/.github/actions/javascript/createOrUpdateStagingDeploy/index.js b/.github/actions/javascript/createOrUpdateStagingDeploy/index.js
index 9c9a42709af0..154dacbdc3c3 100644
--- a/.github/actions/javascript/createOrUpdateStagingDeploy/index.js
+++ b/.github/actions/javascript/createOrUpdateStagingDeploy/index.js
@@ -49,11 +49,8 @@ async function run() {
 
         // Next, we generate the checklist body
         let checklistBody = '';
-        let checklistAssignees = [];
         if (shouldCreateNewDeployChecklist) {
-            const {issueBody, issueAssignees} = await GithubUtils.generateStagingDeployCashBody(newVersionTag, _.map(mergedPRs, GithubUtils.getPullRequestURLFromNumber));
-            checklistBody = issueBody;
-            checklistAssignees = issueAssignees;
+            checklistBody = await GithubUtils.generateStagingDeployCashBody(newVersionTag, _.map(mergedPRs, GithubUtils.getPullRequestURLFromNumber));
         } else {
             // Generate the updated PR list, preserving the previous state of `isVerified` for existing PRs
             const PRList = _.reduce(
@@ -106,7 +103,7 @@ async function run() {
             }
 
             const didVersionChange = newVersionTag !== currentChecklistData.tag;
-            const {issueBody, issueAssignees} = await GithubUtils.generateStagingDeployCashBody(
+            checklistBody = await GithubUtils.generateStagingDeployCashBody(
                 newVersionTag,
                 _.pluck(PRList, 'url'),
                 _.pluck(_.where(PRList, {isVerified: true}), 'url'),
@@ -117,8 +114,6 @@ async function run() {
                 didVersionChange ? false : currentChecklistData.isFirebaseChecked,
                 didVersionChange ? false : currentChecklistData.isGHStatusChecked,
             );
-            checklistBody = issueBody;
-            checklistAssignees = issueAssignees;
         }
 
         // Finally, create or update the checklist
@@ -133,7 +128,7 @@ async function run() {
                 ...defaultPayload,
                 title: `Deploy Checklist: New Expensify ${format(new Date(), CONST.DATE_FORMAT_STRING)}`,
                 labels: [CONST.LABELS.STAGING_DEPLOY],
-                assignees: [CONST.APPLAUSE_BOT].concat(checklistAssignees),
+                assignees: [CONST.APPLAUSE_BOT],
             });
             console.log(`Successfully created new StagingDeployCash! 🎉 ${newChecklist.html_url}`);
             return newChecklist;
@@ -439,14 +434,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -481,11 +476,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -515,9 +510,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/actions/javascript/getArtifactInfo/index.js b/.github/actions/javascript/getArtifactInfo/index.js
index e4f7634bd849..ea56ff5f4ebd 100644
--- a/.github/actions/javascript/getArtifactInfo/index.js
+++ b/.github/actions/javascript/getArtifactInfo/index.js
@@ -321,14 +321,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -363,11 +363,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -397,9 +397,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/actions/javascript/getDeployPullRequestList/index.js b/.github/actions/javascript/getDeployPullRequestList/index.js
index f941c9524856..f272929d536a 100644
--- a/.github/actions/javascript/getDeployPullRequestList/index.js
+++ b/.github/actions/javascript/getDeployPullRequestList/index.js
@@ -377,14 +377,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -419,11 +419,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -453,9 +453,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/actions/javascript/getPullRequestDetails/index.js b/.github/actions/javascript/getPullRequestDetails/index.js
index f4168af28802..b8d7d821d64e 100644
--- a/.github/actions/javascript/getPullRequestDetails/index.js
+++ b/.github/actions/javascript/getPullRequestDetails/index.js
@@ -329,14 +329,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -371,11 +371,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -405,9 +405,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/actions/javascript/getReleaseBody/index.js b/.github/actions/javascript/getReleaseBody/index.js
index 547aafe23038..cc1321ce5cd5 100644
--- a/.github/actions/javascript/getReleaseBody/index.js
+++ b/.github/actions/javascript/getReleaseBody/index.js
@@ -329,14 +329,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -371,11 +371,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -405,9 +405,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/actions/javascript/isStagingDeployLocked/index.js b/.github/actions/javascript/isStagingDeployLocked/index.js
index 4938b5bb7745..8124c5795a5a 100644
--- a/.github/actions/javascript/isStagingDeployLocked/index.js
+++ b/.github/actions/javascript/isStagingDeployLocked/index.js
@@ -313,14 +313,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -355,11 +355,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -389,9 +389,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/actions/javascript/markPullRequestsAsDeployed/index.js b/.github/actions/javascript/markPullRequestsAsDeployed/index.js
index 2e6ab7e018dd..36cd0aaefe4a 100644
--- a/.github/actions/javascript/markPullRequestsAsDeployed/index.js
+++ b/.github/actions/javascript/markPullRequestsAsDeployed/index.js
@@ -478,14 +478,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -520,11 +520,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -554,9 +554,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/actions/javascript/postTestBuildComment/index.js b/.github/actions/javascript/postTestBuildComment/index.js
index 9dd23d68ca0a..329e0d3aad5d 100644
--- a/.github/actions/javascript/postTestBuildComment/index.js
+++ b/.github/actions/javascript/postTestBuildComment/index.js
@@ -388,14 +388,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -430,11 +430,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -464,9 +464,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/actions/javascript/reopenIssueWithComment/index.js b/.github/actions/javascript/reopenIssueWithComment/index.js
index 42196053f63f..6a5f89badb5e 100644
--- a/.github/actions/javascript/reopenIssueWithComment/index.js
+++ b/.github/actions/javascript/reopenIssueWithComment/index.js
@@ -283,14 +283,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -325,11 +325,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -359,9 +359,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/actions/javascript/reviewerChecklist/index.js b/.github/actions/javascript/reviewerChecklist/index.js
index 22335b36bd2b..322b529b89bf 100644
--- a/.github/actions/javascript/reviewerChecklist/index.js
+++ b/.github/actions/javascript/reviewerChecklist/index.js
@@ -283,14 +283,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -325,11 +325,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -359,9 +359,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/actions/javascript/verifySignedCommits/index.js b/.github/actions/javascript/verifySignedCommits/index.js
index 239f20c9d258..ba188d3a2b86 100644
--- a/.github/actions/javascript/verifySignedCommits/index.js
+++ b/.github/actions/javascript/verifySignedCommits/index.js
@@ -283,14 +283,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -325,11 +325,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -359,9 +359,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/.github/libs/GithubUtils.js b/.github/libs/GithubUtils.js
index e988167850ec..0cd407c78153 100644
--- a/.github/libs/GithubUtils.js
+++ b/.github/libs/GithubUtils.js
@@ -250,14 +250,14 @@ class GithubUtils {
             .then((data) => {
                 // The format of this map is following:
                 // {
-                //    'https://github.com/Expensify/App/pull/9641': 'PauloGasparSv',
-                //    'https://github.com/Expensify/App/pull/9642': 'mountiny'
+                //    'https://github.com/Expensify/App/pull/9641': [ 'PauloGasparSv', 'kidroca' ],
+                //    'https://github.com/Expensify/App/pull/9642': [ 'mountiny', 'kidroca' ]
                 // }
                 const internalQAPRMap = _.reduce(
                     _.filter(data, (pr) => !_.isEmpty(_.findWhere(pr.labels, {name: CONST.LABELS.INTERNAL_QA}))),
                     (map, pr) => {
                         // eslint-disable-next-line no-param-reassign
-                        map[pr.html_url] = pr.merged_by.login;
+                        map[pr.html_url] = _.compact(_.pluck(pr.assignees, 'login'));
                         return map;
                     },
                     {},
@@ -292,11 +292,11 @@ class GithubUtils {
                 if (!_.isEmpty(internalQAPRMap)) {
                     console.log('Found the following verified Internal QA PRs:', resolvedInternalQAPRs);
                     issueBody += '**Internal QA:**\r\n';
-                    _.each(internalQAPRMap, (merger, URL) => {
-                        const mergerMention = `@${merger}`;
+                    _.each(internalQAPRMap, (assignees, URL) => {
+                        const assigneeMentions = _.reduce(assignees, (memo, assignee) => `${memo} @${assignee}`, '');
                         issueBody += `${_.contains(resolvedInternalQAPRs, URL) ? '- [x]' : '- [ ]'} `;
                         issueBody += `${URL}`;
-                        issueBody += ` - ${mergerMention}`;
+                        issueBody += ` -${assigneeMentions}`;
                         issueBody += '\r\n';
                     });
                     issueBody += '\r\n\r\n';
@@ -326,9 +326,7 @@ class GithubUtils {
                 issueBody += `\r\n- [${isGHStatusChecked ? 'x' : ' '}] I checked [GitHub Status](https://www.githubstatus.com/) and verified there is no reported incident with Actions.`;
 
                 issueBody += '\r\n\r\ncc @Expensify/applauseleads\r\n';
-                const issueAssignees = _.values(internalQAPRMap);
-                const issue = {issueBody, issueAssignees};
-                return issue;
+                return issueBody;
             })
             .catch((err) => console.warn('Error generating StagingDeployCash issue body! Continuing...', err));
     }
diff --git a/tests/unit/GithubUtilsTest.ts b/tests/unit/GithubUtilsTest.ts
index 24e56402f1ea..794139286527 100644
--- a/tests/unit/GithubUtilsTest.ts
+++ b/tests/unit/GithubUtilsTest.ts
@@ -376,7 +376,6 @@ describe('GithubUtils', () => {
                         login: 'hubot',
                     },
                 ],
-                merged_by: {login: 'octocat'},
             },
             {
                 number: 7,
@@ -393,8 +392,14 @@ describe('GithubUtils', () => {
                         color: 'f29513',
                     },
                 ],
-                assignees: [],
-                merged_by: {login: 'hubot'},
+                assignees: [
+                    {
+                        login: 'octocat',
+                    },
+                    {
+                        login: 'hubot',
+                    },
+                ],
             },
         ];
         const mockGithub = jest.fn(() => ({
@@ -441,8 +446,7 @@ describe('GithubUtils', () => {
         const internalQAHeader = '\r\n\r\n**Internal QA:**';
         const lineBreak = '\r\n';
         const lineBreakDouble = '\r\n\r\n';
-        const assignOctocat = ' - @octocat';
-        const assignHubot = ' - @hubot';
+        const assignOctocatHubot = ' - @octocat @hubot';
         const deployerVerificationsHeader = '\r\n**Deployer verifications:**';
         // eslint-disable-next-line max-len
         const timingDashboardVerification =
@@ -464,8 +468,8 @@ describe('GithubUtils', () => {
             `${lineBreak}`;
 
         test('Test no verified PRs', () => {
-            githubUtils.generateStagingDeployCashBody(tag, basePRList).then((issue) => {
-                expect(issue.issueBody).toBe(
+            githubUtils.generateStagingDeployCashBody(tag, basePRList).then((issueBody: string) => {
+                expect(issueBody).toBe(
                     `${baseExpectedOutput}` +
                         `${openCheckbox}${basePRList[2]}` +
                         `${lineBreak}${openCheckbox}${basePRList[0]}` +
@@ -478,13 +482,12 @@ describe('GithubUtils', () => {
                         `${lineBreak}${openCheckbox}${ghVerification}` +
                         `${lineBreakDouble}${ccApplauseLeads}`,
                 );
-                expect(issue.issueAssignees).toEqual([]);
             });
         });
 
         test('Test some verified PRs', () => {
-            githubUtils.generateStagingDeployCashBody(tag, basePRList, [basePRList[0]]).then((issue) => {
-                expect(issue.issueBody).toBe(
+            githubUtils.generateStagingDeployCashBody(tag, basePRList, [basePRList[0]]).then((issueBody: string) => {
+                expect(issueBody).toBe(
                     `${baseExpectedOutput}` +
                         `${openCheckbox}${basePRList[2]}` +
                         `${lineBreak}${closedCheckbox}${basePRList[0]}` +
@@ -497,13 +500,12 @@ describe('GithubUtils', () => {
                         `${lineBreak}${openCheckbox}${ghVerification}` +
                         `${lineBreakDouble}${ccApplauseLeads}`,
                 );
-                expect(issue.issueAssignees).toEqual([]);
             });
         });
 
         test('Test all verified PRs', () => {
-            githubUtils.generateStagingDeployCashBody(tag, basePRList, basePRList).then((issue) => {
-                expect(issue.issueBody).toBe(
+            githubUtils.generateStagingDeployCashBody(tag, basePRList, basePRList).then((issueBody: string) => {
+                expect(issueBody).toBe(
                     `${allVerifiedExpectedOutput}` +
                         `${lineBreak}${deployerVerificationsHeader}` +
                         `${lineBreak}${openCheckbox}${timingDashboardVerification}` +
@@ -511,13 +513,12 @@ describe('GithubUtils', () => {
                         `${lineBreak}${openCheckbox}${ghVerification}` +
                         `${lineBreakDouble}${ccApplauseLeads}`,
                 );
-                expect(issue.issueAssignees).toEqual([]);
             });
         });
 
         test('Test no resolved deploy blockers', () => {
-            githubUtils.generateStagingDeployCashBody(tag, basePRList, basePRList, baseDeployBlockerList).then((issue) => {
-                expect(issue.issueBody).toBe(
+            githubUtils.generateStagingDeployCashBody(tag, basePRList, basePRList, baseDeployBlockerList).then((issueBody: string) => {
+                expect(issueBody).toBe(
                     `${allVerifiedExpectedOutput}` +
                         `${lineBreak}${deployBlockerHeader}` +
                         `${lineBreak}${openCheckbox}${baseDeployBlockerList[0]}` +
@@ -528,13 +529,12 @@ describe('GithubUtils', () => {
                         `${lineBreak}${openCheckbox}${ghVerification}${lineBreak}` +
                         `${lineBreak}${ccApplauseLeads}`,
                 );
-                expect(issue.issueAssignees).toEqual([]);
             });
         });
 
         test('Test some resolved deploy blockers', () => {
-            githubUtils.generateStagingDeployCashBody(tag, basePRList, basePRList, baseDeployBlockerList, [baseDeployBlockerList[0]]).then((issue) => {
-                expect(issue.issueBody).toBe(
+            githubUtils.generateStagingDeployCashBody(tag, basePRList, basePRList, baseDeployBlockerList, [baseDeployBlockerList[0]]).then((issueBody: string) => {
+                expect(issueBody).toBe(
                     `${allVerifiedExpectedOutput}` +
                         `${lineBreak}${deployBlockerHeader}` +
                         `${lineBreak}${closedCheckbox}${baseDeployBlockerList[0]}` +
@@ -545,13 +545,12 @@ describe('GithubUtils', () => {
                         `${lineBreak}${openCheckbox}${ghVerification}` +
                         `${lineBreakDouble}${ccApplauseLeads}`,
                 );
-                expect(issue.issueAssignees).toEqual([]);
             });
         });
 
         test('Test all resolved deploy blockers', () => {
-            githubUtils.generateStagingDeployCashBody(tag, basePRList, basePRList, baseDeployBlockerList, baseDeployBlockerList).then((issue) => {
-                expect(issue.issueBody).toBe(
+            githubUtils.generateStagingDeployCashBody(tag, basePRList, basePRList, baseDeployBlockerList, baseDeployBlockerList).then((issueBody: string) => {
+                expect(issueBody).toBe(
                     `${baseExpectedOutput}` +
                         `${closedCheckbox}${basePRList[2]}` +
                         `${lineBreak}${closedCheckbox}${basePRList[0]}` +
@@ -567,13 +566,12 @@ describe('GithubUtils', () => {
                         `${lineBreak}${openCheckbox}${ghVerification}` +
                         `${lineBreakDouble}${ccApplauseLeads}`,
                 );
-                expect(issue.issueAssignees).toEqual([]);
             });
         });
 
         test('Test internalQA PRs', () => {
-            githubUtils.generateStagingDeployCashBody(tag, [...basePRList, ...internalQAPRList]).then((issue) => {
-                expect(issue.issueBody).toBe(
+            githubUtils.generateStagingDeployCashBody(tag, [...basePRList, ...internalQAPRList]).then((issueBody: string) => {
+                expect(issueBody).toBe(
                     `${baseExpectedOutput}` +
                         `${openCheckbox}${basePRList[2]}` +
                         `${lineBreak}${openCheckbox}${basePRList[0]}` +
@@ -581,21 +579,20 @@ describe('GithubUtils', () => {
                         `${lineBreak}${closedCheckbox}${basePRList[4]}` +
                         `${lineBreak}${closedCheckbox}${basePRList[5]}` +
                         `${lineBreak}${internalQAHeader}` +
-                        `${lineBreak}${openCheckbox}${internalQAPRList[0]}${assignOctocat}` +
-                        `${lineBreak}${openCheckbox}${internalQAPRList[1]}${assignHubot}` +
+                        `${lineBreak}${openCheckbox}${internalQAPRList[0]}${assignOctocatHubot}` +
+                        `${lineBreak}${openCheckbox}${internalQAPRList[1]}${assignOctocatHubot}` +
                         `${lineBreakDouble}${deployerVerificationsHeader}` +
                         `${lineBreak}${openCheckbox}${timingDashboardVerification}` +
                         `${lineBreak}${openCheckbox}${firebaseVerification}` +
                         `${lineBreak}${openCheckbox}${ghVerification}` +
                         `${lineBreakDouble}${ccApplauseLeads}`,
                 );
-                expect(issue.issueAssignees).toEqual(['octocat', 'hubot']);
             });
         });
 
         test('Test some verified internalQA PRs', () => {
-            githubUtils.generateStagingDeployCashBody(tag, [...basePRList, ...internalQAPRList], [], [], [], [internalQAPRList[0]]).then((issue) => {
-                expect(issue.issueBody).toBe(
+            githubUtils.generateStagingDeployCashBody(tag, [...basePRList, ...internalQAPRList], [], [], [], [internalQAPRList[0]]).then((issueBody: string) => {
+                expect(issueBody).toBe(
                     `${baseExpectedOutput}` +
                         `${openCheckbox}${basePRList[2]}` +
                         `${lineBreak}${openCheckbox}${basePRList[0]}` +
@@ -603,15 +600,14 @@ describe('GithubUtils', () => {
                         `${lineBreak}${closedCheckbox}${basePRList[4]}` +
                         `${lineBreak}${closedCheckbox}${basePRList[5]}` +
                         `${lineBreak}${internalQAHeader}` +
-                        `${lineBreak}${closedCheckbox}${internalQAPRList[0]}${assignOctocat}` +
-                        `${lineBreak}${openCheckbox}${internalQAPRList[1]}${assignHubot}` +
+                        `${lineBreak}${closedCheckbox}${internalQAPRList[0]}${assignOctocatHubot}` +
+                        `${lineBreak}${openCheckbox}${internalQAPRList[1]}${assignOctocatHubot}` +
                         `${lineBreakDouble}${deployerVerificationsHeader}` +
                         `${lineBreak}${openCheckbox}${timingDashboardVerification}` +
                         `${lineBreak}${openCheckbox}${firebaseVerification}` +
                         `${lineBreak}${openCheckbox}${ghVerification}` +
                         `${lineBreakDouble}${ccApplauseLeads}`,
                 );
-                expect(issue.issueAssignees).toEqual(['octocat', 'hubot']);
             });
         });
     });

From d37b25e1deda4c01add3253bcddff8c5d2fa36f7 Mon Sep 17 00:00:00 2001
From: OSBotify <infra+osbotify@expensify.com>
Date: Mon, 11 Mar 2024 11:40:56 +0000
Subject: [PATCH 107/110] Update version to 1.4.50-2

---
 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 cb12616ee216..a4fd0796f6ff 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 1001045001
-        versionName "1.4.50-1"
+        versionCode 1001045002
+        versionName "1.4.50-2"
     }
 
     flavorDimensions "default"
diff --git a/ios/NewExpensify/Info.plist b/ios/NewExpensify/Info.plist
index 97eb55747062..dde63923045f 100644
--- a/ios/NewExpensify/Info.plist
+++ b/ios/NewExpensify/Info.plist
@@ -40,7 +40,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.4.50.1</string>
+	<string>1.4.50.2</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>
diff --git a/ios/NewExpensifyTests/Info.plist b/ios/NewExpensifyTests/Info.plist
index af8e99100825..212d94afdbdb 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.50.1</string>
+	<string>1.4.50.2</string>
 </dict>
 </plist>
diff --git a/ios/NotificationServiceExtension/Info.plist b/ios/NotificationServiceExtension/Info.plist
index a4c7b52661b6..16e9bac88187 100644
--- a/ios/NotificationServiceExtension/Info.plist
+++ b/ios/NotificationServiceExtension/Info.plist
@@ -13,7 +13,7 @@
 	<key>CFBundleShortVersionString</key>
 	<string>1.4.50</string>
 	<key>CFBundleVersion</key>
-	<string>1.4.50.1</string>
+	<string>1.4.50.2</string>
 	<key>NSExtension</key>
 	<dict>
 		<key>NSExtensionPointIdentifier</key>
diff --git a/package-lock.json b/package-lock.json
index ac65cd05115d..d009c9d3ad3c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "new.expensify",
-  "version": "1.4.50-1",
+  "version": "1.4.50-2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "new.expensify",
-      "version": "1.4.50-1",
+      "version": "1.4.50-2",
       "hasInstallScript": true,
       "license": "MIT",
       "dependencies": {
diff --git a/package.json b/package.json
index 7af92881d627..62da9d177dca 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.4.50-1",
+  "version": "1.4.50-2",
   "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 ecb3f5832d0b9bef2441f8e440fa91d362b405ef Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Mon, 11 Mar 2024 13:16:21 +0100
Subject: [PATCH 108/110] TS updates for the new code

---
 src/pages/home/ReportScreen.tsx             | 6 ++----
 src/pages/home/report/ReportActionsView.tsx | 7 ++-----
 2 files changed, 4 insertions(+), 9 deletions(-)

diff --git a/src/pages/home/ReportScreen.tsx b/src/pages/home/ReportScreen.tsx
index 5dbb07edf8ff..f9f73be2ab45 100644
--- a/src/pages/home/ReportScreen.tsx
+++ b/src/pages/home/ReportScreen.tsx
@@ -352,9 +352,7 @@ function ReportScreen({
             ComposerActions.setShouldShowComposeInput(true);
         });
         return () => {
-            if (interactionTask) {
-                interactionTask.cancel();
-            }
+            interactionTask?.cancel();
             if (!didSubscribeToReportLeavingEvents) {
                 return;
             }
@@ -428,7 +426,7 @@ function ReportScreen({
         // any `pendingFields.createChat` or `pendingFields.addWorkspaceRoom` fields are set to null.
         // Existing reports created will have empty fields for `pendingFields`.
         const didCreateReportSuccessfully = !report.pendingFields || (!report.pendingFields.addWorkspaceRoom && !report.pendingFields.createChat);
-        let interactionTask;
+        let interactionTask: ReturnType<typeof InteractionManager.runAfterInteractions> | undefined;
         if (!didSubscribeToReportLeavingEvents.current && didCreateReportSuccessfully) {
             interactionTask = InteractionManager.runAfterInteractions(() => {
                 Report.subscribeToReportLeavingEvents(reportID);
diff --git a/src/pages/home/report/ReportActionsView.tsx b/src/pages/home/report/ReportActionsView.tsx
index 4dd4d66d89e8..e8401289fc85 100755
--- a/src/pages/home/report/ReportActionsView.tsx
+++ b/src/pages/home/report/ReportActionsView.tsx
@@ -95,10 +95,7 @@ function ReportActionsView({
             openReportIfNecessary();
         });
         return () => {
-            if (!interactionTask) {
-                return;
-            }
-            interactionTask.cancel();
+            interactionTask?.cancel();
         };
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
@@ -153,7 +150,7 @@ function ReportActionsView({
         // any `pendingFields.createChat` or `pendingFields.addWorkspaceRoom` fields are set to null.
         // Existing reports created will have empty fields for `pendingFields`.
         const didCreateReportSuccessfully = !report.pendingFields || (!report.pendingFields.addWorkspaceRoom && !report.pendingFields.createChat);
-        let interactionTask;
+        let interactionTask: ReturnType<typeof InteractionManager.runAfterInteractions> | undefined;
         if (!didSubscribeToReportTypingEvents.current && didCreateReportSuccessfully) {
             interactionTask = InteractionManager.runAfterInteractions(() => {
                 Report.subscribeToReportTypingEvents(reportID);

From b1b642c8381fb8afc2fd913cc7cae4a430b7bbf4 Mon Sep 17 00:00:00 2001
From: jeremy-croff <jeremycroff@gmail.com>
Date: Mon, 11 Mar 2024 09:45:54 -0500
Subject: [PATCH 109/110] fix(36381): prettier

---
 src/components/BaseMiniContextMenuItem.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/BaseMiniContextMenuItem.tsx b/src/components/BaseMiniContextMenuItem.tsx
index cc501e04be11..6e1a1e0fd229 100644
--- a/src/components/BaseMiniContextMenuItem.tsx
+++ b/src/components/BaseMiniContextMenuItem.tsx
@@ -42,7 +42,10 @@ type BaseMiniContextMenuItemProps = {
  * Component that renders a mini context menu item with a
  * pressable. Also renders a tooltip when hovering the item.
  */
-function BaseMiniContextMenuItem({tooltipText, onPress, children, isDelayButtonStateComplete = true, shouldPreventDefaultFocusOnPress = true}: BaseMiniContextMenuItemProps, ref: ForwardedRef<View>) {
+function BaseMiniContextMenuItem(
+    {tooltipText, onPress, children, isDelayButtonStateComplete = true, shouldPreventDefaultFocusOnPress = true}: BaseMiniContextMenuItemProps,
+    ref: ForwardedRef<View>,
+) {
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     return (

From d07e281b5b6658da1d09110a0a1d774f01bd6a89 Mon Sep 17 00:00:00 2001
From: Tomasz Lesniakiewicz <tlesniakiewicz@gmail.com>
Date: Mon, 11 Mar 2024 17:16:47 +0100
Subject: [PATCH 110/110] feat: hardcode graphite name and port

---
 .github/workflows/reassurePerformanceTests.yml | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/.github/workflows/reassurePerformanceTests.yml b/.github/workflows/reassurePerformanceTests.yml
index 85fb866b05c4..9887943c77e0 100644
--- a/.github/workflows/reassurePerformanceTests.yml
+++ b/.github/workflows/reassurePerformanceTests.yml
@@ -69,9 +69,6 @@ jobs:
         uses: ./.github/actions/javascript/getGraphiteString
 
       - name: Send graphite data
-        env:
-          GRAPHITE_SERVER: ${{ vars.GRAPHITE_SERVER }}
-          GRAPHITE_PORT: ${{ vars.GRAPHITE_PORT }}
         # run only when merged to main
         if: github.event.pull_request.merged == true && github.event.pull_request.base.ref == 'main'
-        run: echo -e "${{ steps.saveGraphiteString.outputs.GRAPHITE_STRING }}" | nc -q0 "$GRAPHITE_SERVER" "$GRAPHITE_PORT"
+        run: echo -e "${{ steps.saveGraphiteString.outputs.GRAPHITE_STRING }}" | nc -q0 stats.expensify.com 3003