peter
63a0fecc8b
A pure move (git mv, history kept): 333 files leave components/, which now holds only the platform layer (ui/) and the legal pages. The shell is the frame (App, header, nav rail, palette, boot); each page lives in modules/<page>/ with its rail, store and tests; what several pages share sits in features/<name>/; the shared-link page is watch/. Domain-free helpers went straight to ui/ (ViewSwitcher, FilterRail, the confirm dialog, the language switcher, the copy rows). Every relative specifier was rewritten (imports, dynamic imports, vi.mock, new URL), and the contract tests that scan sources now scan the whole app source, not only components/ — each glob was counted before and after so none went green over fewer files. The locale-format rule matched `/src/components/` only, so the move would have taken ~300 files out from under its i18n-singleton check; it now covers every folder that holds components, with a test per folder.
64 lines
1.9 KiB
TypeScript
64 lines
1.9 KiB
TypeScript
import type { ReactNode } from "react";
|
|
|
|
import { navItemAttrs } from "../../lib/listNav";
|
|
import { Pressable } from "../../components/ui/Pressable";
|
|
|
|
// One dense row of a history list — a background run, an admin action, a log line (./LogLine draws
|
|
// its lines through this): its cells on one line, and the row opens in place to its details. One frame
|
|
// for all of them, so a row opens, announces itself and takes the keyboard the same on every tab.
|
|
// Inside a NavGrid the keyboard walks the rows (`j`/`k`) and Enter opens one.
|
|
|
|
export default function HistoryRow({
|
|
cells,
|
|
grid,
|
|
navIndex,
|
|
navText,
|
|
open,
|
|
onToggle,
|
|
title,
|
|
line = false,
|
|
children,
|
|
}: {
|
|
/** The row's cells, laid out by `grid`. */
|
|
cells: ReactNode;
|
|
/** The grid's column template classes (phone first, then wider screens). */
|
|
grid: string;
|
|
navIndex: number;
|
|
/** What the keyboard's type-ahead matches. */
|
|
navText: string;
|
|
open: boolean;
|
|
onToggle: () => void;
|
|
/** The row button's tooltip — the full date. */
|
|
title?: string;
|
|
/** A log line: tighter, its cells on one text baseline, its size the (monospace) list's own. */
|
|
line?: boolean;
|
|
/** The detail shown while the row is open. */
|
|
children: ReactNode;
|
|
}) {
|
|
return (
|
|
<div
|
|
className="border-b border-border/50 last:border-b-0"
|
|
{...navItemAttrs(navIndex, navText, { inset: true })}
|
|
>
|
|
<Pressable
|
|
selectable
|
|
layer={!open}
|
|
data-nav-open
|
|
aria-expanded={open}
|
|
onClick={onToggle}
|
|
title={title}
|
|
className={`grid w-full gap-x-2 px-3 text-left touch-target pointer-coarse:content-center ${
|
|
line ? "items-baseline py-1" : "items-center py-1.5 text-xs"
|
|
} ${grid} ${open ? "bg-accent/10" : ""}`}
|
|
>
|
|
{cells}
|
|
</Pressable>
|
|
{open && (
|
|
<div className={`bg-accent/5 px-3 py-2 text-muted ${line ? "" : "text-xs"}`}>
|
|
{children}
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|