Merge branch 'main' into 17004-add-pressable-ESLint-rules

.github/workflows/platformDeploy.yml

@@ -165,7 +165,7 @@ jobs:
         with:
           timeout_minutes: 10
           max_attempts: 5
-          command: cd ios && pod install
+          command: cd ios && bundle exec pod install
 
       - name: Decrypt profile
         run: cd ios && gpg --quiet --batch --yes --decrypt --passphrase="$LARGE_SECRET_PASSPHRASE" --output chat_expensify_appstore.mobileprovision chat_expensify_appstore.mobileprovision.gpg

.github/workflows/testBuild.yml

@@ -148,7 +148,7 @@ jobs:
         with:
           timeout_minutes: 10
           max_attempts: 5
-          command: cd ios && pod install
+          command: cd ios && bundle exec pod install
 
       - name: Decrypt profile
         run: cd ios && gpg --quiet --batch --yes --decrypt --passphrase="$LARGE_SECRET_PASSPHRASE" --output chat_expensify_adhoc.mobileprovision chat_expensify_adhoc.mobileprovision.gpg

README.md

@@ -47,7 +47,10 @@ In order to have more consistent builds, we use a strict `node` and `npm` versio
 ## Running the iOS app 📱
 For an M1 Mac, read this [SO](https://stackoverflow.com/c/expensify/questions/11580) for installing cocoapods.
 
-* To install the iOS dependencies, run: `npm install && cd ios/ && pod install && cd ..`
+* Install project gems, including cocoapods, using bundler to ensure everyone uses the same versions. In the project root, run: `bundle install`
+    * If you get the error `Could not find 'bundler'`, install the bundler gem first: `gem install bundler` and try again.
+    * If you are using MacOS and get the error `Gem::FilePermissionError` when trying to install the bundler gem, you're likely using system Ruby, which requires administrator permission to modify. To get around this, install another version of Ruby with a version manager like [rbenv](https://github.com/rbenv/rbenv#installation).
+* To install the iOS dependencies, run: `npm install && npm run pod-install`
 * If you are an Expensify employee and want to point the emulator to your local VM, follow [this](https://stackoverflow.com/c/expensify/questions/7699)
 * To run a on a **Development Simulator**: `npm run ios`
 * Changes applied to Javascript will be applied automatically, any changes to native code will require a recompile

android/app/build.gradle

@@ -106,8 +106,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001033804
-        versionName "1.3.38-4"
+        versionCode 1001033805
+        versionName "1.3.38-5"
     }
 
     splits {

docs/articles/other/Everything-About-Chat.md

@@ -32,7 +32,7 @@ All workspace admins can access the #admins room. Use the #admins room to collab
 - To turn your text into a blockquote, add an angled bracket (>) in front of the text: 
    >your text
 - To turn your message into a heading, place a number sign (#) in front of the text:
-   ### Heading 
+# Heading
 - To turn your entire message into code block, place three backticks on both sides of the text:
 ```
 here's some text 

docs/articles/playbooks/Expensify-Chat-Playbook-for-Conferences.md

@@ -0,0 +1,114 @@
+---
+title: Expensify Chat Playbook for Conferences 
+description: Best practices for how to deploy Expensify Chat for your conference
+---
+## Overview
+
+To help make setting up Expensify Chat for your event and your attendees super simple, we’ve created a guide for all of the technical setup details.
+
+
+## Who you are
+
+As a conference organizer, you’re expected to amaze and inspire attendees. You want attendees to get to the right place on time, engage with the speakers, and create relationships with each other that last long after the conference is done. Enter Expensify Chat, a free feature that allows attendees to interact with organizers and other attendees in realtime. With Expensify Chat, you can: 
+
+- Communicate logistics and key information
+- Foster conference wide attendee networking
+- Organize conversations by topic and audience
+- Continue conversations long after the event itself 
+- Digitize attendee social interaction
+
+Sounds good? Great! In order to ensure your team, your speakers, and your attendees have the best experience possible, we’ve created a guide on how to use Expensify Chat at your event. 
+
+_Let’s get started!_
+
+
+## Support
+
+Connect with your dedicated account manager in any new.expensify.com #admins room. Your account manager is excited to brainstorm the best ways to make the most out of your event and work through any questions you have about the setup steps below. 
+
+
+## Step by step instructions for setting up your conference on Expensify Chat
+
+Based on our experience running conferences atop Expensify Chat, we recommend the following simple steps:
+
+### Step 1: Create your event Workspace in Expensify 
+
+To create your event workspace in Expensify:
+1. In new.expensify.com: “+” > “New workspace” 
+2. Name the workspace e.g. “ExpensiCon”
+
+### Step 2: Setup all necessary Expensify Chat rooms you want to feature at your event
+
+*Protip*: Your account manager can complete this step with you. Chat with them in #admins on new.expensify.com to coordinate!
+
+To create a new chat room:
+1. Go to new.expensify.com
+2. Go to “+” > New room  
+3. Name to room e.g. “#social”
+4. Select the workspace created at step 1
+5. Select “Public” visibility 
+6. “Create room” > Copy/Paste room URL for use later
+7. Repeat for each room
+
+For an easy-to-follow event, we recommend creating these chat rooms:
+
+- *#social* - This room will include all attendees, speakers, and members of your organizing team. You can use this room to discuss social events, happy hours, dinners, or encourage attendees to mingle, share photos and connect. 
+- *#announce* - This room will be used as your main announcement channel, and should only be used by organizers to announce schedule updates or anything important that your attendees need to know. Everyone in your policy will be invited to this channel, but chatting in here isn’t encouraged so to keep the noise to a minimum.
+- *Create an individual room for each session* - Attendees will be able to engage with the speaker/session leader and can ask questions about their content either before/during/after the session.
+- *Create a room with your Expensify account manager/s* - We can use this room to coordinate using Expensify Chat before, during, and after the event. 
+
+### Step 3: Add chat room QR codes to the applicable session slide deck
+
+Gather QR codes:
+1. Go to new.exensify.com 
+2. Click into a room and click the room name or avatar in the top header
+3. Go into Share Code
+4. Download or screenshot the QR code image
+
+Add the QR code to every slide so that if folks forget to scan the QR code at the beginning of the presentation, they can still join the discussion. 
+
+### Step 4: Train speakers on how to use chat during their sessions
+
+*Protip*: Copy and paste a link to this section and share it directly with your speakers
+*Protip*: Your account manager can communicate this training to your speakers. Chat with them in #admins on new.expensify.com to coordinate!
+
+Are you a speaker at an event? Great! Expensify Chat is the perfect way to connect with your session attendees before, during, and after the event. Use Expensify Chat to introduce yourself and your topic, and open the floor for attendees to ask questions and participate in discussion about your presentation, as well as connect with other attendees that were in the room. Here’s a quick list to help you best prepare for your session by using Expensify Chat: 
+
+1. Ensure your session has an Expensify Chat room and that you know the URL link to your session so you can share with attendees ahead of time
+2. Join the chat room ahead of the event so you can start engaging with your session’s attendees from the get-go
+3. Make sure you have a session moderator with you on the day who is available to help moderate questions and facilitate discussion while you’re busy speaking
+4. Ensure your session slides include the QR code for your session chat room. We’d recommend making sure the QR is visible on every page of your deck in case an attendee didn’t join at the beginning. 
+5. Engage with attendees after your session to continue the discussion around your topic!
+
+*Messaging Suggestions*
+
+- Default: Welcome to [CONFERENCE NAME]! This is the [SESSION TITLE] chat room. Please use this room to chat with each other, submit questions about today's presentation, and to chat directly with [SPEAKER NAME] after the session wraps up.
+- Custom: As part of pre-conference speaker outreach we should allow speakers to change this message and use the default if they don’t respond.”
+
+### Step 5: Plan out your messaging and cadence before the event begins
+
+Expensify Chat is a great place to provide updates leading up to your event -- share news, get folks excited about speakers, and let attendees know of crucial event information like recommended attire, travel info, and more.
+
+### Step 6: Update your rooms throughout the event 
+
+We find chat to be a powerful way to not only engage your attendees, but direct them in realtime to get exactly where they need to go, in realtime:
+
+- #announce: Use this room to make announcements such as what’s coming up next, where and when social events are taking place, or announcing the sponsor floor is open to the entire conference. Only workspace admins can post in this room.
+- #social: Have your employees in this room sharing fun photos, stoking conversations, and respond to any questions or feedback.
+- Speaker rooms: Encourage employees to jump in to comment on content encouraging other attendees to engage with each other during sessions.
+
+*Protip*: Expensify Chat has moderation tools to help flag comments deemed to be spam, inconsiderate, intimidating, bullying, harassment, assault. On any comment just click the flag icon to moderate conversation. 
+
+### Step 7: Follow up with attendees after the event
+
+Continue the connections by using Expensify Chat to keep your conference community connected. Encourage attendees to share photos, their favorite memories, funny stories, and more. 
+
+- We’d recommend creating a draft of all of your reminders that you plan to send in the #announce (or #social) room throughout the event. 
+- A post in the morning outlining the full agenda, and then before each event as it happens throughout the day is recommended. Be sure to include details like timings, locations, and any special detail like attire to help attendees feel prepared.
+- Use markdown when posting updates so that your messages are easy to read.
+- We also recommend posting your updates on new lines so that if someone has a question about a certain item they can ask in a thread pertaining to that topic, rather than in one consolidated block. 
+
+## You’re all set!
+
+Once you have completed the above steps you are ready to host your conference on Expensify Chat! Let your account manager know any questions you have over in your new.expensify.com #admins room and start driving activity in your Expensify Chat rooms. By step 4 you have the foundations in place so a great next step is to start training your speakers on how to use Expensify Chat for their sessions. Coordinate with your account manager to make sure everything goes smoothly! 
+

ios/NewExpensify/Info.plist

@@ -32,7 +32,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.3.38.4</string>
+	<string>1.3.38.5</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>

ios/NewExpensifyTests/Info.plist

@@ -19,6 +19,6 @@
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.3.38.4</string>
+	<string>1.3.38.5</string>
 </dict>
 </plist>

ios/Podfile.lock

@@ -1141,4 +1141,4 @@ SPEC CHECKSUMS:
 
 PODFILE CHECKSUM: 69f576e475be6d130ee96103b131f71bfdbf8a6e
 
-COCOAPODS: 1.12.1
+COCOAPODS: 1.11.3

package.json

@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.3.38-4",
+  "version": "1.3.38-5",
   "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.",
@@ -11,6 +11,7 @@
     "clean": "npx react-native clean-project-auto",
     "android": "scripts/set-pusher-suffix.sh && npx react-native run-android --port=8083",
     "ios": "scripts/set-pusher-suffix.sh && npx react-native run-ios --port=8082",
+    "pod-install": "cd ios && bundle exec pod install",
     "ipad": "concurrently \"npx react-native run-ios --port=8082 --simulator=\"iPad Pro (12.9-inch) (4th generation)\"\"",
     "ipad-sm": "concurrently \"npx react-native run-ios --port=8082 --simulator=\"iPad Pro (9.7-inch)\"\"",
     "start": "npx react-native start",

patches/react-native+0.71.2-alpha.3.patch

@@ -1,5 +1,5 @@
 diff --git a/node_modules/react-native/Libraries/Components/Keyboard/KeyboardAvoidingView.js b/node_modules/react-native/Libraries/Components/Keyboard/KeyboardAvoidingView.js
-index 2f48f9e..6418c76 100644
+index 2f48f9e..ac7a416 100644
 --- a/node_modules/react-native/Libraries/Components/Keyboard/KeyboardAvoidingView.js
 +++ b/node_modules/react-native/Libraries/Components/Keyboard/KeyboardAvoidingView.js
 @@ -65,6 +65,7 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
@@ -33,13 +33,13 @@ index 2f48f9e..6418c76 100644
        await this._updateBottomIfNecessary();
      }
 
-@@ -127,20 +130,31 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
+@@ -127,20 +130,32 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
      }
    };
 
 +  // Avoid unnecessary renders if the KeyboardAvoidingView is disabled.
 +  _setBottom = (value: number) => {
-+    const {enabled = true} = this.props;
++    const enabled = this.props.enabled ?? true;
 +    this._bottom = value;
 +    if (enabled) {
 +      this.setState({bottom: value});
@@ -64,19 +64,20 @@ index 2f48f9e..6418c76 100644
 -    if (duration && easing) {
 +    this._setBottom(height);
 +
++    const enabled = this.props.enabled ?? true;
 +    if (enabled && duration && easing) {
        LayoutAnimation.configureNext({
          // We have to pass the duration equal to minimal accepted duration defined here: RCTLayoutAnimation.m
          duration: duration > 10 ? duration : 10,
-@@ -150,9 +164,15 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
+@@ -150,9 +165,15 @@ class KeyboardAvoidingView extends React.Component<Props, State> {
          },
        });
      }
 -    this.setState({bottom: height});
    };
 
 +  componentDidUpdate(_: Props, prevState: State): void {
-+    const {enabled = true} = this.props;
++    const enabled = this.props.enabled ?? true;
 +    if (enabled && this._bottom !== prevState.bottom) {
 +      this.setState({bottom: this._bottom});
 +    }

src/ROUTES.js

@@ -70,8 +70,6 @@ export default {
     getReportShareCodeRoute: (reportID) => `r/${reportID}/details/shareCode`,
     REPORT_ATTACHMENTS: 'r/:reportID/attachment',
     getReportAttachmentRoute: (reportID, source) => `r/${reportID}/attachment?source=${encodeURI(source)}`,
-    SELECT_YEAR: 'select-year',
-    getYearSelectionRoute: (minYear, maxYear, currYear, backTo) => `select-year?min=${minYear}&max=${maxYear}&year=${currYear}&backTo=${backTo}`,
 
     /** 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 */
     CONCIERGE: 'concierge',

src/components/EmojiPicker/EmojiPickerMenu/index.js

@@ -526,11 +526,7 @@ class EmojiPickerMenu extends Component {
                     onScroll={(e) => (this.currentScrollOffset = e.nativeEvent.contentOffset.y)}
                     getItemLayout={this.getItemLayout}
                     contentContainerStyle={styles.flexGrow1}
-                    ListEmptyComponent={
-                        <View style={[styles.alignItemsCenter, styles.justifyContentCenter, styles.flex1]}>
-                            <Text style={[styles.textLabel, styles.colorMuted]}>{this.props.translate('common.noResultsFound')}</Text>
-                        </View>
-                    }
+                    ListEmptyComponent={<Text style={[styles.textLabel, styles.colorMuted]}>{this.props.translate('common.noResultsFound')}</Text>}
                 />
                 <EmojiSkinToneList
                     updatePreferredSkinTone={this.updatePreferredSkinTone}

src/components/EmojiPicker/EmojiPickerMenu/index.native.js

@@ -222,11 +222,7 @@ class EmojiPickerMenu extends Component {
                     // used because of a bug in RN where stickyHeaderIndices can't be updated after the list is rendered https://github.com/facebook/react-native/issues/25157
                     removeClippedSubviews={false}
                     contentContainerStyle={styles.flexGrow1}
-                    ListEmptyComponent={
-                        <View style={[styles.alignItemsCenter, styles.justifyContentCenter, styles.flex1]}>
-                            <Text style={[styles.disabledText]}>{this.props.translate('common.noResultsFound')}</Text>
-                        </View>
-                    }
+                    ListEmptyComponent={<Text style={[styles.disabledText]}>{this.props.translate('common.noResultsFound')}</Text>}
                 />
                 <EmojiSkinToneList
                     updatePreferredSkinTone={this.updatePreferredSkinTone}