Merge pull request #14022 from Expensify/update-staging-from-main

Update version to 1.2.49-0 on staging

.github/scripts/verifyPodfile.sh

@@ -1,19 +1,64 @@
 #!/bin/bash
 
-declare -r GREEN='\033[0;32m'
-declare -r RED='\033[0;31m'
-declare -r NC='\033[0m'
+START_DIR=$(pwd)
+ROOT_DIR=$(dirname "$(dirname "$(dirname "${BASH_SOURCE[0]}")")")
+cd "$ROOT_DIR" || exit 1
 
-podfileSha=$(openssl sha1 ios/Podfile | awk '{print $2}')
-podfileLockSha=$(awk '/PODFILE CHECKSUM: /{print $3}' ios/Podfile.lock)
+source scripts/shellUtils.sh
 
-echo "Podfile: $podfileSha"
-echo "Podfile.lock: $podfileLockSha"
+title "Verifying that Podfile.lock is synced with the project"
 
-if [ "$podfileSha" == "$podfileLockSha" ]; then
-    echo -e "${GREEN}Podfile verified!${NC}"
-    exit 0
+declare EXIT_CODE=0
+
+PODFILE_SHA=$(openssl sha1 ios/Podfile | awk '{print $2}')
+PODFILE_LOCK_SHA=$(awk '/PODFILE CHECKSUM: /{print $3}' ios/Podfile.lock)
+
+echo "Podfile: $PODFILE_SHA"
+echo "Podfile.lock: $PODFILE_LOCK_SHA"
+
+if [[ "$PODFILE_SHA" == "$PODFILE_LOCK_SHA" ]]; then
+    success "Podfile checksum verified!"
 else
-    echo -e "${RED}Error: Podfile.lock out of date with Podfile. Did you forget to run \`npx pod-install\`?${NC}"
-    exit 1
+    error "Podfile.lock checksum mismatch. Did you forget to run \`npx pod-install\`?"
+    EXIT_CODE=1
+fi
+
+info "Comparing Podfile.lock with node packages..."
+
+# Retrieve a list of podspec directories as listed in the Podfile.lock
+SPEC_DIRS=$(yq '.["EXTERNAL SOURCES"].[].":path" | select( . == "*node_modules*")' < ios/Podfile.lock)
+
+# Format a list of Pods based on the output of the config command
+FORMATTED_PODS=$( \
+  jq --raw-output --slurp 'map((.name + " (" + .version + ")")) | .[]' <<< "$( \
+    npx react-native config | \
+    jq '.dependencies[].platforms.ios.podspecPath | select( . != null )' | \
+    xargs -L 1 pod ipc spec --silent
+  )"
+)
+
+# Check for uncommitted package removals
+# If they are listed in Podfile.lock but the directories don't exist they have been removed
+while read -r DIR; do
+  if [[ ! -d "${DIR#../}" ]]; then
+    error "Directory \`${DIR#../node_modules/}\` not found in node_modules. Did you forget to run \`npx pod-install\` after removing the package?"
+    EXIT_CODE=1
+  fi
+done <<< "$SPEC_DIRS"
+
+# Check for uncommitted package additions/updates
+while read -r POD; do
+  if ! grep -q "$POD" ./ios/Podfile.lock; then
+    error "$POD not found in Podfile.lock. Did you forget to run \`npx pod-install\`?"
+    EXIT_CODE=1
+  fi
+done <<< "$FORMATTED_PODS"
+
+if [[ "$EXIT_CODE" == 0 ]]; then
+  success "Podfile.lock is up to date."
 fi
+
+# Cleanup
+cd "$START_DIR" || exit 1
+
+exit $EXIT_CODE

.github/workflows/verifyPodfile.yml

@@ -8,7 +8,7 @@ on:
 jobs:
   verify:
     if: github.actor != 'OSBotify'
-    runs-on: ubuntu-latest
+    runs-on: macos-latest
     steps:
       # This action checks-out the repository, so the workflow can access it.
       - uses: actions/checkout@93ea575cb5d8a053eaa0ac8fa3b40d7e05a33cc8

android/app/build.gradle

@@ -156,8 +156,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001024802
-        versionName "1.2.48-2"
+        versionCode 1001024900
+        versionName "1.2.49-0"
         buildConfigField "boolean", "IS_NEW_ARCHITECTURE_ENABLED", isNewArchitectureEnabled().toString()
 
         if (isNewArchitectureEnabled()) {

config/webpack/webpack.dev.js

@@ -56,6 +56,13 @@ module.exports = (env = {}) => portfinder.getPortPromise({port: BASE_PORT})
                     config: [__filename],
                 },
             },
+            snapshot: {
+                // A list of paths webpack trusts would not be modified while webpack is running
+                managedPaths: [
+                    // Onyx can be modified on the fly, changes to other node_modules would not be reflected live
+                    /([\\/]node_modules[\\/](?!react-native-onyx))/,
+                ],
+            },
         });
 
         return TimeAnalyticsPlugin.wrap(config);

contributingGuides/CONTRIBUTING.md

@@ -110,7 +110,6 @@ Additionally if you want to discuss an idea with the open source community witho
 
 #### Propose a solution for the job
 4. After you reproduce the issue, make a proposal for your solution and post it as a comment in the corresponding GitHub issue (linked in the Upwork job). Your solution proposal should include a brief written technical explanation of the changes you will make. Include "Proposal" as the first word in your comment. 
-    - Note: Issues that have not had the `External` label applied have not yet been approved for implementation. This means, if you propose a solution to an issue without the `External` label (which you are allowed to do) it is possible that the issue will be fixed internally. If the `External` label has not yet been applied, Expensify has the right to use your proposal to fix said issue, without providing compensation for your solution. This process covers the very rare instance where we need or want to fix an issue internally.
     - Note: Before submitting a proposal on an issue, be sure to read any other existing proposals. Any new proposal should be substantively different from existing proposals.
 5. Pause at this step until someone from the Contributor-Plus team and / or someone from Expensify provides feedback on your proposal (do not create a pull request yet).
 6. If your solution proposal is accepted by the Expensify engineer assigned to the issue, Expensify will hire you on Upwork and assign the GitHub issue to you.

contributingGuides/FORMS.md

@@ -247,3 +247,15 @@ Form.js will automatically provide the following props to any input with the inp
 - errorText: The translated error text that is returned by validate for that specific input.
 - onBlur: An onBlur handler that calls validate.
 - onInputChange: An onChange handler that saves draft values and calls validate for that input (inputA). Passing an inputID as a second param allows inputA to manipulate the input value of the provided inputID (inputB).
+
+### Safe Area Padding
+
+Any `Form.js` that has a button will also add safe area padding by default. If the `<Form/>` is inside a `<ScreenWrapper>` we will want to disable the default safe area padding applied there e.g.
+
+```js
+<ScreenWrapper includeSafeAreaPaddingBottom={false}>
+    <Form>
+        {...}
+    </Form>
+</ScreenWrapper>
+```

ios/NewExpensify/Info.plist

@@ -17,7 +17,7 @@
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.2.48</string>
+	<string>1.2.49</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleURLTypes</key>
@@ -30,7 +30,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.2.48.2</string>
+	<string>1.2.49.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.2.48</string>
+	<string>1.2.49</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.2.48.2</string>
+	<string>1.2.49.0</string>
 </dict>
 </plist>

metro.config.js

@@ -5,15 +5,32 @@
 
 const {getDefaultConfig} = require('metro-config');
 const _ = require('underscore');
+require('dotenv').config();
 
 /* eslint arrow-body-style: 0 */
 module.exports = (() => {
+    const isUsingMockAPI = process.env.E2E_TESTING === 'true';
+    if (isUsingMockAPI) {
+        // eslint-disable-next-line no-console
+        console.warn('⚠️ Using mock API');
+    }
+
     return getDefaultConfig()
         .then((config) => {
             return {
                 resolver: {
                     assetExts: _.filter(config.resolver.assetExts, ext => ext !== 'svg'),
                     sourceExts: ['jsx', 'js', 'ts', 'tsx', 'json', 'svg'],
+                    resolveRequest: (context, moduleName, platform) => {
+                        const resolution = context.resolveRequest(context, moduleName, platform);
+                        if (isUsingMockAPI && moduleName.includes('/API')) {
+                            return {
+                                ...resolution,
+                                filePath: resolution.filePath.replace(/src\/libs\/API.js/, 'src/libs/E2E/API.mock.js'),
+                            };
+                        }
+                        return resolution;
+                    },
                 },
                 transformer: {
                     getTransformOptions: () => ({

package.json

@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.2.48-2",
+  "version": "1.2.49-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.",
@@ -69,7 +69,6 @@
     "babel-polyfill": "^6.26.0",
     "dom-serializer": "^0.2.2",
     "domhandler": "^4.3.0",
-    "dotenv": "^8.2.0",
     "expensify-common": "git+https://github.com/Expensify/expensify-common.git#e67235baa887dcbe9dc4bf41ddf1925f19a1e8ad",
     "fbjs": "^3.0.2",
     "file-loader": "^6.0.0",
@@ -162,6 +161,7 @@
     "copy-webpack-plugin": "^6.4.1",
     "css-loader": "^5.2.4",
     "diff-so-fancy": "^1.3.0",
+    "dotenv": "^16.0.3",
     "electron": "^21.2.2",
     "electron-builder": "23.5.0",
     "electron-notarize": "^1.2.1",

src/components/AttachmentModal.js

@@ -22,6 +22,7 @@ import withLocalize, {withLocalizePropTypes} from './withLocalize';
 import ConfirmModal from './ConfirmModal';
 import TextWithEllipsis from './TextWithEllipsis';
 import HeaderGap from './HeaderGap';
+import SafeAreaConsumer from './SafeAreaConsumer';
 
 /**
  * Modal render prop component that exposes modal launching triggers that can be used
@@ -275,17 +276,21 @@ class AttachmentModal extends PureComponent {
 
                     {/* If we have an onConfirm method show a confirmation button */}
                     {this.props.onConfirm && (
-                        <Animated.View style={StyleUtils.fade(this.state.confirmButtonFadeAnimation)}>
-                            <Button
-                                success
-                                style={[styles.buttonConfirm, this.props.isSmallScreenWidth ? {} : styles.attachmentButtonBigScreen]}
-                                textStyles={[styles.buttonConfirmText]}
-                                text={this.props.translate('common.send')}
-                                onPress={this.submitAndClose}
-                                disabled={this.state.isConfirmButtonDisabled}
-                                pressOnEnter
-                            />
-                        </Animated.View>
+                        <SafeAreaConsumer>
+                            {({safeAreaPaddingBottomStyle}) => (
+                                <Animated.View style={[StyleUtils.fade(this.state.confirmButtonFadeAnimation), safeAreaPaddingBottomStyle]}>
+                                    <Button
+                                        success
+                                        style={[styles.buttonConfirm, this.props.isSmallScreenWidth ? {} : styles.attachmentButtonBigScreen]}
+                                        textStyles={[styles.buttonConfirmText]}
+                                        text={this.props.translate('common.send')}
+                                        onPress={this.submitAndClose}
+                                        disabled={this.state.isConfirmButtonDisabled}
+                                        pressOnEnter
+                                    />
+                                </Animated.View>
+                            )}
+                        </SafeAreaConsumer>
                     )}
                 </Modal>
 

src/components/DatePicker/index.android.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import {Keyboard} from 'react-native';
 import RNDatePicker from '@react-native-community/datetimepicker';
 import moment from 'moment';
 import _ from 'underscore';
@@ -35,6 +36,7 @@ class DatePicker extends React.Component {
      * @param {Event} event
      */
     showPicker(event) {
+        Keyboard.dismiss();
         this.setState({isPickerVisible: true});
         event.preventDefault();
     }

src/components/DatePicker/index.ios.js

@@ -1,6 +1,6 @@
 import React from 'react';
 // eslint-disable-next-line no-restricted-imports
-import {Button, View} from 'react-native';
+import {Button, View, Keyboard} from 'react-native';
 import RNDatePicker from '@react-native-community/datetimepicker';
 import moment from 'moment';
 import _ from 'underscore';
@@ -36,6 +36,7 @@ class DatePicker extends React.Component {
      * @param {Event} event
      */
     showPicker(event) {
+        Keyboard.dismiss();
         this.initialValue = this.state.selectedDate;
         this.setState({isPickerVisible: true});
         event.preventDefault();