Components: fix useCx story to satisfy exhaustive-deps eslint rule (

#45614) * move `eslint-ignore-*` to the correct line * update CHANGELOG.md
WordPress · Nov 9, 2022 · 5411c05 · 5411c05
1 parent 18b64f5
commit 5411c05
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 1 deletion.
diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
@@ -17,6 +17,7 @@
 -   `withNotices`: Update to pass `exhaustive-deps` eslint rule ([#45530](https://github.com/WordPress/gutenberg/pull/45530)).
 -   `ItemGroup`: Update to pass `exhaustive-deps` eslint rule ([#45531](https://github.com/WordPress/gutenberg/pull/45531)).
 -   `Draggable`: Convert to TypeScript ([#45471](https://github.com/WordPress/gutenberg/pull/45471)).
+-   `useCx`: fix story to satisfy the `react-hooks/exhaustive-deps` eslint rule ([#45614](https://github.com/WordPress/gutenberg/pull/45614))
 
 ### Experimental
 

diff --git a/packages/components/src/utils/hooks/stories/use-cx.js b/packages/components/src/utils/hooks/stories/use-cx.js
@@ -32,9 +32,9 @@ const Example = ( { serializedStyles, children } ) => {
 const ExampleWithUseMemoWrong = ( { serializedStyles, children } ) => {
 	const cx = useCx();
 	// Wrong: using 'useMemo' without adding 'cx' to the dependency list.
-	// eslint-disable-next-line react-hooks/exhaustive-deps
 	const classes = useMemo(
 		() => cx( serializedStyles ),
+		// eslint-disable-next-line react-hooks/exhaustive-deps
 		[ serializedStyles ]
 	);
 	return <span className={ classes }>{ children }</span>;