Merge branch 'Expensify:main' into arrow-feature-signed

android/app/build.gradle

@@ -156,8 +156,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001027607
-        versionName "1.2.76-7"
+        versionCode 1001027703
+        versionName "1.2.77-3"
         buildConfigField "boolean", "IS_NEW_ARCHITECTURE_ENABLED", isNewArchitectureEnabled().toString()
 
         if (isNewArchitectureEnabled()) {

contributingGuides/KSv2.md

@@ -16,7 +16,7 @@ To help surface the issues and PRs that need the most `#urgency`, we've built a
 
 <img src="https://user-images.githubusercontent.com/6829422/213875977-8ff4cf19-7690-4203-ae13-a8da259be7d0.png" />
 
-Once you have the extension installed, you can access it by going to https://github.com/Expensify/Expensify#k2 or clicking on the K2 tab at the top of a repo (between pull requests and GH actions). You'll have to create a Personal Access Token in GitHub ([here](https://github.com/settings/tokens)) and enter that in the K2 dashboard the first time you open it, so that your K2 extension can automatically pull data about your GitHub account.
+Once you have the extension installed, you can access it by going to https://github.com/Expensify/App#k2 or clicking on the K2 tab at the top of a repo (between pull requests and GH actions). You'll have to create a Personal Access Token in GitHub ([here](https://github.com/settings/tokens)) and enter that in the K2 dashboard the first time you open it, so that your K2 extension can automatically pull data about your GitHub account.
 
 ### Pull Requests for review
 

contributingGuides/TestRail_Navigation_C+.md

@@ -20,14 +20,10 @@ As a C+ member, you will have view-only access to Expensify's TestRail account i
 - Once determined, the C+ will post a comment in the original GH issue, mentioning which scenario the bug belongs under, why they think it belongs there, and if the new / updated test steps can fall under a current test case or if a new test case needs to be created. Please provide your reasoning for your decision in the comment and tag the BZ member to gut-check.
   - If the BZ member agrees with the C+'s recommendation, we can move forward. If not, a discussion will be held on where they think it might fit better and why.
   - There's a chance we will agree to not update/create a test case for the bug in question, depending on the bug. 
-- Once we know where the test will live, the C+ will tag the Contributor to propose test steps.
-  - If we're updating a current test case, the C+ will post what the current steps are in the GH for the Contributor to propose their test steps in relation to it.
-  - If we're creating a new test case, the C+ will note it for the Contributor.
-- Once the Contributor has provided proposed test steps, the C+ will review to ensure:
+- Once we know where the test will live, the C+ will then propose the appropriate test steps to either add to an existing case or for a new test case.
+- Once the C+ has provided proposed test steps, the BZ will review to ensure:
   - The language style matches the language style in TestRail (e.g. action items use the term `Verify`)
   - The steps are clear, logical, concise, and void of any assumed knowledge
   - (For updating a current test case) the steps are logically placed in the test case
-  - If changes are needed, the C+ and Contributor will discuss what changes should be done in order to make them appropriate
-- After confirming the above, the C+ will tag the BZ member and comment that the steps are ready to be reviewed
+  - If changes are needed, the BZ member and C+ will discuss what changes should be done in order to make them appropriate
 - The BZ member will then create a GH for Applause to update the TestRail steps, link it in the original bug GH, and move forward with payment.
-

desktop/main.js

@@ -246,7 +246,7 @@ const mainWindow = (() => {
         app.on('open-url', (event, url) => {
             event.preventDefault();
             const urlObject = new URL(url);
-            deeplinkUrl = `${APP_DOMAIN}${urlObject.pathname}`;
+            deeplinkUrl = `${APP_DOMAIN}${urlObject.pathname}${urlObject.search}${urlObject.hash}`;
 
             if (browserWindow) {
                 browserWindow.loadURL(deeplinkUrl);

docs/_includes/footer.html

@@ -110,12 +110,12 @@ <h3>Get Started</h3>
                     </li>
                 </ul>
 
-                <p class="page-footer__fine-print">&copy;2008-<script type="text/javascript">document.write(new Date().getFullYear());</script> Expensify, Inc.</p>
+                <p id="footer-copywrite-date" class="page-footer__fine-print"></p>
             </div>
         </div>
 
         <div class="page-footer__logo">
             <img src="/assets/images/expensify-footer-logo.svg" alt="Expensify" />
         </div>
     </div>
-</div>
+</div>

docs/assets/js/main.js

@@ -58,7 +58,14 @@ function navigateBack() {
     setTimeout(toggleHeaderMenu, 250);
 }
 
+function injectFooterCopywrite() {
+    const footer = document.getElementById('footer-copywrite-date');
+    footer.innerHTML = `©2008-${new Date().getFullYear()} Expensify, Inc.`;
+}
+
 window.addEventListener('DOMContentLoaded', () => {
+    injectFooterCopywrite();
+
     if (window.tocbot) {
         window.tocbot.init({
         // Where to render the table of contents.

ios/NewExpensify/Info.plist

@@ -17,7 +17,7 @@
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.2.76</string>
+	<string>1.2.77</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleURLTypes</key>
@@ -30,7 +30,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.2.76.7</string>
+	<string>1.2.77.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.2.76</string>
+	<string>1.2.77</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.2.76.7</string>
+	<string>1.2.77.3</string>
 </dict>
 </plist>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.2.76-7",
+  "version": "1.2.77-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.js

@@ -402,6 +402,7 @@ const CONST = {
         SHOW_LOADING_SPINNER_DEBOUNCE_TIME: 250,
         TOOLTIP_SENSE: 1000,
         TRIE_INITIALIZATION: 'trie_initialization',
+        COMMENT_LENGTH_DEBOUNCE_TIME: 500,
     },
     PRIORITY_MODE: {
         GSD: 'gsd',

src/components/DeeplinkWrapper/index.website.js

@@ -74,7 +74,7 @@ class DeeplinkWrapper extends PureComponent {
 
     openRouteInDesktopApp() {
         const expensifyUrl = new URL(CONFIG.EXPENSIFY.NEW_EXPENSIFY_URL);
-        const expensifyDeeplinkUrl = `${CONST.DEEPLINK_BASE_URL}${expensifyUrl.host}${window.location.pathname}`;
+        const expensifyDeeplinkUrl = `${CONST.DEEPLINK_BASE_URL}${expensifyUrl.host}${window.location.pathname}${window.location.search}${window.location.hash}`;
 
         // This check is necessary for Safari, otherwise, if the user
         // does NOT have the Expensify desktop app installed, it's gonna

src/components/ExceededCommentLength.js

@@ -1,27 +1,62 @@
-import React from 'react';
+import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
+import {debounce} from 'lodash';
 import CONST from '../CONST';
+import * as ReportUtils from '../libs/ReportUtils';
 import Text from './Text';
 import styles from '../styles/styles';
 
 const propTypes = {
-    /** The current length of the comment */
-    commentLength: PropTypes.number.isRequired,
+    /** Text Comment */
+    comment: PropTypes.string.isRequired,
+
+    /** Update UI on parent when comment length is exceeded */
+    onExceededMaxCommentLength: PropTypes.func.isRequired,
 };
 
-const ExceededCommentLength = (props) => {
-    if (props.commentLength <= CONST.MAX_COMMENT_LENGTH) {
-        return null;
+class ExceededCommentLength extends PureComponent {
+    constructor(props) {
+        super(props);
+
+        this.state = {
+            commentLength: 0,
+        };
+
+        // By debouncing, we defer the calculation until there is a break in typing
+        this.updateCommentLength = debounce(this.updateCommentLength.bind(this), CONST.TIMING.COMMENT_LENGTH_DEBOUNCE_TIME);
     }
 
-    return (
-        <Text style={[styles.textMicro, styles.textDanger, styles.chatItemComposeSecondaryRow, styles.mlAuto, styles.pl2]}>
-            {`${props.commentLength}/${CONST.MAX_COMMENT_LENGTH}`}
-        </Text>
-    );
-};
+    componentDidMount() {
+        this.updateCommentLength();
+    }
+
+    componentDidUpdate(prevProps) {
+        if (prevProps.comment === this.props.comment) {
+            return;
+        }
+
+        this.updateCommentLength();
+    }
+
+    updateCommentLength() {
+        const commentLength = ReportUtils.getCommentLength(this.props.comment);
+        this.setState({commentLength});
+        this.props.onExceededMaxCommentLength(commentLength > CONST.MAX_COMMENT_LENGTH);
+    }
+
+    render() {
+        if (this.state.commentLength <= CONST.MAX_COMMENT_LENGTH) {
+            return null;
+        }
+
+        return (
+            <Text style={[styles.textMicro, styles.textDanger, styles.chatItemComposeSecondaryRow, styles.mlAuto, styles.pl2]}>
+                {`${this.state.commentLength}/${CONST.MAX_COMMENT_LENGTH}`}
+            </Text>
+        );
+    }
+}
 
 ExceededCommentLength.propTypes = propTypes;
-ExceededCommentLength.displayName = 'ExceededCommentLength';
 
 export default ExceededCommentLength;

src/components/HeaderWithCloseButton.js

@@ -128,7 +128,7 @@ class HeaderWithCloseButton extends Component {
 
     render() {
         return (
-            <View style={[styles.headerBar, this.props.shouldShowBorderBottom && styles.borderBottom]}>
+            <View style={[styles.headerBar, this.props.shouldShowBorderBottom && styles.borderBottom, this.props.shouldShowBackButton && styles.pl2]}>
                 <View style={[
                     styles.dFlex,
                     styles.flexRow,
@@ -139,7 +139,6 @@ class HeaderWithCloseButton extends Component {
                 ]}
                 >
                     {this.props.shouldShowBackButton && (
-                    <View style={[styles.mr2]}>
                         <Tooltip text={this.props.translate('common.back')}>
                             <Pressable
                                 onPress={() => {
@@ -153,7 +152,6 @@ class HeaderWithCloseButton extends Component {
                                 <Icon src={Expensicons.BackArrow} />
                             </Pressable>
                         </Tooltip>
-                    </View>
                     )}
                     <Header
                         title={this.props.title}

src/components/IOUConfirmationList.js

@@ -44,7 +44,7 @@ const propTypes = {
         login: PropTypes.string.isRequired,
         alternateText: PropTypes.string,
         hasDraftComment: PropTypes.bool,
-        icons: PropTypes.arrayOf(PropTypes.string),
+        icons: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.func])),
         searchText: PropTypes.string,
         text: PropTypes.string,
         keyForList: PropTypes.string,

src/components/MenuItem.js

@@ -54,11 +54,16 @@ const defaultProps = {
 const MenuItem = (props) => {
     const titleTextStyle = StyleUtils.combineStyles([
         styles.popoverMenuText,
-        styles.ml3,
+        (props.icon ? styles.ml3 : undefined),
         (props.shouldShowBasicTitle ? undefined : styles.textStrong),
         (props.interactive && props.disabled ? {...styles.disabledText, ...styles.userSelectNone} : undefined),
     ], props.style);
-    const descriptionTextStyle = StyleUtils.combineStyles([styles.textLabelSupporting, styles.ml3, styles.breakAll, styles.lineHeightNormal], props.style);
+    const descriptionTextStyle = StyleUtils.combineStyles([
+        styles.textLabelSupporting,
+        (props.icon ? styles.ml3 : undefined),
+        styles.breakAll,
+        styles.lineHeightNormal,
+    ], props.style);
 
     return (
         <Pressable

src/components/Modal/BaseModal.js

@@ -16,15 +16,11 @@ const propTypes = {
 
     /** The ref to the modal container */
     forwardedRef: PropTypes.func,
-
-    /** Ensure that callback and trap deactivation are in the same loop on the web platform */
-    shouldUseOnDismiss: PropTypes.bool,
 };
 
 const defaultProps = {
     ...modalDefaultProps,
     forwardedRef: () => {},
-    shouldUseOnDismiss: false,
 };
 
 class BaseModal extends PureComponent {
@@ -113,8 +109,7 @@ class BaseModal extends PureComponent {
                     this.props.onModalShow();
                 }}
                 propagateSwipe={this.props.propagateSwipe}
-                onDismiss={this.props.shouldUseOnDismiss ? this.hideModal : () => {}}
-                onModalHide={!this.props.shouldUseOnDismiss ? this.hideModal : () => {}}
+                onModalHide={this.hideModal}
                 onSwipeComplete={this.props.onClose}
                 swipeDirection={swipeDirection}
                 isVisible={this.props.isVisible}

src/components/Modal/index.web.js

@@ -29,7 +29,6 @@ const Modal = (props) => {
         <BaseModal
             // eslint-disable-next-line react/jsx-props-no-spreading
             {...props}
-            shouldUseOnDismiss={props.fullscreen}
             onModalHide={hideModal}
             onModalShow={showModal}
         >

src/libs/Navigation/AppNavigator/BaseDrawerNavigator.js

@@ -66,6 +66,12 @@ class BaseDrawerNavigator extends Component {
         });
     }
 
+    componentWillUnmount() {
+        // When logging into NewDot first, then navigating from OldDot to NewDot with a different account, this component will be remounted.
+        // We need to reset the isDrawerReady promise so that we can delay the call to dismissModal until the drawer is really ready.
+        Navigation.resetDrawerIsReadyPromise();
+    }
+
     render() {
         const content = (
             <Drawer.Navigator

src/libs/Navigation/Navigation.js

@@ -18,7 +18,7 @@ const navigationIsReadyPromise = new Promise((resolve) => {
 });
 
 let resolveDrawerIsReadyPromise;
-const drawerIsReadyPromise = new Promise((resolve) => {
+let drawerIsReadyPromise = new Promise((resolve) => {
     resolveDrawerIsReadyPromise = resolve;
 });
 
@@ -278,6 +278,12 @@ function setIsDrawerReady() {
     resolveDrawerIsReadyPromise();
 }
 
+function resetDrawerIsReadyPromise() {
+    drawerIsReadyPromise = new Promise((resolve) => {
+        resolveDrawerIsReadyPromise = resolve;
+    });
+}
+
 function isReportScreenReady() {
     return reportScreenIsReadyPromise;
 }
@@ -301,6 +307,7 @@ export default {
     getReportIDFromRoute,
     isDrawerReady,
     setIsDrawerReady,
+    resetDrawerIsReadyPromise,
     isDrawerRoute,
     setIsNavigating,
     isReportScreenReady,