Add pre-commit hooks for linting and formatting
Set up pre-commit framework with ruff (backend) and ESLint/Prettier/tsc (frontend) hooks to catch issues locally before CI. Auto-format all frontend files with Prettier to comply with the new check. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -178,15 +178,25 @@ function StatsContent({ stats }: { stats: StatsResponse }) {
|
||||
<div className="grid grid-cols-2 sm:grid-cols-4 gap-3 mb-4">
|
||||
<StatCard label="Total Runs" value={stats.totalRuns} color="blue" />
|
||||
<StatCard label="Active" value={stats.activeRuns} color="green" />
|
||||
<StatCard label="Completed" value={stats.completedRuns} color="blue" />
|
||||
<StatCard
|
||||
label="Completed"
|
||||
value={stats.completedRuns}
|
||||
color="blue"
|
||||
/>
|
||||
<StatCard label="Failed" value={stats.failedRuns} color="red" />
|
||||
</div>
|
||||
<div className="flex flex-wrap gap-x-6 gap-y-1 text-sm text-gray-600 dark:text-gray-400">
|
||||
<span>
|
||||
Win Rate: <strong className="text-gray-800 dark:text-gray-200">{pct(stats.winRate)}</strong>
|
||||
Win Rate:{' '}
|
||||
<strong className="text-gray-800 dark:text-gray-200">
|
||||
{pct(stats.winRate)}
|
||||
</strong>
|
||||
</span>
|
||||
<span>
|
||||
Avg Duration: <strong className="text-gray-800 dark:text-gray-200">{fmt(stats.avgDurationDays, ' days')}</strong>
|
||||
Avg Duration:{' '}
|
||||
<strong className="text-gray-800 dark:text-gray-200">
|
||||
{fmt(stats.avgDurationDays, ' days')}
|
||||
</strong>
|
||||
</span>
|
||||
</div>
|
||||
</Section>
|
||||
@@ -233,10 +243,16 @@ function StatsContent({ stats }: { stats: StatsResponse }) {
|
||||
</div>
|
||||
<div className="flex flex-wrap gap-x-6 gap-y-1 text-sm text-gray-600 dark:text-gray-400">
|
||||
<span>
|
||||
Catch Rate: <strong className="text-gray-800 dark:text-gray-200">{pct(stats.catchRate)}</strong>
|
||||
Catch Rate:{' '}
|
||||
<strong className="text-gray-800 dark:text-gray-200">
|
||||
{pct(stats.catchRate)}
|
||||
</strong>
|
||||
</span>
|
||||
<span>
|
||||
Avg per Run: <strong className="text-gray-800 dark:text-gray-200">{fmt(stats.avgEncountersPerRun)}</strong>
|
||||
Avg per Run:{' '}
|
||||
<strong className="text-gray-800 dark:text-gray-200">
|
||||
{fmt(stats.avgEncountersPerRun)}
|
||||
</strong>
|
||||
</span>
|
||||
</div>
|
||||
</Section>
|
||||
@@ -244,10 +260,7 @@ function StatsContent({ stats }: { stats: StatsResponse }) {
|
||||
{/* Pokemon Rankings */}
|
||||
<Section title="Pokemon Rankings">
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 gap-6">
|
||||
<PokemonList
|
||||
title="Most Caught"
|
||||
pokemon={stats.topCaughtPokemon}
|
||||
/>
|
||||
<PokemonList title="Most Caught" pokemon={stats.topCaughtPokemon} />
|
||||
<PokemonList
|
||||
title="Most Encountered"
|
||||
pokemon={stats.topEncounteredPokemon}
|
||||
@@ -258,24 +271,34 @@ function StatsContent({ stats }: { stats: StatsResponse }) {
|
||||
{/* Team & Deaths */}
|
||||
<Section title="Team & Deaths">
|
||||
<div className="grid grid-cols-2 sm:grid-cols-4 gap-3 mb-4">
|
||||
<StatCard label="Total Deaths" value={stats.totalDeaths} color="red" />
|
||||
<StatCard
|
||||
label="Total Deaths"
|
||||
value={stats.totalDeaths}
|
||||
color="red"
|
||||
/>
|
||||
<div className="bg-white dark:bg-gray-800 rounded-lg shadow p-4 border-l-4 border-amber-500">
|
||||
<div className="text-2xl font-bold text-gray-900 dark:text-gray-100">
|
||||
{pct(stats.mortalityRate)}
|
||||
</div>
|
||||
<div className="text-sm text-gray-600 dark:text-gray-400">Mortality Rate</div>
|
||||
<div className="text-sm text-gray-600 dark:text-gray-400">
|
||||
Mortality Rate
|
||||
</div>
|
||||
</div>
|
||||
<div className="bg-white dark:bg-gray-800 rounded-lg shadow p-4 border-l-4 border-blue-500">
|
||||
<div className="text-2xl font-bold text-gray-900 dark:text-gray-100">
|
||||
{fmt(stats.avgCatchLevel)}
|
||||
</div>
|
||||
<div className="text-sm text-gray-600 dark:text-gray-400">Avg Catch Lv.</div>
|
||||
<div className="text-sm text-gray-600 dark:text-gray-400">
|
||||
Avg Catch Lv.
|
||||
</div>
|
||||
</div>
|
||||
<div className="bg-white dark:bg-gray-800 rounded-lg shadow p-4 border-l-4 border-purple-500">
|
||||
<div className="text-2xl font-bold text-gray-900 dark:text-gray-100">
|
||||
{fmt(stats.avgFaintLevel)}
|
||||
</div>
|
||||
<div className="text-sm text-gray-600 dark:text-gray-400">Avg Faint Lv.</div>
|
||||
<div className="text-sm text-gray-600 dark:text-gray-400">
|
||||
Avg Faint Lv.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -347,7 +370,9 @@ export function Stats() {
|
||||
{stats && stats.totalRuns === 0 && (
|
||||
<div className="text-center py-12 text-gray-500 dark:text-gray-400">
|
||||
<p className="text-lg mb-2">No data yet</p>
|
||||
<p className="text-sm">Start a Nuzlocke run to see your stats here.</p>
|
||||
<p className="text-sm">
|
||||
Start a Nuzlocke run to see your stats here.
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user