mirror of
https://github.com/MBombeck/HealthLog.git
synced 2026-11-14 14:40:52 +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.
40 lines
1.2 KiB
TypeScript
40 lines
1.2 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { ChevronLeft } from "lucide-react";
|
|
|
|
import { cn } from "@/lib/utils";
|
|
import { useTranslations } from "@/lib/i18n/context";
|
|
|
|
/**
|
|
* v1.17.1 (N-5) — the up-affordance for a hub child editor.
|
|
*
|
|
* 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 return path existed only implicitly (tap
|
|
* the highlighted rail entry); this is the explicit "← back to hub" link
|
|
* at the top of the child, so the hub → child → hub loop reads clearly,
|
|
* especially on mobile where the rail collapses to a chip strip.
|
|
*/
|
|
export function SettingsHubBackLink({
|
|
href,
|
|
labelKey,
|
|
}: {
|
|
href: string;
|
|
labelKey: string;
|
|
}) {
|
|
const { t } = useTranslations();
|
|
return (
|
|
<Link
|
|
href={href}
|
|
className={cn(
|
|
"text-muted-foreground hover:text-foreground -mx-1 inline-flex w-fit items-center gap-1 rounded-md px-1 py-0.5 text-xs font-medium transition-colors",
|
|
)}
|
|
>
|
|
<ChevronLeft className="h-3.5 w-3.5 shrink-0" aria-hidden="true" />
|
|
{t(labelKey)}
|
|
</Link>
|
|
);
|
|
}
|