fix(frontend): auto-completed on finish time, dashboard links, list/calendar UX

- Set status to completed when finish time parses (input + submit)
- Dashboard: last personal record by recent date+time; links on top 3 cards
- Hover scale+shadow on all dashboard-card; linked card padding via BEM
- Race list: full row links to race detail; same hover as before
- Calendar year grid: 3 columns, 2 on tablet, 1 on narrow
- Version 0.4.1

Made-with: Cursor

frontend/src/pages/DashboardPage.tsx

@@ -1,4 +1,5 @@
 import { useEffect, useMemo, useState } from "react";
+import { Link } from "react-router-dom";
 import type { Race } from "../api";
 import { ApiError, getRaces } from "../api";
 import { PaceTrendChart } from "../components";
@@ -61,26 +62,14 @@ export function DashboardPage(): JSX.Element {
 
   const dashboardMetrics = useMemo(() => {
     const { upcoming, past } = splitRacesByDate(races);
-    const completed = races.filter((race) => race.status === "completed");
 
     const nextRace = upcoming[0] ?? null;
     const lastResult = past.find((race) => race.status === "completed") ?? null;
 
-    let personalRecord: Race | null = null;
-    let personalRecordSeconds = Number.POSITIVE_INFINITY;
-
-    for (const race of completed) {
-      const finishSeconds = parseFinishTimeToSeconds(race.finishTime);
-      if (!finishSeconds) {
-        continue;
-      }
-
-      const candidate = finishSeconds / race.distanceKm;
-      if (candidate < personalRecordSeconds) {
-        personalRecordSeconds = candidate;
-        personalRecord = race;
-      }
-    }
+    const lastPersonalRecord =
+      past.find(
+        (race) => race.status === "completed" && parseFinishTimeToSeconds(race.finishTime) !== null,
+      ) ?? null;
 
     const currentYear = new Date().getFullYear();
     const seasonRaces = races.filter((race) => parseRaceDate(race.date).getFullYear() === currentYear);
@@ -89,7 +78,7 @@ export function DashboardPage(): JSX.Element {
     return {
       nextRace,
       lastResult,
-      personalRecord,
+      lastPersonalRecord,
       seasonTotal: seasonRaces.length,
       seasonCompletedCount: seasonCompleted.length,
     };
@@ -167,48 +156,79 @@ export function DashboardPage(): JSX.Element {
       <p className="page__subtitle">Ключевые метрики по вашему календарю стартов.</p>
 
       <div className="dashboard-grid" aria-label="Ключевые метрики">
-        <article className="dashboard-card">
-          <h2 className="dashboard-card__title">Ближайший старт</h2>
+        <article
+          className={`dashboard-card${dashboardMetrics.nextRace ? " dashboard-card--linked" : ""}`}
+        >
           {dashboardMetrics.nextRace ? (
-            <>
+            <Link
+              className="dashboard-card__link-surface"
+              to={`/races/${dashboardMetrics.nextRace.id}`}
+              aria-label={`Ближайший старт: ${dashboardMetrics.nextRace.title}`}
+            >
+              <h2 className="dashboard-card__title">Ближайший старт</h2>
               <p className="dashboard-card__value">{dashboardMetrics.nextRace.title}</p>
               <p className="dashboard-card__meta">
-                {formatRaceDate(dashboardMetrics.nextRace.date)} · {formatDistance(dashboardMetrics.nextRace.distanceKm)}
+                {formatRaceDate(dashboardMetrics.nextRace.date)} ·{" "}
+                {formatDistance(dashboardMetrics.nextRace.distanceKm)}
               </p>
               <p className="dashboard-card__hint">{getRaceCountdownLabel(dashboardMetrics.nextRace.date)}</p>
-            </>
+            </Link>
           ) : (
-            <p className="dashboard-card__empty">Нет запланированных стартов.</p>
+            <>
+              <h2 className="dashboard-card__title">Ближайший старт</h2>
+              <p className="dashboard-card__empty">Нет запланированных стартов.</p>
+            </>
           )}
         </article>
 
-        <article className="dashboard-card">
-          <h2 className="dashboard-card__title">Последний результат</h2>
+        <article
+          className={`dashboard-card${dashboardMetrics.lastResult ? " dashboard-card--linked" : ""}`}
+        >
           {dashboardMetrics.lastResult ? (
-            <>
+            <Link
+              className="dashboard-card__link-surface"
+              to={`/races/${dashboardMetrics.lastResult.id}`}
+              aria-label={`Последний результат: ${dashboardMetrics.lastResult.title}`}
+            >
+              <h2 className="dashboard-card__title">Последний результат</h2>
               <p className="dashboard-card__value">{dashboardMetrics.lastResult.finishTime ?? "время не указано"}</p>
               <p className="dashboard-card__meta">
                 {dashboardMetrics.lastResult.title} · {formatDistance(dashboardMetrics.lastResult.distanceKm)}
               </p>
               <p className="dashboard-card__hint">{formatRaceDate(dashboardMetrics.lastResult.date)}</p>
-            </>
+            </Link>
           ) : (
-            <p className="dashboard-card__empty">Пока нет завершённых стартов.</p>
+            <>
+              <h2 className="dashboard-card__title">Последний результат</h2>
+              <p className="dashboard-card__empty">Пока нет завершённых стартов.</p>
+            </>
           )}
         </article>
 
-        <article className="dashboard-card">
-          <h2 className="dashboard-card__title">Личный рекорд</h2>
-          {dashboardMetrics.personalRecord ? (
-            <>
-              <p className="dashboard-card__value">{dashboardMetrics.personalRecord.finishTime ?? "время не указано"}</p>
-              <p className="dashboard-card__meta">
-                {dashboardMetrics.personalRecord.title} · {formatDistance(dashboardMetrics.personalRecord.distanceKm)}
+        <article
+          className={`dashboard-card${dashboardMetrics.lastPersonalRecord ? " dashboard-card--linked" : ""}`}
+        >
+          {dashboardMetrics.lastPersonalRecord ? (
+            <Link
+              className="dashboard-card__link-surface"
+              to={`/races/${dashboardMetrics.lastPersonalRecord.id}`}
+              aria-label={`Последний личный рекорд: ${dashboardMetrics.lastPersonalRecord.title}`}
+            >
+              <h2 className="dashboard-card__title">Последний личный рекорд</h2>
+              <p className="dashboard-card__value">
+                {dashboardMetrics.lastPersonalRecord.finishTime ?? "время не указано"}
               </p>
-              <p className="dashboard-card__hint">Лучший темп среди завершённых стартов.</p>
-            </>
+              <p className="dashboard-card__meta">
+                {dashboardMetrics.lastPersonalRecord.title} ·{" "}
+                {formatDistance(dashboardMetrics.lastPersonalRecord.distanceKm)}
+              </p>
+              <p className="dashboard-card__hint">{formatRaceDate(dashboardMetrics.lastPersonalRecord.date)}</p>
+            </Link>
           ) : (
-            <p className="dashboard-card__empty">Недостаточно данных для личного рекорда.</p>
+            <>
+              <h2 className="dashboard-card__title">Последний личный рекорд</h2>
+              <p className="dashboard-card__empty">Нет завершённых стартов с финишным временем.</p>
+            </>
           )}
         </article>