Function useAsync

packages/core/src/widgets/hooks/data.ts:327–368

(
  ctx: AsyncHookContext,
  task: () => Promise<T>,
  deps: readonly unknown[],
)

 * - Ignores stale completions from older dependency runs
 */
export function useAsync<T>(
  ctx: AsyncHookContext,
  task: () => Promise<T>,
  deps: readonly unknown[],
): UseAsyncState<T> {
  const [data, setData] = ctx.useState<T | undefined>(undefined);
  const [loading, setLoading] = ctx.useState<boolean>(true);
  const [error, setError] = ctx.useState<unknown>(undefined);
  const runIdRef = ctx.useRef(0);

  ctx.useEffect(() => {
    let cancelled = false;
    runIdRef.current += 1;
    const runId = runIdRef.current;

    setLoading(true);
    setError(undefined);

    Promise.resolve()
      .then(() => task())
      .then((nextData) => {
        if (cancelled || runIdRef.current !== runId) return;
        setData(nextData);
        setLoading(false);
      })
      .catch((nextError) => {
        if (cancelled || runIdRef.current !== runId) return;
        setError(nextError);
        setLoading(false);
      });

    return () => {
      cancelled = true;
    };
  }, deps);

  return {
    data,
    loading,
    error,
  };
}

/**
 * Subscribe to an async iterable and re-render on each value.