mirror of
https://github.com/MBombeck/HealthLog.git
synced 2026-11-11 13:52:20 +00:00
Marc-André Bombeck
3fc195e1c0
The four Layout personalization editors (dashboard, insights, medications, mood) are reached through the Layout & Personalization hub or a page-header cog, and the left rail highlights the hub while the body shows the child. The only return path was tapping the highlighted rail entry — no explicit up-affordance, sharper on mobile where the rail collapses to a chip strip. Add a shared back-to-hub link at the top of each child so the hub → child → hub loop reads clearly. Also fix the stale doc-comment on the settings section route: the slug set is 16 (12 nav-visible plus the four routable-but-hidden Layout children), not eight.
45 lines
1.7 KiB
TypeScript
45 lines
1.7 KiB
TypeScript
"use client";
|
|
|
|
import { InsightsOverviewArrangeSection } from "@/components/settings/insights-overview-arrange-section";
|
|
import { InsightsPillOrderSection } from "@/components/settings/insights-pill-order-section";
|
|
import { SettingsHubBackLink } from "@/components/settings/settings-hub-back-link";
|
|
import { useTranslations } from "@/lib/i18n/context";
|
|
|
|
/**
|
|
* v1.15.18 — the "Insights" settings section (analogous to the Dashboard
|
|
* section). Hosts two blocks:
|
|
* 1. Arrange the OVERVIEW — section show/hide + order, persisted to
|
|
* `insightsLayoutJson.sections` (the v1.15.11 inline edit mode).
|
|
* 2. Sort the navigation PILLS — pill order, persisted to
|
|
* `insightsLayoutJson.tiles[].order` (already a separate field in v2).
|
|
*
|
|
* Both write through the same `/api/insights/layout` contract the tab strip
|
|
* and the overview share, so a save here repaints both surfaces in lockstep.
|
|
*/
|
|
export function InsightsSection() {
|
|
const { t } = useTranslations();
|
|
|
|
return (
|
|
<section
|
|
aria-labelledby="settings-section-insights-title"
|
|
className="space-y-6"
|
|
>
|
|
<header className="space-y-2">
|
|
<SettingsHubBackLink
|
|
href="/settings/layout"
|
|
labelKey="settings.sections.layout.backToHub"
|
|
/>
|
|
<h1 id="settings-section-insights-title" className="sr-only">
|
|
{t("settings.sections.insights.title")}
|
|
</h1>
|
|
<p className="text-muted-foreground text-sm">
|
|
{t("settings.sections.insights.description")}
|
|
</p>
|
|
</header>
|
|
|
|
<InsightsOverviewArrangeSection id="insights-overview-arrange" />
|
|
<InsightsPillOrderSection id="insights-pill-order" />
|
|
</section>
|
|
);
|
|
}
|