mirror of
https://github.com/pupperpowell/bibdle.git
synced 2026-04-05 17:33:31 -04:00
- Implement dark gradient background with glassmorphism cards - Add new statistics: worst day, best book, most seen book, unique books by testament - Design mobile-first responsive grid layout with optimized spacing - Update Container component to support dark theme (bg-white/10, border-white/20) - Calculate book-specific stats by linking completions to daily verses - Improve visual hierarchy with icons and color-coded stat cards Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
86 lines
2.1 KiB
TypeScript
86 lines
2.1 KiB
TypeScript
export interface UserStats {
|
|
totalSolves: number;
|
|
avgGuesses: number;
|
|
gradeDistribution: {
|
|
'S++': number;
|
|
'S+': number;
|
|
'A+': number;
|
|
'A': number;
|
|
'B+': number;
|
|
'B': number;
|
|
'C+': number;
|
|
'C': number;
|
|
};
|
|
currentStreak: number;
|
|
bestStreak: number;
|
|
recentCompletions: Array<{
|
|
date: string;
|
|
guessCount: number;
|
|
grade: string;
|
|
}>;
|
|
worstDay: {
|
|
date: string;
|
|
guessCount: number;
|
|
} | null;
|
|
bestBook: {
|
|
bookId: string;
|
|
avgGuesses: number;
|
|
count: number;
|
|
} | null;
|
|
mostSeenBook: {
|
|
bookId: string;
|
|
count: number;
|
|
} | null;
|
|
totalBooksSeenOT: number;
|
|
totalBooksSeenNT: number;
|
|
}
|
|
|
|
export function getGradeColor(grade: string): string {
|
|
switch (grade) {
|
|
case 'S++': return 'text-purple-600 bg-purple-100';
|
|
case 'S+': return 'text-yellow-600 bg-yellow-100';
|
|
case 'A+': return 'text-green-600 bg-green-100';
|
|
case 'A': return 'text-green-500 bg-green-50';
|
|
case 'B+': return 'text-blue-600 bg-blue-100';
|
|
case 'B': return 'text-blue-500 bg-blue-50';
|
|
case 'C+': return 'text-orange-600 bg-orange-100';
|
|
case 'C': return 'text-red-600 bg-red-100';
|
|
default: return 'text-gray-600 bg-gray-100';
|
|
}
|
|
}
|
|
|
|
export function formatDate(dateStr: string): string {
|
|
const date = new Date(dateStr + 'T00:00:00');
|
|
return date.toLocaleDateString('en-US', {
|
|
month: 'short',
|
|
day: 'numeric'
|
|
});
|
|
}
|
|
|
|
export function getStreakMessage(currentStreak: number): string {
|
|
if (currentStreak === 0) {
|
|
return "Start your streak today!";
|
|
} else if (currentStreak === 1) {
|
|
return "Keep it going!";
|
|
} else if (currentStreak < 7) {
|
|
return `${currentStreak} days strong!`;
|
|
} else if (currentStreak < 30) {
|
|
return `${currentStreak} day streak - amazing!`;
|
|
} else {
|
|
return `${currentStreak} days - you're unstoppable!`;
|
|
}
|
|
}
|
|
|
|
export function getPerformanceMessage(avgGuesses: number): string {
|
|
if (avgGuesses <= 2) {
|
|
return "Exceptional performance!";
|
|
} else if (avgGuesses <= 4) {
|
|
return "Great performance!";
|
|
} else if (avgGuesses <= 6) {
|
|
return "Good performance!";
|
|
} else if (avgGuesses <= 8) {
|
|
return "Room for improvement!";
|
|
} else {
|
|
return "Keep practicing!";
|
|
}
|
|
} |