@agent-native/core 0.70.0 → 0.70.2

package/corpus/templates/analytics/AGENTS.md

@@ -87,7 +87,14 @@ details live in `.agents/skills/`.
   `id`, category, data sources, panel count, and installed dashboard IDs.
 - `install-dashboard-template` installs a catalog template into normal
   SQL-backed dashboards. Required: `templateId`. Optional: `dashboardId`,
-  `name`, `overwrite`, and `forceNew`.
+  `name`, `overwrite`, `forceNew`, and `mergePanels`.
+- To add a template's panels to an existing dashboard, call
+  `install-dashboard-template` with `mergePanels: true` and the existing
+  `dashboardId`. It appends only the template panels whose id is not already
+  present (preserving existing panels and order) in one atomic save and returns
+  `{ addedPanelIds, skippedExistingIds, panelCount }`. Prefer this over looping
+  `update-dashboard` to add many panels — sequential calls time out on the ~40s
+  hosted run budget.
 - Node Exporter ships as `node-exporter-macos` for Darwin/Homebrew
   `node_exporter` scrapes and `node-exporter-full` for the Linux-focused
   Grafana 1860 revision 45 full dashboard converted into native Analytics

package/corpus/templates/analytics/actions/install-dashboard-template.ts

@@ -43,7 +43,8 @@ function uniqueConstraintMessage(err: unknown): boolean {
 
 export default defineAction({
   description:
-    "Install a dashboard template from the Analytics catalog into the user's SQL-backed dashboards. Use list-dashboard-templates first when choosing a template.",
+    "Install a dashboard template from the Analytics catalog into the user's SQL-backed dashboards. Use list-dashboard-templates first when choosing a template. " +
+    "To ADD a template's panels to an EXISTING dashboard in ONE call (the preferred way to bulk-add panels), pass `mergePanels: true` with the `dashboardId` of the existing dashboard: it appends every template panel whose id is not already present, preserves all existing panels and their order, and saves once. This avoids looping update-dashboard, which times out on the ~40s hosted run budget.",
   schema: z.object({
     templateId: z
       .string()
@@ -52,7 +53,7 @@ export default defineAction({
       .string()
       .optional()
       .describe(
-        "Optional dashboard id to write. Omit to reuse an existing installed copy or create a unique id.",
+        "Optional dashboard id to write. Omit to reuse an existing installed copy or create a unique id. Required when mergePanels is true.",
       ),
     name: z
       .string()
@@ -70,6 +71,12 @@ export default defineAction({
       .describe(
         "If true, create another copy even when this template is installed.",
       ),
+    mergePanels: z
+      .boolean()
+      .optional()
+      .describe(
+        "If true AND a dashboard already exists at dashboardId, APPEND this template's panels (only the ones whose id is not already present) to the existing dashboard in one atomic save, preserving all existing panels and their order. Returns { addedPanelIds, skippedExistingIds, panelCount }. Non-destructive; does not change overwrite/forceNew behavior.",
+      ),
   }),
   mcpApp: {
     compactCatalog: true,
@@ -90,6 +97,94 @@ export default defineAction({
     if (!entry)
       throw new Error(`Unknown dashboard template: ${args.templateId}`);
 
+    // Append/merge mode: add this template's panels to an existing dashboard
+    // in ONE atomic save instead of looping update-dashboard (which times out
+    // on the ~40s hosted run budget). Non-destructive: existing panels and
+    // their order are preserved; only template panels with a new id are added.
+    if (args.mergePanels) {
+      const targetId = args.dashboardId?.trim();
+      if (!targetId) {
+        throw new Error(
+          "mergePanels=true requires dashboardId (the existing dashboard to append the template's panels to).",
+        );
+      }
+      const target = await getDashboard(targetId, ctx);
+      if (!target) {
+        throw new Error(
+          `Dashboard "${targetId}" not found (or you don't have access). mergePanels appends to an existing dashboard — install the template normally first, or omit mergePanels to create a new copy.`,
+        );
+      }
+
+      const targetConfig = target.config as Record<string, unknown>;
+      const existingPanels = Array.isArray(targetConfig.panels)
+        ? (targetConfig.panels as Array<Record<string, unknown>>)
+        : [];
+      const existingIds = new Set(
+        existingPanels
+          .map((panel) => (typeof panel?.id === "string" ? panel.id : null))
+          .filter((id): id is string => !!id),
+      );
+
+      const seedConfig = cloneDashboardConfig(entry);
+      const seedPanels = Array.isArray(seedConfig.panels)
+        ? (seedConfig.panels as unknown as Array<Record<string, unknown>>)
+        : [];
+
+      const addedPanelIds: string[] = [];
+      const skippedExistingIds: string[] = [];
+      const appended: Array<Record<string, unknown>> = [];
+      for (const panel of seedPanels) {
+        const id = typeof panel?.id === "string" ? panel.id : null;
+        if (id && existingIds.has(id)) {
+          skippedExistingIds.push(id);
+          continue;
+        }
+        appended.push(panel);
+        if (id) {
+          addedPanelIds.push(id);
+          existingIds.add(id);
+        }
+      }
+
+      const mergedConfig: Record<string, unknown> = {
+        ...targetConfig,
+        panels: [...existingPanels, ...appended],
+      };
+      const panelCount = (mergedConfig.panels as unknown[]).length;
+
+      if (appended.length > 0) {
+        const saved = await upsertDashboard(
+          targetId,
+          target.kind,
+          mergedConfig,
+          ctx,
+        );
+        await syncToCollab(targetId, mergedConfig);
+        targetConfig.name = saved.title;
+      }
+
+      return {
+        templateId: entry.id,
+        templateName: entry.name,
+        dashboardId: targetId,
+        name: target.title,
+        merged: true,
+        addedPanelIds,
+        skippedExistingIds,
+        panelCount,
+        urlPath: `/dashboards/${targetId}`,
+        deepLink: buildDeepLink({
+          app: "analytics",
+          view: "adhoc",
+          params: { dashboardId: targetId },
+        }),
+        message:
+          appended.length > 0
+            ? `Added ${addedPanelIds.length} panel(s) from "${entry.name}" to "${target.title}"; ${skippedExistingIds.length} already present. Dashboard now has ${panelCount} panel(s).`
+            : `No new panels to add from "${entry.name}" — all ${skippedExistingIds.length} template panel id(s) already present. Dashboard has ${panelCount} panel(s).`,
+      };
+    }
+
     const installed = (await listDashboardCatalog(ctx)).find(
       (template) => template.id === entry.id,
     );

package/corpus/templates/analytics/actions/update-dashboard.ts

@@ -378,6 +378,11 @@ function resolveScope() {
   return { orgId, email };
 }
 
+/** Resulting panel count, used for the proof-of-done return summary. */
+function countPanels(config: Record<string, unknown>): number {
+  return Array.isArray(config.panels) ? config.panels.length : 0;
+}
+
 /**
  * Push a config update through the collab layer so open dashboard editors
  * receive the change in real time. Seeds the collab state if it doesn't
@@ -407,11 +412,19 @@ async function syncToCollab(
 
 export default defineAction({
   description:
-    "Edit a SQL dashboard config (scope-aware). Prefer this over raw db-patch on the settings table — " +
+    "Edit a SQL dashboard config (scope-aware) atomically in ONE call. Prefer this over raw db-patch on the settings table — " +
     "it resolves org vs. user scope correctly so the edit lands on the row the UI actually renders. " +
-    "Use `ops` for structural changes (reorder/insert/remove panels, update field values via JSON Pointer paths). " +
-    "Use `config` to replace the entire dashboard config. " +
-    "For a large dashboard, build it up incrementally: save a small dashboard first, then add panels one at a time with `ops` rather than authoring the whole `config` in one call — a very large single `config` payload can get cut off mid-stream and stall the turn. " +
+    "BATCH ALL EDITS INTO A SINGLE CALL. Never call this action repeatedly in a loop: hosted agent runs have a ~40s budget, and many sequential update-dashboard calls time out mid-way and leave the dashboard in a partial state even though earlier calls looked like they succeeded. Put every change you want to make into one `ops` array (or one `config`). " +
+    "`ops` is an array of { op, path, from?, value? } applied in order in a single atomic save. " +
+    "`op` is one of: set | replace | remove | insert | move | move-before. " +
+    "`path` is a JSON Pointer into the config (e.g. `/panels/3` is the 4th panel, `/panels/3/title` is its title, `/name` is the dashboard name). The special index `-` means the end of an array: `/panels/-` appends. " +
+    "`value` is the panel or object to set/insert. `from` is the source JSON Pointer for move / move-before. " +
+    "To ADD N panels in one call, pass N entries of { op: 'insert', path: '/panels/-', value: <panel> }. " +
+    "To reorder: [{ op: 'move', from: '/panels/2', path: '/panels/0' }]. " +
+    "To edit a field: [{ op: 'replace', path: '/panels/0/title', value: 'Events by Day' }]. " +
+    "Use `config` to replace the entire dashboard config in one call. Provide `ops` OR `config`, not both. " +
+    "To add a shipped catalog template's panels to an existing dashboard, prefer `install-dashboard-template` with `mergePanels: true` — it appends the template's panels in one call without you having to author each panel. " +
+    "The result includes `panelCount` (resulting number of panels), `appliedOps` (count), and a `summary` string — use them as proof-of-done and report the new panel count back to the user instead of assuming success. " +
     "The UI auto-refreshes after this action — do NOT call `refresh-screen`.",
   schema: z.object({
     dashboardId: z
@@ -440,8 +453,11 @@ export default defineAction({
       )
       .optional()
       .describe(
-        "Array of JSON-patch-style ops applied in order (or a JSON string). " +
-          "Example reorder: [{op:'move', from:'/panels/2', path:'/panels/0'}]",
+        "Array of JSON-patch-style ops applied in order in ONE atomic save (or a JSON string). " +
+          "Each op is { op, path, from?, value? }. op ∈ set|replace|remove|insert|move|move-before. " +
+          "path is a JSON Pointer (e.g. '/panels/3', and '/panels/-' appends to the end). " +
+          "Add N panels at once with N {op:'insert', path:'/panels/-', value:<panel>} entries. " +
+          "Example reorder: [{op:'move', from:'/panels/2', path:'/panels/0'}].",
       ),
     config: z
       .preprocess(
@@ -482,6 +498,7 @@ export default defineAction({
       if (sqlError) throw new Error(sqlError);
       await upsertDashboard(args.dashboardId, "sql", args.config, ctx);
       await syncToCollab(args.dashboardId, args.config);
+      const panelCount = countPanels(args.config);
       return {
         id: args.dashboardId,
         dashboardId: args.dashboardId,
@@ -489,6 +506,11 @@ export default defineAction({
           typeof args.config.name === "string"
             ? args.config.name
             : args.dashboardId,
+        // Proof-of-done: lead with verifiable state so the agent/UI can
+        // confirm the new shape cheaply instead of assuming success.
+        panelCount,
+        appliedOps: 0,
+        summary: `Replaced dashboard "${args.dashboardId}"; it now has ${panelCount} panel(s).`,
         config: args.config,
         urlPath: `/dashboards/${args.dashboardId}`,
         deepLink: buildDeepLink({
@@ -528,10 +550,16 @@ export default defineAction({
     );
     await syncToCollab(args.dashboardId, root as Record<string, unknown>);
 
+    const panelCount = countPanels(root as Record<string, unknown>);
     return {
       id: args.dashboardId,
       dashboardId: args.dashboardId,
       name: typeof root.name === "string" ? root.name : args.dashboardId,
+      // Proof-of-done: lead with verifiable state (op count + resulting panel
+      // count) so the agent/UI can confirm success without re-fetching.
+      panelCount,
+      appliedOps: details.length,
+      summary: `Applied ${details.length} op(s); dashboard "${args.dashboardId}" now has ${panelCount} panel(s).`,
       config: root,
       urlPath: `/dashboards/${args.dashboardId}`,
       deepLink: buildDeepLink({
@@ -541,7 +569,8 @@ export default defineAction({
       }),
       message:
         `Dashboard "${args.dashboardId}" updated. ` +
-        `Applied ${details.length} op(s): ${details.join("; ")}.`,
+        `Applied ${details.length} op(s): ${details.join("; ")}. ` +
+        `Now ${panelCount} panel(s).`,
     };
   },
   link: ({ result }) => {

package/corpus/templates/analytics/app/components/dashboard/SqlChart.tsx

@@ -1,5 +1,7 @@
 import {
+  createContext,
   useCallback,
+  useContext,
   useEffect,
   useMemo,
   useState,
@@ -248,6 +250,20 @@ function SeriesLegend({
   );
 }
 
+// When a chart renders inside the full-screen modal it should grow to fill the
+// available space rather than the fixed 250px card height. ChartFrame reads
+// this via context so we avoid threading a prop through every renderer
+// (line/area/bar/pie all share ChartFrame).
+const ChartFillHeightContext = createContext(false);
+
+export function ChartFillHeight({ children }: { children: ReactNode }) {
+  return (
+    <ChartFillHeightContext.Provider value={true}>
+      {children}
+    </ChartFillHeightContext.Provider>
+  );
+}
+
 function ChartFrame({
   panel,
   legendKeys,
@@ -259,13 +275,24 @@ function ChartFrame({
   colors: string[];
   children: ReactNode;
 }) {
+  const fill = useContext(ChartFillHeightContext);
+  const chartHeight = fill ? "h-full min-h-[250px]" : "h-[250px]";
+
   if (!usesPrometheusPresentation(panel)) {
-    return <div className="h-[250px] w-full overflow-visible">{children}</div>;
+    return (
+      <div className={`${chartHeight} w-full overflow-visible`}>{children}</div>
+    );
   }
 
   return (
-    <div className="w-full overflow-hidden">
-      <div className="h-[250px] w-full overflow-visible">{children}</div>
+    <div
+      className={`flex w-full flex-col overflow-hidden ${fill ? "h-full" : ""}`}
+    >
+      <div
+        className={`${chartHeight} w-full overflow-visible ${fill ? "flex-1" : ""}`}
+      >
+        {children}
+      </div>
       <SeriesLegend keys={legendKeys} colors={colors} panel={panel} />
     </div>
   );

package/corpus/templates/analytics/app/components/layout/Header.tsx

@@ -18,7 +18,6 @@ const pageTitles: Record<string, string> = {
   "/dashboards/explorer": "Explorer",
   "/team": "Team",
   "/settings": "Settings",
-  "/about": "About",
 };
 
 function resolveTitle(pathname: string): ReactNode {

package/corpus/templates/analytics/app/components/layout/Sidebar.tsx

@@ -16,7 +16,6 @@ import {
   IconChevronDown,
   IconSun,
   IconMoon,
-  IconInfoCircle,
   IconTrash,
   IconDots,
   IconLoader2,
@@ -146,7 +145,6 @@ import { CSS } from "@dnd-kit/utilities";
 const bottomItems = [
   { icon: IconUsers, label: "Team", href: "/team" },
   { icon: IconSettings, label: "Settings", href: "/settings" },
-  { icon: IconInfoCircle, label: "About", href: "/about" },
 ];
 
 function getStoredBoolean(key: string, fallback: boolean): boolean {
@@ -1947,7 +1945,7 @@ export function Sidebar({ mobile }: { mobile?: boolean } = {}) {
           </Link>
 
           {/* Dashboards section */}
-          <div className="group/section space-y-1">
+          <div className="group/section min-w-0 space-y-1">
             <div
               className={cn(
                 "flex w-full min-w-0 items-center rounded-lg transition-all hover:text-primary",
@@ -2050,7 +2048,7 @@ export function Sidebar({ mobile }: { mobile?: boolean } = {}) {
           </div>
 
           {/* Analyses section */}
-          <div className="group/section space-y-1">
+          <div className="group/section min-w-0 space-y-1">
             <div
               className={cn(
                 "flex w-full min-w-0 items-center rounded-lg transition-all hover:text-primary",

package/corpus/templates/analytics/app/hooks/use-navigation-state.ts

@@ -63,8 +63,6 @@ export function useNavigationState() {
         state.view = "catalog";
       } else if (pathname === "/settings") {
         state.view = "settings";
-      } else if (pathname === "/about") {
-        state.view = "about";
       }
 
       return state;
@@ -84,7 +82,6 @@ export function useNavigationState() {
       if (cmd.view === "ask") return "/ask";
       if (cmd.view === "settings") return "/settings";
       if (cmd.view === "overview") return "/overview";
-      if (cmd.view === "about") return "/about";
       return "/";
     },
     onNavigate: (_command, path) => {

package/corpus/templates/analytics/app/pages/adhoc/sql-dashboard/SqlChartCard.tsx

@@ -5,6 +5,7 @@ import {
   IconArrowsMaximize,
   IconArrowsMinimize,
   IconDotsVertical,
+  IconMaximize,
   IconPencil,
   IconTrash,
   IconCode,
@@ -32,9 +33,15 @@ import {
   AlertDialogHeader,
   AlertDialogTitle,
 } from "@/components/ui/alert-dialog";
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
 import { useSortable } from "@dnd-kit/sortable";
 import { CSS } from "@dnd-kit/utilities";
-import { SqlChart } from "@/components/dashboard/SqlChart";
+import { ChartFillHeight, SqlChart } from "@/components/dashboard/SqlChart";
 import { ViewSqlPopover } from "./ViewSqlPopover";
 import type { SqlPanel } from "./types";
 
@@ -76,6 +83,7 @@ export function SqlChartCard({
   } = useSortable({ id: panel.id, disabled: !editable });
 
   const [confirmOpen, setConfirmOpen] = useState(false);
+  const [expanded, setExpanded] = useState(false);
   const [exportCsv, setExportCsv] = useState<(() => void) | null>(null);
   const [shouldLoadData, setShouldLoadData] = useState(
     panel.chartType === "section",
@@ -229,7 +237,9 @@ export function SqlChartCard({
     );
   }
 
-  const showPanelMenu = editable || panel.chartType === "table";
+  // Every non-section panel exposes at least the Full screen view action, so the
+  // options menu always renders — including on read-only / shared dashboards.
+  const showPanelMenu = true;
 
   return (
     <div
@@ -259,6 +269,13 @@ export function SqlChartCard({
                   <TooltipContent>Panel options</TooltipContent>
                 </Tooltip>
                 <DropdownMenuContent align="end" className="w-44">
+                  <DropdownMenuItem onSelect={() => setExpanded(true)}>
+                    <IconMaximize className="h-4 w-4 mr-2" />
+                    Full screen
+                  </DropdownMenuItem>
+                  {editable || panel.chartType === "table" ? (
+                    <DropdownMenuSeparator />
+                  ) : null}
                   {panel.chartType === "table" && (
                     <DropdownMenuItem
                       disabled={!exportCsv}
@@ -346,6 +363,19 @@ export function SqlChartCard({
         </CardContent>
       </Card>
 
+      <Dialog open={expanded} onOpenChange={setExpanded}>
+        <DialogContent className="flex h-[90vh] w-[95vw] max-w-[1400px] flex-col gap-4">
+          <DialogHeader className="shrink-0 pr-8 text-left">
+            <DialogTitle className="truncate">{panel.title}</DialogTitle>
+          </DialogHeader>
+          <div className="flex min-h-0 flex-1 flex-col overflow-auto">
+            <ChartFillHeight>
+              <SqlChart panel={panel} resolvedSql={resolvedSql} loadData />
+            </ChartFillHeight>
+          </div>
+        </DialogContent>
+      </Dialog>
+
       {editable ? (
         <AlertDialog open={confirmOpen} onOpenChange={setConfirmOpen}>
           <AlertDialogContent>

package/corpus/templates/analytics/changelog/2026-06-23-long-dashboard-and-analysis-names-in-the-sidebar-now-truncat.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-06-23
+---
+
+Long dashboard and analysis names in the sidebar now truncate with an ellipsis instead of being clipped

package/corpus/templates/analytics/changelog/2026-06-23-open-any-dashboard-chart-full-screen-in-a-modal-from-the-pan.md

@@ -0,0 +1,6 @@
+---
+type: added
+date: 2026-06-23
+---
+
+Open any dashboard chart full screen in a modal from the panel's three-dots menu

package/corpus/templates/assets/actions/generate-image.ts

@@ -1,5 +1,6 @@
 import { defineAction } from "@agent-native/core";
 import {
+  readAppState,
   writeAppState,
   deleteAppState,
 } from "@agent-native/core/application-state";
@@ -55,6 +56,28 @@ function resolveModelForTier(
     : "gemini-3.1-flash-image";
 }
 
+/**
+ * The user's default image model, chosen from the composer's model picker and
+ * persisted in per-user application state. Used as a fallback when no explicit
+ * model, tier, or preset model is supplied. Returns undefined when unset or
+ * invalid so the hardcoded default still applies.
+ */
+async function readUserDefaultImageModel(): Promise<ImageModel | undefined> {
+  try {
+    const stored = await readAppState("imageGenerationModel");
+    const model = stored?.model;
+    if (
+      typeof model === "string" &&
+      (IMAGE_MODELS as readonly string[]).includes(model)
+    ) {
+      return model as ImageModel;
+    }
+  } catch {
+    // No request context or read failure — fall back to defaults below.
+  }
+  return undefined;
+}
+
 export default defineAction({
   description:
     "Generate one brand-consistent image from a library. This is synchronous for images and returns the final asset with preview/download/embed URLs. Use generate-image-batch for multiple independent slots; do not poll image runs after this action returns.",
@@ -226,6 +249,7 @@ export default defineAction({
     const resolvedModel = (args.model ??
       resolveModelForTier(resolvedTier, category) ??
       preset?.model ??
+      (await readUserDefaultImageModel()) ??
       "gemini-3.1-flash-image") as (typeof IMAGE_MODELS)[number];
     const resolvedCategories =
       args.categories ??

package/corpus/templates/assets/app/components/layout/Sidebar.tsx

@@ -305,8 +305,8 @@ function AssetsChatsSection() {
                       {threadTitle(thread)}
                     </span>
                   </button>
-                  <div className="relative flex size-7 shrink-0 items-center justify-end pr-1">
-                    <span className="text-[11px] text-muted-foreground/75 transition-opacity group-hover:opacity-0 group-focus-within:opacity-0">
+                  <div className="relative flex w-auto min-w-7 shrink-0 items-center justify-end pr-1">
+                    <span className="whitespace-nowrap text-[11px] tabular-nums text-muted-foreground/75 transition-opacity group-hover:opacity-0 group-focus-within:opacity-0">
                       {isActive ? "" : formatThreadAge(threadUpdatedAt(thread))}
                     </span>
                     <DropdownMenu>

package/corpus/templates/assets/app/global.css

@@ -135,7 +135,7 @@
   gap: 0.5rem;
 }
 
-.assets-create-chat-pill-row span {
+.assets-create-chat-pill-row button {
   display: inline-flex;
   align-items: center;
   gap: 0.375rem;
@@ -147,6 +147,22 @@
   color: hsl(var(--muted-foreground));
   font-size: 0.75rem;
   font-weight: 500;
+  cursor: pointer;
+  transition:
+    background-color 0.15s ease,
+    color 0.15s ease,
+    border-color 0.15s ease;
+}
+
+.assets-create-chat-pill-row button:hover {
+  border-color: hsl(var(--foreground) / 0.25);
+  background: hsl(var(--accent));
+  color: hsl(var(--foreground));
+}
+
+.assets-create-chat-pill-row button:focus-visible {
+  outline: 2px solid hsl(var(--ring));
+  outline-offset: 2px;
 }
 
 .assets-create-chat-panel