Merge branch 'main' of github.com:Expensify/App into jasper-readPromi…

…seSeqQueue
Expensify · Nov 3, 2022 · a656dae · a656dae
2 parents 0885f91 + 1721965
commit a656dae
Show file tree

Hide file tree

Showing 25 changed files with 795 additions and 1,692 deletions.
diff --git a/.github/actions/composite/setupNode/action.yml b/.github/actions/composite/setupNode/action.yml
@@ -14,7 +14,7 @@ runs:
         cache: npm
 
     - name: Install node packages
-      uses: nick-invision/retry@7c68161adf97a48beb850a595b8784ec57a98cbb
+      uses: nick-invision/retry@0711ba3d7808574133d713a0d92d2941be03a350
       with:
         timeout_minutes: 10
         max_attempts: 5

diff --git a/.github/actions/composite/updateProtectedBranch/action.yml b/.github/actions/composite/updateProtectedBranch/action.yml
@@ -99,8 +99,8 @@ runs:
     - name: Check changed files
       if: ${{ inputs.TARGET_BRANCH == 'main' }}
       id: changedFiles
-      # Version: 3.3.0
-      uses: umani/changed-files@1d252c611c64289d35243fc37ece7323ea5e93e1
+      # TODO: Remove and switch back to upstream when https://github.com/umani/changed-files/pull/27 is merged
+      uses: roryabraham/changed-files@c14fad74000cf77ff62b7f78cfd34c2124665c35
       with:
         repo-token: ${{ github.token }}
         pr-number: ${{ steps.createPullRequest.outputs.PR_NUMBER }}

diff --git a/.github/workflows/createNewVersion.yml b/.github/workflows/createNewVersion.yml
@@ -55,7 +55,8 @@ jobs:
         with:
           GPG_PASSPHRASE: ${{ secrets.LARGE_SECRET_PASSPHRASE }}
 
-      - uses: softprops/turnstyle@8db075d65b19bf94e6e8687b504db69938dc3c65
+      # TODO: Point back at upstream when https://github.com/softprops/turnstyle/pull/46 is merged
+      - uses: roryabraham/turnstyle@d50d3ffc3f2c8d280dec4cd802c1c735fcda77c8
         with:
           poll-interval-seconds: 10
         env:

diff --git a/.github/workflows/platformDeploy.yml b/.github/workflows/platformDeploy.yml
@@ -138,7 +138,7 @@ jobs:
           bundler-cache: true
 
       - name: Install cocoapods
-        uses: nick-invision/retry@7c68161adf97a48beb850a595b8784ec57a98cbb
+        uses: nick-invision/retry@0711ba3d7808574133d713a0d92d2941be03a350
         with:
           timeout_minutes: 10
           max_attempts: 5

diff --git a/.github/workflows/preDeploy.yml b/.github/workflows/preDeploy.yml
@@ -82,7 +82,8 @@ jobs:
     needs: [chooseDeployActions, createNewVersion]
     runs-on: ubuntu-latest
     steps:
-      - uses: softprops/turnstyle@8db075d65b19bf94e6e8687b504db69938dc3c65
+      # TODO: Point back at upstream when https://github.com/softprops/turnstyle/pull/46 is merged
+      - uses: roryabraham/turnstyle@d50d3ffc3f2c8d280dec4cd802c1c735fcda77c8
         with:
           poll-interval-seconds: 10
         env:

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 1001022300
-        versionName "1.2.23-0"
+        versionCode 1001022307
+        versionName "1.2.23-7"
         buildConfigField "boolean", "IS_NEW_ARCHITECTURE_ENABLED", isNewArchitectureEnabled().toString()
 
         if (isNewArchitectureEnabled()) {

diff --git a/ios/NewExpensify/Info.plist b/ios/NewExpensify/Info.plist
@@ -30,7 +30,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.2.23.0</string>
+	<string>1.2.23.7</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>

diff --git a/ios/NewExpensifyTests/Info.plist b/ios/NewExpensifyTests/Info.plist
@@ -19,6 +19,6 @@
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.2.23.0</string>
+	<string>1.2.23.7</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.23-0",
+  "version": "1.2.23-7",
   "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.",
@@ -140,7 +140,7 @@
     "@storybook/manager-webpack5": "^6.5.10",
     "@storybook/react": "^6.5.9",
     "@storybook/theming": "^6.5.9",
-    "@svgr/webpack": "^5.5.0",
+    "@svgr/webpack": "^6.0.0",
     "@testing-library/jest-native": "^3.4.2",
     "@testing-library/react-native": "^7.0.2",
     "@vercel/ncc": "^0.27.0",
@@ -178,7 +178,7 @@
     "react-native-clean-project": "^4.0.0-alpha4.0",
     "react-native-flipper": "https://gitpkg.now.sh/facebook/flipper/react-native/react-native-flipper?9cacc9b59402550eae866e0e81e5f0c2f8203e6b",
     "react-native-performance-flipper-reporter": "^2.0.0",
-    "react-native-svg-transformer": "^0.14.3",
+    "react-native-svg-transformer": "^1.0.0",
     "react-test-renderer": "18.1.0",
     "semver": "^7.3.4",
     "speed-measure-webpack-plugin": "^1.5.0",

diff --git a/src/components/CheckboxWithLabel.js b/src/components/CheckboxWithLabel.js
@@ -1,11 +1,10 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import {View, TouchableOpacity} from 'react-native';
-import _ from 'underscore';
 import styles from '../styles/styles';
 import Checkbox from './Checkbox';
 import Text from './Text';
-import InlineErrorText from './InlineErrorText';
+import FormHelpMessage from './FormHelpMessage';
 
 const requiredPropsCheck = (props) => {
     if (!props.label && !props.LabelComponent) {
@@ -77,8 +76,6 @@ class CheckboxWithLabel extends React.Component {
 
         this.isChecked = props.value || props.defaultValue || props.isChecked;
         this.LabelComponent = props.LabelComponent;
-        this.defaultStyles = [styles.flexRow, styles.alignItemsCenter];
-        this.wrapperStyles = _.isArray(props.style) ? [...this.defaultStyles, ...props.style] : [...this.defaultStyles, props.style];
 
         this.toggleCheckbox = this.toggleCheckbox.bind(this);
     }
@@ -90,8 +87,8 @@ class CheckboxWithLabel extends React.Component {
 
     render() {
         return (
-            <>
-                <View style={this.wrapperStyles}>
+            <View style={this.props.style}>
+                <View style={[styles.flexRow, styles.alignItemsCenter]}>
                     <Checkbox
                         isChecked={this.isChecked}
                         onPress={this.toggleCheckbox}
@@ -121,10 +118,8 @@ class CheckboxWithLabel extends React.Component {
                         {this.LabelComponent && (<this.LabelComponent />)}
                     </TouchableOpacity>
                 </View>
-                <InlineErrorText styles={[styles.ml8]}>
-                    {this.props.errorText}
-                </InlineErrorText>
-            </>
+                <FormHelpMessage message={this.props.errorText} />
+            </View>
         );
     }
 }

diff --git a/src/components/FormAlertWrapper.js b/src/components/FormAlertWrapper.js
@@ -3,16 +3,14 @@ import {View} from 'react-native';
 import PropTypes from 'prop-types';
 import React from 'react';
 import {withNetwork} from './OnyxProvider';
-import Icon from './Icon';
-import * as Expensicons from './Icon/Expensicons';
 import RenderHTML from './RenderHTML';
-import TextLink from './TextLink';
 import Text from './Text';
-import colors from '../styles/colors';
+import TextLink from './TextLink';
 import compose from '../libs/compose';
 import networkPropTypes from './networkPropTypes';
 import styles from '../styles/styles';
 import withLocalize, {withLocalizePropTypes} from './withLocalize';
+import FormHelpMessage from './FormHelpMessage';
 
 const propTypes = {
     /** Wrapped child components */
@@ -52,38 +50,35 @@ const defaultProps = {
 //
 // This component takes other components as a child prop. It will then render any wrapped components as a function using "render props",
 // and passes it a (bool) isOffline parameter. Child components can then use the isOffline variable to determine offline behavior.
-const FormAlertWrapper = props => (
-    <View style={props.containerStyles}>
-        {props.isAlertVisible && (
-            <View style={[styles.flexRow, styles.alignItemsCenter, styles.mb3]}>
-                <Icon src={Expensicons.Exclamation} fill={colors.red} />
-                <View style={[styles.flexRow, styles.ml2, styles.flexWrap, styles.flex1]}>
-                    {!_.isEmpty(props.message) && props.isMessageHtml && <RenderHTML html={`<muted-text>${props.message}</muted-text>`} />}
-
-                    {!_.isEmpty(props.message) && !props.isMessageHtml && <Text style={styles.mutedTextLabel}>{props.message}</Text>}
-
-                    {_.isEmpty(props.message) && (
-                        <>
-                            <Text style={styles.mutedTextLabel}>
-                                {`${props.translate('common.please')} `}
-                            </Text>
-                            <TextLink
-                                style={styles.label}
-                                onPress={props.onFixTheErrorsLinkPressed}
-                            >
-                                {props.translate('common.fixTheErrors')}
-                            </TextLink>
-                            <Text style={styles.mutedTextLabel}>
-                                {` ${props.translate('common.inTheFormBeforeContinuing')}.`}
-                            </Text>
-                        </>
-                    )}
-                </View>
-            </View>
-        )}
-        {props.children(props.network.isOffline)}
-    </View>
-);
+const FormAlertWrapper = (props) => {
+    let children;
+    if (_.isEmpty(props.message)) {
+        children = (
+            <Text style={[styles.formError, styles.mb0]}>
+                {`${props.translate('common.please')} `}
+                <TextLink
+                    style={styles.label}
+                    onPress={props.onFixTheErrorsLinkPressed}
+                >
+                    {props.translate('common.fixTheErrors')}
+                </TextLink>
+                {` ${props.translate('common.inTheFormBeforeContinuing')}.`}
+            </Text>
+        );
+    } else if (props.isMessageHtml) {
+        children = <RenderHTML html={`<muted-text>${props.message}</muted-text>`} />;
+    }
+    return (
+        <View style={props.containerStyles}>
+            {props.isAlertVisible && (
+                <FormHelpMessage message={props.message} style={[styles.mb3]}>
+                    {children}
+                </FormHelpMessage>
+            )}
+            {props.children(props.network.isOffline)}
+        </View>
+    );
+};
 
 FormAlertWrapper.propTypes = propTypes;
 FormAlertWrapper.defaultProps = defaultProps;

diff --git a/src/components/FormHelpMessage.js b/src/components/FormHelpMessage.js
@@ -0,0 +1,56 @@
+import React from 'react';
+import _ from 'underscore';
+import PropTypes from 'prop-types';
+import {View} from 'react-native';
+import Icon from './Icon';
+import * as Expensicons from './Icon/Expensicons';
+import Text from './Text';
+import colors from '../styles/colors';
+import styles from '../styles/styles';
+import stylePropTypes from '../styles/stylePropTypes';
+
+const propTypes = {
+    /** Error or hint text. Ignored when children is not empty */
+    message: PropTypes.string,
+
+    /** Children to render next to dot indicator */
+    children: PropTypes.node,
+
+    /** Indicates whether to show error or hint */
+    isError: PropTypes.bool,
+
+    /** Container style props */
+    style: stylePropTypes,
+};
+
+const defaultProps = {
+    message: '',
+    children: null,
+    isError: true,
+    style: [],
+};
+
+const FormHelpMessage = (props) => {
+    if (_.isEmpty(props.message) && _.isEmpty(props.children)) {
+        return null;
+    }
+
+    return (
+        <View style={[styles.flexRow, styles.alignItemsCenter, styles.mt2, styles.mb1, ...props.style]}>
+            {props.isError && <Icon src={Expensicons.DotIndicator} fill={colors.red} />}
+            <View style={[styles.flex1, styles.ml2]}>
+                {props.children || (
+                    <Text style={[props.isError ? styles.formError : styles.formHelp, styles.mb0]}>
+                        {props.message}
+                    </Text>
+                )}
+            </View>
+        </View>
+    );
+};
+
+FormHelpMessage.propTypes = propTypes;
+FormHelpMessage.defaultProps = defaultProps;
+FormHelpMessage.displayName = 'FormHelpMessage';
+
+export default FormHelpMessage;
diff --git a/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.js b/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.js
@@ -29,7 +29,7 @@ const customHTMLElementModels = {
     }),
     'muted-text': defaultHTMLElementModels.div.extend({
         tagName: 'muted-text',
-        mixedUAStyles: styles.mutedTextLabel,
+        mixedUAStyles: {...styles.formError, ...styles.mb0},
     }),
     comment: defaultHTMLElementModels.div.extend({
         tagName: 'comment',

diff --git a/src/components/Picker/index.js b/src/components/Picker/index.js
@@ -5,7 +5,7 @@ import PropTypes from 'prop-types';
 import BasePicker from './BasePicker';
 import Text from '../Text';
 import styles from '../../styles/styles';
-import InlineErrorText from '../InlineErrorText';
+import FormHelpMessage from '../FormHelpMessage';
 
 const propTypes = {
     /** Picker label */
@@ -95,9 +95,7 @@ class Picker extends PureComponent {
                         onInputChange={this.onInputChange}
                     />
                 </View>
-                <InlineErrorText styles={[styles.mh3]}>
-                    {this.props.errorText}
-                </InlineErrorText>
+                <FormHelpMessage message={this.props.errorText} />
             </>
         );
     }

diff --git a/src/components/RadioButtonWithLabel.js b/src/components/RadioButtonWithLabel.js
@@ -5,7 +5,7 @@ import _ from 'underscore';
 import styles from '../styles/styles';
 import RadioButton from './RadioButton';
 import Text from './Text';
-import InlineErrorText from './InlineErrorText';
+import FormHelpMessage from './FormHelpMessage';
 
 const propTypes = {
     /** Whether the radioButton is checked */
@@ -75,9 +75,7 @@ const RadioButtonWithLabel = (props) => {
                     {LabelComponent && (<LabelComponent />)}
                 </TouchableOpacity>
             </View>
-            <InlineErrorText>
-                {props.errorText}
-            </InlineErrorText>
+            <FormHelpMessage message={props.errorText} />
         </>
     );
 };

diff --git a/src/components/TextInput/BaseTextInput.js b/src/components/TextInput/BaseTextInput.js
@@ -18,6 +18,7 @@ import variables from '../../styles/variables';
 import Checkbox from '../Checkbox';
 import getSecureEntryKeyboardType from '../../libs/getSecureEntryKeyboardType';
 import CONST from '../../CONST';
+import FormHelpMessage from '../FormHelpMessage';
 
 class BaseTextInput extends Component {
     constructor(props) {
@@ -198,7 +199,6 @@ class BaseTextInput extends Component {
         const inputProps = _.omit(this.props, _.keys(baseTextInputPropTypes.propTypes));
         const hasLabel = Boolean(this.props.label.length);
         const inputHelpText = this.props.errorText || this.props.hint;
-        const formHelpStyles = this.props.errorText ? styles.formError : styles.formHelp;
         const placeholder = (this.props.prefixCharacter || this.state.isFocused || !hasLabel || (hasLabel && this.props.forceActiveLabel)) ? this.props.placeholder : null;
         const textInputContainerStyles = _.reduce([
             styles.textInputContainer,
@@ -305,9 +305,7 @@ class BaseTextInput extends Component {
                         </TouchableWithoutFeedback>
                     </View>
                     {!_.isEmpty(inputHelpText) && (
-                        <Text style={[formHelpStyles, styles.mt1, styles.ph3]}>
-                            {inputHelpText}
-                        </Text>
+                        <FormHelpMessage isError={!_.isEmpty(this.props.errorText)} message={inputHelpText} />
                     )}
                 </View>
                 {/*

diff --git a/src/libs/ReportUtils.js b/src/libs/ReportUtils.js
@@ -482,7 +482,7 @@ function getDisplayNameForParticipant(participant, shouldUseShortForm = false) {
 
     const loginWithoutSMSDomain = Str.removeSMSDomain(participant.login);
     let longName = participant.displayName || loginWithoutSMSDomain;
-    if (Str.isSMSLogin(longName)) {
+    if (longName === loginWithoutSMSDomain && Str.isSMSLogin(longName)) {
         longName = LocalePhoneNumber.toLocalPhone(preferredLocale, longName);
     }
     const shortName = participant.firstName || longName;
@@ -1083,6 +1083,7 @@ export {
     isPolicyExpenseChat,
     getDefaultAvatar,
     getIcons,
+    getDisplayNameForParticipant,
     getRoomWelcomeMessage,
     getDisplayNamesWithTooltips,
     getReportName,