diff --git a/app/(content)/layout.tsx b/app/(content)/layout.tsx
index b960adc16735c90def990ddce4d44f07074b8255..2d8363e749fec02a8da7afda52029ca0c4abcbad 100644
--- a/app/(content)/layout.tsx
+++ b/app/(content)/layout.tsx
@@ -5,7 +5,6 @@ import { dashboardConfig } from "@/lib/config/dashboard"
 interface DashboardLayoutProps {
     children?: React.ReactNode
 }
-
 export default async function ContentLayout({
     children,
 }: DashboardLayoutProps) {
@@ -15,7 +14,6 @@ export default async function ContentLayout({
                 <aside className="hidden w-[200px] flex-col md:flex">
                     <div className="sticky top-0">
                         <DashboardNav items={dashboardConfig.sidebarNav} />
-                        <button>Logout</button>
                     </div>
                 </aside>
                 <main className="flex w-full flex-1 flex-col overflow-hidden">
diff --git a/components/nav.tsx b/components/nav.tsx
index fbf733449d6391d35de8b7d7b0912fcf4ec85d8c..45b8874b67be0c4437a2eb2fb34e5ff230bed33d 100644
--- a/components/nav.tsx
+++ b/components/nav.tsx
@@ -7,6 +7,7 @@ import { SidebarNavItem } from "@/types";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 import { ModeToggle } from "./mode-toggle";
+import {signIn, signOut, useSession } from "next-auth/react"
 
 interface DashboardNavProps {
     items: SidebarNavItem[]
@@ -14,11 +15,11 @@ interface DashboardNavProps {
 
 export default function DashboardNav({ items }: DashboardNavProps) {
     const path = usePathname()
-
+    const { data: session } = useSession();
     if (!items?.length) {
         return null
     }
-
+    
     const isLoaded = true
     const user = "test"
 
@@ -30,7 +31,7 @@ export default function DashboardNav({ items }: DashboardNavProps) {
                     <Icons.logoWhite className="h-7 w-7 hidden dark:block" />
                 </Link>
             </div>
-            {isLoaded && user ?
+            {session?.user && isLoaded && user ?
                 (items.map((item, index) => {
                     const Icon = Icons[item.icon as keyof IconsType || "arrowRight"];
                     if (item.title === "My Profile") {
@@ -62,7 +63,15 @@ export default function DashboardNav({ items }: DashboardNavProps) {
                     </p>
                 </div>
             }
-            <ModeToggle />
+            {session?.user &&
+            <>
+            <p className="text-sky-600"> {session?.user.name}</p>
+            <button className=" text-red-500" onClick={() => signOut()}>
+                Sign Out
+            </button>
+            </>
+            }
+        <ModeToggle />
         </nav>
     )
 }
\ No newline at end of file