@agent-native/core 0.91.0 → 0.91.2

package/corpus/templates/mail/app/hooks/use-emails.ts

@@ -13,10 +13,11 @@ import {
   useMutation,
   useQueryClient,
 } from "@tanstack/react-query";
-import { useMemo, useRef } from "react";
+import { useMemo } from "react";
 import { toast } from "sonner";
 
 import { useAccountFilter } from "@/hooks/use-account-filter";
+import { gmailMutationQueue } from "@/lib/gmail-mutation-queue";
 import { TAB_ID } from "@/lib/tab-id";
 import {
   useThreadCache,
@@ -636,14 +637,21 @@ export function useMarkRead() {
       id,
       isRead,
       accountEmail,
+      threadId,
     }: {
       id: string;
       isRead: boolean;
       accountEmail?: string;
+      threadId?: string;
     }) =>
-      callAction("mark-read", { id, unread: !isRead, accountEmail }).then(
-        assertActionSuccess,
-      ),
+      // Buffer + batch via Gmail messages.batchModify so rapid open/mark-read
+      // (and e-e-e archive) stay snappy without burning quota per keypress.
+      gmailMutationQueue.enqueue("mark-read", {
+        id,
+        threadId,
+        accountEmail,
+        flag: isRead,
+      }),
     onMutate: async ({ id, isRead }) => {
       await qc.cancelQueries({ queryKey: ["emails"] });
       const previous = qc.getQueriesData<InfiniteEmails>({
@@ -667,22 +675,9 @@ export function useMarkRead() {
 
 export function useMarkThreadRead() {
   const qc = useQueryClient();
-  // Per-thread pending entries — using a Map so concurrent mutations for different
-  // threads don't overwrite each other's pending entries.
-  const pendingByThread = useRef(
-    new Map<string, { id: string; accountEmail?: string }[]>(),
-  );
   return useMutation({
-    mutationFn: async (threadId: string) => {
-      const entries = pendingByThread.current.get(threadId) ?? [];
-      pendingByThread.current.delete(threadId);
-      if (entries.length > 0) {
-        await callAction("mark-thread-read", {
-          threadId,
-          accountEmail: entries[0]?.accountEmail,
-        }).then(assertActionSuccess);
-      }
-    },
+    mutationFn: (threadId: string) =>
+      callAction("mark-thread-read", { threadId }).then(assertActionSuccess),
     onMutate: async (threadId) => {
       await qc.cancelQueries({ queryKey: ["emails"] });
       const previous = qc.getQueriesData<InfiniteEmails>({
@@ -691,11 +686,9 @@ export function useMarkThreadRead() {
       // Capture unread entries BEFORE optimistic update
       const allEmails =
         previous.flatMap(([, data]) => flattenInfiniteEmails(data)) ?? [];
-      const unreadEntries = allEmails
+      const unreadIds = allEmails
         .filter((e) => (e.threadId || e.id) === threadId && !e.isRead)
-        .map((e) => ({ id: e.id, accountEmail: e.accountEmail }));
-      pendingByThread.current.set(threadId, unreadEntries);
-      const unreadIds = unreadEntries.map((e) => e.id);
+        .map((e) => e.id);
       const previousThread = getCachedThread(threadId);
       // Set overrides so refetches don't revert read state
       for (const id of unreadIds) {
@@ -737,17 +730,19 @@ export function useToggleStar() {
       id,
       isStarred,
       accountEmail,
+      threadId,
     }: {
       id: string;
       isStarred: boolean;
       accountEmail?: string;
       threadId?: string;
     }) =>
-      callAction("star-email", {
+      gmailMutationQueue.enqueue("star", {
         id,
-        unstar: !isStarred,
+        threadId,
         accountEmail,
-      }).then(assertActionSuccess),
+        flag: isStarred,
+      }),
     onMutate: async ({ id, isStarred, threadId }) => {
       await qc.cancelQueries({ queryKey: ["emails"] });
       const previous = qc.getQueriesData<InfiniteEmails>({
@@ -802,12 +797,12 @@ export function useArchiveEmail() {
       removeLabel?: string;
       threadId?: string;
     }) =>
-      callAction("archive-email", {
+      gmailMutationQueue.enqueue("archive", {
         id,
         accountEmail,
         removeLabel,
         threadId,
-      }).then(assertActionSuccess),
+      }),
     onMutate: async ({
       id,
       threadId: hintedThreadId,
@@ -848,8 +843,13 @@ export function useArchiveEmail() {
 export function useUnarchiveEmail() {
   const qc = useQueryClient();
   return useMutation({
-    mutationFn: (id: string) =>
-      callAction("unarchive-email", { id }).then(assertActionSuccess),
+    mutationFn: (id: string) => {
+      // Undo often lands inside the debounce window — drop the pending
+      // archive so we never send a modify we immediately reverse.
+      const cancelled = gmailMutationQueue.cancel("archive", id);
+      if (cancelled) return Promise.resolve("cancelled-pending-archive");
+      return callAction("unarchive-email", { id }).then(assertActionSuccess);
+    },
     onSuccess: () => qc.invalidateQueries({ queryKey: ["emails"] }),
   });
 }
@@ -924,10 +924,14 @@ export function useBulkArchiveEmails() {
   const t = useT();
   return useMutation({
     mutationFn: ({ targets, removeLabel }: BulkArchiveVars) =>
-      callAction("archive-email", {
-        ...bulkActionArgs(targets),
-        removeLabel,
-      }).then(assertActionSuccess),
+      Promise.all(
+        targets.map((target) =>
+          gmailMutationQueue.enqueue("archive", {
+            ...target,
+            removeLabel,
+          }),
+        ),
+      ).then(() => `Queued archive for ${targets.length} email(s)`),
     onMutate: async ({ targets }: BulkArchiveVars) => {
       await qc.cancelQueries({ queryKey: ["emails"] });
       const previous = qc.getQueriesData<InfiniteEmails>({
@@ -1008,7 +1012,7 @@ export function useBulkTrashEmails() {
   });
 }
 
-/** Bulk star/unstar: one action call, one optimistic override per message. */
+/** Bulk star/unstar: queued + batched Gmail modify, one optimistic override. */
 export function useBulkToggleStar() {
   const qc = useQueryClient();
   return useMutation({
@@ -1019,10 +1023,14 @@ export function useBulkToggleStar() {
       targets: BulkEmailTarget[];
       isStarred: boolean;
     }) =>
-      callAction("star-email", {
-        ...bulkActionArgs(targets),
-        unstar: !isStarred,
-      }).then(assertActionSuccess),
+      Promise.all(
+        targets.map((target) =>
+          gmailMutationQueue.enqueue("star", {
+            ...target,
+            flag: isStarred,
+          }),
+        ),
+      ).then(() => `Queued star for ${targets.length} email(s)`),
     onMutate: async ({ targets, isStarred }) => {
       await qc.cancelQueries({ queryKey: ["emails"] });
       const previous = qc.getQueriesData<InfiniteEmails>({
@@ -1045,7 +1053,7 @@ export function useBulkToggleStar() {
   });
 }
 
-/** Bulk mark read/unread: one action call, one optimistic override per message. */
+/** Bulk mark read/unread: queued + batched Gmail modify, one optimistic override. */
 export function useBulkMarkRead() {
   const qc = useQueryClient();
   return useMutation({
@@ -1056,10 +1064,14 @@ export function useBulkMarkRead() {
       targets: BulkEmailTarget[];
       isRead: boolean;
     }) =>
-      callAction("mark-read", {
-        ...bulkActionArgs(targets),
-        unread: !isRead,
-      }).then(assertActionSuccess),
+      Promise.all(
+        targets.map((target) =>
+          gmailMutationQueue.enqueue("mark-read", {
+            ...target,
+            flag: isRead,
+          }),
+        ),
+      ).then(() => `Queued mark-read for ${targets.length} email(s)`),
     onMutate: async ({ targets, isRead }) => {
       await qc.cancelQueries({ queryKey: ["emails"] });
       const previous = qc.getQueriesData<InfiniteEmails>({

package/corpus/templates/mail/app/lib/gmail-mutation-queue.ts

@@ -0,0 +1,325 @@
+/**
+ * Debounced client-side buffer for Gmail state mutations.
+ *
+ * Rapid archive / mark-read / star must feel instant (optimistic UI), but
+ * each keypress hitting Gmail as its own modify burns quota. We keep the
+ * React Query optimistic path, then coalesce outbound calls into the
+ * existing bulk actions (one messages.batchModify per account).
+ */
+
+import { callAction } from "@agent-native/core/client";
+
+export type GmailMutationKind = "archive" | "mark-read" | "star";
+
+export interface GmailMutationTarget {
+  id: string;
+  threadId?: string;
+  accountEmail?: string;
+  /** Archive-from-label view: also remove this label. */
+  removeLabel?: string;
+  /** mark-read: true = read, false = unread. star: true = star. */
+  flag?: boolean;
+}
+
+interface QueuedMutation extends GmailMutationTarget {
+  kind: GmailMutationKind;
+  resolve: () => void;
+  reject: (error: unknown) => void;
+}
+
+const DEFAULT_DEBOUNCE_MS = 280;
+const MAX_WAIT_MS = 1200;
+
+type FlushListener = (info: {
+  kind: GmailMutationKind;
+  count: number;
+  error?: unknown;
+}) => void;
+
+function targetKey(
+  kind: GmailMutationKind,
+  target: GmailMutationTarget,
+): string {
+  // Coalesce by message id + kind + removeLabel so re-pressing `e` on the
+  // same thread replaces the pending op instead of stacking duplicates.
+  return `${kind}:${target.id}:${target.removeLabel ?? ""}:${target.flag ?? ""}`;
+}
+
+function bulkArgs(targets: GmailMutationTarget[]) {
+  return {
+    id: targets.map((t) => t.id).join(","),
+    threadIds: targets.map((t) => t.threadId ?? "").join(","),
+    accountEmails: targets.map((t) => t.accountEmail ?? "").join(","),
+  };
+}
+
+function assertActionSuccess<T>(result: T): T {
+  if (
+    typeof result === "string" &&
+    (result.startsWith("Error:") || /failed/i.test(result.slice(0, 40)))
+  ) {
+    throw new Error(result);
+  }
+  if (
+    result &&
+    typeof result === "object" &&
+    "ok" in result &&
+    (result as { ok?: boolean }).ok === false
+  ) {
+    const message =
+      "error" in result &&
+      typeof (result as { error?: unknown }).error === "string"
+        ? (result as { error: string }).error
+        : "Action failed";
+    throw new Error(message);
+  }
+  return result;
+}
+
+class GmailMutationQueue {
+  private pending = new Map<string, QueuedMutation>();
+  private debounceTimer: ReturnType<typeof setTimeout> | null = null;
+  private maxWaitTimer: ReturnType<typeof setTimeout> | null = null;
+  private flushing: Promise<void> | null = null;
+  private firstEnqueueAt = 0;
+  private debounceMs = DEFAULT_DEBOUNCE_MS;
+  private listeners = new Set<FlushListener>();
+  private installedUnload = false;
+
+  /** Test-only: override debounce. */
+  setDebounceMs(ms: number) {
+    this.debounceMs = ms;
+  }
+
+  onFlush(listener: FlushListener): () => void {
+    this.listeners.add(listener);
+    return () => this.listeners.delete(listener);
+  }
+
+  /** Pending op count — useful in tests. */
+  size(): number {
+    return this.pending.size;
+  }
+
+  enqueue(kind: GmailMutationKind, target: GmailMutationTarget): Promise<void> {
+    this.ensureUnloadHook();
+    const key = targetKey(kind, target);
+    return new Promise<void>((resolve, reject) => {
+      const existing = this.pending.get(key);
+      if (existing) {
+        // Drop the superseded waiter as success — the newer op owns the flush.
+        existing.resolve();
+      }
+      this.pending.set(key, { kind, ...target, resolve, reject });
+      if (!this.firstEnqueueAt) this.firstEnqueueAt = Date.now();
+      this.scheduleFlush();
+    });
+  }
+
+  /**
+   * Drop a pending op without sending it (e.g. user undid an archive before
+   * the debounce window closed). Resolves waiters so callers don't hang.
+   */
+  cancel(kind: GmailMutationKind, id: string, removeLabel?: string): boolean {
+    let cancelled = false;
+    for (const [key, op] of this.pending) {
+      if (
+        op.kind === kind &&
+        op.id === id &&
+        (removeLabel === undefined || op.removeLabel === removeLabel)
+      ) {
+        this.pending.delete(key);
+        op.resolve();
+        cancelled = true;
+      }
+    }
+    if (this.pending.size === 0) this.clearTimers();
+    return cancelled;
+  }
+
+  /** Force-send everything now. Safe to call while a flush is already running. */
+  async flush(): Promise<void> {
+    this.clearTimers();
+    if (this.flushing) {
+      await this.flushing;
+      if (this.pending.size > 0) await this.flush();
+      return;
+    }
+    if (this.pending.size === 0) return;
+
+    const batch = [...this.pending.values()];
+    this.pending.clear();
+    this.firstEnqueueAt = 0;
+
+    this.flushing = this.runFlush(batch).finally(() => {
+      this.flushing = null;
+    });
+    await this.flushing;
+  }
+
+  private scheduleFlush() {
+    if (this.debounceTimer) clearTimeout(this.debounceTimer);
+    this.debounceTimer = setTimeout(() => {
+      void this.flush();
+    }, this.debounceMs);
+
+    if (!this.maxWaitTimer && this.firstEnqueueAt) {
+      const remaining = Math.max(
+        0,
+        MAX_WAIT_MS - (Date.now() - this.firstEnqueueAt),
+      );
+      this.maxWaitTimer = setTimeout(() => {
+        void this.flush();
+      }, remaining);
+    }
+  }
+
+  private clearTimers() {
+    if (this.debounceTimer) {
+      clearTimeout(this.debounceTimer);
+      this.debounceTimer = null;
+    }
+    if (this.maxWaitTimer) {
+      clearTimeout(this.maxWaitTimer);
+      this.maxWaitTimer = null;
+    }
+  }
+
+  private async runFlush(batch: QueuedMutation[]): Promise<void> {
+    const byKind = new Map<GmailMutationKind, QueuedMutation[]>();
+    for (const op of batch) {
+      const list = byKind.get(op.kind) ?? [];
+      list.push(op);
+      byKind.set(op.kind, list);
+    }
+
+    for (const [kind, ops] of byKind) {
+      // Group archives that share the same removeLabel so label-view archives
+      // stay correct without blocking the default bulk INBOX path.
+      if (kind === "archive") {
+        const byLabel = new Map<string, QueuedMutation[]>();
+        for (const op of ops) {
+          const labelKey = op.removeLabel ?? "";
+          const list = byLabel.get(labelKey) ?? [];
+          list.push(op);
+          byLabel.set(labelKey, list);
+        }
+        for (const [, group] of byLabel) {
+          await this.flushArchive(group);
+        }
+        continue;
+      }
+
+      if (kind === "mark-read") {
+        const byFlag = new Map<boolean, QueuedMutation[]>();
+        for (const op of ops) {
+          const flag = op.flag !== false;
+          const list = byFlag.get(flag) ?? [];
+          list.push(op);
+          byFlag.set(flag, list);
+        }
+        for (const [isRead, group] of byFlag) {
+          await this.flushMarkRead(group, isRead);
+        }
+        continue;
+      }
+
+      if (kind === "star") {
+        const byFlag = new Map<boolean, QueuedMutation[]>();
+        for (const op of ops) {
+          const flag = op.flag !== false;
+          const list = byFlag.get(flag) ?? [];
+          list.push(op);
+          byFlag.set(flag, list);
+        }
+        for (const [isStarred, group] of byFlag) {
+          await this.flushStar(group, isStarred);
+        }
+      }
+    }
+  }
+
+  private async flushArchive(ops: QueuedMutation[]): Promise<void> {
+    try {
+      await callAction("archive-email", {
+        ...bulkArgs(ops),
+        removeLabel: ops[0]?.removeLabel,
+      }).then(assertActionSuccess);
+      for (const op of ops) op.resolve();
+      this.emit({ kind: "archive", count: ops.length });
+    } catch (error) {
+      for (const op of ops) op.reject(error);
+      this.emit({ kind: "archive", count: ops.length, error });
+    }
+  }
+
+  private async flushMarkRead(
+    ops: QueuedMutation[],
+    isRead: boolean,
+  ): Promise<void> {
+    try {
+      await callAction("mark-read", {
+        ...bulkArgs(ops),
+        unread: !isRead,
+      }).then(assertActionSuccess);
+      for (const op of ops) op.resolve();
+      this.emit({ kind: "mark-read", count: ops.length });
+    } catch (error) {
+      for (const op of ops) op.reject(error);
+      this.emit({ kind: "mark-read", count: ops.length, error });
+    }
+  }
+
+  private async flushStar(
+    ops: QueuedMutation[],
+    isStarred: boolean,
+  ): Promise<void> {
+    try {
+      await callAction("star-email", {
+        ...bulkArgs(ops),
+        unstar: !isStarred,
+      }).then(assertActionSuccess);
+      for (const op of ops) op.resolve();
+      this.emit({ kind: "star", count: ops.length });
+    } catch (error) {
+      for (const op of ops) op.reject(error);
+      this.emit({ kind: "star", count: ops.length, error });
+    }
+  }
+
+  private emit(info: {
+    kind: GmailMutationKind;
+    count: number;
+    error?: unknown;
+  }) {
+    for (const listener of this.listeners) {
+      try {
+        listener(info);
+      } catch {
+        // ignore listener errors
+      }
+    }
+  }
+
+  private ensureUnloadHook() {
+    if (this.installedUnload || typeof window === "undefined") return;
+    this.installedUnload = true;
+    const flushSync = () => {
+      // Best-effort: kick flush; can't reliably await on unload.
+      void this.flush();
+    };
+    window.addEventListener("pagehide", flushSync);
+    window.addEventListener("beforeunload", flushSync);
+  }
+
+  /** Test helper: wipe pending state. */
+  resetForTests() {
+    this.clearTimers();
+    for (const op of this.pending.values()) op.resolve();
+    this.pending.clear();
+    this.firstEnqueueAt = 0;
+    this.flushing = null;
+  }
+}
+
+export const gmailMutationQueue = new GmailMutationQueue();

package/corpus/templates/mail/changelog/2026-07-08-rapid-archive-and-mark-read-now-batch-gmail-updates-so-the-i.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-08
+---
+
+Rapid archive and mark-read now batch Gmail updates so the inbox stays snappy under rate limits

package/corpus/templates/mail/package.json

@@ -80,7 +80,6 @@
     "@types/node": "^24.2.1",
     "@types/react": "catalog:",
     "@types/react-dom": "catalog:",
-    "@typescript/native-preview": "catalog:",
     "@vitejs/plugin-react-swc": "^4.0.0",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
@@ -103,7 +102,8 @@
     "tailwindcss": "catalog:",
     "tiptap-markdown": "^0.9.0",
     "tsx": "^4.20.3",
-    "typescript": "^6.0.3",
+    "typescript": "catalog:",
+    "typescript-7": "catalog:",
     "vaul": "^1.1.2",
     "vite": "catalog:",
     "vitest": "catalog:"

package/corpus/templates/plan/package.json

@@ -81,7 +81,6 @@
     "@types/node": "^24.2.1",
     "@types/react": "catalog:",
     "@types/react-dom": "catalog:",
-    "@typescript/native-preview": "catalog:",
     "@xterm/addon-fit": "^0.11.0",
     "@xterm/addon-web-links": "^0.12.0",
     "@xterm/xterm": "^6.0.0",
@@ -103,7 +102,8 @@
     "tailwind-merge": "^3.5.0",
     "tailwindcss": "catalog:",
     "tsx": "^4.20.3",
-    "typescript": "^6.0.3",
+    "typescript": "catalog:",
+    "typescript-7": "catalog:",
     "vaul": "^1.1.2",
     "vite": "catalog:",
     "vitest": "catalog:"

package/corpus/templates/slides/app/components/editor/ImageDropPromptPopover.tsx

@@ -6,6 +6,12 @@ import { createPortal } from "react-dom";
 import { Button } from "@/components/ui/button";
 import { Textarea } from "@/components/ui/textarea";
 import { toast } from "@/hooks/use-toast";
+import {
+  buildImageDropAgentPayload,
+  readFileAsDataUrl,
+  type HostedImageUploadResult,
+} from "@/lib/image-drop-to-agent";
+import { parseUploadResponse } from "@/lib/upload-response";
 
 const POPOVER_WIDTH = 360;
 const POPOVER_MARGIN = 12;
@@ -24,8 +30,12 @@ interface ImageDropPromptPopoverProps {
  * Popover shown after a user drops an image somewhere on the slides editor
  * that doesn't have a clear target (i.e. not on an image placeholder or
  * existing `<img>`). The popover previews the image, lets the user describe
- * what to do with it, and hands the task off to the agent chat with the image
- * uploaded to Builder.io as a reference URL.
+ * what to do with it, and hands the task off to the agent chat.
+ *
+ * Prefers a hosted CDN URL via `/api/assets/upload` when a file-upload
+ * provider (Builder.io / S3 / …) is configured. When nothing is configured,
+ * falls back to an inline data-URL attachment so the drop still reaches the
+ * agent instead of toasting a 503.
  *
  * Why this exists: dropping image files onto an unclear target previously did
  * one of two unhelpful things — opened the file in a new browser tab (when the
@@ -113,44 +123,51 @@ export default function ImageDropPromptPopover({
     try {
       const form = new FormData();
       form.append("file", file);
-      // Use the slides assets endpoint (which routes through the framework's
-      // uploadFile() provider chain first, then falls back to local disk in
-      // dev). Goes via Builder.io when configured; works without it in dev.
+      // Prefer the hosted provider chain. When none is configured the route
+      // returns 503 — fall back to an inline data URL so the agent still gets
+      // the image (chat already accepts `images` data URLs).
       const res = await fetch(`${appBasePath()}/api/assets/upload`, {
         method: "POST",
         body: form,
       });
-      const data = (await res.json().catch(() => null)) as {
+      const data = await parseUploadResponse<{
         url?: string;
         error?: string;
-      } | null;
-      if (!res.ok || !data?.url) {
-        throw new Error(
-          data?.error ||
-            "Image upload failed. Connect Builder.io from the agent composer model menu, or register a custom provider via registerFileUploadProvider().",
-        );
-      }
+      }>(res, t("raw.imageUploadGenericError"));
+      const upload: HostedImageUploadResult = {
+        ok: res.ok && !!data.url,
+        status: res.status,
+        url: data.url,
+        error: data.error,
+      };
 
-      const userIntent = prompt.trim();
-      const intentLine =
-        userIntent.length > 0
-          ? userIntent
-          : "Use this image on the current slide.";
-      const lines = [intentLine];
-      if (contextHint && contextHint.trim().length > 0) {
-        lines.push(contextHint.trim());
+      let dataUrl: string | undefined;
+      if (!upload.ok) {
+        dataUrl = await readFileAsDataUrl(file);
       }
-      lines.push(
-        `Image URL (already uploaded): ${data.url}`,
-        `Filename: ${file.name}`,
-      );
 
-      sendToAgentChat({
-        message: lines.join("\n\n"),
-        submit: true,
-        referenceImagePaths: [data.url],
+      const payload = buildImageDropAgentPayload({
+        intent: prompt,
+        contextHint,
+        filename: file.name,
+        upload,
+        dataUrl,
       });
 
+      if (payload.kind === "hosted") {
+        sendToAgentChat({
+          message: payload.message,
+          submit: true,
+          referenceImagePaths: payload.referenceImagePaths,
+        });
+      } else {
+        sendToAgentChat({
+          message: payload.message,
+          submit: true,
+          images: payload.images,
+        });
+      }
+
       onClose();
       toast({
         title: t("raw.sentToAgent"),