@fantastic.dev/better-stripe 0.7.0 → 0.8.1

package/src/react/workflows/useWorkflowAction.ts

@@ -0,0 +1,75 @@
+"use client";
+import { useCallback, useEffect, useRef, useState } from "react";
+export type WorkflowActionState<T, Args extends unknown[]> = {
+  isPending: boolean;
+  error: string | null;
+  result: T | undefined;
+  /** Errors are exposed in state; failed and duplicate calls return undefined. */
+  run: (...args: Args) => Promise<T | undefined>;
+  reset: () => void;
+};
+/** Shared async action lifecycle. Scope identifies the authenticated account/resource, not authorization. */
+export function useWorkflowAction<T, Args extends unknown[]>(
+  action: (...args: Args) => Promise<T>,
+  scope: string = "default",
+): WorkflowActionState<T, Args> {
+  const initial = {
+    scope,
+    isPending: false,
+    error: null as string | null,
+    result: undefined as T | undefined,
+  };
+  const [state, setState] = useState(initial);
+  if (state.scope !== scope) setState(initial);
+  const callback = useRef(action);
+  const lifecycle = useRef({ version: 0, mounted: false });
+  const lock = useRef<number | null>(null);
+  useEffect(() => {
+    callback.current = action;
+  }, [action]);
+  useEffect(() => {
+    const version = ++lifecycle.current.version;
+    lifecycle.current.mounted = true;
+    lock.current = null;
+    return () => {
+      if (lifecycle.current.version === version) {
+        lifecycle.current.mounted = false;
+        lifecycle.current.version++;
+        lock.current = null;
+      }
+    };
+  }, [scope]);
+  const reset = useCallback(() => {
+    if (lock.current !== null) return;
+    setState({ scope, isPending: false, error: null, result: undefined });
+  }, [scope]);
+  const run = useCallback(
+    async (...args: Args) => {
+      if (lock.current !== null) return undefined;
+      const version = lifecycle.current.version;
+      lock.current = version;
+      setState({ scope, isPending: true, error: null, result: undefined });
+      const current = () =>
+        lifecycle.current.mounted && lifecycle.current.version === version;
+      try {
+        const result = await callback.current(...args);
+        if (!current()) return undefined;
+        setState({ scope, isPending: false, error: null, result });
+        return result;
+      } catch (error) {
+        if (current())
+          setState({
+            scope,
+            isPending: false,
+            error: error instanceof Error ? error.message : String(error),
+            result: undefined,
+          });
+        return undefined;
+      } finally {
+        if (lock.current === version) lock.current = null;
+      }
+    },
+    [scope],
+  );
+  return { ...state, run, reset };
+}

package/src/react/workflows/useWorkflowResource.test.tsx

@@ -0,0 +1,41 @@
+// @vitest-environment jsdom
+import { StrictMode } from "react";
+import { act, cleanup, renderHook, waitFor } from "@testing-library/react";
+import { afterEach, expect, it, vi } from "vitest";
+import { useWorkflowResource } from "./useWorkflowResource.js";
+afterEach(cleanup);
+it("initializes only once in StrictMode and permits an explicit retry", async () => {
+  const load = vi
+    .fn()
+    .mockRejectedValueOnce(new Error("Unavailable"))
+    .mockResolvedValueOnce("fresh");
+  const { result } = renderHook(() => useWorkflowResource(load), {
+    wrapper: StrictMode,
+  });
+  await waitFor(() => expect(result.current.error).toBe("Unavailable"));
+  expect(load).toHaveBeenCalledOnce();
+  act(() => result.current.refresh());
+  await waitFor(() => expect(result.current.data).toBe("fresh"));
+  expect(load).toHaveBeenCalledTimes(2);
+});
+it("ignores an old account's response and loads new account data", async () => {
+  let resolve!: (value: string) => void;
+  const load = vi
+    .fn()
+    .mockImplementationOnce(
+      () =>
+        new Promise<string>((done) => {
+          resolve = done;
+        }),
+    )
+    .mockResolvedValueOnce("new balance");
+  const { result, rerender } = renderHook(
+    ({ scope }) => useWorkflowResource(load, scope),
+    { initialProps: { scope: "one" } },
+  );
+  await waitFor(() => expect(load).toHaveBeenCalledOnce());
+  rerender({ scope: "two" });
+  await waitFor(() => expect(result.current.data).toBe("new balance"));
+  await act(async () => resolve("old balance"));
+  expect(result.current.data).toBe("new balance");
+});

package/src/react/workflows/useWorkflowResource.ts

@@ -0,0 +1,78 @@
+"use client";
+import { useCallback, useEffect, useRef, useState } from "react";
+/** Loads once per scope/refresh, including under React StrictMode. Stale requests cannot update another scope. */
+export function useWorkflowResource<T>(
+  load: () => Promise<T>,
+  scope = "default",
+) {
+  const initial = {
+    scope,
+    attempt: 0,
+    data: undefined as T | undefined,
+    error: null as string | null,
+    isLoading: true,
+  };
+  const [state, setState] = useState(initial);
+  if (state.scope !== scope) setState(initial);
+  const loader = useRef(load);
+  const request = useRef<{
+    scope: string;
+    attempt: number;
+    promise: Promise<T>;
+  } | null>(null);
+  useEffect(() => {
+    loader.current = load;
+  }, [load]);
+  useEffect(() => {
+    let active = true;
+    if (
+      !request.current ||
+      request.current.scope !== scope ||
+      request.current.attempt !== state.attempt
+    ) {
+      request.current = {
+        scope,
+        attempt: state.attempt,
+        promise: Promise.resolve().then(() => loader.current()),
+      };
+    }
+    void request.current.promise
+      .then((data) => {
+        if (active)
+          setState((previous) => ({
+            ...previous,
+            data,
+            error: null,
+            isLoading: false,
+          }));
+      })
+      .catch((error: unknown) => {
+        if (active)
+          setState((previous) => ({
+            ...previous,
+            error: error instanceof Error ? error.message : String(error),
+            isLoading: false,
+          }));
+      });
+    return () => {
+      active = false;
+    };
+  }, [scope, state.attempt]);
+  const refresh = useCallback(
+    () =>
+      setState((previous) => ({
+        ...previous,
+        attempt: previous.attempt + 1,
+        isLoading: true,
+        error: null,
+      })),
+    [],
+  );
+  return {
+    revision: state.attempt,
+    data: state.data,
+    error: state.error,
+    isLoading: state.isLoading,
+    refresh,
+  };
+}