improvement: omit useDebounceCallback func arg from dependency array

[therour]

Improvement

Problem

const increment = () => setValue((val) => val + 1)
const debouncedIncrement = useDebounceCallback(increment, 500)

const debouncedFn = useDebounceCallback(fn, 500, { trailing: true })

• debouncedIncrement and debouncedFn will always create new reference every re-render. this will be dangerous if this debounced function is passed to any react hooks dependency array
• same goes with the options object, the user's provided options object also not necessarily memoized, so we can just pass it's values to dependency array instead of the object reference itself

Solution

• pass the func into useRef, so we dont need to pass it to the useMemo dependency array
• only track each property of options in the useMemo dependency array

Fix

Current behavior

isPending() always return true, it is only false on first render

Expectation

based on type comments

/**
   * Checks if there are any pending function invocations.
   * @returns `true` if there are pending invocations, otherwise `false`.
   */
  isPending: () => boolean

[changeset-bot]

⚠️ No Changeset found

Latest commit: 3e8d3e0

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[juliencrn]

Hi @therour, your PR does not compile yet.

[therour]

@juliencrn thanks for the response,
actually I got the ts error Type 'Parameters<T>' must have a '[Symbol.iterator]()'

I think the Generic for DebouncedState should be changed to <T extends (...args: any[]) => ReturnType<T>>
reference: microsoft/TypeScript#41728

currently was

DebouncedState<T extends (...args: any) => ReturnType<T>>

but I don't change in this PR, as this will break another part that uses this interface
Just fixed in this MR

[therour]

OK I understand, that it can be fixed from developer perspective by memoize the callback arg

const debouncedIncrement = useDebounceCallback(
    React.useCallback(() => setValue(val) => val + 1, []), 
    500
)