mirror of
https://github.com/windmill-labs/windmill.git
synced 2026-08-19 08:01:25 +00:00
Guilhem
90a196d8d8
* feat(raw_apps): surface UI Builder build errors over the preview pane Companion to the matching change in the UI Builder repo (see linked PR), which stops rendering the build-error overlay over the VS Code editor iframe and instead emits a `buildError` postMessage on every build (message: undefined on success to clear). Listen for that message on the existing window message handler (already source-gated by the UI Builder iframe), store it in a `buildError` $state, and surface it in two places: * A red banner over the preview iframe, sibling to the existing logs overlay (`top-12 left-2 right-2 z-20` so it clears the tab bar) — failures appear right where the user looks for the rendered output. * The Preview tab's icon and label tint red (`text-red-600 dark:text-red-400`, matching the existing error convention in raw_apps) — important in single-tab mode where the preview pane is collapsed to 0px and the banner would be hidden. Done by mapping `leftPaneTabs` / `rightPaneTabs` through a small `tintPreviewOnError` helper so the source-of-truth `tabs` array is untouched (DnD, ordering, fallback selection keep using the original previewTab object). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * refactor(raw_apps): use Alert component for the build-error banner Replace the hand-rolled red div with the shared `Alert` component (`type="error"`, `title="Build failed"`). The error text stays in a `<pre>` child so multi-line bundler output keeps its formatting, with `max-h-60` so a long error never takes over the whole preview pane. The absolute-positioned wrapper (`top-12 left-2 right-2 z-20`) and the `role="alert"` move to that wrapper so the Alert component itself stays unstyled at the call site. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(raw_apps): solid bg-surface backing behind build-error Alert The Alert's error background is semi-transparent in dark mode (`bg-red-900/40` in `common/alert/model.ts`), so the preview iframe shows through when the banner is laid over it. Add a `::before` pseudo on the Alert root with `bg-surface` (matched `rounded-md`, `-z-10` so it sits behind the red bg) to give it a solid plate. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * refactor(raw_apps): isolate banner stacking context, DRY tab tint chain Two small follow-ups from review: * Add `isolate` to the build-error banner wrapper so the `before:-z-10` pseudo's stacking context is pinned locally — it works today because `position: absolute` + `z-20` creates one, but `isolate` makes the dependency self-documenting and survives a future refactor that removes the explicit `z-20`. * Extract `tintTabs = (ts) => ts.map(tintPreviewOnError)` so the two `$derived` blocks for leftPaneTabs / rightPaneTabs read identically. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore(raw_apps): trim build-error overlay comments Per review feedback. Keep only the load-bearing facts (bg-surface backs the Alert's translucent red, isolate pins the pseudo stacking, the `message: undefined` clear convention) and drop the prose context that duplicated what the code already shows. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore(raw_apps): bump bundled ui_builder to 00c9834 Brings in the postMessage emission from windmill-labs/windmill-code-ui-builder#9 (merged) so this PR's host listener actually receives `buildError` events. SHA verified against the R2 artifact. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>