hooks / useDebounce

[VaseninaNastya]

No description provided.

[sadcitizen]

@SmorodinVik докати этот PR, пожалуйста

[AMZhukov]

В продолжении разговора на созвоне.

Результат применения хука useTimeout:

import useTimeout from '@byndyusoft-ui/use-timeout';
import { useCallback, useRef, useState } from 'react';

export function useDebouncedCallback<A extends any[]>(
    callback: (...args: A) => void,
    delay: number
): (...args: A) => void {
    const [args, setArgs] = useState<A>();
    const [shouldExecute, setShouldExecute] = useState(false);

    useTimeout(() => {
        if (shouldExecute) {
            callback(...args!);
            setShouldExecute(false)
        }
    }, shouldExecute ? delay : null);

    return useCallback((...newArgs: A) => {
        setShouldExecute(true);
        setArgs(newArgs);
    }, []);
}
export default useDebouncedCallback

[sadcitizen]

Заблокировано реализацией useTimeout

[sadcitizen]

@sadcitizen посмотрит и зарелизит в новогодние праздники

[sadcitizen]

А зачем это надо было делать?

[SmorodinVik]

При запуске сторибуки классы с одинаковыми именами из других историй влияли друг на друга, добавлял это как временное решение. Сейчас поменял на css модули.

[sadcitizen]

Начальное значение хука может быть задано не только значением, но и функцией. В пакете с типами был тип InitialState

[AMZhukov]

Поправил

[sadcitizen]

А в блоке return точно не надо вызывать очистку? Что будет, если компонент, который вызывает хук, будет размонтирован до того как коллбек выполнится? Этот вызов надо бы отменить, иначе могут быть утечки памяти.

[AMZhukov]

Применил хук useTimeout, в нём очистка производится при размонтировании хука. Также дописал тест на это дело. Тест называется cleans up timer on unmount