tmp: useTransition

packages/ui/src/hooks/index.ts

@@ -1,3 +1,4 @@
 export * from "./use-origin";
 export * from "./use-scroll-top";
 export * from "./use-sidebar-layout";
+export * from "./use-transition";

packages/ui/src/hooks/use-transition.ts

@@ -0,0 +1,25 @@
+"use client";
+
+import { useCallback, useState } from "react";
+
+type Action<T> = (() => T) | (() => Promise<T>);
+
+export const useTransition = <T>(fn: Action<T>) => {
+  const [isPending, setIsPending] = useState(false);
+  const [error, setError] = useState<Error>();
+
+  const action = useCallback(async () => {
+    try {
+      setIsPending(true);
+      const response = fn();
+      if (response instanceof Promise) return await response;
+      return response;
+    } catch (error) {
+      setError(error as Error);
+    } finally {
+      setIsPending(false);
+    }
+  }, [fn]);
+
+  return [action, isPending, error] as const;
+};