docs: add Tutor Time Dashboard documentation

astro.config.mjs

@@ -51,9 +51,11 @@ export default defineConfig({
             {
               label:'Frontend Tutor-Times Requirements',
               link: '/frontend/tutor-times/tutor-times-requirements',
+            },
+            {
+              label: 'Tutor Time Dashboard',
+              link: '/frontend/tutor-time-dashboard',
             }
-
-
           ],
         },
 

src/content/docs/frontend/tutor-times/tutor-time-dashboard.md

@@ -0,0 +1,42 @@
+---
+title: Tutor Time Dashboard
+---
+
+## Team Member
+Wael Alahmadi | 223837765
+
+## Component Name & Files
+- tutor-time-dashboard.component.ts
+- tutor-time-dashboard.component.html
+- tutor-time-dashboard.component.css
+
+## Purpose
+The Tutor Time Dashboard provides tutors with a clear and accessible interface to view and manage their teaching sessions.  
+It helps instructors by offering:
+- Session start and end times
+- Calculated session durations
+- Associated unit or project information
+- Pagination and sorting for large data sets
+- A responsive design that adapts to desktop, tablet, and mobile devices
+
+## Outcomes and Interactions
+✅ Sessions displayed in a structured tabular view  
+✅ Sorting by clicking on column headers  
+✅ Pagination for navigating through session records  
+✅ Responsive layout for multi-device usability  
+
+## Visual References
+![Tutor Time Dashboard Screenshot](/tutor-time-dashboard.png)
+
+## Review Checklist
+- [x] Dashboard layout renders correctly  
+- [x] Session start and end times are displayed  
+- [x] Durations calculated and shown  
+- [x] Associated unit is shown  
+- [x] Pagination works as expected  
+- [x] Sorting works as expected  
+- [] Responsive design verified on multiple devices  
+
+## Notes
+This documentation describes the Tutor Time Dashboard implemented in the frontend (`doubtfire-web`).  
+It introduces a new view accessible at `/tutor-times` and was developed as a frontend-only feature using mock data for demonstration.