Merge branch 'main' into @swm/fix-overscroll

.github/actions/composite/buildAndroidAPK/action.yml

@@ -11,10 +11,6 @@ runs:
   steps:
     - uses: Expensify/App/.github/actions/composite/setupNode@main
 
-    - name: Setup credentails for Mapbox SDK
-      run: ./scripts/setup-mapbox-sdk.sh ${{ secrets.MAPBOX_SDK_DOWNLOAD_TOKEN }}
-      shell: bash
-
     - uses: ruby/setup-ruby@eae47962baca661befdfd24e4d6c34ade04858f7
       with:
         ruby-version: '2.7'

.github/actions/composite/setupNode/action.yml

@@ -24,6 +24,31 @@ runs:
         path: desktop/node_modules
         key: ${{ runner.os }}-desktop-node-modules-${{ hashFiles('desktop/package-lock.json') }}
 
+    - name: Check if patch files changed
+      id: patchCheck
+      shell: bash
+      run: |
+        set -e
+        if [[ `git diff main --name-only | grep \.patch` != null ]]; then 
+          echo 'CHANGES_IN_PATCH_FILES=true' >> "$GITHUB_OUTPUT"
+        else 
+          echo 'CHANGES_IN_PATCH_FILES=false' >> "$GITHUB_OUTPUT"
+        fi
+
+    - name: Patch root project node packages
+      shell: bash
+      if: | 
+        steps.patchCheck.outputs.CHANGES_IN_PATCH_FILES == 'true' && 
+        steps.cache-node-modules.outputs.cache-hit == 'true'
+      run: npx patch-package
+
+    - name: Patch node packages for desktop submodule
+      shell: bash
+      if: | 
+        steps.patchCheck.outputs.CHANGES_IN_PATCH_FILES == 'true' && 
+        steps.cache-desktop-node-modules.outputs.cache-hit == 'true'
+      run: cd desktop && npx patch-package
+
     - name: Install root project node packages
       if: steps.cache-node-modules.outputs.cache-hit != 'true'
       uses: nick-fields/retry@v2

.github/workflows/README.md

@@ -104,6 +104,11 @@ The GitHub workflows require a large list of secrets to deploy, notify and test
 1. `APPLE_DEMO_PASSWORD` - Demo account password used for https://appstoreconnect.apple.com/
 1. `BROWSERSTACK` - Used to access Browserstack's API
 
+### Important note about Secrets
+Secrets are available by default in most workflows. The exception to the rule is callable workflows. If a workflow is triggered by the `workflow_call` event, it will only have access to repo secrets if the workflow that called it passed in the secrets explicitly (for example, using `secrets: inherit`).
+
+Furthermore, secrets are not accessible in actions. If you need to access a secret in an action, you must declare it as an input and pass it in. GitHub _should_ still obfuscate the value of the secret in workflow run logs.
+
 ## Actions
 
 All these _workflows_ are comprised of atomic _actions_. Most of the time, we can use pre-made and independently maintained actions to create powerful workflows that meet our needs. However, when we want to do something very specific or have a more complex or robust action in mind, we can create our own _actions_.
@@ -144,4 +149,4 @@ In order to bundle actions with their dependencies into a single Node.js executa
        Do not try to use a relative path.
 - Confusingly, paths in action metadata files (`action.yml`) _must_ use relative paths.
 - You can't use any dynamic values or environment variables in a `uses` statement
-- In general, it is a best practice to minimize any side-effects of each action. Using atomic ("dumb") actions that have a clear and simple purpose will promote reuse and make it easier to understand the workflows that use them.
+- In general, it is a best practice to minimize any side-effects of each action. Using atomic ("dumb") actions that have a clear and simple purpose will promote reuse and make it easier to understand the workflows that use them.

.github/workflows/deployExpensifyHelp.yml

@@ -28,23 +28,27 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@93ea575cb5d8a053eaa0ac8fa3b40d7e05a33cc8
+
       - name: Setup NodeJS
         uses: Expensify/App/.github/actions/composite/setupNode@main
+
       - name: Setup Pages
         uses: actions/configure-pages@f156874f8191504dae5b037505266ed5dda6c382
+
       - name: Create docs routes file
         run: ./.github/scripts/createDocsRoutes.sh
+
       - name: Build with Jekyll
         uses: actions/jekyll-build-pages@0143c158f4fa0c5dcd99499a5d00859d79f70b0e
         with:
           source: ./docs/
           destination: ./docs/_site
+
       - name: Upload artifact
         uses: actions/upload-pages-artifact@64bcae551a7b18bcb9a09042ddf1960979799187
         with:
           path: ./docs/_site
 
-
   # Deployment job
   deploy:
     environment:

.github/workflows/e2ePerformanceTests.yml

@@ -46,6 +46,9 @@ jobs:
           git fetch origin tag ${{ steps.getMostRecentRelease.outputs.VERSION }} --no-tags --depth=1
           git switch --detach ${{ steps.getMostRecentRelease.outputs.VERSION }}
 
+      - name: Configure MapBox SDK
+        run: ./scripts/setup-mapbox-sdk.sh ${{ secrets.MAPBOX_SDK_DOWNLOAD_TOKEN }}
+
       - name: Build APK
         if: ${{ !fromJSON(steps.checkForExistingArtifact.outputs.exists) }}
         uses: Expensify/App/.github/actions/composite/buildAndroidAPK@main
@@ -112,6 +115,9 @@ jobs:
       - name: Checkout "delta ref"
         run: git checkout ${{ steps.getDeltaRef.outputs.DELTA_REF }}
 
+      - name: Configure MapBox SDK
+        run: ./scripts/setup-mapbox-sdk.sh ${{ secrets.MAPBOX_SDK_DOWNLOAD_TOKEN }}
+
       - name: Build APK
         uses: Expensify/App/.github/actions/composite/buildAndroidAPK@main
         with:

.github/workflows/platformDeploy.yml

@@ -36,6 +36,9 @@ jobs:
     steps:
       - uses: actions/checkout@v3
 
+      - name: Configure MapBox SDK
+        run: ./scripts/setup-mapbox-sdk.sh ${{ secrets.MAPBOX_SDK_DOWNLOAD_TOKEN }}
+
       - uses: Expensify/App/.github/actions/composite/setupNode@main
 
       - uses: ruby/setup-ruby@eae47962baca661befdfd24e4d6c34ade04858f7
@@ -144,16 +147,16 @@ jobs:
     steps:
       - uses: actions/checkout@v3
 
+      - name: Configure MapBox SDK
+        run: ./scripts/setup-mapbox-sdk.sh ${{ secrets.MAPBOX_SDK_DOWNLOAD_TOKEN }}
+
       - uses: Expensify/App/.github/actions/composite/setupNode@main
 
       - uses: ruby/setup-ruby@eae47962baca661befdfd24e4d6c34ade04858f7
         with:
           ruby-version: '2.7'
           bundler-cache: true
 
-      - name: Setup credentails for Mapbox SDK
-        run: ./scripts/setup-mapbox-sdk.sh ${{ secrets.MAPBOX_SDK_DOWNLOAD_TOKEN }}
-
       - name: Install cocoapods
         uses: nick-invision/retry@0711ba3d7808574133d713a0d92d2941be03a350
         with:
@@ -244,9 +247,6 @@ jobs:
           AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
           AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
 
-      - name: Setup credentails for Mapbox SDK
-        run: ./scripts/setup-mapbox-sdk.sh ${{ secrets.MAPBOX_SDK_DOWNLOAD_TOKEN }}
-
       - name: Build web for production
         if: ${{ fromJSON(env.SHOULD_DEPLOY_PRODUCTION) }}
         run: npm run build

.github/workflows/test.yml

@@ -42,7 +42,9 @@ jobs:
     name: Storybook tests
     steps:
       - uses: actions/checkout@v3
+
       - uses: Expensify/App/.github/actions/composite/setupNode@main
+
       - name: Storybook run
         run: npm run storybook -- --smoke-test --ci
 

.github/workflows/testBuild.yml

@@ -103,7 +103,7 @@ jobs:
           AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
           AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
 
-      - name: Setup credentails for Mapbox SDK
+      - name: Configure MapBox SDK
         run: ./scripts/setup-mapbox-sdk.sh ${{ secrets.MAPBOX_SDK_DOWNLOAD_TOKEN }}
 
       - name: Run Fastlane beta test
@@ -135,6 +135,9 @@ jobs:
         with:
           ref: ${{ github.event.pull_request.head.sha || needs.getBranchRef.outputs.REF }}
 
+      - name: Configure MapBox SDK
+        run: ./scripts/setup-mapbox-sdk.sh ${{ secrets.MAPBOX_SDK_DOWNLOAD_TOKEN }}
+
       - name: Create .env.adhoc file based on staging and add PULL_REQUEST_NUMBER env to it
         run: |
           cp .env.staging .env.adhoc
@@ -151,9 +154,6 @@ jobs:
           ruby-version: '2.7'
           bundler-cache: true
 
-      - name: Setup credentails for Mapbox SDK
-        run: ./scripts/setup-mapbox-sdk.sh ${{ secrets.MAPBOX_SDK_DOWNLOAD_TOKEN }}
-
       - name: Install cocoapods
         uses: nick-invision/retry@0711ba3d7808574133d713a0d92d2941be03a350
         with:

.github/workflows/verifyPodfile.yml

@@ -15,5 +15,7 @@ jobs:
     runs-on: macos-latest
     steps:
       - uses: actions/checkout@v3
+
       - uses: Expensify/App/.github/actions/composite/setupNode@main
+
       - run: ./.github/scripts/verifyPodfile.sh

android/app/build.gradle

@@ -22,7 +22,7 @@ react {
     //   The list of variants to that are debuggable. For those we're going to
     //   skip the bundling of the JS bundle and the assets. By default is just 'debug'.
     //   If you add flavors like lite, prod, etc. you'll have to list your debuggableVariants.
-    // debuggableVariants = ["liteDebug", "prodDebug"]
+    debuggableVariants = ["developmentDebug"]
 
     /* Bundling */
     //   A list containing the node command and its flags. Default is just 'node'.
@@ -90,8 +90,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001035507
-        versionName "1.3.55-7"
+        versionCode 1001035801
+        versionName "1.3.58-1"
     }
 
     flavorDimensions "default"

assets/emojis/index.js

@@ -15,13 +15,18 @@ const emojiNameTable = _.reduce(
     {},
 );
 
-const emojiCodeTable = _.reduce(
+const emojiCodeTableWithSkinTones = _.reduce(
     emojis,
     (prev, cur) => {
         const newValue = prev;
         if (!cur.header) {
             newValue[cur.code] = cur;
         }
+        if (cur.types) {
+            cur.types.forEach((type) => {
+                newValue[type] = cur;
+            });
+        }
         return newValue;
     },
     {},
@@ -32,5 +37,5 @@ const localeEmojis = {
     es: esEmojis,
 };
 
-export {emojiNameTable, emojiCodeTable, localeEmojis};
+export {emojiNameTable, emojiCodeTableWithSkinTones, localeEmojis};
 export {skinTones, categoryFrequentlyUsed, default} from './common';

contributingGuides/APPLE_GOOGLE_SIGNIN.md

@@ -80,9 +80,7 @@ Due to Expensify's expectation that a user will be using the same account on web
 
 The current Sign in with Google library for web [does not allow arbitrary customization of the sign-in button](https://developers.google.com/identity/gsi/web/guides/offerings#sign_in_with_google_button). (The recently deprecated version of the Sign in with Google for web did offer this capability.)
 
-This means the button is limited in design: there are no offline or hover states, and there can only be a white background for the button. We were able to get the official Apple button options to match, so we used the Google options as the starting point for the design.
-
-Additionally, note that the Google button has a rectangular white background when shown in a client app served on `localhost`, due to the iframe it uses in that scenario. This is expected, and will not be present when the app is hosted on other domains.
+This means the button is limited in design: there are no offline or hover states, and there can only be a white background for the button. We were able to get the official Apple button options to match, so we used the Google options as the starting point for the design. 
 
 ### Sign in with Apple does not allow `localhost`
 
@@ -146,10 +144,17 @@ On an Android build, alter the `AppleSignIn` component to log the token generate
 
 If you need to check that you received the correct data, check it on [jwt.io](https://jwt.io), which will decode it if it is a valid JWT token. It will also show when the token expires.
 
-Add this token to a `.env` file at the root of the project:
+Hardcode this token into `Session.beginAppleSignIn`, and but also verify a valid token was passed into the function, for example:
 
 ```
-ASI_TOKEN_OVERRIDE="..."
+function beginAppleSignIn(idToken) {
++   // Show that a token was passed in, without logging the token, for privacy
++   window.alert(`ORIGINAL ID TOKEN LENGTH: ${idToken.length}`);
++   const hardcodedToken = '...';
+    const {optimisticData, successData, failureData} = signInAttemptState();
++   API.write('SignInWithApple', {idToken: hardcodedToken}, {optimisticData, successData, failureData});
+-   API.write('SignInWithApple', {idToken}, {optimisticData, successData, failureData});
+}
 ```
 
 #### Configure the SSH tunneling

contributingGuides/PROPTYPES_CONVERSION_TABLE.md

@@ -24,7 +24,7 @@ const propTypes = {
 };
 
 // After
-type Props = {
+type ComponentProps = {
   isVisible: boolean;
   // Consider it as required unless you have proof that it is indeed an optional prop.
   confirmText: string; // vs. confirmText?: string;
@@ -115,7 +115,7 @@ type Input = {
 
 type Size = "small" | "medium" | "large";
 
-type Props = {
+type ComponentProps = {
   unknownData: string[];
 
   // It's not possible to infer the data as it can be anything because of reasons X, Y and Z.