Merge branch 'Expensify:main' into Migrate-Icon/index.js-to-function-…

…component

android/app/build.gradle

@@ -91,8 +91,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001040601
-        versionName "1.4.6-1"
+        versionCode 1001040602
+        versionName "1.4.6-2"
     }
 
     flavorDimensions "default"

ios/NewExpensify/Info.plist

@@ -40,7 +40,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.4.6.1</string>
+	<string>1.4.6.2</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.4.6.1</string>
+	<string>1.4.6.2</string>
 </dict>
 </plist>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.4.6-1",
+  "version": "1.4.6-2",
   "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/components/TabSelector/TabSelector.js

@@ -102,7 +102,7 @@ function TabSelector({state, navigation, onTabPress, position}) {
             {_.map(state.routes, (route, index) => {
                 const activeOpacity = getOpacity(position, state.routes.length, index, true, affectedAnimatedTabs);
                 const inactiveOpacity = getOpacity(position, state.routes.length, index, false, affectedAnimatedTabs);
-                const backgroundColor = getBackgroundColor(position, state.routes.length, index, affectedAnimatedTabs);
+                const backgroundColor = getBackgroundColor(state.routes.length, index, affectedAnimatedTabs);
                 const isFocused = index === state.index;
                 const {icon, title} = getIconAndTitle(route.name, translate);
 

src/pages/home/report/ReportActionsList.js

@@ -338,8 +338,9 @@ function ReportActionsList({
                 const nextMessage = sortedReportActions[index + 1];
                 const isCurrentMessageUnread = isMessageUnread(reportAction, lastReadTimeRef.current);
                 shouldDisplay = isCurrentMessageUnread && (!nextMessage || !isMessageUnread(nextMessage, lastReadTimeRef.current));
-                if (!messageManuallyMarkedUnread) {
-                    shouldDisplay = shouldDisplay && reportAction.actorAccountID !== Report.getCurrentUserAccountID();
+                if (shouldDisplay && !messageManuallyMarkedUnread) {
+                    const isWithinVisibleThreshold = scrollingVerticalOffset.current < MSG_VISIBLE_THRESHOLD ? reportAction.created < userActiveSince.current : true;
+                    shouldDisplay = reportAction.actorAccountID !== Report.getCurrentUserAccountID() && isWithinVisibleThreshold;
                 }
                 if (shouldDisplay) {
                     cacheUnreadMarkers.set(report.reportID, reportAction.reportActionID);

src/styles/utilities/overscrollBehaviorContain/index.native.ts

@@ -0,0 +1,5 @@
+import OverscrollBehaviorStyles from './types';
+
+const overscrollBehaviorContain: OverscrollBehaviorStyles = {};
+
+export default overscrollBehaviorContain;

src/styles/utilities/overscrollBehaviorContain/index.ts

@@ -0,0 +1,7 @@
+import OverscrollBehaviorStyles from './types';
+
+const overscrollBehaviorContain: OverscrollBehaviorStyles = {
+    overscrollBehavior: 'contain',
+};
+
+export default overscrollBehaviorContain;

src/styles/utilities/overscrollBehaviorContain/types.ts

@@ -0,0 +1,5 @@
+import {ViewStyle} from 'react-native';
+
+type OverscrollBehaviorStyles = Pick<ViewStyle, 'overscrollBehavior'>;
+
+export default OverscrollBehaviorStyles;