ClassroomCopilot/app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(icons): replace lucide-react with @mui/icons-material

Browse Source 
Replace lucide-react icon imports with @mui/icons-material equivalents
across all timetable pages and common Modal component.

Icons replaced:
- lucide-react Check, X, UserPlus, Users, Filter, Search -> MUI equivalents
- lucide-react ChevronDown, ChevronLeft, ChevronRight -> MUI equivalents
- lucide-react BookOpen, Clock, GraduationCap, School -> MUI equivalents
- lucide-react Calendar, MapPin, Edit, Trash2, Plus -> MUI equivalents
- lucide-react ArrowLeft, FileText, CheckCircle, XCircle -> MUI equivalents

Fixes build error: Failed to resolve import 'lucide-react'
This commit is contained in:
Agent Zero
2026-02-26 07:06:11 +00:00
parent a64836c94a
commit c7207eb805
7 changed files with 55 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/timetable/EnrollmentRequestsPage.tsx
+7 -7
View File
@@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react';
import { Check, X, UserPlus, Users, Filter, Search, ChevronDown } from 'lucide-react';
import { CheckIcon, CloseIcon, FilterListIcon, KeyboardArrowDownIcon, PeopleIcon, PersonAddIcon, SearchIcon } from '@mui/icons-material';
import useTimetableStore from '../../stores/timetableStore';
import Modal from '../../components/common/Modal';
@@ -105,7 +105,7 @@ const EnrollmentRequestsPage: React.FC = () => {
<div className="flex flex-wrap items-center gap-4">
{/* Class Filter */}
<div className="flex items-center gap-2">
<Filter size={18} className="text-gray-400" />
<FilterListIcon size={18} className="text-gray-400" />
<select
value={filters.class_id || ''}
onChange={(e) => setFilters(prev => ({ ...prev, class_id: e.target.value || undefined }))}
@@ -137,7 +137,7 @@ const EnrollmentRequestsPage: React.FC = () => {
{/* Search */}
<div className="flex-1 min-w-[200px]">
<div className="relative">
<Search size={18} className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400" />
<SearchIcon size={18} className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400" />
<input
type="text"
placeholder="Search by student name or email..."
@@ -195,7 +195,7 @@ const EnrollmentRequestsPage: React.FC = () => {
<td className="px-6 py-4 whitespace-nowrap">
<div className="flex items-center">
<div className="flex-shrink-0 h-10 w-10 rounded-full bg-blue-100 flex items-center justify-center">
<UserPlus size={18} className="text-blue-600" />
<PersonAddIcon size={18} className="text-blue-600" />
</div>
<div className="ml-4">
<div className="text-sm font-medium text-gray-900">
@@ -230,7 +230,7 @@ const EnrollmentRequestsPage: React.FC = () => {
}}
className="inline-flex items-center px-3 py-1 border border-transparent text-xs font-medium rounded text-green-700 bg-green-100 hover:bg-green-200"
>
<Check size={14} className="mr-1" />
<CheckIcon size={14} className="mr-1" />
Approve
</button>
<button
@@ -241,7 +241,7 @@ const EnrollmentRequestsPage: React.FC = () => {
}}
className="inline-flex items-center px-3 py-1 border border-transparent text-xs font-medium rounded text-red-700 bg-red-100 hover:bg-red-200"
>
<X size={14} className="mr-1" />
<CloseIcon size={14} className="mr-1" />
Reject
</button>
</div>
@@ -259,7 +259,7 @@ const EnrollmentRequestsPage: React.FC = () => {
</div>
) : (
<div className="text-center py-16 bg-white rounded-lg shadow">
<Users className="mx-auto h-12 w-12 text-gray-300" />
<PeopleIcon className="mx-auto h-12 w-12 text-gray-300" />
<h3 className="mt-4 text-lg font-medium text-gray-900">No enrollment requests</h3>
<p className="mt-2 text-gray-500">
{filters.status === 'pending'