Skip to content

Add useAsyncEffekt alias for better linting support #31

@davemecha

Description

@davemecha

When I wanted to add linting support to my useAsyncEffect hook as described in the README, I encountered the mentioned linting issue with the async callback. On my search for a solution, I came up with a simple workaround, at lease for the variant without teardown callback.

Since the async check is only done for hooks that have the term Effect in its name, it's easy to avoid, by effectively renaming the hook (by wrapping it).

export function useAsyncEffekt(effect: (isMounted: () => boolean) => unknown | Promise<unknown>, inputs?: any[]): void {
  return useAsyncEffect(effect, inputs);
}

With this it's possible to correctly configure react-hooks/exhaustive-deps with additionalHooks: "^(useAsyncEffekt)$".


Since additionalHooks would also not work for the variant with teardown, since for proper linting, the deps array must be the 2nd parameter, there is no point in using additionalHooks for useAsyncEffect at all. I want to suggest providing an alias useAsyncEffekt (feels natural for me as I'm German ;) ) or maybe another suitable name for just the variant of useAsyncEffect with the deps array as a 2nd argument. And also updating the readme accordingly.

See this react issue and my comment for this workaround there: facebook/react#19034 (comment)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions