spencermandClaude Opus 5.5
70a97398f1
- C1 (issue 1): over target follows VISUAL ticket hours, not the timer. - C2 (issue 24): a Q.C. reject always needs a reason; accept needs an NCR number after a reject without one. - C3 (issue 25): an incomplete unit ITP blocks filing. - C4 (issue 27): prints open the print dialog on the page, no new tab. - C5 (issue 31): filing is blocked while VISUAL shows a work order open; the feed sets vclosed on VISUAL packets. - C6 (issue 8): the data book leaves out the history pages. - C7 (issue 18): the supervisor approves each received short; accept and filing wait for it. - C8 (issue 23): per-department checklists, edited by the department supervisor or Admin, frozen at START. - C9 (issue 32): Q.C. and Clerical may run the stamp check. - C10 (issue 33): the PM screen and reports are for PS-ProjectMgmt and Admin only. - C11 (issue 36): the Stall screen lists the packets assigned to the welder, at the supervisor's stall. Migration 0011. Docs: PLAN (also issue 9 confirmed, issue 4 asked), POLICY, SECURITY, SCHEMA, FEED, README, CHANGELOG. Co-Authored-By: Claude Opus 5.5 <[email protected]>
85 lines
3.1 KiB
TypeScript
85 lines
3.1 KiB
TypeScript
import { useEffect, useLayoutEffect, useRef } from "react";
|
|
import { Link, Outlet, useLocation } from "react-router";
|
|
import { SCREEN_LABELS, firstScreen, isScreen, type Screen } from "../auth/roles";
|
|
import { useAuth } from "../auth/useAuth";
|
|
import { replayClass } from "../lib/motion";
|
|
import { useScrollRestore } from "../lib/scrollRestore";
|
|
import { canChecklists, canStampCheck, shellScreens } from "../lib/toolAccess";
|
|
import { LockScreen } from "./LockScreen";
|
|
import { RoleSwitcher } from "./RoleSwitcher";
|
|
import { TopBar } from "./TopBar";
|
|
|
|
function chipClass(s: Screen): string {
|
|
if (s === "admin") return "rchip admin";
|
|
if (s === "supervisor") return "rchip supervisor";
|
|
return "rchip";
|
|
}
|
|
|
|
/** Page frame: the top bar, then the routed page inside main.wrap, and the lock screen over both. */
|
|
export function Layout() {
|
|
const auth = useAuth();
|
|
const { pathname } = useLocation();
|
|
const mainRef = useRef<HTMLElement>(null);
|
|
const locked = auth.status === "locked";
|
|
const me = auth.status === "ready" || locked ? auth.me : null;
|
|
|
|
const screens = me ? shellScreens(me.screens, me.roles) : [];
|
|
const seg = pathname.split("/")[1];
|
|
const active = isScreen(seg) && screens.includes(seg) ? seg : null;
|
|
const shown = active ?? firstScreen(screens);
|
|
|
|
// Back lands on the same spot; a new page starts at the top.
|
|
useScrollRestore();
|
|
|
|
// A new screen eases in (the old m-enter), only while body.motion is set; the CSS keys off both.
|
|
const lastPath = useRef<string | null>(null);
|
|
useLayoutEffect(() => {
|
|
const was = lastPath.current;
|
|
lastPath.current = pathname;
|
|
if (was === null || was === pathname) return;
|
|
return replayClass(mainRef.current, "m-enter", 700);
|
|
}, [pathname]);
|
|
|
|
// Keep the page mounted behind the lock, but out of reach of the keyboard and screen readers.
|
|
useEffect(() => {
|
|
mainRef.current?.toggleAttribute("inert", locked);
|
|
}, [locked]);
|
|
|
|
return (
|
|
<>
|
|
<TopBar nav={me && !locked ? <RoleSwitcher screens={screens} active={active} /> : null}>
|
|
{me ? (
|
|
<>
|
|
<b className="uname">{me.user.display_name}</b>
|
|
{shown ? <span className={chipClass(shown)}>{SCREEN_LABELS[shown]}</span> : null}
|
|
{canChecklists(me.roles) ? (
|
|
<Link className="btn sm ghost" to="/checklists">
|
|
Checklists
|
|
</Link>
|
|
) : null}
|
|
{canStampCheck(me.roles) ? (
|
|
<Link className="btn sm ghost" to="/stamp-check">
|
|
Stamp check
|
|
</Link>
|
|
) : null}
|
|
<Link className="btn sm ghost" to="/account">
|
|
Account
|
|
</Link>
|
|
<button className="btn sm ghost" type="button" onClick={() => void auth.signOut()}>
|
|
Sign out
|
|
</button>
|
|
</>
|
|
) : (
|
|
<span className="proto">Rebuild preview</span>
|
|
)}
|
|
</TopBar>
|
|
<div className={locked ? "blur-hidden" : undefined}>
|
|
<main className="wrap" id="main" ref={mainRef} aria-hidden={locked ? true : undefined}>
|
|
<Outlet />
|
|
</main>
|
|
</div>
|
|
{locked ? <LockScreen key={auth.me?.user.id ?? "unknown"} /> : null}
|
|
</>
|
|
);
|
|
}
|