'use client' import { useState, useEffect, useRef, Suspense } from 'react'; ; import { useLanguage } from '@/contexts/LanguageContext'; import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'; import { Button } from '@/components/ui/button'; import { Input } from '@/components/ui/input'; import { Badge } from '@/components/ui/badge'; import { Skeleton } from '@/components/ui/skeleton'; import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger } from '@/components/ui/dialog'; import { Label } from '@/components/ui/label'; import { Progress } from '@/components/ui/progress'; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'; import { User, BookOpen, Calendar, FileText, Wallet, Mail, Phone, GraduationCap, Building, Award, Download, Clock, MapPin, Video, FileSpreadsheet, File, Bell, CheckCircle, AlertCircle, Timer, CreditCard, TrendingUp, BookMarked, Edit, Save, X, MessageSquare, Send } from 'lucide-react'; import { Textarea } from '@/components/ui/textarea'; import { toast } from 'sonner'; import { StudentSurvey } from '@/components/dashboard/StudentSurvey'; import { getStudentProfile, getStudentCourses, getCourseFiles, getStudentSchedule, getStudentGrades, getStudentFinance, getStudentAdmissionRequests, getStudentNotifications, updateStudentProfile, uploadStudentProfileImage, markStudentNotificationAsRead, getStudentSurveyStatus, submitStudentSurvey, type StudentProfile, type StudentCourse, type CourseFile, type StudentScheduleItem, type StudentGrade, type StudentFinance, type StudentAdmissionRequest, type StudentNotification } from '@/services/data/student.service'; import { messagesService, Conversation, Message } from '@/services/data/messages.service'; import { useRouter, useSearchParams } from 'next/navigation'; function StudentDashboardContent() { const router = useRouter(); const searchParams = useSearchParams(); const { language, t } = useLanguage(); const [loading, setLoading] = useState(true); const [profile, setProfile] = useState(null); const [courses, setCourses] = useState([]); const [files, setFiles] = useState([]); const [schedule, setSchedule] = useState([]); const [grades, setGrades] = useState([]); const [finance, setFinance] = useState(null); const [admissionRequests, setAdmissionRequests] = useState([]); const [notifications, setNotifications] = useState([]); const [showSurvey, setShowSurvey] = useState(false); const [selectedCourse, setSelectedCourse] = useState('all'); const [selectedSemester, setSelectedSemester] = useState('all'); const [isEditingProfile, setIsEditingProfile] = useState(false); const [editedProfile, setEditedProfile] = useState>({}); const [profileImage, setProfileImage] = useState(null); const profileImageRef = useRef(null); // Messages state const [conversations, setConversations] = useState([]); const [currentConversation, setCurrentConversation] = useState(null); const [conversationMessages, setConversationMessages] = useState([]); const [newMessage, setNewMessage] = useState(''); const [contactFaculty, setContactFaculty] = useState<{ id: string; name: string; email: string } | null>(null); // Get initial tab from URL params const initialTab = searchParams.get('tab') || 'profile'; useEffect(() => { const loadData = async () => { setLoading(true); try { const [profileData, coursesData, filesData, scheduleData, gradesData, financeData, admissionData, notificationsData, conversationsData, surveyStatus] = await Promise.all([ getStudentProfile(), getStudentCourses(), getCourseFiles(), getStudentSchedule(), getStudentGrades(), getStudentFinance(), getStudentAdmissionRequests(), getStudentNotifications(), messagesService.getStudentConversations(), getStudentSurveyStatus(), ]); setProfile(profileData); setCourses(coursesData); setFiles(filesData); setSchedule(scheduleData); setGrades(gradesData); setFinance(financeData); setAdmissionRequests(admissionData); setNotifications(notificationsData); setConversations(conversationsData); setEditedProfile({ emailPersonal: profileData.emailPersonal, phone: profileData.phone }); setProfileImage(profileData.image || null); // Check for faculty contact from localStorage const storedFaculty = localStorage.getItem('contactFaculty'); if (storedFaculty) { try { const faculty = JSON.parse(storedFaculty); setContactFaculty(faculty); localStorage.removeItem('contactFaculty'); // Get or create conversation with this faculty const conv = await messagesService.getOrCreateConversation(faculty.id, faculty.name, faculty.email); setCurrentConversation(conv); const msgs = await messagesService.getConversationMessages(conv.id); setConversationMessages(msgs); } catch { localStorage.removeItem('contactFaculty'); } } if (surveyStatus?.enabled && surveyStatus?.required) { setShowSurvey(true); } } catch (error) { console.error('Error loading data:', error); } finally { setLoading(false); } }; loadData(); }, []); const handleSelectConversation = async (conv: Conversation) => { setCurrentConversation(conv); setContactFaculty({ id: conv.doctorId, name: conv.doctorName, email: conv.doctorEmail }); const msgs = await messagesService.getConversationMessages(conv.id); setConversationMessages(msgs); await messagesService.markConversationAsRead(conv.id, 'student'); setConversations(prev => prev.map(item => item.id === conv.id ? { ...item, unreadCount: 0 } : item)); }; const handleSendMessage = async () => { if (!newMessage.trim() || !currentConversation) return; const msg = await messagesService.sendMessage( currentConversation.id, newMessage.trim(), 'student', profile?.nameAr || 'الطالب' ); setConversationMessages(prev => [...prev, msg]); setNewMessage(''); // Update or insert conversation in list setCurrentConversation(prev => prev ? { ...prev, lastMessage: msg.text, lastMessageDate: msg.createdAt } : prev); setConversations(prev => { const updated = prev.map(c => c.id === currentConversation.id ? { ...c, lastMessage: msg.text, lastMessageDate: msg.createdAt, unreadCount: 0 } : c ); if (updated.some(c => c.id === currentConversation.id)) { return updated; } return [ { ...currentConversation, lastMessage: msg.text, lastMessageDate: msg.createdAt, unreadCount: 0, }, ...updated, ]; }); toast.success(t('تم إرسال الرسالة بنجاح', 'Message sent successfully')); }; const formatCurrency = (amount: number) => { return new Intl.NumberFormat(language === 'ar' ? 'ar-YE' : 'en-US').format(amount) + (language === 'ar' ? ' ر.ي' : ' YER'); }; const getGradeColor = (grade: string) => { if (grade.startsWith('A')) return 'text-green-600'; if (grade.startsWith('B')) return 'text-blue-600'; if (grade.startsWith('C')) return 'text-yellow-600'; if (grade.startsWith('D')) return 'text-orange-600'; if (grade === 'F') return 'text-red-600'; return 'text-muted-foreground'; }; const getStatusBadge = (status: string) => { switch (status) { case 'paid': return {t('مدفوع', 'Paid')}; case 'pending': return {t('قيد الانتظار', 'Pending')}; case 'overdue': return {t('متأخر', 'Overdue')}; case 'partial': return {t('جزئي', 'Partial')}; default: return null; } }; const getAdmissionStatusBadge = (status: string) => { switch (status) { case 'accepted': return {t('مقبول', 'Accepted')}; case 'rejected': return {t('مرفوض', 'Rejected')}; case 'reviewed': return {t('قيد المراجعة', 'Reviewed')}; default: return {t('قيد الانتظار', 'Pending')}; } }; const getFileIcon = (type: string) => { switch (type) { case 'video': return