@wular/coder 0.4.7 → 0.4.8

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/dash/[org]/agents/[slug]/(tabs)/settings/agent-settings-form.dd8f3cbc00876ebd.js

@@ -0,0 +1,408 @@
+"use client";
+import "./agent-settings-form.2d19ea3a4d380e0d.css.pnext-asset.js";
+import { useLayoutEffect, useRef, useState } from "../../../../../../../../../../../../node_modules/preact/hooks/dist/hooks.mjs";
+import { client } from "../../../../../../../utils/client.d25e6dcc6704eb60.js";
+import { useAction } from "../../../../../../../utils/action.568346602027ac74.js";
+import { useRouter } from "../../../../../../../../../../../../node_modules/@wular/pnext/src/api/client-navigation.ts";
+import { useOrg } from "../../../../../../../comps/nav/org.813dc34bd23a336f.js";
+import { Link } from "../../../../../../../../../../../../node_modules/@wular/pnext/src/api/link.tsx";
+import { editableAgent } from "../../../../../../../api/types.9f59e6c761d6aac4.js";
+import { ConfirmDialog } from "../../../../../../../comps/ui/confirm.fe133a074c2743af.js";
+import { BrandIcon } from "../../../agent/agent-pills.19e913c8cb22db21.js";
+import { AgentToggle } from "../../../agent/agent-toggle.ec6d07ccd1f9796e.js";
+import { Field } from "../../../../../../../comps/ui/field.75588c33b72824a7.js";
+import { Chips } from "../../../../../../../comps/ui/badge.3d9163a51e6f6d6e.js";
+import { Select } from "../../../../../../../comps/ui/select.7f481669998074f8.js";
+import { Search } from "../../../../../../../comps/ui/toolbar.801bbd3163d3fbb0.js";
+import { ENGINE_NAMES, defaultLabel, modelHeadings, modelOptions, modelValue, splitModel } from "../../../../settings/model-options.2eacf7f8ac0032df.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "../../../../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+const EFFORTS = [
+	"low",
+	"medium",
+	"high"
+];
+const PERMISSIONS = [
+	"read-only",
+	"workspace-write",
+	"auto"
+];
+const PRESETS = [
+	"observe",
+	"comment",
+	"write"
+];
+const eventNames = (events) => Array.isArray(events) ? events.map(String) : events && typeof events === "object" ? Object.keys(events) : [];
+function Choice({ name, label, hint, value, options, blank }) {
+	const list = value && !options.includes(value) ? [...options, value] : options;
+	return /* @__PURE__ */ _jsx(Field, {
+		label,
+		hint,
+		group: true,
+		children: /* @__PURE__ */ _jsx(Select, {
+			name,
+			label,
+			defaultValue: value ?? "",
+			options: [["", blank], ...list.map((option) => [option, option])]
+		})
+	});
+}
+/** How this agent runs here: engine settings, every platform's access and events on one panel, and deleting it. One Save. */
+export function AgentSettingsForm({ agent, catalog, models, defaults, runners, connections }) {
+	const nav = useRouter();
+	const org = useOrg();
+	const [panel, setPanel] = useState("run");
+	const action = useAction({ refresh: true });
+	const removing = useAction({ leaves: true });
+	const busy = Boolean(action.pending);
+	const [saved, setSaved] = useState("");
+	const [query, setQuery] = useState("");
+	const [hits, setHits] = useState();
+	const [deleting, setDeleting] = useState(false);
+	const form = useRef(null);
+	const settings = agent.settings ?? {};
+	const [model, setModel] = useState(modelValue(settings.engine, settings.model));
+	const [narrowed, setNarrowed] = useState(settings.connections ? "some" : "");
+	const declared = agent.definition?.integrations ?? {};
+	const platforms = Object.keys(declared).sort();
+	const own = agent.definition;
+	const engine = own?.engine ?? defaults.engine;
+	const deletable = agent.source !== "builtin";
+	// Filters every panel's fields by label, current value and platform, and moves to a panel that has a match.
+	useLayoutEffect(() => {
+		const needle = query.trim().toLowerCase();
+		const found = [];
+		form.current.querySelectorAll(".vpanel").forEach((section) => {
+			let any = false;
+			section.querySelectorAll(".field").forEach((field) => {
+				const values = [...field.querySelectorAll("input")].map((input) => input.value).join(" ");
+				const platform = field.closest(".vplatform")?.querySelector("h3")?.textContent ?? "";
+				const match = !needle || `${platform} ${field.textContent} ${values}`.toLowerCase().includes(needle);
+				field.hidden = !match;
+				any ||= match;
+			});
+			section.querySelectorAll(".vplatform").forEach((block) => {
+				block.hidden = !block.querySelector(".field:not([hidden])");
+			});
+			if (any) found.push(section.dataset.panel);
+		});
+		setHits(needle ? found : undefined);
+		if (needle && found.length && !found.includes(panel)) setPanel(found[0]);
+	}, [query]);
+	const remove = () => void removing.run("delete", async () => {
+		await client.agents.remove(agent.id);
+		nav.push("/dash/[org]/agents", { params: { org } });
+	}).then((ok) => ok || setDeleting(false));
+	const tab = (key, label) => /* @__PURE__ */ _jsx("button", {
+		type: "button",
+		"aria-current": panel === key ? "true" : undefined,
+		class: hits && !hits.includes(key) ? "miss" : undefined,
+		onClick: () => setPanel(key),
+		children: label
+	});
+	const submit = async (event) => {
+		event.preventDefault();
+		const values = new FormData(event.currentTarget);
+		const text = (key) => String(values.get(key) ?? "").trim();
+		const next = {};
+		for (const key of [
+			"effort",
+			"permissions",
+			"runner"
+		]) if (text(key)) next[key] = text(key);
+		const picked = splitModel(model);
+		if (picked.engine) next.engine = picked.engine;
+		if (picked.model) next.model = picked.model;
+		if (narrowed) next.connections = values.getAll("connection").map(String);
+		for (const id of platforms) {
+			const current = settings.integrations?.[id] ?? {};
+			const entry = {};
+			if (Array.isArray(current.allowedTools)) entry.allowedTools = current.allowedTools;
+			else if (text(`tools:${id}`)) entry.allowedTools = text(`tools:${id}`);
+			const names = eventNames(declared[id]?.events);
+			const picked = values.getAll(`event:${id}`).map(String);
+			if (names.length && picked.length < names.length) entry.allowedEvents = picked;
+			if (Object.keys(entry).length) (next.integrations ??= {})[id] = entry;
+		}
+		if (agent.settings?.disabled) next.disabled = true;
+		setSaved("");
+		if (await action.run("save", () => client.agents.settings(agent.id, next))) setSaved("Saved. New tasks use these settings.");
+	};
+	return /* @__PURE__ */ _jsxs("form", {
+		ref: form,
+		class: "vsettings card frame",
+		onSubmit: submit,
+		children: [
+			/* @__PURE__ */ _jsxs("nav", {
+				class: "tabs vertical",
+				"aria-label": "Settings sections",
+				children: [
+					/* @__PURE__ */ _jsx("p", {
+						class: "tabs-label",
+						children: "Runtime"
+					}),
+					tab("run", "How it runs"),
+					platforms.length ? tab("platforms", "Platforms") : null,
+					/* @__PURE__ */ _jsx("p", {
+						class: "tabs-label",
+						children: "Agent"
+					}),
+					tab("manage", "Manage")
+				]
+			}),
+			/* @__PURE__ */ _jsxs("div", {
+				class: "vbody",
+				children: [
+					/* @__PURE__ */ _jsxs("div", {
+						class: "vsearch",
+						children: [/* @__PURE__ */ _jsx(Search, {
+							value: query,
+							label: "Search settings",
+							onInput: setQuery
+						}), hits && !hits.length ? /* @__PURE__ */ _jsx("span", {
+							class: "muted",
+							children: "No setting matches."
+						}) : null]
+					}),
+					/* @__PURE__ */ _jsxs("section", {
+						class: "vpanel",
+						"data-panel": "run",
+						hidden: panel !== "run",
+						children: [
+							/* @__PURE__ */ _jsx("h2", { children: "How it runs" }),
+							/* @__PURE__ */ _jsx("p", {
+								class: "muted",
+								children: "Anything left on Default follows the agent's own definition."
+							}),
+							/* @__PURE__ */ _jsxs("div", {
+								class: "fields",
+								children: [
+									/* @__PURE__ */ _jsx(Field, {
+										label: "Model",
+										hint: "picking a model picks its engine",
+										group: true,
+										children: /* @__PURE__ */ _jsx(Select, {
+											label: "Model",
+											value: model,
+											options: [...modelOptions(models, defaultLabel([ENGINE_NAMES[engine] ?? engine, own?.model ?? defaults.engines[engine]?.model].filter(Boolean).join(" · "))), ...!settings.engine && settings.model ? [[modelValue(undefined, settings.model), settings.model]] : []],
+											headings: modelHeadings(models),
+											onChange: setModel
+										})
+									}),
+									/* @__PURE__ */ _jsx(Choice, {
+										name: "effort",
+										label: "Effort",
+										value: settings.effort,
+										options: EFFORTS,
+										blank: defaultLabel(own?.effort ?? defaults.engines[splitModel(model).engine ?? engine]?.effort)
+									}),
+									/* @__PURE__ */ _jsx(Choice, {
+										name: "permissions",
+										label: "Permissions",
+										hint: "what the runner may change in the checkout",
+										value: settings.permissions,
+										options: PERMISSIONS,
+										blank: defaultLabel(own?.permissions ?? "read-only")
+									}),
+									runners.length > 1 ? /* @__PURE__ */ _jsx(Field, {
+										label: "Runs on",
+										group: true,
+										children: /* @__PURE__ */ _jsx(Select, {
+											name: "runner",
+											label: "Runs on",
+											defaultValue: settings.runner ?? "",
+											options: runners
+										})
+									}) : null,
+									/* @__PURE__ */ _jsx(Field, {
+										label: "Connections",
+										hint: "which workspace connections its tasks can use",
+										group: true,
+										children: /* @__PURE__ */ _jsx(Select, {
+											label: "Connections",
+											value: narrowed,
+											options: [["", "Every workspace connection"], ["some", "Only the ones picked"]],
+											onChange: setNarrowed
+										})
+									}),
+									narrowed ? /* @__PURE__ */ _jsxs("div", {
+										class: "field picked",
+										children: [/* @__PURE__ */ _jsxs("span", { children: ["Picked connections ", /* @__PURE__ */ _jsx("small", { children: "tasks can use only these" })] }), connections.length ? /* @__PURE__ */ _jsx("div", {
+											class: "checks",
+											children: connections.map((row) => /* @__PURE__ */ _jsxs("label", {
+												class: "check",
+												children: [/* @__PURE__ */ _jsx("input", {
+													type: "checkbox",
+													name: "connection",
+													value: row.id,
+													defaultChecked: settings.connections?.includes(row.id)
+												}), row.name]
+											}, row.id))
+										}) : /* @__PURE__ */ _jsxs("span", {
+											class: "muted",
+											children: [
+												"This workspace has no connections yet.",
+												" ",
+												/* @__PURE__ */ _jsx(Link, {
+													class: "link",
+													href: "/dash/[org]/settings/[tab]",
+													params: {
+														org,
+														tab: "connections"
+													},
+													children: "Add one in Settings"
+												})
+											]
+										})]
+									}) : null
+								]
+							})
+						]
+					}),
+					platforms.length ? /* @__PURE__ */ _jsxs("section", {
+						class: "vpanel",
+						"data-panel": "platforms",
+						hidden: panel !== "platforms",
+						children: [
+							/* @__PURE__ */ _jsx("h2", { children: "Platforms" }),
+							/* @__PURE__ */ _jsxs("p", {
+								class: "muted",
+								children: [
+									"Overrides for this workspace: turn events off or lower access.",
+									" ",
+									editableAgent(agent) ? /* @__PURE__ */ _jsxs(_Fragment, { children: [
+										"To add an event or a platform,",
+										" ",
+										/* @__PURE__ */ _jsxs(Link, {
+											href: "/dash/[org]/agents/[slug]/edit",
+											params: {
+												org,
+												slug: agent.id
+											},
+											search: { section: "platforms" },
+											children: ["edit ", agent.name]
+										}),
+										"."
+									] }) : agent.source === "repo" ? /* @__PURE__ */ _jsxs(_Fragment, { children: [
+										agent.name,
+										" comes from ",
+										agent.repo ?? "a repository",
+										"; add an event or a platform in its",
+										" ",
+										agent.sourceUrl ? /* @__PURE__ */ _jsx("a", {
+											href: agent.sourceUrl,
+											target: "_blank",
+											rel: "noreferrer",
+											children: "agent.json"
+										}) : "agent.json",
+										" ",
+										"there."
+									] }) : /* @__PURE__ */ _jsxs(_Fragment, { children: [
+										agent.name,
+										" is built in, so its events and platforms ship with Coder. To listen anywhere else,",
+										" ",
+										/* @__PURE__ */ _jsx(Link, {
+											href: "/dash/[org]/agents/new",
+											params: { org },
+											children: "create your own agent"
+										}),
+										"."
+									] })
+								]
+							}),
+							platforms.map((id) => {
+								const current = settings.integrations?.[id] ?? {};
+								const names = eventNames(declared[id]?.events);
+								const allowed = current.allowedEvents;
+								const tools = declared[id]?.tools;
+								const info = catalog.find((entry) => entry.id === id);
+								return /* @__PURE__ */ _jsxs("div", {
+									class: "vplatform",
+									children: [
+										/* @__PURE__ */ _jsxs("h3", { children: [info ? /* @__PURE__ */ _jsx(BrandIcon, { brand: info.brand }) : null, info?.name ?? id] }),
+										Array.isArray(current.allowedTools) ? /* @__PURE__ */ _jsxs("div", {
+											class: "field",
+											children: [/* @__PURE__ */ _jsx("span", { children: "Platform access" }), /* @__PURE__ */ _jsx(Chips, { values: current.allowedTools })]
+										}) : /* @__PURE__ */ _jsx(Choice, {
+											name: `tools:${id}`,
+											label: "Platform access",
+											hint: `observe reads, comment also replies, write also pushes and merges; at most ${typeof tools === "string" ? tools : tools ? "its tools" : "observe"}, as the definition grants`,
+											value: typeof current.allowedTools === "string" ? current.allowedTools : undefined,
+											options: typeof tools === "string" ? PRESETS.slice(0, PRESETS.indexOf(tools) + 1) : tools ? PRESETS : PRESETS.slice(0, 1),
+											blank: defaultLabel(typeof tools === "string" ? tools : tools ? "custom" : "observe")
+										}),
+										names.length ? /* @__PURE__ */ _jsxs("div", {
+											class: "field",
+											children: [/* @__PURE__ */ _jsxs("span", { children: [
+												"Events",
+												" ",
+												/* @__PURE__ */ _jsx("small", { children: "the definition's events; turn off any it should ignore here" })
+											] }), /* @__PURE__ */ _jsx("div", {
+												class: "checks",
+												children: names.map((name) => /* @__PURE__ */ _jsxs("label", {
+													class: "check",
+													children: [/* @__PURE__ */ _jsx("input", {
+														type: "checkbox",
+														name: `event:${id}`,
+														value: name,
+														defaultChecked: !allowed || allowed.includes(name)
+													}), name]
+												}, name))
+											})]
+										}) : null
+									]
+								}, id);
+							})
+						]
+					}) : null,
+					/* @__PURE__ */ _jsxs("section", {
+						class: "vpanel",
+						"data-panel": "manage",
+						hidden: panel !== "manage",
+						children: [
+							/* @__PURE__ */ _jsx("h2", { children: "Manage" }),
+							/* @__PURE__ */ _jsxs("div", {
+								class: "field row-action",
+								children: [/* @__PURE__ */ _jsxs("span", { children: ["Disable agent", /* @__PURE__ */ _jsx("small", { children: "stops its events and new tasks in this workspace; its apps and tasks stay" })] }), /* @__PURE__ */ _jsx(AgentToggle, {
+									agent,
+									class: "btn outline"
+								})]
+							}),
+							/* @__PURE__ */ _jsxs("div", {
+								class: "field row-action",
+								children: [/* @__PURE__ */ _jsxs("span", { children: ["Delete agent", /* @__PURE__ */ _jsx("small", { children: deletable ? "removes it and every version; its tasks and platform apps stay" : `${agent.name} is built in and cannot be deleted; disable it above instead` })] }), /* @__PURE__ */ _jsx("button", {
+									type: "button",
+									class: "btn secondary-danger",
+									disabled: !deletable,
+									onClick: () => setDeleting(true),
+									children: "Delete agent"
+								})]
+							})
+						]
+					}),
+					panel === "manage" ? null : /* @__PURE__ */ _jsxs("div", {
+						class: "form-actions save",
+						children: [saved ? /* @__PURE__ */ _jsx("span", {
+							class: "flash",
+							role: "status",
+							children: saved
+						}) : null, /* @__PURE__ */ _jsx("button", {
+							class: "btn",
+							disabled: busy,
+							"aria-busy": busy,
+							children: "Save"
+						})]
+					})
+				]
+			}),
+			deleting ? /* @__PURE__ */ _jsx(ConfirmDialog, {
+				open: true,
+				title: `Delete ${agent.name}?`,
+				body: "It stops answering on every platform. This cannot be undone.",
+				confirmLabel: "Delete agent",
+				busy: Boolean(removing.pending),
+				onClose: () => setDeleting(false),
+				onConfirm: remove
+			}) : null
+		]
+	});
+}

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/dash/[org]/agents/[slug]/(tabs)/settings/loading.80f597fd04fc4a97.js

@@ -0,0 +1,8 @@
+import { LoadingCard } from "../../../../../../../comps/frame/loading-card.df3717186948c93f.js";
+import { jsx as _jsx } from "../../../../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+export default function AgentSettingsLoading() {
+	return /* @__PURE__ */ _jsx(LoadingCard, {
+		label: "Loading settings",
+		h: 339
+	});
+}

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/dash/[org]/agents/[slug]/(tabs)/settings/page.35d01036ce840ff9.js

@@ -0,0 +1,46 @@
+import { dynamic } from "../../../../../../../../../../../../node_modules/@wular/pnext/src/api/dynamic.tsx";
+import { load } from "../../../../../../../api/load.4f942c7f68b2e273.js";
+import { Settle } from "../../../../../../../comps/frame/stream.2fea238dc4f4f9a4.js";
+import { loadAgent } from "../../../../../../../api/load.4f942c7f68b2e273.js";
+import { NO_MODELS, modelsByEngine } from "../../../../settings/model-options.2eacf7f8ac0032df.js";
+import { runnerOptions } from "../../../../tasks/composer-data.ff108c0ef82a4d7b.js";
+import { DEFAULT_ENGINE } from "../../../../../../../../../core/defaults.e6ce0944639198a2.js";
+import { NeedsCredential } from "../../../../tasks/composer.c7ec618e215d63ce.js";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "../../../../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+const AgentSettingsForm = dynamic(() => import("./agent-settings-form.dd8f3cbc00876ebd.js").then((m) => m.AgentSettingsForm), undefined, {
+	"file": decodeURIComponent(new URL("../../../../../../../../../../../../../../../src/server/dash/app/dash/[org]/agents/[slug]/(tabs)/settings/agent-settings-form.tsx", import.meta.url).pathname),
+	"exportName": "AgentSettingsForm",
+	"id": "c-82eb0b3ac3"
+});
+export default async function AgentSettingsPage({ request, params }) {
+	if (!request) return null;
+	const { slug: raw } = await params;
+	const slug = Array.isArray(raw) ? raw[0] : raw;
+	const agent = loadAgent(request, slug);
+	const models = load(request).models.list().catch(() => NO_MODELS);
+	const config = load(request).config.get().catch(() => undefined);
+	const catalog = load(request).integrations.list().catch(() => []);
+	const connections = load(request).connections.list().then((rows) => rows.filter((row) => !row.owner), () => []);
+	const runners = load(request).runners.list().then((rows) => rows.items, () => []);
+	return /* @__PURE__ */ _jsx(Settle, { load: () => Promise.all([
+		agent,
+		models,
+		config,
+		runners,
+		catalog,
+		connections
+	]).then(([row, shape, shown, rows, integrations, workspace]) => /* @__PURE__ */ _jsxs(_Fragment, { children: [row.needsModel ? /* @__PURE__ */ _jsx(NeedsCredential, {
+		reason: "Agents need a model credential to run.",
+		label: row.name
+	}) : null, /* @__PURE__ */ _jsx(AgentSettingsForm, {
+		agent: row,
+		catalog: integrations,
+		models: modelsByEngine(shape),
+		defaults: {
+			engine: shown?.effective.chain?.[0] ?? DEFAULT_ENGINE,
+			engines: shown?.effective.engines ?? {}
+		},
+		runners: runnerOptions(rows),
+		connections: workspace
+	})] })) });
+}

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/dash/{agents/[slug]/(tabs)/tasks/loading.f5c0c1c727da9f57.js → [org]/agents/[slug]/(tabs)/tasks/loading.ff54c7100f781fbc.js}

@@ -1,5 +1,5 @@
-import { TasksLoading } from "../../../../tasks/list/tasks-section.2cbc1550d723661d.js";
-import { jsx as _jsx } from "../../../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+import { TasksLoading } from "../../../../tasks/list/tasks-section.fd72404364042b87.js";
+import { jsx as _jsx } from "../../../../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 export default function AgentTasksLoading() {
 	return /* @__PURE__ */ _jsx(TasksLoading, { agent: true });
 }

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/dash/{agents/[slug]/(tabs)/tasks/page.9324e2d909d55c6f.js → [org]/agents/[slug]/(tabs)/tasks/page.e5a405c518c1d8e6.js}

@@ -1,5 +1,5 @@
-import { TasksSection, loadTasks } from "../../../../tasks/list/tasks-section.2cbc1550d723661d.js";
-import { jsx as _jsx } from "../../../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+import { TasksSection, loadTasks } from "../../../../tasks/list/tasks-section.fd72404364042b87.js";
+import { jsx as _jsx } from "../../../../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
 export default async function AgentTasksPage({ request, params }) {
 	if (!request) return null;
 	const { slug: raw } = await params;

package/dist/dash/standalone/server/modules-server-server-react-server/src/server/dash/app/dash/{agents/[slug]/(tabs)/usage/loading.5e1f922969ab7016.js → [org]/agents/[slug]/(tabs)/usage/loading.55aa8df7712e6820.js}

@@ -1,11 +1,11 @@
-import "./@/comps/ui/segmented.4db9cac358865634.css.pnext-asset.js";
-import "./@/app/dash/usage/range-bar.034280ed1ab2616b.css.pnext-asset.js";
-import { LoadingRange } from "../../../../usage/range-bar.76e3de97583e6eab.js";
-import { Stat, Stats } from "../../../../usage/stats.4793e81a32ea5e8f.js";
-import { Card, Loading } from "../../../../../../comps/ui/card.b0873d38765c9d20.js";
-import { BLANK } from "../../../../../../comps/frame/loading-card.bf58af8330a78704.js";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "../../../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
-/** The usage tab's shape before its numbers arrive: totals, the day chart and the two breakdowns, blank. */
+import "./@/comps/ui/segmented.2cb43dc7d1f1588a.css.pnext-asset.js";
+import "./@/app/dash/[org]/usage/range-bar.e8f6f0c7ee443262.css.pnext-asset.js";
+import { LoadingRange } from "../../../../usage/range-bar.884e58b044238e98.js";
+import { Stat, Stats } from "../../../../usage/stats.de820599cf126120.js";
+import { Card, Loading } from "../../../../../../../comps/ui/card.6227f43fc0ae4bd1.js";
+import { BLANK } from "../../../../../../../comps/frame/loading-card.df3717186948c93f.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "../../../../../../../../../../../../node_modules/preact/jsx-runtime/dist/jsxRuntime.mjs";
+/** The usage tab's shape before its numbers arrive: totals, the day chart, the two breakdowns and the deliveries, blank. */
 export default function AgentUsageLoading() {
 	return /* @__PURE__ */ _jsxs(_Fragment, { children: [
 		/* @__PURE__ */ _jsx(LoadingRange, {}),
@@ -43,6 +43,14 @@ export default function AgentUsageLoading() {
 					h: 173
 				})
 			})]
+		}),
+		/* @__PURE__ */ _jsx(Card, {
+			id: "deliveries",
+			title: "Deliveries",
+			children: /* @__PURE__ */ _jsx(Loading, {
+				label: "Loading deliveries",
+				h: 85
+			})
 		})
 	] });
 }