3. Batch B — Detail and editor (DetailLayout)
B1. Email template editor
Section titled “B1. Email template editor”- Route
/admin/email-templates?template=…·panels/EmailTemplateEditor.tsx,EmailTemplateTypeSelector.tsx. - Reference: mgr1 (back + title + tabs), mgr3 (segmented control), org5 (Discard/Save).
- Layout:
DetailLayout.back“← All templates”,titletemplate label,statuspill “Edited” / “Default”,meta“{stream} · to {audience}”.actions: primary “Save”; outline “Preview” (scrolls/switches to the Preview tab on mobile). More: “Reset to default…” (confirm, existing copy “Reset email template?”).tabs: Edit · Preview · Default.- Scope selector (
EmailTemplateTypeSelector) sits under the title as a segmented control “Space default | Laser cutter | 3D printer …” (mgr3). - Edit tab body: Subject, Plain text (tall), HTML (if present).
rail: Merge fields list (click to insert at cursor; the description is a tooltip). - Preview tab: subject line, plain text, sandboxed HTML frame (unchanged security).
- Default tab: read-only “Space default reference” or “Built-in default reference”.
- States: unsaved changes: the footer shows “Unsaved changes” + Discard. Save error inline under Save.
B2. Stocktake session (count)
Section titled “B2. Stocktake session (count)”- Route
/admin/stocktake?session={id}·StocktakeCountSection.tsx. - Reference: mgr2 (scan + find + recent with Undo), mgr1 header.
- Layout:
DetailLayout.back“← All counts”,identitychip “#{id}”,titlenotes or “Count of {container}”,statuspill,meta“Started {date} · {blind ? ‘Blind count’ : ‘Expected shown’}”.actionsby status: Counting → primary “Complete count”; Completed → “Approve”; Approved → “Apply adjustments” (confirm: “Apply {n} adjustments? Inventory numbers will change.”).stats: Lines counted[loaded]· Variances[loaded].body: the ScanWorkbench (camera or paste + product/container select + qty + “Record count”) and below it a “Counted so far” list (product, counted, expected if not blind, variance pill).
- States: empty counted list: “No counts recorded yet. Scan or pick an item to start.”
B3. Container detail (drawer)
Section titled “B3. Container detail (drawer)”- Side drawer
DetailLayout(drawer presentation):titlelabel,metacode · location,statusActive/Inactive,tabsContents · History · Details.- Contents: Products (name · available) and Units (asset tag · status pill · inline “Show QR” ·
[...]Warranty). Sub-containers as chips. - History: scan rows (time · context · “Reviewed handover” / “QR scan”).
- Details: settings rows Label, Location, Active toggle, Kit components (when kit feature on), Save.
- Contents: Products (name · available) and Units (asset tag · status pill · inline “Show QR” ·
- States: Contents empty: “This container is empty.” · History empty: “No scans yet.”
B4. Device detail (drawer)
Section titled “B4. Device detail (drawer)”- Covered in A13.
B5. Machine service console / printer service console (tab body)
Section titled “B5. Machine service console / printer service console (tab body)”- Where: inside the core machine-type page (
panels/machine/MachineTypePage.tsx; the page frame is owned byux-spec.md). ComponentsMachineServiceConsole.tsx,PrinterServiceConsole.tsx. - Reference: org2 tabs + rows, mgr2 inline actions.
- Slot fill: the type page’s
DetailLayoutgets a “Queue” tab (and “Manual usage” and, for printers, “Printer reports” tabs) instead of stackedSubsections.- Queue tab: sub-tabs Pending · Accepted · Printing (in progress) · Ready (completed) · Failed, each with
[loaded]counts. Rows: requester chip · job title · meta “Planned {q} {unit} · actual {q} {unit}” · status pill · one inline next action (Pending → “Accept”, Accepted → “Start”, In progress → “Complete”, Completed → “Hand over”, Failed → “Reprint”). Reject and Fail live in the row[...]in red. The action form (minutes, machine, pool, reason) opens as a dialog titled by the verb (“Start job”, “Complete job”, “Mark failed”) instead of an inline bordered box. - Manual usage tab: primary “Log usage” (dialog), list of entries (outcome pill · qty · minutes).
- Info line under the tabs (muted): “This type is metered in {unit}.” Pool guidance appears as helper text in the Start dialog.
- Queue tab: sub-tabs Pending · Accepted · Printing (in progress) · Ready (completed) · Failed, each with
- States: “No jobs waiting. New requests land here.” / “No manual usage logged yet.”
Part of UX spec: long-tail screens (Space Works UX across all of SpaceWorks), published from docs/ux-screens-longtail.md. Edit it there.