Add bot graphics

Bots can now show a concept as a visual: create_graphic (with
update_graphic, read_graphic and list_graphics, on every run, no computer
needed) stores one HTML document in bot_graphics, per user like the
conversation, and the chat renders its [graphic:ID] ref as an inline card
sized to fit, with a large view and a page of its own (no rail).

Graphic HTML is treated as hostile: it is only served at /graphics/<id>
with a CSP sandbox allowing scripts under an origin of its own and no
network, loading only the vendored Chart.js and Mermaid from
/graphics-lib/. The document carries the app's theme vars and scrollbars,
reports its height to the thread, and a frame that navigates away is
closed.

Co-Authored-By: Claude Opus 5.5 <[email protected]>
This commit is contained in:
2026-10-27 08:11:15 +01:00
co-authored by Claude Opus 5.5
parent 51fd4d5538
commit bea656ade8
65 changed files with 1959 additions and 21 deletions
+8 -4
View File
@@ -11,11 +11,13 @@ import BotsRail from "./(sections)/bots-rail";
import LiveSocket from "./(sections)/live-socket";
import AddFlow from "./(partials)/add-flow";
import OfflineBanner from "./(partials)/offline-banner";
import isRaillessPage from "./(utils)/is-railless-page";
/**
* Full-bleed shell for every `/admin/*` page: the rail of bot conversations
* and workspaces, then the page (a conversation, a workspace, or
* settings), inside the Add flow both can open. No cards, no shadows;
* settings), inside the Add flow both can open. A graphic's own page
* (`isRaillessPage`) goes without the rail. No cards, no shadows;
* regions are separated by 1px hairlines. Below `md` the rail slides over
* the page instead of taking width. Height is `dvh`, so the on-screen
* keyboard doesn't push the composer out of view.
@@ -50,9 +52,11 @@ export default function BotsLayout({
return () => window.removeEventListener("keydown", onKeyDown);
}, [drawer_open]);
const has_rail = !isRaillessPage({ pathname });
const drawer = useMemo(
() => ({ open: drawer_open, setOpen: setDrawerOpen }),
[drawer_open],
() => ({ open: drawer_open, setOpen: setDrawerOpen, has_rail }),
[drawer_open, has_rail],
);
return (
@@ -61,7 +65,7 @@ export default function BotsLayout({
<Stack className="w-full h-dvh gap-0! items-stretch overflow-hidden bg-paper text-ink pt-[env(safe-area-inset-top)] pb-[env(safe-area-inset-bottom)]">
{online ? null : <OfflineBanner />}
<Row className="grow min-h-0 w-full gap-0! flex-nowrap items-stretch overflow-hidden">
<BotsRail />
{has_rail ? <BotsRail /> : null}
<Row className="grow min-w-0 h-full gap-0! flex-nowrap items-stretch">
{children}
</Row>