2020-07-03 23:32:39 +02:00
|
|
|
import usePrevious from './usePrevious';
|
|
|
|
import { useEffect } from 'react';
|
|
|
|
|
2024-04-05 13:16:49 +02:00
|
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- Old code before rule was applied
|
2020-11-12 21:13:28 +02:00
|
|
|
export default function useEffectDebugger(effectHook: any, dependencies: any, dependencyNames: any[] = []) {
|
2020-07-03 23:32:39 +02:00
|
|
|
const previousDeps = usePrevious(dependencies, []);
|
|
|
|
|
2024-04-05 13:16:49 +02:00
|
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- Old code before rule was applied
|
2020-11-12 21:13:28 +02:00
|
|
|
const changedDeps = dependencies.reduce((accum: any, dependency: any, index: any) => {
|
2020-07-03 23:32:39 +02:00
|
|
|
if (dependency !== previousDeps[index]) {
|
|
|
|
const keyName = dependencyNames[index] || index;
|
|
|
|
return {
|
|
|
|
...accum,
|
|
|
|
[keyName]: {
|
|
|
|
before: previousDeps[index],
|
|
|
|
after: dependency,
|
|
|
|
},
|
|
|
|
};
|
|
|
|
}
|
|
|
|
|
|
|
|
return accum;
|
|
|
|
}, {});
|
|
|
|
|
|
|
|
if (Object.keys(changedDeps).length) {
|
2023-02-16 12:55:24 +02:00
|
|
|
// eslint-disable-next-line no-console
|
2020-07-03 23:32:39 +02:00
|
|
|
console.log('[use-effet-debugger] ', changedDeps);
|
|
|
|
}
|
|
|
|
|
2022-08-19 13:10:04 +02:00
|
|
|
// eslint-disable-next-line @seiyab/react-hooks/exhaustive-deps -- Old code before rule was applied
|
2020-07-03 23:32:39 +02:00
|
|
|
useEffect(effectHook, dependencies);
|
|
|
|
}
|