Ui redesign

Git Commit Message Description - Complete Changes Summary:

---

Summary of Changes

App.tsx

• Imported AppLayout component
• Wrapped all protected route pages with <AppLayout> component for consistent navbar and sidebar across all authenticated pages

DashboardPage.tsx

• Removed duplicate embedded navbar/header (Heart icon, eHRS title, ThemeToggle, user info, Logout button) since AppLayout now provides it
• Removed unused ThemeToggle import and logout function
• Cleaned up imports to remove unnecessary dependencies

AppLayout.tsx (Main Changes)

1. Navbar Setup:

   • Added top navbar with Heart icon and eHRS title on left, ThemeToggle and hamburger menu button on right
   • Hamburger button opens the sidebar drawer

2. Sidebar Implementation:

   • Created collapsible sidebar with slide-in animation from right side
   • Added backdrop with blur effect when sidebar is open
   • Sidebar closes when clicking backdrop or X button

3. Sidebar Content:

   • Header with Heart icon, eHRS title, and close (X) button
   • User info section showing name and phone number
   • Role selector dropdown for users with multiple roles (Admin, Coordinator, Volunteer)
   • Menu items section showing role-specific actions
   • Logout button at the bottom

4. Role-Based Menu Items:

   • Admin: Manage Doctors, Medical Camps, Medicines, Assign Roles, Patient Profiles, Staff Attendance
   • Volunteer: Register Patient, Assign Doctor, Record Vitals, Vitals Queue, Queue, In Consultation Queue, Prescriptions, Verify Medicines, Counseling, Patient Status, Quick Search
   • Coordinator: Queue Management

5. UI Improvements:

   • Removed Public Queue from sidebar menu
   • Menu items match exact order as DashboardPage for each role
   • Added smooth animations and transitions
   • Proper click-outside handling to close sidebar and dropdown

---

Commit Message:

feat: implement role-based collapsible sidebar navigation

- Add AppLayout wrapper for consistent navbar/sidebar across authenticated pages
- Create collapsible sidebar with slide-in animation from right and backdrop blur
- Implement role selector dropdown for multi-role users
- Display role-specific menu items in exact order matching dashboard:
  - Admin: Manage Doctors, Medical Camps, Medicines, Assign Roles, Patient Profiles, Staff Attendance
  - Volunteer: Register Patient, Assign Doctor, Record Vitals, Vitals Queue, Queue, In Consultation Queue, Prescriptions, Verify Medicines, Counseling, Patient Status, Quick Search
  - Coordinator: Queue Management
- Remove duplicate navbar from DashboardPage
- Add user info section and logout button in sidebar
- Remove Public Queue from sidebar menu