agent: scaffold Preact rewrite, Header + StatusChips first slice
Adds a new Preact/TSX build alongside the existing app.js (esbuild
entry `main.tsx` → dist/static/main.{js,css}, same jsx/tsconfig shape
swarm-ui already uses) and the first real page slice: Header +
StatusChips, composing the Badge/Dropdown components from the prior
commit's PR. Not wired into index.html yet — app.js keeps rendering
the live page untouched while this fills in component by component
(state polling, the live SSE stream, login flow, inbox/todos, term
input) in follow-up commits on this branch.
StatusChips folds the model/effort pickers and pause into the badge
row itself (each badge IS its own control), replacing the old
overflow-menu-only pickers — the concrete fix the design guide already
names this page as needing. Presentational only for now (props, not
live data) so it's reviewable against sample data before being wired
to /api/state.
Screenshot-verified against the real agent.css/theme.css/colors.css
(headless chromium, sample data) — renders correctly.
Builds + tsc --noEmit clean.
This commit is contained in:
parent
f5a4e380c9
commit
93b34ebb9b
11 changed files with 334 additions and 3 deletions
16
frontend/packages/agent/src/main.tsx
Normal file
16
frontend/packages/agent/src/main.tsx
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
// Entry point for the Preact rewrite of the per-agent terminal page
|
||||
// (replacing app.js's imperative DOM). Not wired into index.html yet —
|
||||
// this lands in small, reviewable slices (component by component) per
|
||||
// mara's "one pr != one commit" note on the issue; `index.html`'s
|
||||
// `<script>` tag swaps from `app.js` to this bundle's output only once
|
||||
// the new page covers everything the old one did (state polling, the
|
||||
// live SSE stream, login flow, inbox/todos flyouts, slash commands).
|
||||
//
|
||||
// Mounts to `#preact-root`, a sibling of the legacy markup rather than
|
||||
// a full document takeover, so the two can coexist on a branch while
|
||||
// this is still in progress.
|
||||
import { render } from 'preact';
|
||||
import { Root } from './Root.js';
|
||||
|
||||
const root = document.getElementById('preact-root');
|
||||
if (root) render(<Root />, root);
|
||||
Loading…
Reference in a new issue