diff --git a/src/app/__tests__/targets-spacing.test.tsx b/src/app/__tests__/targets-spacing.test.tsx new file mode 100644 index 000000000..e76affd29 --- /dev/null +++ b/src/app/__tests__/targets-spacing.test.tsx @@ -0,0 +1,65 @@ +import { describe, expect, it, vi } from "vitest"; +import { renderToStaticMarkup } from "react-dom/server"; + +/** + * v1.4.19 phase A7 — `/targets` (Zielwerte) had `space-y-8` between + * the page header (h1 + intro) and the first card grid. At Pixel-5 + * Marc reported "relativ viel Platz" wasted between the overview + * and the first values. Tighten the rhythm to `space-y-6` (24px) + * which matches the rest of the admin / settings pages. + */ + +vi.mock("next/navigation", () => ({ + useRouter: () => ({ push: vi.fn(), replace: vi.fn() }), + usePathname: () => "/targets", +})); + +vi.mock("@tanstack/react-query", () => ({ + useQuery: () => ({ + data: { + targets: [], + bpDiastolic: { current: null, average30: null, range: null }, + profile: { heightCm: null, age: null, gender: null, glucoseUnit: null }, + }, + isLoading: false, + isError: false, + refetch: vi.fn(), + }), +})); + +vi.mock("@/hooks/use-auth", () => ({ + useAuth: () => ({ + user: { + id: "u1", + username: "marc", + email: "marc@example.com", + role: "USER", + }, + isAuthenticated: true, + isLoading: false, + refetch: vi.fn(), + }), +})); + +import { I18nProvider } from "@/lib/i18n/context"; +import TargetsPage from "../targets/page"; + +function render(locale: "en" | "de" = "en") { + return renderToStaticMarkup( + + + , + ); +} + +describe("/targets page — vertical spacing", () => { + it("uses space-y-6 (not space-y-8) between header and card grid", () => { + const html = render(); + // Outer wrapper rhythm. `space-y-8` would leave ~32px of + // unnecessary breathing room between the intro paragraph and the + // first card; `space-y-6` (24px) brings it in line with the + // admin / settings pages. + expect(html).toMatch(/]*\bspace-y-6\b/); + expect(html).not.toMatch(/]*\bspace-y-8\b/); + }); +}); diff --git a/src/app/targets/page.tsx b/src/app/targets/page.tsx index fc364eb39..924595a8c 100644 --- a/src/app/targets/page.tsx +++ b/src/app/targets/page.tsx @@ -549,7 +549,11 @@ export default function TargetsPage() { }); return ( -
+ // v1.4.19 phase A7 — Marc reported "relativ viel Platz" wasted + // between the overview header and the first values on `/targets`. + // Tighten the rhythm from `space-y-8` (32 px) to `space-y-6` + // (24 px) — that matches the admin / settings pages. +

{t("targets.title")}

{t("targets.introText")}