|
|
@@ -0,0 +1,29 @@
|
|
|
+"use client";
|
|
|
+
|
|
|
+import { useState } from "react";
|
|
|
+import { useRouter } from "next/navigation";
|
|
|
+import { useQueryClient } from "@tanstack/react-query";
|
|
|
+
|
|
|
+export function SignOutButton() {
|
|
|
+ const router = useRouter();
|
|
|
+ const queryClient = useQueryClient();
|
|
|
+ const [pending, setPending] = useState(false);
|
|
|
+
|
|
|
+ async function handleSignOut() {
|
|
|
+ setPending(true);
|
|
|
+ await fetch("/api/auth/signout", { method: "POST" });
|
|
|
+ queryClient.clear();
|
|
|
+ router.push("/");
|
|
|
+ router.refresh();
|
|
|
+ }
|
|
|
+
|
|
|
+ return (
|
|
|
+ <button
|
|
|
+ onClick={handleSignOut}
|
|
|
+ disabled={pending}
|
|
|
+ className="rounded bg-neutral-800 px-3 py-1.5 text-sm text-neutral-300 hover:bg-neutral-700 disabled:opacity-50"
|
|
|
+ >
|
|
|
+ Sign out
|
|
|
+ </button>
|
|
|
+ );
|
|
|
+}
|