fix another merge conflict

.eslintrc.js

@@ -37,10 +37,12 @@ module.exports = {
     overrides: [
         {
             files: ['*.js', '*.jsx', '*.ts', '*.tsx'],
+            plugins: ['react'],
             rules: {
                 'rulesdir/no-multiple-onyx-in-file': 'off',
                 'rulesdir/onyx-props-must-have-default': 'off',
                 'react-native-a11y/has-accessibility-hint': ['off'],
+                'react/jsx-no-constructed-context-values': 'error',
                 'react-native-a11y/has-valid-accessibility-descriptors': [
                     'error',
                     {

android/app/build.gradle

@@ -90,8 +90,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001038701
-        versionName "1.3.87-1"
+        versionCode 1001038708
+        versionName "1.3.87-8"
     }
 
     flavorDimensions "default"

docs/articles/expensify-classic/workspace-and-domain-settings/Expenses.md

@@ -4,7 +4,7 @@ description: Expense Settings
 ---
 # Overview
 
-Expensify offers multiple ways to customize how expenses are created in your workspace. In this doc, you’ll learn how to set up and expense basics, distance expenses, and time expenses. 
+Expensify offers multiple ways to customize how expenses are created in your workspace. In this doc, you’ll learn how to set up expense basics, distance expenses, and time expenses. 
 
 Whether you’re flying solo with your Individual workspace or submitting with a team on your Group workspace, we have settings to support how you use Expensify.
 
@@ -69,7 +69,7 @@ Preliminary setup steps include:
 3. Click **Add A Mileage Rate** to add as many rates as you need, 
 4. Set the reimbursable amount per mile or kilometer. 
 
-Note: _If a rate is toggled off it is immediately disabled. This means that users are no longer able to select it when creating a new distance expense. If only one rate is available then this rate will be toggled on by default._
+Note: _If a rate is toggled off it is immediately disabled. This means that users are no longer able to select it when creating a new distance expense. If only one rate is available then that rate will be toggled on by default._
 
 ## Set an hourly rate
 
@@ -96,7 +96,7 @@ Note: _If a report has audit alerts on it, you'll need to Review the report and
 
 ## Tracking tax on mileage expenses
 
-If you’re tracking tax in Expensify you can also track tax on distance expenses. The first step is to enable tax the workspace. You can do this by going to  **Settings** > **Workspaces** > **Individual** or **Group** > [_Workspace Name_] > **Tax**.
+If you’re tracking tax in Expensify you can also track tax on distance expenses. The first step is to enable tax in the workspace. You can do this by going to  **Settings** > **Workspaces** > **Individual** or **Group** > [_Workspace Name_] > **Tax**.
 
 Once tax is enabled on a workspace level you will see a toggle to _Track Tax_ in the Distance section of the workspace settings. If tax is disabled on the workspace the Track Tax toggle will not display.
 

ios/NewExpensify/Info.plist

@@ -40,7 +40,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.3.87.1</string>
+	<string>1.3.87.8</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>

ios/NewExpensifyTests/Info.plist

@@ -19,6 +19,6 @@
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.3.87.1</string>
+	<string>1.3.87.8</string>
 </dict>
 </plist>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.3.87-1",
+  "version": "1.3.87-8",
   "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.",

src/CONST.ts

@@ -79,6 +79,10 @@ const CONST = {
         RESERVED_FIRST_NAMES: ['Expensify', 'Concierge'],
     },
 
+    LEGAL_NAME: {
+        MAX_LENGTH: 40,
+    },
+
     PULL_REQUEST_NUMBER,
 
     MERCHANT_NAME_MAX_LENGTH: 255,

src/components/AnimatedStep/AnimatedStepProvider.js

@@ -1,4 +1,4 @@
-import React, {useState} from 'react';
+import React, {useMemo, useState} from 'react';
 import PropTypes from 'prop-types';
 import AnimatedStepContext from './AnimatedStepContext';
 import CONST from '../../CONST';
@@ -9,8 +9,9 @@ const propTypes = {
 
 function AnimatedStepProvider({children}) {
     const [animationDirection, setAnimationDirection] = useState(CONST.ANIMATION_DIRECTION.IN);
+    const contextValue = useMemo(() => ({animationDirection, setAnimationDirection}), [animationDirection, setAnimationDirection]);
 
-    return <AnimatedStepContext.Provider value={{animationDirection, setAnimationDirection}}>{children}</AnimatedStepContext.Provider>;
+    return <AnimatedStepContext.Provider value={contextValue}>{children}</AnimatedStepContext.Provider>;
 }
 
 AnimatedStepProvider.propTypes = propTypes;

src/components/Attachments/AttachmentCarousel/Pager/index.js

@@ -1,5 +1,5 @@
 /* eslint-disable es/no-optional-chaining */
-import React, {useRef, useState, useImperativeHandle} from 'react';
+import React, {useRef, useState, useImperativeHandle, useMemo} from 'react';
 import {View} from 'react-native';
 import PropTypes from 'prop-types';
 import {GestureHandlerRootView, createNativeWrapper} from 'react-native-gesture-handler';
@@ -126,22 +126,25 @@ function AttachmentCarouselPager({
         scrollEnabled: shouldPagerScroll.value,
     }));
 
+    const contextValue = useMemo(
+        () => ({
+            canvasWidth: containerWidth,
+            canvasHeight: containerHeight,
+            isScrolling,
+            pagerRef,
+            shouldPagerScroll,
+            onPinchGestureChange,
+            onTap,
+            onSwipe,
+            onSwipeSuccess,
+            onSwipeDown,
+        }),
+        [containerWidth, containerHeight, isScrolling, pagerRef, shouldPagerScroll, onPinchGestureChange, onTap, onSwipe, onSwipeSuccess, onSwipeDown],
+    );
+
     return (
         <GestureHandlerRootView style={styles.flex1}>
-            <AttachmentCarouselPagerContext.Provider
-                value={{
-                    canvasWidth: containerWidth,
-                    canvasHeight: containerHeight,
-                    isScrolling,
-                    pagerRef,
-                    shouldPagerScroll,
-                    onPinchGestureChange,
-                    onTap,
-                    onSwipe,
-                    onSwipeSuccess,
-                    onSwipeDown,
-                }}
-            >
+            <AttachmentCarouselPagerContext.Provider value={contextValue}>
                 <AnimatedPagerView
                     pageMargin={40}
                     offscreenPageLimit={1}

src/components/DragAndDrop/Provider/index.js

@@ -1,5 +1,5 @@
 import _ from 'underscore';
-import React, {useRef, useCallback, useEffect} from 'react';
+import React, {useRef, useCallback, useEffect, useMemo} from 'react';
 import {View} from 'react-native';
 import {PortalHost} from '@gorhom/portal';
 import Str from 'expensify-common/lib/str';
@@ -37,8 +37,9 @@ function DragAndDropProvider({children, isDisabled = false, setIsDraggingOver =
         setIsDraggingOver(isDraggingOver);
     }, [isDraggingOver, setIsDraggingOver]);
 
+    const contextValue = useMemo(() => ({isDraggingOver, setOnDropHandler, dropZoneID: dropZoneID.current}), [isDraggingOver, setOnDropHandler]);
     return (
-        <DragAndDropContext.Provider value={{isDraggingOver, setOnDropHandler, dropZoneID: dropZoneID.current}}>
+        <DragAndDropContext.Provider value={contextValue}>
             <View
                 ref={(e) => (dropZone.current = e)}
                 style={[styles.flex1, styles.w100, styles.h100]}

src/components/PopoverProvider/index.js

@@ -118,18 +118,17 @@ function PopoverContextProvider(props) {
         [closePopover],
     );
 
-    return (
-        <PopoverContext.Provider
-            value={{
-                onOpen,
-                close: closePopover,
-                popover: activePopoverRef.current,
-                isOpen,
-            }}
-        >
-            {props.children}
-        </PopoverContext.Provider>
+    const contextValue = React.useMemo(
+        () => ({
+            onOpen,
+            close: closePopover,
+            popover: activePopoverRef.current,
+            isOpen,
+        }),
+        [onOpen, closePopover, isOpen],
     );
+
+    return <PopoverContext.Provider value={contextValue}>{props.children}</PopoverContext.Provider>;
 }
 
 PopoverContextProvider.defaultProps = defaultProps;

src/components/PopoverProvider/index.native.js

@@ -15,18 +15,17 @@ const PopoverContext = React.createContext({
 });
 
 function PopoverContextProvider(props) {
-    return (
-        <PopoverContext.Provider
-            value={{
-                onOpen: () => {},
-                close: () => {},
-                popover: {},
-                isOpen: false,
-            }}
-        >
-            {props.children}
-        </PopoverContext.Provider>
+    const contextValue = React.useMemo(
+        () => ({
+            onOpen: () => {},
+            close: () => {},
+            popover: {},
+            isOpen: false,
+        }),
+        [],
     );
+
+    return <PopoverContext.Provider value={contextValue}>{props.children}</PopoverContext.Provider>;
 }
 
 PopoverContextProvider.defaultProps = defaultProps;

src/components/ReportActionItem/MoneyReportView.js

@@ -41,34 +41,34 @@ function MoneyReportView(props) {
     const subAmountTextStyles = [styles.taskTitleMenuItem, styles.alignSelfCenter, StyleUtils.getFontSizeStyle(variables.fontSizeh1), StyleUtils.getColorStyle(themeColors.textSupporting)];
 
     return (
-        <View>
-            <View style={[StyleUtils.getReportWelcomeContainerStyle(props.isSmallScreenWidth), StyleUtils.getMinimumHeight(CONST.EMPTY_STATE_BACKGROUND.MONEY_REPORT.MIN_HEIGHT)]}>
-                <AnimatedEmptyStateBackground />
-            </View>
-            <View style={[styles.flexRow, styles.pointerEventsNone, styles.containerWithSpaceBetween, styles.ph5, styles.pv2]}>
-                <View style={[styles.flex1, styles.justifyContentCenter]}>
-                    <Text
-                        style={[styles.textLabelSupporting]}
-                        numberOfLines={1}
-                    >
-                        {translate('common.total')}
-                    </Text>
-                </View>
-                <View style={[styles.flexRow, styles.justifyContentCenter]}>
-                    {isSettled && (
-                        <View style={[styles.defaultCheckmarkWrapper, styles.mh2]}>
-                            <Icon
-                                src={Expensicons.Checkmark}
-                                fill={themeColors.success}
-                            />
-                        </View>
-                    )}
-                    <Text
-                        numberOfLines={1}
-                        style={[styles.taskTitleMenuItem, styles.alignSelfCenter]}
-                    >
-                        {formattedTotalAmount}
-                    </Text>
+        <View style={[StyleUtils.getReportWelcomeContainerStyle(props.isSmallScreenWidth), StyleUtils.getMinimumHeight(CONST.EMPTY_STATE_BACKGROUND.MONEY_REPORT.MIN_HEIGHT)]}>
+            <AnimatedEmptyStateBackground />
+            <View style={[StyleUtils.getReportWelcomeTopMarginStyle(props.isSmallScreenWidth)]}>
+                <View style={[styles.flexRow, styles.pointerEventsNone, styles.containerWithSpaceBetween, styles.ph5, styles.pv2]}>
+                    <View style={[styles.flex1, styles.justifyContentCenter]}>
+                        <Text
+                            style={[styles.textLabelSupporting]}
+                            numberOfLines={1}
+                        >
+                            {translate('common.total')}
+                        </Text>
+                    </View>
+                    <View style={[styles.flexRow, styles.justifyContentCenter]}>
+                        {isSettled && (
+                            <View style={[styles.defaultCheckmarkWrapper, styles.mh2]}>
+                                <Icon
+                                    src={Expensicons.Checkmark}
+                                    fill={themeColors.success}
+                                />
+                            </View>
+                        )}
+                        <Text
+                            numberOfLines={1}
+                            style={[styles.taskTitleMenuItem, styles.alignSelfCenter]}
+                        >
+                            {formattedTotalAmount}
+                        </Text>
+                    </View>
                 </View>
             </View>
             {shouldShowBreakdown ? (