feat(project): init

components/logout-button.tsx

@@ -0,0 +1,36 @@
+"use client";
+
+import { useState, startTransition } from "react";
+import { useRouter } from "next/navigation";
+
+export default function LogoutButton() {
+  const router = useRouter();
+  const [isPending, setIsPending] = useState(false);
+
+  async function handleLogout(): Promise<void> {
+    setIsPending(true);
+
+    try {
+      await fetch("/api/auth/logout", {
+        method: "POST",
+      });
+    } finally {
+      startTransition(() => {
+        router.push("/login");
+        router.refresh();
+      });
+      setIsPending(false);
+    }
+  }
+
+  return (
+    <button
+      type="button"
+      className="ghost-button"
+      onClick={handleLogout}
+      disabled={isPending}
+    >
+      {isPending ? "退出中..." : "退出登录"}
+    </button>
+  );
+}