Refactor Sidebar and UserProfile components to remove unnecessary pro…

…ps and utilize user context for displaying user information

src/components/Sidebar.tsx

@@ -33,7 +33,6 @@ export function Sidebar({ onSelectCategory, selectedCategory, tasks }: SidebarPr
     setIsLoading(true)
     try {
       const fetchedCategories = await getCategories()
-      console.log(fetchedCategories)
       setCategories(fetchedCategories)
     } catch (error) {
       console.error('Failed to fetch categories:', error)
@@ -82,7 +81,7 @@ export function Sidebar({ onSelectCategory, selectedCategory, tasks }: SidebarPr
 
   return (
     <div className="w-64 border-r h-screen flex flex-col bg-white">
-      <UserProfile name={user?.name ?? ''} email={user?.email ?? ''} />
+      <UserProfile />
 
       <div className="p-4">
         <div className="relative">

src/components/UserProfile.tsx

@@ -6,29 +6,26 @@ import { Button } from '@/components/ui/button'
 import { useRouter } from 'next/navigation'
 import { useAuth } from '@/context/AuthContext'
 
-interface UserProfileProps {
-  name: string
-  email: string
-}
-
-export function UserProfile({ name, email }: UserProfileProps) {
+export function UserProfile() {
   const router = useRouter()
-  const { logout } = useAuth()
+  const { user, logout } = useAuth()
 
   const handleLogout = () => {
     logout()
     router.push('/login')
   }
 
+  console.log(user)
+
   return (
     <div className="flex items-center justify-between p-4 border-b">
       <div className="flex items-center space-x-3">
         <Avatar>
-          <AvatarFallback>{name.charAt(0)}</AvatarFallback>
+          <AvatarFallback>{user?.name.charAt(0)}</AvatarFallback>
         </Avatar>
         <div className="space-y-1">
-          <p className="text-sm font-medium leading-none">{name}</p>
-          <p className="text-xs text-muted-foreground">{email}</p>
+          <p className="text-sm font-medium leading-none">{user?.name}</p>
+          <p className="text-xs text-muted-foreground">{user?.email}</p>
         </div>
       </div>
       <Button variant="ghost" size="icon" onClick={handleLogout}>