@agent-native/core 0.165.3 → 0.167.0

package/corpus/templates/clips/actions/import-loom-recording.ts

@@ -1,5 +1,8 @@
 import { defineAction } from "@agent-native/core";
-import { writeAppState } from "@agent-native/core/application-state";
+import {
+  writeAppState,
+  writeAppStateForCurrentTab,
+} from "@agent-native/core/application-state";
 import { ssrfSafeFetch } from "@agent-native/core/extensions/url-safety";
 import { uploadFile } from "@agent-native/core/file-upload";
 import { buildDeepLink } from "@agent-native/core/server";
@@ -315,7 +318,10 @@ export default defineAction({
         updatedAt: now,
       });
       await writeAppState("refresh-signal", { ts: Date.now() });
-      await writeAppState("navigate", { view: "recording", recordingId: id });
+      await writeAppStateForCurrentTab("navigate", {
+        view: "recording",
+        recordingId: id,
+      });
 
       return {
         recordingId: id,
@@ -386,7 +392,10 @@ export default defineAction({
         updatedAt: now,
       });
       await writeAppState("refresh-signal", { ts: Date.now() });
-      await writeAppState("navigate", { view: "recording", recordingId: id });
+      await writeAppStateForCurrentTab("navigate", {
+        view: "recording",
+        recordingId: id,
+      });
 
       try {
         console.log("[import-loom-recording] dispatching loom-import job", {
@@ -540,7 +549,10 @@ export default defineAction({
       updatedAt: now,
     });
     await writeAppState("refresh-signal", { ts: Date.now() });
-    await writeAppState("navigate", { view: "recording", recordingId: id });
+    await writeAppStateForCurrentTab("navigate", {
+      view: "recording",
+      recordingId: id,
+    });
 
     return {
       recordingId: id,

package/corpus/templates/clips/actions/navigate.ts

@@ -16,7 +16,7 @@
  */
 
 import { defineAction } from "@agent-native/core";
-import { writeAppState } from "@agent-native/core/application-state";
+import { writeAppStateForCurrentTab } from "@agent-native/core/application-state";
 import { z } from "zod";
 
 const Views = [
@@ -91,7 +91,7 @@ export default defineAction({
     if (args.shareId) nav.shareId = args.shareId;
     if (args.search) nav.search = args.search;
     if (args.path) nav.path = args.path;
-    await writeAppState("navigate", nav);
+    await writeAppStateForCurrentTab("navigate", nav);
     const target =
       args.path ||
       [

package/corpus/templates/clips/app/components/editor/stitch-manager.tsx

@@ -1,4 +1,3 @@
-import { agentNativePath } from "@agent-native/core/client/api-path";
 import {
   useActionMutation,
   useActionQuery,

package/corpus/templates/clips/app/components/library/space-dialogs.tsx

@@ -1,6 +1,5 @@
 import { useActionMutation } from "@agent-native/core/client/hooks";
 import { useT } from "@agent-native/core/client/i18n";
-import { useState } from "react";
 import { toast } from "sonner";
 
 import {

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

@@ -73,7 +73,6 @@ function ShareMeetingContent({
   shareTranscript: boolean;
   transcriptReady: boolean;
 }) {
-  const t = useT();
   const shareUrl = useMemo(
     () => `${window.location.origin}${appPath(`/share/meeting/${meetingId}`)}`,
     [meetingId],

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

@@ -0,0 +1,17 @@
+import {
+  ShareTrigger,
+  type ShareTriggerProps,
+} from "@agent-native/toolkit/sharing";
+
+import { cn } from "@/lib/utils";
+
+export function ClipsShareTrigger({ className, ...props }: ShareTriggerProps) {
+  return (
+    <ShareTrigger
+      {...props}
+      intent="primary"
+      emphasis="solid"
+      className={cn("clips-share-trigger shrink-0", className)}
+    />
+  );
+}

package/corpus/templates/clips/app/components/player/delete-recording-menu.tsx

@@ -1,6 +1,6 @@
 import { useActionMutation } from "@agent-native/core/client/hooks";
 import { useT } from "@agent-native/core/client/i18n";
-import { IconDots, IconDownload, IconTrash } from "@tabler/icons-react";
+import { IconDotsVertical, IconDownload, IconTrash } from "@tabler/icons-react";
 import { useCallback, useRef, useState } from "react";
 import { toast } from "sonner";
 
@@ -93,10 +93,10 @@ export function RecordingOptionsMenu({
           <Button
             variant="ghost"
             size="icon"
-            className="shrink-0"
+            className="-mx-1.5 h-auto w-auto shrink-0 px-0.5 py-1.5"
             aria-label={t("deleteRecordingMenu.clipOptions")}
           >
-            <IconDots className="h-4 w-4" />
+            <IconDotsVertical className="h-4 w-4" />
           </Button>
         </DropdownMenuTrigger>
         <DropdownMenuContent align="end" className="w-44">

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

@@ -399,7 +399,7 @@ export const VideoPlayer = forwardRef<VideoPlayerHandle, VideoPlayerProps>(
     const [isFullscreen, setIsFullscreen] = useState(false);
     const nativeFullscreenRef = useRef(false);
     const [isPip, setIsPip] = useState(false);
-    const [canPlay, setCanPlay] = useState(false);
+    const [, setCanPlay] = useState(false);
     const [isPlayPending, setIsPlayPending] = useState(false);
     const [isBuffering, setIsBuffering] = useState(false);
     const [playError, setPlayError] = useState<string | null>(null);
@@ -467,7 +467,7 @@ export const VideoPlayer = forwardRef<VideoPlayerHandle, VideoPlayerProps>(
     // first frame of a freshly-finalized clip so the user doesn't see a blank
     // black rectangle. Hidden on loadeddata / canplay / currentTime > 0, or
     // after a 10s safety timeout.
-    const [isPreparing, setIsPreparing] = useState<boolean>(!!videoUrl);
+    const [, setIsPreparing] = useState<boolean>(!!videoUrl);
     const edits = useMemo(() => parseEdits(editsJson), [editsJson]);
     const hasEditorThumbnail = Boolean(edits.thumbnail);
     const [shouldRefreshAutoThumbnail, setShouldRefreshAutoThumbnail] =

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

@@ -11,7 +11,6 @@ import {
 import {
   SCREEN_CAPTURE_FRAME_RATE,
   screenCaptureDisplayOptions,
-  screenCaptureVideoConstraints,
 } from "@shared/recording-capture";
 import {
   chunkUploadUrl,

package/corpus/templates/clips/app/components/settings/ai-setup-section.tsx

@@ -15,7 +15,6 @@ import {
   IconBolt,
   IconCheck,
   IconExternalLink,
-  IconKey,
   IconLoader2,
 } from "@tabler/icons-react";
 import { useState } from "react";

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

@@ -73,6 +73,10 @@
   --highlight-foreground: 0 0% 10%;
 }
 
+.dark .clips-share-trigger {
+  --primary: 0 0% 100%;
+}
+
 @theme inline {
   --color-highlight: hsl(var(--highlight));
   --color-highlight-foreground: hsl(var(--highlight-foreground));
@@ -148,6 +152,33 @@
   animation: clips-collapsible-up 120ms ease-out;
 }
 
+.clips-share-content {
+  container: clips-share-content / inline-size;
+}
+
+.clips-share-metadata-description {
+  order: 2;
+}
+
+.clips-share-metadata-actions {
+  order: 1;
+}
+
+@container clips-share-content (min-width: 860px) {
+  .clips-share-metadata {
+    align-items: flex-start;
+    flex-direction: row;
+  }
+
+  .clips-share-metadata-description {
+    order: 1;
+  }
+
+  .clips-share-metadata-actions {
+    order: 2;
+  }
+}
+
 @media (prefers-reduced-motion: reduce) {
   .clips-collapsible-content[data-state] {
     animation-duration: 1ms;

package/corpus/templates/clips/app/hooks/use-playback-position.ts

@@ -48,7 +48,6 @@ export function usePlaybackPosition({
     let restoreApplied = false;
     let saveInFlight = false;
     let pendingSave: { positionMs: number; keepalive: boolean } | null = null;
-    let lastSavedPositionMs = -1;
     let lastSavedAt = -SAVE_INTERVAL_MS;
     let removePendingRestoreListeners: (() => void) | null = null;
 
@@ -80,7 +79,6 @@ export function usePlaybackPosition({
       }
 
       saveInFlight = true;
-      lastSavedPositionMs = positionMs;
       lastSavedAt = now;
       void savePlaybackPosition(recordingId, positionMs, { keepalive })
         .catch((error) => {

package/corpus/templates/clips/app/lib/download-release-channel.ts

@@ -0,0 +1,10 @@
+export type DownloadReleaseChannel = "production" | "nightly";
+
+export const BETA_CLIPS_HOSTNAME = "beta.clips.agent-native.com";
+
+export function getDefaultDownloadChannel(
+  hostname: string | undefined,
+): DownloadReleaseChannel {
+  const normalized = hostname?.trim().toLowerCase().replace(/\.$/, "");
+  return normalized === BETA_CLIPS_HOSTNAME ? "nightly" : "production";
+}

package/corpus/templates/clips/app/routes/_app.meetings.$meetingId.tsx

@@ -28,7 +28,6 @@ import { useEffect, useMemo, useRef, useState } from "react";
 import { NavLink, useNavigate, useParams } from "react-router";
 import { toast } from "sonner";
 
-import { CaptureInstallButton } from "@/components/capture-install-options";
 import { PageHeader } from "@/components/library/page-header";
 import {
   AttendeeStack,
@@ -69,7 +68,6 @@ import {
   TooltipContent,
   TooltipTrigger,
 } from "@/components/ui/tooltip";
-import { useDesktopPromo } from "@/hooks/use-desktop-promo";
 import enMessages from "@/i18n/en-US";
 import { cn } from "@/lib/utils";
 
@@ -499,7 +497,7 @@ export default function MeetingDetailRoute() {
   const stopMeetingRecording = useActionMutation<any, any>(
     "stop-meeting-recording",
   );
-  const { isDesktopApp } = useDesktopPromo();
+
   const [notesJustArrived, setNotesJustArrived] = useState(false);
   const [deleteOpen, setDeleteOpen] = useState(false);
   const [endMeetingOpen, setEndMeetingOpen] = useState(false);

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

@@ -4,12 +4,20 @@ import {
   IconBrandChrome,
   IconBrandApple,
   IconBrandWindows,
+  IconChevronDown,
   IconDeviceDesktop,
   IconExternalLink,
 } from "@tabler/icons-react";
 import { useEffect, useState } from "react";
 
 import { Button } from "@/components/ui/button";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
 import { Skeleton } from "@/components/ui/skeleton";
 import enMessages from "@/i18n/en-US";
 import {
@@ -17,6 +25,10 @@ import {
   markDesktopAppDownloaded,
   useClipsChromeExtensionEnabled,
 } from "@/lib/capture-install-options";
+import {
+  getDefaultDownloadChannel,
+  type DownloadReleaseChannel,
+} from "@/lib/download-release-channel";
 
 export function meta() {
   return [
@@ -29,7 +41,6 @@ export function meta() {
 }
 
 type PlatformId = "mac" | "windows" | "linux";
-type ReleaseChannel = "production" | "nightly";
 
 interface PlatformVariant {
   id: PlatformId;
@@ -204,7 +215,8 @@ function secondaryDownloadButton(
 export default function DownloadPage() {
   const chromeExtensionEnabled = useClipsChromeExtensionEnabled();
   const t = useT();
-  const [channel, setChannel] = useState<ReleaseChannel>("production");
+  const [channel, setChannel] = useState<DownloadReleaseChannel>("production");
+  const [hostResolved, setHostResolved] = useState(false);
   const [manifest, setManifest] = useState<Manifest | null>(null);
   const [manifestError, setManifestError] = useState(false);
   const [detected, setDetected] = useState<PlatformId | null>(null);
@@ -215,6 +227,13 @@ export default function DownloadPage() {
   }, []);
 
   useEffect(() => {
+    setChannel(getDefaultDownloadChannel(window.location.hostname));
+    setHostResolved(true);
+  }, []);
+
+  useEffect(() => {
+    if (!hostResolved) return;
+
     let cancelled = false;
     setManifest(null);
     setManifestError(false);
@@ -233,13 +252,15 @@ export default function DownloadPage() {
     return () => {
       cancelled = true;
     };
-  }, [channel, manifestRequest]);
+  }, [channel, hostResolved, manifestRequest]);
 
   const retryManifest = () => {
     setManifestRequest((request) => request + 1);
   };
 
-  const handleChannelChange = (nextChannel: ReleaseChannel) => {
+  const handleChannelChange = (nextChannel: DownloadReleaseChannel) => {
+    if (nextChannel === channel) return;
+
     setManifest(null);
     setManifestError(false);
     setChannel(nextChannel);
@@ -335,46 +356,48 @@ export default function DownloadPage() {
                 <>{t("downloadRoute.loadingRelease")}</>
               )}
             </div>
-            <div className="mt-2 flex items-center gap-2 text-xs text-muted-foreground">
-              <span>{t("downloadRoute.stable")}</span>
-              <button
-                type="button"
-                role="switch"
-                aria-checked={channel === "nightly"}
-                aria-label={t(
-                  channel === "nightly"
-                    ? "downloadRoute.switchToStable"
-                    : "downloadRoute.switchToNightly",
-                )}
-                onClick={() =>
-                  handleChannelChange(
-                    channel === "nightly" ? "production" : "nightly",
-                  )
-                }
-                className={`relative inline-flex h-5 w-9 shrink-0 items-center rounded-full border border-border transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/50 ${
-                  channel === "nightly"
-                    ? "bg-foreground"
-                    : "bg-muted-foreground/20"
-                }`}
-              >
-                <span
-                  aria-hidden="true"
-                  className={`block size-3.5 rounded-full bg-primary-foreground shadow-sm transition-transform ${
-                    channel === "nightly"
-                      ? "translate-x-[18px]"
-                      : "translate-x-[2px]"
-                  }`}
-                />
-              </button>
-              <span
-                className={
-                  channel === "nightly"
-                    ? "font-medium text-foreground"
-                    : "text-muted-foreground"
-                }
-              >
-                {t("downloadRoute.nightly")}
-              </span>
+            <div className="mt-2 flex items-center justify-center text-xs text-muted-foreground">
+              <DropdownMenu>
+                <DropdownMenuTrigger asChild>
+                  <Button
+                    type="button"
+                    variant="ghost"
+                    size="sm"
+                    className="h-7 gap-1.5 px-2 font-normal text-muted-foreground hover:bg-muted/50 hover:text-foreground"
+                    data-release-channel={channel}
+                  >
+                    <span
+                      className={
+                        channel === "nightly"
+                          ? "font-medium text-foreground"
+                          : undefined
+                      }
+                    >
+                      {channel === "nightly"
+                        ? t("downloadRoute.nightly")
+                        : t("downloadRoute.stable")}
+                    </span>
+                    <IconChevronDown className="size-3.5" aria-hidden="true" />
+                  </Button>
+                </DropdownMenuTrigger>
+                <DropdownMenuContent align="center" className="w-44">
+                  <DropdownMenuRadioGroup
+                    value={channel}
+                    onValueChange={(value) => {
+                      if (value === "production" || value === "nightly") {
+                        handleChannelChange(value);
+                      }
+                    }}
+                  >
+                    <DropdownMenuRadioItem value="production">
+                      {t("downloadRoute.stable")}
+                    </DropdownMenuRadioItem>
+                    <DropdownMenuRadioItem value="nightly">
+                      {t("downloadRoute.nightly")}
+                    </DropdownMenuRadioItem>
+                  </DropdownMenuRadioGroup>
+                </DropdownMenuContent>
+              </DropdownMenu>
             </div>
           </div>
 

package/corpus/templates/clips/app/routes/r.$recordingId.tsx

@@ -1,5 +1,5 @@
 import { AgentPanel } from "@agent-native/core/client/agent-chat";
-import { appPath, agentNativePath } from "@agent-native/core/client/api-path";
+import { agentNativePath } from "@agent-native/core/client/api-path";
 import { writeClipboardText } from "@agent-native/core/client/clipboard";
 import {
   useActionMutation,
@@ -16,7 +16,7 @@ import {
   isHumanReadableDocumentTitle,
   normalizeDocumentTitle,
 } from "@agent-native/core/shared";
-import { ShareCopyRow, ShareTrigger } from "@agent-native/toolkit/sharing";
+import { ShareCopyRow } from "@agent-native/toolkit/sharing";
 import {
   BUILDER_CREDITS_UPGRADE_URL,
   type BuilderCreditsStatus,
@@ -59,6 +59,7 @@ import { toast } from "sonner";
 
 import { EditableRecordingTitle } from "@/components/editable-recording-title";
 import { EditorLayout } from "@/components/editor/editor-layout";
+import { ClipsShareTrigger } from "@/components/player/clips-share-trigger";
 import { CommentsPanel } from "@/components/player/comments-panel";
 import { RecordingOptionsMenu } from "@/components/player/delete-recording-menu";
 import { InsightsPanel } from "@/components/player/insights-panel";
@@ -1051,7 +1052,7 @@ export default function RecordingPage() {
     if (!showRecoveryState) {
       return (
         <div className="flex min-h-screen w-full flex-col bg-background">
-          <header className="flex min-w-0 shrink-0 items-center gap-3 border-b border-border px-3 py-2 sm:px-4 sm:py-3">
+          <header className="flex min-w-0 shrink-0 items-center gap-2 border-b border-border px-3 py-2 sm:px-4 sm:py-3">
             <BackToLibraryButton />
             <div className="min-w-0 flex-1">
               <p className="truncate text-sm font-medium">{visibleTitle}</p>
@@ -1070,10 +1071,7 @@ export default function RecordingPage() {
               hasPassword={Boolean(recording.hasPassword)}
               viewerReshareOnly={viewerReshareOnly}
             >
-              <ShareTrigger
-                label={t("recordingPage.share")}
-                className="shrink-0"
-              />
+              <ClipsShareTrigger label={t("recordingPage.share")} />
             </ShareRecordingPopover>
           </header>
 
@@ -1370,7 +1368,7 @@ export default function RecordingPage() {
     <div className="flex min-h-screen w-full max-w-full flex-col overflow-x-hidden bg-background xl:h-screen xl:flex-row xl:overflow-hidden">
       {/* Main video column */}
       <div className="flex w-full min-w-0 flex-col xl:flex-1">
-        <header className="flex min-w-0 shrink-0 items-center gap-2 border-b border-border px-3 py-2 sm:gap-3 sm:px-4 sm:py-3">
+        <header className="flex min-w-0 shrink-0 items-center gap-2 border-b border-border px-3 py-2 sm:px-4 sm:py-3">
           <BackToLibraryButton />
           <div className="flex-1 min-w-0">
             <EditableRecordingTitle
@@ -1609,10 +1607,7 @@ export default function RecordingPage() {
               hasPassword={Boolean(recording.hasPassword)}
               viewerReshareOnly={viewerReshareOnly}
             >
-              <ShareTrigger
-                label={t("recordingPage.share")}
-                className="shrink-0"
-              />
+              <ClipsShareTrigger label={t("recordingPage.share")} />
             </ShareRecordingPopover>
           ) : null}
 

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

@@ -3,7 +3,7 @@ import {
   agentNativePath,
   appBasePath,
 } from "@agent-native/core/client/api-path";
-import { callAction } from "@agent-native/core/client/hooks";
+import { callAction, getBrowserTabId } from "@agent-native/core/client/hooks";
 import { useT } from "@agent-native/core/client/i18n";
 import { useLiveTranscription } from "@agent-native/core/client/transcription/use-live-transcription";
 import type { BrowserDiagnosticsData } from "@shared/browser-diagnostics";
@@ -31,7 +31,7 @@ import {
 import { useQueryClient } from "@tanstack/react-query";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { flushSync } from "react-dom";
-import { Link, useLocation, useNavigate } from "react-router";
+import { useLocation, useNavigate } from "react-router";
 
 import { Skeleton } from "@/components/ui/skeleton";
 import { useDesktopPromo } from "@/hooks/use-desktop-promo";
@@ -1783,7 +1783,7 @@ export default function RecordRoute() {
         }
         if (reportContext && createdId) {
           const path = bugReportDonePath(createdId, reportContext);
-          await writeAppState("navigate", {
+          await writeAppState(`navigate:${getBrowserTabId()}`, {
             view: "bug-report-done",
             recordingId: createdId,
             path,
@@ -1792,7 +1792,7 @@ export default function RecordRoute() {
             navigate(path);
           }, 50);
         } else {
-          await writeAppState("navigate", {
+          await writeAppState(`navigate:${getBrowserTabId()}`, {
             view: "recording",
             recordingId: createdId,
           });
@@ -1980,7 +1980,7 @@ export default function RecordRoute() {
 
       if (reportContext) {
         const path = bugReportDonePath(recordingId, reportContext);
-        await writeAppState("navigate", {
+        await writeAppState(`navigate:${getBrowserTabId()}`, {
           view: "bug-report-done",
           recordingId,
           path,
@@ -1991,7 +1991,7 @@ export default function RecordRoute() {
         return;
       }
 
-      await writeAppState("navigate", {
+      await writeAppState(`navigate:${getBrowserTabId()}`, {
         view: "recording",
         recordingId,
       }).catch(() => {});