@agent-native/core 0.90.1 → 0.90.3

package/corpus/templates/clips/app/components/player/share-dialog.tsx

@@ -7,6 +7,7 @@ import {
 } from "@agent-native/core/client";
 import {
   IconCode,
+  IconChevronDown,
   IconExternalLink,
   IconLink,
   IconMail,
@@ -34,6 +35,11 @@ import {
 } from "@/components/sharing/share-ui";
 import { SlackShareHint } from "@/components/sharing/slack-share-hint";
 import { Button } from "@/components/ui/button";
+import {
+  Collapsible,
+  CollapsibleContent,
+  CollapsibleTrigger,
+} from "@/components/ui/collapsible";
 import { Dialog, DialogContent, DialogTitle } from "@/components/ui/dialog";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
@@ -87,7 +93,6 @@ export function ShareRecordingPopover({
   videoUrl,
   animatedThumbnailUrl,
   isLoomRecording = false,
-  hasPassword = false,
   children,
   open,
   onOpenChange,
@@ -106,7 +111,6 @@ export function ShareRecordingPopover({
           videoUrl={videoUrl}
           animatedThumbnailUrl={animatedThumbnailUrl}
           isLoomRecording={isLoomRecording}
-          hasPassword={hasPassword}
         />
       </PopoverContent>
     </Popover>
@@ -124,7 +128,6 @@ export function ShareRecordingDialog({
   videoUrl,
   animatedThumbnailUrl,
   isLoomRecording = false,
-  hasPassword = false,
   open,
   onOpenChange,
 }: ShareRecordingDialogProps) {
@@ -143,7 +146,6 @@ export function ShareRecordingDialog({
           videoUrl={videoUrl}
           animatedThumbnailUrl={animatedThumbnailUrl}
           isLoomRecording={isLoomRecording}
-          hasPassword={hasPassword}
           reserveCloseButton
         />
       </DialogContent>
@@ -157,7 +159,6 @@ function ShareRecordingContent({
   videoUrl,
   animatedThumbnailUrl,
   isLoomRecording = false,
-  hasPassword = false,
   reserveCloseButton = false,
 }: {
   recordingId: string;
@@ -165,7 +166,6 @@ function ShareRecordingContent({
   videoUrl?: string | null;
   animatedThumbnailUrl?: string | null;
   isLoomRecording?: boolean;
-  hasPassword?: boolean;
   reserveCloseButton?: boolean;
 }) {
   const t = useT();
@@ -230,7 +230,6 @@ function ShareRecordingContent({
             videoUrl={videoUrl}
             animatedThumbnailUrl={animatedThumbnailUrl}
             isLoomRecording={isLoomRecording}
-            hasPassword={hasPassword}
           />
         </TabsContent>
 
@@ -269,7 +268,6 @@ function LinkTab({
   videoUrl,
   animatedThumbnailUrl,
   isLoomRecording: isLoomRecordingProp,
-  hasPassword,
 }: {
   recordingId: string;
   shareUrl: string;
@@ -278,7 +276,6 @@ function LinkTab({
   videoUrl?: string | null;
   animatedThumbnailUrl?: string | null;
   isLoomRecording?: boolean;
-  hasPassword: boolean;
 }) {
   const t = useT();
   const { setResourceVisibility, isPending } = useResourceVisibilityMutation(
@@ -299,6 +296,7 @@ function LinkTab({
   const agentLinkRequestIdRef = useRef(0);
   const [agentContextUrl, setAgentContextUrl] = useState("");
   const [agentLinkError, setAgentLinkError] = useState(false);
+  const [agentShareOpen, setAgentShareOpen] = useState(false);
 
   useEffect(() => {
     createAgentLinkAsyncRef.current = createAgentLink.mutateAsync;
@@ -333,12 +331,21 @@ function LinkTab({
     setAgentLinkError(false);
     if (!sharesLoaded) return;
 
-    void loadAgentContextUrl();
+    if (!isPublic && agentShareOpen) {
+      void loadAgentContextUrl();
+    }
 
     return () => {
       agentLinkRequestIdRef.current += 1;
     };
-  }, [recordingId, visibility, sharesLoaded, loadAgentContextUrl]);
+  }, [
+    agentShareOpen,
+    isPublic,
+    loadAgentContextUrl,
+    recordingId,
+    sharesLoaded,
+    visibility,
+  ]);
 
   const agentShareDisabled =
     isPending || createAgentLink.isPending || !agentContextUrl;
@@ -366,41 +373,62 @@ function LinkTab({
           (and a connect link) instead of leaving it buried in Settings. */}
       {isPublic ? <SlackShareHint canManage={canManage} /> : null}
 
-      <div className="space-y-2">
-        <CopyField
-          label={t("shareDialog.shareWithAgents")}
-          value={agentContextUrl}
-          disabled={agentShareDisabled}
-        />
-        {agentLinkError ? (
-          <div className="flex items-center justify-between gap-2 rounded-md border border-border bg-muted/40 px-3 py-2">
-            <p className="text-xs text-muted-foreground">
-              {t("shareDialog.agentLinkUnavailable")}
-            </p>
+      {!isPublic ? (
+        <Collapsible open={agentShareOpen} onOpenChange={setAgentShareOpen}>
+          <CollapsibleTrigger asChild>
             <Button
               type="button"
               variant="ghost"
-              size="sm"
-              className="h-7"
-              onClick={() => void loadAgentContextUrl()}
-              disabled={createAgentLink.isPending}
+              className="h-auto w-full justify-between px-0 py-1 text-left hover:bg-transparent"
             >
-              {t("shareDialog.retryAgentLink")}
+              <span className="min-w-0">
+                <span className="block text-xs font-medium text-foreground">
+                  {t("shareDialog.shareWithAgents")}
+                </span>
+                <span className="mt-0.5 block text-xs font-normal text-muted-foreground">
+                  {t("shareDialog.agentTokenDescription")}
+                </span>
+              </span>
+              <IconChevronDown
+                className={`h-4 w-4 shrink-0 text-muted-foreground transition-transform ${
+                  agentShareOpen ? "rotate-180" : ""
+                }`}
+                aria-hidden
+              />
             </Button>
-          </div>
-        ) : null}
-      </div>
-
-      <CopyField
-        label={t("shareDialog.copyAgentPrompt")}
-        value={agentPrompt}
-        disabled={agentShareDisabled}
-      />
-
-      {agentContextUrl || hasPassword || !isPublic ? (
-        <p className="text-xs text-muted-foreground">
-          {t("shareDialog.agentTokenDescription")}
-        </p>
+          </CollapsibleTrigger>
+          <CollapsibleContent className="pt-2">
+            <div className="space-y-3 rounded-md border border-border bg-muted/30 p-3">
+              <CopyField
+                label={t("shareDialog.shareWithAgents")}
+                value={agentContextUrl}
+                disabled={agentShareDisabled}
+              />
+              {agentLinkError ? (
+                <div className="flex items-center justify-between gap-2 rounded-md border border-border bg-background px-3 py-2">
+                  <p className="text-xs text-muted-foreground">
+                    {t("shareDialog.agentLinkUnavailable")}
+                  </p>
+                  <Button
+                    type="button"
+                    variant="ghost"
+                    size="sm"
+                    className="h-7"
+                    onClick={() => void loadAgentContextUrl()}
+                    disabled={createAgentLink.isPending}
+                  >
+                    {t("shareDialog.retryAgentLink")}
+                  </Button>
+                </div>
+              ) : null}
+              <CopyField
+                label={t("shareDialog.copyAgentPrompt")}
+                value={agentPrompt}
+                disabled={agentShareDisabled}
+              />
+            </div>
+          </CollapsibleContent>
+        </Collapsible>
       ) : null}
 
       {!isPublic && canManage ? (

package/corpus/templates/clips/app/components/player/video-player.tsx

@@ -464,6 +464,21 @@ export const VideoPlayer = forwardRef<VideoPlayerHandle, VideoPlayerProps>(
       bumpControls();
       setPlayError(null);
 
+      if (
+        initialVisibleFrameSeekedRef.current &&
+        !hasPlaybackStarted &&
+        (!startMs || startMs <= 0) &&
+        v.currentTime > 0.05
+      ) {
+        try {
+          v.currentTime = 0;
+          setCurrentMs(0);
+        } catch {
+          // If the browser refuses the rewind, continue with the normal play
+          // attempt; playback is still better than blocking on a cosmetic seek.
+        }
+      }
+
       // A <video> element left in an error state (network/decode/unsupported
       // format) will just re-reject on `.play()` forever — it needs `.load()`
       // to reset `readyState`/`error` and re-fetch the source before playback
@@ -497,7 +512,9 @@ export const VideoPlayer = forwardRef<VideoPlayerHandle, VideoPlayerProps>(
       attachPlayPromise,
       bumpControls,
       currentMs,
+      hasPlaybackStarted,
       rejectPlayAttempt,
+      startMs,
     ]);
 
     const retryPendingPlay = useCallback(
@@ -858,7 +875,6 @@ export const VideoPlayer = forwardRef<VideoPlayerHandle, VideoPlayerProps>(
         initialVisibleFrameSeekedRef.current = true;
         try {
           v.currentTime = visibleMs / 1000;
-          setCurrentMs(visibleMs);
           return true;
         } catch {
           return false;
@@ -1142,6 +1158,17 @@ export const VideoPlayer = forwardRef<VideoPlayerHandle, VideoPlayerProps>(
               const ct =
                 Number.isFinite(raw) && raw >= 0 && raw < 1e7 ? raw : 0;
               const ms = Math.floor(ct * 1000);
+              if (
+                initialVisibleFrameSeekedRef.current &&
+                !hasPlaybackStarted &&
+                !playAttemptPendingRef.current &&
+                v.paused &&
+                (!startMs || startMs <= 0)
+              ) {
+                setCurrentMs(0);
+                onTimeUpdate?.(0, resolvedDurationMs);
+                return;
+              }
               const visibleMs = clampSeek(
                 skipExcludedRange(ms, excludedRanges, resolvedDurationMs),
                 v,
@@ -1169,10 +1196,20 @@ export const VideoPlayer = forwardRef<VideoPlayerHandle, VideoPlayerProps>(
               onTimeUpdate?.(ms, resolvedDurationMs);
             }}
             onEnded={() => {
+              const endedMs =
+                resolvedDurationMs > 0
+                  ? resolvedDurationMs
+                  : videoRef.current &&
+                      Number.isFinite(videoRef.current.duration) &&
+                      videoRef.current.duration > 0
+                    ? Math.round(videoRef.current.duration * 1000)
+                    : currentMs;
+              setCurrentMs(endedMs);
               setIsPlaying(false);
               setIsPlayPending(false);
               setIsBuffering(false);
               setIsPreparing(false);
+              onTimeUpdate?.(endedMs, resolvedDurationMs);
               onEnded?.();
             }}
             onError={(e) => {

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/components/sharing/share-ui.tsx

@@ -4,11 +4,11 @@ import {
   useT,
 } from "@agent-native/core/client";
 import {
-  IconBuilding,
   IconCheck,
   IconCopy,
   IconLock,
   IconTrash,
+  IconUsersGroup,
   IconWorld,
 } from "@tabler/icons-react";
 import { useQueryClient } from "@tanstack/react-query";
@@ -55,7 +55,7 @@ export const VIS_META: Record<Visibility, { Icon: typeof IconLock }> = {
     Icon: IconLock,
   },
   org: {
-    Icon: IconBuilding,
+    Icon: IconUsersGroup,
   },
   public: {
     Icon: IconWorld,
@@ -308,7 +308,7 @@ export function Avatar({ label, org }: { label: string; org?: boolean }) {
       className="inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-full bg-muted text-[11px] font-semibold text-muted-foreground"
     >
       {org ? (
-        <IconBuilding size={14} strokeWidth={1.75} />
+        <IconUsersGroup size={14} strokeWidth={1.75} />
       ) : (
         (label.split("@")[0]?.[0] ?? label[0] ?? "?").toUpperCase()
       )}

package/corpus/templates/clips/app/components/sharing/slack-share-hint.tsx

@@ -35,16 +35,11 @@ export function SlackShareHint({ canManage }: { canManage: boolean }) {
 
   if (connected) {
     return (
-      <div className="flex items-center gap-2.5 rounded-md border border-border bg-muted/40 px-3 py-2">
+      <div className="flex items-center gap-2 rounded-md bg-muted/35 px-2.5 py-1.5 text-xs text-muted-foreground">
         <IconBrandSlack className="h-4 w-4 shrink-0 text-muted-foreground" />
-        <div className="min-w-0">
-          <div className="text-xs font-medium">
-            {t("slackShareHint.playsInline")}
-          </div>
-          <p className="text-[11px] text-muted-foreground">
-            {t("slackShareHint.connectedDescription")}
-          </p>
-        </div>
+        <span className="min-w-0 truncate">
+          {t("slackShareHint.playsInline")}
+        </span>
       </div>
     );
   }
@@ -59,18 +54,13 @@ export function SlackShareHint({ canManage }: { canManage: boolean }) {
   return (
     <a
       href={appPath("/settings#slack")}
-      className="flex items-center gap-2.5 rounded-md border border-border px-3 py-2 transition-colors hover:bg-muted/50"
+      className="flex items-center gap-2 rounded-md bg-muted/35 px-2.5 py-1.5 text-xs text-muted-foreground transition-colors hover:bg-muted/55"
     >
       <IconBrandSlack className="h-4 w-4 shrink-0 text-muted-foreground" />
-      <div className="min-w-0 flex-1">
-        <div className="text-xs font-medium">
-          {t("slackShareHint.makeInline")}
-        </div>
-        <p className="text-[11px] text-muted-foreground">
-          {t("slackShareHint.connectDescription")}
-        </p>
-      </div>
-      <span className="shrink-0 text-xs font-medium text-primary">
+      <span className="min-w-0 flex-1 truncate">
+        {t("slackShareHint.makeInline")}
+      </span>
+      <span className="shrink-0 font-medium text-primary">
         {t("slackShareHint.connect")}
       </span>
     </a>

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/r.$recordingId.tsx

@@ -14,6 +14,7 @@ import {
   BUILDER_CREDITS_UPGRADE_URL,
   type BuilderCreditsStatus,
 } from "@shared/builder-credits";
+import { isStoredButUnservableFinalizeError } from "@shared/finalize-recovery";
 import {
   isLoomEmbedBackedRecording,
   isLoomRecordingSource,
@@ -635,6 +636,8 @@ export default function RecordingPage() {
     const rawFailureReason =
       ((recording as any).failureReason as string | null | undefined) ?? null;
     const waitingForStorage = isStorageSetupFailureReason(rawFailureReason);
+    const storedButUnservableFailure =
+      isStoredButUnservableFinalizeError(rawFailureReason);
     const loomStorageSetupFailure = waitingForStorage && isLoomRecording;
     const nativeSaveFailed =
       searchParams.get("saveFailed") === "1" ||
@@ -646,13 +649,16 @@ export default function RecordingPage() {
     const isFailure =
       explicitFailure || stuckFailure || waitingForStorage || nativeSaveFailed;
     const displayReason = explicitFailure
-      ? (rawFailureReason ?? t("recordingPage.retryLibrary"))
+      ? storedButUnservableFailure
+        ? t("recordingPage.clipDataPreserved")
+        : (rawFailureReason ?? t("recordingPage.retryLibrary"))
       : nativeSaveFailed
         ? nativeSaveFailureMessage(rawFailureReason)
         : stuckFailure
           ? t("recordingPage.processingStuck", { status: recording.status })
           : t("recordingPage.uploadingAssembling");
     const storageSetupFailure = waitingForStorage;
+    const canRetryFinalize = storageSetupFailure || storedButUnservableFailure;
     const label = storageSetupFailure
       ? loomStorageSetupFailure
         ? t("recordingPage.connectStorageImportLoom")
@@ -744,7 +750,7 @@ export default function RecordingPage() {
         <div className="flex items-center gap-2">
           <Button
             onClick={() => {
-              if (storageSetupFailure) {
+              if (canRetryFinalize) {
                 void retryFinalizeAfterStorage();
                 return;
               }
@@ -755,7 +761,7 @@ export default function RecordingPage() {
             size="sm"
             disabled={retryingFinalize}
           >
-            {storageSetupFailure
+            {canRetryFinalize
               ? loomStorageSetupFailure
                 ? t("recordingPage.retryImport")
                 : t("recordingPage.retryUpload")