<Zhenya>
← Сниппеты

useTimeout

Type-friendly useTimeout hook with clear

import { useCallback, useEffect, useRef } from "react";
export default function useTimeout<Cb extends (...args: never[]) => unknown>(callback: Cb, delay: number) {
const callbackRef = useRef(callback);
const timeoutRef = useRef<NodeJS.Timeout>();
useEffect(() => {
callbackRef.current = callback;
}, [callback]);
const set = useCallback(() => {
timeoutRef.current = setTimeout(() => callbackRef.current(), delay);
}, [delay]);
const clear = useCallback(() => {
if (timeoutRef.current) {
clearTimeout(timeoutRef.current);
}
}, []);
useEffect(() => {
set();
return clear;
}, [delay, set, clear]);
const reset = useCallback(() => {
clear();
set();
}, [clear, set]);
return { reset, clear };
}