diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 59a9483..447d404 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -13,6 +13,7 @@ import { ReportsPage } from '@/pages/ReportsPage'
import { AdminUsersPage } from '@/pages/AdminUsersPage'
import { AdminInvitationsPage } from '@/pages/AdminInvitationsPage'
import { AdminAuditPage } from '@/pages/AdminAuditPage'
+import { AccountPage } from '@/pages/AccountPage'
function App() {
return (
@@ -29,6 +30,7 @@ function App() {
} />
} />
} />
+ } />
} />
} />
} />
diff --git a/frontend/src/components/layout/Header.tsx b/frontend/src/components/layout/Header.tsx
index 05d8cb9..70eae2b 100644
--- a/frontend/src/components/layout/Header.tsx
+++ b/frontend/src/components/layout/Header.tsx
@@ -1,6 +1,7 @@
+import { useNavigate } from 'react-router-dom'
import { useAuth } from '@/context/AuthContext'
import { useNotifications } from '@/hooks/useNotifications'
-import { Avatar, AvatarFallback } from '@/components/ui/avatar'
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'
import { Badge } from '@/components/ui/badge'
import { Button } from '@/components/ui/button'
import {
@@ -18,7 +19,7 @@ import {
} from '@/components/ui/popover'
import { ScrollArea } from '@/components/ui/scroll-area'
import { Separator } from '@/components/ui/separator'
-import { Bell, CheckCheck, LogOut, Menu, Moon, Sun } from 'lucide-react'
+import { Bell, CheckCheck, LogOut, Menu, Moon, Sun, UserCog } from 'lucide-react'
import { useTheme } from '@/hooks/useTheme'
interface HeaderProps {
@@ -26,6 +27,7 @@ interface HeaderProps {
}
export function Header({ onToggleSidebar }: HeaderProps) {
+ const navigate = useNavigate()
const { user, logout } = useAuth()
const { notifications, unreadCount, markAsRead, markAllAsRead } = useNotifications()
const { theme, toggleTheme } = useTheme()
@@ -137,6 +139,7 @@ export function Header({ onToggleSidebar }: HeaderProps) {