@agent-native/core 0.79.6 → 0.79.9

package/corpus/templates/clips/chrome-extension/src/offscreen.ts

@@ -23,6 +23,15 @@ import { captureExtensionError, initExtensionSentry } from "./sentry";
 
 initExtensionSentry("offscreen");
 
+const STORAGE_SETUP_REQUIRED_MESSAGE =
+  "Connect storage to finish saving this clip: Builder.io (free tier storage + AI) or S3-compatible storage.";
+const STORAGE_SETUP_FAILURE_RE =
+  /video storage is not connected|no video storage configured|file upload provider|storage provider|connect builder|s3-compatible/i;
+
+function isStorageSetupFailureMessage(message: string | null | undefined) {
+  return STORAGE_SETUP_FAILURE_RE.test(message ?? "");
+}
+
 type CaptureMode = "screen" | "camera";
 
 type AcquireMessage = {
@@ -396,7 +405,14 @@ async function uploadChunk(
     body,
   });
   const text = await res.text().catch(() => "");
-  const data = text ? (JSON.parse(text) as UploadResult) : {};
+  let data: UploadResult = {};
+  if (text) {
+    try {
+      data = JSON.parse(text) as UploadResult;
+    } catch {
+      data = {};
+    }
+  }
   if (!res.ok) {
     console.error(
       "[clips-offscreen] chunk upload failed",
@@ -405,9 +421,17 @@ async function uploadChunk(
       Boolean(recording.authToken),
       text.slice(0, 200),
     );
+    const storageSetupRequired =
+      data?.storageSetupRequired === true ||
+      isStorageSetupFailureMessage(data?.error || text);
     const error = new Error(
-      data?.error || `Upload failed (${res.status}): ${text || res.statusText}`,
+      storageSetupRequired
+        ? STORAGE_SETUP_REQUIRED_MESSAGE
+        : data?.error ||
+            `Upload failed (${res.status}): ${text || res.statusText}`,
     );
+    (error as { storageSetupRequired?: boolean }).storageSetupRequired =
+      storageSetupRequired;
     captureExtensionError(error, {
       tags: {
         surface: "offscreen",
@@ -845,6 +869,8 @@ async function finalizeStop(recording: ActiveRecording): Promise<void> {
     reportStatus(recording.sessionId, "error", {
       recordingId: recording.recordingId,
       error: error.message,
+      storageSetupRequired: (error as { storageSetupRequired?: boolean })
+        .storageSetupRequired,
     });
     recording.rejectStopped(error);
   }

package/corpus/templates/clips/chrome-extension/src/popup.html

@@ -405,6 +405,22 @@
 
       <span id="status" class="status" role="status" aria-live="polite"></span>
 
+      <div id="storage-help" class="storage-help" hidden>
+        <button id="storage-help-open" class="storage-help-open" type="button">
+          Use Builder.io (free)
+        </button>
+        <span aria-hidden="true">·</span>
+        <span class="storage-help-why" tabindex="0">
+          Why am I seeing this?
+          <span class="storage-help-details" role="tooltip">
+            Clips is 100% free and open source, so you need to hook up a way to
+            store your clips. Connect storage with Builder.io for free-tier
+            storage and AI, or use S3-compatible object storage and your own LLM
+            keys.
+          </span>
+        </span>
+      </div>
+
       <nav class="bottom-row" aria-label="Clips shortcuts">
         <button id="open-library" class="bottom-button" type="button">
           <svg viewBox="0 0 24 24" fill="none" aria-hidden="true">

package/corpus/templates/clips/chrome-extension/src/popup.ts

@@ -93,9 +93,17 @@ const FEEDBACK_URL =
 const FEEDBACK_PLACEHOLDER = "Tell us what's on your mind...";
 const FEEDBACK_SUBMIT_TEXT = "Send feedback";
 const FEEDBACK_SUCCESS_MESSAGE = "Thanks for the feedback!";
+const STORAGE_SETUP_REQUIRED_MESSAGE =
+  "Connect storage to finish saving this clip: Builder.io (free tier storage + AI) or S3-compatible storage.";
+const STORAGE_SETUP_FAILURE_RE =
+  /video storage is not connected|no video storage configured|file upload provider|storage provider|connect builder|s3-compatible/i;
 const feedbackTarget = parseFeedbackTarget(FEEDBACK_URL);
 const feedbackSchemaCache = new Map<string, Promise<FeedbackFormSchema>>();
 
+function isStorageSetupFailureMessage(message: string | null | undefined) {
+  return STORAGE_SETUP_FAILURE_RE.test(message ?? "");
+}
+
 function screenSurface(
   value: CaptureSurface,
 ): Exclude<CaptureSurface, "camera"> {
@@ -507,6 +515,14 @@ function setStatus(message: string, kind: "info" | "error" = "info"): void {
   status.dataset.kind = kind;
 }
 
+function setStorageHelp(visible: boolean): void {
+  byId<HTMLDivElement>("storage-help").hidden = !visible;
+}
+
+function storageSetupUrl(settings: ExtensionSettings): string {
+  return `${settings.clipsBaseUrl.replace(/\/+$/, "")}/record`;
+}
+
 function renderMode(settings: ExtensionSettings): void {
   const mode = recordingMode(settings);
   for (const button of document.querySelectorAll<HTMLButtonElement>(
@@ -690,7 +706,10 @@ function renderActiveRecording(recording: NativeRecording | null): void {
   start.hidden = active;
   signIn.hidden = true;
   if (recordingActions) recordingActions.hidden = !active;
-  if (!recording) return;
+  if (!recording) {
+    setStorageHelp(false);
+    return;
+  }
 
   recordingTitle.textContent = recording.targetTitle || "Current recording";
   const host = hostnameLabel(recording.targetUrl);
@@ -706,10 +725,16 @@ function renderActiveRecording(recording: NativeRecording | null): void {
       : recording.status === "stopping"
         ? "Stopping..."
         : recording.status === "error"
-          ? recording.error || "Recording needs attention"
+          ? isStorageSetupFailureMessage(recording.error)
+            ? STORAGE_SETUP_REQUIRED_MESSAGE
+            : recording.error || "Recording needs attention"
           : `Recording ${formatDuration(recording.startedAtMs)}`;
   recordingStatus.dataset.kind =
     recording.status === "error" ? "error" : "info";
+  setStorageHelp(
+    recording.status === "error" &&
+      isStorageSetupFailureMessage(recording.error),
+  );
 }
 
 async function init(): Promise<void> {
@@ -751,6 +776,7 @@ async function init(): Promise<void> {
   const openSettings = byId<HTMLButtonElement>("open-settings");
   const openRecent = byId<HTMLButtonElement>("open-recent");
   const signIn = byId<HTMLButtonElement>("sign-in");
+  const storageHelpOpen = byId<HTMLButtonElement>("storage-help-open");
   let activeRecording: NativeRecording | null = null;
   let authStatus: AuthStatus = "checking";
   let feedbackOpenedAt = 0;
@@ -1071,6 +1097,7 @@ async function init(): Promise<void> {
   start.addEventListener("click", async () => {
     start.disabled = true;
     signIn.hidden = true;
+    setStorageHelp(false);
     setStatus(""); // no chatty "Checking…/Starting…" text — the disabled button is enough
     try {
       authStatus = await readAuthStatus(settings);
@@ -1085,10 +1112,11 @@ async function init(): Promise<void> {
       if (!storageConfigured) {
         start.disabled = false;
         setStatus(
-          "Connect Builder.io or S3 storage in Clips, then start recording.",
+          "Connect storage in Clips first: Builder.io (free tier storage + AI) or S3-compatible storage.",
           "error",
         );
-        await createTab(`${settings.clipsBaseUrl.replace(/\/+$/, "")}/record`);
+        setStorageHelp(true);
+        await createTab(storageSetupUrl(settings));
         window.close();
         return;
       }
@@ -1117,7 +1145,14 @@ async function init(): Promise<void> {
         setStatus("");
         return;
       }
-      setStatus(message, "error");
+      const storageSetupFailure = isStorageSetupFailureMessage(message);
+      setStorageHelp(storageSetupFailure);
+      setStatus(
+        storageSetupFailure
+          ? "Connect storage in Clips first: Builder.io (free tier storage + AI) or S3-compatible storage."
+          : message,
+        "error",
+      );
     } catch (err) {
       captureExtensionError(err, {
         tags: { surface: "popup", action: "start-recording" },
@@ -1128,13 +1163,24 @@ async function init(): Promise<void> {
         },
       });
       start.disabled = false;
+      const message =
+        err instanceof Error ? err.message : "Could not start Clips.";
+      const storageSetupFailure = isStorageSetupFailureMessage(message);
+      setStorageHelp(storageSetupFailure);
       setStatus(
-        err instanceof Error ? err.message : "Could not start Clips.",
+        storageSetupFailure
+          ? "Connect storage in Clips first: Builder.io (free tier storage + AI) or S3-compatible storage."
+          : message,
         "error",
       );
     }
   });
 
+  storageHelpOpen.addEventListener("click", async () => {
+    await createTab(storageSetupUrl(settings));
+    window.close();
+  });
+
   signIn.addEventListener("click", async () => {
     signIn.disabled = true;
     const response = await sendRuntimeMessage<PopupStartResponse>({
@@ -1161,7 +1207,13 @@ async function init(): Promise<void> {
     }
     stop.disabled = false;
     discard.disabled = false;
-    setStatus(response.error || "Could not stop recording.", "error");
+    const message = response.error || "Could not stop recording.";
+    const storageSetupFailure = isStorageSetupFailureMessage(message);
+    setStorageHelp(storageSetupFailure);
+    setStatus(
+      storageSetupFailure ? STORAGE_SETUP_REQUIRED_MESSAGE : message,
+      "error",
+    );
   });
 
   discard.addEventListener("click", async () => {

package/corpus/templates/clips/chrome-extension/src/sentry.ts

@@ -67,6 +67,31 @@ function scrubEvent<T extends Sentry.Event>(event: T): T {
   return event;
 }
 
+function shouldDropExpectedMediaPermissionError(
+  error: unknown,
+  context: CaptureContext,
+): boolean {
+  const tags = context.tags ?? {};
+  const isPermissionProbe =
+    tags.surface === "permission" &&
+    (tags.permission === "mic" || tags.permission === "cam");
+  const isOptionalBubbleCamera =
+    tags.surface === "overlay" && tags.overlayPart === "bubble";
+  if (!isPermissionProbe && !isOptionalBubbleCamera) return false;
+
+  const text =
+    error instanceof Error
+      ? `${error.name}: ${error.message}`
+      : String(error ?? "");
+
+  return (
+    /\bNotAllowedError\b/i.test(text) ||
+    /\bPermission (?:denied|dismissed)\b/i.test(text) ||
+    /\b(?:NotFoundError|DevicesNotFoundError)\b/i.test(text) ||
+    /\bRequested device not found\b/i.test(text)
+  );
+}
+
 function scrubScopeString(value: string): string {
   const scrubbed = scrubUrl(value, { redactAllQueryValues: true });
   if (scrubbed !== value) return scrubbed;
@@ -175,7 +200,9 @@ export function captureExtensionError(
   error: unknown,
   context: CaptureContext = {},
 ): string | undefined {
-  if (!initialized) return undefined;
+  if (!initialized || shouldDropExpectedMediaPermissionError(error, context)) {
+    return undefined;
+  }
   try {
     return Sentry.withScope((scope) => {
       if (context.tags) {

package/corpus/templates/clips/chrome-extension/src/styles.css

@@ -574,6 +574,80 @@ svg {
   color: var(--danger);
 }
 
+.storage-help {
+  position: relative;
+  display: flex;
+  min-height: 18px;
+  align-items: center;
+  justify-content: center;
+  gap: 5px;
+  color: var(--fg-subtle);
+  font-size: 11px;
+  line-height: 1.3;
+  text-align: center;
+}
+
+.storage-help[hidden] {
+  display: none;
+}
+
+.storage-help-open,
+.storage-help-why {
+  border: 0;
+  background: transparent;
+  color: var(--fg-muted);
+  font: inherit;
+  padding: 0;
+  text-decoration: underline;
+  text-decoration-style: dotted;
+  text-underline-offset: 3px;
+}
+
+.storage-help-open {
+  cursor: pointer;
+}
+
+.storage-help-why {
+  position: relative;
+  cursor: help;
+}
+
+.storage-help-open:hover,
+.storage-help-open:focus-visible,
+.storage-help-why:hover,
+.storage-help-why:focus-visible {
+  color: var(--fg);
+  outline: none;
+}
+
+.storage-help-details {
+  position: absolute;
+  right: 0;
+  bottom: calc(100% + 8px);
+  z-index: 70;
+  width: 310px;
+  padding: 8px 10px;
+  border-radius: var(--radius-sm);
+  background: var(--bg);
+  box-shadow: var(--shadow-md);
+  color: var(--fg);
+  font-size: 12px;
+  line-height: 1.45;
+  opacity: 0;
+  pointer-events: none;
+  text-align: left;
+  transform: translateY(3px);
+  transition:
+    opacity 120ms ease-out,
+    transform 120ms ease-out;
+}
+
+.storage-help-why:hover .storage-help-details,
+.storage-help-why:focus-visible .storage-help-details {
+  opacity: 1;
+  transform: translateY(0);
+}
+
 .bottom-row {
   display: grid;
   grid-template-columns: repeat(3, 1fr);

package/corpus/templates/clips/desktop/src/app.tsx

@@ -3,6 +3,7 @@ import {
   IconArrowLeft,
   IconCircleCheck,
   IconDownload,
+  IconExternalLink,
   IconFolderOpen,
   IconPencil,
   IconInfoCircle,
@@ -118,6 +119,15 @@ type MeetingTranscriptionMode = "manual" | "ask" | "auto";
 type CaptureMode = "screen" | "screen-camera" | "camera";
 type VideoStorageStatus = "checking" | "configured" | "missing";
 
+const STORAGE_SETUP_HELP_TEXT =
+  "Clips is 100% free and open source, so you need to hook up a way to store your clips. Connect storage with Builder.io for free-tier storage and AI, or use S3-compatible object storage and your own LLM keys.";
+const STORAGE_SETUP_FAILURE_RE =
+  /video storage is not connected|no video storage configured|file upload provider|storage provider|connect builder|s3-compatible/i;
+
+function isStorageSetupFailureMessage(message: string | null | undefined) {
+  return STORAGE_SETUP_FAILURE_RE.test(message ?? "");
+}
+
 const STORAGE_KEY = "clips:server-url";
 const MODE_KEY = "clips:last-mode";
 const VOICE_SHORTCUT_KEY = "clips:voice-shortcut";
@@ -1559,7 +1569,11 @@ export function App() {
     } catch (err) {
       const message = err instanceof Error ? err.message : String(err);
       console.error("[clips-tray] retry saved upload failed:", err);
-      setRecError(message);
+      setRecError(
+        isStorageSetupFailureMessage(message)
+          ? "Connect storage to finish uploading this saved clip: Builder.io (free tier storage + AI) or S3-compatible storage."
+          : message,
+      );
       await loadPendingUploads();
     } finally {
       setRetryingUploadId(null);
@@ -1636,20 +1650,23 @@ export function App() {
     });
   }
 
-  const openVideoStorageSetup = useCallback(() => {
-    const base = serverUrl.replace(/\/+$/, "");
-    setRecError(
-      "Connect Builder.io or S3-compatible storage before recording from desktop. Opening storage setup...",
-    );
-    void openExternal(`${base}/record`).catch((err) => {
+  const openVideoStorageSetup = useCallback(
+    (targetServerUrl?: string) => {
+      const base = (targetServerUrl?.trim() || serverUrl).replace(/\/+$/, "");
       setRecError(
-        err instanceof Error
-          ? err.message
-          : "Could not open Clips storage setup.",
+        "Connect storage before recording from desktop: Builder.io (free tier storage + AI) or S3-compatible storage. Opening storage setup...",
       );
-    });
-    void refreshVideoStorageStatus();
-  }, [refreshVideoStorageStatus, serverUrl]);
+      void openExternal(`${base}/record`).catch((err) => {
+        setRecError(
+          err instanceof Error
+            ? err.message
+            : "Could not open Clips storage setup.",
+        );
+      });
+      void refreshVideoStorageStatus();
+    },
+    [refreshVideoStorageStatus, serverUrl],
+  );
 
   async function handleStartRecording(options?: {
     ignoreActiveRecorder?: boolean;
@@ -2148,6 +2165,7 @@ export function App() {
           onRetry={retryPendingUpload}
           onDiscard={discardPendingUpload}
           onOpenFolder={openPendingUploadFolder}
+          onConnectStorage={(upload) => openVideoStorageSetup(upload.serverUrl)}
         />
       ) : null}
 
@@ -2407,6 +2425,7 @@ function PendingUploadBanner({
   onRetry,
   onDiscard,
   onOpenFolder,
+  onConnectStorage,
 }: {
   uploads: PendingDesktopUpload[];
   retryingUploadId: string | null;
@@ -2416,11 +2435,13 @@ function PendingUploadBanner({
   onRetry: (upload: PendingDesktopUpload) => void;
   onDiscard: (upload: PendingDesktopUpload) => void;
   onOpenFolder: (upload: PendingDesktopUpload) => void;
+  onConnectStorage: (upload: PendingDesktopUpload) => void;
 }) {
   const latest = uploads[0];
   if (!latest) return null;
 
   const retrying = retryingUploadId === latest.recordingId;
+  const storageSetupFailure = isStorageSetupFailureMessage(latest.lastError);
   const exporting = exportingUploadId === latest.recordingId;
   const canOpenFolder = latest.kind === "native" && !!latest.folderPath;
   const canExport = latest.kind === "browser";
@@ -2430,6 +2451,16 @@ function PendingUploadBanner({
     uploads.length === 1
       ? "1 Clip saved locally"
       : `${uploads.length} Clips saved locally`;
+  const nativeCorrupt = latest.kind === "native" && !!latest.corrupt;
+  const title = nativeCorrupt
+    ? uploads.length === 1
+      ? "Clip could not be finalized"
+      : "Some Clips could not be finalized"
+    : storageSetupFailure
+      ? uploads.length === 1
+        ? "Connect storage to upload saved Clip"
+        : "Connect storage to upload saved Clips"
+      : savedLabel;
   const details = [
     latest.savedAt ? `saved ${formatAgo(latest.savedAt)}` : null,
     formatFileSize(latest.bytes),
@@ -2444,11 +2475,36 @@ function PendingUploadBanner({
         <IconUpload size={17} stroke={1.8} />
       </div>
       <div className="pending-upload-copy">
-        <div className="pending-upload-title">{savedLabel}</div>
-        <div className="pending-upload-sub">
-          {details.join(" · ")}
-          {errorText ? ` · ${errorText}` : ""}
+        <div className="pending-upload-title">{title}</div>
+        <div
+          className={
+            storageSetupFailure
+              ? "pending-upload-sub pending-upload-sub-wrap"
+              : "pending-upload-sub"
+          }
+        >
+          {nativeCorrupt
+            ? `${details.join(" · ")} · discard and record again`
+            : storageSetupFailure
+              ? `${details.join(" · ")} · your clip is safe locally`
+              : `${details.join(" · ")}${errorText ? ` · ${errorText}` : ""}`}
         </div>
+        {storageSetupFailure ? (
+          <Tooltip>
+            <TooltipTrigger asChild>
+              <button type="button" className="pending-upload-why">
+                Why am I seeing this?
+              </button>
+            </TooltipTrigger>
+            <TooltipContent
+              side="bottom"
+              align="start"
+              className="tooltip-content-wide"
+            >
+              {STORAGE_SETUP_HELP_TEXT}
+            </TooltipContent>
+          </Tooltip>
+        ) : null}
       </div>
       <div className="pending-upload-actions">
         {canOpenFolder ? (
@@ -2488,6 +2544,17 @@ function PendingUploadBanner({
           </button>
         ) : (
           <>
+            {storageSetupFailure ? (
+              <button
+                type="button"
+                className="pending-upload-connect"
+                disabled={actionsDisabled}
+                onClick={() => onConnectStorage(latest)}
+              >
+                <IconExternalLink size={14} stroke={2} />
+                Connect
+              </button>
+            ) : null}
             <button
               type="button"
               className="pending-upload-retry"
@@ -3705,7 +3772,7 @@ function Setup({
                 className="secondary"
                 onClick={connectBuilder}
               >
-                Connect Builder.io
+                Use Builder.io (free)
               </button>
             ) : null}
           </div>

package/corpus/templates/clips/desktop/src/styles.css

@@ -1448,6 +1448,10 @@ body[data-clips-route="recording-pill"] #root {
   transform-origin: var(--radix-tooltip-content-transform-origin);
 }
 
+.tooltip-content-wide {
+  max-width: 320px;
+}
+
 .tooltip-content[data-state="delayed-open"],
 .tooltip-content[data-state="instant-open"] {
   animation: tooltip-in 120ms ease-out;
@@ -1720,12 +1724,38 @@ body[data-clips-route="recording-pill"] #root {
   white-space: nowrap;
 }
 
+.pending-upload-sub-wrap {
+  overflow: visible;
+  white-space: normal;
+}
+
+.pending-upload-why {
+  margin-top: 3px;
+  padding: 0;
+  border: 0;
+  background: transparent;
+  color: #64748b;
+  cursor: help;
+  font-size: 11px;
+  line-height: 1.2;
+  text-decoration: underline;
+  text-decoration-style: dotted;
+  text-underline-offset: 3px;
+}
+
+.pending-upload-why:hover,
+.pending-upload-why:focus-visible {
+  color: #334155;
+  outline: none;
+}
+
 .pending-upload-actions {
   display: inline-flex;
   align-items: center;
   gap: 6px;
 }
 
+.pending-upload-connect,
 .pending-upload-retry {
   height: 28px;
   border: 1px solid #bfdbfe;
@@ -1746,6 +1776,10 @@ body[data-clips-route="recording-pill"] #root {
     opacity 120ms;
 }
 
+.pending-upload-connect {
+  padding: 0 8px;
+}
+
 .pending-upload-discard {
   width: 28px;
   height: 28px;
@@ -1789,6 +1823,11 @@ body[data-clips-route="recording-pill"] #root {
   border-color: #93c5fd;
 }
 
+.pending-upload-connect:hover {
+  background: #dbeafe;
+  border-color: #93c5fd;
+}
+
 .pending-upload-folder:hover {
   background: #dbeafe;
   border-color: #93c5fd;
@@ -1801,6 +1840,7 @@ body[data-clips-route="recording-pill"] #root {
 }
 
 .pending-upload-retry:disabled,
+.pending-upload-connect:disabled,
 .pending-upload-folder:disabled,
 .pending-upload-discard:disabled {
   cursor: default;
@@ -1972,6 +2012,16 @@ body[data-clips-route="recording-pill"] #root {
     color: #93c5fd;
   }
 
+  .pending-upload-why {
+    color: #94a3b8;
+  }
+
+  .pending-upload-why:hover,
+  .pending-upload-why:focus-visible {
+    color: #cbd5e1;
+  }
+
+  .pending-upload-connect,
   .pending-upload-retry {
     background: rgba(15, 23, 42, 0.7);
     border-color: rgba(96, 165, 250, 0.38);
@@ -1995,6 +2045,11 @@ body[data-clips-route="recording-pill"] #root {
     border-color: rgba(147, 197, 253, 0.62);
   }
 
+  .pending-upload-connect:hover {
+    background: rgba(30, 64, 175, 0.34);
+    border-color: rgba(147, 197, 253, 0.62);
+  }
+
   .pending-upload-folder:hover {
     background: rgba(30, 64, 175, 0.34);
     border-color: rgba(147, 197, 253, 0.62);