Merge pull request Expensify#8706 from Expensify/update-staging-from-…

…main

Update version to 1.1.56-0 on staging

.github/workflows/cherryPick.yml

@@ -203,15 +203,15 @@ jobs:
           PULL_REQUEST_NUMBER: ${{ steps.createPullRequest.outputs.pr_number }}
 
       - name: Auto-merge the PR
-        # Important: only auto-merge if there was no merge conflict!
+        # Important: only auto-merge if there was no merge conflict and the PR is mergable (not blocked by a missing status check)!
         if: ${{ fromJSON(steps.cherryPick.outputs.SHOULD_AUTOMERGE) && fromJSON(steps.isPullRequestMergeable.outputs.IS_MERGEABLE) }}
         run: gh pr merge --merge --delete-branch
         env:
           GITHUB_TOKEN: ${{ secrets.OS_BOTIFY_TOKEN }}
 
       - name: 'Announces a CP failure in the #announce Slack room'
         uses: 8398a7/action-slack@v3
-        if: ${{ failure() }}
+        if: ${{ failure() || !fromJSON(steps.isPullRequestMergeable.outputs.IS_MERGEABLE) }}
         with:
           status: custom
           custom_payload: |

android/app/build.gradle

@@ -152,8 +152,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001015502
-        versionName "1.1.55-2"
+        versionCode 1001015600
+        versionName "1.1.56-0"
     }
     splits {
         abi {

ios/NewExpensify/Info.plist

@@ -17,7 +17,7 @@
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.1.55</string>
+	<string>1.1.56</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleURLTypes</key>
@@ -30,7 +30,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.1.55.2</string>
+	<string>1.1.56.0</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.1.55</string>
+	<string>1.1.56</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.1.55.2</string>
+	<string>1.1.56.0</string>
 </dict>
 </plist>

package.json

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

src/components/AddressSearch.js

@@ -1,7 +1,7 @@
 import _ from 'underscore';
 import React, {useRef, useState} from 'react';
 import PropTypes from 'prop-types';
-import {LogBox} from 'react-native';
+import {LogBox, ScrollView, View} from 'react-native';
 import {GooglePlacesAutocomplete} from 'react-native-google-places-autocomplete';
 import CONFIG from '../CONFIG';
 import withLocalize, {withLocalizePropTypes} from './withLocalize';
@@ -44,7 +44,7 @@ const propTypes = {
     value: PropTypes.string,
 
     /** A callback function when the value of this field has changed */
-    onChange: PropTypes.func.isRequired,
+    onInputChange: PropTypes.func.isRequired,
 
     /** Customize the TextInput container */
     containerStyles: PropTypes.arrayOf(PropTypes.object),
@@ -113,93 +113,108 @@ const AddressSearch = (props) => {
         if (_.size(values) === 0) {
             return;
         }
-        props.onChange(values);
+        props.onInputChange(values);
     };
 
     return (
-        <GooglePlacesAutocomplete
-            fetchDetails
-            suppressDefaultStyles
-            enablePoweredByContainer={false}
-            onPress={(data, details) => {
-                saveLocationDetails(details);
-
-                // After we select an option, we set displayListViewBorder to false to prevent UI flickering
-                setDisplayListViewBorder(false);
-            }}
-            query={{
-                key: 'AIzaSyC4axhhXtpiS-WozJEsmlL3Kg3kXucbZus',
-                language: props.preferredLocale,
-                types: 'address',
-                components: 'country:us',
-            }}
-            requestUrl={{
-                useOnPlatform: 'web',
-                url: `${CONFIG.EXPENSIFY.EXPENSIFY_URL}api?command=Proxy_GooglePlaces&proxyUrl=`,
-            }}
-            textInputProps={{
-                InputComp: TextInput,
-                ref: (node) => {
-                    if (!props.innerRef) {
-                        return;
-                    }
-
-                    if (_.isFunction(props.innerRef)) {
-                        props.innerRef(node);
-                        return;
-                    }
-
-                    // eslint-disable-next-line no-param-reassign
-                    props.innerRef.current = node;
-                },
-                label: props.label,
-                containerStyles: props.containerStyles,
-                errorText: props.errorText,
-                value: props.value,
-                isFormInput: props.isFormInput,
-                inputID: props.inputID,
-                shouldSaveDraft: props.shouldSaveDraft,
-                onBlur: props.onBlur,
-                autoComplete: 'off',
-                onChangeText: (text) => {
-                    if (skippedFirstOnChangeTextRef.current) {
-                        props.onChange({street: text});
-                    } else {
-                        skippedFirstOnChangeTextRef.current = true;
-                    }
-
-                    // If the text is empty, we set displayListViewBorder to false to prevent UI flickering
-                    if (_.isEmpty(text)) {
+
+        /*
+         * The GooglePlacesAutocomplete component uses a VirtualizedList internally,
+         * and VirtualizedLists cannot be directly nested within other VirtualizedLists of the same orientation.
+         * To work around this, we wrap the GooglePlacesAutocomplete component with a horizontal ScrollView
+         * that has scrolling disabled and would otherwise not be needed
+         */
+        <ScrollView
+            horizontal
+            contentContainerStyle={styles.flex1}
+            scrollEnabled={false}
+        >
+            <View style={styles.w100}>
+                <GooglePlacesAutocomplete
+                    fetchDetails
+                    suppressDefaultStyles
+                    enablePoweredByContainer={false}
+                    onPress={(data, details) => {
+                        saveLocationDetails(details);
+
+                        // After we select an option, we set displayListViewBorder to false to prevent UI flickering
                         setDisplayListViewBorder(false);
-                    }
-                },
-            }}
-            styles={{
-                textInputContainer: [styles.flexColumn],
-                listView: [
-                    !displayListViewBorder && styles.googleListView,
-                    displayListViewBorder && styles.borderTopRounded,
-                    displayListViewBorder && styles.borderBottomRounded,
-                    displayListViewBorder && styles.mt1,
-                    styles.overflowAuto,
-                    styles.borderLeft,
-                    styles.borderRight,
-                ],
-                row: [
-                    styles.pv4,
-                    styles.ph3,
-                    styles.overflowAuto,
-                ],
-                description: [styles.googleSearchText],
-                separator: [styles.googleSearchSeparator],
-            }}
-            onLayout={(event) => {
-                // We use the height of the element to determine if we should hide the border of the listView dropdown
-                // to prevent a lingering border when there are no address suggestions.
-                // The height of the empty element is 2px (1px height for each top and bottom borders)
-                setDisplayListViewBorder(event.nativeEvent.layout.height > 2);
-            }}
-        />
+                    }}
+                    query={{
+                        key: 'AIzaSyC4axhhXtpiS-WozJEsmlL3Kg3kXucbZus',
+                        language: props.preferredLocale,
+                        types: 'address',
+                        components: 'country:us',
+                    }}
+                    requestUrl={{
+                        useOnPlatform: 'web',
+                        url: `${CONFIG.EXPENSIFY.EXPENSIFY_URL}api?command=Proxy_GooglePlaces&proxyUrl=`,
+                    }}
+                    textInputProps={{
+                        InputComp: TextInput,
+                        ref: (node) => {
+                            if (!props.innerRef) {
+                                return;
+                            }
+
+                            if (_.isFunction(props.innerRef)) {
+                                props.innerRef(node);
+                                return;
+                            }
+
+                            // eslint-disable-next-line no-param-reassign
+                            props.innerRef.current = node;
+                        },
+                        label: props.label,
+                        containerStyles: props.containerStyles,
+                        errorText: props.errorText,
+                        value: props.value,
+                        isFormInput: props.isFormInput,
+                        inputID: props.inputID,
+                        shouldSaveDraft: props.shouldSaveDraft,
+                        onBlur: props.onBlur,
+                        autoComplete: 'off',
+                        onChangeText: (text) => {
+                            if (skippedFirstOnChangeTextRef.current) {
+                                props.onInputChange({street: text});
+                            } else {
+                                skippedFirstOnChangeTextRef.current = true;
+                            }
+
+                            // If the text is empty, we set displayListViewBorder to false to prevent UI flickering
+                            if (_.isEmpty(text)) {
+                                setDisplayListViewBorder(false);
+                            }
+                        },
+                    }}
+                    styles={{
+                        textInputContainer: [styles.flexColumn],
+                        listView: [
+                            !displayListViewBorder && styles.googleListView,
+                            displayListViewBorder && styles.borderTopRounded,
+                            displayListViewBorder && styles.borderBottomRounded,
+                            displayListViewBorder && styles.mt1,
+                            styles.overflowAuto,
+                            styles.borderLeft,
+                            styles.borderRight,
+                        ],
+                        row: [
+                            styles.pv4,
+                            styles.ph3,
+                            styles.overflowAuto,
+                        ],
+                        description: [styles.googleSearchText],
+                        separator: [styles.googleSearchSeparator],
+                    }}
+                    onLayout={(event) => {
+                    // We use the height of the element to determine if we should hide the border of the listView dropdown
+                    // to prevent a lingering border when there are no address suggestions.
+                    // The height of the empty element is 2px (1px height for each top and bottom borders)
+                        setDisplayListViewBorder(event.nativeEvent.layout.height > 2);
+                    }}
+                />
+            </View>
+        </ScrollView>
     );
 };
 

src/components/Form.js

@@ -144,7 +144,11 @@ class Form extends React.Component {
             // We clone the child passing down all form props
             const inputID = child.props.inputID;
             const defaultValue = this.props.draftValues[inputID] || child.props.defaultValue;
-            this.inputValues[inputID] = defaultValue;
+
+            // We want to initialize the input value if it's undefined
+            if (_.isUndefined(this.inputValues[inputID])) {
+                this.inputValues[inputID] = defaultValue;
+            }
 
             return React.cloneElement(child, {
                 ref: node => this.inputRefs[inputID] = node,

src/components/HTMLEngineProvider/HTMLRenderers/ImageRenderer.js

@@ -4,7 +4,7 @@ import Config from '../../../CONFIG';
 import AttachmentModal from '../../AttachmentModal';
 import styles from '../../../styles/styles';
 import ThumbnailImage from '../../ThumbnailImage';
-import TouchableWithoutFocus from '../../TouchableWithoutFocus';
+import PressableWithoutFocus from '../../PressableWithoutFocus';
 import CONST from '../../../CONST';
 
 const ImageRenderer = (props) => {
@@ -51,7 +51,7 @@ const ImageRenderer = (props) => {
             originalFileName={originalFileName}
         >
             {({show}) => (
-                <TouchableWithoutFocus
+                <PressableWithoutFocus
                     style={styles.noOutline}
                     onPress={show}
                 >
@@ -60,7 +60,7 @@ const ImageRenderer = (props) => {
                         style={styles.webViewStyles.tagStyles.img}
                         isAuthTokenRequired={isAttachment}
                     />
-                </TouchableWithoutFocus>
+                </PressableWithoutFocus>
             )}
         </AttachmentModal>
     );

src/components/Header.js

@@ -29,7 +29,7 @@ const Header = props => (
             </Text>
             {/* If there's no subtitle then display a fragment to avoid an empty space which moves the main title */}
             {_.isString(props.subtitle)
-                ? Boolean(props.subtitle) && <Text style={[styles.mutedTextLabel]}>{props.subtitle}</Text>
+                ? Boolean(props.subtitle) && <Text style={[styles.mutedTextLabel]} numberOfLines={1}>{props.subtitle}</Text>
                 : props.subtitle}
         </View>
         {props.shouldShowEnvironmentBadge && (