swarm-ui: bootstrap new swarm-level frontend (Preact + wouter + TS + JSX)
Project-bootstrap scope per the issue: static build as a nix pkg, empty start page for now, functionality deferred until auth against authelia is figured out. Stack (Preact + wouter + TypeScript + JSX) matches the shell decision from the earlier framework-paths thread — a real SPA shell with a router and deep links, distinct from the per-hive dashboard's vanilla-JS + custom-element MPA. - New npm workspace frontend/packages/swarm-ui: one route (/), a wouter Switch/Route shell, a 404 fallback. Reuses @hive/shared's colors.css/theme.css/base.css for visual consistency; no other shared JS (the vanilla-JS el()/dom.js helpers are superseded by Preact in this shell). - nix/packages/swarm-ui.nix: its own buildNpmPackage derivation (scoped to just this workspace via an explicit buildPhase), not folded into nix/packages/frontend.nix's packages.default closure — same reasoning swarm-controller/swarmctl already use for staying out of daemonBins: a hive that doesn't run the swarm controller shouldn't carry swarm-ui bytes. - npmDepsHash recomputed in both frontend.nix and swarm-ui.nix (same shared lockfile, new deps: preact, wouter-preact, typescript). - Added swarm-ui to nix/checks.nix alongside frontend, for the same FOD-staleness reason plus being the only thing that actually builds it in CI (not in packages.default's closure like frontend is, so nix flake check wouldn't otherwise touch it). - npm run typecheck (tsc --noEmit) is available locally; not yet wired into CI — esbuild transpiles TS without type-checking, so that's a real gap, left as a follow-up rather than growing this bootstrap PR with a new CI workflow step. Verified: nix build .#swarm-ui and .#frontend both succeed; npm run build (root, all workspaces) succeeds; tsc --noEmit clean; scripts/check-issue-refs.sh clean.
This commit is contained in:
parent
307c335662
commit
7d1b18d2c8
16 changed files with 698 additions and 5 deletions
59
frontend/packages/swarm-ui/build.mjs
Normal file
59
frontend/packages/swarm-ui/build.mjs
Normal file
|
|
@ -0,0 +1,59 @@
|
|||
// esbuild build for @hive/swarm-ui (project-bootstrap scope). Output
|
||||
// layout (`dist/`):
|
||||
//
|
||||
// dist/index.html served at GET /
|
||||
// dist/static/main.js served at /static/main.js (ESM bundle,
|
||||
// Preact + wouter-preact)
|
||||
// dist/static/main.js.map source map sibling
|
||||
// dist/static/colors.css served at /static/colors.css
|
||||
// dist/static/theme.css served at /static/theme.css
|
||||
// dist/static/swarm-ui.css served at /static/swarm-ui.css (@import
|
||||
// resolved from @hive/shared)
|
||||
//
|
||||
// Not yet wired into any Rust binary's `ServeDir` — swarm-controller
|
||||
// only serves `/health` today (see swarm-controller/README.md); this
|
||||
// just makes `dist/` buildable so nix/packages/swarm-ui.nix has
|
||||
// something to package. `.tsx` → JS: esbuild transpiles TypeScript
|
||||
// natively (types stripped, not checked) — run `npm run typecheck`
|
||||
// (plain `tsc --noEmit`) separately for real type errors; not yet
|
||||
// wired into CI.
|
||||
|
||||
import { build } from 'esbuild';
|
||||
import { mkdirSync, copyFileSync, rmSync } from 'node:fs';
|
||||
import { dirname, resolve } from 'node:path';
|
||||
import { fileURLToPath } from 'node:url';
|
||||
|
||||
const here = dirname(fileURLToPath(import.meta.url));
|
||||
const src = (p) => resolve(here, 'src', p);
|
||||
const dist = (p) => resolve(here, 'dist', p);
|
||||
const staticDir = (p) => resolve(here, 'dist', 'static', p);
|
||||
|
||||
rmSync(dist(''), { recursive: true, force: true });
|
||||
mkdirSync(staticDir(''), { recursive: true });
|
||||
|
||||
await build({
|
||||
entryPoints: [src('main.tsx')],
|
||||
outfile: staticDir('main.js'),
|
||||
bundle: true,
|
||||
format: 'esm',
|
||||
platform: 'browser',
|
||||
target: ['es2022'],
|
||||
sourcemap: true,
|
||||
logLevel: 'info',
|
||||
jsx: 'automatic',
|
||||
jsxImportSource: 'preact',
|
||||
});
|
||||
|
||||
for (const entry of ['colors.css', 'theme.css', 'swarm-ui.css']) {
|
||||
await build({
|
||||
entryPoints: [src(entry)],
|
||||
outfile: staticDir(entry),
|
||||
bundle: true,
|
||||
loader: { '.css': 'css' },
|
||||
logLevel: 'info',
|
||||
});
|
||||
}
|
||||
|
||||
copyFileSync(src('index.html'), dist('index.html'));
|
||||
|
||||
console.log('swarm-ui build ok →', dist(''));
|
||||
Loading…
Reference in a new issue