Revert "Merge pull request #82507 from NJ-2020/fix/selection-bug-37447"

This reverts commit 4d9781e, reversing
changes made to 9b4ebcb.

Author: MelvinBot

patches/react-native-web/details.md

@@ -134,13 +134,3 @@
 - Upstream PR/issue: https://github.com/necolas/react-native-web/issues/2817
 - E/App issue: https://github.com/Expensify/App/issues/73782
 - PR introducing patch: https://github.com/Expensify/App/pull/76332
-
-### [react-native-web+0.21.2+013+fix-selection-bug.patch](react-native-web+0.21.2+013+fix-selection-bug.patch)
-
-- Reason:
-    ```
-    Fix selection bug for InvertedFlatlist by reversing the DOM tree elements using `pushOrUnshift` method
-    ```
-- Upstream PR/issue: https://github.com/necolas/react-native-web/issues/1807, it has been closed because of [this](https://github.com/necolas/react-native-web/issues/1807#issuecomment-725689704) 
-- E/App issue: https://github.com/Expensify/App/issues/37447
-- PR introducing patch: https://github.com/Expensify/App/pull/82507

patches/react-native-web/react-native-web+0.21.2+013+fix-selection-bug.patch

@@ -2,21 +2,18 @@
 // On all other platforms, the action sheet is implemented using the Animated.ScrollView
 import React from 'react';
 import Reanimated from 'react-native-reanimated';
-import useThemeStyles from '@hooks/useThemeStyles';
 import {Actions, ActionSheetAwareScrollViewProvider, useActionSheetAwareScrollViewActions, useActionSheetAwareScrollViewState} from './ActionSheetAwareScrollViewContext';
 import type {ActionSheetAwareScrollViewProps, RenderActionSheetAwareScrollViewComponent} from './types';
 import useActionSheetAwareScrollViewRef from './useActionSheetAwareScrollViewRef';
 
 function ActionSheetAwareScrollView({children, ref, ...restProps}: ActionSheetAwareScrollViewProps) {
     const {onRef} = useActionSheetAwareScrollViewRef(ref);
-    const styles = useThemeStyles();
 
     return (
         <Reanimated.ScrollView
             // eslint-disable-next-line react/jsx-props-no-spreading
             {...restProps}
             ref={onRef}
-            contentContainerStyle={[restProps.contentContainerStyle, restProps.horizontal ? styles.flexRowReverse : styles.flexColumnReverse, styles.justifyContentEnd]}
         >
             {children}
         </Reanimated.ScrollView>

src/components/ActionSheetAwareScrollView/index.tsx

@@ -112,15 +112,15 @@ function MVCPFlatList<T>({
 
         const contentViewLength = contentView.childNodes.length;
         for (let i = mvcpMinIndexForVisible; i < contentViewLength; i++) {
-            const subview = contentView.childNodes[restProps.inverted ? contentViewLength - i - 1 : i] as HTMLElement;
+            const subview = contentView.childNodes[i] as HTMLElement;
             const subviewOffset = horizontal ? subview.offsetLeft : subview.offsetTop;
             if (subviewOffset > scrollOffset) {
                 prevFirstVisibleOffsetRef.current = subviewOffset;
                 firstVisibleViewRef.current = subview;
                 break;
             }
         }
-    }, [getContentView, getScrollOffset, mvcpMinIndexForVisible, horizontal, restProps.inverted]);
+    }, [getContentView, getScrollOffset, mvcpMinIndexForVisible, horizontal]);
 
     const adjustForMaintainVisibleContentPosition = useCallback(
         (animated = true) => {

src/components/FlatList/FlatList/index.tsx

@@ -3,7 +3,7 @@ import {deepEqual} from 'fast-equals';
 import mapValues from 'lodash/mapValues';
 import React, {memo, use, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';
 import type {GestureResponderEvent, TextInput} from 'react-native';
-import {InteractionManager, Keyboard, Platform, View} from 'react-native';
+import {InteractionManager, Keyboard, View} from 'react-native';
 import type {OnyxCollection, OnyxEntry} from 'react-native-onyx';
 import type {ValueOf} from 'type-fest';
 import type {Emoji} from '@assets/emojis/types';
@@ -2056,7 +2056,7 @@ function PureReportActionItem({
                 withoutFocusOnSecondaryInteraction
                 accessibilityLabel={accessibilityLabel}
                 accessibilityHint={translate('accessibilityHints.chatMessage')}
-                accessibilityRole={Platform.OS !== CONST.PLATFORM.WEB ? CONST.ROLE.BUTTON : undefined}
+                accessibilityRole={CONST.ROLE.BUTTON}
                 sentryLabel={CONST.SENTRY_LABEL.REPORT.PURE_REPORT_ACTION_ITEM}
             >
                 <Hoverable