Phase 1 of stylix integration (#1457): extract the Catppuccin palette into a dedicated, separately-linked stylesheet so a theme swap can replace just that file without rebuilding the rest of the frontend. - shared/src/theme.css (new): the `:root` palette, moved out of base.css (which now holds only the body typography it references). - shared/package.json: export `./theme.css`. - dashboard/src/theme.css + agent/src/theme.css (new): one-line re-exports of @hive/shared/theme.css so each package's esbuild emits its own standalone `dist/static/theme.css` (palette is NOT inlined into the page bundles). - both build.mjs: add theme.css to the CSS build list. - every page (dashboard index/flow/logs, agent index/stats/screen): link `theme.css` first, ahead of the page CSS, so the `:root` vars resolve for everything. - docs/web-ui/css-vars.md: document the split + the no-rebuild rationale. Behaviour-neutral — same colours, just relocated. Verified both `npm run build` outputs: theme.css emits standalone (383b) with the palette; no `--*` palette defs duplicated into common.css/agent.css. Phase 2 (nix derivation that swaps theme.css from stylix colours) is a follow-up; touches nix/frontend.nix, coordinating with damocles. Part of #1457.
64 lines
2.3 KiB
JavaScript
64 lines
2.3 KiB
JavaScript
// esbuild build for @hive/agent. Output layout (`dist/`):
|
|
//
|
|
// dist/index.html served at GET /
|
|
// dist/stats.html served at GET /stats
|
|
// dist/screen.html served at GET /screen
|
|
// dist/static/app.js served at /static/app.js (ESM bundle,
|
|
// pulls in @hive/shared + marked)
|
|
// dist/static/app.js.map source map sibling
|
|
// dist/static/stats.js served at /static/stats.js (pulls in
|
|
// chart.js/auto)
|
|
// dist/static/stats.js.map source map sibling
|
|
// dist/static/agent.css served at /static/agent.css (@import
|
|
// resolved from @hive/shared)
|
|
//
|
|
// The in-container Rust binary mounts `dist/` (with per-agent
|
|
// `hyperhive.frontend.extraFiles` layered on top) as a
|
|
// `tower_http::ServeDir` fallback; the layout above keeps every URL
|
|
// the HTML references reachable without rewriting paths.
|
|
|
|
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 });
|
|
|
|
// Two JS entries: the main app + the stats page. Both bundle their
|
|
// own deps so each page can be loaded independently.
|
|
await build({
|
|
entryPoints: [src('app.js'), src('stats.js')],
|
|
outdir: staticDir(''),
|
|
bundle: true,
|
|
format: 'esm',
|
|
platform: 'browser',
|
|
target: ['es2022'],
|
|
sourcemap: true,
|
|
logLevel: 'info',
|
|
});
|
|
|
|
// Bundle the CSS. `theme.css` re-exports the standalone Catppuccin
|
|
// palette (kept its own output file so a theme swap replaces only it,
|
|
// no bundle rebuild); `agent.css`'s @import lines pull in shared
|
|
// base.css + terminal.css from the @hive/shared workspace dep.
|
|
for (const entry of ['theme.css', 'agent.css']) {
|
|
await build({
|
|
entryPoints: [src(entry)],
|
|
outfile: staticDir(entry),
|
|
bundle: true,
|
|
loader: { '.css': 'css' },
|
|
logLevel: 'info',
|
|
});
|
|
}
|
|
|
|
for (const html of ['index.html', 'stats.html', 'screen.html']) {
|
|
copyFileSync(src(html), dist(html));
|
|
}
|
|
|
|
console.log('agent build ok →', dist(''));
|