\n \n

Welcome back, {{ user?.name }}! 👋

Ready to continue your exam preparation journey?

\n\n \n

📊

Average Score

{{ averageScore }}%

\n\n

🎯

Best Score

{{ bestScore }}%

\n\n

🔥

Study Streak

{{ studyStreak }} days

\n\n

📝

Tests Taken

\n\n \n

Your Target Exams

\n {{ getExamIcon(examType) }}\n

\n \n

\n Progress\n {{ getExamProgress(examType) }}%\n

\n\n

\n \n

Recent Test Scores

{{ score.subject }} • {{ formatDate(score.testDate) }}

\n {{ score.scoredMarks }}/{{ score.totalMarks }}\n

{{ score.percentage }}%

\n \n

No test scores yet

Take your first practice test to see results here

\n\n \n

Study Progress

\n Current Phase\n Phase {{ currentProgress?.currentPhase || 1 }}\n

\n \n

\n Materials Completed\n {{ currentProgress?.completedMaterials.length || 0 }}/10\n

\n \n

\n Milestones Achieved\n {{ currentProgress?.completedMilestones.length || 0 }}/5\n

\n \n

Select an exam to view progress

\n\n \n

Quick Actions

\n \n \n \n \n \n \n \n

\n `\n})\nexport class DashboardComponent implements OnInit, OnChanges {\n @Input() user: User | null = null;\n @Input() selectedExam: ExamType | null = null;\n\n recentScores: TestScore[] = [];\n currentProgress: UserProgress | null = null;\n averageScore = 0;\n bestScore = 0;\n studyStreak = 0;\n totalTests = 0;\n\n constructor(\n private examService: ExamService,\n private progressService: ProgressService\n ) {}\n\n ngOnInit(): void {\n this.loadDashboardData();\n this.subscribeToProgress();\n }\n\n ngOnChanges(): void {\n this.loadDashboardData();\n }\n\n private loadDashboardData(): void {\n if (!this.user) return;\n\n // Load test scores\n this.progressService.loadTestScores(this.user.id).subscribe(scores => {\n this.recentScores = scores.slice(0, 5);\n this.totalTests = scores.length;\n });\n\n // Load progress for selected exam\n if (this.selectedExam) {\n this.progressService.loadUserProgress(this.user.id, this.selectedExam).subscribe(progress => {\n this.currentProgress = progress;\n });\n }\n }\n\n private subscribeToProgress(): void {\n this.progressService.scores$.subscribe(scores => {\n this.averageScore = this.progressService.getAverageScore();\n this.bestScore = this.progressService.getBestScore();\n this.recentScores = this.progressService.getRecentScores(5);\n this.totalTests = scores.length;\n });\n\n if (this.user) {\n this.studyStreak = this.progressService.getStudyStreak(this.user.id);\n }\n }\n\n selectExam(examType: ExamType): void {\n this.examService.selectExam(examType);\n }\n\n getExamName(examType: ExamType): string {\n const examInfo = this.examService.getExamInfo();\n return examInfo[examType]?.name || examType;\n }\n\n getExamIcon(examType: ExamType): string {\n const examInfo = this.examService.getExamInfo();\n return examInfo[examType]?.icon || '📝';\n }\n\n getExamDescription(examType: ExamType): string {\n const examInfo = this.examService.getExamInfo();\n return examInfo[examType]?.description || '';\n }\n\n getExamProgress(examType: ExamType): number {\n if (!this.user) return 0;\n const progress = this.progressService.getProgressForExam(this.user.id, examType);\n return progress?.progressPercentage || 0;\n }\n\n getMaterialProgress(): number {\n if (!this.currentProgress) return 0;\n return Math.min(100, (this.currentProgress.completedMaterials.length / 10) * 100);\n }\n\n getMilestoneProgress(): number {\n if (!this.currentProgress) return 0;\n return Math.min(100, (this.currentProgress.completedMilestones.length / 5) * 100);\n }\n\n getScoreColor(percentage: number): string {\n if (percentage >= 80) return 'text-green-600';\n if (percentage >= 60) return 'text-yellow-600';\n return 'text-red-600';\n }\n\n formatDate(dateString: string): string {\n const date = new Date(dateString);\n return date.toLocaleDateString('en-US', { \n month: 'short', \n day: 'numeric' \n });\n }\n\n navigateTo(section: string): void {\n // This would typically emit an event to the parent component\n // For now, we'll just log the navigation intent\n console.log(`Navigate to: ${section}`);\n }\n}","deleted","label",[167,168,149],"frontend","components","permalink","https://www.val.town/x/angayarb/StudyPlanner/code/frontend/components/dashboard.component.ts","extension","actionData","errors"]

Welcome back, {{ user?.name }}! 👋

Your Target Exams

{{ getExamName(examType) }}

Recent Test Scores

Study Progress

Quick Actions