From e4c4c187492f1a70efd7b5e1a1d4eae44dd833b6 Mon Sep 17 00:00:00 2001
From: Ishaan Dey <ishaan1013@gmail.com>
Date: Sun, 28 Apr 2024 01:17:39 -0400
Subject: [PATCH] add signout logic

---
 frontend/components/ui/userButton.tsx | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/frontend/components/ui/userButton.tsx b/frontend/components/ui/userButton.tsx
index 62d3eb4..9cb7747 100644
--- a/frontend/components/ui/userButton.tsx
+++ b/frontend/components/ui/userButton.tsx
@@ -9,10 +9,16 @@ import {
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu"
 import { User } from "@/lib/types"
+import { useClerk } from "@clerk/nextjs"
 import { LogOut, Pencil } from "lucide-react"
+import { useRouter } from "next/navigation"
 
 export default function UserButton({ userData }: { userData: User }) {
   if (!userData) return null
+
+  const { signOut } = useClerk()
+  const router = useRouter()
+
   return (
     <DropdownMenu>
       <DropdownMenuTrigger>
@@ -30,7 +36,10 @@ export default function UserButton({ userData }: { userData: User }) {
           {/* open modal with name and email (disabled) */}
         </DropdownMenuItem>
         <DropdownMenuSeparator />
-        <DropdownMenuItem className="!text-destructive cursor-pointer">
+        <DropdownMenuItem
+          onClick={() => signOut(() => router.push("/"))}
+          className="!text-destructive cursor-pointer"
+        >
           <LogOut className="mr-2 h-4 w-4" />
           <span>Log Out</span>
         </DropdownMenuItem>