feat: Implement AI Chat Agent, Email Notifications, and UI enhancements

2025-12-12 08:35:48 +01:00
parent ccfb674318
commit 5d8976b1cd
58 changed files with 7867 additions and 844 deletions
@@ -1,5 +1,6 @@
 import { useTranslation } from 'react-i18next';
 import { Home, Calendar, List, LayoutGrid, Settings, CheckSquare, Target, Trophy, LogOut, Award } from 'lucide-react';
+import { Button } from "@/components/ui/button";
 import {
    Sidebar,
    SidebarContent,
@@ -96,21 +97,30 @@ export function AppSidebar({ user, ...props }: AppSidebarProps) {
                {state !== 'collapsed' && user && (
                    <GamificationBar xp={user.xp} level={user.level} streak={user.currentStreak} />
                )}
-                <SidebarMenu>
-                    <SidebarMenuItem>
-                        <SidebarMenuButton
+                <div className={`p-4 ${state === 'collapsed'
+                    ? 'flex flex-col items-center justify-center gap-4'
+                    : 'grid grid-cols-3 items-center'
+                    }`}>
+                    <div className={state === 'collapsed' ? '' : 'justify-self-start'}>
+                        <ThemeToggle />
+                    </div>
+
+                    <div className={state === 'collapsed' ? '' : 'justify-self-center'}>
+                        <Button
+                            variant="ghost"
+                            size="icon"
                            onClick={() => logoutMutation.mutate()}
                            disabled={logoutMutation.isPending}
                            className="text-red-500 hover:text-red-600 hover:bg-red-50 dark:hover:bg-red-950/20"
+                            title="Logout"
                        >
-                            <LogOut className={state === 'collapsed' ? 'size-5' : 'size-4'} />
-                            {state !== 'collapsed' && <span className="font-medium ml-2">Logout</span>}
-                        </SidebarMenuButton>
-                    </SidebarMenuItem>
-                </SidebarMenu>
-                <div className={`p-4 flex items-center ${state === 'collapsed' ? 'justify-center flex-col gap-4' : 'justify-between'}`}>
-                    <ThemeToggle />
-                    <SidebarTrigger className={state === 'collapsed' ? '' : 'ml-auto'} />
+                            <LogOut className="size-4" />
+                        </Button>
+                    </div>
+
+                    <div className={state === 'collapsed' ? '' : 'justify-self-end'}>
+                        <SidebarTrigger />
+                    </div>
                </div>
            </SidebarFooter>
            <SidebarRail />