remove grade distribution and recent performance sections from stats page

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
George Powell
2026-02-26 14:39:58 -05:00
parent 592fa917cd
commit 3ee7331510
2 changed files with 6 additions and 85 deletions

View File

@@ -1,16 +1,11 @@
<script lang="ts">
import { browser } from "$app/environment";
import { goto } from "$app/navigation";
import { onMount } from "svelte";
import { enhance } from "$app/forms";
import AuthModal from "$lib/components/AuthModal.svelte";
import Container from "$lib/components/Container.svelte";
import { bibleBooks } from "$lib/types/bible";
import {
getGradeColor,
formatDate,
getStreakMessage,
getPerformanceMessage,
type UserStats,
} from "$lib/utils/stats";
@@ -44,10 +39,6 @@
loading = false;
});
function getGradePercentage(count: number, total: number): number {
return total > 0 ? Math.round((count / total) * 100) : 0;
}
function getBookName(bookId: string): string {
return bibleBooks.find((b) => b.id === bookId)?.name || bookId;
}
@@ -333,83 +324,7 @@
</Container>
</div>
<!-- Grade Distribution -->
<Container class="p-5 md:p-6 mb-6">
<h2 class="text-lg md:text-xl font-bold text-gray-100 mb-4">
Grade Distribution
</h2>
<div class="grid grid-cols-4 md:grid-cols-8 gap-2 md:gap-3">
{#each Object.entries(stats.gradeDistribution) as [grade, count] (grade)}
{@const percentage = getGradePercentage(
count,
stats.totalSolves,
)}
<div class="text-center">
<div class="mb-2">
<span
class="inline-block px-2 md:px-3 py-1 rounded-full text-xs md:text-sm font-semibold {getGradeColor(
grade,
)}"
>
{grade}
</span>
</div>
<div
class="text-lg md:text-2xl font-bold text-gray-100"
>
{count}
</div>
<div class="text-xs text-gray-400">
{percentage}%
</div>
</div>
{/each}
</div>
</Container>
<!-- Recent Performance -->
{#if stats.recentCompletions.length > 0}
<Container class="p-5 md:p-6">
<h2
class="text-lg md:text-xl font-bold text-gray-100 mb-4"
>
Recent Performance
</h2>
<div class="space-y-2">
{#each stats.recentCompletions as completion, idx (`${completion.date}-${idx}`)}
<div
class="flex justify-between items-center py-2 border-b border-white/10 last:border-b-0"
>
<div>
<span
class="text-sm md:text-base font-medium text-gray-200"
>{formatDate(completion.date)}</span
>
</div>
<div
class="flex items-center gap-2 md:gap-3"
>
<span
class="text-xs md:text-sm text-gray-300"
>{completion.guessCount} guess{completion.guessCount ===
1
? ""
: "es"}</span
>
<span
class="px-2 py-0.5 md:py-1 rounded text-xs md:text-sm font-semibold {getGradeColor(
completion.grade,
)}"
>
{completion.grade}
</span>
</div>
</div>
{/each}
</div>
</Container>
{/if}
{/if}
{/if}
</div>
</div>

View File

@@ -59,6 +59,12 @@ I created Bibdle from a combination of two things. The first is my lifelong desi
# done
## feb 26th
- Added dark mode
- Removed URL from share text (Wordle said it was ratchet)
- added option for sharing with verse snippet (hidden on share text first copy)
## february 22nd
- New share button design; speech bubbles