frontend: create the side-panel instance eagerly, not lazily behind a per-call guard

Per mara's review on the side-panel PR: create the shared <hive-side-panel>
instance once at module-evaluation time instead of lazily on first call
via an ensurePanel() guard every wrapper method had to remember to call.
ES modules execute after the document is parsed (same timing as a defer
script), so document.body is already available when this code runs --
lazy init bought nothing here and left a footgun for any future method
added to either wrapper.
This commit is contained in:
iris 2026-08-01 00:32:16 +02:00 committed by mara
commit 996899fcad
2 changed files with 29 additions and 37 deletions

View file

@ -287,27 +287,23 @@ export function openBuildLogStream(id, pre, { onDone, onError } = {}) {
//
// Thin wrapper around the shared `<hive-side-panel>` element (see
// @hive/shared/side-panel.js for the chrome/behavior it owns, including
// drag-to-resize) — the instance is created and appended to <body>
// lazily on first use, same pattern `themedToast` uses for its
// toast-stack container. `side-panel-body` is a plain compatibility
// drag-to-resize). The instance is created once, eagerly, at module
// evaluation time — ES modules run after the document is parsed (same
// timing `defer` scripts get), so `document.body` already exists here;
// no per-call lazy-init guard needed, and no easy-to-forget step for
// any new method added later. `side-panel-body` is a plain compatibility
// class this wrapper puts on its own instance so `common.css`'s
// existing `.side-panel-body .md …` rules keep reaching the slotted
// content by ordinary light-DOM descendant matching — the shared
// element itself has no idea that class name means anything.
let panelEl = null;
function ensurePanel() {
if (!panelEl) {
panelEl = document.createElement('hive-side-panel');
panelEl.classList.add('side-panel-body');
document.body.append(panelEl);
}
return panelEl;
}
const panelEl = document.createElement('hive-side-panel');
panelEl.classList.add('side-panel-body');
document.body.append(panelEl);
export const Panel = {
open: (title, content) => ensurePanel().open(title, content),
openNamed: (name, title, content) => ensurePanel().openNamed(name, title, content),
refresh: (name, title, content) => ensurePanel().refresh(name, title, content),
close: () => ensurePanel().close(),
open: (title, content) => panelEl.open(title, content),
openNamed: (name, title, content) => panelEl.openNamed(name, title, content),
refresh: (name, title, content) => panelEl.refresh(name, title, content),
close: () => panelEl.close(),
};
// ─── path linkification ─────────────────────────────────────────────────