Starship Survivors Wiki

WeaponWorkbenchScreen

2 min read

PURPOSE

Top-level screen component for the Weapon Workbench (forge) tool. Renders a portal-mounted, fullscreen two-pane layout: the forge library on the left and the forge editor on the right. Acts purely as a layout shell — all interactive behavior lives in the two child panes.

OWNS

  • The default export WeaponWorkbenchScreen.
  • The fullscreen portal root attached to document.body with data-testid="workbench-root".
  • The two-column CSS grid layout (320px 1fr, gap 1) and root chrome styles: fixed inset 0, background #0a0a12, color #ddd, font family Space Grotesk, sans-serif.

READS FROM

  • ./weapon-workbench/ForgeLibraryPane — left-pane component.
  • ./weapon-workbench/ForgePane — right-pane component.
  • react-dom — createPortal.
  • document.body — portal mount target.

PUSHES TO

  • The DOM, via the portal mount on document.body.

DOES NOT

  • Manage workbench state, selection, persistence, or editor logic — delegated to the child panes and their state modules under weapon-workbench/state/.
  • Handle routing, navigation, or screen mounting — the caller decides when to render this component.
  • Apply mobile/responsive breakpoints; the layout is fixed at two columns.
  • Subscribe to any store directly.
  • Pass props to its children — the panes wire themselves to state independently.

Signals

None emitted by this file. The component renders deterministically with no inputs.

Entry points

  • Default export WeaponWorkbenchScreen() — invoked by whichever shell mounts the workbench screen.
  • data-testid="workbench-root" on the root element — test-harness selector for the portaled container.

Pattern notes

  • Portal-to-body pattern bypasses any parent layout constraints, guaranteeing the workbench fills the viewport regardless of caller.
  • Pure layout shell: zero hooks, zero state, zero props. All complexity is pushed into the two child panes, keeping this file as a stable contract between the screen mount and the workbench internals.
  • Two-pane split is hardcoded at a 320px fixed left column with the rest flexing — fits a list/detail authoring workflow.
  • Inline styles only; no CSS module or styled-components dependency at this level.

Graph View