@agent-native/core 0.120.2 → 0.120.3

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

@@ -579,13 +579,13 @@ export default function ShareRoute() {
 
   usePlayerShortcuts({ playerRef });
 
+  const [trackedVideoEl, setTrackedVideoEl] = useState<HTMLVideoElement | null>(
+    null,
+  );
+
   const tracking = useViewTracking({
     recordingId: shareId ?? "",
-    videoRef: {
-      get current() {
-        return playerRef.current?.video ?? null;
-      },
-    } as any,
+    videoEl: trackedVideoEl,
     durationMs: recording?.durationMs ?? 0,
     trackOpenWithoutVideo: isLoomEmbedBacked,
   });
@@ -961,6 +961,7 @@ export default function ShareRoute() {
           <div className="aspect-video w-full lg:min-h-0 lg:flex-1 lg:aspect-auto">
             <VideoPlayer
               ref={playerRef}
+              onVideoElementChange={setTrackedVideoEl}
               recordingId={recording.id}
               videoUrl={recording.videoUrl}
               videoFormat={recording.videoFormat}

package/corpus/templates/clips/changelog/2026-07-24-borderless-secondary-surfaces.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-24
+---
+
+Secondary controls and dashboard surfaces now use quieter borderless styling.

package/corpus/templates/clips/changelog/2026-07-24-sidebar-footer-controls-follow-a-consistent-order.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-24
+---
+
+Sidebar utility controls now follow a consistent footer order.

package/corpus/templates/clips/server/plugins/db.ts

@@ -1261,16 +1261,6 @@ async function sweepOrphanedRecordingChunks(): Promise<void> {
   }
 }
 
-function rowNumber(value: unknown): number {
-  if (typeof value === "number" && Number.isFinite(value)) return value;
-  if (typeof value === "bigint") return Number(value);
-  if (typeof value === "string") {
-    const parsed = Number(value);
-    return Number.isFinite(parsed) ? parsed : 0;
-  }
-  return 0;
-}
-
 /**
  * Sweep orphaned resumable upload sessions out of `application_state`.
  *
@@ -1287,6 +1277,8 @@ function rowNumber(value: unknown): number {
 async function sweepOrphanedResumableSessions(): Promise<void> {
   const exec = getDbExec();
   const pg = isPostgres();
+  const SWEEP_BATCH = 500;
+  const IN_CHUNK = 200;
 
   let sessionRows: Array<{
     session_id?: unknown;
@@ -1295,7 +1287,7 @@ async function sweepOrphanedResumableSessions(): Promise<void> {
   }> = [];
   try {
     const probe = await exec.execute({
-      sql: `SELECT session_id, key, updated_at FROM application_state WHERE key LIKE 'resumable-session-%'`,
+      sql: `SELECT session_id, key, updated_at FROM application_state WHERE key LIKE 'resumable-session-%' ORDER BY updated_at ASC LIMIT ${SWEEP_BATCH}`,
       args: [],
     });
     sessionRows =
@@ -1326,8 +1318,15 @@ async function sweepOrphanedResumableSessions(): Promise<void> {
   const staleInProgressIso = new Date(
     Date.now() - 24 * 60 * 60 * 1000,
   ).toISOString();
-  let totalDeleted = 0;
 
+  // Parse candidate rows and collect the referenced recording ids so they can
+  // be resolved in a few batched lookups instead of one query per session.
+  const candidates: Array<{
+    key: string;
+    recordingId: string;
+    sessionUpdatedAt: string;
+  }> = [];
+  const recordingIds = new Set<string>();
   for (const row of sessionRows) {
     const key = typeof row.key === "string" ? row.key : "";
     if (!key.startsWith(prefix)) continue;
@@ -1343,78 +1342,124 @@ async function sweepOrphanedResumableSessions(): Promise<void> {
       Number.isFinite(sessionUpdatedAtMs) && sessionUpdatedAtMs > 0
         ? new Date(sessionUpdatedAtMs).toISOString()
         : "";
+    candidates.push({ key, recordingId, sessionUpdatedAt });
+    recordingIds.add(recordingId);
+  }
+  if (candidates.length === 0) return;
 
-    let shouldSweep = false;
+  // Resolve every referenced recording in chunked `IN (...)` lookups.
+  const recordingById = new Map<
+    string,
+    { status?: string; updatedAt?: string }
+  >();
+  const idList = [...recordingIds];
+  for (let i = 0; i < idList.length; i += IN_CHUNK) {
+    const chunk = idList.slice(i, i + IN_CHUNK);
+    const placeholders = chunk
+      .map((_, j) => (pg ? `$${j + 1}` : "?"))
+      .join(", ");
     try {
       const probe = await exec.execute({
-        sql: pg
-          ? `SELECT status, updated_at FROM recordings WHERE id = $1 LIMIT 1`
-          : `SELECT status, updated_at FROM recordings WHERE id = ? LIMIT 1`,
-        args: [recordingId],
+        sql: `SELECT id, status, updated_at FROM recordings WHERE id IN (${placeholders})`,
+        args: chunk,
       });
-      const recording = (
-        probe.rows as Array<{ status?: string; updated_at?: string }>
-      )[0];
-      if (!recording) {
-        shouldSweep = true;
-      } else if (
-        (recording.status === "ready" || recording.status === "failed") &&
-        (recording.updated_at ?? "") < oneHourAgoIso
-      ) {
-        shouldSweep = true;
-      } else if (
-        (recording.status === "uploading" ||
-          recording.status === "processing") &&
-        (sessionUpdatedAt || recording.updated_at || "") < staleInProgressIso
-      ) {
-        try {
-          await exec.execute({
-            sql: pg
-              ? `UPDATE recordings SET status = 'failed', failure_reason = $1, updated_at = $2 WHERE id = $3 AND status = $4`
-              : `UPDATE recordings SET status = 'failed', failure_reason = ?, updated_at = ? WHERE id = ? AND status = ?`,
-            args: [
-              "Upload did not finish before the resumable upload cleanup window.",
-              new Date().toISOString(),
-              recordingId,
-              recording.status,
-            ],
+      for (const rec of probe.rows as Array<{
+        id?: string;
+        status?: string;
+        updated_at?: string;
+      }>) {
+        if (typeof rec.id === "string") {
+          recordingById.set(rec.id, {
+            status: rec.status,
+            updatedAt: rec.updated_at,
           });
-        } catch (err) {
-          console.warn(
-            "[db] resumable-session sweep: stale upload mark-failed failed",
-            {
-              recordingId,
-              status: recording.status,
-              err: (err as Error)?.message ?? err,
-            },
-          );
         }
-        shouldSweep = true;
       }
     } catch (err) {
-      console.warn("[db] resumable-session sweep: recording probe failed", {
-        recordingId,
-        err: (err as Error)?.message ?? err,
-      });
+      console.warn(
+        "[db] resumable-session sweep: recordings batch probe failed",
+        (err as Error)?.message ?? err,
+      );
+      return;
+    }
+  }
+
+  // Decide sweeps in memory, then mark stale uploads failed and batch-delete.
+  const keysToDelete = new Set<string>();
+  const staleIdsByStatus = new Map<string, Set<string>>();
+  for (const candidate of candidates) {
+    const recording = recordingById.get(candidate.recordingId);
+    if (!recording) {
+      keysToDelete.add(candidate.key);
       continue;
     }
+    const status = recording.status;
+    if (
+      (status === "ready" || status === "failed") &&
+      (recording.updatedAt ?? "") < oneHourAgoIso
+    ) {
+      keysToDelete.add(candidate.key);
+    } else if (
+      (status === "uploading" || status === "processing") &&
+      (candidate.sessionUpdatedAt || recording.updatedAt || "") <
+        staleInProgressIso
+    ) {
+      const bucket = staleIdsByStatus.get(status) ?? new Set<string>();
+      bucket.add(candidate.recordingId);
+      staleIdsByStatus.set(status, bucket);
+      keysToDelete.add(candidate.key);
+    }
+  }
 
-    if (!shouldSweep) continue;
+  // Mark stale in-progress uploads failed, one chunked `IN (...)` update per
+  // status. The `status = ?` guard keeps a recording that concurrently
+  // advanced out of that status from being clobbered back to failed.
+  const staleReason =
+    "Upload did not finish before the resumable upload cleanup window.";
+  for (const [status, idSet] of staleIdsByStatus) {
+    const ids = [...idSet];
+    for (let i = 0; i < ids.length; i += IN_CHUNK) {
+      const chunk = ids.slice(i, i + IN_CHUNK);
+      const idPlaceholders = chunk
+        .map((_, j) => (pg ? `$${j + 3}` : "?"))
+        .join(", ");
+      const statusPlaceholder = pg ? `$${chunk.length + 3}` : "?";
+      try {
+        await exec.execute({
+          sql: `UPDATE recordings SET status = 'failed', failure_reason = ${pg ? "$1" : "?"}, updated_at = ${pg ? "$2" : "?"} WHERE id IN (${idPlaceholders}) AND status = ${statusPlaceholder}`,
+          args: [staleReason, new Date().toISOString(), ...chunk, status],
+        });
+      } catch (err) {
+        console.warn(
+          "[db] resumable-session sweep: stale upload mark-failed failed",
+          {
+            status,
+            recordingIds: chunk,
+            err: (err as Error)?.message ?? err,
+          },
+        );
+      }
+    }
+  }
 
+  let totalDeleted = 0;
+  const deleteKeys = [...keysToDelete];
+  for (let i = 0; i < deleteKeys.length; i += IN_CHUNK) {
+    const chunk = deleteKeys.slice(i, i + IN_CHUNK);
+    const placeholders = chunk
+      .map((_, j) => (pg ? `$${j + 1}` : "?"))
+      .join(", ");
     try {
       await exec.execute({
-        sql: pg
-          ? `DELETE FROM application_state WHERE session_id = $1 AND key = $2`
-          : `DELETE FROM application_state WHERE session_id = ? AND key = ?`,
-        args: [String(row.session_id ?? ""), key],
+        sql: `DELETE FROM application_state WHERE key IN (${placeholders})`,
+        args: chunk,
       });
-      totalDeleted += 1;
+      totalDeleted += chunk.length;
     } catch (err) {
-      console.warn("[db] resumable-session sweep: delete failed", {
-        key,
-        updatedAt: rowNumber(row.updated_at),
-        err: (err as Error)?.message ?? err,
-      });
+      console.warn(
+        "[db] resumable-session sweep: batch delete failed",
+        (err as Error)?.message ?? err,
+      );
     }
   }
 

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

@@ -7,9 +7,10 @@ import {
   useActionMutation,
   useActionQuery,
 } from "@agent-native/core/client/hooks";
-import { useT } from "@agent-native/core/client/i18n";
+import { LanguagePicker, useT } from "@agent-native/core/client/i18n";
 import { OrgSwitcher } from "@agent-native/core/client/org";
 import { FeedbackButton } from "@agent-native/core/client/ui";
+import { SidebarFooterActions } from "@agent-native/toolkit/app-shell";
 import {
   closestCenter,
   DndContext,
@@ -1278,6 +1279,53 @@ export function DocumentSidebar({
     </Link>
   );
 
+  const collapseButton = (
+    <Tooltip>
+      <TooltipTrigger asChild>
+        <button
+          type="button"
+          aria-label={collapsed ? t("sidebar.expand") : t("sidebar.collapse")}
+          className="flex size-8 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground"
+          onClick={onToggleCollapsed}
+        >
+          {collapsed ? (
+            <IconLayoutSidebarLeftExpand size={16} />
+          ) : (
+            <IconLayoutSidebarLeftCollapse size={16} />
+          )}
+        </button>
+      </TooltipTrigger>
+      <TooltipContent side="right">
+        {collapsed ? t("sidebar.expand") : t("sidebar.collapse")}
+      </TooltipContent>
+    </Tooltip>
+  );
+  const searchButton = (
+    <Tooltip>
+      <TooltipTrigger asChild>
+        <button
+          type="button"
+          aria-label={t("sidebar.search")}
+          className="flex size-8 items-center justify-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground"
+          onClick={() => setIsSearching((value) => !value)}
+        >
+          <IconSearch size={16} />
+        </button>
+      </TooltipTrigger>
+      <TooltipContent side="right">{t("sidebar.search")}</TooltipContent>
+    </Tooltip>
+  );
+  const translateButton = (
+    <LanguagePicker variant="ghost-icon" label={t("settings.languageLabel")} />
+  );
+  const feedbackButton = (
+    <FeedbackButton
+      variant={collapsed ? "icon" : "sidebar"}
+      side="right"
+      className={collapsed ? "size-8" : "h-8 min-w-0"}
+    />
+  );
+
   const renderAgentNavButton = () => (
     <Link
       to="/agent"
@@ -1832,17 +1880,6 @@ export function DocumentSidebar({
   if (collapsed) {
     return (
       <div className="agent-layout-left-drawer flex h-full w-12 flex-col items-center gap-1 border-e border-border bg-sidebar py-3 transition-[width] duration-200 ease-out">
-        <Tooltip>
-          <TooltipTrigger asChild>
-            <button
-              className="w-10 h-10 flex items-center justify-center rounded-lg hover:bg-accent text-muted-foreground hover:text-foreground"
-              onClick={onToggleCollapsed}
-            >
-              <IconLayoutSidebarLeftExpand size={18} />
-            </button>
-          </TooltipTrigger>
-          <TooltipContent>{t("sidebar.expand")}</TooltipContent>
-        </Tooltip>
         {renderCollapsedNewButton()}
         <Tooltip>
           <TooltipTrigger asChild>
@@ -1876,6 +1913,13 @@ export function DocumentSidebar({
           </TooltipTrigger>
           <TooltipContent>{t("navigation.settings")}</TooltipContent>
         </Tooltip>
+        <SidebarFooterActions
+          collapsed
+          feedback={feedbackButton}
+          translate={translateButton}
+          search={searchButton}
+          collapse={collapseButton}
+        />
       </div>
     );
   }
@@ -1908,30 +1952,6 @@ export function DocumentSidebar({
             Content
           </span>
         </div>
-        <div className="flex items-center gap-0.5">
-          <Tooltip>
-            <TooltipTrigger asChild>
-              <button
-                className="w-9 h-9 flex items-center justify-center rounded-lg hover:bg-accent text-muted-foreground hover:text-foreground"
-                onClick={() => setIsSearching(!isSearching)}
-              >
-                <IconSearch size={16} />
-              </button>
-            </TooltipTrigger>
-            <TooltipContent>{t("sidebar.search")}</TooltipContent>
-          </Tooltip>
-          <Tooltip>
-            <TooltipTrigger asChild>
-              <button
-                className="w-9 h-9 flex items-center justify-center rounded-lg hover:bg-accent text-muted-foreground hover:text-foreground"
-                onClick={onToggleCollapsed}
-              >
-                <IconLayoutSidebarLeftCollapse size={16} />
-              </button>
-            </TooltipTrigger>
-            <TooltipContent>{t("sidebar.collapse")}</TooltipContent>
-          </Tooltip>
-        </div>
       </div>
 
       {/* Search */}
@@ -2098,13 +2118,17 @@ export function DocumentSidebar({
       {/* Footer */}
       <div className="shrink-0 space-y-2 px-3 py-2">
         {isCodeMode ? <DevDatabaseLink /> : null}
-        <div className="flex items-center justify-end gap-1">
-          <FeedbackButton className="h-8 min-w-0 flex-1 gap-2 rounded-md px-2 py-0" />
-          <div className="flex shrink-0 items-center gap-0.5">
-            <NotionButton />
-            <ThemeToggle />
-          </div>
+        <div className="flex justify-end gap-0.5">
+          <NotionButton />
+          <ThemeToggle />
         </div>
+        <SidebarFooterActions
+          feedback={feedbackButton}
+          translate={translateButton}
+          search={searchButton}
+          collapse={collapseButton}
+          className="px-0 py-0"
+        />
       </div>
 
       {/* Resize handle */}

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

@@ -80,7 +80,7 @@
   --accent: 0 0% 18%;
   --accent-foreground: 0 0% 90%;
 
-  --destructive: 0 84% 60%;
+  --destructive: 0 91% 71%;
   --destructive-foreground: 0 0% 100%;
 
   --border: 0 0% 24%;

package/corpus/templates/content/changelog/2026-07-24-borderless-secondary-surfaces.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-24
+---
+
+Secondary controls and dashboard surfaces now use quieter borderless styling.

package/corpus/templates/content/changelog/2026-07-24-sidebar-footer-controls-follow-a-consistent-order.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-24
+---
+
+Sidebar utility controls now follow a consistent footer order.

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

@@ -1,8 +1,10 @@
 import { appPath } from "@agent-native/core/client/api-path";
 import { DevDatabaseLink } from "@agent-native/core/client/db-admin";
-import { useT } from "@agent-native/core/client/i18n";
+import { LanguagePicker, useT } from "@agent-native/core/client/i18n";
+import { openCommandMenu } from "@agent-native/core/client/navigation";
 import { OrgSwitcher } from "@agent-native/core/client/org";
 import { FeedbackButton } from "@agent-native/core/client/ui";
+import { SidebarFooterActions } from "@agent-native/toolkit/app-shell";
 import {
   IconPencil,
   IconTemplate,
@@ -11,6 +13,7 @@ import {
   IconSettings,
   IconLayoutSidebarLeftCollapse,
   IconLayoutSidebarLeftExpand,
+  IconSearch,
 } from "@tabler/icons-react";
 import { useEffect, useState } from "react";
 import { Link, useLocation } from "react-router";
@@ -61,6 +64,59 @@ export function Sidebar() {
     }
   }, [collapsed]);
 
+  const collapseButton = (
+    <Tooltip delayDuration={0}>
+      <TooltipTrigger asChild>
+        <button
+          type="button"
+          onClick={() => setCollapsed((value) => !value)}
+          className="flex size-8 items-center justify-center rounded-md text-muted-foreground hover:bg-sidebar-accent/50 hover:text-foreground"
+          aria-label={
+            collapsed
+              ? t("navigation.expandSidebar")
+              : t("navigation.collapseSidebar")
+          }
+        >
+          {collapsed ? (
+            <IconLayoutSidebarLeftExpand className="h-4 w-4 rtl:-scale-x-100" />
+          ) : (
+            <IconLayoutSidebarLeftCollapse className="h-4 w-4 rtl:-scale-x-100" />
+          )}
+        </button>
+      </TooltipTrigger>
+      <TooltipContent side="right">
+        {collapsed
+          ? t("navigation.expandSidebar")
+          : t("navigation.collapseSidebar")}
+      </TooltipContent>
+    </Tooltip>
+  );
+  const searchButton = (
+    <Tooltip delayDuration={0}>
+      <TooltipTrigger asChild>
+        <button
+          type="button"
+          onClick={openCommandMenu}
+          className="flex size-8 items-center justify-center rounded-md text-muted-foreground hover:bg-sidebar-accent/50 hover:text-foreground"
+          aria-label={t("root.commandSearch")}
+        >
+          <IconSearch className="h-4 w-4" />
+        </button>
+      </TooltipTrigger>
+      <TooltipContent side="right">{t("root.commandSearch")}</TooltipContent>
+    </Tooltip>
+  );
+  const translateButton = (
+    <LanguagePicker variant="ghost-icon" label={t("settings.languageLabel")} />
+  );
+  const feedbackButton = (
+    <FeedbackButton
+      variant={collapsed ? "icon" : "sidebar"}
+      side="right"
+      className={collapsed ? "h-8 w-8" : "min-w-0"}
+    />
+  );
+
   return (
     <aside
       className={cn(
@@ -93,30 +149,6 @@ export function Sidebar() {
             </span>
           </div>
         )}
-        <Tooltip delayDuration={0}>
-          <TooltipTrigger asChild>
-            <button
-              onClick={() => setCollapsed((c) => !c)}
-              className="flex h-7 w-7 cursor-pointer items-center justify-center rounded-md text-muted-foreground hover:bg-sidebar-accent/50 hover:text-foreground"
-              aria-label={
-                collapsed
-                  ? t("navigation.expandSidebar")
-                  : t("navigation.collapseSidebar")
-              }
-            >
-              {collapsed ? (
-                <IconLayoutSidebarLeftExpand className="h-4 w-4 rtl:-scale-x-100" />
-              ) : (
-                <IconLayoutSidebarLeftCollapse className="h-4 w-4 rtl:-scale-x-100" />
-              )}
-            </button>
-          </TooltipTrigger>
-          <TooltipContent side="right">
-            {collapsed
-              ? t("navigation.expandSidebar")
-              : t("navigation.collapseSidebar")}
-          </TooltipContent>
-        </Tooltip>
       </div>
 
       <div className="flex min-h-0 flex-1 flex-col overflow-y-auto">
@@ -202,17 +234,20 @@ export function Sidebar() {
               <div className="px-3 py-2">
                 <OrgSwitcher reserveSpace />
               </div>
-
               <div className="px-3 py-2">
                 <DevDatabaseLink />
-                <div className="flex items-center justify-end gap-1">
-                  <FeedbackButton className="min-w-0 flex-1" />
-                  <ThemeToggle className="h-8 w-8 shrink-0" />
-                </div>
+                <ThemeToggle className="h-8 w-8 shrink-0" />
               </div>
             </div>
           )}
         </div>
+        <SidebarFooterActions
+          collapsed={collapsed}
+          feedback={feedbackButton}
+          translate={translateButton}
+          search={searchButton}
+          collapse={collapseButton}
+        />
       </div>
     </aside>
   );

package/corpus/templates/design/app/entry.client.tsx

@@ -1,3 +1,4 @@
+import { captureException } from "@agent-native/core/client/analytics";
 import { appBasePath } from "@agent-native/core/client/api-path";
 import { hydrateRoot } from "react-dom/client";
 import { HydratedRouter } from "react-router/dom";
@@ -16,4 +17,16 @@ if (context) {
   context.basename = routerBasePath;
 }
 
-hydrateRoot(document, <HydratedRouter />);
+hydrateRoot(document, <HydratedRouter />, {
+  onRecoverableError(error, info) {
+    captureException(error, {
+      tags: {
+        source: "react-recoverable-error",
+        kind: "hydration",
+      },
+      extra: {
+        componentStack: info.componentStack?.slice(0, 2_000),
+      },
+    });
+  },
+});

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

@@ -113,7 +113,7 @@
   --muted-foreground: 0 0% 60%;
   --accent: 0 0% 18%;
   --accent-foreground: 0 0% 96%;
-  --destructive: 0 84% 60%;
+  --destructive: 0 91% 71%;
   --destructive-foreground: 0 0% 98%;
   --border: 0 0% 24%;
   --input: 0 0% 24%;

package/corpus/templates/design/changelog/2026-07-24-borderless-secondary-surfaces.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-24
+---
+
+Secondary controls and dashboard surfaces now use quieter borderless styling.

package/corpus/templates/design/changelog/2026-07-24-sidebar-footer-controls-follow-a-consistent-order.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-24
+---
+
+Sidebar utility controls now follow a consistent footer order.

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

@@ -22,7 +22,7 @@
   --muted-foreground: 0 0% 45%;
   --accent: 0 0% 95%;
   --accent-foreground: 0 0% 15%;
-  --destructive: 0 84% 60%;
+  --destructive: 0 91% 71%;
   --destructive-foreground: 0 0% 98%;
   --border: 0 0% 90%;
   --input: 0 0% 90%;

package/corpus/templates/dispatch/changelog/2026-07-24-borderless-secondary-surfaces.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-24
+---
+
+Secondary controls and dashboard surfaces now use quieter borderless styling.

package/corpus/templates/dispatch/changelog/2026-07-24-sidebar-footer-controls-follow-a-consistent-order.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-07-24
+---
+
+Sidebar utility controls now follow a consistent footer order.