@agent-native/core 0.124.3 → 0.124.4

package/corpus/templates/content/app/components/editor/database/sidebar.tsx

@@ -12,7 +12,6 @@ import {
   IconDatabase,
   IconDots,
   IconFileText,
-  IconLoader2,
   IconPlus,
   IconStar,
   IconTrash,
@@ -44,6 +43,7 @@ import {
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { ScrollArea } from "@/components/ui/scroll-area";
+import { Skeleton } from "@/components/ui/skeleton";
 import {
   Tooltip,
   TooltipContent,
@@ -261,7 +261,6 @@ export function DatabaseSidebarView({
   hierarchyItems,
   hierarchyUniverseItems,
   scroll = true,
-  loadingLabel,
   noMatchesLabel,
   clearLabel,
   navigationLabel,
@@ -286,7 +285,6 @@ export function DatabaseSidebarView({
   hierarchyItems?: ContentDatabaseItem[];
   hierarchyUniverseItems?: ContentDatabaseItem[];
   scroll?: boolean;
-  loadingLabel: string;
   noMatchesLabel: string;
   clearLabel: string;
   navigationLabel: string;
@@ -367,9 +365,19 @@ export function DatabaseSidebarView({
 
   if (isLoading) {
     return (
-      <div className="flex h-16 items-center gap-2 px-2 text-sm text-muted-foreground">
-        <IconLoader2 className="size-4 animate-spin" />
-        {loadingLabel}
+      <div aria-hidden="true" className="grid gap-1 p-1">
+        {[70, 55, 85, 60, 45].map((width, index) => (
+          <div
+            key={`sidebar-skeleton-${index}`}
+            className="flex h-7 items-center gap-1.5 rounded px-1.5"
+          >
+            <Skeleton className="size-3.5 shrink-0 rounded-sm bg-sidebar-foreground/12 dark:bg-sidebar-foreground/10" />
+            <Skeleton
+              className="h-3 rounded bg-sidebar-foreground/12 dark:bg-sidebar-foreground/10"
+              style={{ width: `${width}%` }}
+            />
+          </div>
+        ))}
       </div>
     );
   }

package/corpus/templates/content/app/components/sidebar/DocumentSidebar.tsx

@@ -63,7 +63,6 @@ import { toast } from "sonner";
 
 import { ContentFilesSidebarView } from "@/components/editor/database/sidebar";
 import { QueryErrorState } from "@/components/QueryErrorState";
-import { ThemeToggle } from "@/components/ThemeToggle";
 import {
   AlertDialog,
   AlertDialogAction,
@@ -83,6 +82,7 @@ import {
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { ScrollArea } from "@/components/ui/scroll-area";
+import { Skeleton } from "@/components/ui/skeleton";
 import {
   Tooltip,
   TooltipContent,
@@ -133,7 +133,6 @@ import {
   DocumentTreeItem,
   FavoriteDocumentItem,
 } from "./DocumentTreeItem";
-import { NotionButton } from "./NotionButton";
 import {
   contentSpaceAvailability,
   contentSpaceForStoredSelection,
@@ -288,7 +287,7 @@ function WorkspaceFilesSection({
   const failed = filesDatabase.isError || filesPersonalView.isError;
 
   return (
-    <div className="ms-3 border-s border-border/70 pb-1 ps-1">
+    <div className="ms-3 pb-1 ps-1">
       {failed ? (
         <QueryErrorState
           compact
@@ -329,7 +328,6 @@ function WorkspaceFilesSection({
           onDeleteItem={onDeleteItem}
           onToggleFavorite={onToggleFavorite}
           labels={{
-            loadingLabel: t("sidebar.loadingFiles"),
             noMatchesLabel: t("database.noRowsMatchThisView"),
             clearLabel: t("database.clearSearchAndFilters"),
             navigationLabel: `${space.name} ${t("sidebar.files")}`,
@@ -1407,12 +1405,12 @@ export function DocumentSidebar({
   };
 
   const renderTreeSkeleton = () => (
-    <div className="space-y-1 px-3 py-1">
+    <div aria-hidden="true" className="grid gap-1 px-3 py-1">
       {[70, 55, 85, 60, 45].map((w, i) => (
         <div key={i} className="flex items-center gap-2 px-1 py-1.5">
-          <div className="h-3.5 w-3.5 shrink-0 animate-pulse rounded bg-muted" />
-          <div
-            className="h-3.5 animate-pulse rounded bg-muted"
+          <Skeleton className="size-3.5 shrink-0 rounded-sm bg-sidebar-foreground/12 dark:bg-sidebar-foreground/10" />
+          <Skeleton
+            className="h-3 rounded bg-sidebar-foreground/12 dark:bg-sidebar-foreground/10"
             style={{ width: `${w}%` }}
           />
         </div>
@@ -1611,7 +1609,6 @@ export function DocumentSidebar({
               }}
               scroll={false}
               labels={{
-                loadingLabel: t("sidebar.loadingFiles"),
                 noMatchesLabel: t("database.noRowsMatchThisView"),
                 clearLabel: t("database.clearSearchAndFilters"),
                 navigationLabel: "Content navigation",
@@ -1637,9 +1634,7 @@ export function DocumentSidebar({
           </div>
         </div>
       ) : contentSpaceState === "loading" ? (
-        <div className="px-3 py-4 text-center text-sm text-muted-foreground">
-          {t("sidebar.loadingFiles")}
-        </div>
+        renderTreeSkeleton()
       ) : (
         <QueryErrorState
           compact
@@ -1656,7 +1651,7 @@ export function DocumentSidebar({
     const collapsed = collapsedSections.trash;
 
     return (
-      <div className="mt-3 border-t border-border/60 pt-2">
+      <div className="mt-3 pt-2">
         <div className="px-2">
           <button
             type="button"
@@ -2025,26 +2020,30 @@ export function DocumentSidebar({
                     </Link>
                   </div>
                   {!collapsedSections.favorites &&
-                    favorites.map((doc) => (
-                      <FavoriteDocumentItem
-                        key={doc.id}
-                        document={doc}
-                        active={doc.id === activeDocumentId}
-                        sidebarWidth={favoriteRowWidth}
-                        onSelect={() => {
-                          handleOpenFavorite(doc);
-                          onNavigate?.();
-                        }}
-                        onCreateChildPage={() => void handleCreatePage(doc.id)}
-                        onCreateChildDatabase={() =>
-                          void handleCreateDatabase(doc.id)
-                        }
-                        onRemoveFavorite={() =>
-                          handleToggleFavorite(doc.id, false)
-                        }
-                        onDelete={() => void handleDelete(doc.id)}
-                      />
-                    ))}
+                    (isLoading
+                      ? renderTreeSkeleton()
+                      : favorites.map((doc) => (
+                          <FavoriteDocumentItem
+                            key={doc.id}
+                            document={doc}
+                            active={doc.id === activeDocumentId}
+                            sidebarWidth={favoriteRowWidth}
+                            onSelect={() => {
+                              handleOpenFavorite(doc);
+                              onNavigate?.();
+                            }}
+                            onCreateChildPage={() =>
+                              void handleCreatePage(doc.id)
+                            }
+                            onCreateChildDatabase={() =>
+                              void handleCreateDatabase(doc.id)
+                            }
+                            onRemoveFavorite={() =>
+                              handleToggleFavorite(doc.id, false)
+                            }
+                            onDelete={() => void handleDelete(doc.id)}
+                          />
+                        )))}
                 </div>
               )}
 
@@ -2080,10 +2079,6 @@ export function DocumentSidebar({
       {/* Footer */}
       <div className="shrink-0 space-y-2 px-3 py-2">
         {isCodeMode ? <DevDatabaseLink /> : null}
-        <div className="flex justify-end gap-0.5">
-          <NotionButton />
-          <ThemeToggle />
-        </div>
         <SidebarFooterActions
           feedback={feedbackButton}
           translate={translateButton}

package/corpus/templates/content/changelog/2026-07-27-content-sidebar-page-lists-now-load-with-quiet-skeletons-and.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-27
+---
+
+Content sidebar page lists now load with quiet skeletons and less visual chrome.

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

@@ -17,7 +17,6 @@ import {
 import { useEffect, useState } from "react";
 import { Link, useLocation } from "react-router";
 
-import { ThemeToggle } from "@/components/ThemeToggle";
 import {
   Tooltip,
   TooltipContent,
@@ -128,25 +127,25 @@ export function Sidebar() {
           collapsed ? "justify-center px-2" : "justify-between px-4",
         )}
       >
-        {!collapsed && (
-          <div className="flex items-center gap-2">
-            <img
-              src={appPath("/agent-native-icon-light.svg")}
-              alt=""
-              aria-hidden="true"
-              className="block h-4 w-auto dark:hidden"
-            />
-            <img
-              src={appPath("/agent-native-icon-dark.svg")}
-              alt=""
-              aria-hidden="true"
-              className="hidden h-4 w-auto dark:block"
-            />
+        <div className="flex items-center gap-2">
+          <img
+            src={appPath("/agent-native-icon-light.svg")}
+            alt=""
+            aria-hidden="true"
+            className="block h-4 w-auto dark:hidden"
+          />
+          <img
+            src={appPath("/agent-native-icon-dark.svg")}
+            alt=""
+            aria-hidden="true"
+            className="hidden h-4 w-auto dark:block"
+          />
+          {!collapsed && (
             <span className="text-sm font-semibold tracking-tight">
               {t("navigation.brand")}
             </span>
-          </div>
-        )}
+          )}
+        </div>
       </div>
 
       <div className="flex min-h-0 flex-1 flex-col overflow-y-auto">
@@ -234,7 +233,6 @@ export function Sidebar() {
               </div>
               <div className="px-3 py-2">
                 <DevDatabaseLink />
-                <ThemeToggle className="h-8 w-8 shrink-0" />
               </div>
             </div>
           )}

package/corpus/templates/design/changelog/2026-07-27-collapsed-sidebar-keeps-the-agent-native-logo.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-27
+---
+
+The collapsed sidebar keeps the Agent Native logo visible and removes the theme toggle from the sidebar.

package/corpus/templates/dispatch/AGENTS.md

@@ -36,9 +36,9 @@ ladder.
   setup item is unclear.
 - Keep approval and routing behavior explicit. Never silently widen access to
   secrets, apps, integrations, or workspace resources.
-- Curated workspace templates are private remix sources. Use
+- Curated workspace templates are private app sources. Use
   `list-curated-workspace-templates` to inspect the reviewed catalog and
-  `remix-workspace-template` to create an independent app. A remix may use
+  `remix-workspace-template` to create an independent app. A new app may use
   empty or synthetic data only; never copy source-app records, credentials,
   secrets, or private configuration.
 - `/operations` is the focused operator console. Its Monitoring tab reuses the
@@ -49,6 +49,11 @@ ladder.
   Destinations for concrete thread, change-history, and delivery investigations;
   Dispatch does not invent a separate issue tracker when those framework
   surfaces contain the operational evidence.
+- Thread Debug accepts the copied request/run ID from an Agent Native chat
+  response as well as a chat thread ID; use the exact source that owns the run.
+  Hosted production sources appear only when Dispatch has their
+  <APP>_DATABASE_URL connection variables (or an equivalent
+  AGENT_NATIVE_THREAD_DEBUG_DATABASES configuration).
 
 ## Application State
 

package/corpus/templates/dispatch/actions/view-screen.ts

@@ -197,10 +197,11 @@ export default defineAction({
             },
           );
         }
-        if (nav.threadId) {
+        if (nav.threadId || nav.runId) {
           const detail = (await runDispatchAction("get-agent-thread-debug", {
             sourceId: nav.sourceId,
-            threadId: nav.threadId,
+            threadId: nav.runId ? undefined : nav.threadId,
+            runId: nav.runId,
             ownerEmail: nav.ownerEmail,
             maxRuns: 5,
             maxEvents: 80,

package/corpus/templates/dispatch/changelog/2026-07-17-curated-template-remixes.md

@@ -3,4 +3,4 @@ type: added
 date: 2026-07-17
 ---
 
-Dispatch now offers curated workspace templates that can be remixed into private apps.
+Dispatch now offers curated workspace templates that can be used to create private apps.

package/corpus/templates/dispatch/changelog/2026-07-27-creating-an-app-from-a-curated-template-now-uses-clearer-mor.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-27
+---
+
+Creating an app from a curated template now uses clearer, more direct language.

package/corpus/templates/dispatch/changelog/2026-07-27-thread-debug-accepts-request-run-ids.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-27
+---
+
+Thread Debug can open a run directly from the copied request ID in an Agent Native chat.

package/corpus/templates/slides/actions/create-design-system.ts

@@ -8,6 +8,7 @@ import { nanoid } from "nanoid";
 import { z } from "zod";
 
 import { getDb, schema } from "../server/db/index.js";
+import { missingDesignSystemDataFields } from "../shared/design-system-validation.js";
 
 export default defineAction({
   description:
@@ -36,12 +37,19 @@ export default defineAction({
       ),
   }),
   run: async ({ title, description, data, assets, customInstructions }) => {
-    // Validate that data is valid JSON
+    let parsedData: unknown;
     try {
-      JSON.parse(data);
+      parsedData = JSON.parse(data);
     } catch {
       throw new Error("data must be a valid JSON string");
     }
+    const missingFields = missingDesignSystemDataFields(parsedData);
+    if (missingFields.length > 0) {
+      throw new Error(
+        "data is missing required design system field(s): " +
+          missingFields.join(", "),
+      );
+    }
     if (assets) {
       try {
         JSON.parse(assets);

package/corpus/templates/slides/actions/import-file.ts

@@ -2,6 +2,7 @@ import path from "path";
 
 import { defineAction } from "@agent-native/core";
 import { writeAppState } from "@agent-native/core/application-state";
+import { uploadFile } from "@agent-native/core/file-upload";
 import { startBuilderDesignSystemIndex } from "@agent-native/core/server";
 import {
   getRequestOrgId,
@@ -15,6 +16,11 @@ import { getDb, schema } from "../server/db/index.js";
 import { notifyClients } from "../server/handlers/decks.js";
 import { upsertBuilderProxyDesignSystem } from "../server/lib/builder-design-system-proxy.js";
 import { setupPdfParse } from "../server/lib/pdf-parse-setup.js";
+import {
+  ASPECT_RATIOS,
+  DEFAULT_ASPECT_RATIO,
+  type AspectRatio,
+} from "../shared/aspect-ratios.js";
 import { readUserUploadedFile } from "./_uploaded-files.js";
 
 const DEFAULT_MAX_SOURCE_CHARS = 60_000;
@@ -213,6 +219,25 @@ export default defineAction({
 
     if (detectedFormat === "pdf") {
       const { PDFParse, canvasFactory } = await setupPdfParse();
+      const title = titleFromPath(filename);
+
+      // Designed slide PDFs (photo backgrounds, gradients, custom
+      // typography) bake their visuals into vector/image page content with
+      // no reliable text/shape structure to reconstruct, so importing into a
+      // deck rasterizes each page instead of flattening it to generic bullet
+      // text. Falls through to the text-only path below when the optional
+      // canvas renderer isn't available in this runtime.
+      if (importIntoDeck && canvasFactory) {
+        if (!deckId) throw new Error("deckId is required to import into deck");
+        return importPdfPagesAsFullBleedSlides({
+          fileBuffer,
+          title,
+          deckId,
+          PDFParse,
+          canvasFactory,
+        });
+      }
+
       const { convertSectionsToSlides } =
         await import("../server/handlers/import/html-converter.js");
       const pdf = new PDFParse({
@@ -222,7 +247,6 @@ export default defineAction({
       const result = await pdf.getText().finally(() => pdf.destroy());
       const pages = normalizePdfPages(result);
       const textPages = pages.filter((p) => p.text.trim());
-      const title = titleFromPath(filename);
 
       if (textPages.length === 0) {
         throw new Error(
@@ -278,6 +302,152 @@ export default defineAction({
   },
 });
 
+/** Closest configured deck aspect ratio to a source image's own dimensions. */
+function nearestAspectRatio(width: number, height: number): AspectRatio {
+  const target = width / height;
+  let best: AspectRatio = DEFAULT_ASPECT_RATIO;
+  let bestDiff = Infinity;
+  for (const key of Object.keys(ASPECT_RATIOS) as AspectRatio[]) {
+    const preset = ASPECT_RATIOS[key];
+    const diff = Math.abs(preset.width / preset.height - target);
+    if (diff < bestDiff) {
+      bestDiff = diff;
+      best = key;
+    }
+  }
+  return best;
+}
+
+async function importPdfPagesAsFullBleedSlides(args: {
+  fileBuffer: Buffer;
+  title: string;
+  deckId: string;
+  PDFParse: Awaited<ReturnType<typeof setupPdfParse>>["PDFParse"];
+  canvasFactory: object;
+}) {
+  const { fileBuffer, title, deckId, PDFParse, canvasFactory } = args;
+  const { buildFullBleedImageSlideHtml, convertSectionsToSlides } =
+    await import("../server/handlers/import/html-converter.js");
+
+  const pdf = new PDFParse({
+    data: new Uint8Array(fileBuffer),
+    CanvasFactory: canvasFactory,
+  });
+  let pages: { num: number; text: string }[];
+  let imagesByPage: Map<
+    number,
+    { data: Uint8Array; width: number; height: number }
+  >;
+  try {
+    pages = normalizePdfPages(await pdf.getText());
+    // Reuse the page's own embedded photo rather than rasterizing the whole
+    // page: headless canvas text rendering depends on the PDF's embedded
+    // fonts resolving in this runtime, which is unreliable, so real
+    // extracted text is drawn as HTML below instead of trusting the render.
+    const imageResult = await pdf.getImage({
+      imageBuffer: true,
+      imageDataUrl: false,
+    });
+    imagesByPage = new Map();
+    for (const page of imageResult.pages) {
+      const largest = page.images.reduce<
+        { data: Uint8Array; width: number; height: number } | undefined
+      >((best, image) => {
+        if (!best || image.width * image.height > best.width * best.height) {
+          return { data: image.data, width: image.width, height: image.height };
+        }
+        return best;
+      }, undefined);
+      if (largest) imagesByPage.set(page.pageNumber, largest);
+    }
+  } finally {
+    await pdf.destroy();
+  }
+
+  // Source decks (e.g. Instagram carousel exports) are commonly portrait or
+  // square, not the deck editor's 16:9 default — match the canvas to the
+  // first embedded photo's own proportions instead of stretching/cropping it.
+  const firstImage = pages
+    .map((page) => imagesByPage.get(page.num))
+    .find((image): image is NonNullable<typeof image> => Boolean(image));
+  const aspectRatio = firstImage
+    ? nearestAspectRatio(firstImage.width, firstImage.height)
+    : undefined;
+
+  const ownerEmail = getRequestUserEmail();
+  const slides = await Promise.all(
+    pages.map(async (page) => {
+      const lines = page.text
+        .split(/\r?\n/)
+        .map((line) => line.trim())
+        .filter(Boolean);
+      const backgroundImage = imagesByPage.get(page.num);
+
+      if (!backgroundImage) {
+        const [content] = convertSectionsToSlides([
+          { heading: lines[0] ?? `Page ${page.num}`, content: page.text },
+        ]);
+        return {
+          id: newSlideId(),
+          content: content ?? '<div class="fmd-slide"></div>',
+          layout: "content",
+          notes: "",
+        };
+      }
+
+      const uploadResult = await uploadFile({
+        data: Buffer.from(backgroundImage.data),
+        filename: `slide-import-${Date.now()}-p${page.num}.png`,
+        mimeType: "image/png",
+        ownerEmail: ownerEmail ?? undefined,
+        recordAsset: false,
+      });
+      if (!uploadResult?.url) {
+        throw new Error(
+          "File storage is not configured. Connect Builder.io or another upload provider before importing PDF slides.",
+        );
+      }
+      // pdf-parse breaks wrapped text across lines with no way to tell a
+      // wrapped title from a heading followed by a body paragraph. Treat a
+      // couple of short lines as one wrapped title (join them so the
+      // sentence isn't cut off); three or more lines as a heading plus body
+      // text, rendered with distinct sizes so they don't collapse into one
+      // flat paragraph.
+      const heading =
+        lines.length > 2 ? lines[0] : lines.join(" ") || undefined;
+      const subtitle = lines.length > 2 ? lines.slice(1).join(" ") : undefined;
+      return {
+        id: newSlideId(),
+        content: buildFullBleedImageSlideHtml(
+          uploadResult.url,
+          heading,
+          subtitle,
+        ),
+        layout: "full-image",
+        notes: page.text,
+      };
+    }),
+  );
+
+  await replaceDeckSlides(
+    deckId,
+    title,
+    slides,
+    "import-file:pdf",
+    aspectRatio,
+  );
+
+  return {
+    format: "pdf",
+    title,
+    pageCount: slides.length,
+    slideCount: slides.length,
+    aspectRatio,
+    deckId,
+    imported: true,
+  };
+}
+
 function newSlideId(): string {
   return `slide-${Date.now()}-${Math.random().toString(36).slice(2, 7)}`;
 }
@@ -367,6 +537,7 @@ async function replaceDeckSlides(
     notes?: string;
   }>,
   source: string,
+  aspectRatio?: AspectRatio,
 ) {
   await assertAccess("deck", deckId, "editor");
 
@@ -387,6 +558,7 @@ async function replaceDeckSlides(
     ...previousData,
     title,
     slides,
+    ...(aspectRatio ? { aspectRatio } : {}),
     updatedAt: now,
   };
 

package/corpus/templates/slides/actions/list-slide-comments.ts

@@ -27,6 +27,21 @@ export default defineAction({
         ),
       )
       .orderBy(asc(schema.slideComments.createdAt));
-    return { comments: rows };
+    return {
+      comments: rows.map((row) => ({
+        id: row.id,
+        deck_id: row.deckId,
+        slide_id: row.slideId,
+        thread_id: row.threadId,
+        parent_id: row.parentId,
+        content: row.content,
+        quoted_text: row.quotedText,
+        author_email: row.authorEmail,
+        author_name: row.authorName,
+        resolved: row.resolved,
+        created_at: row.createdAt,
+        updated_at: row.updatedAt,
+      })),
+    };
   },
 });

package/corpus/templates/slides/actions/update-design-system.ts

@@ -4,6 +4,7 @@ import { eq } from "drizzle-orm";
 import { z } from "zod";
 
 import { getDb, schema } from "../server/db/index.js";
+import { missingDesignSystemDataFields } from "../shared/design-system-validation.js";
 
 export default defineAction({
   description:
@@ -29,13 +30,23 @@ export default defineAction({
       ),
   }),
   run: async ({ id, title, description, data, assets, customInstructions }) => {
-    // Validate that data/assets are valid JSON when provided
+    // Validate that data/assets are valid JSON, and that data has the shape
+    // the Design Systems page and slide renderers read unconditionally
+    // (data.colors.*, data.typography.*) — see create-design-system.ts.
     if (data !== undefined) {
+      let parsedData: unknown;
       try {
-        JSON.parse(data);
+        parsedData = JSON.parse(data);
       } catch {
         throw new Error("data must be a valid JSON string");
       }
+      const missingFields = missingDesignSystemDataFields(parsedData);
+      if (missingFields.length > 0) {
+        throw new Error(
+          "data is missing required design system field(s): " +
+            missingFields.join(", "),
+        );
+      }
     }
     if (assets !== undefined) {
       try {