fix: correct Material UI icon naming in Header.tsx and update timetable components

- Fix icon naming: remove 'Icon' suffix from MUI icon components in Header.tsx
  (AccessTime, Close, Person, School, Schedule, Class, Book, Settings, Student, Login, Logout)
- Update timetable components to use UserContext instead of ProfileContext
- Fix timetableService naming collision and circular reference
- Update various components for consistency
This commit is contained in:
Agent Zero
2026-02-26 07:28:47 +00:00
parent 00a6f941c7
commit 067df34c50
16 changed files with 123 additions and 122 deletions
+10 -10
View File
@@ -1,6 +1,6 @@
import React, { useEffect } from 'react';
import { Link } from 'react-router-dom';
import { AccessTimeIcon, KeyboardArrowRightIcon, MenuBookIcon, PeopleIcon, SchoolIcon } from '@mui/icons-material';
import { AccessTime, KeyboardArrowRight, MenuBook, People, School } from '@mui/icons-material';
import useTimetableStore from '../../stores/timetableStore';
import { useUser } from '../../contexts/UserContext';
@@ -78,7 +78,7 @@ const MyClassesPage: React.FC = () => {
{teachingClasses.length > 0 && (
<div className="mb-8">
<div className="flex items-center gap-2 mb-4">
<SchoolIcon className="text-purple-600" size={24} />
<School className="text-purple-600" size={24} />
<h2 className="text-xl font-semibold text-gray-900">Teaching</h2>
<span className="px-2 py-1 bg-purple-100 text-purple-700 text-sm font-medium rounded-full">
{teachingClasses.length}
@@ -102,7 +102,7 @@ const MyClassesPage: React.FC = () => {
<p className="text-sm text-gray-500">{classItem.class.code}</p>
)}
</div>
<KeyboardArrowRightIcon className="text-gray-400 flex-shrink-0 ml-2" size={20} />
<KeyboardArrowRight className="text-gray-400 flex-shrink-0 ml-2" size={20} />
</div>
<p className="text-gray-600 text-sm mb-4 line-clamp-2">
@@ -120,12 +120,12 @@ const MyClassesPage: React.FC = () => {
<div className="mt-4 pt-4 border-t border-gray-100 flex items-center gap-4 text-sm text-gray-500">
<div className="flex items-center gap-1">
<PeopleIcon size={14} />
<People size={14} />
<span>{classItem.class?.enrolled_count || 0} students</span>
</div>
{classItem.class?.academic_year && (
<div className="flex items-center gap-1">
<SchoolIcon size={14} />
<School size={14} />
<span>{classItem.class.academic_year}</span>
</div>
)}
@@ -141,7 +141,7 @@ const MyClassesPage: React.FC = () => {
{enrolledClasses.length > 0 && (
<div className="mb-8">
<div className="flex items-center gap-2 mb-4">
<MenuBookIcon className="text-green-600" size={24} />
<MenuBook className="text-green-600" size={24} />
<h2 className="text-xl font-semibold text-gray-900">Enrolled</h2>
<span className="px-2 py-1 bg-green-100 text-green-700 text-sm font-medium rounded-full">
{enrolledClasses.length}
@@ -165,7 +165,7 @@ const MyClassesPage: React.FC = () => {
<p className="text-sm text-gray-500">{classItem.class.code}</p>
)}
</div>
<KeyboardArrowRightIcon className="text-gray-400 flex-shrink-0 ml-2" size={20} />
<KeyboardArrowRight className="text-gray-400 flex-shrink-0 ml-2" size={20} />
</div>
<p className="text-gray-600 text-sm mb-4 line-clamp-2">
@@ -180,14 +180,14 @@ const MyClassesPage: React.FC = () => {
<div className="mt-4 pt-4 border-t border-gray-100 flex items-center gap-4 text-sm text-gray-500">
<div className="flex items-center gap-1">
<SchoolIcon size={14} />
<School size={14} />
<span>
{classItem.class?.teachers?.[0]?.first_name} {classItem.class?.teachers?.[0]?.last_name}
</span>
</div>
{classItem.class?.academic_year && (
<div className="flex items-center gap-1">
<SchoolIcon size={14} />
<School size={14} />
<span>{classItem.class.academic_year}</span>
</div>
)}
@@ -202,7 +202,7 @@ const MyClassesPage: React.FC = () => {
{/* Empty State */}
{myClasses.length === 0 && (
<div className="text-center py-16">
<MenuBookIcon className="mx-auto h-12 w-12 text-gray-300" />
<MenuBook className="mx-auto h-12 w-12 text-gray-300" />
<h3 className="mt-4 text-lg font-medium text-gray-900">No classes found</h3>
<p className="mt-2 text-gray-500">
You are not enrolled in or teaching any classes yet.