From 036a6388e310b28e93df5f2852eed5837c74d059 Mon Sep 17 00:00:00 2001 From: Kamal Sai Devarapalli Date: Tue, 23 Dec 2025 16:58:52 -0700 Subject: [PATCH] fix: remove warnings from useDeepCompareEffect Removes the console warnings that were showing up in dev. The hook works fine with primitives, objects, or undefined - the warnings were just annoying for valid use cases. Fixes #755 Signed-off-by: Ricky512227 --- docs/useDeepCompareEffect.md | 9 +++++++++ src/useDeepCompareEffect.ts | 16 ---------------- 2 files changed, 9 insertions(+), 16 deletions(-) diff --git a/docs/useDeepCompareEffect.md b/docs/useDeepCompareEffect.md index 9ed37c4d8b..846a101db2 100644 --- a/docs/useDeepCompareEffect.md +++ b/docs/useDeepCompareEffect.md @@ -23,6 +23,15 @@ const Demo = () => { }; ``` +## When to Use + +This hook is handy when: +- Your dependencies might be `undefined` or an object (common with optional props/config) +- You need to compare objects by their values, not just references +- You're mixing primitives and objects in your dependency array + +Works fine with any dependency types - primitives, objects, or a mix of both. + ## Reference ```ts diff --git a/src/useDeepCompareEffect.ts b/src/useDeepCompareEffect.ts index 14c08c4ff0..4600bb74ab 100644 --- a/src/useDeepCompareEffect.ts +++ b/src/useDeepCompareEffect.ts @@ -2,23 +2,7 @@ import { DependencyList, EffectCallback } from 'react'; import useCustomCompareEffect from './useCustomCompareEffect'; import isDeepEqual from './misc/isDeepEqual'; -const isPrimitive = (val: any) => val !== Object(val); - const useDeepCompareEffect = (effect: EffectCallback, deps: DependencyList) => { - if (process.env.NODE_ENV !== 'production') { - if (!(deps instanceof Array) || !deps.length) { - console.warn( - '`useDeepCompareEffect` should not be used with no dependencies. Use React.useEffect instead.' - ); - } - - if (deps.every(isPrimitive)) { - console.warn( - '`useDeepCompareEffect` should not be used with dependencies that are all primitive values. Use React.useEffect instead.' - ); - } - } - useCustomCompareEffect(effect, deps, isDeepEqual); };