@agent-native/core 0.90.1 → 0.90.2

package/corpus/templates/clips/app/components/recorder/recorder-engine.ts

@@ -1378,6 +1378,23 @@ export class RecorderEngine {
     };
     this.lastFinalizeMeta = finalizeMeta;
 
+    // Stop camera and mic hardware immediately — privacy-sensitive inputs no
+    // longer needed once the final chunk is flushed. The composite and display
+    // streams are intentionally left alive: the caller holds a compositeStream
+    // reference for an unawaited thumbnail capture in screen+camera mode.
+    // Full stream teardown happens in the finally block below.
+    this.cameraLive = false;
+    this.audioMixSources = [];
+    this.audioMixCtx?.close().catch(() => {});
+    this.audioMixCtx = null;
+    for (const s of [this.cameraStream, this.rawCameraStream, this.micStream]) {
+      s?.getTracks().forEach((t) => {
+        try {
+          t.stop();
+        } catch {}
+      });
+    }
+
     // Drain any legacy in-flight chunk uploads before we either compress or
     // upload. New recordings upload after stop(), but keeping this guard makes
     // retry paths resilient while a release rolls out.
@@ -1929,41 +1946,99 @@ export class RecorderEngine {
     // Keep binary uploads comfortably under Netlify's effective function
     // payload limit. This mirrors the local-file upload path in record.tsx.
     const UPLOAD_SLICE_BYTES = 3 * 1024 * 1024;
+    const PARALLELISM = 4;
     const totalSlices = Math.max(1, Math.ceil(blob.size / UPLOAD_SLICE_BYTES));
 
-    let lastResult: Record<string, unknown> | undefined;
-    for (let i = 0; i < totalSlices; i++) {
-      if (signal?.aborted) {
-        throw signal.reason instanceof Error
-          ? signal.reason
-          : new Error("Upload aborted");
-      }
-
+    const slices = Array.from({ length: totalSlices }, (_, i) => {
       const start = i * UPLOAD_SLICE_BYTES;
       const end = Math.min(start + UPLOAD_SLICE_BYTES, blob.size);
-      const slice = blob.slice(start, end, mimeType);
-      const isFinal = i === totalSlices - 1;
-      const index = this.chunkIndex++;
+      return {
+        index: this.chunkIndex++,
+        slice: blob.slice(start, end, mimeType),
+        isFinal: i === totalSlices - 1,
+      };
+    });
+    const finalSlice = slices[slices.length - 1];
+    const parallelSlices = slices.slice(0, -1);
+
+    const results = new Array<Record<string, unknown> | undefined>(totalSlices);
+    const queue = parallelSlices.slice();
+    const chunkAbort = new AbortController();
+    if (signal?.aborted) {
+      chunkAbort.abort(signal.reason);
+    } else {
+      signal?.addEventListener("abort", () => chunkAbort.abort(signal.reason), {
+        once: true,
+      });
+    }
+    let uploadError: Error | null = null;
+    let completedCount = 0;
+
+    const worker = async () => {
+      while (queue.length > 0) {
+        if (chunkAbort.signal.aborted) break;
+        const item = queue.shift();
+        if (!item) break;
+        const { index, slice } = item;
+        try {
+          results[index] = await this.uploadChunk(slice, index, {
+            isFinal: false,
+            total: totalSlices,
+            mimeType,
+            signal: chunkAbort.signal,
+          });
+          this.opts.onChunk?.({
+            index: completedCount++,
+            bytes: slice.size,
+            total: totalSlices,
+          });
+        } catch (err) {
+          if (chunkAbort.signal.aborted) return;
+          if (!uploadError) {
+            uploadError = err instanceof Error ? err : new Error(String(err));
+            chunkAbort.abort(uploadError);
+          }
+          return;
+        }
+      }
+    };
+
+    await Promise.all(
+      Array.from(
+        { length: Math.min(PARALLELISM, parallelSlices.length) },
+        worker,
+      ),
+    );
+
+    if (uploadError) throw uploadError;
+    if (signal?.aborted) {
+      throw signal.reason instanceof Error
+        ? signal.reason
+        : new Error("Upload aborted");
+    }
 
-      lastResult = await this.uploadChunk(slice, index, {
-        isFinal,
+    results[finalSlice.index] = await this.uploadChunk(
+      finalSlice.slice,
+      finalSlice.index,
+      {
+        isFinal: true,
         total: totalSlices,
         mimeType,
-        durationMs: isFinal ? meta.durationMs : undefined,
-        width: isFinal ? meta.dimensions.width : undefined,
-        height: isFinal ? meta.dimensions.height : undefined,
-        hasAudio: isFinal ? meta.hasAudio : undefined,
-        hasCamera: isFinal ? meta.hasCamera : undefined,
+        durationMs: meta.durationMs,
+        width: meta.dimensions.width,
+        height: meta.dimensions.height,
+        hasAudio: meta.hasAudio,
+        hasCamera: meta.hasCamera,
         signal,
-      });
-      this.opts.onChunk?.({
-        index,
-        bytes: slice.size,
-        total: totalSlices,
-      });
-    }
+      },
+    );
+    this.opts.onChunk?.({
+      index: finalSlice.index,
+      bytes: finalSlice.slice.size,
+      total: totalSlices,
+    });
 
-    return lastResult;
+    return results[finalSlice.index];
   }
 
   private async uploadChunk(
@@ -2021,7 +2096,9 @@ export class RecorderEngine {
           uploadErr.name === "AbortError"
         ) {
           if (extra.isFinal && uploadErr.name !== "AbortError") {
-            const recovered = await this.recoverReadyAfterFinalUploadError();
+            const recovered = await this.recoverReadyAfterFinalUploadError(
+              extra.signal,
+            );
             if (recovered) return recovered;
           }
           throw uploadErr;
@@ -2040,7 +2117,9 @@ export class RecorderEngine {
         if (extra.isFinal && res.status === 504) {
           triedFinalUploadRecovery = true;
           await res.text().catch(() => "");
-          const recovered = await this.recoverReadyAfterFinalUploadError();
+          const recovered = await this.recoverReadyAfterFinalUploadError(
+            extra.signal,
+          );
           if (recovered) return recovered;
           break;
         }
@@ -2075,7 +2154,9 @@ export class RecorderEngine {
         !triedFinalUploadRecovery &&
         this.isFinalUploadRecoveryCandidate(res.status, err)
       ) {
-        const recovered = await this.recoverReadyAfterFinalUploadError();
+        const recovered = await this.recoverReadyAfterFinalUploadError(
+          extra.signal,
+        );
         if (recovered) return recovered;
       }
       trackClipUploadBlockingFailure({
@@ -2153,14 +2234,14 @@ export class RecorderEngine {
     return !/too large|exceeds.*limit|chunk too large/i.test(error.message);
   }
 
-  private async recoverReadyAfterFinalUploadError(): Promise<Record<
-    string,
-    unknown
-  > | null> {
+  private async recoverReadyAfterFinalUploadError(
+    signal?: AbortSignal,
+  ): Promise<Record<string, unknown> | null> {
     return waitForReadyRecordingAfterFinalizeError({
       uploadUrl: this.opts.uploadUrl,
       recordingId: this.opts.recordingId,
       preferAuthenticated: true,
+      signal,
     });
   }
 

package/corpus/templates/clips/app/routes/_app.library._index.tsx

@@ -1,3 +1,8 @@
+import { useT } from "@agent-native/core/client";
+import { Button } from "@agent-native/toolkit/ui/button";
+import { IconPlayerRecord } from "@tabler/icons-react";
+import { NavLink } from "react-router";
+
 import { LibraryGrid } from "@/components/library/library-grid";
 
 const SEO_TITLE =
@@ -18,5 +23,26 @@ export function meta() {
 }
 
 export default function LibraryIndexRoute() {
-  return <LibraryGrid view="library" folderId={null} title="Library" />;
+  const t = useT();
+  return (
+    <LibraryGrid
+      view="library"
+      folderId={null}
+      title="Library"
+      extraActions={
+        <Button
+          className="gap-1.5 bg-primary text-primary-foreground shadow-sm hover:bg-primary/90"
+          size="sm"
+          asChild
+        >
+          <NavLink to="/record" aria-label={t("navigation.newRecording")}>
+            <IconPlayerRecord className="h-4 w-4" />
+            <span className="hidden sm:inline">
+              {t("navigation.newRecording")}
+            </span>
+          </NavLink>
+        </Button>
+      }
+    />
+  );
 }

package/corpus/templates/clips/app/routes/record.tsx

@@ -1357,6 +1357,7 @@ export default function RecordRoute() {
   // upload pipeline so finalize-recording handles it identically.
   // -------------------------------------------------------------------------
   const UPLOAD_CHUNK_BYTES = 3 * 1024 * 1024;
+  const UPLOAD_PARALLELISM = 4;
 
   const probeVideoMetadata = useCallback(
     (
@@ -1602,92 +1603,180 @@ export default function RecordRoute() {
           1,
           Math.ceil(uploadBlob.size / UPLOAD_CHUNK_BYTES),
         );
-        let finalChunkResult: Record<string, unknown> | null = null;
-        for (let i = 0; i < totalChunks; i++) {
-          if (isStale()) throw makeAbortError("Upload cancelled");
+
+        const chunkDescs = Array.from({ length: totalChunks }, (_, i) => {
           const start = i * UPLOAD_CHUNK_BYTES;
           const end = Math.min(start + UPLOAD_CHUNK_BYTES, uploadBlob.size);
-          const slice = uploadBlob.slice(start, end, uploadMimeType);
           const isFinal = i === totalChunks - 1;
-          const chunkUrl = chunkUploadUrl(uploadBase, {
+          return {
             index: i,
-            total: totalChunks,
+            slice: uploadBlob.slice(start, end, uploadMimeType),
             isFinal,
-            mimeType: uploadMimeType,
-            durationMs: isFinal ? meta.durationMs : undefined,
-            width: isFinal ? meta.width : undefined,
-            height: isFinal ? meta.height : undefined,
-            hasAudio: isFinal ? true : undefined,
-            hasCamera: isFinal ? false : undefined,
+            url: chunkUploadUrl(uploadBase, {
+              index: i,
+              total: totalChunks,
+              isFinal,
+              mimeType: uploadMimeType,
+              durationMs: isFinal ? meta.durationMs : undefined,
+              width: isFinal ? meta.width : undefined,
+              height: isFinal ? meta.height : undefined,
+              hasAudio: isFinal ? true : undefined,
+              hasCamera: isFinal ? false : undefined,
+            }),
+          };
+        });
+        const finalChunkDesc = chunkDescs[chunkDescs.length - 1];
+        const parallelChunks = chunkDescs.slice(0, -1);
+
+        const chunkAbort = new AbortController();
+        if (abort.signal.aborted) {
+          chunkAbort.abort(abort.signal.reason);
+        } else {
+          abort.signal.addEventListener(
+            "abort",
+            () => chunkAbort.abort(abort.signal.reason),
+            { once: true },
+          );
+        }
+
+        const finalChunk = { result: null as Record<string, unknown> | null };
+        let uploadError: Error | null = null;
+        const queue = parallelChunks.slice();
+
+        const worker = async () => {
+          while (queue.length > 0) {
+            if (isStale() || chunkAbort.signal.aborted) break;
+            const item = queue.shift();
+            if (!item) break;
+            const { index, slice, url } = item;
+
+            let chunkRes: Response;
+            try {
+              chunkRes = await fetch(url, {
+                method: "POST",
+                headers: { "Content-Type": uploadMimeType },
+                body: await slice.arrayBuffer(),
+                signal: chunkAbort.signal,
+              });
+            } catch (err) {
+              if (chunkAbort.signal.aborted) return;
+              if (!uploadError) {
+                uploadError =
+                  err instanceof Error ? err : new Error(String(err));
+                chunkAbort.abort(uploadError);
+              }
+              return;
+            }
+
+            if (!chunkRes.ok) {
+              const text = await chunkRes.text().catch(() => "");
+              const error = new Error(
+                t("recordRoute.uploadFailedAtChunk", {
+                  chunk: index + 1,
+                  total: totalChunks,
+                  message: text || chunkRes.statusText,
+                }),
+              );
+              (error as Error & { status?: number }).status = chunkRes.status;
+              if (!uploadError) {
+                uploadError = error;
+                chunkAbort.abort(uploadError);
+              }
+              return;
+            }
+            setUploadProgress((index + 1) / totalChunks);
+          }
+        };
+
+        await Promise.all(
+          Array.from(
+            { length: Math.min(UPLOAD_PARALLELISM, parallelChunks.length) },
+            worker,
+          ),
+        );
+
+        if (uploadError) throw uploadError;
+        if (abort.signal.aborted) {
+          const reason = abort.signal.reason;
+          throw reason instanceof Error
+            ? reason
+            : makeAbortError("Upload cancelled");
+        }
+        if (isStale()) throw makeAbortError("Upload cancelled");
+
+        const { index, slice, url } = finalChunkDesc;
+        let chunkRes: Response | null = null;
+        try {
+          chunkRes = await fetch(url, {
+            method: "POST",
+            headers: { "Content-Type": uploadMimeType },
+            body: await slice.arrayBuffer(),
+            signal: abort.signal,
           });
-          let chunkRes: Response;
-          try {
-            chunkRes = await fetch(chunkUrl, {
-              method: "POST",
-              headers: { "Content-Type": uploadMimeType },
-              body: await slice.arrayBuffer(),
+        } catch (err) {
+          if (
+            createdId &&
+            (err as { name?: string } | null)?.name !== "AbortError"
+          ) {
+            const recovered = await waitForReadyRecordingAfterFinalizeError({
+              uploadUrl: uploadBase,
+              recordingId: createdId,
+              preferAuthenticated: true,
               signal: abort.signal,
             });
-          } catch (err) {
-            if (
-              isFinal &&
-              createdId &&
-              (err as { name?: string } | null)?.name !== "AbortError"
-            ) {
-              const recovered = await waitForReadyRecordingAfterFinalizeError({
-                uploadUrl: uploadBase,
-                recordingId: createdId,
-                preferAuthenticated: true,
-              });
-              if (recovered) {
-                finalChunkResult = recovered;
-                break;
-              }
+            if (recovered) {
+              finalChunk.result = recovered;
+            } else {
+              throw err;
             }
+          } else {
             throw err;
           }
-          if (!chunkRes.ok) {
-            const text = await chunkRes.text().catch(() => "");
-            const error = new Error(
-              t("recordRoute.uploadFailedAtChunk", {
-                chunk: i + 1,
-                total: totalChunks,
-                message: text || chunkRes.statusText,
-              }),
-            );
-            (error as Error & { status?: number }).status = chunkRes.status;
-            if (
-              isFinal &&
-              createdId &&
-              chunkRes.status !== 413 &&
-              !isUploadSizeError(error.message)
-            ) {
-              const recovered = await waitForReadyRecordingAfterFinalizeError({
-                uploadUrl: uploadBase,
-                recordingId: createdId,
-                preferAuthenticated: true,
-              });
-              if (recovered) {
-                finalChunkResult = recovered;
-                break;
-              }
+        }
+
+        if (chunkRes && !chunkRes.ok) {
+          const text = await chunkRes.text().catch(() => "");
+          const error = new Error(
+            t("recordRoute.uploadFailedAtChunk", {
+              chunk: index + 1,
+              total: totalChunks,
+              message: text || chunkRes.statusText,
+            }),
+          );
+          (error as Error & { status?: number }).status = chunkRes.status;
+          if (
+            createdId &&
+            chunkRes.status !== 413 &&
+            !isUploadSizeError(error.message)
+          ) {
+            const recovered = await waitForReadyRecordingAfterFinalizeError({
+              uploadUrl: uploadBase,
+              recordingId: createdId,
+              preferAuthenticated: true,
+              signal: abort.signal,
+            });
+            if (recovered) {
+              finalChunk.result = recovered;
+            } else {
+              throw error;
             }
+          } else {
             throw error;
           }
-          if (isFinal) {
-            finalChunkResult =
-              ((await chunkRes.json().catch(() => null)) as Record<
-                string,
-                unknown
-              > | null) ?? null;
-          }
-          setUploadProgress((i + 1) / totalChunks);
+        }
+
+        if (chunkRes?.ok) {
+          finalChunk.result =
+            ((await chunkRes.json().catch(() => null)) as Record<
+              string,
+              unknown
+            > | null) ?? null;
         }
 
         setUiState("complete");
         const waitingForStorage =
-          finalChunkResult?.waitingForStorage === true ||
-          finalChunkResult?.status === "waiting_storage";
+          finalChunk.result?.waitingForStorage === true ||
+          finalChunk.result?.status === "waiting_storage";
         if (waitingForStorage) {
           toast.info(t("recordRoute.videoReadyToUpload"), {
             description: t("recordRoute.connectStorageToFinish"),

package/corpus/templates/clips/server/routes/api/uploads/[recordingId]/abort.post.ts

@@ -75,11 +75,6 @@ export default defineEventHandler(async (event: H3Event) => {
       return { ok: true, recordingId, alreadyFailed: true, chunksCleared: 0 };
     }
 
-    const cleared = await deleteAppStateByPrefix(
-      `recording-chunks-${recordingId}-`,
-    );
-    await deleteResumableSession(recordingId).catch(() => {});
-
     const now = new Date().toISOString();
     await db
       .update(schema.recordings)
@@ -96,6 +91,11 @@ export default defineEventHandler(async (event: H3Event) => {
       failureReason,
       updatedAt: now,
     });
+
+    const cleared = await deleteAppStateByPrefix(
+      `recording-chunks-${recordingId}-`,
+    );
+    await deleteResumableSession(recordingId).catch(() => {});
     await writeAppState("refresh-signal", { ts: Date.now() });
 
     return { ok: true, recordingId, chunksCleared: cleared };

package/corpus/templates/clips/server/routes/api/uploads/[recordingId]/chunk.post.ts

@@ -375,7 +375,11 @@ export default defineEventHandler(async (event: H3Event) => {
 
     // Only persist non-empty chunks. The final sentinel can legitimately be
     // empty — writing a zero-byte chunk would just clutter application_state.
+    // Check for abort/failure before writing so parallel in-flight requests
+    // don't recreate scratch chunk rows after /abort already cleared them.
     if (bytes.byteLength > 0) {
+      const failedBeforeWrite = await stopIfUploadFailed();
+      if (failedBeforeWrite) return failedBeforeWrite;
       // Pad index to 6 digits so string-sort order matches numeric order if the
       // finalize path ever sorts lexically. (finalize also parses back to a number.)
       const paddedIndex = String(index).padStart(6, "0");
@@ -409,15 +413,25 @@ export default defineEventHandler(async (event: H3Event) => {
 
     // Update upload progress (best-effort). If total is unknown we treat it as
     // indeterminate and keep progress at its last known value.
+    // Chunks may arrive out of order when uploaded in parallel, so take the
+    // max of the current persisted value and the incoming index to keep
+    // progress monotonically non-decreasing.
     if (total > 0) {
       const failedResponse = await stopIfUploadFailed();
       if (failedResponse) return failedResponse;
-      const progress = Math.min(100, Math.round(((index + 1) / total) * 100));
+      const chunksReceived = Math.max(
+        stateNumber(uploadState, "chunksReceived") ?? 0,
+        index + 1,
+      );
+      const progress = Math.max(
+        stateNumber(uploadState, "progress") ?? 0,
+        Math.min(100, Math.round((chunksReceived / total) * 100)),
+      );
       await writeAppState(`recording-upload-${recordingId}`, {
         recordingId,
         status: isFinal ? "processing" : "uploading",
         progress,
-        chunksReceived: index + 1,
+        chunksReceived,
         totalChunks: total,
         ...(expectedDataChunks !== undefined
           ? {
@@ -449,7 +463,10 @@ export default defineEventHandler(async (event: H3Event) => {
       await writeAppState(`recording-upload-${recordingId}`, {
         recordingId,
         status: isFinal ? "processing" : "uploading",
-        chunksReceived: index + 1,
+        chunksReceived: Math.max(
+          stateNumber(uploadState, "chunksReceived") ?? 0,
+          index + 1,
+        ),
         ...(expectedDataChunks !== undefined
           ? {
               expectedDataChunks,

package/corpus/templates/clips/shared/finalize-recovery.ts

@@ -26,8 +26,26 @@ const DEFAULT_READY_RECOVERY_TIMEOUT_MS = 90_000;
 const DEFAULT_READY_RECOVERY_INTERVAL_MS = 3_000;
 const DEFAULT_READY_RECOVERY_FETCH_TIMEOUT_MS = 2_000;
 
-function sleep(ms: number): Promise<void> {
-  return new Promise((resolve) => setTimeout(resolve, ms));
+function sleep(ms: number, signal?: AbortSignal): Promise<void> {
+  return new Promise((resolve, reject) => {
+    if (signal?.aborted) {
+      reject(
+        signal.reason instanceof Error ? signal.reason : new Error("Aborted"),
+      );
+      return;
+    }
+    const timer = setTimeout(resolve, ms);
+    signal?.addEventListener(
+      "abort",
+      () => {
+        clearTimeout(timer);
+        reject(
+          signal.reason instanceof Error ? signal.reason : new Error("Aborted"),
+        );
+      },
+      { once: true },
+    );
+  });
 }
 
 function absoluteUploadUrl(uploadUrl: string): URL {
@@ -157,9 +175,10 @@ export async function waitForReadyRecordingAfterFinalizeError(args: {
   timeoutMs?: number;
   intervalMs?: number;
   fetchTimeoutMs?: number;
+  signal?: AbortSignal;
 }): Promise<RecoveredReadyRecording | null> {
   const fetchImpl = args.fetchImpl ?? fetch;
-  const sleepImpl = args.sleepImpl ?? sleep;
+  const sleepImpl = args.sleepImpl ?? ((ms) => sleep(ms, args.signal));
   const timeoutMs = Math.max(
     1,
     args.timeoutMs ?? DEFAULT_READY_RECOVERY_TIMEOUT_MS,
@@ -182,6 +201,7 @@ export async function waitForReadyRecordingAfterFinalizeError(args: {
   }
 
   for (let attempt = 0; attempt < attempts; attempt += 1) {
+    if (args.signal?.aborted) return null;
     const urls = authenticatedUrl
       ? [
           { url: authenticatedUrl, authenticated: true },