Teachers

Manage teacher profiles and assignments

\n {\n resetForm();\n setShowModal(true);\n }}\n className=\"px-4 py-2 bg-indigo-600 text-white rounded-lg hover:bg-indigo-700 transition-colors flex items-center\"\n >\n ➕\n Add Teacher\n \n

\n\n {/* Filters */}\n

\n setSearchTerm(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500\"\n />\n

\n setFilterDepartment(e.target.value)}\n className=\"px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500\"\n >\n \n {departments.map(dept => (\n \n ))}\n \n

\n\n {/* Error Message */}\n {error && (\n

\n ⚠️\n

{error}

\n setError(null)}\n className=\"ml-auto text-red-500 hover:text-red-700\"\n >\n ✕\n \n

\n )}\n\n {/* Teachers Grid */}\n

\n {filteredTeachers.map((teacher) => (\n

\n \n {teacher.firstName[0]}{teacher.lastName[0]}\n \n

\n {teacher.firstName} {teacher.lastName}\n

{teacher.subject}

\n \n

\n 📧\n {teacher.email}\n

\n 📞\n {teacher.phone}\n

\n 🏢\n {teacher.department}\n

\n \n

\n \n {teacher.status}\n \n \n

\n openEditModal(teacher)}\n className=\"text-indigo-600 hover:text-indigo-900 text-sm font-medium\"\n >\n Edit\n \n handleDelete(teacher.id)}\n className=\"text-red-600 hover:text-red-900 text-sm font-medium\"\n >\n Delete\n \n

\n ))}\n

\n\n {filteredTeachers.length === 0 && (\n

No teachers found

\n )}\n\n {/* Modal */}\n {showModal && (\n

\n {editingTeacher ? 'Edit Teacher' : 'Add New Teacher'}\n

\n \n

\n \n First Name\n \n setFormData({...formData, firstName: e.target.value})}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500\"\n />\n

\n \n Last Name\n \n setFormData({...formData, lastName: e.target.value})}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500\"\n />\n

\n \n

\n \n Email\n \n setFormData({...formData, email: e.target.value})}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500\"\n />\n

\n \n

\n \n Phone\n \n setFormData({...formData, phone: e.target.value})}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500\"\n />\n

\n \n

\n \n Subject\n \n setFormData({...formData, subject: e.target.value})}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500\"\n placeholder=\"e.g., Mathematics, English, Science\"\n />\n

\n \n

\n \n Department\n \n setFormData({...formData, department: e.target.value})}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500\"\n >\n \n \n \n \n \n \n \n \n \n

\n \n

\n setShowModal(false)}\n className=\"px-4 py-2 text-gray-700 bg-gray-100 rounded-lg hover:bg-gray-200 transition-colors\"\n >\n Cancel\n \n \n {editingTeacher ? 'Update' : 'Add'} Teacher\n \n

\n )}\n

\n );\n}","deleted","label",[168,169,151],"frontend","components","permalink","https://www.val.town/x/Deep_25/untitled-9443/code/frontend/components/TeacherList.tsx","extension","actionData","errors"]