🤖

NASHMI AI

جاري التحميل...

\n \n\n\n",[],[143,163],"cdbe071e-3fda-11f1-9d95-42b51c65c3df","api.ts","cdbe07dc-3fda-11f1-9d95-42b51c65c3df",13,["D",1777034441228],"const BASE = \"\";\n\nasync function api(path: string, options?: RequestInit) {\n const res = await fetch(`${BASE}/api${path}`, {\n ...options,\n headers: { \"Content-Type\": \"application/json\", ...options?.headers },\n });\n const data = await res.json();\n if (!res.ok) throw new Error(data.error || \"حدث خطأ\");\n return data;\n}\n\nexport const authAPI = {\n login: (email: string, password: string) =>\n api(\"/auth/login\", { method: \"POST\", body: JSON.stringify({ email, password }) }),\n register: (data: any) =>\n api(\"/auth/register\", { method: \"POST\", body: JSON.stringify(data) }),\n};\n\nexport const adminAPI = {\n getPending: () => api(\"/admin/pending\"),\n getUsers: () => api(\"/admin/users\"),\n approve: (id: number) => api(`/admin/approve/${id}`, { method: \"POST\" }),\n reject: (id: number) => api(`/admin/reject/${id}`, { method: \"POST\" }),\n deleteUser: (id: number) => api(`/admin/user/${id}`, { method: \"DELETE\" }),\n};\n\nexport const teacherAPI = {\n createAssignment: (data: any) =>\n api(\"/teacher/assignments\", { method: \"POST\", body: JSON.stringify(data) }),\n getAssignments: (teacherId: number) => api(`/teacher/assignments/${teacherId}`),\n updateAssignment: (id: number, data: any) =>\n api(`/teacher/assignments/${id}`, { method: \"PUT\", body: JSON.stringify(data) }),\n deleteAssignment: (id: number) =>\n api(`/teacher/assignments/${id}`, { method: \"DELETE\" }),\n getSubmissions: (assignmentId: number) => api(`/teacher/submissions/${assignmentId}`),\n gradeSubmission: (submission_id: number, grade_value: number) =>\n api(\"/teacher/grade-submission\", { method: \"POST\", body: JSON.stringify({ submission_id, grade_value }) }),\n createExam: (data: any) =>\n api(\"/teacher/exams\", { method: \"POST\", body: JSON.stringify(data) }),\n getExams: (teacherId: number) => api(`/teacher/exams/${teacherId}`),\n deleteExam: (id: number) => api(`/teacher/exams/${id}`, { method: \"DELETE\" }),\n getExamSubmissions: (examId: number) => api(`/teacher/exam-submissions/${examId}`),\n};\n\nexport const studentAPI = {\n getAssignments: (grade: string) => api(`/student/assignments/${encodeURIComponent(grade)}`),\n checkSubmission: (assignmentId: number, studentId: number) =>\n api(`/student/submission-check/${assignmentId}/${studentId}`),\n submitAssignment: (data: any) =>\n api(\"/student/submit-assignment\", { method: \"POST\", body: JSON.stringify(data) }),\n getGrades: (studentId: number) => api(`/student/grades/${studentId}`),\n getExams: (grade: string) => api(`/student/exams/${encodeURIComponent(grade)}`),\n checkExam: (examId: number, studentId: number) =>\n api(`/student/exam-check/${examId}/${studentId}`),\n submitExam: (data: any) =>\n api(\"/student/submit-exam\", { method: \"POST\", body: JSON.stringify(data) }),\n addPoints: (student_id: number, points: number) =>\n api(\"/student/add-points\", { method: \"POST\", body: JSON.stringify({ student_id, points }) }),\n getPoints: (studentId: number) => api(`/student/points/${studentId}`),\n};\n\nexport const aiAPI = {\n chat: (message: string, history?: any[]) =>\n api(\"/ai/chat\", { method: \"POST\", body: JSON.stringify({ message, history }) }),\n summarize: (text: string) =>\n api(\"/ai/summarize\", { method: \"POST\", body: JSON.stringify({ text }) }),\n generateTest: (subject: string, lesson: string, count: number, grade: string) =>\n api(\"/ai/generate-test\", { method: \"POST\", body: JSON.stringify({ subject, lesson, count, grade }) }),\n getChallengeQuestions: (level: string, count: number) =>\n api(\"/ai/challenge-questions\", { method: \"POST\", body: JSON.stringify({ level, count }) }),\n};\n\nexport const messagesAPI = {\n send: (data: any) =>\n api(\"/messages/send\", { method: \"POST\", body: JSON.stringify(data) }),\n getConversation: (userId: number, friendId: number) =>\n api(`/messages/conversation/${userId}/${friendId}`),\n getGroupMessages: (groupId: number) => api(`/messages/group/${groupId}`),\n addFriend: (user_id: number, friend_id: number) =>\n api(\"/messages/add-friend\", { method: \"POST\", body: JSON.stringify({ user_id, friend_id }) }),\n getFriends: (userId: number) => api(`/messages/friends/${userId}`),\n createGroup: (data: any) =>\n api(\"/messages/create-group\", { method: \"POST\", body: JSON.stringify(data) }),\n getGroups: (userId: number) => api(`/messages/groups/${userId}`),\n changePassword: (user_id: number, old_password: string, new_password: string) =>\n api(\"/messages/change-password\", { method: \"POST\", body: JSON.stringify({ user_id, old_password, new_password }) }),\n};\n",[],[143,171],"d555c930-3fda-11f1-b327-42b51c65c3df","App.tsx","d555c9da-3fda-11f1-b327-42b51c65c3df",14,["D",1777034453967],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect, useCallback } from \"https://esm.sh/react@18.2.0\";\nimport { authAPI } from \"./api.ts\";\nimport LoginPage from \"./components/LoginPage.tsx\";\nimport StudentDashboard from \"./components/StudentDashboard.tsx\";\nimport TeacherDashboard from \"./components/TeacherDashboard.tsx\";\nimport AdminDashboard from \"./components/AdminDashboard.tsx\";\n\nexport default function App() {\n const [user, setUser] = useState(null);\n const [loading, setLoading] = useState(true);\n\n useEffect(() => {\n const saved = localStorage.getItem(\"nashmi_user\");\n if (saved) {\n try { setUser(JSON.parse(saved)); } catch {}\n }\n setLoading(false);\n }, []);\n\n const handleLogin = useCallback((userData: any) => {\n setUser(userData);\n localStorage.setItem(\"nashmi_user\", JSON.stringify(userData));\n }, []);\n\n const handleLogout = useCallback(() => {\n setUser(null);\n localStorage.removeItem(\"nashmi_user\");\n }, []);\n\n if (loading) {\n return (\n

🤖

Nashmi AI

\n );\n }\n\n if (!user) {\n return ;\n }\n\n switch (user.role) {\n case \"student\":\n return ;\n case \"teacher\":\n return ;\n case \"admin\":\n return ;\n default:\n return ;\n }\n}\n",[],[143,179],"e79869a4-3fda-11f1-b66a-42b51c65c3df","components","7b34f6b0-76a5-4455-b2b0-c284707ac659",15,["D",1777034484595],[193,194,195,196,197],[143,187],{"_39":229,"_13":230,"_42":231,"_44":188,"_46":47,"_48":232,"_50":51,"_52":233,"_17":54,"_55":56,"_57":234,"_59":60,"_61":-5,"_115":235,"_18":236},{"_39":222,"_13":223,"_42":224,"_44":188,"_46":47,"_48":189,"_50":51,"_52":225,"_17":54,"_55":56,"_57":226,"_59":60,"_61":-5,"_115":227,"_18":228},{"_39":214,"_13":215,"_42":216,"_44":188,"_46":47,"_48":217,"_50":51,"_52":218,"_17":54,"_55":56,"_57":219,"_59":60,"_61":-5,"_115":220,"_18":221},{"_39":206,"_13":207,"_42":208,"_44":188,"_46":47,"_48":209,"_50":51,"_52":210,"_17":123,"_55":56,"_57":211,"_59":60,"_61":-5,"_115":212,"_18":213},{"_39":198,"_13":199,"_42":200,"_44":188,"_46":47,"_48":201,"_50":51,"_52":202,"_17":54,"_55":56,"_57":203,"_59":60,"_61":-5,"_115":204,"_18":205},"760e6c88-3fdb-11f1-bb09-42b51c65c3df","TeacherDashboard.tsx","760e6d64-3fdb-11f1-bb09-42b51c65c3df",19,["D",1777034723607],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { teacherAPI } from \"../api.ts\";\nimport Sidebar from \"./Sidebar.tsx\";\n\nconst SUBJECTS = [\n \"اللغة العربية\",\"اللغة الإنجليزية\",\"الرياضيات\",\"العلوم\",\"الفيزياء\",\"الكيمياء\",\n \"الأحياء\",\"علوم الأرض\",\"التاريخ\",\"الجغرافيا\",\"التربية الإسلامية\",\"الحاسوب\",\n];\nconst GRADES = [\n \"الصف الأول\",\"الصف الثاني\",\"الصف الثالث\",\"الصف الرابع\",\"الصف الخامس\",\n \"الصف السادس\",\"الصف السابع\",\"الصف الثامن\",\"الصف التاسع\",\"الصف العاشر\",\n \"الأول ثانوي\",\"التوجيهي - علمي\",\"التوجيهي - أدبي\",\n];\n\nconst NAV_ITEMS = [\n { id: \"assignments\", label: \"الواجبات\", icon: \"📝\" },\n { id: \"exams\", label: \"الاختبارات\", icon: \"📋\" },\n { id: \"create\", label: \"إنشاء واجب\", icon: \"➕\" },\n { id: \"create-exam\", label: \"إنشاء اختبار\", icon: \"📄\" },\n];\n\nexport default function TeacherDashboard({ user, onLogout }: { user: any; onLogout: () => void }) {\n const [page, setPage] = useState(\"assignments\");\n const [sidebarOpen, setSidebarOpen] = useState(false);\n const [assignments, setAssignments] = useState([]);\n const [exams, setExams] = useState([]);\n const [submissions, setSubmissions] = useState([]);\n const [selectedAssignment, setSelectedAssignment] = useState(null);\n const [form, setForm] = useState({});\n const [examForm, setExamForm] = useState({ questions: [], duration: 30 });\n const [newQ, setNewQ] = useState({ question: \"\", options: [\"\", \"\", \"\", \"\"], correct: 0 });\n const [loading, setLoading] = useState(false);\n const [msg, setMsg] = useState(\"\");\n\n useEffect(() => {\n loadAssignments();\n loadExams();\n }, []);\n\n const loadAssignments = async () => {\n try {\n const data = await teacherAPI.getAssignments(user.id);\n setAssignments(data.assignments || []);\n } catch {}\n };\n\n const loadExams = async () => {\n try {\n const data = await teacherAPI.getExams(user.id);\n setExams(data.exams || []);\n } catch {}\n };\n\n const loadSubmissions = async (aid: number) => {\n try {\n const data = await teacherAPI.getSubmissions(aid);\n setSubmissions(data.submissions || []);\n } catch {}\n };\n\n const handleCreateAssignment = async () => {\n setLoading(true); setMsg(\"\");\n try {\n await teacherAPI.createAssignment({ ...form, teacher_id: user.id });\n setMsg(\"✅ تم إنشاء الواجب بنجاح\");\n setForm({});\n loadAssignments();\n } catch (e: any) { setMsg(\"❌ \" + e.message); }\n setLoading(false);\n };\n\n const addQuestion = () => {\n if (!newQ.question.trim()) return;\n setExamForm((prev: any) => ({ ...prev, questions: [...prev.questions, { ...newQ }] }));\n setNewQ({ question: \"\", options: [\"\", \"\", \"\", \"\"], correct: 0 });\n };\n\n const handleCreateExam = async () => {\n if (examForm.questions.length === 0) { setMsg(\"❌ أضف سؤالاً واحداً على الأقل\"); return; }\n setLoading(true); setMsg(\"\");\n try {\n await teacherAPI.createExam({\n teacher_id: user.id, title: examForm.title, subject: examForm.subject,\n grade: examForm.grade, duration: examForm.duration, questions: examForm.questions,\n });\n setMsg(\"✅ تم إنشاء الاختبار\");\n setExamForm({ questions: [], duration: 30 });\n loadExams();\n } catch (e: any) { setMsg(\"❌ \" + e.message); }\n setLoading(false);\n };\n\n const handleGrade = async (subId: number, grade: number) => {\n try {\n await teacherAPI.gradeSubmission(subId, grade);\n if (selectedAssignment) loadSubmissions(selectedAssignment.id);\n } catch {}\n };\n\n const handleDeleteAssignment = async (id: number) => {\n if (!confirm(\"حذف الواجب؟\")) return;\n try { await teacherAPI.deleteAssignment(id); loadAssignments(); } catch {}\n };\n\n const handleDeleteExam = async (id: number) => {\n if (!confirm(\"حذف الاختبار؟\")) return;\n try { await teacherAPI.deleteExam(id); loadExams(); } catch {}\n };\n\n return (\n

\n setSidebarOpen(false)} user={user}\n items={NAV_ITEMS} active={page} onNav={setPage} onLogout={onLogout} />\n\n {/* Header */}\n

\n 👨‍🏫\n

لوحة المعلم

{user.name}

\n \n

\n\n

\n {msg && (\n

\n {msg}\n

\n )}\n\n {/* Assignments list */}\n {page === \"assignments\" && !selectedAssignment && (\n

📝 واجباتي ({assignments.length})

\n {assignments.length === 0 ? (\n

📝

لم تنشئ واجبات بعد

\n \n

\n ) : (\n

\n {assignments.map(a => (\n

{ setSelectedAssignment(a); loadSubmissions(a.id); }} className=\"cursor-pointer flex-1\">\n

{a.title}

{a.subject} • {a.grade}

\n {a.due_date &&

📅 {a.due_date}

}\n

\n \n

\n ))}\n

\n )}\n

\n )}\n\n {/* Submissions view */}\n {page === \"assignments\" && selectedAssignment && (\n

\n \n

{selectedAssignment.title}

{selectedAssignment.subject} • {selectedAssignment.grade}

التسليمات ({submissions.length})

\n {submissions.length === 0 ? (\n

لا توجد تسليمات بعد

\n ) : (\n

\n {submissions.map(s => (\n

\n {s.student_name}\n {s.graded ? (\n {s.grade_value}/100\n ) : (\n لم يُقيّم\n )}\n

\n {s.content &&

{s.content}

}\n {s.note &&

💬 {s.note}

}\n {!s.graded && (\n

\n {[100, 90, 80, 70, 60, 50].map(g => (\n \n ))}\n

\n )}\n

\n ))}\n

\n )}\n

\n )}\n\n {/* Create assignment */}\n {page === \"create\" && (\n

➕ إنشاء واجب جديد

\n setForm({ ...form, title: e.target.value })} />\n \n \n

setForm({ ...form, description: e.target.value })} />\n              <input placeholder=\"رقم الصفحة (اختياري)\" value={form.page || \"\"}\n                className=\"w-full p-3.5 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition\"\n                onChange={e => setForm({ ...form, page: e.target.value })} />\n              <input placeholder=\"السؤال (اختياري)\" value={form.question || \"\"}\n                className=\"w-full p-3.5 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition\"\n                onChange={e => setForm({ ...form, question: e.target.value })} />\n              <input type=\"date\" value={form.due_date || \"\"}\n                className=\"w-full p-3.5 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition\"\n                onChange={e => setForm({ ...form, due_date: e.target.value })} />\n              <button onClick={handleCreateAssignment} disabled={loading || !form.title || !form.subject || !form.grade}\n                className=\"w-full p-3.5 bg-black text-white rounded-xl text-sm font-medium hover:bg-gray-800 transition disabled:opacity-50\">\n                {loading ? \"جاري الإنشاء...\" : \"إنشاء الواجب\"}\n              </button>\n            </div>\n          </div>\n        )}\n\n        {/* Exams list */}\n        {page === \"exams\" && (\n          <div>\n            <h2 className=\"text-lg font-medium mb-4\">📋 اختباراتي ({exams.length})</h2>\n            {exams.length === 0 ? (\n              <div className=\"text-center py-12 text-gray-400\">\n                <div className=\"text-4xl mb-3\">📋</div>\n                <p>لم تنشئ اختبارات بعد</p>\n                <button onClick={() => setPage(\"create-exam\")} className=\"mt-3 px-4 py-2 bg-black text-white rounded-xl text-sm\">إنشاء اختبار</button>\n              </div>\n            ) : (\n              <div className=\"space-y-3\">\n                {exams.map(e => (\n                  <div key={e.id} className=\"bg-white rounded-xl p-4 shadow-sm flex items-center justify-between\">\n                    <div>\n                      <h3 className=\"font-medium text-sm\">{e.title}</h3>\n                      <p className=\"text-gray-400 text-xs mt-1\">{e.subject} • {e.grade} • {e.duration} دقيقة</p>\n                    </div>\n                    <button onClick={() => handleDeleteExam(e.id)}\n                      className=\"w-8 h-8 rounded-lg bg-red-50 text-red-400 flex items-center justify-center text-xs\">\n                      <i className=\"fas fa-trash\"></i>\n                    </button>\n                  </div>\n                ))}\n              </div>\n            )}\n          </div>\n        )}\n\n        {/* Create exam */}\n        {page === \"create-exam\" && (\n          <div>\n            <h2 className=\"text-lg font-medium mb-4\">📄 إنشاء اختبار جديد</h2>\n            <div className=\"space-y-3\">\n              <input placeholder=\"عنوان الاختبار\" value={examForm.title || \"\"}\n                className=\"w-full p-3.5 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition\"\n                onChange={e => setExamForm({ ...examForm, title: e.target.value })} />\n              <select value={examForm.subject || \"\"} onChange={e => setExamForm({ ...examForm, subject: e.target.value })}\n                className=\"w-full p-3.5 border border-gray-200 rounded-xl text-sm bg-white focus:outline-none focus:border-black\">\n                <option value=\"\" disabled>اختر المادة</option>\n                {SUBJECTS.map(s => <option key={s} value={s}>{s}</option>)}\n              </select>\n              <select value={examForm.grade || \"\"} onChange={e => setExamForm({ ...examForm, grade: e.target.value })}\n                className=\"w-full p-3.5 border border-gray-200 rounded-xl text-sm bg-white focus:outline-none focus:border-black\">\n                <option value=\"\" disabled>اختر الصف</option>\n                {GRADES.map(g => <option key={g} value={g}>{g}</option>)}\n              </select>\n              <input type=\"number\" placeholder=\"المدة (دقائق)\" value={examForm.duration}\n                className=\"w-full p-3.5 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition\"\n                onChange={e => setExamForm({ ...examForm, duration: parseInt(e.target.value) || 30 })} />\n\n              {/* Added questions */}\n              {examForm.questions.length > 0 && (\n                <div className=\"bg-gray-50 rounded-xl p-3\">\n                  <p className=\"text-xs font-medium text-gray-500 mb-2\">الأسئلة ({examForm.questions.length}):</p>\n                  {examForm.questions.map((q: any, i: number) => (\n                    <div key={i} className=\"bg-white rounded-lg p-2 mb-1 text-xs\">\n                      <span className=\"font-medium\">{i + 1}.</span> {q.question}\n                    </div>\n                  ))}\n                </div>\n              )}\n\n              {/* Add question */}\n              <div className=\"bg-white rounded-xl p-4 border border-gray-200\">\n                <p className=\"text-sm font-medium mb-3\">➕ إضافة سؤال</p>\n                <input placeholder=\"نص السؤال\" value={newQ.question}\n                  className=\"w-full p-3 border border-gray-200 rounded-xl text-sm mb-2 focus:outline-none focus:border-black\"\n                  onChange={e => setNewQ({ ...newQ, question: e.target.value })} />\n                {newQ.options.map((opt, i) => (\n                  <div key={i} className=\"flex items-center gap-2 mb-1.5\">\n                    <button onClick={() => setNewQ({ ...newQ, correct: i })}\n                      className={`w-7 h-7 rounded-full flex items-center justify-center text-xs ${newQ.correct === i ? \"bg-green-500 text-white\" : \"bg-gray-100\"}`}>\n                      {newQ.correct === i ? \"✓\" : String.fromCharCode(1571 + i)}\n                    </button>\n                    <input placeholder={`الخيار ${i + 1}`} value={opt}\n                      className=\"flex-1 p-2.5 border border-gray-200 rounded-lg text-sm focus:outline-none focus:border-black\"\n                      onChange={e => {\n                        const opts = [...newQ.options];\n                        opts[i] = e.target.value;\n                        setNewQ({ ...newQ, options: opts });\n                      }} />\n                  </div>\n                ))}\n                <button onClick={addQuestion}\n                  className=\"w-full mt-2 p-2.5 bg-gray-100 text-gray-700 rounded-xl text-sm hover:bg-gray-200 transition\">\n                  إضافة السؤال\n                </button>\n              </div>\n\n              <button onClick={handleCreateExam} disabled={loading || !examForm.title || !examForm.subject || !examForm.grade}\n                className=\"w-full p-3.5 bg-black text-white rounded-xl text-sm font-medium hover:bg-gray-800 transition disabled:opacity-50\">\n                {loading ? \"جاري الإنشاء...\" : `إنشاء الاختبار (${examForm.questions.length} سؤال)`}\n              </button>\n            </div>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n",[],[143,187,199],"ff905f7a-3fdb-11f1-b4bc-42b51c65c3df","StudentDashboard.tsx","568e6cd2-3fdb-11f1-bffe-42b51c65c3df",21,["D",1777034954298],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect, useRef } from \"https://esm.sh/react@18.2.0\";\nimport { studentAPI, aiAPI, messagesAPI } from \"../api.ts\";\nimport Sidebar from \"./Sidebar.tsx\";\n\nconst RANKS = [\n  { min: 0, max: 500, name: \"مجند نشمي\", icon: \"🔰\" },\n  { min: 500, max: 1000, name: \"عريف نشمي\", icon: \"⭐\" },\n  { min: 1000, max: 1500, name: \"وكيل نشمي\", icon: \"🌟\" },\n  { min: 1500, max: 2500, name: \"رقيب نشمي\", icon: \"💫\" },\n  { min: 2500, max: 4000, name: \"ملازم نشمي\", icon: \"🎖️\" },\n  { min: 4000, max: 6000, name: \"نقيب نشمي\", icon: \"🏅\" },\n  { min: 6000, max: 9000, name: \"رائد نشمي\", icon: \"🥇\" },\n  { min: 9000, max: 13000, name: \"عقيد نشمي\", icon: \"👑\" },\n  { min: 13000, max: Infinity, name: \"لواء نشمي\", icon: \"🏆\" },\n];\n\nfunction getRank(points: number) {\n  return RANKS.find(r => points >= r.min && points < r.max) || RANKS[0];\n}\n\nconst NAV_ITEMS = [\n  { id: \"home\", label: \"الرئيسية\", icon: \"🏠\" },\n  { id: \"assignments\", label: \"الواجبات\", icon: \"📝\" },\n  { id: \"exams\", label: \"الاختبارات\", icon: \"📋\" },\n  { id: \"grades\", label: \"درجاتي\", icon: \"📊\" },\n  { id: \"ai-chat\", label: \"نشمي AI\", icon: \"🤖\" },\n  { id: \"challenge\", label: \"تحدي 60 ثانية\", icon: \"⚡\" },\n  { id: \"chat\", label: \"المحادثات\", icon: \"💬\" },\n  { id: \"settings\", label: \"الإعدادات\", icon: \"⚙️\" },\n];\n\nexport default function StudentDashboard({ user, onLogout, setUser }: { user: any; onLogout: () => void; setUser: (u: any) => void }) {\n  const [page, setPage] = useState(\"home\");\n  const [sidebarOpen, setSidebarOpen] = useState(false);\n\n  return (\n    <div className=\"min-h-screen bg-gray-50\">\n      <Sidebar open={sidebarOpen} onClose={() => setSidebarOpen(false)} user={user}\n        items={NAV_ITEMS} active={page} onNav={setPage} onLogout={onLogout} />\n\n      {/* Header */}\n      <div className=\"bg-black text-white p-4 flex items-center justify-between sticky top-0 z-30\">\n        <div className=\"flex items-center gap-3\">\n          <span className=\"text-xl\">🤖</span>\n          <div>\n            <h1 className=\"text-sm font-medium\">نشمي AI</h1>\n            <p className=\"text-white/50 text-xs\">أهلاً {user.name}</p>\n          </div>\n        </div>\n        <button onClick={() => setSidebarOpen(true)} className=\"w-10 h-10 rounded-xl bg-white/10 flex items-center justify-center\">\n          <i className=\"fas fa-bars text-sm\"></i>\n        </button>\n      </div>\n\n      <div className=\"p-4 max-w-2xl mx-auto fade-in\">\n        {page === \"home\" && <HomePage user={user} onNav={setPage} />}\n        {page === \"assignments\" && <AssignmentsPage user={user} />}\n        {page === \"exams\" && <ExamsPage user={user} setUser={setUser} />}\n        {page === \"grades\" && <GradesPage user={user} />}\n        {page === \"ai-chat\" && <AIChatPage />}\n        {page === \"challenge\" && <ChallengePage user={user} setUser={setUser} />}\n        {page === \"chat\" && <ChatPage user={user} />}\n        {page === \"settings\" && <SettingsPage user={user} />}\n      </div>\n    </div>\n  );\n}\n\nfunction HomePage({ user, onNav }: { user: any; onNav: (id: string) => void }) {\n  const rank = getRank(user.points || 0);\n  const features = [\n    { id: \"assignments\", icon: \"📝\", label: \"الواجبات\", desc: \"واجباتك المدرسية\" },\n    { id: \"exams\", icon: \"📋\", label: \"الاختبارات\", desc: \"اختبر نفسك\" },\n    { id: \"ai-chat\", icon: \"🤖\", label: \"نشمي AI\", desc: \"مساعدك الذكي\" },\n    { id: \"challenge\", icon: \"⚡\", label: \"تحدي 60 ثانية\", desc: \"اربح نقاط\" },\n    { id: \"grades\", icon: \"📊\", label: \"درجاتي\", desc: \"متابعة درجاتك\" },\n    { id: \"chat\", icon: \"💬\", label: \"المحادثات\", desc: \"تواصل مع أصدقائك\" },\n  ];\n\n  return (\n    <div>\n      {/* Rank card */}\n      <div className=\"bg-black text-white rounded-2xl p-5 mb-6\">\n        <div className=\"flex items-center justify-between mb-3\">\n          <div>\n            <p className=\"text-white/50 text-xs\">رتبتك الحالية</p>\n            <h2 className=\"text-lg font-medium\">{rank.icon} {rank.name}</h2>\n          </div>\n          <div className=\"text-left\">\n            <p className=\"text-2xl font-bold\">{user.points || 0}</p>\n            <p className=\"text-white/50 text-xs\">نقطة</p>\n          </div>\n        </div>\n      </div>\n\n      {/* Quick access */}\n      <div className=\"grid grid-cols-2 gap-3\">\n        {features.map(f => (\n          <button key={f.id} onClick={() => onNav(f.id)}\n            className=\"bg-white rounded-xl p-4 text-center shadow-sm hover:shadow-md transition\">\n            <div className=\"text-3xl mb-2\">{f.icon}</div>\n            <h3 className=\"text-sm font-medium\">{f.label}</h3>\n            <p className=\"text-gray-400 text-xs mt-0.5\">{f.desc}</p>\n          </button>\n        ))}\n      </div>\n    </div>\n  );\n}\n\nfunction AssignmentsPage({ user }: { user: any }) {\n  const [assignments, setAssignments] = useState<any[]>([]);\n  const [loading, setLoading] = useState(true);\n  const [selected, setSelected] = useState<any>(null);\n  const [content, setContent] = useState(\"\");\n  const [submitting, setSubmitting] = useState(false);\n  const [msg, setMsg] = useState(\"\");\n\n  useEffect(() => {\n    if (user.grade) loadAssignments();\n    else setLoading(false);\n  }, []);\n\n  const loadAssignments = async () => {\n    try {\n      const data = await studentAPI.getAssignments(user.grade);\n      const withStatus = await Promise.all(\n        (data.assignments || []).map(async (a: any) => {\n          const check = await studentAPI.checkSubmission(a.id, user.id);\n          return { ...a, submitted: check.submitted, submission: check.submission };\n        })\n      );\n      setAssignments(withStatus);\n    } catch {}\n    setLoading(false);\n  };\n\n  const handleSubmit = async () => {\n    if (!content.trim()) return;\n    setSubmitting(true); setMsg(\"\");\n    try {\n      await studentAPI.submitAssignment({ assignment_id: selected.id, student_id: user.id, content });\n      setMsg(\"✅ تم تسليم الواجب بنجاح!\");\n      setContent(\"\");\n      loadAssignments();\n    } catch (e: any) { setMsg(\"❌ \" + e.message); }\n    setSubmitting(false);\n  };\n\n  if (selected) {\n    return (\n      <div>\n        <button onClick={() => { setSelected(null); setMsg(\"\"); }} className=\"text-sm text-gray-500 mb-4 flex items-center gap-1\">\n          <i className=\"fas fa-arrow-right\"></i> العودة\n        </button>\n        <h2 className=\"text-lg font-medium\">{selected.title}</h2>\n        <p className=\"text-gray-400 text-xs mb-1\">{selected.subject} • {selected.teacher_name}</p>\n        {selected.description && <p className=\"text-gray-600 text-sm mb-3\">{selected.description}</p>}\n        {selected.page && <p className=\"text-sm mb-1\">📄 الصفحة: {selected.page}</p>}\n        {selected.question && <p className=\"text-sm mb-3\">❓ {selected.question}</p>}\n\n        {selected.submitted ? (\n          <div className=\"bg-green-50 rounded-xl p-4 text-center\">\n            <p className=\"text-green-700 text-sm\">✅ تم تسليم هذا الواجب</p>\n            {selected.submission?.graded ? (\n              <p className=\"text-green-600 font-bold mt-1\">{selected.submission.grade_value}/100</p>\n            ) : (\n              <p className=\"text-gray-400 text-xs mt-1\">بانتظار التقييم</p>\n            )}\n          </div>\n        ) : (\n          <div className=\"space-y-3\">\n            <textarea placeholder=\"اكتب إجابتك هنا...\" value={content} rows={5}\n              className=\"w-full p-3.5 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition resize-none\"\n              onChange={e => setContent(e.target.value)} />\n            {msg && <p className={`text-sm text-center ${msg.startsWith(\"✅\") ? \"text-green-600\" : \"text-red-500\"}`}>{msg}</p>}\n            <button onClick={handleSubmit} disabled={submitting || !content.trim()}\n              className=\"w-full p-3.5 bg-black text-white rounded-xl text-sm font-medium hover:bg-gray-800 transition disabled:opacity-50\">\n              {submitting ? \"جاري التسليم...\" : \"تسليم الواجب\"}\n            </button>\n          </div>\n        )}\n      </div>\n    );\n  }\n\n  return (\n    <div>\n      <h2 className=\"text-lg font-medium mb-4\">📝 الواجبات</h2>\n      {loading ? (\n        <div className=\"space-y-3\">{[1,2,3].map(i => <div key={i} className=\"h-20 shimmer rounded-xl\"></div>)}</div>\n      ) : assignments.length === 0 ? (\n        <div className=\"text-center py-12 text-gray-400\">\n          <div className=\"text-4xl mb-3\">📝</div>\n          <p>لا توجد واجبات حالياً</p>\n        </div>\n      ) : (\n        <div className=\"space-y-3\">\n          {assignments.map(a => (\n            <div key={a.id} onClick={() => setSelected(a)}\n              className=\"bg-white rounded-xl p-4 shadow-sm cursor-pointer hover:shadow-md transition\">\n              <div className=\"flex items-center justify-between\">\n                <div>\n                  <h3 className=\"font-medium text-sm\">{a.title}</h3>\n                  <p className=\"text-gray-400 text-xs mt-1\">{a.subject} • {a.teacher_name}</p>\n                </div>\n                {a.submitted ? (\n                  <span className=\"px-2 py-0.5 rounded-lg bg-green-50 text-green-600 text-xs\">مسلّم ✓</span>\n                ) : (\n                  <span className=\"px-2 py-0.5 rounded-lg bg-orange-50 text-orange-600 text-xs\">لم يُسلّم</span>\n                )}\n              </div>\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction ExamsPage({ user, setUser }: { user: any; setUser: (u: any) => void }) {\n  const [exams, setExams] = useState<any[]>([]);\n  const [loading, setLoading] = useState(true);\n  const [activeExam, setActiveExam] = useState<any>(null);\n  const [answers, setAnswers] = useState<number[]>([]);\n  const [timeLeft, setTimeLeft] = useState(0);\n  const [result, setResult] = useState<any>(null);\n  const timerRef = useRef<any>(null);\n\n  useEffect(() => {\n    if (user.grade) loadExams();\n    else setLoading(false);\n  }, []);\n\n  const loadExams = async () => {\n    try {\n      const data = await studentAPI.getExams(user.grade);\n      const withStatus = await Promise.all(\n        (data.exams || []).map(async (e: any) => {\n          const check = await studentAPI.checkExam(e.id, user.id);\n          return { ...e, taken: check.taken, submission: check.submission };\n        })\n      );\n      setExams(withStatus);\n    } catch {}\n    setLoading(false);\n  };\n\n  const startExam = (exam: any) => {\n    const questions = typeof exam.questions === \"string\" ? JSON.parse(exam.questions) : exam.questions;\n    setActiveExam({ ...exam, questions });\n    setAnswers(new Array(questions.length).fill(-1));\n    setTimeLeft(exam.duration * 60);\n    setResult(null);\n    timerRef.current = setInterval(() => {\n      setTimeLeft(prev => {\n        if (prev <= 1) { clearInterval(timerRef.current); return 0; }\n        return prev - 1;\n      });\n    }, 1000);\n  };\n\n  const submitExam = async () => {\n    if (timerRef.current) clearInterval(timerRef.current);\n    const questions = activeExam.questions;\n    let correct = 0;\n    answers.forEach((a, i) => { if (a === questions[i].correct) correct++; });\n    const score = Math.round((correct / questions.length) * 100);\n    try {\n      const res = await studentAPI.submitExam({ exam_id: activeExam.id, student_id: user.id, answers, score });\n      setResult({ score, correct, total: questions.length, pointsEarned: res.pointsEarned });\n      setUser({ ...user, points: (user.points || 0) + (res.pointsEarned || 0) });\n    } catch {}\n  };\n\n  useEffect(() => { if (timeLeft === 0 && activeExam && !result) submitExam(); }, [timeLeft]);\n  useEffect(() => { return () => { if (timerRef.current) clearInterval(timerRef.current); }; }, []);\n\n  if (result) {\n    return (\n      <div className=\"text-center py-8\">\n        <div className=\"text-6xl mb-4\">{result.score >= 70 ? \"🎉\" : result.score >= 50 ? \"👍\" : \"💪\"}</div>\n        <h2 className=\"text-2xl font-bold mb-2\">{result.score}%</h2>\n        <p className=\"text-gray-500 mb-1\">{result.correct} من {result.total} صحيح</p>\n        <p className=\"text-green-600 text-sm mb-6\">+{result.pointsEarned} نقطة ⭐</p>\n        <button onClick={() => { setActiveExam(null); setResult(null); loadExams(); }}\n          className=\"px-6 py-3 bg-black text-white rounded-xl text-sm\">العودة</button>\n      </div>\n    );\n  }\n\n  if (activeExam) {\n    const mins = Math.floor(timeLeft / 60);\n    const secs = timeLeft % 60;\n    return (\n      <div>\n        <div className=\"flex items-center justify-between mb-4\">\n          <h2 className=\"text-sm font-medium\">{activeExam.title}</h2>\n          <span className={`px-3 py-1 rounded-lg text-sm font-mono ${timeLeft < 30 ? \"bg-red-100 text-red-600\" : \"bg-gray-100\"}`}>\n            {mins}:{secs.toString().padStart(2, \"0\")}\n          </span>\n        </div>\n        <div className=\"space-y-4\">\n          {activeExam.questions.map((q: any, qi: number) => (\n            <div key={qi} className=\"bg-white rounded-xl p-4 shadow-sm\">\n              <p className=\"font-medium text-sm mb-3\">{qi + 1}. {q.question}</p>\n              <div className=\"space-y-2\">\n                {q.options.map((opt: string, oi: number) => (\n                  <button key={oi} onClick={() => { const a = [...answers]; a[qi] = oi; setAnswers(a); }}\n                    className={`w-full text-right p-3 rounded-xl text-sm transition ${\n                      answers[qi] === oi ? \"bg-black text-white\" : \"bg-gray-50 hover:bg-gray-100\"\n                    }`}>\n                    {opt}\n                  </button>\n                ))}\n              </div>\n            </div>\n          ))}\n        </div>\n        <button onClick={submitExam}\n          className=\"w-full mt-4 p-3.5 bg-black text-white rounded-xl text-sm font-medium hover:bg-gray-800 transition\">\n          إنهاء الاختبار\n        </button>\n      </div>\n    );\n  }\n\n  return (\n    <div>\n      <h2 className=\"text-lg font-medium mb-4\">📋 الاختبارات</h2>\n      {loading ? (\n        <div className=\"space-y-3\">{[1,2,3].map(i => <div key={i} className=\"h-20 shimmer rounded-xl\"></div>)}</div>\n      ) : exams.length === 0 ? (\n        <div className=\"text-center py-12 text-gray-400\">\n          <div className=\"text-4xl mb-3\">📋</div>\n          <p>لا توجد اختبارات حالياً</p>\n        </div>\n      ) : (\n        <div className=\"space-y-3\">\n          {exams.map(e => (\n            <div key={e.id} className=\"bg-white rounded-xl p-4 shadow-sm\">\n              <div className=\"flex items-center justify-between\">\n                <div>\n                  <h3 className=\"font-medium text-sm\">{e.title}</h3>\n                  <p className=\"text-gray-400 text-xs mt-1\">{e.subject} • {e.teacher_name} • {e.duration} دقيقة</p>\n                </div>\n                {e.taken ? (\n                  <span className=\"px-2 py-0.5 rounded-lg bg-green-50 text-green-600 text-xs\">{e.submission?.score}%</span>\n                ) : (\n                  <button onClick={() => startExam(e)}\n                    className=\"px-3 py-1.5 bg-black text-white rounded-xl text-xs\">ابدأ</button>\n                )}\n              </div>\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction GradesPage({ user }: { user: any }) {\n  const [grades, setGrades] = useState<any>({ assignmentGrades: [], examGrades: [] });\n  const [loading, setLoading] = useState(true);\n\n  useEffect(() => {\n    (async () => {\n      try {\n        const data = await studentAPI.getGrades(user.id);\n        setGrades(data);\n      } catch {}\n      setLoading(false);\n    })();\n  }, []);\n\n  if (loading) return <div className=\"space-y-3\">{[1,2,3].map(i => <div key={i} className=\"h-16 shimmer rounded-xl\"></div>)}</div>;\n\n  const all = [\n    ...grades.assignmentGrades.map((g: any) => ({ ...g, type: \"واجب\", score: g.grade_value })),\n    ...grades.examGrades.map((g: any) => ({ ...g, type: \"اختبار\", score: g.score })),\n  ];\n\n  return (\n    <div>\n      <h2 className=\"text-lg font-medium mb-4\">📊 درجاتي</h2>\n      {all.length === 0 ? (\n        <div className=\"text-center py-12 text-gray-400\">\n          <div className=\"text-4xl mb-3\">📊</div>\n          <p>لا توجد درجات بعد</p>\n        </div>\n      ) : (\n        <div className=\"space-y-2\">\n          {all.map((g, i) => (\n            <div key={i} className=\"bg-white rounded-xl p-3 shadow-sm flex items-center justify-between\">\n              <div>\n                <h3 className=\"font-medium text-sm\">{g.title}</h3>\n                <p className=\"text-gray-400 text-xs\">{g.subject} • {g.type}</p>\n              </div>\n              <span className={`text-lg font-bold ${g.score >= 70 ? \"text-green-600\" : g.score >= 50 ? \"text-yellow-600\" : \"text-red-500\"}`}>\n                {g.score}%\n              </span>\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction AIChatPage() {\n  const [messages, setMessages] = useState<any[]>([]);\n  const [input, setInput] = useState(\"\");\n  const [loading, setLoading] = useState(false);\n  const bottomRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => { bottomRef.current?.scrollIntoView({ behavior: \"smooth\" }); }, [messages]);\n\n  const send = async () => {\n    if (!input.trim() || loading) return;\n    const userMsg = input.trim();\n    setInput(\"\");\n    setMessages(prev => [...prev, { role: \"user\", content: userMsg }]);\n    setLoading(true);\n    try {\n      const history = messages.map(m => ({ role: m.role, content: m.content }));\n      const data = await aiAPI.chat(userMsg, history);\n      setMessages(prev => [...prev, { role: \"assistant\", content: data.response }]);\n    } catch {\n      setMessages(prev => [...prev, { role: \"assistant\", content: \"عذراً، حدث خطأ. حاول مرة أخرى.\" }]);\n    }\n    setLoading(false);\n  };\n\n  return (\n    <div className=\"flex flex-col\" style={{ height: \"calc(100vh - 140px)\" }}>\n      <h2 className=\"text-lg font-medium mb-3\">🤖 نشمي AI</h2>\n      <div className=\"flex-1 overflow-y-auto space-y-3 mb-3\">\n        {messages.length === 0 && (\n          <div className=\"text-center py-8 text-gray-400\">\n            <div className=\"text-5xl mb-3\">🤖</div>\n            <p className=\"text-sm\">أهلاً! أنا نشمي، مساعدك الذكي</p>\n            <p className=\"text-xs mt-1\">اسألني عن أي مادة من المنهاج الأردني</p>\n          </div>\n        )}\n        {messages.map((m, i) => (\n          <div key={i} className={`flex ${m.role === \"user\" ? \"justify-start\" : \"justify-end\"}`}>\n            <div className={`max-w-[80%] p-3 rounded-2xl text-sm whitespace-pre-wrap ${\n              m.role === \"user\" ? \"bg-black text-white rounded-br-sm\" : \"bg-white shadow-sm rounded-bl-sm\"\n            }`}>\n              {m.content}\n            </div>\n          </div>\n        ))}\n        {loading && (\n          <div className=\"flex justify-end\">\n            <div className=\"bg-white shadow-sm rounded-2xl rounded-bl-sm p-3 text-sm text-gray-400\">\n              جاري التفكير...\n            </div>\n          </div>\n        )}\n        <div ref={bottomRef} />\n      </div>\n      <div className=\"flex gap-2\">\n        <input value={input} onChange={e => setInput(e.target.value)}\n          onKeyDown={e => e.key === \"Enter\" && send()}\n          placeholder=\"اكتب سؤالك...\"\n          className=\"flex-1 p-3.5 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition\" />\n        <button onClick={send} disabled={loading || !input.trim()}\n          className=\"w-12 h-12 bg-black text-white rounded-xl flex items-center justify-center disabled:opacity-50\">\n          <i className=\"fas fa-paper-plane\"></i>\n        </button>\n      </div>\n    </div>\n  );\n}\n\nfunction ChallengePage({ user, setUser }: { user: any; setUser: (u: any) => void }) {\n  const [level, setLevel] = useState<string>(\"\");\n  const [questions, setQuestions] = useState<any[]>([]);\n  const [current, setCurrent] = useState(0);\n  const [score, setScore] = useState(0);\n  const [timeLeft, setTimeLeft] = useState(60);\n  const [finished, setFinished] = useState(false);\n  const [loading, setLoading] = useState(false);\n  const timerRef = useRef<any>(null);\n\n  const startChallenge = async (lv: string) => {\n    setLevel(lv); setLoading(true);\n    try {\n      const data = await aiAPI.getChallengeQuestions(lv, 15);\n      setQuestions(data.questions || []);\n      setCurrent(0); setScore(0); setTimeLeft(60); setFinished(false);\n      timerRef.current = setInterval(() => {\n        setTimeLeft(prev => {\n          if (prev <= 1) { clearInterval(timerRef.current); return 0; }\n          return prev - 1;\n        });\n      }, 1000);\n    } catch {}\n    setLoading(false);\n  };\n\n  useEffect(() => {\n    if (timeLeft === 0 && questions.length > 0 && !finished) endChallenge();\n  }, [timeLeft]);\n\n  useEffect(() => { return () => { if (timerRef.current) clearInterval(timerRef.current); }; }, []);\n\n  const answer = (idx: number) => {\n    if (finished) return;\n    const correct = questions[current].correct === idx;\n    const pts = correct ? (level === \"easy\" ? 10 : level === \"medium\" ? 20 : 30) : 0;\n    setScore(prev => prev + pts);\n    if (current + 1 >= questions.length) {\n      endChallenge();\n    } else {\n      setCurrent(prev => prev + 1);\n    }\n  };\n\n  const endChallenge = async () => {\n    if (timerRef.current) clearInterval(timerRef.current);\n    setFinished(true);\n    if (score > 0) {\n      try {\n        const res = await studentAPI.addPoints(user.id, score);\n        setUser({ ...user, points: res.points });\n      } catch {}\n    }\n  };\n\n  if (!level) {\n    return (\n      <div className=\"text-center\">\n        <div className=\"text-5xl mb-4\">⚡</div>\n        <h2 className=\"text-xl font-bold mb-2\">تحدي الـ 60 ثانية</h2>\n        <p className=\"text-gray-500 text-sm mb-6\">أجب أكبر عدد من الأسئلة في 60 ثانية واربح نقاط!</p>\n        <div className=\"space-y-3\">\n          {[\n            { lv: \"easy\", label: \"سهل\", desc: \"10 نقاط/سؤال\", icon: \"🟢\" },\n            { lv: \"medium\", label: \"متوسط\", desc: \"20 نقطة/سؤال\", icon: \"🟡\" },\n            { lv: \"hard\", label: \"صعب\", desc: \"30 نقطة/سؤال\", icon: \"🔴\" },\n          ].map(l => (\n            <button key={l.lv} onClick={() => startChallenge(l.lv)}\n              className=\"w-full bg-white rounded-xl p-4 shadow-sm flex items-center gap-4 hover:shadow-md transition\">\n              <span className=\"text-2xl\">{l.icon}</span>\n              <div className=\"text-right\">\n                <h3 className=\"font-medium\">{l.label}</h3>\n                <p className=\"text-gray-400 text-xs\">{l.desc}</p>\n              </div>\n            </button>\n          ))}\n        </div>\n      </div>\n    );\n  }\n\n  if (loading) {\n    return <div className=\"text-center py-12\"><div className=\"text-4xl mb-3 pulse-anim\">⚡</div><p className=\"text-gray-400\">جاري تحميل الأسئلة...</p></div>;\n  }\n\n  if (finished) {\n    return (\n      <div className=\"text-center py-8\">\n        <div className=\"text-6xl mb-4\">{score >= 100 ? \"🏆\" : score >= 50 ? \"⭐\" : \"💪\"}</div>\n        <h2 className=\"text-3xl font-bold mb-2\">{score} نقطة</h2>\n        <p className=\"text-gray-500 mb-6\">{current} سؤال أُجيب عليه</p>\n        <div className=\"space-y-2\">\n          <button onClick={() => startChallenge(level)} className=\"w-full px-6 py-3 bg-black text-white rounded-xl text-sm\">إعادة التحدي</button>\n          <button onClick={() => setLevel(\"\")} className=\"w-full px-6 py-3 bg-gray-100 text-gray-700 rounded-xl text-sm\">تغيير المستوى</button>\n        </div>\n      </div>\n    );\n  }\n\n  const q = questions[current];\n  return (\n    <div>\n      <div className=\"flex items-center justify-between mb-4\">\n        <span className=\"text-sm font-medium\">{current + 1}/{questions.length}</span>\n        <span className={`px-3 py-1 rounded-lg text-sm font-mono font-bold ${timeLeft < 10 ? \"bg-red-100 text-red-600\" : \"bg-gray-100\"}`}>\n          {timeLeft}s\n        </span>\n        <span className=\"text-sm font-medium\">⭐ {score}</span>\n      </div>\n      {/* Progress bar */}\n      <div className=\"w-full bg-gray-200 rounded-full h-1.5 mb-4\">\n        <div className=\"bg-black rounded-full h-1.5 transition-all\" style={{ width: `${(timeLeft / 60) * 100}%` }}></div>\n      </div>\n      <div className=\"bg-white rounded-xl p-5 shadow-sm mb-4\">\n        <p className=\"font-medium text-center\">{q.question}</p>\n      </div>\n      <div className=\"space-y-2\">\n        {q.options.map((opt: string, i: number) => (\n          <button key={i} onClick={() => answer(i)}\n            className=\"w-full p-3.5 bg-white rounded-xl text-sm shadow-sm hover:bg-black hover:text-white transition text-right\">\n            {opt}\n          </button>\n        ))}\n      </div>\n    </div>\n  );\n}\n\nfunction ChatPage({ user }: { user: any }) {\n  const [friends, setFriends] = useState<any[]>([]);\n  const [selectedFriend, setSelectedFriend] = useState<any>(null);\n  const [chatMessages, setChatMessages] = useState<any[]>([]);\n  const [input, setInput] = useState(\"\");\n  const [friendId, setFriendId] = useState(\"\");\n  const [msg, setMsg] = useState(\"\");\n  const bottomRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => { loadFriends(); }, []);\n  useEffect(() => { bottomRef.current?.scrollIntoView({ behavior: \"smooth\" }); }, [chatMessages]);\n\n  const loadFriends = async () => {\n    try {\n      const data = await messagesAPI.getFriends(user.id);\n      setFriends(data.friends || []);\n    } catch {}\n  };\n\n  const loadChat = async (friend: any) => {\n    setSelectedFriend(friend);\n    try {\n      const data = await messagesAPI.getConversation(user.id, friend.id);\n      setChatMessages(data.messages || []);\n    } catch {}\n  };\n\n  const sendMessage = async () => {\n    if (!input.trim()) return;\n    try {\n      await messagesAPI.send({ sender_id: user.id, receiver_id: selectedFriend.id, content: input });\n      setInput(\"\");\n      loadChat(selectedFriend);\n    } catch {}\n  };\n\n  const addFriend = async () => {\n    if (!friendId.trim()) return;\n    setMsg(\"\");\n    try {\n      await messagesAPI.addFriend(user.id, parseInt(friendId));\n      setMsg(\"✅ تمت الإضافة\");\n      setFriendId(\"\");\n      loadFriends();\n    } catch (e: any) { setMsg(\"❌ \" + e.message); }\n  };\n\n  if (selectedFriend) {\n    return (\n      <div className=\"flex flex-col\" style={{ height: \"calc(100vh - 140px)\" }}>\n        <div className=\"flex items-center gap-3 mb-3\">\n          <button onClick={() => setSelectedFriend(null)} className=\"w-8 h-8 rounded-lg bg-gray-100 flex items-center justify-center\">\n            <i className=\"fas fa-arrow-right text-xs\"></i>\n          </button>\n          <h3 className=\"font-medium text-sm\">{selectedFriend.name}</h3>\n        </div>\n        <div className=\"flex-1 overflow-y-auto space-y-2 mb-3\">\n          {chatMessages.map((m, i) => (\n            <div key={i} className={`flex ${m.sender_id === user.id ? \"justify-start\" : \"justify-end\"}`}>\n              <div className={`max-w-[75%] p-2.5 rounded-xl text-sm ${\n                m.sender_id === user.id ? \"bg-black text-white\" : \"bg-white shadow-sm\"\n              }`}>{m.content}</div>\n            </div>\n          ))}\n          <div ref={bottomRef} />\n        </div>\n        <div className=\"flex gap-2\">\n          <input value={input} onChange={e => setInput(e.target.value)}\n            onKeyDown={e => e.key === \"Enter\" && sendMessage()}\n            placeholder=\"اكتب رسالة...\"\n            className=\"flex-1 p-3 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black\" />\n          <button onClick={sendMessage} className=\"w-10 h-10 bg-black text-white rounded-xl flex items-center justify-center\">\n            <i className=\"fas fa-paper-plane text-xs\"></i>\n          </button>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div>\n      <h2 className=\"text-lg font-medium mb-4\">💬 المحادثات</h2>\n      {/* Add friend */}\n      <div className=\"flex gap-2 mb-4\">\n        <input placeholder=\"رقم ID الصديق\" value={friendId} onChange={e => setFriendId(e.target.value)}\n          className=\"flex-1 p-3 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black\" />\n        <button onClick={addFriend} className=\"px-4 bg-black text-white rounded-xl text-sm\">إضافة</button>\n      </div>\n      {msg && <p className={`text-sm text-center mb-3 ${msg.startsWith(\"✅\") ? \"text-green-600\" : \"text-red-500\"}`}>{msg}</p>}\n\n      {friends.length === 0 ? (\n        <div className=\"text-center py-12 text-gray-400\">\n          <div className=\"text-4xl mb-3\">💬</div>\n          <p>لا يوجد أصدقاء بعد</p>\n          <p className=\"text-xs mt-1\">أضف صديقاً بكتابة رقم الـ ID</p>\n        </div>\n      ) : (\n        <div className=\"space-y-2\">\n          {friends.map(f => (\n            <button key={f.id} onClick={() => loadChat(f)}\n              className=\"w-full bg-white rounded-xl p-3 shadow-sm flex items-center gap-3 hover:shadow-md transition\">\n              <div className=\"w-10 h-10 rounded-full bg-gray-100 flex items-center justify-center\">\n                {f.role === \"student\" ? \"👨‍🎓\" : \"👨‍🏫\"}\n              </div>\n              <div className=\"text-right\">\n                <h3 className=\"font-medium text-sm\">{f.name}</h3>\n                <p className=\"text-gray-400 text-xs\">{f.role === \"student\" ? \"طالب\" : \"معلم\"}</p>\n              </div>\n            </button>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction SettingsPage({ user }: { user: any }) {\n  const [oldPass, setOldPass] = useState(\"\");\n  const [newPass, setNewPass] = useState(\"\");\n  const [msg, setMsg] = useState(\"\");\n\n  const changePassword = async () => {\n    if (!oldPass || !newPass) return;\n    setMsg(\"\");\n    try {\n      await messagesAPI.changePassword(user.id, oldPass, newPass);\n      setMsg(\"✅ تم تغيير كلمة المرور\");\n      setOldPass(\"\"); setNewPass(\"\");\n    } catch (e: any) { setMsg(\"❌ \" + e.message); }\n  };\n\n  return (\n    <div>\n      <h2 className=\"text-lg font-medium mb-4\">⚙️ الإعدادات</h2>\n      <div className=\"bg-white rounded-xl p-4 shadow-sm mb-4\">\n        <h3 className=\"text-sm font-medium mb-1\">معلوماتك</h3>\n        <p className=\"text-gray-500 text-xs\">الاسم: {user.name}</p>\n        <p className=\"text-gray-500 text-xs\">البريد: {user.email}</p>\n        <p className=\"text-gray-500 text-xs\">الصف: {user.grade || \"-\"}</p>\n        <p className=\"text-gray-500 text-xs\">رقم ID: {user.id}</p>\n      </div>\n      <div className=\"bg-white rounded-xl p-4 shadow-sm\">\n        <h3 className=\"text-sm font-medium mb-3\">تغيير كلمة المرور</h3>\n        <div className=\"space-y-2\">\n          <input type=\"password\" placeholder=\"كلمة المرور القديمة\" value={oldPass}\n            className=\"w-full p-3 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black\"\n            onChange={e => setOldPass(e.target.value)} />\n          <input type=\"password\" placeholder=\"كلمة المرور الجديدة\" value={newPass}\n            className=\"w-full p-3 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black\"\n            onChange={e => setNewPass(e.target.value)} />\n          {msg && <p className={`text-sm text-center ${msg.startsWith(\"✅\") ? \"text-green-600\" : \"text-red-500\"}`}>{msg}</p>}\n          <button onClick={changePassword}\n            className=\"w-full p-3 bg-black text-white rounded-xl text-sm hover:bg-gray-800 transition\">\n            تغيير كلمة المرور\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n",[],[143,187,207],"f3edbfce-3fda-11f1-b5a1-42b51c65c3df","Sidebar.tsx","f3edc096-3fda-11f1-b5a1-42b51c65c3df",16,["D",1777034505293],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\n\nconst RANKS = [\n  { min: 0, max: 500, name: \"مجند نشمي\", icon: \"🔰\" },\n  { min: 500, max: 1000, name: \"عريف نشمي\", icon: \"⭐\" },\n  { min: 1000, max: 1500, name: \"وكيل نشمي\", icon: \"🌟\" },\n  { min: 1500, max: 2500, name: \"رقيب نشمي\", icon: \"💫\" },\n  { min: 2500, max: 4000, name: \"ملازم نشمي\", icon: \"🎖️\" },\n  { min: 4000, max: 6000, name: \"نقيب نشمي\", icon: \"🏅\" },\n  { min: 6000, max: 9000, name: \"رائد نشمي\", icon: \"🥇\" },\n  { min: 9000, max: 13000, name: \"عقيد نشمي\", icon: \"👑\" },\n  { min: 13000, max: Infinity, name: \"لواء نشمي\", icon: \"🏆\" },\n];\n\nfunction getRank(points: number) {\n  return RANKS.find(r => points >= r.min && points < r.max) || RANKS[0];\n}\n\ninterface SidebarProps {\n  open: boolean;\n  onClose: () => void;\n  user: any;\n  items: { id: string; label: string; icon: string }[];\n  active: string;\n  onNav: (id: string) => void;\n  onLogout: () => void;\n}\n\nexport default function Sidebar({ open, onClose, user, items, active, onNav, onLogout }: SidebarProps) {\n  const rank = getRank(user.points || 0);\n  const nextRank = RANKS[RANKS.indexOf(rank) + 1];\n  const progress = nextRank ? ((user.points || 0) - rank.min) / (nextRank.min - rank.min) * 100 : 100;\n\n  return (\n    <>\n      {/* Overlay */}\n      {open && (\n        <div className=\"fixed inset-0 bg-black/30 z-40\" onClick={onClose} />\n      )}\n      {/* Sidebar */}\n      <div\n        className={`fixed top-0 right-0 h-full w-72 bg-white shadow-2xl z-50 transition-transform duration-300 ${\n          open ? \"translate-x-0\" : \"translate-x-full\"\n        }`}\n      >\n        {/* Header */}\n        <div className=\"p-6 bg-black text-white\">\n          <button onClick={onClose} className=\"absolute top-4 left-4 text-white/70 hover:text-white\">\n            <i className=\"fas fa-times text-lg\"></i>\n          </button>\n          <div className=\"text-center\">\n            <div className=\"w-16 h-16 mx-auto rounded-full bg-white/10 flex items-center justify-center text-2xl mb-3\">\n              {user.role === \"student\" ? \"👨‍🎓\" : user.role === \"teacher\" ? \"👨‍🏫\" : \"🛡️\"}\n            </div>\n            <h3 className=\"font-medium text-lg\">{user.name}</h3>\n            <p className=\"text-white/50 text-xs mt-1\">\n              {user.role === \"student\" ? \"طالب\" : user.role === \"teacher\" ? \"معلم\" : \"مشرف\"}\n              {user.grade ? ` • ${user.grade}` : \"\"}\n            </p>\n          </div>\n          {user.role === \"student\" && (\n            <div className=\"mt-4\">\n              <div className=\"flex items-center justify-between text-xs mb-1.5\">\n                <span>{rank.icon} {rank.name}</span>\n                <span>{user.points || 0} ⭐</span>\n              </div>\n              <div className=\"w-full bg-white/20 rounded-full h-1.5\">\n                <div className=\"bg-white rounded-full h-1.5 transition-all\" style={{ width: `${Math.min(progress, 100)}%` }}></div>\n              </div>\n              {nextRank && (\n                <p className=\"text-white/40 text-[10px] mt-1 text-center\">\n                  {nextRank.min - (user.points || 0)} نقطة للترقية إلى {nextRank.name}\n                </p>\n              )}\n            </div>\n          )}\n        </div>\n\n        {/* Nav items */}\n        <div className=\"p-3 overflow-y-auto\" style={{ maxHeight: \"calc(100vh - 250px)\" }}>\n          {items.map(item => (\n            <button\n              key={item.id}\n              onClick={() => { onNav(item.id); onClose(); }}\n              className={`w-full flex items-center gap-3 px-4 py-3 rounded-xl text-sm transition mb-1 ${\n                active === item.id\n                  ? \"bg-black text-white\"\n                  : \"text-gray-700 hover:bg-gray-100\"\n              }`}\n            >\n              <span className=\"text-lg\">{item.icon}</span>\n              <span>{item.label}</span>\n            </button>\n          ))}\n        </div>\n\n        {/* Logout */}\n        <div className=\"absolute bottom-0 left-0 right-0 p-4 border-t border-gray-100\">\n          <button\n            onClick={onLogout}\n            className=\"w-full flex items-center justify-center gap-2 px-4 py-3 rounded-xl text-sm text-red-500 hover:bg-red-50 transition\"\n          >\n            <i className=\"fas fa-sign-out-alt\"></i>\n            <span>تسجيل الخروج</span>\n          </button>\n        </div>\n      </div>\n    </>\n  );\n}\n",[],[143,187,215],"e79807de-3fda-11f1-b66a-42b51c65c3df","LoginPage.tsx","e798090a-3fda-11f1-b66a-42b51c65c3df",["D",1777034484595],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport { authAPI } from \"../api.ts\";\n\nconst GRADES = [\n  \"الصف الأول\",\"الصف الثاني\",\"الصف الثالث\",\"الصف الرابع\",\"الصف الخامس\",\n  \"الصف السادس\",\"الصف السابع\",\"الصف الثامن\",\"الصف التاسع\",\"الصف العاشر\",\n  \"الأول ثانوي\",\"التوجيهي - علمي\",\"التوجيهي - أدبي\",\"التوجيهي - صناعي\",\"التوجيهي - تجاري\",\n];\n\nconst SUBJECTS = [\n  \"اللغة العربية\",\"اللغة الإنجليزية\",\"الرياضيات\",\"العلوم\",\"الفيزياء\",\"الكيمياء\",\n  \"الأحياء\",\"علوم الأرض\",\"التاريخ\",\"الجغرافيا\",\"التربية الإسلامية\",\n  \"التربية الوطنية والمدنية\",\"الحاسوب\",\"التربية الفنية\",\"التربية الرياضية\",\n];\n\nexport default function LoginPage({ onLogin }: { onLogin: (u: any) => void }) {\n  const [mode, setMode] = useState<\"login\" | \"register\">(\"login\");\n  const [regRole, setRegRole] = useState<\"student\" | \"teacher\">(\"student\");\n  const [form, setForm] = useState<any>({});\n  const [error, setError] = useState(\"\");\n  const [success, setSuccess] = useState(\"\");\n  const [loading, setLoading] = useState(false);\n  const [selectedSubjects, setSelectedSubjects] = useState<string[]>([]);\n  const [selectedGrades, setSelectedGrades] = useState<string[]>([]);\n\n  const handleLogin = async () => {\n    setError(\"\"); setLoading(true);\n    try {\n      const data = await authAPI.login(form.email, form.password);\n      onLogin(data.user);\n    } catch (e: any) {\n      setError(e.message);\n    }\n    setLoading(false);\n  };\n\n  const handleRegister = async () => {\n    setError(\"\"); setSuccess(\"\"); setLoading(true);\n    try {\n      await authAPI.register({\n        ...form,\n        role: regRole,\n        subjects: regRole === \"teacher\" ? selectedSubjects : undefined,\n        grade: regRole === \"student\" ? form.grade : selectedGrades.join(\",\"),\n      });\n      setSuccess(\"تم إنشاء الحساب بنجاح! يرجى الانتظار حتى موافقة الإدارة.\");\n      setForm({});\n    } catch (e: any) {\n      setError(e.message);\n    }\n    setLoading(false);\n  };\n\n  const toggleSubject = (s: string) => {\n    setSelectedSubjects(prev => prev.includes(s) ? prev.filter(x => x !== s) : [...prev, s]);\n  };\n\n  const toggleGrade = (g: string) => {\n    setSelectedGrades(prev => prev.includes(g) ? prev.filter(x => x !== g) : [...prev, g]);\n  };\n\n  return (\n    <div className=\"min-h-screen bg-white flex items-center justify-center p-4\">\n      <div className=\"w-full max-w-md fade-in\">\n        {/* Logo */}\n        <div className=\"text-center mb-8\">\n          <div className=\"text-6xl mb-3\">🤖</div>\n          <h1 className=\"text-4xl font-light tracking-widest text-black\">NASHMI</h1>\n          <p className=\"text-gray-400 text-sm tracking-wider mt-1\">ARTIFICIAL INTELLIGENCE</p>\n        </div>\n\n        {mode === \"login\" ? (\n          <div className=\"space-y-4\">\n            <input\n              type=\"email\" placeholder=\"البريد الإلكتروني\"\n              className=\"w-full p-4 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition\"\n              onChange={e => setForm({...form, email: e.target.value})}\n            />\n            <input\n              type=\"password\" placeholder=\"كلمة المرور\"\n              className=\"w-full p-4 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition\"\n              onChange={e => setForm({...form, password: e.target.value})}\n              onKeyDown={e => e.key === \"Enter\" && handleLogin()}\n            />\n            {error && <p className=\"text-red-500 text-sm text-center\">{error}</p>}\n            <button\n              onClick={handleLogin} disabled={loading}\n              className=\"w-full p-4 bg-black text-white rounded-xl text-sm font-medium hover:bg-gray-800 transition disabled:opacity-50\"\n            >\n              {loading ? \"جاري الدخول...\" : \"دخول\"}\n            </button>\n            <p className=\"text-center text-sm text-gray-500\">\n              ليس لديك حساب؟{\" \"}\n              <button onClick={() => { setMode(\"register\"); setError(\"\"); }} className=\"text-black font-medium underline\">\n                إنشاء حساب\n              </button>\n            </p>\n          </div>\n        ) : (\n          <div className=\"space-y-3\">\n            {/* Role toggle */}\n            <div className=\"flex rounded-xl overflow-hidden border border-gray-200\">\n              <button\n                onClick={() => setRegRole(\"student\")}\n                className={`flex-1 p-3 text-sm transition ${regRole === \"student\" ? \"bg-black text-white\" : \"bg-white text-gray-600\"}`}\n              >\n                👨‍🎓 طالب\n              </button>\n              <button\n                onClick={() => setRegRole(\"teacher\")}\n                className={`flex-1 p-3 text-sm transition ${regRole === \"teacher\" ? \"bg-black text-white\" : \"bg-white text-gray-600\"}`}\n              >\n                👨‍🏫 معلم\n              </button>\n            </div>\n\n            <input\n              placeholder=\"الاسم الكامل\"\n              className=\"w-full p-3.5 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition\"\n              onChange={e => setForm({...form, name: e.target.value})}\n            />\n            <input\n              type=\"email\" placeholder=\"البريد الإلكتروني\"\n              className=\"w-full p-3.5 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition\"\n              onChange={e => setForm({...form, email: e.target.value})}\n            />\n            <input\n              type=\"password\" placeholder=\"كلمة المرور\"\n              className=\"w-full p-3.5 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition\"\n              onChange={e => setForm({...form, password: e.target.value})}\n            />\n            <input\n              type=\"password\" placeholder=\"تأكيد كلمة المرور\"\n              className=\"w-full p-3.5 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition\"\n              onChange={e => setForm({...form, confirmPassword: e.target.value})}\n            />\n\n            {regRole === \"student\" && (\n              <select\n                className=\"w-full p-3.5 border border-gray-200 rounded-xl text-sm focus:outline-none focus:border-black transition bg-white\"\n                onChange={e => setForm({...form, grade: e.target.value})}\n                defaultValue=\"\"\n              >\n                <option value=\"\" disabled>اختر الصف</option>\n                {GRADES.map(g => <option key={g} value={g}>{g}</option>)}\n              </select>\n            )}\n\n            {regRole === \"teacher\" && (\n              <>\n                <div>\n                  <p className=\"text-xs text-gray-500 mb-2\">اختر الصفوف:</p>\n                  <div className=\"flex flex-wrap gap-1.5 max-h-24 overflow-y-auto p-2 border border-gray-200 rounded-xl\">\n                    {GRADES.map(g => (\n                      <button\n                        key={g} onClick={() => toggleGrade(g)}\n                        className={`px-2.5 py-1 rounded-lg text-xs transition ${\n                          selectedGrades.includes(g) ? \"bg-black text-white\" : \"bg-gray-100 text-gray-600\"\n                        }`}\n                      >{g}</button>\n                    ))}\n                  </div>\n                </div>\n                <div>\n                  <p className=\"text-xs text-gray-500 mb-2\">اختر المواد:</p>\n                  <div className=\"flex flex-wrap gap-1.5 max-h-24 overflow-y-auto p-2 border border-gray-200 rounded-xl\">\n                    {SUBJECTS.map(s => (\n                      <button\n                        key={s} onClick={() => toggleSubject(s)}\n                        className={`px-2.5 py-1 rounded-lg text-xs transition ${\n                          selectedSubjects.includes(s) ? \"bg-black text-white\" : \"bg-gray-100 text-gray-600\"\n                        }`}\n                      >{s}</button>\n                    ))}\n                  </div>\n                </div>\n              </>\n            )}\n\n            {error && <p className=\"text-red-500 text-sm text-center\">{error}</p>}\n            {success && (\n              <div className=\"bg-green-50 border border-green-200 rounded-xl p-3 text-center\">\n                <p className=\"text-green-700 text-sm\">✅ {success}</p>\n              </div>\n            )}\n\n            <button\n              onClick={handleRegister} disabled={loading}\n              className=\"w-full p-3.5 bg-black text-white rounded-xl text-sm font-medium hover:bg-gray-800 transition disabled:opacity-50\"\n            >\n              {loading ? \"جاري التسجيل...\" : \"إنشاء حساب\"}\n            </button>\n            <p className=\"text-center text-sm text-gray-500\">\n              لديك حساب؟{\" \"}\n              <button onClick={() => { setMode(\"login\"); setError(\"\"); setSuccess(\"\"); }} className=\"text-black font-medium underline\">\n                تسجيل الدخول\n              </button>\n            </p>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n",[],[143,187,223],"5226c05e-3fdb-11f1-bffe-42b51c65c3df","AdminDashboard.tsx","5226c112-3fdb-11f1-bffe-42b51c65c3df",17,["D",1777034663372],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { adminAPI } from \"../api.ts\";\nimport Sidebar from \"./Sidebar.tsx\";\n\nconst NAV_ITEMS = [\n  { id: \"pending\", label: \"طلبات الانتظار\", icon: \"⏳\" },\n  { id: \"users\", label: \"إدارة المستخدمين\", icon: \"👥\" },\n  { id: \"stats\", label: \"الإحصائيات\", icon: \"📊\" },\n];\n\nexport default function AdminDashboard({ user, onLogout }: { user: any; onLogout: () => void }) {\n  const [page, setPage] = useState(\"pending\");\n  const [sidebarOpen, setSidebarOpen] = useState(false);\n  const [pending, setPending] = useState<any[]>([]);\n  const [users, setUsers] = useState<any[]>([]);\n  const [loading, setLoading] = useState(false);\n\n  useEffect(() => {\n    if (page === \"pending\") loadPending();\n    if (page === \"users\") loadUsers();\n  }, [page]);\n\n  const loadPending = async () => {\n    setLoading(true);\n    try {\n      const data = await adminAPI.getPending();\n      setPending(data.users || []);\n    } catch {}\n    setLoading(false);\n  };\n\n  const loadUsers = async () => {\n    setLoading(true);\n    try {\n      const data = await adminAPI.getUsers();\n      setUsers(data.users || []);\n    } catch {}\n    setLoading(false);\n  };\n\n  const handleApprove = async (id: number) => {\n    try {\n      await adminAPI.approve(id);\n      setPending(prev => prev.filter(u => u.id !== id));\n    } catch {}\n  };\n\n  const handleReject = async (id: number) => {\n    try {\n      await adminAPI.reject(id);\n      setPending(prev => prev.filter(u => u.id !== id));\n    } catch {}\n  };\n\n  const handleDelete = async (id: number) => {\n    if (!confirm(\"هل أنت متأكد من حذف هذا المستخدم؟\")) return;\n    try {\n      await adminAPI.deleteUser(id);\n      setUsers(prev => prev.filter(u => u.id !== id));\n    } catch {}\n  };\n\n  const stats = {\n    total: users.length,\n    students: users.filter(u => u.role === \"student\").length,\n    teachers: users.filter(u => u.role === \"teacher\").length,\n    approved: users.filter(u => u.status === \"approved\").length,\n    pending: users.filter(u => u.status === \"pending\").length,\n  };\n\n  return (\n    <div className=\"min-h-screen bg-gray-50\">\n      <Sidebar open={sidebarOpen} onClose={() => setSidebarOpen(false)} user={user}\n        items={NAV_ITEMS} active={page} onNav={setPage} onLogout={onLogout} />\n\n      {/* Header */}\n      <div className=\"bg-black text-white p-4 flex items-center justify-between sticky top-0 z-30\">\n        <div className=\"flex items-center gap-3\">\n          <span className=\"text-xl\">🛡️</span>\n          <div>\n            <h1 className=\"text-sm font-medium\">لوحة الإدارة</h1>\n            <p className=\"text-white/50 text-xs\">مرحباً {user.name}</p>\n          </div>\n        </div>\n        <button onClick={() => setSidebarOpen(true)} className=\"w-10 h-10 rounded-xl bg-white/10 flex items-center justify-center\">\n          <i className=\"fas fa-bars text-sm\"></i>\n        </button>\n      </div>\n\n      <div className=\"p-4 max-w-2xl mx-auto fade-in\">\n        {page === \"pending\" && (\n          <div>\n            <h2 className=\"text-lg font-medium mb-4\">⏳ طلبات الانتظار ({pending.length})</h2>\n            {loading ? (\n              <div className=\"space-y-3\">{[1,2,3].map(i => <div key={i} className=\"h-20 shimmer rounded-xl\"></div>)}</div>\n            ) : pending.length === 0 ? (\n              <div className=\"text-center py-12 text-gray-400\">\n                <div className=\"text-4xl mb-3\">✅</div>\n                <p>لا توجد طلبات معلقة</p>\n              </div>\n            ) : (\n              <div className=\"space-y-3\">\n                {pending.map(u => (\n                  <div key={u.id} className=\"bg-white rounded-xl p-4 shadow-sm\">\n                    <div className=\"flex items-center justify-between\">\n                      <div>\n                        <h3 className=\"font-medium text-sm\">{u.name}</h3>\n                        <p className=\"text-gray-400 text-xs\">{u.email}</p>\n                        <p className=\"text-xs mt-1\">\n                          <span className={`px-2 py-0.5 rounded-lg ${u.role === \"student\" ? \"bg-blue-50 text-blue-600\" : \"bg-purple-50 text-purple-600\"}`}>\n                            {u.role === \"student\" ? \"👨‍🎓 طالب\" : \"👨‍🏫 معلم\"}\n                          </span>\n                          {u.grade && <span className=\"text-gray-400 mr-2\">{u.grade}</span>}\n                        </p>\n                      </div>\n                      <div className=\"flex gap-2\">\n                        <button onClick={() => handleApprove(u.id)}\n                          className=\"w-10 h-10 rounded-xl bg-green-50 text-green-600 flex items-center justify-center hover:bg-green-100 transition\">\n                          <i className=\"fas fa-check\"></i>\n                        </button>\n                        <button onClick={() => handleReject(u.id)}\n                          className=\"w-10 h-10 rounded-xl bg-red-50 text-red-500 flex items-center justify-center hover:bg-red-100 transition\">\n                          <i className=\"fas fa-times\"></i>\n                        </button>\n                      </div>\n                    </div>\n                  </div>\n                ))}\n              </div>\n            )}\n          </div>\n        )}\n\n        {page === \"users\" && (\n          <div>\n            <h2 className=\"text-lg font-medium mb-4\">👥 المستخدمون ({users.length})</h2>\n            {loading ? (\n              <div className=\"space-y-3\">{[1,2,3].map(i => <div key={i} className=\"h-16 shimmer rounded-xl\"></div>)}</div>\n            ) : (\n              <div className=\"space-y-2\">\n                {users.map(u => (\n                  <div key={u.id} className=\"bg-white rounded-xl p-3 shadow-sm flex items-center justify-between\">\n                    <div className=\"flex items-center gap-3\">\n                      <div className=\"w-10 h-10 rounded-full bg-gray-100 flex items-center justify-center text-lg\">\n                        {u.role === \"student\" ? \"👨‍🎓\" : \"👨‍🏫\"}\n                      </div>\n                      <div>\n                        <h3 className=\"font-medium text-sm\">{u.name}</h3>\n                        <p className=\"text-gray-400 text-xs\">{u.email}</p>\n                      </div>\n                    </div>\n                    <div className=\"flex items-center gap-2\">\n                      <span className={`px-2 py-0.5 rounded-lg text-xs ${\n                        u.status === \"approved\" ? \"bg-green-50 text-green-600\" :\n                        u.status === \"pending\" ? \"bg-yellow-50 text-yellow-600\" :\n                        \"bg-red-50 text-red-500\"\n                      }`}>{u.status === \"approved\" ? \"مفعّل\" : u.status === \"pending\" ? \"معلق\" : \"مرفوض\"}</span>\n                      <button onClick={() => handleDelete(u.id)}\n                        className=\"w-8 h-8 rounded-lg bg-red-50 text-red-400 flex items-center justify-center hover:bg-red-100 transition text-xs\">\n                        <i className=\"fas fa-trash\"></i>\n                      </button>\n                    </div>\n                  </div>\n                ))}\n              </div>\n            )}\n          </div>\n        )}\n\n        {page === \"stats\" && (\n          <div>\n            <h2 className=\"text-lg font-medium mb-4\">📊 الإحصائيات</h2>\n            <div className=\"grid grid-cols-2 gap-3\">\n              {[\n                { label: \"إجمالي المستخدمين\", value: stats.total, icon: \"👥\", bg: \"bg-blue-50\" },\n                { label: \"الطلاب\", value: stats.students, icon: \"👨‍🎓\", bg: \"bg-green-50\" },\n                { label: \"المعلمين\", value: stats.teachers, icon: \"👨‍🏫\", bg: \"bg-purple-50\" },\n                { label: \"حسابات مفعّلة\", value: stats.approved, icon: \"✅\", bg: \"bg-emerald-50\" },\n                { label: \"بانتظار الموافقة\", value: stats.pending, icon: \"⏳\", bg: \"bg-yellow-50\" },\n              ].map((s, i) => (\n                <div key={i} className={`${s.bg} rounded-xl p-4 text-center`}>\n                  <div className=\"text-2xl mb-1\">{s.icon}</div>\n                  <div className=\"text-2xl font-bold\">{s.value}</div>\n                  <div className=\"text-xs text-gray-500 mt-1\">{s.label}</div>\n                </div>\n              ))}\n            </div>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n",[],[143,187,230],"553888be-3fda-11f1-8489-42b51c65c3df","database","38c4c1f2-d60c-4c5b-a938-f129f55e8a1d",["D",1777034239024],[243],[238],{"_39":244,"_13":245,"_42":246,"_44":239,"_46":47,"_48":123,"_50":51,"_52":247,"_17":54,"_55":56,"_57":248,"_59":60,"_61":-5,"_115":249,"_18":250},"55385484-3fda-11f1-8489-42b51c65c3df","schema.ts","55385524-3fda-11f1-8489-42b51c65c3df",["D",1777034239024],"import { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\nexport async function initDB() {\n  await sqlite.batch([\n    {\n      sql: `CREATE TABLE IF NOT EXISTS users (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        name TEXT NOT NULL,\n        email TEXT UNIQUE NOT NULL,\n        password TEXT NOT NULL,\n        role TEXT NOT NULL CHECK(role IN ('student','teacher','admin')),\n        grade TEXT,\n        subjects TEXT,\n        status TEXT DEFAULT 'pending' CHECK(status IN ('pending','approved','rejected')),\n        points INTEGER DEFAULT 0,\n        created_at TEXT DEFAULT (datetime('now'))\n      )`,\n      args: [],\n    },\n    {\n      sql: `CREATE TABLE IF NOT EXISTS assignments (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        teacher_id INTEGER NOT NULL,\n        title TEXT NOT NULL,\n        description TEXT,\n        subject TEXT NOT NULL,\n        grade TEXT NOT NULL,\n        page TEXT,\n        question TEXT,\n        due_date TEXT,\n        created_at TEXT DEFAULT (datetime('now')),\n        FOREIGN KEY(teacher_id) REFERENCES users(id)\n      )`,\n      args: [],\n    },\n    {\n      sql: `CREATE TABLE IF NOT EXISTS assignment_submissions (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        assignment_id INTEGER NOT NULL,\n        student_id INTEGER NOT NULL,\n        content TEXT,\n        image_url TEXT,\n        note TEXT,\n        grade_value REAL,\n        graded INTEGER DEFAULT 0,\n        submitted_at TEXT DEFAULT (datetime('now')),\n        FOREIGN KEY(assignment_id) REFERENCES assignments(id),\n        FOREIGN KEY(student_id) REFERENCES users(id)\n      )`,\n      args: [],\n    },\n    {\n      sql: `CREATE TABLE IF NOT EXISTS exams (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        teacher_id INTEGER NOT NULL,\n        title TEXT NOT NULL,\n        subject TEXT NOT NULL,\n        grade TEXT NOT NULL,\n        duration INTEGER DEFAULT 30,\n        questions TEXT NOT NULL,\n        created_at TEXT DEFAULT (datetime('now')),\n        FOREIGN KEY(teacher_id) REFERENCES users(id)\n      )`,\n      args: [],\n    },\n    {\n      sql: `CREATE TABLE IF NOT EXISTS exam_submissions (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        exam_id INTEGER NOT NULL,\n        student_id INTEGER NOT NULL,\n        answers TEXT NOT NULL,\n        score REAL,\n        submitted_at TEXT DEFAULT (datetime('now')),\n        FOREIGN KEY(exam_id) REFERENCES exams(id),\n        FOREIGN KEY(student_id) REFERENCES users(id)\n      )`,\n      args: [],\n    },\n    {\n      sql: `CREATE TABLE IF NOT EXISTS challenge_scores (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        student_id INTEGER NOT NULL,\n        score INTEGER NOT NULL,\n        level TEXT NOT NULL,\n        played_at TEXT DEFAULT (datetime('now')),\n        FOREIGN KEY(student_id) REFERENCES users(id)\n      )`,\n      args: [],\n    },\n    {\n      sql: `CREATE TABLE IF NOT EXISTS messages (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        sender_id INTEGER NOT NULL,\n        receiver_id INTEGER,\n        group_id INTEGER,\n        content TEXT,\n        msg_type TEXT DEFAULT 'text' CHECK(msg_type IN ('text','image','voice','file')),\n        created_at TEXT DEFAULT (datetime('now')),\n        FOREIGN KEY(sender_id) REFERENCES users(id)\n      )`,\n      args: [],\n    },\n    {\n      sql: `CREATE TABLE IF NOT EXISTS chat_groups (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        name TEXT NOT NULL,\n        creator_id INTEGER NOT NULL,\n        members TEXT NOT NULL,\n        created_at TEXT DEFAULT (datetime('now'))\n      )`,\n      args: [],\n    },\n    {\n      sql: `CREATE TABLE IF NOT EXISTS friends (\n        id INTEGER PRIMARY KEY AUTOINCREMENT,\n        user_id INTEGER NOT NULL,\n        friend_id INTEGER NOT NULL,\n        status TEXT DEFAULT 'pending',\n        FOREIGN KEY(user_id) REFERENCES users(id),\n        FOREIGN KEY(friend_id) REFERENCES users(id)\n      )`,\n      args: [],\n    },\n  ]);\n\n  // Seed admin account\n  const existing = await sqlite.execute({\n    sql: \"SELECT id FROM users WHERE email = ?\",\n    args: [\"admin@nashmi.com\"],\n  });\n  if (existing.rows.length === 0) {\n    await sqlite.execute({\n      sql: \"INSERT INTO users (name, email, password, role, status) VALUES (?, ?, ?, ?, ?)\",\n      args: [\"Admin\", \"admin@nashmi.com\", \"admin2012\", \"admin\", \"approved\"],\n    });\n  }\n}\n",[],[238,245],["D",1777034260804],[254,255,256,257,258,259],[19],{"_39":91,"_13":92,"_42":93,"_44":45,"_46":47,"_48":94,"_50":51,"_52":275,"_17":54,"_55":56,"_57":96,"_59":60,"_61":-5,"_115":276,"_18":277},{"_39":84,"_13":85,"_42":86,"_44":45,"_46":47,"_48":87,"_50":51,"_52":272,"_17":54,"_55":56,"_57":89,"_59":60,"_61":-5,"_115":273,"_18":274},{"_39":77,"_13":78,"_42":79,"_44":45,"_46":47,"_48":80,"_50":51,"_52":269,"_17":54,"_55":56,"_57":82,"_59":60,"_61":-5,"_115":270,"_18":271},{"_39":70,"_13":71,"_42":72,"_44":45,"_46":47,"_48":73,"_50":51,"_52":266,"_17":54,"_55":56,"_57":75,"_59":60,"_61":-5,"_115":267,"_18":268},{"_39":63,"_13":64,"_42":65,"_44":45,"_46":47,"_48":66,"_50":51,"_52":263,"_17":54,"_55":56,"_57":68,"_59":60,"_61":-5,"_115":264,"_18":265},{"_39":40,"_13":41,"_42":43,"_44":45,"_46":47,"_48":49,"_50":51,"_52":260,"_17":54,"_55":56,"_57":58,"_59":60,"_61":-5,"_115":261,"_18":262},["D",1777034282368],[],[19,41],["D",1777034301068],[],[19,64],["D",1777034401309],[],[19,71],["D",1777034260804],[],[19,78],["D",1777034383101],[],[19,85],["D",1777034267853],[],[19,92],"491b724e-3fda-11f1-b504-42b51c65c3df",["D",1777034218711],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Nashmi AI - منصة تعليمية ذكية للمنهاج الأردني","imageUrl","userId","b0f61714-9249-4b21-9d98-5a642005d771","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","orgId","019dbf7c-cc88-7712-8e55-8ad7d9f03979","tursoName","491b724e3fda11f1b50442b51c65c3df","tursoHostname","491b724e3fda11f1b50442b51c65c3df-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789495880338],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_334":330},"org",{"_11":12,"_328":-5,"_329":330,"_288":289,"_331":332,"_333":60},"branch",{"_17":121,"_13":16,"_39":47,"_320":278,"_321":-5,"_322":-5,"_323":-5,"_324":-5,"_325":-5,"_326":14,"_327":12},"isOwned","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","avatar","","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_39":278,"_13":14,"_52":448,"_280":-5,"_281":60,"_282":283,"_284":283,"_285":286,"_287":-5,"_288":289,"_290":110,"_291":51,"_292":-5,"_293":-5,"_294":54,"_295":296,"_297":298,"_299":300,"_301":449,"_303":-5,"_304":305,"_306":305,"_307":308,"_309":308,"_310":308,"_311":305,"_312":305,"_313":450,"_315":451,"_317":452,"_319":60},[376,383,385,396,398,399],"files",[376,377,378,379,380,381,382,383,384,385,386,387,388,389,390,391,392,393,394,395,396,397,398,399],"counts",{"_367":54,"_368":123,"_369":54,"_32":370,"_371":372},[355,356,357,358,359,360],{"_39":98,"_13":19,"_42":45,"_44":-5,"_46":47,"_48":80,"_50":51,"_52":99,"_17":54,"_55":100,"_57":-5,"_59":60,"_61":-5,"_18":354},"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},[19],{"_39":91,"_13":92,"_42":93,"_44":45,"_46":47,"_48":94,"_50":51,"_52":95,"_17":54,"_55":56,"_57":96,"_59":60,"_61":-5,"_18":366},{"_39":84,"_13":85,"_42":86,"_44":45,"_46":47,"_48":87,"_50":51,"_52":88,"_17":54,"_55":56,"_57":89,"_59":60,"_61":-5,"_18":365},{"_39":77,"_13":78,"_42":79,"_44":45,"_46":47,"_48":80,"_50":51,"_52":81,"_17":54,"_55":56,"_57":82,"_59":60,"_61":-5,"_18":364},{"_39":70,"_13":71,"_42":72,"_44":45,"_46":47,"_48":73,"_50":51,"_52":74,"_17":54,"_55":56,"_57":75,"_59":60,"_61":-5,"_18":363},{"_39":63,"_13":64,"_42":65,"_44":45,"_46":47,"_48":66,"_50":51,"_52":67,"_17":54,"_55":56,"_57":68,"_59":60,"_61":-5,"_18":362},{"_39":40,"_13":41,"_42":43,"_44":45,"_46":47,"_48":49,"_50":51,"_52":53,"_17":54,"_55":56,"_57":58,"_59":60,"_61":-5,"_18":361},[19,41],[19,64],[19,71],[19,78],[19,85],[19,92],"pulls","branches","forks",{"_373":54,"_375":54},"connections",{"_373":54,"_374":54},"count","unfilledCount","emptyCount",{"_39":98,"_13":19,"_42":45,"_44":-5,"_46":47,"_48":80,"_50":51,"_52":251,"_17":54,"_55":100,"_57":-5,"_59":60,"_61":-5,"_115":446,"_18":447},{"_39":91,"_13":92,"_42":93,"_44":45,"_46":47,"_48":94,"_50":51,"_52":275,"_17":54,"_55":56,"_57":96,"_59":60,"_61":-5,"_115":444,"_18":445},{"_39":84,"_13":85,"_42":86,"_44":45,"_46":47,"_48":87,"_50":51,"_52":272,"_17":54,"_55":56,"_57":89,"_59":60,"_61":-5,"_115":442,"_18":443},{"_39":77,"_13":78,"_42":79,"_44":45,"_46":47,"_48":80,"_50":51,"_52":269,"_17":54,"_55":56,"_57":82,"_59":60,"_61":-5,"_115":440,"_18":441},{"_39":70,"_13":71,"_42":72,"_44":45,"_46":47,"_48":73,"_50":51,"_52":266,"_17":54,"_55":56,"_57":75,"_59":60,"_61":-5,"_115":438,"_18":439},{"_39":63,"_13":64,"_42":65,"_44":45,"_46":47,"_48":66,"_50":51,"_52":263,"_17":54,"_55":56,"_57":68,"_59":60,"_61":-5,"_115":436,"_18":437},{"_39":40,"_13":41,"_42":43,"_44":45,"_46":47,"_48":49,"_50":51,"_52":260,"_17":54,"_55":56,"_57":58,"_59":60,"_61":-5,"_115":434,"_18":435},{"_39":237,"_13":238,"_42":239,"_44":-5,"_46":47,"_48":123,"_50":51,"_52":240,"_17":54,"_55":100,"_57":-5,"_59":60,"_61":-5,"_115":432,"_18":433},{"_39":244,"_13":245,"_42":246,"_44":239,"_46":47,"_48":123,"_50":51,"_52":247,"_17":54,"_55":56,"_57":248,"_59":60,"_61":-5,"_115":430,"_18":431},{"_39":142,"_13":143,"_42":144,"_44":-5,"_46":47,"_48":145,"_50":51,"_52":146,"_17":54,"_55":100,"_57":-5,"_59":60,"_61":-5,"_115":428,"_18":429},{"_39":186,"_13":187,"_42":188,"_44":144,"_46":47,"_48":189,"_50":51,"_52":190,"_17":54,"_55":100,"_57":-5,"_59":60,"_61":-5,"_115":426,"_18":427},{"_39":229,"_13":230,"_42":231,"_44":188,"_46":47,"_48":232,"_50":51,"_52":233,"_17":54,"_55":56,"_57":234,"_59":60,"_61":-5,"_115":424,"_18":425},{"_39":222,"_13":223,"_42":224,"_44":188,"_46":47,"_48":189,"_50":51,"_52":225,"_17":54,"_55":56,"_57":226,"_59":60,"_61":-5,"_115":422,"_18":423},{"_39":214,"_13":215,"_42":216,"_44":188,"_46":47,"_48":217,"_50":51,"_52":218,"_17":54,"_55":56,"_57":219,"_59":60,"_61":-5,"_115":420,"_18":421},{"_39":206,"_13":207,"_42":208,"_44":188,"_46":47,"_48":209,"_50":51,"_52":210,"_17":123,"_55":56,"_57":211,"_59":60,"_61":-5,"_115":418,"_18":419},{"_39":198,"_13":199,"_42":200,"_44":188,"_46":47,"_48":201,"_50":51,"_52":202,"_17":54,"_55":56,"_57":203,"_59":60,"_61":-5,"_115":416,"_18":417},{"_39":178,"_13":179,"_42":180,"_44":144,"_46":47,"_48":181,"_50":51,"_52":182,"_17":54,"_55":56,"_57":183,"_59":60,"_61":-5,"_115":414,"_18":415},{"_39":170,"_13":171,"_42":172,"_44":144,"_46":47,"_48":173,"_50":51,"_52":174,"_17":54,"_55":56,"_57":175,"_59":60,"_61":-5,"_115":412,"_18":413},{"_39":162,"_13":163,"_42":164,"_44":144,"_46":47,"_48":165,"_50":51,"_52":166,"_17":123,"_55":24,"_57":167,"_59":60,"_61":-5,"_115":410,"_18":411},{"_39":154,"_13":155,"_42":156,"_44":144,"_46":47,"_48":157,"_50":51,"_52":158,"_17":54,"_55":56,"_57":159,"_59":60,"_61":-5,"_115":408,"_18":409},{"_39":127,"_13":128,"_42":129,"_44":-5,"_46":47,"_48":130,"_50":51,"_52":131,"_17":54,"_55":100,"_57":-5,"_59":60,"_61":-5,"_115":406,"_18":407},{"_39":135,"_13":136,"_42":137,"_44":129,"_46":47,"_48":130,"_50":51,"_52":138,"_17":54,"_55":56,"_57":139,"_59":60,"_61":-5,"_115":404,"_18":405},{"_39":118,"_13":119,"_42":120,"_44":-5,"_46":47,"_48":121,"_50":51,"_52":122,"_17":123,"_55":24,"_57":124,"_59":60,"_61":-5,"_115":402,"_18":403},{"_39":108,"_13":109,"_42":110,"_44":-5,"_46":47,"_48":111,"_50":51,"_52":112,"_17":54,"_55":113,"_57":114,"_59":60,"_61":-5,"_115":400,"_18":401},[],[109],[],[119],[],[128,136],[397],[128],[],[143,155],[],[143,163],[],[143,171],[],[143,179],[],[143,187,199],[],[143,187,207],[],[143,187,215],[],[143,187,223],[],[143,187,230],[387,388,389,390,391],[143,187],[386,392,393,394,395],[143],[],[238,245],[384],[238],[],[19,41],[],[19,64],[],[19,71],[],[19,78],[],[19,85],[],[19,92],[377,378,379,380,381,382],[19],["D",1777034218711],["D",1789495880338],{"_11":12,"_334":330},{"_11":12,"_328":-5,"_329":330,"_288":289,"_331":332,"_333":60},{"_17":121,"_13":16,"_39":47,"_320":278,"_321":-5,"_322":-5,"_323":-5,"_324":-5,"_325":-5,"_326":14,"_327":12},"ctx",{"_313":-5,"_351":486,"_487":488,"_489":490,"_491":60,"_492":60,"_493":60,"_494":51,"_495":-5,"_496":-7,"_497":-7,"_498":54,"_499":60,"_500":60,"_501":-5,"_502":60,"_503":60,"_504":60,"_505":-5},"ENV",{"_457":458,"_459":460,"_461":16,"_462":463,"_464":465,"_466":467,"_468":469,"_470":471,"_472":473,"_474":475,"_476":477,"_478":479,"_480":481,"_482":483,"_484":485},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]
</article></body></html>