mirror of
https://github.com/MBombeck/HealthLog.git
synced 2026-11-11 13:52:20 +00:00
Cmd/Ctrl+K or the search control at the end of the top bar opens a combobox over a client-side index built from the lists the navigation already renders: pages, Insights pages, every Settings section and card (deep-linked by a new anchor prop on SettingsCardHeader), the Appearance sub-pages, module switches and a few actions. Entries follow the module map, the Coach capability, the admin role and a shared record's grant; inside somebody else's record no cards, switches or backup are offered. Ranking is prefix, then word start, then substring, then a small edit distance, then subsequence, with a short multilingual synonym list. The empty state shows recent places (per account, in localStorage) and the main actions. The palette is its own lazily loaded chunk; the top bar shows a search field where it has room and a magnifier otherwise. The module switch mutation moves into a shared hook used by the Modules hub and the palette.
36 lines
873 B
TypeScript
36 lines
873 B
TypeScript
import type { LucideIcon } from "lucide-react";
|
|
|
|
import { SettingsCard } from "@/components/settings/settings-card";
|
|
import { SettingsCardHeader } from "@/components/settings/_card-header";
|
|
|
|
export interface ImportCardShellProps {
|
|
testId: string;
|
|
/** Deep-link anchor for the card (`/settings/export#<anchor>`). */
|
|
anchor: string;
|
|
icon: LucideIcon;
|
|
title: string;
|
|
description: string;
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
export function ImportCardShell({
|
|
testId,
|
|
anchor,
|
|
icon: Icon,
|
|
title,
|
|
description,
|
|
children,
|
|
}: ImportCardShellProps) {
|
|
return (
|
|
<SettingsCard data-testid={testId} className="flex h-full flex-col">
|
|
<SettingsCardHeader
|
|
anchor={anchor}
|
|
icon={Icon}
|
|
title={title}
|
|
description={description}
|
|
/>
|
|
<div className="flex flex-1 flex-col gap-3">{children}</div>
|
|
</SettingsCard>
|
|
);
|
|
}
|