@hyperlane-xyz/widgets
Version:
Common react components for Hyperlane projects
39 lines • 1.45 kB
JavaScript
import { useCallback, useEffect, useLayoutEffect, useRef } from 'react';
const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
// https://usehooks-typescript.com/react-hook/use-interval
export function useInterval(callback, delay) {
const savedCallback = useRef(callback);
// Remember the latest callback if it changes.
useIsomorphicLayoutEffect(() => {
savedCallback.current = callback;
}, [callback]);
// Set up the interval.
useEffect(() => {
// Don't schedule if no delay is specified.
// Note: 0 is a valid value for delay.
if (!delay && delay !== 0) {
return;
}
const id = setInterval(() => savedCallback.current(), delay);
return () => clearInterval(id);
}, [delay]);
}
// https://medium.com/javascript-in-plain-english/usetimeout-react-hook-3cc58b94af1f
export const useTimeout = (callback, delay = 0) => {
const timeoutIdRef = useRef();
const cancel = useCallback(() => {
const timeoutId = timeoutIdRef.current;
if (timeoutId) {
timeoutIdRef.current = undefined;
clearTimeout(timeoutId);
}
}, [timeoutIdRef]);
useEffect(() => {
if (delay >= 0) {
timeoutIdRef.current = setTimeout(callback, delay);
}
return cancel;
}, [callback, delay, cancel]);
return cancel;
};
//# sourceMappingURL=timeout.js.map