@rest-hooks/hooks

Collection of composable data hooks

Usage no npm install needed!

<script type="module">
  import restHooksHooks from 'https://cdn.skypack.dev/@rest-hooks/hooks';
</script>

README

Networking Hooks

CircleCI Coverage Status npm downloads bundle size npm version PRs Welcome

Composable hooks for networking data

useCancelling()

Aborts inflight request if the parameters change.

const data = useResource(useCancelling(MyEndpoint, { filter }), { filter });

useDebounce()

Delays updating the parameters by debouncing. Useful to avoid spamming network requests when parameters might change quickly (like a typeahead field).

const debouncedFilter = useDebounce(filter, 200);
const data = useResource(SearchList, { filter: debouncedFilter });

useLoading()

Helps track loading state of imperative async functions.

function Button({ onClick, children, ...props }) {
  const [clickHandler, loading, error] = useLoading(onClick);
  return (
    <button onClick={clickHandler} {...props}>
      {loading ? 'Loading...' : children}
    </button>
  );
}