Merge branch 'Expensify:main' into rm-setNativeProps-form

Expensify · Oct 7, 2022 · c72e7ac · c72e7ac
2 parents aab173b + 44bf1ff
commit c72e7ac
Show file tree

Hide file tree

Showing 47 changed files with 606 additions and 274 deletions.
diff --git a/android/app/build.gradle b/android/app/build.gradle
@@ -156,8 +156,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001021103
-        versionName "1.2.11-3"
+        versionCode 1001021202
+        versionName "1.2.12-2"
         buildConfigField "boolean", "IS_NEW_ARCHITECTURE_ENABLED", isNewArchitectureEnabled().toString()
 
         if (isNewArchitectureEnabled()) {

diff --git a/ios/NewExpensify/Info.plist b/ios/NewExpensify/Info.plist
@@ -17,7 +17,7 @@
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.2.11</string>
+	<string>1.2.12</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleURLTypes</key>
@@ -30,7 +30,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.2.11.3</string>
+	<string>1.2.12.2</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>

diff --git 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.2.11</string>
+	<string>1.2.12</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.2.11.3</string>
+	<string>1.2.12.2</string>
 </dict>
 </plist>
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.2.11-3",
+  "version": "1.2.12-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.",

diff --git a/src/CONST.js b/src/CONST.js
@@ -88,6 +88,10 @@ const CONST = {
         },
         REGEX: {
             US_ACCOUNT_NUMBER: /^[0-9]{4,17}$/,
+
+            // If the account number length is from 4 to 13 digits, we show the last 4 digits and hide the rest with X
+            // If the length is longer than 13 digits, we show the first 6 and last 4 digits, hiding the rest with X
+            MASKED_US_ACCOUNT_NUMBER: /^[X]{0,9}[0-9]{4}$|^[0-9]{6}[X]{4,7}[0-9]{4}$/,
             SWIFT_BIC: /^[A-Za-z0-9]{8,11}$/,
         },
         VERIFICATION_MAX_ATTEMPTS: 7,
@@ -801,6 +805,7 @@ const CONST = {
     },
     BRICK_ROAD_INDICATOR_STATUS: {
         ERROR: 'error',
+        INFO: 'info',
     },
     REPORT_DETAILS_MENU_ITEM: {
         MEMBERS: 'member',

diff --git a/src/ONYXKEYS.js b/src/ONYXKEYS.js
@@ -24,9 +24,6 @@ export default {
     // Stores current date
     CURRENT_DATE: 'currentDate',
 
-    // Currently viewed reportID
-    CURRENTLY_VIEWED_REPORTID: 'currentlyViewedReportID',
-
     // Credentials to authenticate the user
     CREDENTIALS: 'credentials',
 
@@ -161,9 +158,6 @@ export default {
     // Is policy data loading?
     IS_LOADING_POLICY_DATA: 'isLoadingPolicyData',
 
-    // Are we loading the create policy room command
-    IS_LOADING_CREATE_POLICY_ROOM: 'isLoadingCratePolicyRoom',
-
     // Is Keyboard shortcuts modal open?
     IS_SHORTCUTS_MODAL_OPEN: 'isShortcutsModalOpen',
 

diff --git a/src/components/BigNumberPad.js b/src/components/BigNumberPad.js
@@ -78,7 +78,6 @@ class BigNumberPad extends React.Component {
                                         ControlSelection.unblock();
                                         this.props.longPressHandlerStateChanged(false);
                                     }}
-                                    textSelectable={false}
                                 />
                             );
                         })}

diff --git a/src/components/BlockingViews/FullPageNotFoundView.js b/src/components/BlockingViews/FullPageNotFoundView.js
@@ -55,7 +55,7 @@ const FullPageNotFoundView = (props) => {
                     onBackButtonPress={props.onBackButtonPress}
                     onCloseButtonPress={() => Navigation.dismissModal()}
                 />
-                <View style={styles.flex1}>
+                <View style={[styles.flex1, styles.blockingViewContainer]}>
                     <BlockingView
                         icon={Expensicons.QuestionMark}
                         title={props.translate(props.titleKey)}

diff --git a/src/components/Button.js b/src/components/Button.js
@@ -106,9 +106,6 @@ const propTypes = {
 
     /** Id to use for this button */
     nativeID: PropTypes.string,
-
-    /** Whether text in Button should selectable */
-    textSelectable: PropTypes.bool,
 };
 
 const defaultProps = {
@@ -139,7 +136,6 @@ const defaultProps = {
     shouldRemoveLeftBorderRadius: false,
     shouldEnableHapticFeedback: false,
     nativeID: '',
-    textSelectable: true,
 };
 
 class Button extends Component {
@@ -183,7 +179,7 @@ class Button extends Component {
 
         const textComponent = (
             <Text
-                selectable={this.props.textSelectable}
+                selectable={false}
                 style={[
                     this.props.isLoading && styles.opacity0,
                     styles.pointerEventsNone,

diff --git a/src/components/KeyboardShortcutsModal.js b/src/components/KeyboardShortcutsModal.js
@@ -56,7 +56,6 @@ class KeyboardShortcutsModal extends React.Component {
             <View
                 style={[
                     styles.keyboardShortcutTableRow,
-                    styles.flex1,
                     isFirstRow && styles.keyboardShortcutTableFirstRow,
                 ]}
                 key={shortcut.displayName}

diff --git a/src/components/MenuItem.js b/src/components/MenuItem.js
@@ -25,6 +25,8 @@ const defaultProps = {
     badgeText: undefined,
     shouldShowRightIcon: false,
     shouldShowSelectedState: false,
+    shouldShowBasicTitle: false,
+    shouldShowDescriptionOnTop: false,
     wrapperStyle: [],
     style: {},
     success: false,
@@ -50,9 +52,10 @@ const MenuItem = (props) => {
     const titleTextStyle = StyleUtils.combineStyles([
         styles.popoverMenuText,
         styles.ml3,
+        (props.shouldShowBasicTitle ? undefined : styles.textStrong),
         (props.interactive && props.disabled ? styles.disabledText : undefined),
     ], props.style);
-    const descriptionTextStyle = StyleUtils.combineStyles([styles.textLabelSupporting, styles.ml3, styles.mt1, styles.breakAll], props.style);
+    const descriptionTextStyle = StyleUtils.combineStyles([styles.textLabelSupporting, styles.ml3, styles.breakAll], props.style);
 
     return (
         <Pressable
@@ -108,14 +111,24 @@ const MenuItem = (props) => {
                                 />
                             </View>
                         )}
-                        <View style={[styles.justifyContentCenter, styles.menuItemTextContainer, styles.flex1]}>
-                            <Text
-                                style={titleTextStyle}
-                                numberOfLines={1}
-                            >
-                                {props.title}
-                            </Text>
-                            {Boolean(props.description) && (
+                        <View style={[styles.justifyContentCenter, styles.menuItemTextContainer, styles.flex1, styles.gap1]}>
+                            {Boolean(props.description) && props.shouldShowDescriptionOnTop && (
+                                <Text
+                                    style={descriptionTextStyle}
+                                    numberOfLines={2}
+                                >
+                                    {props.description}
+                                </Text>
+                            )}
+                            {Boolean(props.title) && (
+                                <Text
+                                    style={titleTextStyle}
+                                    numberOfLines={1}
+                                >
+                                    {props.title}
+                                </Text>
+                            )}
+                            {Boolean(props.description) && !props.shouldShowDescriptionOnTop && (
                                 <Text
                                     style={descriptionTextStyle}
                                     numberOfLines={2}

diff --git a/src/components/MenuItemWithTopDescription.js b/src/components/MenuItemWithTopDescription.js
@@ -0,0 +1,21 @@
+import React from 'react';
+import menuItemPropTypes from './menuItemPropTypes';
+import MenuItem from './MenuItem';
+
+const propTypes = {
+    ...menuItemPropTypes,
+};
+
+const MenuItemWithTopDescription = props => (
+    <MenuItem
+        // eslint-disable-next-line react/jsx-props-no-spreading
+        {...props}
+        shouldShowBasicTitle
+        shouldShowDescriptionOnTop
+    />
+);
+
+MenuItemWithTopDescription.propTypes = propTypes;
+MenuItemWithTopDescription.displayName = 'MenuItemWithTopDescription';
+
+export default MenuItemWithTopDescription;
diff --git a/src/components/ReportActionItem/IOUAction.js b/src/components/ReportActionItem/IOUAction.js
@@ -14,7 +14,7 @@ const propTypes = {
     action: PropTypes.shape(reportActionPropTypes).isRequired,
 
     /** The associated chatReport */
-    chatReportID: PropTypes.number.isRequired,
+    chatReportID: PropTypes.string.isRequired,
 
     /** Is this IOUACTION the most recent? */
     isMostRecentIOUReportAction: PropTypes.bool.isRequired,
@@ -47,7 +47,7 @@ const IOUAction = (props) => {
             {((props.isMostRecentIOUReportAction && Boolean(props.action.originalMessage.IOUReportID))
                 || (props.action.originalMessage.type === 'pay')) && (
                     <IOUPreview
-                        iouReportID={props.action.originalMessage.IOUReportID}
+                        iouReportID={props.action.originalMessage.IOUReportID.toString()}
                         chatReportID={props.chatReportID}
                         onPayButtonPressed={launchDetailsModal}
                         onPreviewPressed={launchDetailsModal}

diff --git a/src/components/ReportActionItem/IOUPreview.js b/src/components/ReportActionItem/IOUPreview.js
@@ -33,10 +33,10 @@ const propTypes = {
     onPayButtonPressed: PropTypes.func,
 
     /** The active IOUReport, used for Onyx subscription */
-    iouReportID: PropTypes.number.isRequired,
+    iouReportID: PropTypes.string.isRequired,
 
     /** The associated chatReport */
-    chatReportID: PropTypes.number.isRequired,
+    chatReportID: PropTypes.string.isRequired,
 
     /** Callback for the preview pressed */
     onPreviewPressed: PropTypes.func,

diff --git a/src/components/ReportActionsSkeletonView/index.js b/src/components/ReportActionsSkeletonView/index.js
@@ -10,7 +10,7 @@ const propTypes = {
 
 const ReportActionsSkeletonView = (props) => {
     // Determines the number of content items based on container height
-    const possibleVisibleContentItems = Math.floor(props.containerHeight / CONST.CHAT_SKELETON_VIEW.AVERAGE_ROW_HEIGHT);
+    const possibleVisibleContentItems = Math.ceil(props.containerHeight / CONST.CHAT_SKELETON_VIEW.AVERAGE_ROW_HEIGHT);
     const skeletonViewLines = [];
     for (let index = 0; index < possibleVisibleContentItems; index++) {
         const iconIndex = (index + 1) % 4;

diff --git a/src/components/menuItemPropTypes.js b/src/components/menuItemPropTypes.js
@@ -34,6 +34,12 @@ const propTypes = {
     /** Should we make this selectable with a checkbox */
     shouldShowSelectedState: PropTypes.bool,
 
+    /** Should the title show with normal font weight (not bold) */
+    shouldShowBasicTitle: PropTypes.bool,
+
+    /** Should the description be shown above the title (instead of the other way around) */
+    shouldShowDescriptionOnTop: PropTypes.bool,
+
     /** Whether this item is selected */
     isSelected: PropTypes.bool,
 
@@ -71,7 +77,7 @@ const propTypes = {
     fallbackIcon: PropTypes.func,
 
     /** The type of brick road indicator to show. */
-    brickRoadIndicator: PropTypes.oneOf([CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR, '']),
+    brickRoadIndicator: PropTypes.oneOf([CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR, CONST.BRICK_ROAD_INDICATOR_STATUS.INFO, '']),
 };
 
 export default propTypes;
diff --git a/src/languages/en.js b/src/languages/en.js
@@ -992,7 +992,6 @@ export default {
         renamedRoomAction: ({oldName, newName}) => ` renamed this room from ${oldName} to ${newName}`,
         social: 'social',
         selectAWorkspace: 'Select a workspace',
-        growlMessageOnError: 'Unable to create policy room, please check your connection and try again.',
         growlMessageOnRenameError: 'Unable to rename policy room, please check your connection and try again.',
         visibilityOptions: {
             restricted: 'Restricted',

diff --git a/src/languages/es.js b/src/languages/es.js
@@ -994,7 +994,6 @@ export default {
         renamedRoomAction: ({oldName, newName}) => ` cambió el nombre de la sala de ${oldName} a ${newName}`,
         social: 'social',
         selectAWorkspace: 'Seleccionar un espacio de trabajo',
-        growlMessageOnError: 'No se pudo crear el espacio de trabajo, por favor comprueba tu conexión e inténtalo de nuevo.',
         growlMessageOnRenameError: 'No se pudo cambiar el nomdre del espacio de trabajo, por favor comprueba tu conexión e inténtalo de nuevo.',
         visibilityOptions: {
             restricted: 'Restringida',

diff --git a/src/libs/Navigation/AppNavigator/MainDrawerNavigator.js b/src/libs/Navigation/AppNavigator/MainDrawerNavigator.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {Component} from 'react';
 import PropTypes from 'prop-types';
 import lodashGet from 'lodash/get';
 import {withOnyx} from 'react-native-onyx';
@@ -54,31 +54,55 @@ const getInitialReportScreenParams = (reports, ignoreDefaultRooms, policies) =>
     return {reportID: String(reportID)};
 };
 
-const MainDrawerNavigator = (props) => {
-    const initialParams = getInitialReportScreenParams(props.reports, !Permissions.canUseDefaultRooms(props.betas), props.policies);
+class MainDrawerNavigator extends Component {
+    constructor(props) {
+        super(props);
+        this.initialParams = getInitialReportScreenParams(props.reports, !Permissions.canUseDefaultRooms(props.betas), props.policies);
+    }
+
+    shouldComponentUpdate(nextProps) {
+        const initialNextParams = getInitialReportScreenParams(nextProps.reports, !Permissions.canUseDefaultRooms(nextProps.betas), nextProps.policies);
+        if (this.initialParams.reportID === initialNextParams.reportID) {
+            return false;
+        }
 
-    // Wait until reports are fetched and there is a reportID in initialParams
-    if (!initialParams.reportID) {
-        return <FullScreenLoadingIndicator logDetail={{name: 'Main Drawer Loader', initialParams}} />;
+        this.initialParams = initialNextParams;
+        return true;
     }
 
-    // After the app initializes and reports are available the home navigation is mounted
-    // This way routing information is updated (if needed) based on the initial report ID resolved.
-    // This is usually needed after login/create account and re-launches
-    return (
-        <BaseDrawerNavigator
-            drawerContent={() => <SidebarScreen />}
-            screens={[
-                {
-                    name: SCREENS.REPORT,
-                    component: ReportScreen,
-                    initialParams,
-                },
-            ]}
-            isMainScreen
-        />
-    );
-};
+    render() {
+        // Wait until reports are fetched and there is a reportID in initialParams
+        if (!this.initialParams.reportID) {
+            return <FullScreenLoadingIndicator logDetail={{name: 'Main Drawer Loader', initialParams: this.initialParams}} />;
+        }
+
+        // After the app initializes and reports are available the home navigation is mounted
+        // This way routing information is updated (if needed) based on the initial report ID resolved.
+        // This is usually needed after login/create account and re-launches
+        return (
+            <BaseDrawerNavigator
+                drawerContent={({navigation, state}) => {
+                    // This state belongs to the drawer so it should always have the ReportScreen as it's initial (and only) route
+                    const reportIDFromRoute = lodashGet(state, ['routes', 0, 'params', 'reportID']);
+                    return (
+                        <SidebarScreen
+                            navigation={navigation}
+                            reportIDFromRoute={reportIDFromRoute}
+                        />
+                    );
+                }}
+                screens={[
+                    {
+                        name: SCREENS.REPORT,
+                        component: ReportScreen,
+                        initialParams: this.initialParams,
+                    },
+                ]}
+                isMainScreen
+            />
+        );
+    }
+}
 
 MainDrawerNavigator.propTypes = propTypes;
 MainDrawerNavigator.defaultProps = defaultProps;