Merge branch 'main' into cmartins-replaceReceipt

android/app/build.gradle

@@ -90,8 +90,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001037006
-        versionName "1.3.70-6"
+        versionCode 1001037105
+        versionName "1.3.71-5"
     }
 
     flavorDimensions "default"

ios/NewExpensify/Info.plist

@@ -19,7 +19,7 @@
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.3.70</string>
+	<string>1.3.71</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleURLTypes</key>
@@ -40,7 +40,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.3.70.6</string>
+	<string>1.3.71.5</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>

ios/NewExpensifyTests/Info.plist

@@ -15,10 +15,10 @@
 	<key>CFBundlePackageType</key>
 	<string>BNDL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.3.70</string>
+	<string>1.3.71</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.3.70.6</string>
+	<string>1.3.71.5</string>
 </dict>
 </plist>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.3.70-6",
+  "version": "1.3.71-5",
   "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.",
@@ -94,7 +94,6 @@
     "domhandler": "^4.3.0",
     "expensify-common": "git+ssh://[email protected]/Expensify/expensify-common.git#35bff866a8d345b460ea6256f0a0f0a8a7f81086",
     "fbjs": "^3.0.2",
-    "focus-trap-react": "^10.2.1",
     "htmlparser2": "^7.2.0",
     "idb-keyval": "^6.2.1",
     "jest-when": "^3.5.2",
@@ -113,6 +112,7 @@
     "react-content-loader": "^6.1.0",
     "react-dom": "18.1.0",
     "react-map-gl": "^7.1.3",
+    "react-error-boundary": "^4.0.11",
     "react-native": "0.72.3",
     "react-native-blob-util": "^0.17.3",
     "react-native-collapsible": "^1.6.0",

src/Expensify.js

@@ -30,7 +30,6 @@ import KeyboardShortcutsModal from './components/KeyboardShortcutsModal';
 import AppleAuthWrapper from './components/SignInButtons/AppleAuthWrapper';
 import EmojiPicker from './components/EmojiPicker/EmojiPicker';
 import * as EmojiPickerAction from './libs/actions/EmojiPickerAction';
-import DownloadAppModal from './components/DownloadAppModal';
 import DeeplinkWrapper from './components/DeeplinkWrapper';
 
 // This lib needs to be imported, but it has nothing to export since all it contains is an Onyx connection
@@ -193,7 +192,6 @@ function Expensify(props) {
         <DeeplinkWrapper isAuthenticated={isAuthenticated}>
             {shouldInit && (
                 <>
-                    <DownloadAppModal isAuthenticated={isAuthenticated} />
                     <KeyboardShortcutsModal />
                     <GrowlNotification ref={Growl.growlRef} />
                     <PopoverReportActionContextMenu ref={ReportActionContextMenu.contextMenuRef} />

src/ONYXKEYS.ts

@@ -87,9 +87,6 @@ const ONYXKEYS = {
     SESSION: 'session',
     BETAS: 'betas',
 
-    /** Denotes if the Download App Banner has been dismissed */
-    SHOW_DOWNLOAD_APP_BANNER: 'showDownloadAppBanner',
-
     /** NVP keys
      * Contains the user's payPalMe data */
     PAYPAL: 'paypal',
@@ -307,7 +304,6 @@ type OnyxValues = {
     [ONYXKEYS.ACTIVE_CLIENTS]: string[];
     [ONYXKEYS.DEVICE_ID]: string;
     [ONYXKEYS.IS_SIDEBAR_LOADED]: boolean;
-    [ONYXKEYS.SHOW_DOWNLOAD_APP_BANNER]: boolean;
     [ONYXKEYS.PERSISTED_REQUESTS]: OnyxTypes.Request[];
     [ONYXKEYS.QUEUED_ONYX_UPDATES]: OnyxTypes.QueuedOnyxUpdates;
     [ONYXKEYS.CURRENT_DATE]: string;

src/components/AvatarWithImagePicker.js

@@ -23,6 +23,8 @@ import getImageResolution from '../libs/fileDownload/getImageResolution';
 import PressableWithoutFeedback from './Pressable/PressableWithoutFeedback';
 import DotIndicatorMessage from './DotIndicatorMessage';
 import * as Browser from '../libs/Browser';
+import withNavigationFocus, {withNavigationFocusPropTypes} from './withNavigationFocus';
+import compose from '../libs/compose';
 
 const propTypes = {
     /** Avatar source to display */
@@ -80,6 +82,7 @@ const propTypes = {
     errors: PropTypes.object,
 
     ...withLocalizePropTypes,
+    ...withNavigationFocusPropTypes,
 };
 
 const defaultProps = {
@@ -129,6 +132,9 @@ class AvatarWithImagePicker extends React.Component {
     }
 
     componentDidUpdate(prevProps) {
+        if (!prevProps.isFocused && this.props.isFocused) {
+            this.setError(null, {});
+        }
         if (!prevProps.isUploading && this.props.isUploading) {
             this.animation.start();
         } else if (prevProps.isUploading && !this.props.isUploading) {
@@ -350,4 +356,4 @@ class AvatarWithImagePicker extends React.Component {
 AvatarWithImagePicker.propTypes = propTypes;
 AvatarWithImagePicker.defaultProps = defaultProps;
 
-export default withLocalize(AvatarWithImagePicker);
+export default compose(withLocalize, withNavigationFocus)(AvatarWithImagePicker);

src/components/Button/index.js

@@ -218,6 +218,7 @@ class Button extends Component {
                     this.props.icon && styles.textAlignLeft,
                     ...this.props.textStyles,
                 ]}
+                dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
             >
                 {this.props.text}
             </Text>

src/components/CollapsibleSection/index.js

@@ -51,6 +51,7 @@ class CollapsibleSection extends React.Component {
                     <Text
                         selectable={false}
                         style={[styles.flex1, styles.textStrong]}
+                        dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
                     >
                         {this.props.title}
                     </Text>

src/components/ConfirmContent.js

@@ -100,8 +100,8 @@ function ConfirmContent(props) {
                         <View style={[styles.flexRow, styles.mb3]}>
                             <Icon
                                 src={props.iconSource}
-                                width={variables.downloadAppModalAppIconSize}
-                                height={variables.downloadAppModalAppIconSize}
+                                width={variables.appModalAppIconSize}
+                                height={variables.appModalAppIconSize}
                                 additionalStyles={[...props.iconAdditionalStyles]}
                             />
                         </View>

src/components/ConfirmedRoute.js

@@ -1,9 +1,9 @@
 import React, {useEffect} from 'react';
 import PropTypes from 'prop-types';
-import {View} from 'react-native';
 
 import {withOnyx} from 'react-native-onyx';
 import lodashGet from 'lodash/get';
+import lodashIsNil from 'lodash/isNil';
 import _ from 'underscore';
 import ONYXKEYS from '../ONYXKEYS';
 import CONST from '../CONST';
@@ -13,9 +13,8 @@ import * as Expensicons from './Icon/Expensicons';
 import theme from '../styles/themes/default';
 import styles from '../styles/styles';
 import transactionPropTypes from './transactionPropTypes';
-import BlockingView from './BlockingViews/BlockingView';
+import PendingMapView from './MapView/PendingMapView';
 import useNetwork from '../hooks/useNetwork';
-import useLocalize from '../hooks/useLocalize';
 import DistanceMapView from './DistanceMapView';
 
 const propTypes = {
@@ -44,7 +43,7 @@ const getWaypointMarkers = (waypoints) => {
     const lastWaypointIndex = numberOfWaypoints - 1;
     return _.filter(
         _.map(waypoints, (waypoint, key) => {
-            if (!waypoint || waypoint.lng === undefined || waypoint.lat === undefined) {
+            if (!waypoint || lodashIsNil(waypoint.lat) || lodashIsNil(waypoint.lng)) {
                 return;
             }
 
@@ -76,7 +75,6 @@ const getWaypointMarkers = (waypoints) => {
 
 function ConfirmedRoute({mapboxAccessToken, transaction}) {
     const {isOffline} = useNetwork();
-    const {translate} = useLocalize();
     const {route0: route} = transaction.routes || {};
     const waypoints = lodashGet(transaction, 'comment.waypoints', {});
     const coordinates = lodashGet(route, 'geometry.coordinates', []);
@@ -104,14 +102,7 @@ function ConfirmedRoute({mapboxAccessToken, transaction}) {
                     styleURL={CONST.MAPBOX.STYLE_URL}
                 />
             ) : (
-                <View style={[styles.mapPendingView]}>
-                    <BlockingView
-                        icon={Expensicons.EmptyStateRoutePending}
-                        title={translate('distance.mapPending.title')}
-                        subtitle={isOffline ? translate('distance.mapPending.subtitle') : translate('distance.mapPending.onlineSubtitle')}
-                        shouldShowLink={false}
-                    />
-                </View>
+                <PendingMapView />
             )}
         </>
     );