Dashboard Running PRs: show fixed 1k, 1 mile, 5k, 10k distances

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-06-11 23:42:12 +01:00
parent c05d27c115
commit e9cb1ea4e4
1 changed files with 13 additions and 11 deletions
@@ -425,21 +425,23 @@ function RecentActivities({ activities }) {
  )
 }

+const DASH_PR_LABELS = ['1k', '1 mile', '5k', '10k']
+
 function RunningPRs({ records }) {
+  const byLabel = Object.fromEntries((records || []).map(r => [r.distance_label, r]))
  return (
    <Card title="Running PRs" viewHref="/records">
-      {records?.length > 0 ? (
-        <div className="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-5 gap-3">
-          {records.slice(0, 5).map(rec => (
-            <div key={rec.id} className="bg-gray-800/60 rounded-lg p-3 text-center">
-              <p className="text-xs text-gray-500 mb-1">{rec.distance_label}</p>
-              <p className="font-mono font-semibold text-yellow-400">{formatDuration(rec.duration_s)}</p>
+      <div className="grid grid-cols-2 sm:grid-cols-4 gap-3">
+        {DASH_PR_LABELS.map(label => {
+          const rec = byLabel[label]
+          return (
+            <div key={label} className="bg-gray-800/60 rounded-lg p-3 text-center">
+              <p className="text-xs text-gray-500 mb-1">{label}</p>
+              <p className="font-mono font-semibold text-yellow-400">{rec ? formatDuration(rec.duration_s) : '--'}</p>
            </div>
-          ))}
-        </div>
-      ) : (
-        <div className="flex items-center justify-center h-full text-gray-600 text-sm">No running records yet</div>
-      )}
+          )
+        })}
+      </div>
    </Card>
  )
 }