diff --git a/packages/form-js-editor/src/render/hooks/usePrevious.js b/packages/form-js-editor/src/render/hooks/usePrevious.js index 99bc24913..21a3bfbf1 100644 --- a/packages/form-js-editor/src/render/hooks/usePrevious.js +++ b/packages/form-js-editor/src/render/hooks/usePrevious.js @@ -4,10 +4,10 @@ import { } from 'preact/hooks'; -export default function usePrevious(value) { - const ref = useRef(); +export default function usePrevious(value, defaultValue = null) { + const ref = useRef(defaultValue); - useEffect(() => ref.current = value); + useEffect(() => ref.current = value, [ value ]); return ref.current; } \ No newline at end of file diff --git a/packages/form-js-viewer/src/render/components/form-fields/Textarea.js b/packages/form-js-viewer/src/render/components/form-fields/Textarea.js index 3b2fdf5a0..8e0504e5b 100644 --- a/packages/form-js-viewer/src/render/components/form-fields/Textarea.js +++ b/packages/form-js-viewer/src/render/components/form-fields/Textarea.js @@ -38,7 +38,7 @@ export default function Textarea(props) { field, value: target.value }); - }, [ props.onChange ]); + }); const onInputBlur = () => { flushOnChange && flushOnChange(); diff --git a/packages/form-js-viewer/src/render/components/form-fields/Textfield.js b/packages/form-js-viewer/src/render/components/form-fields/Textfield.js index 0ad91ed4b..4e1b02185 100644 --- a/packages/form-js-viewer/src/render/components/form-fields/Textfield.js +++ b/packages/form-js-viewer/src/render/components/form-fields/Textfield.js @@ -42,7 +42,7 @@ export default function Textfield(props) { field, value: target.value }); - }, [ props.onChange ]); + }); const onInputBlur = () => { flushOnChange && flushOnChange(); diff --git a/packages/form-js-viewer/src/render/hooks/useDeepCompareState.js b/packages/form-js-viewer/src/render/hooks/useDeepCompareState.js index 4cb30e943..9a60de252 100644 --- a/packages/form-js-viewer/src/render/hooks/useDeepCompareState.js +++ b/packages/form-js-viewer/src/render/hooks/useDeepCompareState.js @@ -17,7 +17,7 @@ export default function useDeepCompareState(value, defaultValue) { const [ state, setState ] = useState(defaultValue); - const previous = usePrevious(value, defaultValue, [ value ]); + const previous = usePrevious(value, defaultValue); const changed = !isEqual(previous, value); diff --git a/packages/form-js-viewer/src/render/hooks/useFlushDebounce.js b/packages/form-js-viewer/src/render/hooks/useFlushDebounce.js index cccaafafa..f2e7c7dc1 100644 --- a/packages/form-js-viewer/src/render/hooks/useFlushDebounce.js +++ b/packages/form-js-viewer/src/render/hooks/useFlushDebounce.js @@ -1,7 +1,7 @@ import { useCallback, useRef } from 'preact/hooks'; import useService from './useService'; -function useFlushDebounce(func, additionalDeps = []) { +function useFlushDebounce(func) { const timeoutRef = useRef(null); const lastArgsRef = useRef(null); @@ -29,7 +29,7 @@ function useFlushDebounce(func, additionalDeps = []) { lastArgsRef.current = null; }, delay); - }, [ func, delay, shouldDebounce, ...additionalDeps ]); + }, [ func, delay, shouldDebounce ]); const flushFunc = useCallback(() => { @@ -42,7 +42,7 @@ function useFlushDebounce(func, additionalDeps = []) { timeoutRef.current = null; } - }, [ func, ...additionalDeps ]); + }, [ func ]); return [ debounceFunc, flushFunc ]; } diff --git a/packages/form-js-viewer/src/render/hooks/usePrevious.js b/packages/form-js-viewer/src/render/hooks/usePrevious.js index f5c6d0766..21a3bfbf1 100644 --- a/packages/form-js-viewer/src/render/hooks/usePrevious.js +++ b/packages/form-js-viewer/src/render/hooks/usePrevious.js @@ -4,10 +4,10 @@ import { } from 'preact/hooks'; -export default function usePrevious(value, defaultValue, dependencies) { +export default function usePrevious(value, defaultValue = null) { const ref = useRef(defaultValue); - useEffect(() => ref.current = value, dependencies); + useEffect(() => ref.current = value, [ value ]); return ref.current; } \ No newline at end of file diff --git a/packages/form-js-viewer/test/helper/preactDebuggers.js b/packages/form-js-viewer/test/helper/preactDebuggers.js index 821261e74..cd81b95de 100644 --- a/packages/form-js-viewer/test/helper/preactDebuggers.js +++ b/packages/form-js-viewer/test/helper/preactDebuggers.js @@ -4,11 +4,11 @@ const usePrevious = (value, initialValue) => { const ref = useRef(initialValue); useEffect(() => { ref.current = value; - }); + }, [ value ]); return ref.current; }; -export function useEffectDebugger(effectHook, dependencies, dependencyNames = [], effectName = 'noname') { +export function useEffectDebugger(effect, dependencies, dependencyNames = [], effectName = 'noname') { const previousDeps = usePrevious(dependencies, []); const changedDeps = dependencies.reduce((accum, dependency, index) => { @@ -30,7 +30,7 @@ export function useEffectDebugger(effectHook, dependencies, dependencyNames = [] console.log('[use-effect-debugger] (' + effectName + ') ', changedDeps); } - useEffect(effectHook, dependencies); + useEffect(effect, [ effect, ...dependencies ]); } export function useCallbackDebugger(callback, dependencies, dependencyNames = [], callbackName = 'noname') { @@ -55,5 +55,5 @@ export function useCallbackDebugger(callback, dependencies, dependencyNames = [] console.log('[use-callback-debugger] (' + callbackName + ') ', changedDeps); } - return useCallback(callback, dependencies); + return useCallback(callback, [ callback, ...dependencies ]); } \ No newline at end of file