mirror of
https://github.com/MBombeck/HealthLog.git
synced 2026-11-07 04:12:04 +00:00
feat(insights): comparison toggle on-surface in hero meta band
Move the Vormonat / Vorjahr comparison toggle from a standalone row below the page hero into the hero's own meta slot. The previous layout read as three stacked cards with separate header / control bands — hero, then comparison toggle, then advisor card — and the toggle row had no other content, so it just hung there in the gap. Folding the toggle into the hero clusters every page-level control (personal-baseline indicator, Generated timestamp, Regenerate button, comparison baseline) into one band. The hero now exposes a generic `metaSlot` prop so future page-level controls can join the band without another component refactor. Settings → Dashboard remains the power-user backdoor for either surface; the dashboard's on-surface toggle stays gone (Marc said it crowded the tile strip too much). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
1 parent
33d7a381f6
commit
60a91afaee
2 files changed
+29
-8
No files matched your search
@@ -904,20 +904,19 @@ export default function InsightsPage() {
|
||||
|
||||
return (
|
||||
<div className="space-y-8">
|
||||
{/* v1.4.19 A3 — comparison toggle is now mounted INSIDE the hero
|
||||
meta band (alongside personal-baseline indicator + Generated
|
||||
timestamp + Regenerate button). The previous standalone band
|
||||
below the hero made the page read as three stacked cards
|
||||
with separate header / control rows; folding the toggle into
|
||||
the hero clusters every page-level control in one place. */}
|
||||
<InsightsPageHero
|
||||
updatedAt={advisor.payload?.cachedAt ?? heroUpdatedAt}
|
||||
onRegenerate={advisor.regenerate}
|
||||
regenerating={advisor.isRegenerating}
|
||||
metaSlot={<CompareToggle />}
|
||||
/>
|
||||
|
||||
{/* v1.4.16 phase D reconcile (CRITICAL C3) — on-surface comparison
|
||||
toggle. Mirrors the dashboard placement so flipping Vormonat /
|
||||
Vorjahr is one tap on the page that uses it, not 3 clicks
|
||||
via Settings → Dashboard. */}
|
||||
<div className="flex items-center justify-end">
|
||||
<CompareToggle />
|
||||
</div>
|
||||
|
||||
{/* v1.4.16 phase D reconcile (CRITICAL C1) — wire the polished
|
||||
`<InsightAdvisorCard>` (severity-ordered recommendations grid +
|
||||
per-rec rationale expand + confidence meter + thumbs feedback +
|
||||
|
||||
@@ -29,6 +29,9 @@ import { useTranslations } from "@/lib/i18n/context";
|
||||
* - `data-slot="insights-page-hero-generated"` — "Generated <time>"
|
||||
* - `data-slot="insights-page-hero-baseline"` — "Based on …"
|
||||
* - `data-slot="insights-page-hero-regenerate"` — regenerate button
|
||||
* - `data-slot="insights-page-hero-meta-slot"` — v1.4.19 A3 page-
|
||||
* level meta slot
|
||||
* (comparison toggle)
|
||||
*/
|
||||
|
||||
interface InsightsPageHeroProps {
|
||||
@@ -38,6 +41,16 @@ interface InsightsPageHeroProps {
|
||||
onRegenerate?: () => void;
|
||||
/** Disables the regenerate button + flips the icon to a spinner. */
|
||||
regenerating?: boolean;
|
||||
/**
|
||||
* v1.4.19 A3 — page-level metadata slot. The comparison-baseline
|
||||
* toggle is mounted into the hero meta row (next to the personal-
|
||||
* baseline indicator + the "Generated …" caption) instead of
|
||||
* standing alone above the advisor card. Keeps every page-level
|
||||
* control in one band so the surface stops feeling like three
|
||||
* stacked cards with separate refresh / toggle / header
|
||||
* affordances.
|
||||
*/
|
||||
metaSlot?: React.ReactNode;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -64,6 +77,7 @@ export function InsightsPageHero({
|
||||
updatedAt,
|
||||
onRegenerate,
|
||||
regenerating = false,
|
||||
metaSlot,
|
||||
}: InsightsPageHeroProps) {
|
||||
const { t } = useTranslations();
|
||||
const generatedLine = updatedAt
|
||||
@@ -113,6 +127,14 @@ export function InsightsPageHero({
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
{metaSlot && (
|
||||
<div
|
||||
data-slot="insights-page-hero-meta-slot"
|
||||
className="flex flex-wrap items-center gap-2 pt-2"
|
||||
>
|
||||
{metaSlot}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{onRegenerate && (
|
||||
<div className="flex shrink-0 items-start">
|
||||
|
||||
Reference in new issue
Block a user