Add ignore react-compiler comments after upgrading eslint rule

Expensify · Oct 22, 2024 · 8d3f1db · 8d3f1db
1 parent 770a7fe
commit 8d3f1db
Show file tree

Hide file tree

Showing 64 changed files with 150,905 additions and 8 deletions.
diff --git a/result.json b/result.json
diff --git a/script.py b/script.py
@@ -0,0 +1,34 @@
+import json
+import re
+
+# Load ESLint result 
+with open('result.json', 'r') as f:
+    eslint_result = json.load(f)
+
+files = {}
+# Loop over entries in eslint result
+for entry in eslint_result:
+    file_path = entry['filePath']
+
+    # If file is not already processed, load its content
+    if file_path not in files:
+        with open(file_path, 'r') as f:
+            file_content = f.read().split('\n')
+            files[file_path] = file_content
+
+    for message in entry['messages']:
+        line_number = message['line']
+        rule_id = message['ruleId']
+
+        # Prepare eslint disable line
+        eslint_line = f'// eslint-disable-next-line {rule_id}'
+
+        # Add eslint line at appropriate position
+        files[file_path].insert(line_number - 1, eslint_line)
+
+# Overwrite files
+for file_path, content in files.items():
+    new_content = '\n'.join(content)
+
+    with open(file_path, 'w') as f:
+        f.write(new_content)
diff --git a/src/components/AttachmentPicker/index.native.tsx b/src/components/AttachmentPicker/index.native.tsx
@@ -417,6 +417,7 @@ function AttachmentPicker({
                 }}
                 isVisible={isVisible}
                 anchorRef={popoverRef}
+                // eslint-disable-next-line react-compiler/react-compiler
                 onModalHide={onModalHide.current}
             >
                 <View style={!shouldUseNarrowLayout && styles.createMenuContainer}>
@@ -431,6 +432,7 @@ function AttachmentPicker({
                     ))}
                 </View>
             </Popover>
+            {/* eslint-disable-next-line react-compiler/react-compiler */}
             {renderChildren()}
         </>
     );

diff --git a/src/components/AttachmentPicker/index.tsx b/src/components/AttachmentPicker/index.tsx
@@ -97,7 +97,10 @@ function AttachmentPicker({children, type = CONST.ATTACHMENT_PICKER_TYPE.FILE, a
                     );
                 }}
                 accept={acceptedFileTypes ? getAcceptableFileTypesFromAList(acceptedFileTypes) : getAcceptableFileTypes(type)}
+                // eslint-disable-next-line react/jsx-no-comment-textnodes
             />
+            // eslint-disable-next-line react-compiler/react-compiler
+            {/* eslint-disable-next-line react-compiler/react-compiler */}
             {children({
                 openPicker: ({onPicked: newOnPicked, onCanceled: newOnCanceled = () => {}}) => {
                     onPicked.current = newOnPicked;

diff --git a/src/components/Attachments/AttachmentCarousel/index.tsx b/src/components/Attachments/AttachmentCarousel/index.tsx
@@ -255,6 +255,7 @@ function AttachmentCarousel({report, source, onNavigate, setDownloadButtonVisibi
 
                     scrollTo(scrollRef, newIndex * cellWidth, 0, true);
                 })
+                // eslint-disable-next-line react-compiler/react-compiler
                 .withRef(pagerRef as MutableRefObject<GestureType | undefined>),
         [attachments.length, canUseTouchScreen, cellWidth, page, scale, scrollRef],
     );

diff --git a/src/components/AvatarCropModal/AvatarCropModal.tsx b/src/components/AvatarCropModal/AvatarCropModal.tsx
@@ -336,6 +336,7 @@ function AvatarCropModal({imageUri = '', imageName = '', imageType = '', onClose
         }
         const newSliderValue = clamp(locationX, [0, sliderContainerSize]);
         const newScale = newScaleValue(newSliderValue, sliderContainerSize);
+        // eslint-disable-next-line react-compiler/react-compiler
         translateSlider.value = newSliderValue;
         const differential = newScale / scale.value;
         scale.value = newScale;

diff --git a/src/components/ButtonWithDropdownMenu/index.tsx b/src/components/ButtonWithDropdownMenu/index.tsx
@@ -53,6 +53,7 @@ function ButtonWithDropdownMenu<IValueType>({
     const [popoverAnchorPosition, setPopoverAnchorPosition] = useState<AnchorPosition | null>(null);
     const {windowWidth, windowHeight} = useWindowDimensions();
     const dropdownAnchor = useRef<View | null>(null);
+    // eslint-disable-next-line react-compiler/react-compiler
     const dropdownButtonRef = isSplitButton ? buttonRef : mergeRefs(buttonRef, dropdownAnchor);
     const selectedItem = options.at(selectedItemIndex) ?? options.at(0);
     const innerStyleDropButton = StyleUtils.getDropDownButtonHeight(buttonSize);
@@ -199,7 +200,9 @@ function ButtonWithDropdownMenu<IValueType>({
                     onModalShow={onOptionsMenuShow}
                     onItemSelected={() => setIsMenuVisible(false)}
                     anchorPosition={shouldUseStyleUtilityForAnchorPosition ? styles.popoverButtonDropdownMenuOffset(windowWidth) : popoverAnchorPosition}
+                    // eslint-disable-next-line react-compiler/react-compiler
                     shouldShowSelectedItemCheck={shouldShowSelectedItemCheck}
+                    // eslint-disable-next-line react-compiler/react-compiler
                     anchorRef={nullCheckRef(dropdownAnchor)}
                     withoutOverlay
                     anchorAlignment={anchorAlignment}

diff --git a/src/components/DisplayNames/DisplayNamesWithTooltip.tsx b/src/components/DisplayNames/DisplayNamesWithTooltip.tsx
@@ -15,6 +15,7 @@ function DisplayNamesWithToolTip({shouldUseFullTitle, fullTitle, displayNamesWit
     const styles = useThemeStyles();
     const containerRef = useRef<HTMLElementWithText>(null);
     const childRefs = useRef<HTMLElementWithText[]>([]);
+    // eslint-disable-next-line react-compiler/react-compiler
     const isEllipsisActive = !!containerRef.current?.offsetWidth && !!containerRef.current?.scrollWidth && containerRef.current.offsetWidth < containerRef.current.scrollWidth;
 
     /**

diff --git a/src/components/DragAndDrop/NoDropZone/index.tsx b/src/components/DragAndDrop/NoDropZone/index.tsx
@@ -11,12 +11,14 @@ function NoDropZone({children}: NoDropZoneProps) {
     const noDropZone = useRef<View | HTMLDivElement>(null);
 
     useDragAndDrop({
+        // eslint-disable-next-line react-compiler/react-compiler
         dropZone: htmlDivElementRef(noDropZone),
         shouldAllowDrop: false,
     });
 
     return (
         <View
+            // eslint-disable-next-line react-compiler/react-compiler
             ref={viewRef(noDropZone)}
             style={[styles.fullScreen]}
         >

diff --git a/src/components/DragAndDrop/Provider/index.tsx b/src/components/DragAndDrop/Provider/index.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable react-compiler/react-compiler */
 import {PortalHost} from '@gorhom/portal';
 import {Str} from 'expensify-common';
 import React, {useCallback, useEffect, useMemo, useRef} from 'react';

diff --git a/src/components/DraggableList/useDraggableInPortal.ts b/src/components/DraggableList/useDraggableInPortal.ts
@@ -7,6 +7,7 @@ type DraggableInPortal = {
 };
 
 export default function useDraggableInPortal({shouldUsePortal}: DraggableInPortal): (render: DraggableChildrenFn) => DraggableChildrenFn {
+    // eslint-disable-next-line react-compiler/react-compiler
     const element = useRef<HTMLDivElement>(document.createElement('div')).current;
 
     useEffect(() => {

diff --git a/src/components/EmojiPicker/EmojiPicker.tsx b/src/components/EmojiPicker/EmojiPicker.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable react-compiler/react-compiler */
 import React, {forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState} from 'react';
 import type {ForwardedRef, RefObject} from 'react';
 import {Dimensions, View} from 'react-native';
@@ -117,7 +118,7 @@ function EmojiPicker({viewportOffsetTop}: EmojiPickerProps, ref: ForwardedRef<Em
             if (currOnModalHide) {
                 currOnModalHide(!!isNavigating);
             }
-            // eslint-disable-next-line react-compiler/react-compiler
+
             emojiPopoverAnchorRef.current = null;
         };
         setIsEmojiPickerVisible(false);

diff --git a/src/components/FilePicker/index.native.tsx b/src/components/FilePicker/index.native.tsx
@@ -155,6 +155,7 @@ function FilePicker({children}: FilePickerProps) {
             openPicker: ({onPicked, onCanceled: newOnCanceled}) => open(onPicked, newOnCanceled),
         });
 
+    // eslint-disable-next-line react-compiler/react-compiler
     return <>{renderChildren()}</>;
 }
 

diff --git a/src/components/FilePicker/index.tsx b/src/components/FilePicker/index.tsx
@@ -65,6 +65,7 @@ function FilePicker({children, acceptableFileTypes = ''}: FilePickerProps): Reac
                 }}
                 accept={acceptableFileTypes}
             />
+            {/* eslint-disable-next-line react-compiler/react-compiler */}
             {children({
                 openPicker: ({onPicked: newOnPicked, onCanceled: newOnCanceled = () => {}}) => {
                     onPicked.current = newOnPicked;

diff --git a/src/components/FlatList/index.tsx b/src/components/FlatList/index.tsx
@@ -50,6 +50,7 @@ function MVCPFlatList<TItem>({maintainVisibleContentPosition, horizontal = false
     const lastScrollOffsetRef = useRef(0);
     const isListRenderedRef = useRef(false);
     const mvcpAutoscrollToTopThresholdRef = useRef(mvcpAutoscrollToTopThreshold);
+    // eslint-disable-next-line react-compiler/react-compiler
     mvcpAutoscrollToTopThresholdRef.current = mvcpAutoscrollToTopThreshold;
 
     const getScrollOffset = useCallback((): number => {

diff --git a/src/components/Form/InputWrapper.tsx b/src/components/Form/InputWrapper.tsx
@@ -76,6 +76,7 @@ function InputWrapper<TInput extends ValidInputs, TValue extends ValueTypeKey>(p
     const {registerInput} = useContext(FormContext);
 
     const {shouldSetTouchedOnBlurOnly, blurOnSubmit, shouldSubmitForm} = computeComponentSpecificRegistrationParams(props as InputComponentBaseProps);
+    // eslint-disable-next-line react-compiler/react-compiler
     const {key, ...registerInputProps} = registerInput(inputID, shouldSubmitForm, {ref, valueType, ...rest, shouldSetTouchedOnBlurOnly, blurOnSubmit});
 
     return (

diff --git a/src/components/FormElement/index.tsx b/src/components/FormElement/index.tsx
@@ -13,6 +13,7 @@ const preventFormDefault = (event: SubmitEvent) => {
 
 function FormElement(props: ViewProps, outerRef: ForwardedRef<View>) {
     const formRef = useRef<HTMLFormElement & View>(null);
+    // eslint-disable-next-line react-compiler/react-compiler
     const mergedRef = mergeRefs(formRef, outerRef);
 
     useEffect(() => {

diff --git a/src/components/Hoverable/ActiveHoverable.tsx b/src/components/Hoverable/ActiveHoverable.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable react-compiler/react-compiler */
 import type {Ref} from 'react';
 import {cloneElement, forwardRef, useCallback, useEffect, useMemo, useRef, useState} from 'react';
 import {DeviceEventEmitter} from 'react-native';

diff --git a/src/components/Hoverable/index.tsx b/src/components/Hoverable/index.tsx
@@ -16,6 +16,7 @@ function Hoverable({isDisabled, ...props}: HoverableProps, ref: Ref<HTMLElement>
     // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
     if (isDisabled || !hasHoverSupport()) {
         const child = getReturnValue(props.children, false);
+        // eslint-disable-next-line react-compiler/react-compiler
         return cloneElement(child, {ref: mergeRefs(ref, child.ref)});
     }
 

diff --git a/src/components/ImageView/index.tsx b/src/components/ImageView/index.tsx
@@ -210,6 +210,7 @@ function ImageView({isAuthTokenRequired = false, url, fileName, onError}: ImageV
     }
     return (
         <View
+            // eslint-disable-next-line react-compiler/react-compiler
             ref={viewRef(scrollableRef)}
             onLayout={onContainerLayoutChanged}
             style={[styles.imageViewContainer, styles.overflowAuto, styles.pRelative]}

diff --git a/src/components/ImportSpreadsheet.tsx b/src/components/ImportSpreadsheet.tsx
@@ -121,7 +121,7 @@ function ImportSpreedsheet({backTo, goTo}: ImportSpreedsheetProps) {
             </View>
             <View
                 style={[styles.uploadFileViewTextContainer, styles.userSelectNone]}
-                // eslint-disable-next-line react/jsx-props-no-spreading
+                // eslint-disable-next-line react-compiler/react-compiler, react/jsx-props-no-spreading
                 {...panResponder.panHandlers}
             >
                 <Text style={[styles.textFileUpload, styles.mb1]}>{translate('spreadsheet.upload')}</Text>

diff --git a/src/components/KYCWall/BaseKYCWall.tsx b/src/components/KYCWall/BaseKYCWall.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable react-compiler/react-compiler */
 import React, {useCallback, useEffect, useRef, useState} from 'react';
 import {Dimensions} from 'react-native';
 import type {EmitterSubscription, GestureResponderEvent, View} from 'react-native';
@@ -262,6 +263,7 @@ function KYCWall({
                     selectPaymentMethod(item);
                 }}
                 shouldShowPersonalBankAccountOption={shouldShowPersonalBankAccountOption}
+                // eslint-disable-next-line react/jsx-no-comment-textnodes
             />
             {children(continueAction, viewRef(anchorRef))}
         </>

diff --git a/src/components/LHNOptionsList/OptionRowLHNData.tsx b/src/components/LHNOptionsList/OptionRowLHNData.tsx
@@ -54,10 +54,13 @@ function OptionRowLHNData({
             transactionViolations,
             invoiceReceiverPolicy,
         });
+        // eslint-disable-next-line react-compiler/react-compiler
         if (deepEqual(item, optionItemRef.current)) {
+            // eslint-disable-next-line react-compiler/react-compiler
             return optionItemRef.current;
         }
 
+        // eslint-disable-next-line react-compiler/react-compiler
         optionItemRef.current = item;
 
         return item;

diff --git a/src/components/MagicCodeInput.tsx b/src/components/MagicCodeInput.tsx
@@ -212,6 +212,7 @@ function MagicCodeInput(
      */
     const tapGesture = Gesture.Tap()
         .runOnJS(true)
+        // eslint-disable-next-line react-compiler/react-compiler
         .onBegin((event) => {
             const index = Math.floor(event.x / (inputWidth.current / maxLength));
             shouldFocusLast.current = false;

diff --git a/src/components/OptionListContextProvider.tsx b/src/components/OptionListContextProvider.tsx
@@ -145,6 +145,7 @@ function OptionsListContextProvider({reports, children}: OptionsListProviderProp
     }, [loadOptions]);
 
     return (
+        // eslint-disable-next-line react-compiler/react-compiler
         <OptionsListContext.Provider value={useMemo(() => ({options, initializeOptions, areOptionsInitialized: areOptionsInitialized.current}), [options, initializeOptions])}>
             {children}
         </OptionsListContext.Provider>

diff --git a/src/components/PopoverProvider/index.tsx b/src/components/PopoverProvider/index.tsx
@@ -117,6 +117,7 @@ function PopoverContextProvider(props: PopoverContextProps) {
         () => ({
             onOpen,
             close: closePopover,
+            // eslint-disable-next-line react-compiler/react-compiler
             popover: activePopoverRef.current,
             isOpen,
         }),

diff --git a/src/components/Pressable/GenericPressable/BaseGenericPressable.tsx b/src/components/Pressable/GenericPressable/BaseGenericPressable.tsx
@@ -148,6 +148,7 @@ function GenericPressable(
             onLayout={shouldUseAutoHitSlop ? onLayout : undefined}
             ref={ref as ForwardedRef<View>}
             disabled={fullDisabled}
+            // eslint-disable-next-line react-compiler/react-compiler
             onPress={!isDisabled ? singleExecution(onPressHandler) : undefined}
             onLongPress={!isDisabled && onLongPress ? onLongPressHandler : undefined}
             onKeyDown={!isDisabled ? onKeyDown : undefined}

diff --git a/src/components/Reactions/ReportActionItemEmojiReactions.tsx b/src/components/Reactions/ReportActionItemEmojiReactions.tsx
@@ -104,6 +104,7 @@ function ReportActionItemEmojiReactions({
             if (reactionCount === 0) {
                 return null;
             }
+            // eslint-disable-next-line react-compiler/react-compiler
             totalReactionCount += reactionCount;
 
             const onPress = () => {

diff --git a/src/components/ScreenWrapper.tsx b/src/components/ScreenWrapper.tsx
@@ -159,6 +159,7 @@ function ScreenWrapper(
 
     const isKeyboardShownRef = useRef<boolean>(false);
 
+    // eslint-disable-next-line react-compiler/react-compiler
     isKeyboardShownRef.current = keyboardState?.isKeyboardShown ?? false;
 
     const route = useRoute();

diff --git a/src/components/Search/index.tsx b/src/components/Search/index.tsx
@@ -167,10 +167,13 @@ function Search({queryJSON, onSearchListScroll, contentContainerStyle}: SearchPr
     });
 
     // save last non-empty search results to avoid ugly flash of loading screen when hash changes and onyx returns empty data
+    // eslint-disable-next-line react-compiler/react-compiler
     if (currentSearchResults?.data && currentSearchResults !== lastSearchResultsRef.current) {
+        // eslint-disable-next-line react-compiler/react-compiler
         lastSearchResultsRef.current = currentSearchResults;
     }
 
+    // eslint-disable-next-line react-compiler/react-compiler
     const searchResults = currentSearchResults?.data ? currentSearchResults : lastSearchResultsRef.current;
 
     const {newSearchResultKey, handleSelectionListScroll} = useSearchHighlightAndScroll({

diff --git a/src/components/SwipeableView/index.native.tsx b/src/components/SwipeableView/index.native.tsx
@@ -7,6 +7,7 @@ function SwipeableView({children, onSwipeDown}: SwipeableViewProps) {
     const minimumPixelDistance = CONST.COMPOSER_MAX_HEIGHT;
     const oldYRef = useRef(0);
     const panResponder = useRef(
+        // eslint-disable-next-line react-compiler/react-compiler
         PanResponder.create({
             // The PanResponder gets focus only when the y-axis movement is over minimumPixelDistance & swipe direction is downwards
             onMoveShouldSetPanResponderCapture: (_event, gestureState) => {
@@ -22,10 +23,8 @@ function SwipeableView({children, onSwipeDown}: SwipeableViewProps) {
         }),
     ).current;
 
-    return (
-        // eslint-disable-next-line react/jsx-props-no-spreading
-        <View {...panResponder.panHandlers}>{children}</View>
-    );
+    // eslint-disable-next-line react/jsx-props-no-spreading, react-compiler/react-compiler
+    return <View {...panResponder.panHandlers}>{children}</View>;
 }
 
 SwipeableView.displayName = 'SwipeableView';

diff --git a/src/components/Switch.tsx b/src/components/Switch.tsx
@@ -69,6 +69,7 @@ function Switch({isOn, onToggle, accessibilityLabel, disabled, showLockIcon, dis
             hoverDimmingValue={1}
             pressDimmingValue={0.8}
         >
+            {/* eslint-disable-next-line react-compiler/react-compiler */}
             <Animated.View style={[styles.switchThumb, styles.switchThumbTransformation(offsetX.current)]}>
                 {(!!disabled || !!showLockIcon) && (
                     <Icon

diff --git a/src/components/TextInput/TextInputLabel/index.tsx b/src/components/TextInput/TextInputLabel/index.tsx
@@ -21,6 +21,7 @@ function TextInputLabel({for: inputId = '', label, labelTranslateY, labelScale}:
 
     return (
         <Animated.Text
+            // eslint-disable-next-line react-compiler/react-compiler
             ref={textRef(labelRef)}
             role={CONST.ROLE.PRESENTATION}
             style={[styles.textInputLabel, styles.textInputLabelTransformation(labelTranslateY, labelScale), styles.pointerEventsNone]}

diff --git a/src/components/Tooltip/BaseGenericTooltip/index.native.tsx b/src/components/Tooltip/BaseGenericTooltip/index.native.tsx
@@ -50,6 +50,7 @@ function BaseGenericTooltip({
     const {animationStyle, rootWrapperStyle, textStyle, pointerWrapperStyle, pointerStyle} = useMemo(
         () =>
             StyleUtils.getTooltipStyles({
+                // eslint-disable-next-line react-compiler/react-compiler
                 tooltip: rootWrapper.current,
                 currentSize: animation,
                 windowWidth,

diff --git a/src/components/Tooltip/BaseGenericTooltip/index.tsx b/src/components/Tooltip/BaseGenericTooltip/index.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable react-compiler/react-compiler */
 import React, {useLayoutEffect, useMemo, useRef, useState} from 'react';
 import ReactDOM from 'react-dom';
 import {Animated, View} from 'react-native';

diff --git a/src/components/Tooltip/GenericTooltip.tsx b/src/components/Tooltip/GenericTooltip.tsx
@@ -157,13 +157,15 @@ function GenericTooltip({
 
     // Skip the tooltip and return the children if the text is empty, we don't have a render function.
     if (StringUtils.isEmptyString(text) && renderTooltipContent == null) {
+        // eslint-disable-next-line react-compiler/react-compiler
         return children({isVisible, showTooltip, hideTooltip, updateTargetBounds});
     }
 
     return (
         <>
             {isRendered && (
                 <BaseGenericTooltip
+                    // eslint-disable-next-line react-compiler/react-compiler
                     animation={animation.current}
                     windowWidth={windowWidth}
                     xOffset={xOffset}
@@ -186,7 +188,7 @@ function GenericTooltip({
                     onHideTooltip={onPressOverlay}
                 />
             )}
-
+            {/* eslint-disable-next-line react-compiler/react-compiler */}
             {children({isVisible, showTooltip, hideTooltip, updateTargetBounds})}
         </>
     );

diff --git a/src/components/Tooltip/PopoverAnchorTooltip.tsx b/src/components/Tooltip/PopoverAnchorTooltip.tsx
@@ -9,7 +9,7 @@ function PopoverAnchorTooltip({shouldRender = true, children, ...props}: Tooltip
     const tooltipRef = useRef<BoundsObserver>(null);
 
     const isPopoverRelatedToTooltipOpen = useMemo(() => {
-        // eslint-disable-next-line @typescript-eslint/dot-notation
+        // eslint-disable-next-line @typescript-eslint/dot-notation, react-compiler/react-compiler
         const tooltipNode = (tooltipRef.current?.['_childNode'] as Node | undefined) ?? null;
 
         if (

diff --git a/src/components/VideoPlayerContexts/VideoPopoverMenuContext.tsx b/src/components/VideoPlayerContexts/VideoPopoverMenuContext.tsx
@@ -43,6 +43,7 @@ function VideoPopoverMenuContextProvider({children}: ChildrenProps) {
         const items: PopoverMenuItem[] = [];
 
         if (!isOffline && !isLocalFile) {
+            // eslint-disable-next-line react-compiler/react-compiler
             items.push({
                 icon: Expensicons.Download,
                 text: translate('common.download'),
-Original file line number
+Diff line change
@@ Expand Up / @@ -155,6 +155,7 @@ function FilePicker({children}: FilePickerProps) { @@
                 openPicker: ({onPicked, onCanceled: newOnCanceled}) => open(onPicked, newOnCanceled),
             });
+        // eslint-disable-next-line react-compiler/react-compiler
         return <>{renderChildren()}</>;
     }
@@ Expand Down @@