519edce373
Validation: shared NaN-guarded Zod coercion helpers in schemas/common.ts replace the raw number|string transform idiom across every schema (the root-cause NaN bug class); emailOrEmpty + lenient isoDateString/timeString. Security: roles privilege-escalation closed; refresh-token family revocation on reuse; TOTP uses config params; read endpoints permission-guarded; received-invoices gross VAT on all paths; orders-pdf custom-items authz. Concurrency: $queryRaw SELECT...FOR UPDATE locks in ascending-id order (warehouse confirm/cancel, attendance lockUserRow); uniqueness checks moved into create transactions (TOCTOU -> 409); deterministic id tiebreak on second-precision timestamp ordering (plan resolveCell/resolveGrid, warehouse FIFO). Frontend: Rules-of-Hooks fixed across ~14 pages + PlanCellModal; UTC-date persisted fields; dashboard invalidation gaps; stale-closure confirm bugs. Tooling/tests: ESLint flat config (react-hooks/rules-of-hooks = error) + Prettier; tsconfig.test.json so tsc -b type-checks the tests; removed 3 dead deps; npm audit fix (8 -> 3). Suite 195 -> 247 (happy-path auth, FIFO oldest-first, flakiness fixes), isolated on app_test via .env.test with a hard-throw setup guard. Gates: tsc 0 | build 0 | vitest 247/247 | eslint 0 errors. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
72 lines
1.5 KiB
TypeScript
72 lines
1.5 KiB
TypeScript
import type { ReactNode } from "react";
|
|
import MuiTabs from "@mui/material/Tabs";
|
|
import Tab from "@mui/material/Tab";
|
|
import Box from "@mui/material/Box";
|
|
|
|
export interface TabDef {
|
|
value: string;
|
|
label: string;
|
|
}
|
|
|
|
// Deterministic ids so the Tab control and its TabPanel can cross-reference for
|
|
// a11y (aria-controls <-> aria-labelledby). Values are app-controlled strings.
|
|
const tabId = (value: string) => `tab-${value}`;
|
|
const panelId = (value: string) => `tabpanel-${value}`;
|
|
|
|
/** Tab bar over MUI Tabs. Pair with <TabPanel> for the content. */
|
|
export function Tabs({
|
|
value,
|
|
onChange,
|
|
tabs,
|
|
}: {
|
|
value: string;
|
|
onChange: (v: string) => void;
|
|
tabs: TabDef[];
|
|
}) {
|
|
return (
|
|
<MuiTabs
|
|
value={value}
|
|
onChange={(_, v) => onChange(v)}
|
|
sx={{
|
|
borderBottom: 1,
|
|
borderColor: "divider",
|
|
minHeight: 44,
|
|
"& .MuiTab-root": { textTransform: "none", fontWeight: 600 },
|
|
}}
|
|
>
|
|
{tabs.map((t) => (
|
|
<Tab
|
|
key={t.value}
|
|
value={t.value}
|
|
label={t.label}
|
|
id={tabId(t.value)}
|
|
aria-controls={panelId(t.value)}
|
|
/>
|
|
))}
|
|
</MuiTabs>
|
|
);
|
|
}
|
|
|
|
/** Renders children only when its value matches the current tab. */
|
|
export function TabPanel({
|
|
value,
|
|
current,
|
|
children,
|
|
}: {
|
|
value: string;
|
|
current: string;
|
|
children: ReactNode;
|
|
}) {
|
|
if (value !== current) return null;
|
|
return (
|
|
<Box
|
|
role="tabpanel"
|
|
id={panelId(value)}
|
|
aria-labelledby={tabId(value)}
|
|
sx={{ pt: 2.5 }}
|
|
>
|
|
{children}
|
|
</Box>
|
|
);
|
|
}
|