Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ESLint: Stop disabling react-hooks/exhaustive-deps rule #66324

Merged
merged 4 commits into from
Oct 25, 2024
Merged

ESLint: Stop disabling react-hooks/exhaustive-deps rule #66324

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
de771c2
ESLint: Stop disabling react-hooks/exhaustive-deps rule
tyxla Oct 22, 2024
8b6c6e6
CHANGELOG
tyxla Oct 22, 2024
8fdcc76
Add ref to dependencies
tyxla Oct 24, 2024
544528b
Retain some context in comments
tyxla Oct 24, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 0 additions & 12 deletions .eslintrc.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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' ],
Expand Down
4 changes: 4 additions & 0 deletions packages/components/CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
6 changes: 0 additions & 6 deletions packages/components/src/autocomplete/autocompleter-ui.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In this instance (and any instances where the disable rule has a justification / link), I think it would be useful to preserve such comment — it informs the reader to why the warning was not addressed, or at the least gives some extra context.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure about that. The comment made sense when we were ignoring the ESLint error, but doesn't make sense anymore IMHO. If you take a look at the rest of the instances, you'll see that I've:

  • Preserved comments that add extra context on top of the sole "make exhaustive deps checks pass"
  • Removed comments that only relate to "making exhaustive deps checks pass" since those are no longer relevant IMHO.

Let me know what you think.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Makes sense I thought that, in this case, linking back to #41820 could be valuable, since it shows a previous attempt at adding dependencies that ended up being reverted — I thought that providing such context could be useful to a future reader.

In general I agree with your approach.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sounds good. I'll work on retaining those comments that have context then.

}, [ items, isVisible, text ] );

const activeItemStyles = usePreferredColorSchemeStyle(
Expand Down Expand Up @@ -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 ]
);

Expand Down
6 changes: 1 addition & 5 deletions packages/components/src/autocomplete/autocompleter-ui.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 ) {
Expand Down Expand Up @@ -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
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We may as well include ref here, it won't hurt and will disable the warning?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We usually don't include refs as dependencies because it's unexpected when reactive behavior depends on them changing. This was the sole reason to have this eslint-disable here in the first place. I'm happy to add it if you're sure about it, although this should be done separately IMHO.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

My worry is that, by having the disable comment, we will prevent future breakages of the rule from being surfaced by eslint.

In other words, if the disable comment is already there, I can make changes to the hook, forgetting to add the relevant dependencies, and ESLint won't tell me because the rule is already disabled. And the disable comment may be even more deceiving when debugging a potential issue, because it will potentially hide the real cause of the bug behind an "innocent" "refs are immutable" comment.

I think there are 2 better alternatives:

  • ideally, we should be able to somehow mark ref as a react ref to eslint (or, somehow, to mark is as an immutable reference). But I don't think that's an option;
  • that's why I think that a potentially better compromise would be to add ref to the list of dependencies (it shouldn't hurt in practical terms), which allows us to remove the disable comment. At most, we could leave a normal text comment mentioning that ref is there to satisfy lint rules, even if not necessary.

I would apply this reasoning in every place where it could allow us to remove the disable comment.

What do you think?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think you have a point here. Added the ref in 8fdcc76

// hook's dependency list.
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [ handler ] );
}
3 changes: 0 additions & 3 deletions packages/components/src/autocomplete/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 ] || {};
Expand Down
3 changes: 0 additions & 3 deletions packages/components/src/color-palette/index.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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() {
Expand Down
5 changes: 0 additions & 5 deletions packages/components/src/color-picker/index.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 ) {
Expand Down
1 change: 0 additions & 1 deletion packages/components/src/date-time/date/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 (
Expand Down
3 changes: 0 additions & 3 deletions packages/components/src/form-token-field/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 ) {
Expand Down
5 changes: 0 additions & 5 deletions ...es/components/src/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
}, [] )
);

Expand Down Expand Up @@ -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,
Expand Down
3 changes: 0 additions & 3 deletions packages/components/src/mobile/bottom-sheet/sub-sheet/index.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 (
Expand Down
3 changes: 0 additions & 3 deletions packages/components/src/mobile/color-settings/index.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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>
Expand Down
3 changes: 0 additions & 3 deletions packages/components/src/mobile/color-settings/picker-screen.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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,
Expand Down
3 changes: 0 additions & 3 deletions packages/components/src/mobile/image/index.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 ) => {
Expand Down
3 changes: 0 additions & 3 deletions packages/components/src/mobile/keyboard-avoiding-view/index.ios.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 } ) {
Expand Down
6 changes: 0 additions & 6 deletions packages/components/src/mobile/link-picker/link-picker-results.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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.
Expand All @@ -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 } );
Expand Down
3 changes: 0 additions & 3 deletions packages/components/src/mobile/link-picker/link-picker-screen.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 ] );
};

Expand Down
18 changes: 0 additions & 18 deletions packages/components/src/mobile/link-settings/index.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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( () => {
Expand All @@ -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( () => {
Expand All @@ -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( () => {
Expand All @@ -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(
Expand Down Expand Up @@ -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( () => {
Expand Down Expand Up @@ -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 ]
);

Expand Down
3 changes: 0 additions & 3 deletions packages/components/src/mobile/link-settings/link-settings-screen.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 ] );
};

Expand Down
6 changes: 0 additions & 6 deletions packages/components/src/mobile/segmented-control/index.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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(
Expand Down
6 changes: 0 additions & 6 deletions packages/components/src/mobile/utils/use-unit-converter-to-mobile.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 } ) => {
Expand All @@ -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 ] );
};

Expand Down
1 change: 0 additions & 1 deletion packages/components/src/navigation/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 = {
Expand Down
1 change: 0 additions & 1 deletion packages/components/src/navigation/item/use-navigation-tree-item.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 ] );
};
1 change: 0 additions & 1 deletion packages/components/src/navigation/menu/menu-title-search.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 = () => {
Expand Down
1 change: 0 additions & 1 deletion packages/components/src/navigation/menu/use-navigation-tree-menu.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
}, [] );
};
3 changes: 0 additions & 3 deletions packages/components/src/sandbox/index.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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( () => {
Expand Down
9 changes: 0 additions & 9 deletions packages/components/src/sandbox/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 (
Expand Down
Loading
Loading