From de771c23fc81b7306b61f350a96c3f73af507a96 Mon Sep 17 00:00:00 2001
From: Marin Atanasov <8436925+tyxla@users.noreply.github.com>
Date: Tue, 22 Oct 2024 15:57:55 +0300
Subject: [PATCH 1/4] ESLint: Stop disabling react-hooks/exhaustive-deps rule

---
 .eslintrc.js                                   | 12 ------------
 .../autocomplete/autocompleter-ui.native.js    |  6 ------
 .../src/autocomplete/autocompleter-ui.tsx      |  6 +-----
 packages/components/src/autocomplete/index.tsx |  3 ---
 .../src/color-palette/index.native.js          |  3 ---
 .../src/color-picker/index.native.js           |  5 -----
 .../components/src/date-time/date/index.tsx    |  1 -
 .../components/src/form-token-field/index.tsx  |  3 ---
 .../navigation-screen.native.js                |  5 -----
 .../bottom-sheet/sub-sheet/index.native.js     |  3 ---
 .../src/mobile/color-settings/index.native.js  |  3 ---
 .../color-settings/picker-screen.native.js     |  3 ---
 .../src/mobile/image/index.native.js           |  3 ---
 .../mobile/keyboard-avoiding-view/index.ios.js |  3 ---
 .../link-picker/link-picker-results.native.js  |  6 ------
 .../link-picker/link-picker-screen.native.js   |  3 ---
 .../src/mobile/link-settings/index.native.js   | 18 ------------------
 .../link-settings-screen.native.js             |  3 ---
 .../mobile/segmented-control/index.native.js   |  6 ------
 .../use-unit-converter-to-mobile.native.js     |  6 ------
 packages/components/src/navigation/index.tsx   |  1 -
 .../item/use-navigation-tree-item.tsx          |  1 -
 .../src/navigation/menu/menu-title-search.tsx  |  1 -
 .../menu/use-navigation-tree-menu.tsx          |  1 -
 .../components/src/sandbox/index.native.js     |  3 ---
 packages/components/src/sandbox/index.tsx      |  9 ---------
 .../src/search-control/index.native.js         |  3 ---
 .../src/slot-fill/bubbles-virtually/slot.tsx   |  3 +--
 packages/components/src/slot-fill/fill.ts      |  9 +++------
 .../src/tools-panel/tools-panel-item/hook.ts   |  2 --
 .../components/src/tooltip/index.native.js     | 15 ---------------
 .../src/unit-control/index.native.js           |  8 --------
 packages/components/src/utils/element-rect.ts  |  1 -
 .../src/utils/hooks/use-update-effect.js       |  2 --
 34 files changed, 5 insertions(+), 155 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index 211ddd9bc3586..dfe779b468352 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -356,18 +356,6 @@ module.exports = {
 				],
 			},
 		},
-		{
-			files: [
-				// Components package.
-				'packages/components/src/**/*.[tj]s?(x)',
-				// Navigation block.
-				'packages/block-library/src/navigation/**/*.[tj]s?(x)',
-			],
-			excludedFiles: [ ...developmentFiles ],
-			rules: {
-				'react-hooks/exhaustive-deps': 'error',
-			},
-		},
 		{
 			files: [ 'packages/jest*/**/*.js', '**/test/**/*.js' ],
 			excludedFiles: [ 'test/e2e/**/*.js', 'test/performance/**/*.js' ],
diff --git a/packages/components/src/autocomplete/autocompleter-ui.native.js b/packages/components/src/autocomplete/autocompleter-ui.native.js
index 1400c78e518d7..aa979f6b068ea 100644
--- a/packages/components/src/autocomplete/autocompleter-ui.native.js
+++ b/packages/components/src/autocomplete/autocompleter-ui.native.js
@@ -69,9 +69,6 @@ export function getAutoCompleterUI( autocompleter ) {
 			} else if ( isVisible && text.length === 0 ) {
 				startAnimation( false );
 			}
-			// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.
-			// See https://github.com/WordPress/gutenberg/pull/41820
-			// eslint-disable-next-line react-hooks/exhaustive-deps
 		}, [ items, isVisible, text ] );
 
 		const activeItemStyles = usePreferredColorSchemeStyle(
@@ -112,9 +109,6 @@ export function getAutoCompleterUI( autocompleter ) {
 					}
 				} );
 			},
-			// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.
-			// See https://github.com/WordPress/gutenberg/pull/41820
-			// eslint-disable-next-line react-hooks/exhaustive-deps
 			[ isVisible ]
 		);
 
diff --git a/packages/components/src/autocomplete/autocompleter-ui.tsx b/packages/components/src/autocomplete/autocompleter-ui.tsx
index c6c1b94deb577..276b13bf26c34 100644
--- a/packages/components/src/autocomplete/autocompleter-ui.tsx
+++ b/packages/components/src/autocomplete/autocompleter-ui.tsx
@@ -165,9 +165,6 @@ export function getAutoCompleterUI( autocompleter: WPCompleter ) {
 		useLayoutEffect( () => {
 			onChangeOptions( items );
 			announce( items );
-			// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.
-			// See https://github.com/WordPress/gutenberg/pull/41820
-			// eslint-disable-next-line react-hooks/exhaustive-deps
 		}, [ items ] );
 
 		if ( items.length === 0 ) {
@@ -235,8 +232,7 @@ function useOnClickOutside(
 			document.removeEventListener( 'mousedown', listener );
 			document.removeEventListener( 'touchstart', listener );
 		};
-		// Disable reason: `ref` is a ref object and should not be included in a
+		// `ref` is a ref object and should not be included in a
 		// hook's dependency list.
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ handler ] );
 }
diff --git a/packages/components/src/autocomplete/index.tsx b/packages/components/src/autocomplete/index.tsx
index ad930d3affdd1..dd2dd0d2fe149 100644
--- a/packages/components/src/autocomplete/index.tsx
+++ b/packages/components/src/autocomplete/index.tsx
@@ -380,9 +380,6 @@ export function useAutocomplete( {
 				: AutocompleterUI
 		);
 		setFilterValue( query === null ? '' : query );
-		// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.
-		// See https://github.com/WordPress/gutenberg/pull/41820
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ textContent ] );
 
 	const { key: selectedKey = '' } = filteredOptions[ selectedIndex ] || {};
diff --git a/packages/components/src/color-palette/index.native.js b/packages/components/src/color-palette/index.native.js
index bb45de6d66e88..a34d05d294fd8 100644
--- a/packages/components/src/color-palette/index.native.js
+++ b/packages/components/src/color-palette/index.native.js
@@ -115,9 +115,6 @@ function ColorPalette( {
 				scrollViewRef.current.scrollTo( { x: 0, y: 0 } );
 			}
 		}
-		// Temporarily disabling exhuastive-deps until the component can be refactored and updated safely.
-		// Please see https://github.com/WordPress/gutenberg/pull/41253 for discussion and details.
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ currentSegment ] );
 
 	function isSelectedCustom() {
diff --git a/packages/components/src/color-picker/index.native.js b/packages/components/src/color-picker/index.native.js
index 46059a58520ba..8c0b9b6c9e772 100644
--- a/packages/components/src/color-picker/index.native.js
+++ b/packages/components/src/color-picker/index.native.js
@@ -107,11 +107,6 @@ function ColorPicker( {
 		if ( onHandleHardwareButtonPress ) {
 			onHandleHardwareButtonPress( onButtonPress );
 		}
-		// TODO: Revisit this to discover if there's a good reason for omitting
-		// the hook’s dependencies and running it a single time. Ideally there
-		// may be a way to refactor and obviate the disabled lint rule. If not,
-		// this comment should be replaced by one that explains the reasoning.
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [] );
 
 	function onButtonPress( action ) {
diff --git a/packages/components/src/date-time/date/index.tsx b/packages/components/src/date-time/date/index.tsx
index 5a565ee38cec5..ca093f9d70847 100644
--- a/packages/components/src/date-time/date/index.tsx
+++ b/packages/components/src/date-time/date/index.tsx
@@ -302,7 +302,6 @@ function Day( {
 		}
 		// isFocusAllowed is not a dep as there is no point calling focus() on
 		// an already focused element.
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ isFocusable ] );
 
 	return (
diff --git a/packages/components/src/form-token-field/index.tsx b/packages/components/src/form-token-field/index.tsx
index 9f05dfee008da..4f2f325e409a7 100644
--- a/packages/components/src/form-token-field/index.tsx
+++ b/packages/components/src/form-token-field/index.tsx
@@ -124,17 +124,14 @@ export function FormTokenField( props: FormTokenFieldProps ) {
 		}
 
 		// TODO: updateSuggestions() should first be refactored so its actual deps are clearer.
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ suggestions, prevSuggestions, value, prevValue ] );
 
 	useEffect( () => {
 		updateSuggestions();
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ incompleteTokenValue ] );
 
 	useEffect( () => {
 		updateSuggestions();
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ __experimentalAutoSelectFirstMatch ] );
 
 	if ( disabled && isActive ) {
diff --git a/packages/components/src/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js b/packages/components/src/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js
index d5defc14dd475..133ff27b28049 100644
--- a/packages/components/src/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js
+++ b/packages/components/src/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js
@@ -72,8 +72,6 @@ const BottomSheetNavigationScreen = ( {
 			 *
 			 * Related: https://github.com/WordPress/gutenberg/pull/36328#discussion_r768897546
 			 */
-			// see https://github.com/WordPress/gutenberg/pull/41166
-			// eslint-disable-next-line react-hooks/exhaustive-deps
 		}, [] )
 	);
 
@@ -130,9 +128,6 @@ const BottomSheetNavigationScreen = ( {
 				</TouchableHighlight>
 			</ScrollView>
 		);
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [
 		children,
 		isFocused,
diff --git a/packages/components/src/mobile/bottom-sheet/sub-sheet/index.native.js b/packages/components/src/mobile/bottom-sheet/sub-sheet/index.native.js
index d46b10cfb560f..cfc72aecbc5bb 100644
--- a/packages/components/src/mobile/bottom-sheet/sub-sheet/index.native.js
+++ b/packages/components/src/mobile/bottom-sheet/sub-sheet/index.native.js
@@ -28,9 +28,6 @@ const BottomSheetSubSheet = ( {
 		if ( showSheet ) {
 			setIsFullScreen( isFullScreen );
 		}
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ showSheet, isFullScreen ] );
 
 	return (
diff --git a/packages/components/src/mobile/color-settings/index.native.js b/packages/components/src/mobile/color-settings/index.native.js
index 10cf776ed808c..27d8119a38c4a 100644
--- a/packages/components/src/mobile/color-settings/index.native.js
+++ b/packages/components/src/mobile/color-settings/index.native.js
@@ -35,9 +35,6 @@ const ColorSettingsMemo = memo(
 		useEffect( () => {
 			shouldEnableBottomSheetMaxHeight( true );
 			onHandleClosingBottomSheet( null );
-			// Disable reason: deferring this refactor to the native team.
-			// see https://github.com/WordPress/gutenberg/pull/41166
-			// eslint-disable-next-line react-hooks/exhaustive-deps
 		}, [] );
 		return (
 			<BottomSheet.NavigationContainer>
diff --git a/packages/components/src/mobile/color-settings/picker-screen.native.js b/packages/components/src/mobile/color-settings/picker-screen.native.js
index 2d505621f6eda..ebaecb2fa0a6f 100644
--- a/packages/components/src/mobile/color-settings/picker-screen.native.js
+++ b/packages/components/src/mobile/color-settings/picker-screen.native.js
@@ -43,9 +43,6 @@ const PickerScreen = () => {
 				onHandleHardwareButtonPress={ onHandleHardwareButtonPress }
 			/>
 		);
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [
 		setColor,
 		currentValue,
diff --git a/packages/components/src/mobile/image/index.native.js b/packages/components/src/mobile/image/index.native.js
index 9f8673b7bdcdf..3e0a993e9fbea 100644
--- a/packages/components/src/mobile/image/index.native.js
+++ b/packages/components/src/mobile/image/index.native.js
@@ -112,9 +112,6 @@ const ImageComponent = ( {
 			}
 		}
 		return () => ( isCurrent = false );
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ url ] );
 
 	const onContainerLayout = ( event ) => {
diff --git a/packages/components/src/mobile/keyboard-avoiding-view/index.ios.js b/packages/components/src/mobile/keyboard-avoiding-view/index.ios.js
index f13e7d329874f..6fd716a527ee3 100644
--- a/packages/components/src/mobile/keyboard-avoiding-view/index.ios.js
+++ b/packages/components/src/mobile/keyboard-avoiding-view/index.ios.js
@@ -69,9 +69,6 @@ export const KeyboardAvoidingView = ( {
 			keyboardShowSubscription.remove();
 			keyboardHideSubscription.remove();
 		};
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [] );
 
 	function onSafeAreaInsetsUpdate( { safeAreaInsets } ) {
diff --git a/packages/components/src/mobile/link-picker/link-picker-results.native.js b/packages/components/src/mobile/link-picker/link-picker-results.native.js
index 1d411b97ff066..803635b564422 100644
--- a/packages/components/src/mobile/link-picker/link-picker-results.native.js
+++ b/packages/components/src/mobile/link-picker/link-picker-results.native.js
@@ -75,9 +75,6 @@ export default function LinkPickerResults( {
 		return {
 			fetchMoreSuggestions: debounce( fetchMore, REQUEST_DEBOUNCE_DELAY ),
 		};
-		// Disable eslint rule for now, to avoid introducing a regression
-		// (see https://github.com/WordPress/gutenberg/pull/23922#discussion_r1170634879).
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [] );
 
 	// Prevent setting state when unmounted.
@@ -90,9 +87,6 @@ export default function LinkPickerResults( {
 		setHasAllSuggestions( false );
 		setLinks( [ directEntry ] );
 		fetchMoreSuggestions( { query, links: [ directEntry ] } );
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ query ] );
 
 	const onEndReached = () => fetchMoreSuggestions( { query, links } );
diff --git a/packages/components/src/mobile/link-picker/link-picker-screen.native.js b/packages/components/src/mobile/link-picker/link-picker-screen.native.js
index 7bc1dbd7009b6..f77cf4e18a1b0 100644
--- a/packages/components/src/mobile/link-picker/link-picker-screen.native.js
+++ b/packages/components/src/mobile/link-picker/link-picker-screen.native.js
@@ -53,9 +53,6 @@ const LinkPickerScreen = ( { returnScreenName } ) => {
 				onCancel={ onCancel }
 			/>
 		);
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ inputValue ] );
 };
 
diff --git a/packages/components/src/mobile/link-settings/index.native.js b/packages/components/src/mobile/link-settings/index.native.js
index e80672a3103fa..794650adefdd7 100644
--- a/packages/components/src/mobile/link-settings/index.native.js
+++ b/packages/components/src/mobile/link-settings/index.native.js
@@ -101,9 +101,6 @@ function LinkSettings( {
 		if ( onHandleClosingBottomSheet ) {
 			onHandleClosingBottomSheet( onCloseSettingsSheet );
 		}
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ urlInputValue, labelInputValue, linkRelInputValue ] );
 
 	useEffect( () => {
@@ -115,9 +112,6 @@ function LinkSettings( {
 		if ( url !== urlInputValue ) {
 			setUrlInputValue( url || '' );
 		}
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ url ] );
 
 	useEffect( () => {
@@ -141,9 +135,6 @@ function LinkSettings( {
 		if ( prevEditorSidebarOpened && ! editorSidebarOpened ) {
 			onSetAttributes();
 		}
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ editorSidebarOpened, isVisible ] );
 
 	useEffect( () => {
@@ -156,9 +147,6 @@ function LinkSettings( {
 				url: prependHTTP( urlValue ),
 			} );
 		}
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ urlValue ] );
 
 	const onChangeURL = useCallback(
@@ -188,9 +176,6 @@ function LinkSettings( {
 				rel: linkRelInputValue,
 			} );
 		}
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ urlInputValue, labelInputValue, linkRelInputValue, setAttributes ] );
 
 	const onCloseSettingsSheet = useCallback( () => {
@@ -223,9 +208,6 @@ function LinkSettings( {
 				rel: updatedRel,
 			} );
 		},
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 		[ linkRelInputValue ]
 	);
 
diff --git a/packages/components/src/mobile/link-settings/link-settings-screen.native.js b/packages/components/src/mobile/link-settings/link-settings-screen.native.js
index d04bd0699b7a5..65c95187d2fcb 100644
--- a/packages/components/src/mobile/link-settings/link-settings-screen.native.js
+++ b/packages/components/src/mobile/link-settings/link-settings-screen.native.js
@@ -37,9 +37,6 @@ const LinkSettingsScreen = ( props ) => {
 				urlValue={ inputValue }
 			/>
 		);
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ props, inputValue, navigation, route ] );
 };
 
diff --git a/packages/components/src/mobile/segmented-control/index.native.js b/packages/components/src/mobile/segmented-control/index.native.js
index 49d46b8cd08be..3bd7ffb319573 100644
--- a/packages/components/src/mobile/segmented-control/index.native.js
+++ b/packages/components/src/mobile/segmented-control/index.native.js
@@ -74,18 +74,12 @@ const SegmentedControls = ( {
 	useEffect( () => {
 		setActiveSegmentIndex( selectedSegmentIndex );
 		segmentHandler( segments[ selectedSegmentIndex ] );
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [] );
 
 	useEffect( () => {
 		positionAnimationValue.setValue(
 			calculateEndValue( activeSegmentIndex )
 		);
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ segmentsDimensions ] );
 
 	const containerStyle = usePreferredColorSchemeStyle(
diff --git a/packages/components/src/mobile/utils/use-unit-converter-to-mobile.native.js b/packages/components/src/mobile/utils/use-unit-converter-to-mobile.native.js
index 891f11f502ebf..a312f59db332f 100644
--- a/packages/components/src/mobile/utils/use-unit-converter-to-mobile.native.js
+++ b/packages/components/src/mobile/utils/use-unit-converter-to-mobile.native.js
@@ -66,9 +66,6 @@ const useConvertUnitToMobile = ( value, unit, styles ) => {
 		return () => {
 			dimensionsChangeSubscription.remove();
 		};
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [] );
 
 	const onDimensionsChange = useCallback( ( { window } ) => {
@@ -85,9 +82,6 @@ const useConvertUnitToMobile = ( value, unit, styles ) => {
 			valueToConvert,
 			valueUnit
 		);
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ windowSizes, value, unit ] );
 };
 
diff --git a/packages/components/src/navigation/index.tsx b/packages/components/src/navigation/index.tsx
index 0069369f3e00c..18b1c3619e41c 100644
--- a/packages/components/src/navigation/index.tsx
+++ b/packages/components/src/navigation/index.tsx
@@ -106,7 +106,6 @@ export function Navigation( {
 		}
 		// Ignore exhaustive-deps here, as it would require either a larger refactor or some questionable workarounds.
 		// See https://github.com/WordPress/gutenberg/pull/41612 for context.
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ activeMenu ] );
 
 	const context = {
diff --git a/packages/components/src/navigation/item/use-navigation-tree-item.tsx b/packages/components/src/navigation/item/use-navigation-tree-item.tsx
index e294af4169517..571b109910bfa 100644
--- a/packages/components/src/navigation/item/use-navigation-tree-item.tsx
+++ b/packages/components/src/navigation/item/use-navigation-tree-item.tsx
@@ -42,6 +42,5 @@ export const useNavigationTreeItem = (
 			removeItem( itemId );
 		};
 		// Ignore exhaustive-deps rule for now. See https://github.com/WordPress/gutenberg/pull/41639
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ activeMenu, search ] );
 };
diff --git a/packages/components/src/navigation/menu/menu-title-search.tsx b/packages/components/src/navigation/menu/menu-title-search.tsx
index c1dbda5af88fb..567da2405fc60 100644
--- a/packages/components/src/navigation/menu/menu-title-search.tsx
+++ b/packages/components/src/navigation/menu/menu-title-search.tsx
@@ -56,7 +56,6 @@ function MenuTitleSearch( {
 		);
 		debouncedSpeak( resultsFoundMessage );
 		// Ignore exhaustive-deps rule for now. See https://github.com/WordPress/gutenberg/pull/44090
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ items, search ] );
 
 	const onClose = () => {
diff --git a/packages/components/src/navigation/menu/use-navigation-tree-menu.tsx b/packages/components/src/navigation/menu/use-navigation-tree-menu.tsx
index 1db2ee87fa784..3c46ed126bc78 100644
--- a/packages/components/src/navigation/menu/use-navigation-tree-menu.tsx
+++ b/packages/components/src/navigation/menu/use-navigation-tree-menu.tsx
@@ -24,6 +24,5 @@ export const useNavigationTreeMenu = ( props: NavigationMenuProps ) => {
 			removeMenu( key );
 		};
 		// Ignore exhaustive-deps rule for now. See https://github.com/WordPress/gutenberg/pull/44090
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [] );
 };
diff --git a/packages/components/src/sandbox/index.native.js b/packages/components/src/sandbox/index.native.js
index b9bbc9a4e3281..8eaecf3a6a39e 100644
--- a/packages/components/src/sandbox/index.native.js
+++ b/packages/components/src/sandbox/index.native.js
@@ -336,9 +336,6 @@ const Sandbox = forwardRef( function Sandbox(
 
 	useEffect( () => {
 		updateContentHtml();
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ html, title, type, styles, scripts ] );
 
 	useEffect( () => {
diff --git a/packages/components/src/sandbox/index.tsx b/packages/components/src/sandbox/index.tsx
index 4ad971cb63ca9..ff1f2ca54deed 100644
--- a/packages/components/src/sandbox/index.tsx
+++ b/packages/components/src/sandbox/index.tsx
@@ -262,23 +262,14 @@ function SandBox( {
 				checkMessageForResize
 			);
 		};
-		// Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.
-		// See https://github.com/WordPress/gutenberg/pull/44378
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [] );
 
 	useEffect( () => {
 		trySandBox();
-		// Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.
-		// See https://github.com/WordPress/gutenberg/pull/44378
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ title, styles, scripts ] );
 
 	useEffect( () => {
 		trySandBox( true );
-		// Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.
-		// See https://github.com/WordPress/gutenberg/pull/44378
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ html, type ] );
 
 	return (
diff --git a/packages/components/src/search-control/index.native.js b/packages/components/src/search-control/index.native.js
index 8bff86049b018..b1d2b8d0098d9 100644
--- a/packages/components/src/search-control/index.native.js
+++ b/packages/components/src/search-control/index.native.js
@@ -122,9 +122,6 @@ function SearchControl( {
 		mergeFutureStyles( activeDarkStyles, [ isActive, isDark ] );
 
 		setCurrentStyles( futureStyles );
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ isActive, isDark ] );
 
 	const clearInput = useCallback( () => {
diff --git a/packages/components/src/slot-fill/bubbles-virtually/slot.tsx b/packages/components/src/slot-fill/bubbles-virtually/slot.tsx
index e836782c90615..6ac2d51e1f857 100644
--- a/packages/components/src/slot-fill/bubbles-virtually/slot.tsx
+++ b/packages/components/src/slot-fill/bubbles-virtually/slot.tsx
@@ -49,11 +49,10 @@ function Slot(
 		return () => {
 			unregisterSlot( name, ref );
 		};
-		// Ignore reason: We don't want to unregister and register the slot whenever
+		// We don't want to unregister and register the slot whenever
 		// `fillProps` change, which would cause the fill to be re-mounted. Instead,
 		// we can just update the slot (see hook below).
 		// For more context, see https://github.com/WordPress/gutenberg/pull/44403#discussion_r994415973
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ registerSlot, unregisterSlot, name ] );
 	// fillProps may be an update that interacts with the layout, so we
 	// useLayoutEffect.
diff --git a/packages/components/src/slot-fill/fill.ts b/packages/components/src/slot-fill/fill.ts
index 6aefacc4ff6f1..4134af25684b0 100644
--- a/packages/components/src/slot-fill/fill.ts
+++ b/packages/components/src/slot-fill/fill.ts
@@ -23,9 +23,8 @@ export default function Fill( { name, children }: FillComponentProps ) {
 		const refValue = ref.current;
 		registerFill( name, refValue );
 		return () => unregisterFill( name, refValue );
-		// Ignore reason: the useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior.
+		// The useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior.
 		// We'll leave them as-is until a more detailed investigation/refactor can be performed.
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [] );
 
 	useLayoutEffect( () => {
@@ -33,9 +32,8 @@ export default function Fill( { name, children }: FillComponentProps ) {
 		if ( slot ) {
 			slot.forceUpdate();
 		}
-		// Ignore reason: the useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior.
+		// The useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior.
 		// We'll leave them as-is until a more detailed investigation/refactor can be performed.
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ children ] );
 
 	useLayoutEffect( () => {
@@ -46,9 +44,8 @@ export default function Fill( { name, children }: FillComponentProps ) {
 		unregisterFill( ref.current.name, ref.current );
 		ref.current.name = name;
 		registerFill( name, ref.current );
-		// Ignore reason: the useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior.
+		// The useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior.
 		// We'll leave them as-is until a more detailed investigation/refactor can be performed.
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ name ] );
 
 	return null;
diff --git a/packages/components/src/tools-panel/tools-panel-item/hook.ts b/packages/components/src/tools-panel/tools-panel-item/hook.ts
index 1e33e7c6740de..e0a1f0139dcac 100644
--- a/packages/components/src/tools-panel/tools-panel-item/hook.ts
+++ b/packages/components/src/tools-panel/tools-panel-item/hook.ts
@@ -54,11 +54,9 @@ export function useToolsPanelItem(
 
 	// hasValue is a new function on every render, so do not add it as a
 	// dependency to the useCallback hook! If needed, we should use a ref.
-	// eslint-disable-next-line react-hooks/exhaustive-deps
 	const hasValueCallback = useCallback( hasValue, [ panelId ] );
 	// resetAllFilter is a new function on every render, so do not add it as a
 	// dependency to the useCallback hook! If needed, we should use a ref.
-	// eslint-disable-next-line react-hooks/exhaustive-deps
 	const resetAllFilterCallback = useCallback( resetAllFilter, [ panelId ] );
 	const previousPanelId = usePrevious( currentPanelId );
 
diff --git a/packages/components/src/tooltip/index.native.js b/packages/components/src/tooltip/index.native.js
index 61b08c052dfac..4fd8de0814e66 100644
--- a/packages/components/src/tooltip/index.native.js
+++ b/packages/components/src/tooltip/index.native.js
@@ -62,9 +62,6 @@ const useKeyboardVisibility = () => {
 			showListener.remove();
 			hideListener.remove();
 		};
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [] );
 
 	return keyboardVisible;
@@ -105,9 +102,6 @@ const Tooltip = ( {
 			} );
 		}
 		return () => onHandleScreenTouch( null );
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ visible ] );
 
 	// Manage visibility animation.
@@ -121,9 +115,6 @@ const Tooltip = ( {
 			setAnimating( true );
 			startAnimation();
 		}
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ visible ] );
 
 	// Manage tooltip visibility and position in relation to keyboard.
@@ -142,9 +133,6 @@ const Tooltip = ( {
 			setAnimating( true );
 			setVisible( false );
 		}
-		// Disable reason: deferring this refactor to the native team.
-		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ visible, keyboardVisible ] );
 
 	// Manage tooltip position during keyboard frame changes.
@@ -273,9 +261,6 @@ const TooltipSlot = ( { children, ...rest } ) => {
 		setHandleScreenTouch( null );
 	};
 	// Memoize context value to avoid unnecessary rerenders of the Provider's children
-	// Disable reason: deferring this refactor to the native team.
-	// see https://github.com/WordPress/gutenberg/pull/41166
-	// eslint-disable-next-line react-hooks/exhaustive-deps
 	const value = useMemo( () => ( { onHandleScreenTouch } ) );
 
 	return (
diff --git a/packages/components/src/unit-control/index.native.js b/packages/components/src/unit-control/index.native.js
index a4c0b913f5343..d6f63f0a98447 100644
--- a/packages/components/src/unit-control/index.native.js
+++ b/packages/components/src/unit-control/index.native.js
@@ -47,10 +47,6 @@ function UnitControl( {
 		if ( pickerRef?.current ) {
 			pickerRef.current.presentPicker();
 		}
-		// Disable reason: this should be fixed by the native team.
-		// It would be great if this could be done in the context of
-		// https://github.com/WordPress/gutenberg/pull/39218
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [ pickerRef?.current ] );
 
 	const currentInputValue = currentInput === null ? value : currentInput;
@@ -106,10 +102,6 @@ function UnitControl( {
 			anchorNodeRef?.current
 				? findNodeHandle( anchorNodeRef?.current )
 				: undefined,
-		// Disable reason: this should be fixed by the native team.
-		// It would be great if this could be done in the context of
-		// https://github.com/WordPress/gutenberg/pull/39218
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 		[ anchorNodeRef?.current ]
 	);
 
diff --git a/packages/components/src/utils/element-rect.ts b/packages/components/src/utils/element-rect.ts
index 7f9693ef9f7df..0f58ea6d7caf5 100644
--- a/packages/components/src/utils/element-rect.ts
+++ b/packages/components/src/utils/element-rect.ts
@@ -181,7 +181,6 @@ export function useTrackElementOffsetRect(
 		measure();
 		// `measure` is a stable function, so it's safe to omit it from the deps array.
 		// deps can't be statically analyzed by ESLint
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, deps );
 
 	return indicatorPosition;
diff --git a/packages/components/src/utils/hooks/use-update-effect.js b/packages/components/src/utils/hooks/use-update-effect.js
index ed2c3ca436357..e371647f033de 100644
--- a/packages/components/src/utils/hooks/use-update-effect.js
+++ b/packages/components/src/utils/hooks/use-update-effect.js
@@ -19,11 +19,9 @@ function useUpdateEffect( effect, deps ) {
 		}
 		mountedRef.current = true;
 		return undefined;
-		// Disable reasons:
 		// 1. This hook needs to pass a dep list that isn't an array literal
 		// 2. `effect` is missing from the array, and will need to be added carefully to avoid additional warnings
 		// see https://github.com/WordPress/gutenberg/pull/41166
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, deps );
 
 	useEffect(

From 8b6c6e642087018917615e1926c9b9db82b2ba5b Mon Sep 17 00:00:00 2001
From: Marin Atanasov <8436925+tyxla@users.noreply.github.com>
Date: Tue, 22 Oct 2024 16:07:50 +0300
Subject: [PATCH 2/4] CHANGELOG

---
 packages/components/CHANGELOG.md | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
index b149172bd1037..05aebec05ea0e 100644
--- a/packages/components/CHANGELOG.md
+++ b/packages/components/CHANGELOG.md
@@ -20,6 +20,10 @@
 -   `Tabs` and `TabPanel`: Fix arrow key navigation in RTL ([#66201](https://github.com/WordPress/gutenberg/pull/66201)).
 -   `Tabs`: override tablist's tabindex only when necessary ([#66209](https://github.com/WordPress/gutenberg/pull/66209)).
 
+### Internal
+
+-   ESLint: Stop disabling `react-hooks/exhaustive-deps` rule ([#66324](https://github.com/WordPress/gutenberg/pull/66324)).
+
 ## 28.10.0 (2024-10-16)
 
 ### Bug Fixes

From 8fdcc76456e9d6c3a1cee4729555be4bce6d1734 Mon Sep 17 00:00:00 2001
From: Marin Atanasov <8436925+tyxla@users.noreply.github.com>
Date: Thu, 24 Oct 2024 15:03:16 +0300
Subject: [PATCH 3/4] Add ref to dependencies

---
 packages/components/src/autocomplete/autocompleter-ui.tsx | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/packages/components/src/autocomplete/autocompleter-ui.tsx b/packages/components/src/autocomplete/autocompleter-ui.tsx
index 276b13bf26c34..fa38302d40009 100644
--- a/packages/components/src/autocomplete/autocompleter-ui.tsx
+++ b/packages/components/src/autocomplete/autocompleter-ui.tsx
@@ -232,7 +232,5 @@ function useOnClickOutside(
 			document.removeEventListener( 'mousedown', listener );
 			document.removeEventListener( 'touchstart', listener );
 		};
-		// `ref` is a ref object and should not be included in a
-		// hook's dependency list.
-	}, [ handler ] );
+	}, [ handler, ref ] );
 }

From 544528bed02fceff3d1ab01e6fbd5cb8d41a94f6 Mon Sep 17 00:00:00 2001
From: Marin Atanasov <8436925+tyxla@users.noreply.github.com>
Date: Thu, 24 Oct 2024 15:27:33 +0300
Subject: [PATCH 4/4] Retain some context in comments

---
 .../components/src/autocomplete/autocompleter-ui.native.js  | 4 ++++
 packages/components/src/autocomplete/autocompleter-ui.tsx   | 2 ++
 packages/components/src/autocomplete/index.tsx              | 2 ++
 packages/components/src/color-palette/index.native.js       | 2 ++
 packages/components/src/color-picker/index.native.js        | 4 ++++
 .../bottom-sheet-navigation/navigation-screen.native.js     | 3 +++
 .../src/mobile/bottom-sheet/sub-sheet/index.native.js       | 1 +
 .../components/src/mobile/color-settings/index.native.js    | 1 +
 .../src/mobile/color-settings/picker-screen.native.js       | 1 +
 packages/components/src/mobile/image/index.native.js        | 1 +
 .../src/mobile/keyboard-avoiding-view/index.ios.js          | 1 +
 .../src/mobile/link-picker/link-picker-results.native.js    | 3 +++
 .../src/mobile/link-picker/link-picker-screen.native.js     | 1 +
 .../components/src/mobile/link-settings/index.native.js     | 6 ++++++
 .../src/mobile/link-settings/link-settings-screen.native.js | 1 +
 .../components/src/mobile/segmented-control/index.native.js | 2 ++
 .../src/mobile/utils/use-unit-converter-to-mobile.native.js | 2 ++
 packages/components/src/navigation/index.tsx                | 2 +-
 .../src/navigation/item/use-navigation-tree-item.tsx        | 3 ++-
 .../components/src/navigation/menu/menu-title-search.tsx    | 3 ++-
 .../src/navigation/menu/use-navigation-tree-menu.tsx        | 3 ++-
 packages/components/src/sandbox/index.native.js             | 1 +
 packages/components/src/sandbox/index.tsx                   | 6 ++++++
 packages/components/src/search-control/index.native.js      | 1 +
 packages/components/src/tooltip/index.native.js             | 5 +++++
 packages/components/src/unit-control/index.native.js        | 4 ++++
 26 files changed, 61 insertions(+), 4 deletions(-)

diff --git a/packages/components/src/autocomplete/autocompleter-ui.native.js b/packages/components/src/autocomplete/autocompleter-ui.native.js
index aa979f6b068ea..daf4fe301abf7 100644
--- a/packages/components/src/autocomplete/autocompleter-ui.native.js
+++ b/packages/components/src/autocomplete/autocompleter-ui.native.js
@@ -69,6 +69,8 @@ export function getAutoCompleterUI( autocompleter ) {
 			} else if ( isVisible && text.length === 0 ) {
 				startAnimation( false );
 			}
+			// We want to avoid introducing unexpected side effects.
+			// See https://github.com/WordPress/gutenberg/pull/41820
 		}, [ items, isVisible, text ] );
 
 		const activeItemStyles = usePreferredColorSchemeStyle(
@@ -109,6 +111,8 @@ export function getAutoCompleterUI( autocompleter ) {
 					}
 				} );
 			},
+			// We want to avoid introducing unexpected side effects.
+			// See https://github.com/WordPress/gutenberg/pull/41820
 			[ isVisible ]
 		);
 
diff --git a/packages/components/src/autocomplete/autocompleter-ui.tsx b/packages/components/src/autocomplete/autocompleter-ui.tsx
index fa38302d40009..69105f6c9d3b4 100644
--- a/packages/components/src/autocomplete/autocompleter-ui.tsx
+++ b/packages/components/src/autocomplete/autocompleter-ui.tsx
@@ -165,6 +165,8 @@ export function getAutoCompleterUI( autocompleter: WPCompleter ) {
 		useLayoutEffect( () => {
 			onChangeOptions( items );
 			announce( items );
+			// We want to avoid introducing unexpected side effects.
+			// See https://github.com/WordPress/gutenberg/pull/41820
 		}, [ items ] );
 
 		if ( items.length === 0 ) {
diff --git a/packages/components/src/autocomplete/index.tsx b/packages/components/src/autocomplete/index.tsx
index dd2dd0d2fe149..f3278a46015c3 100644
--- a/packages/components/src/autocomplete/index.tsx
+++ b/packages/components/src/autocomplete/index.tsx
@@ -380,6 +380,8 @@ export function useAutocomplete( {
 				: AutocompleterUI
 		);
 		setFilterValue( query === null ? '' : query );
+		// We want to avoid introducing unexpected side effects.
+		// See https://github.com/WordPress/gutenberg/pull/41820
 	}, [ textContent ] );
 
 	const { key: selectedKey = '' } = filteredOptions[ selectedIndex ] || {};
diff --git a/packages/components/src/color-palette/index.native.js b/packages/components/src/color-palette/index.native.js
index a34d05d294fd8..ab86cd6f05f12 100644
--- a/packages/components/src/color-palette/index.native.js
+++ b/packages/components/src/color-palette/index.native.js
@@ -115,6 +115,8 @@ function ColorPalette( {
 				scrollViewRef.current.scrollTo( { x: 0, y: 0 } );
 			}
 		}
+		// Not adding additional dependencies until the component can be refactored and updated safely.
+		// Please see https://github.com/WordPress/gutenberg/pull/41253 for discussion and details.
 	}, [ currentSegment ] );
 
 	function isSelectedCustom() {
diff --git a/packages/components/src/color-picker/index.native.js b/packages/components/src/color-picker/index.native.js
index 8c0b9b6c9e772..302de6b7d79b8 100644
--- a/packages/components/src/color-picker/index.native.js
+++ b/packages/components/src/color-picker/index.native.js
@@ -107,6 +107,10 @@ function ColorPicker( {
 		if ( onHandleHardwareButtonPress ) {
 			onHandleHardwareButtonPress( onButtonPress );
 		}
+		// TODO: Revisit this to discover if there's a good reason for omitting
+		// the hook’s dependencies and running it a single time. Ideally there
+		// may be a way to refactor and obviate the disabled lint rule. If not,
+		// this comment should be replaced by one that explains the reasoning.
 	}, [] );
 
 	function onButtonPress( action ) {
diff --git a/packages/components/src/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js b/packages/components/src/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js
index 133ff27b28049..8c43bc8561276 100644
--- a/packages/components/src/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js
+++ b/packages/components/src/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js
@@ -71,6 +71,8 @@ const BottomSheetNavigationScreen = ( {
 			 * callbacks triggered based upon which screen is currently active.
 			 *
 			 * Related: https://github.com/WordPress/gutenberg/pull/36328#discussion_r768897546
+			 *
+			 * Also see https://github.com/WordPress/gutenberg/pull/41166.
 			 */
 		}, [] )
 	);
@@ -128,6 +130,7 @@ const BottomSheetNavigationScreen = ( {
 				</TouchableHighlight>
 			</ScrollView>
 		);
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [
 		children,
 		isFocused,
diff --git a/packages/components/src/mobile/bottom-sheet/sub-sheet/index.native.js b/packages/components/src/mobile/bottom-sheet/sub-sheet/index.native.js
index cfc72aecbc5bb..14040be0cc239 100644
--- a/packages/components/src/mobile/bottom-sheet/sub-sheet/index.native.js
+++ b/packages/components/src/mobile/bottom-sheet/sub-sheet/index.native.js
@@ -28,6 +28,7 @@ const BottomSheetSubSheet = ( {
 		if ( showSheet ) {
 			setIsFullScreen( isFullScreen );
 		}
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ showSheet, isFullScreen ] );
 
 	return (
diff --git a/packages/components/src/mobile/color-settings/index.native.js b/packages/components/src/mobile/color-settings/index.native.js
index 27d8119a38c4a..c7956df0e935d 100644
--- a/packages/components/src/mobile/color-settings/index.native.js
+++ b/packages/components/src/mobile/color-settings/index.native.js
@@ -35,6 +35,7 @@ const ColorSettingsMemo = memo(
 		useEffect( () => {
 			shouldEnableBottomSheetMaxHeight( true );
 			onHandleClosingBottomSheet( null );
+			// See https://github.com/WordPress/gutenberg/pull/41166
 		}, [] );
 		return (
 			<BottomSheet.NavigationContainer>
diff --git a/packages/components/src/mobile/color-settings/picker-screen.native.js b/packages/components/src/mobile/color-settings/picker-screen.native.js
index ebaecb2fa0a6f..e924580d93979 100644
--- a/packages/components/src/mobile/color-settings/picker-screen.native.js
+++ b/packages/components/src/mobile/color-settings/picker-screen.native.js
@@ -43,6 +43,7 @@ const PickerScreen = () => {
 				onHandleHardwareButtonPress={ onHandleHardwareButtonPress }
 			/>
 		);
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [
 		setColor,
 		currentValue,
diff --git a/packages/components/src/mobile/image/index.native.js b/packages/components/src/mobile/image/index.native.js
index 3e0a993e9fbea..3c7e4ddc19c00 100644
--- a/packages/components/src/mobile/image/index.native.js
+++ b/packages/components/src/mobile/image/index.native.js
@@ -112,6 +112,7 @@ const ImageComponent = ( {
 			}
 		}
 		return () => ( isCurrent = false );
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ url ] );
 
 	const onContainerLayout = ( event ) => {
diff --git a/packages/components/src/mobile/keyboard-avoiding-view/index.ios.js b/packages/components/src/mobile/keyboard-avoiding-view/index.ios.js
index 6fd716a527ee3..7630fd21fbc42 100644
--- a/packages/components/src/mobile/keyboard-avoiding-view/index.ios.js
+++ b/packages/components/src/mobile/keyboard-avoiding-view/index.ios.js
@@ -69,6 +69,7 @@ export const KeyboardAvoidingView = ( {
 			keyboardShowSubscription.remove();
 			keyboardHideSubscription.remove();
 		};
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [] );
 
 	function onSafeAreaInsetsUpdate( { safeAreaInsets } ) {
diff --git a/packages/components/src/mobile/link-picker/link-picker-results.native.js b/packages/components/src/mobile/link-picker/link-picker-results.native.js
index 803635b564422..4751ebc1ee211 100644
--- a/packages/components/src/mobile/link-picker/link-picker-results.native.js
+++ b/packages/components/src/mobile/link-picker/link-picker-results.native.js
@@ -75,6 +75,8 @@ export default function LinkPickerResults( {
 		return {
 			fetchMoreSuggestions: debounce( fetchMore, REQUEST_DEBOUNCE_DELAY ),
 		};
+		// Not adding dependencies for now, to avoid introducing a regression
+		// (see https://github.com/WordPress/gutenberg/pull/23922#discussion_r1170634879).
 	}, [] );
 
 	// Prevent setting state when unmounted.
@@ -87,6 +89,7 @@ export default function LinkPickerResults( {
 		setHasAllSuggestions( false );
 		setLinks( [ directEntry ] );
 		fetchMoreSuggestions( { query, links: [ directEntry ] } );
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ query ] );
 
 	const onEndReached = () => fetchMoreSuggestions( { query, links } );
diff --git a/packages/components/src/mobile/link-picker/link-picker-screen.native.js b/packages/components/src/mobile/link-picker/link-picker-screen.native.js
index f77cf4e18a1b0..999c9053c5986 100644
--- a/packages/components/src/mobile/link-picker/link-picker-screen.native.js
+++ b/packages/components/src/mobile/link-picker/link-picker-screen.native.js
@@ -53,6 +53,7 @@ const LinkPickerScreen = ( { returnScreenName } ) => {
 				onCancel={ onCancel }
 			/>
 		);
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ inputValue ] );
 };
 
diff --git a/packages/components/src/mobile/link-settings/index.native.js b/packages/components/src/mobile/link-settings/index.native.js
index 794650adefdd7..a01e33b410a5c 100644
--- a/packages/components/src/mobile/link-settings/index.native.js
+++ b/packages/components/src/mobile/link-settings/index.native.js
@@ -101,6 +101,7 @@ function LinkSettings( {
 		if ( onHandleClosingBottomSheet ) {
 			onHandleClosingBottomSheet( onCloseSettingsSheet );
 		}
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ urlInputValue, labelInputValue, linkRelInputValue ] );
 
 	useEffect( () => {
@@ -112,6 +113,7 @@ function LinkSettings( {
 		if ( url !== urlInputValue ) {
 			setUrlInputValue( url || '' );
 		}
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ url ] );
 
 	useEffect( () => {
@@ -135,6 +137,7 @@ function LinkSettings( {
 		if ( prevEditorSidebarOpened && ! editorSidebarOpened ) {
 			onSetAttributes();
 		}
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ editorSidebarOpened, isVisible ] );
 
 	useEffect( () => {
@@ -147,6 +150,7 @@ function LinkSettings( {
 				url: prependHTTP( urlValue ),
 			} );
 		}
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ urlValue ] );
 
 	const onChangeURL = useCallback(
@@ -176,6 +180,7 @@ function LinkSettings( {
 				rel: linkRelInputValue,
 			} );
 		}
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ urlInputValue, labelInputValue, linkRelInputValue, setAttributes ] );
 
 	const onCloseSettingsSheet = useCallback( () => {
@@ -208,6 +213,7 @@ function LinkSettings( {
 				rel: updatedRel,
 			} );
 		},
+		// See https://github.com/WordPress/gutenberg/pull/41166
 		[ linkRelInputValue ]
 	);
 
diff --git a/packages/components/src/mobile/link-settings/link-settings-screen.native.js b/packages/components/src/mobile/link-settings/link-settings-screen.native.js
index 65c95187d2fcb..7147becd67b22 100644
--- a/packages/components/src/mobile/link-settings/link-settings-screen.native.js
+++ b/packages/components/src/mobile/link-settings/link-settings-screen.native.js
@@ -37,6 +37,7 @@ const LinkSettingsScreen = ( props ) => {
 				urlValue={ inputValue }
 			/>
 		);
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ props, inputValue, navigation, route ] );
 };
 
diff --git a/packages/components/src/mobile/segmented-control/index.native.js b/packages/components/src/mobile/segmented-control/index.native.js
index 3bd7ffb319573..36b92bb0d4ea3 100644
--- a/packages/components/src/mobile/segmented-control/index.native.js
+++ b/packages/components/src/mobile/segmented-control/index.native.js
@@ -74,12 +74,14 @@ const SegmentedControls = ( {
 	useEffect( () => {
 		setActiveSegmentIndex( selectedSegmentIndex );
 		segmentHandler( segments[ selectedSegmentIndex ] );
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [] );
 
 	useEffect( () => {
 		positionAnimationValue.setValue(
 			calculateEndValue( activeSegmentIndex )
 		);
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ segmentsDimensions ] );
 
 	const containerStyle = usePreferredColorSchemeStyle(
diff --git a/packages/components/src/mobile/utils/use-unit-converter-to-mobile.native.js b/packages/components/src/mobile/utils/use-unit-converter-to-mobile.native.js
index a312f59db332f..0b1dfd31147de 100644
--- a/packages/components/src/mobile/utils/use-unit-converter-to-mobile.native.js
+++ b/packages/components/src/mobile/utils/use-unit-converter-to-mobile.native.js
@@ -66,6 +66,7 @@ const useConvertUnitToMobile = ( value, unit, styles ) => {
 		return () => {
 			dimensionsChangeSubscription.remove();
 		};
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [] );
 
 	const onDimensionsChange = useCallback( ( { window } ) => {
@@ -82,6 +83,7 @@ const useConvertUnitToMobile = ( value, unit, styles ) => {
 			valueToConvert,
 			valueUnit
 		);
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ windowSizes, value, unit ] );
 };
 
diff --git a/packages/components/src/navigation/index.tsx b/packages/components/src/navigation/index.tsx
index 18b1c3619e41c..92f431dfb22fc 100644
--- a/packages/components/src/navigation/index.tsx
+++ b/packages/components/src/navigation/index.tsx
@@ -104,7 +104,7 @@ export function Navigation( {
 		if ( activeMenu !== menu ) {
 			setActiveMenu( activeMenu );
 		}
-		// Ignore exhaustive-deps here, as it would require either a larger refactor or some questionable workarounds.
+		// Not adding deps for now, as it would require either a larger refactor or some questionable workarounds.
 		// See https://github.com/WordPress/gutenberg/pull/41612 for context.
 	}, [ activeMenu ] );
 
diff --git a/packages/components/src/navigation/item/use-navigation-tree-item.tsx b/packages/components/src/navigation/item/use-navigation-tree-item.tsx
index 571b109910bfa..335e55f2401bf 100644
--- a/packages/components/src/navigation/item/use-navigation-tree-item.tsx
+++ b/packages/components/src/navigation/item/use-navigation-tree-item.tsx
@@ -41,6 +41,7 @@ export const useNavigationTreeItem = (
 		return () => {
 			removeItem( itemId );
 		};
-		// Ignore exhaustive-deps rule for now. See https://github.com/WordPress/gutenberg/pull/41639
+		// Not adding deps for now, as it would require either a larger refactor.
+		// See https://github.com/WordPress/gutenberg/pull/41639
 	}, [ activeMenu, search ] );
 };
diff --git a/packages/components/src/navigation/menu/menu-title-search.tsx b/packages/components/src/navigation/menu/menu-title-search.tsx
index 567da2405fc60..f0014fa476804 100644
--- a/packages/components/src/navigation/menu/menu-title-search.tsx
+++ b/packages/components/src/navigation/menu/menu-title-search.tsx
@@ -55,7 +55,8 @@ function MenuTitleSearch( {
 			count
 		);
 		debouncedSpeak( resultsFoundMessage );
-		// Ignore exhaustive-deps rule for now. See https://github.com/WordPress/gutenberg/pull/44090
+		// Not adding deps for now, as it would require either a larger refactor.
+		// See https://github.com/WordPress/gutenberg/pull/44090
 	}, [ items, search ] );
 
 	const onClose = () => {
diff --git a/packages/components/src/navigation/menu/use-navigation-tree-menu.tsx b/packages/components/src/navigation/menu/use-navigation-tree-menu.tsx
index 3c46ed126bc78..8631812445cd7 100644
--- a/packages/components/src/navigation/menu/use-navigation-tree-menu.tsx
+++ b/packages/components/src/navigation/menu/use-navigation-tree-menu.tsx
@@ -23,6 +23,7 @@ export const useNavigationTreeMenu = ( props: NavigationMenuProps ) => {
 		return () => {
 			removeMenu( key );
 		};
-		// Ignore exhaustive-deps rule for now. See https://github.com/WordPress/gutenberg/pull/44090
+		// Not adding deps for now, as it would require either a larger refactor
+		// See https://github.com/WordPress/gutenberg/pull/44090
 	}, [] );
 };
diff --git a/packages/components/src/sandbox/index.native.js b/packages/components/src/sandbox/index.native.js
index 8eaecf3a6a39e..72070bf6efcd0 100644
--- a/packages/components/src/sandbox/index.native.js
+++ b/packages/components/src/sandbox/index.native.js
@@ -336,6 +336,7 @@ const Sandbox = forwardRef( function Sandbox(
 
 	useEffect( () => {
 		updateContentHtml();
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ html, title, type, styles, scripts ] );
 
 	useEffect( () => {
diff --git a/packages/components/src/sandbox/index.tsx b/packages/components/src/sandbox/index.tsx
index ff1f2ca54deed..5288fea3f7e43 100644
--- a/packages/components/src/sandbox/index.tsx
+++ b/packages/components/src/sandbox/index.tsx
@@ -262,14 +262,20 @@ function SandBox( {
 				checkMessageForResize
 			);
 		};
+		// Passing `exhaustive-deps` will likely involve a more detailed refactor.
+		// See https://github.com/WordPress/gutenberg/pull/44378
 	}, [] );
 
 	useEffect( () => {
 		trySandBox();
+		// Passing `exhaustive-deps` will likely involve a more detailed refactor.
+		// See https://github.com/WordPress/gutenberg/pull/44378
 	}, [ title, styles, scripts ] );
 
 	useEffect( () => {
 		trySandBox( true );
+		// Passing `exhaustive-deps` will likely involve a more detailed refactor.
+		// See https://github.com/WordPress/gutenberg/pull/44378
 	}, [ html, type ] );
 
 	return (
diff --git a/packages/components/src/search-control/index.native.js b/packages/components/src/search-control/index.native.js
index b1d2b8d0098d9..5bb03196d1de1 100644
--- a/packages/components/src/search-control/index.native.js
+++ b/packages/components/src/search-control/index.native.js
@@ -122,6 +122,7 @@ function SearchControl( {
 		mergeFutureStyles( activeDarkStyles, [ isActive, isDark ] );
 
 		setCurrentStyles( futureStyles );
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ isActive, isDark ] );
 
 	const clearInput = useCallback( () => {
diff --git a/packages/components/src/tooltip/index.native.js b/packages/components/src/tooltip/index.native.js
index 4fd8de0814e66..ff880d38e1982 100644
--- a/packages/components/src/tooltip/index.native.js
+++ b/packages/components/src/tooltip/index.native.js
@@ -62,6 +62,7 @@ const useKeyboardVisibility = () => {
 			showListener.remove();
 			hideListener.remove();
 		};
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [] );
 
 	return keyboardVisible;
@@ -102,6 +103,7 @@ const Tooltip = ( {
 			} );
 		}
 		return () => onHandleScreenTouch( null );
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ visible ] );
 
 	// Manage visibility animation.
@@ -115,6 +117,7 @@ const Tooltip = ( {
 			setAnimating( true );
 			startAnimation();
 		}
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ visible ] );
 
 	// Manage tooltip visibility and position in relation to keyboard.
@@ -133,6 +136,7 @@ const Tooltip = ( {
 			setAnimating( true );
 			setVisible( false );
 		}
+		// See https://github.com/WordPress/gutenberg/pull/41166
 	}, [ visible, keyboardVisible ] );
 
 	// Manage tooltip position during keyboard frame changes.
@@ -261,6 +265,7 @@ const TooltipSlot = ( { children, ...rest } ) => {
 		setHandleScreenTouch( null );
 	};
 	// Memoize context value to avoid unnecessary rerenders of the Provider's children
+	// See https://github.com/WordPress/gutenberg/pull/41166
 	const value = useMemo( () => ( { onHandleScreenTouch } ) );
 
 	return (
diff --git a/packages/components/src/unit-control/index.native.js b/packages/components/src/unit-control/index.native.js
index d6f63f0a98447..4aae14de65779 100644
--- a/packages/components/src/unit-control/index.native.js
+++ b/packages/components/src/unit-control/index.native.js
@@ -47,6 +47,8 @@ function UnitControl( {
 		if ( pickerRef?.current ) {
 			pickerRef.current.presentPicker();
 		}
+		// It would be great if the deps could be addressed in the context of
+		// https://github.com/WordPress/gutenberg/pull/39218
 	}, [ pickerRef?.current ] );
 
 	const currentInputValue = currentInput === null ? value : currentInput;
@@ -102,6 +104,8 @@ function UnitControl( {
 			anchorNodeRef?.current
 				? findNodeHandle( anchorNodeRef?.current )
 				: undefined,
+		// It would be great if the deps could be addressed in the context of
+		// https://github.com/WordPress/gutenberg/pull/39218
 		[ anchorNodeRef?.current ]
 	);