npm - @agent-native/core - Versions diffs - 0.80.11 → 0.81.0 - Mend

@agent-native/core 0.80.11 → 0.81.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (225) hide show

package/corpus/templates/analytics/server/lib/dashboard-report.ts CHANGED Viewed

@@ -42,8 +42,8 @@ const DASHBOARD_REPORT_SCREENSHOT_PARAM = "reportScreenshot";
 const DASHBOARD_REPORT_SETTINGS_PARAM = "reportSettings";
 const DASHBOARD_REPORT_CID = "dashboard-report-snapshot";
 const LOCAL_SCREENSHOT_TIMEOUT_MS = 90_000;
-const SERVERLESS_SCREENSHOT_TIMEOUT_MS = 25_000;
-const SERVERLESS_SECOND_READY_TIMEOUT_MS = 10_000;
+const SERVERLESS_SCREENSHOT_TIMEOUT_MS = 60_000;
+const SERVERLESS_SECOND_READY_TIMEOUT_MS = 30_000;
 const MAX_SCREENSHOT_VIEWPORT_HEIGHT = 30_000;
 const SCREENSHOT_VIEWPORT_PADDING = 64;
@@ -249,11 +249,28 @@ async function launchScreenshotBrowser() {
 }
 function screenshotTimeoutMs(): number {
+  const configured = positiveIntEnv("DASHBOARD_REPORT_SCREENSHOT_TIMEOUT_MS");
+  if (configured) return configured;
   return isServerlessBrowserRuntime()
     ? SERVERLESS_SCREENSHOT_TIMEOUT_MS
     : LOCAL_SCREENSHOT_TIMEOUT_MS;
 }
+function secondReadyTimeoutMs(): number {
+  const configured = positiveIntEnv("DASHBOARD_REPORT_SECOND_READY_TIMEOUT_MS");
+  if (configured) return configured;
+  return isServerlessBrowserRuntime()
+    ? SERVERLESS_SECOND_READY_TIMEOUT_MS
+    : screenshotTimeoutMs();
+}
+function positiveIntEnv(name: string): number | null {
+  const raw = process.env[name]?.trim();
+  if (!raw) return null;
+  const parsed = Number.parseInt(raw, 10);
+  return Number.isFinite(parsed) && parsed > 0 ? parsed : null;
+}
 async function waitForDashboardReportReady(
   page: any,
   timeout: number,
@@ -393,12 +410,7 @@ async function captureDashboardPng(
     await capture.waitFor({ state: "visible", timeout });
     await waitForDashboardReportReady(page, timeout);
     await scrollDashboardForLazyRendering(page);
-    await waitForDashboardReportReady(
-      page,
-      isServerlessBrowserRuntime()
-        ? SERVERLESS_SECOND_READY_TIMEOUT_MS
-        : timeout,
-    );
+    await waitForDashboardReportReady(page, secondReadyTimeoutMs());
     await fitViewportToDashboardCapture(page, capture, attempt.viewport);
     await capture.scrollIntoViewIfNeeded();
@@ -478,18 +490,15 @@ function renderReportEmailHtml(
   return `<!doctype html>
 <html>
   <body style="margin:0;padding:24px;background:#ffffff;color:#171717;font-family:Inter,Arial,sans-serif;">
-    <h3 style="margin:0 0 8px;font-size:18px;line-height:1.35;font-weight:600;">
-      Here's the report of <a href="${dashboardUrl}" style="color:#2563eb;text-decoration:none;">${title}</a> for ${date}.
-    </h3>
+    <p style="margin:0 0 12px;font-size:15px;line-height:1.4;font-weight:600;">
+      Here's your report of <a href="${dashboardUrl}" style="color:#2563eb;text-decoration:none;">${title}</a> for ${date}
+    </p>
     ${screenshotBlock}
     <p style="margin:18px 0 0;color:#525866;font-size:13px;line-height:1.45;">
       <a href="${dashboardUrl}" style="color:#2563eb;text-decoration:none;">Open dashboard</a>
       <span style="color:#9ca3af;"> · </span>
       <a href="${reportSettingsUrl}" style="color:#2563eb;text-decoration:none;">Edit subscription settings</a>
     </p>
-    <p style="margin:6px 0 0;color:#6b7280;font-size:12px;line-height:1.45;">
-      Change recipients, delivery time, filters, or turn this report on/off.
-    </p>
   </body>
 </html>`;
 }
@@ -521,6 +530,7 @@ function reportFilename(title: string): string {
 export async function sendDashboardReportSubscription(
   sub: DashboardReportSubscription,
+  options: { requireScreenshot?: boolean } = {},
 ): Promise<{
   dashboardUrl: string;
   recipientCount: number;
@@ -530,6 +540,13 @@ export async function sendDashboardReportSubscription(
 }> {
   const snapshot = await collectReportSnapshot(sub);
   const capture = await captureDashboardPngWithFallback(sub, snapshot);
+  if (!capture.png && options.requireScreenshot) {
+    throw new Error(
+      capture.error
+        ? `Dashboard screenshot unavailable: ${capture.error}`
+        : "Dashboard screenshot unavailable",
+    );
+  }
   const screenshotAttached = Boolean(capture.png);
   const html = renderReportEmailHtml(snapshot, { screenshotAttached });
   const text = renderReportText(snapshot, { screenshotAttached });

package/corpus/templates/assets/actions/open-asset-picker.ts CHANGED Viewed

@@ -7,6 +7,7 @@ import { z } from "zod";
 import { IMAGE_QUALITY_TIERS, STYLE_STRENGTHS } from "../shared/api.js";
 const mediaTypeSchema = z.enum(["image", "video"]);
+const layoutSchema = z.enum(["default", "vertical"]);
 const booleanParam = z.preprocess((value) => {
   if (typeof value === "boolean") return value;
   if (typeof value !== "string") return value;
@@ -77,6 +78,11 @@ const schema = z.object({
     .string()
     .optional()
     .describe("Calling app id, for audit grouping, e.g. design."),
+  layout: layoutSchema
+    .default("default")
+    .describe(
+      "Picker layout density. Use vertical when embedding in a narrow sidebar.",
+    ),
 });
 type OpenAssetPickerArgs = z.infer<typeof schema>;
@@ -132,6 +138,7 @@ function pickerPath(args: Partial<OpenAssetPickerArgs>): string {
   }
   if (args.includeLogo) params.set("includeLogo", "1");
   if (args.callerAppId?.trim()) params.set("callerAppId", args.callerAppId);
+  if (args.layout === "vertical") params.set("layout", "vertical");
   for (const runId of args.candidateRunIds ?? []) {
     if (runId.trim()) params.append("candidateRunIds", runId.trim());
   }
@@ -206,6 +213,7 @@ const action = defineAction({
         prompt: args.prompt ?? null,
         aspectRatio: args.aspectRatio ?? null,
         presetId: args.presetId ?? null,
+        layout: args.layout,
         _writeId: `open-asset-picker-${Date.now()}-${Math.random()
           .toString(36)
           .slice(2, 8)}`,
@@ -219,6 +227,7 @@ const action = defineAction({
       path,
       url: path,
       embed: true,
+      layout: args.layout,
       title:
         args.mediaType === "video"
           ? "Select a video asset"

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

@@ -191,6 +191,21 @@
   }
 }
+.assets-picker-vertical .assets-library-dense-grid,
+.assets-picker-vertical .assets-library-grid {
+  grid-template-columns: minmax(0, 1fr);
+}
+.assets-picker-vertical [role="tablist"] {
+  width: 100%;
+}
+.assets-picker-vertical [role="tab"] {
+  min-width: 0;
+  flex: 1 1 0;
+  padding-inline: 0.5rem;
+}
 @container agent-native-main (min-width: 980px) {
   .assets-brand-kit-preview-grid {
     grid-template-columns: minmax(0, 1fr) 284px;

package/corpus/templates/assets/app/hooks/use-navigation-state.ts CHANGED Viewed

@@ -73,6 +73,7 @@ function navigationFromPath(pathname: string, search = "") {
         query: optionalParam(params, "q"),
         prompt: optionalParam(params, "prompt"),
         aspectRatio: optionalParam(params, "aspectRatio"),
+        layout: params.get("layout") === "vertical" ? "vertical" : undefined,
       };
     }
     const queryLibraryId = optionalParam(params, "libraryId");
@@ -153,6 +154,9 @@ function pathFromCommand(command: any): string | null {
     if (typeof command.aspectRatio === "string" && command.aspectRatio.trim()) {
       params.set("aspectRatio", command.aspectRatio.trim());
     }
+    if (command.layout === "vertical") {
+      params.set("layout", "vertical");
+    }
     const query = params.toString();
     return query ? `/library?${query}` : "/library";
   }

package/corpus/templates/assets/app/routes/library.tsx CHANGED Viewed

@@ -129,6 +129,7 @@ const MCP_APP_CHAT_BRIDGE_QUERY_PARAM = "__an_mcp_chat_bridge";
 const PICKER_INLINE_SELECT_CLASS =
   "h-7 w-auto min-w-0 max-w-full rounded-md border-0 bg-transparent px-1.5 py-1 text-xs font-medium text-muted-foreground shadow-none ring-offset-transparent transition hover:bg-accent/50 hover:text-foreground focus:ring-0 focus:ring-offset-0 sm:px-2 [&>svg]:ms-1 [&>svg]:size-3.5 [&>svg]:opacity-60";
 type PickerMediaType = "image" | "video";
+type PickerLayout = "default" | "vertical";
 type Asset = {
   id: string;
@@ -193,6 +194,7 @@ type HostConfig = {
   styleStrength?: StyleStrength;
   includeLogo?: boolean;
   callerAppId?: string;
+  layout?: PickerLayout;
   autoGenerate?: boolean;
   candidateRunIds?: string[];
 };
@@ -244,6 +246,10 @@ function normalizeMediaType(value: unknown): PickerMediaType {
   return value === "video" ? "video" : "image";
 }
+function normalizePickerLayout(value: unknown): PickerLayout | undefined {
+  return value === "vertical" ? "vertical" : undefined;
+}
 function normalizeBoolean(value: unknown): boolean | undefined {
   if (typeof value === "boolean") return value;
   if (typeof value !== "string") return undefined;
@@ -320,6 +326,7 @@ function normalizeHostConfig(value: unknown): HostConfig {
     includeLogo: normalizeBoolean(record.includeLogo),
     callerAppId:
       typeof record.callerAppId === "string" ? record.callerAppId : undefined,
+    layout: normalizePickerLayout(record.layout),
     candidateRunIds: normalizeCandidateRunIds(record.candidateRunIds),
   };
   if (Object.prototype.hasOwnProperty.call(record, "autoGenerate")) {
@@ -1999,6 +2006,7 @@ export function AssetPickerSurface() {
       styleStrength: normalizeStyleStrength(params.get("styleStrength")),
       includeLogo: normalizeBoolean(params.get("includeLogo")),
       callerAppId: params.get("callerAppId") ?? undefined,
+      layout: normalizePickerLayout(params.get("layout")),
       candidateRunIds: normalizeCandidateRunIds(
         params.getAll("candidateRunIds").length > 0
           ? params.getAll("candidateRunIds")
@@ -2024,6 +2032,9 @@ export function AssetPickerSurface() {
   const [mediaType, setMediaType] = useState<PickerMediaType>(
     () => hostConfig.mediaType ?? "image",
   );
+  const [pickerLayout, setPickerLayout] = useState<PickerLayout>(
+    () => hostConfig.layout ?? "default",
+  );
   const [query, setQuery] = useState(() => hostConfig.query ?? "");
   const [prompt, setPrompt] = useState(() => hostConfig.prompt ?? "");
   const [aspectRatio, setAspectRatio] = useState<string>(
@@ -2046,6 +2057,7 @@ export function AssetPickerSurface() {
   useEffect(() => {
     setHostConfig((current) => ({ ...current, ...urlHostConfig }));
     setMediaType(urlHostConfig.mediaType ?? "image");
+    setPickerLayout(urlHostConfig.layout ?? "default");
     setQuery(urlHostConfig.query ?? "");
     setPrompt(urlHostConfig.prompt ?? "");
     setSelectedLibraryId(urlHostConfig.libraryId ?? "");
@@ -2504,6 +2516,7 @@ export function AssetPickerSurface() {
         const next = normalizeHostConfig(payload);
         setHostConfig((current) => ({ ...current, ...next }));
         if (next.mediaType !== undefined) setMediaType(next.mediaType);
+        if (next.layout !== undefined) setPickerLayout(next.layout);
         if (next.query !== undefined) setQuery(next.query);
         if (next.prompt !== undefined) setPrompt(next.prompt);
         if (next.libraryId !== undefined) setSelectedLibraryId(next.libraryId);
@@ -2533,10 +2546,11 @@ export function AssetPickerSurface() {
         query,
         prompt,
         aspectRatio,
+        layout: pickerLayout,
       },
       { requestSource: "assets-picker-ui" },
     ).catch(() => {});
-  }, [aspectRatio, mediaType, prompt, query, selectedLibraryId]);
+  }, [aspectRatio, mediaType, pickerLayout, prompt, query, selectedLibraryId]);
   const canGenerate =
     mediaType === "image" &&
@@ -2652,14 +2666,22 @@ export function AssetPickerSurface() {
     waitingForRequestedPreset,
   ]);
+  const verticalLayout = pickerLayout === "vertical";
   return (
     <div
       className={cn(
         "flex flex-col overflow-hidden bg-background text-foreground",
         embedded ? "h-screen w-screen" : "h-full w-full",
+        verticalLayout && "assets-picker-vertical",
       )}
     >
-      <header className="flex h-12 shrink-0 items-center justify-between gap-3 border-b border-border px-3">
+      <header
+        className={cn(
+          "flex shrink-0 items-center justify-between gap-3 border-b border-border",
+          verticalLayout ? "h-10 px-2" : "h-12 px-3",
+        )}
+      >
         <div className="min-w-0 truncate text-sm font-semibold">
           {embedded ? t("navigation.brand") : t("library.library")}
         </div>
@@ -2668,7 +2690,7 @@ export function AssetPickerSurface() {
             <Button
               variant={showCreatePane ? "secondary" : "default"}
               size="sm"
-              className="h-8 gap-1.5"
+              className={cn("gap-1.5", verticalLayout ? "h-7 px-2" : "h-8")}
               onClick={() => setShowCreatePane((open) => !open)}
             >
               {showCreatePane ? (
@@ -2676,7 +2698,9 @@ export function AssetPickerSurface() {
               ) : (
                 <IconPhotoPlus className="h-3.5 w-3.5" />
               )}
-              {showCreatePane ? t("library.close") : t("library.createPane")}
+              <span className={verticalLayout ? "sr-only" : undefined}>
+                {showCreatePane ? t("library.close") : t("library.createPane")}
+              </span>
             </Button>
           )}
           {embedded && (
@@ -2705,9 +2729,14 @@ export function AssetPickerSurface() {
       </header>
       {showCreatePane && mediaType === "image" && (
-        <section className="shrink-0 border-b border-border px-3 py-3">
+        <section
+          className={cn(
+            "shrink-0 border-b border-border",
+            verticalLayout ? "px-2 py-2" : "px-3 py-3",
+          )}
+        >
           {mediaType === "image" ? (
-            <div className="mt-2 rounded-lg border border-border/80 bg-background focus-within:ring-1 focus-within:ring-ring">
+            <div className="rounded-lg border border-border/80 bg-background focus-within:ring-1 focus-within:ring-ring">
               <Input
                 type="text"
                 value={prompt}
@@ -2724,10 +2753,23 @@ export function AssetPickerSurface() {
                   if (canGenerate) runGenerate();
                 }}
                 placeholder={t("library.generateImagePlaceholder")}
-                className="h-11 border-0 bg-transparent px-3 py-2.5 leading-6 shadow-none focus-visible:ring-0 focus-visible:ring-offset-0"
+                className={cn(
+                  "border-0 bg-transparent px-3 leading-6 shadow-none focus-visible:ring-0 focus-visible:ring-offset-0",
+                  verticalLayout ? "h-9 py-2 text-xs" : "h-11 py-2.5",
+                )}
               />
-              <div className="flex items-center gap-1 px-2 pb-2">
-                <div className="flex min-w-0 flex-1 items-center justify-end gap-0.5 sm:gap-1">
+              <div
+                className={cn(
+                  "flex gap-1 px-2 pb-2",
+                  verticalLayout ? "flex-col items-stretch" : "items-center",
+                )}
+              >
+                <div
+                  className={cn(
+                    "flex min-w-0 flex-1 items-center gap-0.5 sm:gap-1",
+                    verticalLayout ? "justify-between" : "justify-end",
+                  )}
+                >
                   <Select value={aspectRatio} onValueChange={setAspectRatio}>
                     <SelectTrigger
                       aria-label={t("brandKitDetail.aspectRatio")}
@@ -2792,7 +2834,10 @@ export function AssetPickerSurface() {
                   ) : null}
                 </div>
                 <Button
-                  className="h-7 min-w-[5.75rem] shrink-0 px-3 text-xs"
+                  className={cn(
+                    "h-7 shrink-0 px-3 text-xs",
+                    !verticalLayout && "min-w-[5.75rem]",
+                  )}
                   disabled={!canGenerate}
                   onClick={runGenerate}
                 >
@@ -2932,12 +2977,33 @@ export function AssetPickerSurface() {
         </section>
       )}
-      <main className="min-h-0 flex-1 overflow-y-auto p-3">
+      <main
+        className={cn(
+          "min-h-0 flex-1 overflow-y-auto",
+          verticalLayout ? "p-2" : "p-3",
+        )}
+      >
         {displayLibraries.length > 0 && (
-          <div className="mb-3 flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between">
-            <div className="flex flex-col gap-2 sm:flex-row sm:items-center">
+          <div
+            className={cn(
+              "mb-3 flex flex-col gap-2",
+              !verticalLayout &&
+                "sm:flex-row sm:items-center sm:justify-between",
+            )}
+          >
+            <div
+              className={cn(
+                "flex flex-col gap-2",
+                !verticalLayout && "sm:flex-row sm:items-center",
+              )}
+            >
               {draftsGlobalView ? (
-                <div className="flex h-9 items-center rounded-md border border-border/70 bg-background px-3 text-sm text-muted-foreground sm:w-48">
+                <div
+                  className={cn(
+                    "flex h-9 items-center rounded-md border border-border/70 bg-background px-3 text-sm text-muted-foreground",
+                    !verticalLayout && "sm:w-48",
+                  )}
+                >
                   {t("library.allLibraries")}
                 </div>
               ) : (
@@ -2945,7 +3011,12 @@ export function AssetPickerSurface() {
                   value={selectedLibraryId}
                   onValueChange={setSelectedLibraryId}
                 >
-                  <SelectTrigger className="h-9 w-full border-border/70 bg-background sm:w-48">
+                  <SelectTrigger
+                    className={cn(
+                      "h-9 w-full border-border/70 bg-background",
+                      !verticalLayout && "sm:w-48",
+                    )}
+                  >
                     <SelectValue placeholder={t("library.library")} />
                   </SelectTrigger>
                   <SelectContent>
@@ -2990,7 +3061,10 @@ export function AssetPickerSurface() {
                 onInput={(event) => setQuery(event.currentTarget.value)}
                 onChange={(event) => setQuery(event.target.value)}
                 placeholder={t("library.searchMedia", { mediaLabel })}
-                className="h-9 border-border/70 bg-background sm:max-w-xs"
+                className={cn(
+                  "h-9 border-border/70 bg-background",
+                  !verticalLayout && "sm:max-w-xs",
+                )}
               />
             )}
           </div>

package/corpus/templates/assets/changelog/2026-06-30-the-assets-picker-now-supports-a-vertical-embedded-layout-fo.md ADDED Viewed

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-06-30
+---
+The Assets picker now supports a vertical embedded layout for sidebar workflows.

package/corpus/templates/clips/actions/finalize-recording.ts CHANGED Viewed

@@ -10,7 +10,6 @@
 import { defineAction } from "@agent-native/core";
 import {
-  appStateList,
   readAppState,
   writeAppState,
   deleteAppState,
@@ -28,6 +27,7 @@ import {
   applyFaststart,
   hasPlayableMp4Metadata,
 } from "../server/lib/faststart.js";
+import { listRecordingChunkKeys } from "../server/lib/recording-upload-state.js";
 import {
   getCurrentOwnerEmail,
   ownerEmailMatches,
@@ -66,17 +66,6 @@ function concatBytes(parts: Uint8Array[]): Uint8Array {
   return out;
 }
-async function listRecordingChunkKeys(
-  ownerEmail: string,
-  recordingId: string,
-): Promise<string[]> {
-  const rows = await appStateList(
-    ownerEmail,
-    `recording-chunks-${recordingId}-`,
-  );
-  return rows.map((row) => row.key);
-}
 function chunkIndexFromKey(key: string): number {
   return Number(key.split("-").pop() || 0);
 }

package/corpus/templates/clips/app/routes/r.$recordingId.tsx CHANGED Viewed

@@ -86,6 +86,9 @@ import { parsePlaybackSpeed } from "@/lib/playback-speed";
 import { isStorageSetupFailureReason } from "@/lib/storage-failures";
 import { cn } from "@/lib/utils";
+const UPLOAD_STUCK_TIMEOUT_MS = 5 * 60 * 1000;
+const PROCESSING_STUCK_TIMEOUT_MS = 2 * 60 * 1000;
 export function meta() {
   return [{ title: enMessages.recordingRoute.pageTitle }];
 }
@@ -562,10 +565,8 @@ export default function RecordingPage() {
       .finally(() => playerDataQ.refetch());
   }, [recording?.id, recording?.status, transcriptStatus, role, playerDataQ]);
-  // After 30 seconds of non-ready status (without an explicit failure), flip
-  // a local flag so we can stop pretending this is normal and show an error.
-  // Even a 10-minute recording's finalize completes in a few seconds with
-  // the SQL fallback, so anything past 30s means something is wrong.
+  // Long browser-extension clips can still be uploading chunks or assembling
+  // for more than 30s. Keep polling before surfacing a stuck-state fallback.
   useEffect(() => {
     if (!recording) {
       setProcessingTimeout(false);
@@ -579,7 +580,11 @@ export default function RecordingPage() {
       setProcessingTimeout(false);
       return;
     }
-    const handle = setTimeout(() => setProcessingTimeout(true), 30_000);
+    const timeoutMs =
+      recording.status === "processing"
+        ? PROCESSING_STUCK_TIMEOUT_MS
+        : UPLOAD_STUCK_TIMEOUT_MS;
+    const handle = setTimeout(() => setProcessingTimeout(true), timeoutMs);
     return () => clearTimeout(handle);
   }, [recording?.status, recording?.videoUrl, recordingId]);

package/corpus/templates/clips/app/routes/share.$shareId.tsx CHANGED Viewed

@@ -229,6 +229,8 @@ const CLIPS_SOURCE_URL =
 const CLIPS_TEMPLATE_URL = "https://www.agent-native.com/templates/clips";
 const CLIPS_AGENT_DOCS_URL =
   "https://www.agent-native.com/docs/template-clips#agent-readable-clips";
+const UPLOAD_STUCK_TIMEOUT_MS = 5 * 60 * 1000;
+const PROCESSING_STUCK_TIMEOUT_MS = 2 * 60 * 1000;
 type ViewerPlatform = "mac" | "windows";
@@ -453,17 +455,13 @@ export default function ShareRoute() {
       return;
     }
-    const progress = Number(recording.uploadProgress ?? 0);
     const timeoutMs =
-      recording.status === "processing" || progress >= 95 ? 12_000 : 30_000;
+      recording.status === "processing"
+        ? PROCESSING_STUCK_TIMEOUT_MS
+        : UPLOAD_STUCK_TIMEOUT_MS;
     const handle = setTimeout(() => setProcessingTimeout(true), timeoutMs);
     return () => clearTimeout(handle);
-  }, [
-    recording?.id,
-    recording?.status,
-    recording?.videoUrl,
-    recording?.uploadProgress,
-  ]);
+  }, [recording?.id, recording?.status, recording?.videoUrl]);
   usePlayerShortcuts({ playerRef });

package/corpus/templates/clips/changelog/2026-06-30-extension-save-recovery-avoids-false-upload-failures.md ADDED Viewed

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-06-30
+---
+Chrome extension recordings no longer show an upload failure when the clip finished saving successfully.

package/corpus/templates/clips/changelog/2026-06-30-longer-chrome-extension-recordings-now-keep-saving-reliably-.md ADDED Viewed

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-06-30
+---
+Longer Chrome extension recordings now keep saving reliably instead of getting stuck or showing a second countdown.

package/corpus/templates/clips/chrome-extension/public/manifest.json CHANGED Viewed

@@ -2,7 +2,7 @@
   "manifest_version": 3,
   "name": "Agent-Native Clips",
   "short_name": "Clips",
-  "version": "0.1.6",
+  "version": "0.1.7",
   "description": "Start Clips recordings from Chrome, capture optional diagnostics, and preview Clips links on GitHub.",
   "minimum_chrome_version": "116",
   "action": {

package/corpus/templates/clips/chrome-extension/src/background.ts CHANGED Viewed

@@ -261,6 +261,7 @@ const CROSS_TAB_FOLLOW: boolean = false;
 // The tab the recording was launched from — the only tab activeTab lets us touch.
 let overlayTabId: number | null = null;
 let countdownEndsAtMs = 0;
+let armingNativeRecordingSessionId: string | null = null;
 function desiredParts(): OverlayPart[] {
   // The on-page controls match the desktop app: a left-edge vertical pill plus
@@ -950,15 +951,7 @@ function createSession(
 }
 async function handlePopupStart(message: PopupStartMessage) {
-  const tab = await queryActiveTab();
-  if (!tab || typeof tab.id !== "number") {
-    return { ok: false, error: "No active tab is available to record." };
-  }
-  const settings = await readSettings(message.settings);
-  await storageSet(settings);
-  if (activeNativeRecording) {
+  if (activeNativeRecording || armingNativeRecordingSessionId) {
     return {
       ok: false,
       error: "Clips is already recording. Stop the active clip first.",
@@ -966,7 +959,22 @@ async function handlePopupStart(message: PopupStartMessage) {
   }
   const sessionId = crypto.randomUUID();
-  return armRecording({ sessionId, tab, settings });
+  armingNativeRecordingSessionId = sessionId;
+  try {
+    const tab = await queryActiveTab();
+    if (!tab || typeof tab.id !== "number") {
+      return { ok: false, error: "No active tab is available to record." };
+    }
+    const settings = await readSettings(message.settings);
+    await storageSet(settings);
+    return await armRecording({ sessionId, tab, settings });
+  } finally {
+    if (armingNativeRecordingSessionId === sessionId) {
+      armingNativeRecordingSessionId = null;
+    }
+  }
 }
 // Arm a Loom-style in-page recording: show the native picker, create the row,
@@ -1474,6 +1482,7 @@ async function handlePopupStatus() {
   return {
     ok: true,
     activeRecording: activeNativeRecording,
+    arming: Boolean(armingNativeRecordingSessionId),
   };
 }