feat(insights): elevate coincident-deviation to a dedicated "Today's signal" card

Promote the COINCIDENT_DEVIATION flag from a fire-only tile buried in the
below-the-fold vitals grid to an always-mounted headline card at the top of
the Insights overview. The card renders four calm states off the single
existing derived payload — building-baselines, all-clear, watch, fired — with
no new engine math, route, or schema change.

Keep it calm and clinically safe: at most an amber band, never red, no score,
no chart, no push. Soften a fired flag to the watch tone when the backing
history is thin. The fired/watch states carry the load-bearing "possible
factors, never a cause / not a diagnosis" framing and reuse ProvenanceExplainer
+ CoverageMeter + the band tokens verbatim.

Remove the now-redundant tile, its batch token, and the hasRenderableVital
branch from the vitals grid so the signal is not shown twice.
This commit is contained in:
Marc-André Bombeck committed 2026-06-03 19:29:36 +02:00
1 parent fe099acd67
commit 789ec60d97
11 files changed
+562 -102

No files matched your search

+20
View File
@@ -97,6 +97,24 @@ const RhythmEventsCard = dynamic(
})),
{ ssr: false },
);
// v1.10.3 — "Today's signal" headline card. Promotes COINCIDENT_DEVIATION from
// a buried below-the-fold tile to the top-of-overview daily read (the
// always-present Apple/WHOOP/Oura pattern). Deferred behind `next/dynamic`; it
// owns its own derived-metric query and renders four calm states. A
// fixed-height skeleton matches the resolved card so the top of the page does
// not shift while the chunk + data resolve.
const CoincidentDeviationCard = dynamic(
() =>
import("@/components/insights/coincident-deviation-card").then((mod) => ({
default: mod.CoincidentDeviationCard,
})),
{
ssr: false,
loading: () => (
<div className="bg-card border-border h-[7.5rem] animate-pulse rounded-xl border motion-reduce:animate-none" />
),
},
);
/**
* v1.4.25 W4d — Insights mother page.
@@ -246,6 +264,8 @@ export default function InsightsPage() {
healthScore={analytics?.healthScore ?? undefined}
/>
<CoincidentDeviationCard enabled={isAuthenticated} />
<div className="flex justify-end">
<Button
size="sm"