updates

Frontend/src/App.tsx

@@ -122,6 +122,9 @@ const AccountantPaymentManagementPage = lazy(() => import('./pages/accountant/Pa
 const AccountantInvoiceManagementPage = lazy(() => import('./pages/accountant/InvoiceManagementPage'));
 const AccountantAnalyticsDashboardPage = lazy(() => import('./pages/accountant/AnalyticsDashboardPage'));
 const AccountantLayout = lazy(() => import('./pages/AccountantLayout'));
+const AdminProfilePage = lazy(() => import('./pages/admin/ProfilePage'));
+const StaffProfilePage = lazy(() => import('./pages/staff/ProfilePage'));
+const AccountantProfilePage = lazy(() => import('./pages/accountant/ProfilePage'));
 
 const NotFoundPage = lazy(() => import('./shared/pages/NotFoundPage'));
 
@@ -604,6 +607,10 @@ function App() {
             path="backups" 
             element={<BackupManagementPage />} 
           />
+          <Route
+            path="profile" 
+            element={<AdminProfilePage />} 
+          />
         </Route>
 
         {}
@@ -654,6 +661,10 @@ function App() {
             path="advanced-rooms" 
             element={<StaffAdvancedRoomManagementPage />} 
           />
+          <Route
+            path="profile" 
+            element={<StaffProfilePage />} 
+          />
         </Route>
 
         {/* Accountant Routes */}
@@ -692,6 +703,10 @@ function App() {
             path="reports" 
             element={<AccountantAnalyticsDashboardPage />} 
           />
+          <Route 
+            path="profile" 
+            element={<AccountantProfilePage />} 
+          />
         </Route>
 
         {}

Frontend/src/features/auth/components/LoginModal.tsx

@@ -2,6 +2,7 @@ import React, { useState, useEffect } from 'react';
 import { useForm } from 'react-hook-form';
 import { yupResolver } from '@hookform/resolvers/yup';
 import { X, Eye, EyeOff, LogIn, Loader2, Mail, Lock, Shield, ArrowLeft } from 'lucide-react';
+import { useNavigate } from 'react-router-dom';
 import useAuthStore from '../../../store/useAuthStore';
 import { loginSchema, LoginFormData } from '../../../shared/utils/validationSchemas';
 import { useCompanySettings } from '../../../shared/contexts/CompanySettingsContext';
@@ -26,8 +27,9 @@ type MFATokenFormData = yup.InferType<typeof mfaTokenSchema>;
 
 const LoginModal: React.FC = () => {
   const { closeModal, openModal } = useAuthModal();
-  const { login, verifyMFA, isLoading, error, clearError, requiresMFA, clearMFA, isAuthenticated } = useAuthStore();
+  const { login, verifyMFA, isLoading, error, clearError, requiresMFA, clearMFA, isAuthenticated, userInfo } = useAuthStore();
   const { settings } = useCompanySettings();
+  const navigate = useNavigate();
   
   const [showPassword, setShowPassword] = useState(false);
   
@@ -61,12 +63,26 @@ const LoginModal: React.FC = () => {
     },
   });
 
-  // Close modal on successful authentication
+  // Close modal and redirect to appropriate dashboard on successful authentication
   useEffect(() => {
-    if (!isLoading && isAuthenticated && !requiresMFA) {
+    if (!isLoading && isAuthenticated && !requiresMFA && userInfo) {
       closeModal();
+      
+      // Redirect to role-specific dashboard
+      const role = userInfo.role?.toLowerCase() || (userInfo as any).role_name?.toLowerCase();
+      
+      if (role === 'admin') {
+        navigate('/admin/dashboard', { replace: true });
+      } else if (role === 'staff') {
+        navigate('/staff/dashboard', { replace: true });
+      } else if (role === 'accountant') {
+        navigate('/accountant/dashboard', { replace: true });
+      } else {
+        // Customer or default - go to customer dashboard
+        navigate('/dashboard', { replace: true });
       }
-  }, [isLoading, isAuthenticated, requiresMFA, closeModal]);
+    }
+  }, [isLoading, isAuthenticated, requiresMFA, userInfo, closeModal, navigate]);
 
   const {
     register,

Frontend/src/shared/components/SidebarAccountant.tsx

@@ -9,7 +9,8 @@ import {
   Menu,
   X,
   CreditCard,
-  Receipt
+  Receipt,
+  User
 } from 'lucide-react';
 import useAuthStore from '../../store/useAuthStore';
 import { useResponsive } from '../../hooks';
@@ -95,6 +96,11 @@ const SidebarAccountant: React.FC<SidebarAccountantProps> = ({
       icon: BarChart3, 
       label: 'Financial Reports' 
     },
+    { 
+      path: '/accountant/profile', 
+      icon: User, 
+      label: 'My Profile' 
+    },
   ];
 
   const isActive = (path: string) => {

Frontend/src/shared/components/SidebarAdmin.tsx

@@ -303,6 +303,11 @@ const SidebarAdmin: React.FC<SidebarAdminProps> = ({
           icon: HardDrive, 
           label: 'Backups' 
         },
+        { 
+          path: '/admin/profile', 
+          icon: User, 
+          label: 'My Profile' 
+        },
       ]
     },
   ];

Frontend/src/shared/components/SidebarStaff.tsx

@@ -127,6 +127,11 @@ const SidebarStaff: React.FC<SidebarStaffProps> = ({
       icon: BarChart3, 
       label: 'Reports' 
     },
+    { 
+      path: '/staff/profile', 
+      icon: Users, 
+      label: 'My Profile' 
+    },
   ];
 
   const isActive = (path: string) => {