useCallback with lodash's throttle

useThrottledCallback.ts

import { DependencyList, useCallback } from 'react';

import { throttle } from 'lodash';

export function useThrottledCallback<A extends Array<unknown>, R extends unknown>(
    callback: ((...args: A) => R) | undefined,
    wait: number,
    extraDeps: DependencyList = [],
): (...args: A) => R | undefined {
    return useCallback(
        (...args) => {
            const throttledCallback = callback ? throttle(callback, wait) : () => undefined;
            return throttledCallback(...args);
        },
        // eslint-disable-next-line react-hooks/exhaustive-deps
        [callback, wait, ...extraDeps],
    );
}

// Usage

const myCallback = useThrottledCallback((param: string) => {
 doSomething(param); // This will happen every other 200 ms
}, 200, [doSomething])