[NoQA] Chore: Bump eslint-config-expensify to 2.0.100

.claude/agents/code-inline-reviewer.md

@@ -198,39 +198,6 @@ memo(ReportActionItem, (prevProps, nextProps) =>
 )
 ```
 
----
-
-### [PERF-6] Use specific properties as hook dependencies
-
-- **Search patterns**: `useEffect`, `useMemo`, `useCallback` dependency arrays
-
-- **Condition**: In `useEffect`, `useMemo`, and `useCallback`, specify individual object properties as dependencies instead of passing entire objects.
-- **Reasoning**: Passing entire objects as dependencies causes hooks to re-execute whenever any property changes, even unrelated ones. Specifying individual properties creates more granular dependency tracking, reducing unnecessary hook executions and improving performance predictability.
-
-Good:
-
-```tsx
-const {amountColumnSize, dateColumnSize, taxAmountColumnSize} = useMemo(() => {
-    return {
-        amountColumnSize: transactionItem.isAmountColumnWide ? CONST.SEARCH.TABLE_COLUMN_SIZES.WIDE : CONST.SEARCH.TABLE_COLUMN_SIZES.NORMAL,
-        taxAmountColumnSize: transactionItem.isTaxAmountColumnWide ? CONST.SEARCH.TABLE_COLUMN_SIZES.WIDE : CONST.SEARCH.TABLE_COLUMN_SIZES.NORMAL,
-        dateColumnSize: transactionItem.shouldShowYear ? CONST.SEARCH.TABLE_COLUMN_SIZES.WIDE : CONST.SEARCH.TABLE_COLUMN_SIZES.NORMAL,
-    };
-}, [transactionItem.isAmountColumnWide, transactionItem.isTaxAmountColumnWide, transactionItem.shouldShowYear]);
-```
-
-Bad:
-
-```tsx
-const {amountColumnSize, dateColumnSize, taxAmountColumnSize} = useMemo(() => {
-    return {
-        amountColumnSize: transactionItem.isAmountColumnWide ? CONST.SEARCH.TABLE_COLUMN_SIZES.WIDE : CONST.SEARCH.TABLE_COLUMN_SIZES.NORMAL,
-        taxAmountColumnSize: transactionItem.isTaxAmountColumnWide ? CONST.SEARCH.TABLE_COLUMN_SIZES.WIDE : CONST.SEARCH.TABLE_COLUMN_SIZES.NORMAL,
-        dateColumnSize: transactionItem.shouldShowYear ? CONST.SEARCH.TABLE_COLUMN_SIZES.WIDE : CONST.SEARCH.TABLE_COLUMN_SIZES.NORMAL,
-    };
-}, [transactionItem]);
-```
-
 ## Instructions
 
 1. **First, get the list of changed files and their diffs:**

eslint.config.mjs

@@ -272,6 +272,17 @@ const config = defineConfig([
             'rulesdir/prefer-underscore-method': 'off',
             'rulesdir/prefer-import-module-contents': 'off',
             'rulesdir/no-beta-handler': 'error',
+            'rulesdir/prefer-narrow-hook-dependencies': [
+                'error',
+                {
+                    stableObjectPatterns: [
+                        // cSpell:ignore tyles
+                        '[Ss]tyles?$', // Excludes 'style', 'styles', 'themeStyles', etc.
+                        '^theme', // Excludes 'theme', 'themeStyles', 'themeIllustrations', etc.
+                        '[Ii]cons?$', // Excludes 'icon', 'icons', 'expensifyIcons', etc.
+                    ],
+                },
+            ],
 
             // React and React Native specific rules
             'react-native-a11y/has-accessibility-hint': ['off'],

package.json

@@ -311,7 +311,7 @@
     "electron-builder": "26.0.19",
     "eslint": "^9.36.0",
     "eslint-config-airbnb-typescript": "^18.0.0",
-    "eslint-config-expensify": "2.0.99",
+    "eslint-config-expensify": "2.0.100",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-jest": "^29.0.1",
     "eslint-plugin-jsdoc": "^60.7.0",

src/Expensify.tsx

@@ -133,7 +133,7 @@ function Expensify() {
     }, [isCheckingPublicRoom]);
 
     const isAuthenticated = useIsAuthenticated();
-    const autoAuthState = useMemo(() => session?.autoAuthState ?? '', [session]);
+    const autoAuthState = useMemo(() => session?.autoAuthState ?? '', [session?.autoAuthState]);
 
     const isSplashReadyToBeHidden = splashScreenState === CONST.BOOT_SPLASH_STATE.READY_TO_BE_HIDDEN;
     const isSplashVisible = splashScreenState === CONST.BOOT_SPLASH_STATE.VISIBLE;

src/components/AddPlaidBankAccount.tsx

@@ -103,7 +103,7 @@ function AddPlaidBankAccount({
      */
     const isAuthenticatedWithPlaid = useCallback(
         () => (!!receivedRedirectURI && !!plaidLinkOAuthToken) || !!plaidData?.bankAccounts?.length || !isEmptyObject(plaidData?.errors),
-        [plaidData, plaidLinkOAuthToken, receivedRedirectURI],
+        [plaidData?.bankAccounts?.length, plaidData?.errors, plaidLinkOAuthToken, receivedRedirectURI],
     );
 
     /**

src/components/ApproverSelectionList.tsx

@@ -138,7 +138,7 @@ function ApproverSelectionList({
                 contentFitImage="contain"
             />
         ),
-        [translate, listEmptyContentSubtitle, styles.textSupporting, styles.pb10, lazyIllustrations],
+        [translate, listEmptyContentSubtitle, styles.textSupporting, styles.pb10, lazyIllustrations.TurtleInShell],
     );
 
     return (

src/components/AvatarWithDisplayName.tsx

@@ -207,7 +207,7 @@ function AvatarWithDisplayName({
         }
         const parentReportAction = parentReportActions?.[report?.parentReportActionID];
         actorAccountID.current = parentReportAction?.actorAccountID ?? CONST.DEFAULT_NUMBER_ID;
-    }, [parentReportActions, report]);
+    }, [parentReportActions, report?.parentReportActionID]);
 
     const goToDetailsPage = useCallback(() => {
         navigateToDetailsPage(report, Navigation.getActiveRoute());

src/components/BlockingViews/ForceFullScreenView/index.tsx

@@ -18,7 +18,7 @@ function ForceFullScreenView({children, shouldForceFullScreen = false}: ForceFul
         addRouteKey(route.key);
 
         return () => removeRouteKey(route.key);
-    }, [addRouteKey, removeRouteKey, route, shouldForceFullScreen]);
+    }, [addRouteKey, removeRouteKey, route.key, shouldForceFullScreen]);
 
     if (shouldForceFullScreen) {
         return <View style={styles.forcedBlockingViewContainer}>{children}</View>;

src/components/DatePicker/CalendarPicker/index.tsx

@@ -165,7 +165,7 @@ function CalendarPicker({
         const newHeight = rowCount * CONST.CALENDAR_PICKER_DAY_HEIGHT;
 
         heightValue.set(withTiming(newHeight, {duration: 50}));
-    }, [calendarDaysMatrix, heightValue, isSmallScreenWidth]);
+    }, [calendarDaysMatrix?.length, heightValue, isSmallScreenWidth]);
 
     const animatedStyle = useAnimatedStyle(() => {
         return {

src/components/EmojiPicker/EmojiPickerMenu/useEmojiPickerMenu.ts

@@ -54,7 +54,7 @@ const useEmojiPickerMenu = () => {
 
             return [normalizedSearchTerm, emojisSuggestions] as const;
         },
-        [allEmojis, preferredLocale],
+        [allEmojis.length, preferredLocale],
     );
 
     return {

src/components/FullScreenBlockingViewContextProvider.tsx

@@ -40,7 +40,7 @@ function FullScreenBlockingViewContextProvider({children}: FullScreenBlockingVie
         });
     }, []);
 
-    const isBlockingViewVisible = useMemo(() => routeKeys.size > 0, [routeKeys]);
+    const isBlockingViewVisible = useMemo(() => routeKeys.size > 0, [routeKeys.size]);
 
     const contextValue = useMemo(
         () => ({

src/components/Image/index.tsx

@@ -101,7 +101,7 @@ function Image({
             return session.creationDate;
         }
         return undefined;
-    }, [session, isAuthTokenRequired, isAcceptedSession]);
+    }, [session?.creationDate, isAuthTokenRequired, isAcceptedSession]);
     useEffect(() => {
         if (!isAuthTokenRequired) {
             return;

src/components/LHNOptionsList/LHNOptionsList.tsx

@@ -9,7 +9,7 @@
 import type {OnyxEntry} from 'react-native-onyx';
 import BlockingView from '@components/BlockingViews/BlockingView';
 import Icon from '@components/Icon';
 import * as Expensicons from '@components/Icon/Expensicons';
 import LottieAnimations from '@components/LottieAnimations';
 import {ScrollOffsetContext} from '@components/ScrollOffsetContextProvider';
 import TextBlock from '@components/TextBlock';
@@ -411,7 +411,7 @@
                 reportsIDsFromUseReportsCount: data.length,
             });
         }
-    }, [data, shouldShowEmptyLHN, route, reports, reportActions, policy, personalDetails]);
+    }, [data.length, shouldShowEmptyLHN, route, reports, reportActions, policy, personalDetails]);
 
     return (
         <View style={[style ?? styles.flex1, shouldShowEmptyLHN ? styles.emptyLHNWrapper : undefined]}>

src/components/LocaleContextProvider.tsx

@@ -131,7 +131,7 @@ function LocaleContextProvider({children}: LocaleContextProviderProps) {
         setCurrentLocale(locale);
     }, [areTranslationsLoading]);
 
-    const selectedTimezone = useMemo(() => currentUserPersonalDetails?.timezone?.selected, [currentUserPersonalDetails]);
+    const selectedTimezone = useMemo(() => currentUserPersonalDetails?.timezone?.selected, [currentUserPersonalDetails?.timezone?.selected]);
 
     const collator = useMemo(() => new Intl.Collator(currentLocale, COLLATOR_OPTIONS), [currentLocale]);
 

src/components/MagicCodeInput.tsx

@@ -169,7 +169,7 @@ function MagicCodeInput({
 
     useEffect(() => {
         lastValue.current = input.length;
-    }, [input]);
+    }, [input.length]);
 
     useEffect(() => {
         // Note: there are circumstances where the value state isn't updated yet
@@ -184,7 +184,7 @@ function MagicCodeInput({
             return;
         }
         setWasSubmitted(false);
-    }, [value, maxLength]);
+    }, [value.length, maxLength]);
 
     const blurMagicCodeInput = () => {
         inputRef.current?.blur();

src/components/MapView/MapView.tsx

@@ -4,7 +4,7 @@
 import {memo, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState} from 'react';
 import {View} from 'react-native';
 import Button from '@components/Button';
 import * as Expensicons from '@components/Icon/Expensicons';
 import Text from '@components/Text';
 import useOnyx from '@hooks/useOnyx';
 import useTheme from '@hooks/useTheme';
@@ -211,7 +211,7 @@
             animationDuration: CONST.MAPBOX.ANIMATION_DURATION_ON_CENTER_ME,
             zoomLevel: CONST.MAPBOX.SINGLE_MARKER_ZOOM,
         });
-    }, [directionCoordinates, currentPosition, mapPadding, waypoints]);
+    }, [directionCoordinates, currentPosition?.longitude, currentPosition?.latitude, mapPadding, waypoints]);
 
     const centerCoordinate = useMemo(() => (currentPosition ? [currentPosition.longitude, currentPosition.latitude] : initialState?.location), [currentPosition, initialState?.location]);
 

src/components/MapView/MapViewImpl.website.tsx

@@ -10,7 +10,7 @@
 import Map, {Marker} from 'react-map-gl';
 import {View} from 'react-native';
 import Button from '@components/Button';
 import * as Expensicons from '@components/Icon/Expensicons';
 import {PressableWithoutFeedback} from '@components/Pressable';
 import Text from '@components/Text';
 import useOnyx from '@hooks/useOnyx';
@@ -135,7 +135,7 @@
             zoom: CONST.MAPBOX.DEFAULT_ZOOM,
             animate: shouldAnimate,
         });
-    }, [currentPosition, mapRef, prevUserPosition, shouldPanMapToCurrentPosition]);
+    }, [currentPosition, mapRef, prevUserPosition.longitude, prevUserPosition.latitude, shouldPanMapToCurrentPosition]);
 
     const resetBoundaries = useCallback(() => {
         if (!waypoints || waypoints.length === 0) {
@@ -224,7 +224,7 @@
             animate: true,
             duration: CONST.MAPBOX.ANIMATION_DURATION_ON_CENTER_ME,
         });
-    }, [directionCoordinates, currentPosition, mapRef, waypoints, mapPadding]);
+    }, [directionCoordinates, currentPosition?.longitude, currentPosition?.latitude, mapRef, waypoints, mapPadding]);
 
     const initialViewState: Partial<ViewState> | undefined = useMemo(() => {
         if (!interactive) {
@@ -245,7 +245,7 @@
             latitude: currentPosition?.latitude,
             zoom: initialState.zoom,
         };
-    }, [waypoints, directionCoordinates, interactive, currentPosition, initialState.zoom]);
+    }, [waypoints, directionCoordinates, interactive, currentPosition?.longitude, currentPosition?.latitude, initialState.zoom]);
 
     const distanceSymbolCoordinate = useMemo(() => {
         if (!directionCoordinates?.length || !waypoints?.length) {

src/components/MoneyRequestConfirmationList.tsx

@@ -454,7 +454,18 @@ function MoneyRequestConfirmationList({
 
         // If none of the above conditions are met, display the rate error
         setFormError(errorKey);
-    }, [isDistanceRequest, isPolicyExpenseChat, transactionID, mileageRate, customUnitRateID, policy, isMovingTransactionFromTrackExpense, setFormError, clearFormErrors]);
+    }, [
+        isDistanceRequest,
+        isPolicyExpenseChat,
+        transactionID,
+        mileageRate.rate,
+        mileageRate.unit,
+        customUnitRateID,
+        policy,
+        isMovingTransactionFromTrackExpense,
+        setFormError,
+        clearFormErrors,
+    ]);
 
     const routeError = Object.values(transaction?.errorFields?.route ?? {}).at(0);
     const isFirstUpdatedDistanceAmount = useRef(false);
@@ -566,7 +577,7 @@ function MoneyRequestConfirmationList({
             const amountInCents = convertToBackendAmount(value);
             setIndividualShare(transaction?.transactionID, accountID, amountInCents);
         },
-        [transaction],
+        [transaction?.transactionID],
     );
 
     useEffect(() => {

src/components/MoneyRequestReportView/MoneyRequestReportActionsList.tsx

@@ -193,7 +193,7 @@ function MoneyRequestReportActionsList({
                 policyID: policy?.id,
             });
         },
-        [report, policy],
+        [report, policy?.id],
     );
 
     const {
@@ -442,7 +442,7 @@ function MoneyRequestReportActionsList({
         previousLastIndex.current = lastActionIndex;
         reportActionSize.current = visibleReportActions.length;
         hasNewestReportActionRef.current = hasNewestReportAction;
-    }, [lastActionIndex, reportActions, reportScrollManager, hasNewestReportAction, visibleReportActions.length, setIsFloatingMessageCounterVisible]);
+    }, [lastActionIndex, reportActions.length, reportScrollManager, hasNewestReportAction, visibleReportActions.length, setIsFloatingMessageCounterVisible]);
 
     /**
      * Subscribe to read/unread events and update our unreadMarkerTime

src/components/Navigation/SearchSidebar.tsx

@@ -53,7 +53,7 @@ function SearchSidebar({state}: SearchSidebarProps) {
         }
 
         setLastSearchType(currentSearchResults.type);
-    }, [lastSearchType, queryJSON, setLastSearchType, currentSearchResults]);
+    }, [lastSearchType, queryJSON, setLastSearchType, currentSearchResults?.type]);
 
     const shouldShowLoadingState = route?.name === SCREENS.SEARCH.MONEY_REQUEST_REPORT ? false : !isOffline && !!currentSearchResults?.isLoading;
 

src/components/NumberWithSymbolForm.tsx

@@ -25,7 +25,7 @@
 import BigNumberPad from './BigNumberPad';
 import Button from './Button';
 import FormHelpMessage from './FormHelpMessage';
 import * as Expensicons from './Icon/Expensicons';
 import ScrollView from './ScrollView';
 import TextInput from './TextInput';
 import isTextInputFocused from './TextInput/BaseTextInput/isTextInputFocused';
@@ -303,7 +303,7 @@
             const newNumber = addLeadingZero(`${currentNumber.substring(0, selection.start)}${key}${currentNumber.substring(selection.end)}`);
             setNewNumber(newNumber);
         },
-        [currentNumber, selection, shouldUpdateSelection, setNewNumber],
+        [currentNumber, selection.start, selection.end, shouldUpdateSelection, setNewNumber],
     );
 
     /**

src/components/PopoverWithMeasuredContent/PopoverWithMeasuredContentBase.tsx

@@ -148,7 +148,7 @@ function PopoverWithMeasuredContentBase({
             ...horizontalConstraint,
             ...verticalConstraint,
         };
-    }, [anchorPosition, anchorAlignment, popoverWidth, popoverHeight]);
+    }, [anchorPosition.horizontal, anchorPosition.vertical, anchorAlignment.horizontal, anchorAlignment.vertical, popoverWidth, popoverHeight]);
 
     const positionCalculations = useMemo(() => {
         const horizontalShift = PopoverWithMeasuredContentUtils.computeHorizontalShift(adjustedAnchorPosition.left, popoverWidth, availableWidth);
@@ -182,7 +182,16 @@ function PopoverWithMeasuredContentBase({
         }
 
         return result;
-    }, [adjustedAnchorPosition, positionCalculations, anchorAlignment.vertical, windowHeight, popoverHeight, shouldMeasureAnchorPositionFromTop]);
+    }, [
+        adjustedAnchorPosition.left,
+        adjustedAnchorPosition.top,
+        positionCalculations.horizontalShift,
+        positionCalculations.verticalShift,
+        anchorAlignment.vertical,
+        windowHeight,
+        popoverHeight,
+        shouldMeasureAnchorPositionFromTop,
+    ]);
 
     return isContentMeasured ? (
         <Popover

src/components/ReportActionItem/MoneyReportView.tsx

@@ -5,7 +5,7 @@
 import type {OnyxEntry} from 'react-native-onyx';
 import ActivityIndicator from '@components/ActivityIndicator';
 import Icon from '@components/Icon';
 import * as Expensicons from '@components/Icon/Expensicons';
 import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import SpacerView from '@components/SpacerView';
@@ -91,7 +91,7 @@
     const sortedPolicyReportFields = useMemo<PolicyReportField[]>((): PolicyReportField[] => {
         const fields = getAvailableReportFields(report, Object.values(policy?.fieldList ?? {}));
         return fields.filter((field) => field.target === report?.type).sort(({orderWeight: firstOrderWeight}, {orderWeight: secondOrderWeight}) => firstOrderWeight - secondOrderWeight);
-    }, [policy, report]);
+    }, [policy?.fieldList, report]);
 
     const enabledReportFields = sortedPolicyReportFields.filter(
         (reportField) => !isReportFieldDisabled(report, reportField, policy) || reportField.type === CONST.REPORT_FIELD_TYPES.FORMULA,

src/components/ReportActionItem/MoneyRequestView.tsx

@@ -354,7 +354,7 @@ function MoneyRequestView({
             }
             updateMoneyRequestReimbursable(transaction.transactionID, report?.reportID, newReimbursable, policy, policyTagList, policyCategories);
         },
-        [transaction, report, policy, policyTagList, policyCategories],
+        [transaction, report?.reportID, policy, policyTagList, policyCategories],
     );
 
     if (isCardTransaction) {

src/components/Search/FilterDropdowns/SingleSelectPopup.tsx

@@ -77,7 +77,7 @@ function SingleSelectPopup<T extends string>({label, value, items, closeOverlay,
             })),
             noResultsFound: false,
         };
-    }, [isSearchable, items, value, selectedItem, debouncedSearchTerm]);
+    }, [isSearchable, items, value, selectedItem?.value, debouncedSearchTerm]);
 
     const updateSelectedItem = useCallback(
         (item: ListItem) => {

src/components/Search/SearchPageHeader/SearchFiltersBar.tsx

@@ -171,7 +171,7 @@ function SearchFiltersBar({
         return [options, value];
     }, [allPolicies, email, unsafeType]);
 
-    const isExpenseReportType = useMemo(() => type?.value === CONST.SEARCH.DATA_TYPES.EXPENSE_REPORT, [type]);
+    const isExpenseReportType = useMemo(() => type?.value === CONST.SEARCH.DATA_TYPES.EXPENSE_REPORT, [type?.value]);
 
     const selectedItemsCount = useMemo(() => {
         if (!selectedTransactions) {
@@ -224,7 +224,7 @@ function SearchFiltersBar({
         const options = getHasOptions(type?.value ?? CONST.SEARCH.DATA_TYPES.EXPENSE);
         const value = hasFilterValues ? options.filter((option) => hasFilterValues.includes(option.value)) : [];
         return [options, value];
-    }, [flatFilters, type]);
+    }, [flatFilters, type?.value]);
 
     const [isOptions, is] = useMemo(() => {
         const isFilterValues = flatFilters.find((filter) => filter.key === CONST.SEARCH.SYNTAX_FILTER_KEYS.IS)?.filters?.map((filter) => filter.value);
@@ -653,10 +653,12 @@ function SearchFiltersBar({
 
         return filterList;
     }, [
-        type,
-        groupBy,
-        groupCurrency,
-        withdrawalType,
+        type?.value,
+        type?.text,
+        groupBy?.value,
+        groupBy?.text,
+        groupCurrency?.value,
+        withdrawalType?.text,
         displayDate,
         displayPosted,
         displayWithdrawn,