useStableCallback

A substitute for useCallback that returns a memoized version of whatever callback that it is given.

The returned function maintains a stable reference, but it will always have accesss to the most recent scope of the component in which it is used.

function MyComponent({ url }: { url: string }) {
  const refreshData = useStableCallback(() =>
    fetch(url, { method: 'GET' }).then(r => r.json())
  );

  return <SomeChildComponent refresh={refreshData} />;
}