feat: add comprehensive user management for authorities

USER MANAGEMENT (CTO/Manager only):
- Department overview chips with click-to-filter
- Search by name or email
- Filter by role dropdown
- Table/Grid view toggle

TABLE VIEW:
- Inline role dropdown (color-coded per role)
- Inline department dropdown
- Task progress bars (done/total)
- Active/Inactive status dots
- Edit, Deactivate, Delete action buttons
- Expandable rows with task stats (total/completed/in-progress/overdue)

GRID VIEW:
- Member cards with avatar, badges, and stats
- Task completion progress bars
- Deactivate/Reactivate buttons

MODALS:
- Add Member: name, email, role, dept, password with validation
- Edit Member: update all fields (role changes CTO-only)
- Confirmation dialog for deactivate/reactivate/delete

ROLE-BASED ACCESS:
- CTO can change anyone's role
- Manager can edit users but not change roles
- Employee has read-only access (no action buttons)
- Users cannot deactivate/delete themselves

TEAM TASKS ENHANCEMENT:
- Added group-by-department option with toggle buttons

src/App.tsx

@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import { SEED_TASKS } from './data';
+import { SEED_TASKS, USERS } from './data';
 import type { Task, User, Status } from './data';
 import { LoginPage } from './Login';
 import { Sidebar } from './Sidebar';
@@ -25,6 +25,9 @@ export default function App() {
   const now = new Date();
   const [currentUser, setCurrentUser] = useState<User | null>(null);
   const [tasks, setTasks] = useState<Task[]>(SEED_TASKS);
+  const [managedUsers, setManagedUsers] = useState(() =>
+    USERS.map(u => ({ ...u, active: true, joinedDate: '2025-12-01' }))
+  );
   const [activePage, setActivePage] = useState('calendar');
   const [activeView, setActiveView] = useState('calendar');
   const [activeTask, setActiveTask] = useState<Task | null>(null);
@@ -113,7 +116,8 @@ export default function App() {
           )}
           {displayPage === 'teamtasks' && <TeamTasksPage tasks={tasks} currentUser={currentUser} />}
           {displayPage === 'reports' && <ReportsPage tasks={tasks} />}
-          {displayPage === 'members' && <MembersPage tasks={tasks} />}
+          {displayPage === 'members' && <MembersPage tasks={tasks} currentUser={currentUser}
+            users={managedUsers} onUpdateUsers={setManagedUsers} />}
         </div>
       </div>