address review: trim JobqGraph.tsx's comment under 30 lines, fix stale .jsx ref

Both introduced by this PR's own JSX->TSX conversion, caught by argus:
the top-of-file comment grew to 42 lines converting it, and JobsPage.css
still pointed at 'JobqGraph.jsx's own comment' after the rename.
This commit is contained in:
iris 2026-08-16 17:16:27 +02:00 committed by mara
commit b4b4967ec9
2 changed files with 19 additions and 31 deletions

View file

@ -5,41 +5,29 @@
// hand). Renders an indented state tree: `payload.label` verbatim, // hand). Renders an indented state tree: `payload.label` verbatim,
// `payload.data` as a generic key/value list. Light DOM, shared by the // `payload.data` as a generic key/value list. Light DOM, shared by the
// dashboard and swarm-ui — both esbuild configs run `jsx: 'automatic', // dashboard and swarm-ui — both esbuild configs run `jsx: 'automatic',
// jsxImportSource: 'preact'`, and esbuild transpiles `.tsx` (types // jsxImportSource: 'preact'` and transpile `.tsx` (types stripped, not
// stripped, not checked) the same way regardless of whether the // checked) the same way regardless of whether the consumer runs `tsc`
// consuming package runs `tsc` itself — swarm-ui does (`npm run // itself — swarm-ui does (`npm run typecheck`), dashboard doesn't, both
// typecheck`), dashboard doesn't, both build clean off the same file. // build clean off this one file. Real TypeScript rather than a hand-
// // maintained ambient `.d.ts` at each TS consumer, which would duplicate
// Real TypeScript rather than a hand-maintained ambient `.d.ts` at each // the prop list and drift the moment this file's signature changes.
// TS consumer: a `declare module` block duplicates the prop list and
// drifts the moment this file's signature changes without the
// declaration being touched. Typing the source once means every
// consumer's typecheck is checking the real shape, not a copy of it.
// //
// `cancellable` adds a per-node cancel button calling `onCancel(id)` // `cancellable` adds a per-node cancel button calling `onCancel(id)`
// directly (a plain prop). `onUpdate(nodes)` fires after every fetch, // directly. `onUpdate(nodes)` fires after every fetch, for a host
// for a host needing the raw list (a count badge, a live-log panel) // needing the raw list (a count badge, a live-log panel) without its
// without its own parallel fetch. // own parallel fetch.
// //
// Two ways to use this: JSX (swarm-ui, or any future dashboard page // Two ways to use this: JSX (swarm-ui, or any dashboard page that
// that renders it directly) — `<JobqGraph endpoint="..." cancellable // renders it directly) — `<JobqGraph endpoint="..." cancellable
// onCancel={...} onUpdate={...} />`, a normal component. Or imperative // onCancel={...} onUpdate={...} />`. Or imperative mount
// mount (dashboard/src/builds.js, which stays plain `.js` — a `.tsx` // (dashboard/src/builds.js, plain `.js` — mounting needs no JSX pragma)
// call site still needs a JSX-aware file, mounting doesn't) — // — `mountJobqGraph(container, props)` returns `{ refresh(), update(props) }`.
// `mountJobqGraph(container, props)` returns a `{ refresh(),
// update(props) }` handle.
// //
// Styles live in `@hive/shared/jobq-graph.css`, `@import`ed from a // Styles live in `@hive/shared/jobq-graph.css`, `@import`ed from a
// page/component CSS file rather than imported here. This one stays // page/component CSS file rather than imported here — dashboard bundles
// necessary regardless of the JSX/TS question above: dashboard bundles // this component transitively through an esbuild call whose `.css`
// every page entry (including this component, pulled in transitively) // loader is `text` (for unrelated shadow-DOM components' CSS-as-string
// through one esbuild call whose `.css` loader is `text` — a handful of // needs), and that loader is global per call, not per-module.
// shadow-DOM components (modal.js, hive-btn.js) need their CSS as a
// literal string to inject into a shadow root, and esbuild's loader map
// is global per call, not per-module. Importing `.css` here would
// silently pick up that `text` loader too and bind a useless string
// instead of applying styles, so this file imports no CSS at all;
// each consumer's own page/component CSS `@import`s it instead.
import { h, render } from 'preact'; import { h, render } from 'preact';
import { useState, useEffect, useCallback } from 'preact/hooks'; import { useState, useEffect, useCallback } from 'preact/hooks';

View file

@ -2,6 +2,6 @@
swarm-controller's own /api/jobq/graph endpoint (same wire shape swarm-controller's own /api/jobq/graph endpoint (same wire shape
hive-c0re's dashboard consumes, see hive-jobq-wire's README). Styles hive-c0re's dashboard consumes, see hive-jobq-wire's README). Styles
are @hive/shared's jobq-graph.css, @import'ed here rather than from are @hive/shared's jobq-graph.css, @import'ed here rather than from
the component file itself see JobqGraph.jsx's own comment for why the component file itself see JobqGraph.tsx's own comment for why
that split exists (esbuild's loader map is global per bundle call). */ that split exists (esbuild's loader map is global per bundle call). */
@import "@hive/shared/jobq-graph.css"; @import "@hive/shared/jobq-graph.css";