Merge branch 'main' into @chrispader/theme-switching-ts-types

.github/workflows/deployExpensifyHelp.yml

@@ -1,28 +1,30 @@
-# Deploying the ExpensifyHelp Jekyll site by dynamically generating routes file
 name: Deploy ExpensifyHelp
 
 on:
-  # Runs on pushes targeting the default branch
+  # Run on any push to main that has changes to the docs directory
   push:
-    branches: ["main"]
-
-  # Allows you to run this workflow manually from the Actions tab
+    branches:
+      - main
+    paths:
+      - 'docs/**'
+
+  # Run on any pull request (except PRs against staging or production) that has changes to the docs directory
+  pull_request:
+    types: [opened, synchronize]
+    branches-ignore: [staging, production]
+    paths:
+      - 'docs/**'
+
+  # Run on any manual trigger
   workflow_dispatch:
 
-# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
-permissions:
-  contents: read
-  pages: write
-  id-token: write
-
 # Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
 # However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
 concurrency:
   group: "pages"
   cancel-in-progress: false
 
 jobs:
-  # Build job
   build:
     runs-on: ubuntu-latest
     steps:
@@ -32,9 +34,6 @@ jobs:
       - 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
 
@@ -44,19 +43,18 @@ jobs:
           source: ./docs/
           destination: ./docs/_site
 
-      - name: Upload artifact
-        uses: actions/upload-pages-artifact@64bcae551a7b18bcb9a09042ddf1960979799187
+      - name: Deploy to Cloudflare Pages
+        uses: cloudflare/pages-action@f0a1cd58cd66095dee69bfa18fa5efd1dde93bca
+        id: deploy
         with:
-          path: ./docs/_site
-
-  # Deployment job
-  deploy:
-    environment:
-      name: github-pages
-      url: ${{ steps.deployment.outputs.page_url }}
-    runs-on: ubuntu-latest
-    needs: build
-    steps:
-      - name: Deploy to GitHub Pages
-        id: deployment
-        uses: actions/deploy-pages@af48cf94a42f2c634308b1c9dc0151830b6f190a
+          apiToken: ${{ secrets.CLOUDFLARE_PAGES_TOKEN }}
+          accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
+          projectName: helpdot
+          directory: ./docs/_site
+
+      - name: Leave a comment on the PR
+        uses: actions-cool/maintain-one-comment@de04bd2a3750d86b324829a3ff34d47e48e16f4b
+        if: ${{ github.event_name == 'pull_request' }}
+        with:
+          token: ${{ secrets.OS_BOTIFY_TOKEN }}
+          body: ${{ format('A preview of your ExpensifyHelp changes have been deployed to {0} ⚡️', steps.deploy.outputs.alias) }}

android/app/build.gradle

@@ -90,8 +90,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001038708
-        versionName "1.3.87-8"
+        versionCode 1001038803
+        versionName "1.3.88-3"
     }
 
     flavorDimensions "default"

docs/articles/expensify-classic/integrations/HR-integrations/QuickBooks-Time.md

@@ -1,5 +1,41 @@
 ---
-title: Coming Soon
-description: Coming Soon
+title: Expensify and TSheets/QuickBooks Time Integration Guide
+description: This help document explains how to connect TSheets/QuickBooks Time to your Expensify policy
 ---
-## Resource Coming Soon!
+# Overview
+
+Connecting Expensify with TSheets/QuickBooks Time can streamline your expense tracking and time management processes. This integration allows you to automatically sync time entries from TSheets/QuickBooks Time with expenses in Expensify, ensuring accurate and efficient expense reporting. 
+
+# How to set up the Expensify and TSheets/QuickBooks Time integration
+
+Before you begin, make sure you have the following:
+
+- **Expensify account:** You must have an active Expensify account.
+- **TSheets account:** You must have a TSheets account and admin privileges to set up the integration.
+
+Now, follow these steps to set up the integration:
+
+1. Log into your Expensify account on your web browser
+
+2. Go to **Settings > Workspaces > Group > Workspace Name > Connections > TSheets**
+
+3. Click **Connect to TSheets**
+
+4. Follow the on-screen instructions to sign in to your TSheets account and grant Expensify access.
+
+5. Once the integration is authorized, you may need to configure some preferences.
+- Specify how you want TSheets time entries to be imported into Expensify. You can typically customize settings like the date range, project/task mapping, and expense categories.
+
+6. Now, we’d recommend testing the integration. 
+- Create a sample time entry in TSheets and check if it’s automatically reflected in your Expensify account.
+
+7. If the test is successful, save your integration settings.
+
+8. You may also want to schedule regular syncs or specify how often Expensify should pull data from TSheets.
+
+With the integration set up, your TSheets time entries will now appear in Expensify as expenses. You can review, categorize, and submit these expenses as needed.
+
+Congratulations! You've successfully integrated Expensify with TSheets, simplifying your expense tracking and reporting process.
+
+For questions, don't hesitate to reach out to concierge@expensify.com or chat directly with your account manager 
+

ios/NewExpensify/Info.plist

@@ -19,7 +19,7 @@
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.3.87</string>
+	<string>1.3.88</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleURLTypes</key>
@@ -40,7 +40,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.3.87.8</string>
+	<string>1.3.88.3</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.3.87</string>
+	<string>1.3.88</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.3.87.8</string>
+	<string>1.3.88.3</string>
 </dict>
 </plist>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.3.87-8",
+  "version": "1.3.88-3",
   "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/CONST.ts

@@ -124,7 +124,16 @@ const CONST = {
             VIEW_HEIGHT: 275,
         },
         MONEY_REPORT: {
-            MIN_HEIGHT: 280,
+            SMALL_SCREEN: {
+                IMAGE_HEIGHT: 300,
+                CONTAINER_MINHEIGHT: 280,
+                VIEW_HEIGHT: 220,
+            },
+            WIDE_SCREEN: {
+                IMAGE_HEIGHT: 450,
+                CONTAINER_MINHEIGHT: 280,
+                VIEW_HEIGHT: 275,
+            },
         },
     },
 

src/ROUTES.ts

@@ -5,6 +5,16 @@ import CONST from './CONST';
  * This is a file containing constants for all of the routes we want to be able to go to
  */
 
+/**
+ * This is a file containing constants for all of the routes we want to be able to go to
+ * Returns an encoded URI component for the backTo param which can be added to the end of URLs
+ * @param backTo
+ * @returns
+ */
+function getBackToParam(backTo?: string): string {
+    return backTo ? `?backTo=${encodeURIComponent(backTo)}` : '';
+}
+
 export default {
     HOME: '',
     /** This is a utility route used to go to the user's concierge chat, or the sign-in page if the user's not authenticated */
@@ -20,10 +30,7 @@ export default {
     },
     PROFILE: {
         route: 'a/:accountID',
-        getRoute: (accountID: string | number, backTo = '') => {
-            const backToParam = backTo ? `?backTo=${encodeURIComponent(backTo)}` : '';
-            return `a/${accountID}${backToParam}`;
-        },
+        getRoute: (accountID: string | number, backTo?: string) => `a/${accountID}${getBackToParam(backTo)}`,
     },
 
     TRANSITION_BETWEEN_APPS: 'transition',
@@ -49,10 +56,7 @@ export default {
     BANK_ACCOUNT_PERSONAL: 'bank-account/personal',
     BANK_ACCOUNT_WITH_STEP_TO_OPEN: {
         route: 'bank-account/:stepToOpen?',
-        getRoute: (stepToOpen = '', policyID = '', backTo = ''): string => {
-            const backToParam = backTo ? `&backTo=${encodeURIComponent(backTo)}` : '';
-            return `bank-account/${stepToOpen}?policyID=${policyID}${backToParam}`;
-        },
+        getRoute: (stepToOpen = '', policyID = '', backTo?: string): string => `bank-account/${stepToOpen}?policyID=${policyID}${getBackToParam(backTo)}`,
     },
 
     SETTINGS: 'settings',
@@ -104,13 +108,7 @@ export default {
     SETTINGS_PERSONAL_DETAILS_ADDRESS: 'settings/profile/personal-details/address',
     SETTINGS_PERSONAL_DETAILS_ADDRESS_COUNTRY: {
         route: 'settings/profile/personal-details/address/country',
-        getRoute: (country: string, backTo?: string) => {
-            let route = `settings/profile/personal-details/address/country?country=${country}`;
-            if (backTo) {
-                route += `&backTo=${encodeURIComponent(backTo)}`;
-            }
-            return route;
-        },
+        getRoute: (country: string, backTo?: string) => `settings/profile/personal-details/address/country?country=${country}${getBackToParam(backTo)}`,
     },
     SETTINGS_CONTACT_METHODS: 'settings/profile/contact-methods',
     SETTINGS_CONTACT_METHOD_DETAILS: {

src/components/EmojiPicker/EmojiPicker.js

@@ -1,12 +1,13 @@
 import React, {useState, useEffect, useRef, forwardRef, useImperativeHandle} from 'react';
 import {Dimensions} from 'react-native';
 import _ from 'underscore';
+import PropTypes from 'prop-types';
 import EmojiPickerMenu from './EmojiPickerMenu';
 import CONST from '../../CONST';
 import styles from '../../styles/styles';
 import PopoverWithMeasuredContent from '../PopoverWithMeasuredContent';
 import withWindowDimensions, {windowDimensionsPropTypes} from '../withWindowDimensions';
-import withViewportOffsetTop, {viewportOffsetTopPropTypes} from '../withViewportOffsetTop';
+import withViewportOffsetTop from '../withViewportOffsetTop';
 import compose from '../../libs/compose';
 import * as StyleUtils from '../../styles/StyleUtils';
 import calculateAnchorPosition from '../../libs/calculateAnchorPosition';
@@ -18,7 +19,7 @@ const DEFAULT_ANCHOR_ORIGIN = {
 
 const propTypes = {
     ...windowDimensionsPropTypes,
-    ...viewportOffsetTopPropTypes,
+    viewportOffsetTop: PropTypes.number.isRequired,
 };
 
 const EmojiPicker = forwardRef((props, ref) => {

src/components/EmojiPicker/EmojiPickerMenu/index.js

@@ -108,7 +108,6 @@ function EmojiPickerMenu(props) {
     const [selection, setSelection] = useState({start: 0, end: 0});
     const [isFocused, setIsFocused] = useState(false);
     const [isUsingKeyboardMovement, setIsUsingKeyboardMovement] = useState(false);
-    const [selectTextOnFocus, setSelectTextOnFocus] = useState(false);
 
     useEffect(() => {
         const emojisAndHeaderRowIndices = getEmojisAndHeaderRowIndices();
@@ -162,8 +161,6 @@ function EmojiPickerMenu(props) {
         if (!searchInputRef.current) {
             return;
         }
-
-        setSelectTextOnFocus(true);
         searchInputRef.current.focus();
     }
 
@@ -323,11 +320,7 @@ function EmojiPickerMenu(props) {
 
             // We allow typing in the search box if any key is pressed apart from Arrow keys.
             if (searchInputRef.current && !searchInputRef.current.isFocused()) {
-                setSelectTextOnFocus(false);
                 searchInputRef.current.focus();
-
-                // Re-enable selection on the searchInput
-                setSelectTextOnFocus(true);
             }
         },
         [filteredEmojis, highlightAdjacentEmoji, highlightedIndex, isFocused, onEmojiSelected, preferredSkinTone],
@@ -371,13 +364,17 @@ function EmojiPickerMenu(props) {
         }
 
         setupEventHandlers();
-        updateFirstNonHeaderIndex(emojis.current);
 
         return () => {
             cleanupEventHandlers();
         };
     }, [forwardedRef, shouldFocusInputOnScreenFocus, cleanupEventHandlers, setupEventHandlers]);
 
+    useEffect(() => {
+        // Find and store index of the first emoji item on mount
+        updateFirstNonHeaderIndex(emojis.current);
+    }, []);
+
     const scrollToHeader = useCallback((headerIndex) => {
         if (!emojiListRef.current) {
             return;
@@ -481,7 +478,6 @@ function EmojiPickerMenu(props) {
                     defaultValue=""
                     ref={searchInputRef}
                     autoFocus={shouldFocusInputOnScreenFocus}
-                    selectTextOnFocus={selectTextOnFocus}
                     onSelectionChange={onSelectionChange}
                     onFocus={() => {
                         setHighlightedIndex(-1);

src/components/MoneyReportHeader.js

@@ -121,10 +121,6 @@ function MoneyReportHeader({session, personalDetails, policy, chatReport, nextSt
                             shouldShowPaymentOptions
                             style={[styles.pv2]}
                             formattedAmount={formattedAmount}
-                            anchorAlignment={{
-                                horizontal: CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.LEFT,
-                                vertical: CONST.MODAL.ANCHOR_ORIGIN_VERTICAL.TOP,
-                            }}
                         />
                     </View>
                 )}

src/components/MoneyRequestConfirmationList.js

@@ -506,7 +506,11 @@ function MoneyRequestConfirmationList(props) {
                 policyID={props.policyID}
                 shouldShowPaymentOptions
                 buttonSize={CONST.DROPDOWN_BUTTON_SIZE.LARGE}
-                anchorAlignment={{
+                kycWallAnchorAlignment={{
+                    horizontal: CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.LEFT,
+                    vertical: CONST.MODAL.ANCHOR_ORIGIN_VERTICAL.BOTTOM,
+                }}
+                paymentMethodDropdownAnchorAlignment={{
                     horizontal: CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.RIGHT,
                     vertical: CONST.MODAL.ANCHOR_ORIGIN_VERTICAL.BOTTOM,
                 }}

src/components/PDFView/PDFPasswordForm.js

@@ -131,7 +131,7 @@ function PDFPasswordForm({isFocused, isPasswordInvalid, shouldShowLoadingIndicat
                 autoCorrect={false}
                 textContentType="password"
                 onChangeText={updatePassword}
-                returnKeyType="done"
+                returnKeyType="go"
                 onSubmitEditing={submitPassword}
                 errorText={errorText}
                 onFocus={() => onPasswordFieldFocused(true)}