@agent-native/core 0.152.1 → 0.153.1

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

@@ -7,6 +7,7 @@ import {
 } from "@agent-native/core/client/hooks";
 import { useT } from "@agent-native/core/client/i18n";
 import {
+  IconChevronDown,
   IconCode,
   IconExternalLink,
   IconLink,
@@ -35,6 +36,11 @@ import {
   type Visibility,
 } from "@/components/sharing/share-ui";
 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";
@@ -49,6 +55,7 @@ import { Tabs, TabsList, TabsTrigger, TabsContent } from "@/components/ui/tabs";
 import { buildEmailPreviewMarkup } from "../../../shared/email-preview";
 import { isLoomEmbedUrl } from "../../../shared/loom";
 import { withShareAttribution } from "../../../shared/share-attribution";
+import { preferredThumbnailVariant } from "../../../shared/share-meta";
 
 function absoluteAppUrl(path: string): string {
   if (typeof window === "undefined") return "";
@@ -59,7 +66,7 @@ export interface ShareRecordingPopoverProps {
   recordingId: string;
   recordingTitle?: string;
   initialVisibility?: Visibility | null;
-  initialRole?: "owner" | "admin" | "editor" | "viewer";
+  initialRole?: "owner" | "admin" | "editor" | "commenter" | "viewer";
   videoUrl?: string | null;
   thumbnailUrl?: string | null;
   animatedThumbnailUrl?: string | null;
@@ -183,7 +190,7 @@ function ShareRecordingContent({
   recordingId: string;
   recordingTitle?: string;
   initialVisibility?: Visibility | null;
-  initialRole?: "owner" | "admin" | "editor" | "viewer";
+  initialRole?: "owner" | "admin" | "editor" | "commenter" | "viewer";
   videoUrl?: string | null;
   thumbnailUrl?: string | null;
   animatedThumbnailUrl?: string | null;
@@ -273,9 +280,9 @@ function ShareRecordingContent({
             sharesQuery={sharesQuery}
             canManage={canManage}
             roleCopy={{
-              viewer: {
-                label: t("shareUi.recordingViewer.label"),
-                description: t("shareUi.recordingViewer.description"),
+              commenter: {
+                label: t("shareUi.recordingCommenter.label"),
+                description: t("shareUi.recordingCommenter.description"),
               },
             }}
           />
@@ -336,10 +343,13 @@ function LinkTab({
   const isLoomRecording = isLoomRecordingProp || isLoomEmbedUrl(videoUrl);
   const emailPreviewThumbnailUrl = useMemo(() => {
     if (!isPublic || hasPassword !== false || !sharesLoaded) return null;
-    const candidate = animatedThumbnailUrl || thumbnailUrl;
-    if (!candidate) return null;
+    const variant = preferredThumbnailVariant({
+      thumbnailUrl,
+      animatedThumbnailUrl,
+    });
+    if (!variant) return null;
 
-    const query = animatedThumbnailUrl ? "?animated=1" : "";
+    const query = variant === "animated" ? "?animated=1" : "";
     return absoluteAppUrl(
       `/api/thumbnail/${encodeURIComponent(recordingId)}${query}`,
     );
@@ -430,6 +440,11 @@ function LinkTab({
   const agentPrompt = agentLink
     ? t("shareDialog.agentPrompt", { agentContextUrl: agentLink })
     : "";
+  const [agentDetailsOpen, setAgentDetailsOpen] = useState(false);
+
+  useEffect(() => {
+    if (isPublic) setAgentDetailsOpen(false);
+  }, [isPublic]);
 
   return (
     <div className="space-y-4">
@@ -440,6 +455,7 @@ function LinkTab({
           isPending={visibilityPending}
           onChange={(next) => setResourceVisibility(next)}
           publicDescription={t("shareDialog.publicDescription")}
+          showDescription={false}
         />
       ) : (
         <div className="space-y-2" aria-hidden>
@@ -459,42 +475,69 @@ function LinkTab({
       />
 
       {!isPublic ? (
-        <div className="space-y-2">
-          <CopyField
-            label={t("shareDialog.shareWithAgents")}
-            value={agentLink}
-            disabled={agentShareDisabled}
-          />
-          {sharesLoaded ? (
-            <>
-              <p className="text-xs text-muted-foreground">
-                {t("shareDialog.agentTokenDescription")}
-              </p>
-              {agentLinkError ? (
-                <div className="flex items-center justify-between gap-2 rounded-md border border-border bg-muted/30 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}
+        <Collapsible
+          open={agentDetailsOpen}
+          onOpenChange={setAgentDetailsOpen}
+          className="overflow-hidden rounded-md border border-border"
+        >
+          <CollapsibleTrigger asChild>
+            <button
+              type="button"
+              className="flex min-h-10 w-full items-center justify-between gap-3 px-3 py-2 text-left text-sm font-medium transition-colors hover:bg-muted/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset"
+            >
+              <span className="flex min-w-0 items-center gap-2 truncate">
+                <IconLink
+                  aria-hidden="true"
+                  className="size-3.5 shrink-0 text-muted-foreground"
+                  strokeWidth={1.8}
+                />
+                {t("shareDialog.shareWithAgents")}
+              </span>
+              <IconChevronDown
+                aria-hidden="true"
+                className={`size-4 shrink-0 text-muted-foreground transition-transform ${agentDetailsOpen ? "rotate-180" : ""}`}
+              />
+            </button>
+          </CollapsibleTrigger>
+          <CollapsibleContent className="clips-collapsible-content border-t border-border px-3 py-3">
+            <div className="space-y-2">
               <CopyField
-                label={t("shareDialog.copyAgentPrompt")}
-                value={agentPrompt}
+                label={t("shareDialog.shareWithAgents")}
+                value={agentLink}
                 disabled={agentShareDisabled}
               />
-            </>
-          ) : null}
-        </div>
+              {sharesLoaded ? (
+                <>
+                  <p className="text-xs text-muted-foreground">
+                    {t("shareDialog.agentTokenDescription")}
+                  </p>
+                  {agentLinkError ? (
+                    <div className="flex items-center justify-between gap-2 rounded-md border border-border bg-muted/30 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}
+                  />
+                </>
+              ) : null}
+            </div>
+          </CollapsibleContent>
+        </Collapsible>
       ) : null}
 
       {sharesLoaded && !isPublic && canManage ? (

package/corpus/templates/clips/app/components/player/timestamped-comment-button.tsx

@@ -11,6 +11,7 @@ import { msToClock } from "./scrubber";
 
 interface TimestampedCommentButtonProps {
   enableComments: boolean;
+  canComment: boolean;
   onOpen: () => void;
   className?: string;
 }
@@ -18,11 +19,12 @@ interface TimestampedCommentButtonProps {
 /** Trigger that opens the docked comment composer, pinned to the current time. */
 export function TimestampedCommentButton({
   enableComments,
+  canComment,
   onOpen,
   className,
 }: TimestampedCommentButtonProps) {
   const t = useT();
-  if (!enableComments) return null;
+  if (!enableComments || !canComment) return null;
   return (
     <Button
       type="button"

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

@@ -223,7 +223,7 @@ export interface VideoPlayerProps {
    * Viewer role for this recording. When `owner`, we opportunistically capture
    * a visible frame for missing or blank auto-generated library thumbnails.
    */
-  role?: "owner" | "admin" | "editor" | "viewer";
+  role?: "owner" | "admin" | "editor" | "commenter" | "viewer";
   /**
    * Called with the live `<video>` DOM node whenever it is created or
    * destroyed (e.g. swapping to/from the Loom iframe or unsupported-format

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

@@ -39,7 +39,7 @@ import { cn } from "@/lib/utils";
 // ---------------------------------------------------------------------------
 
 export type Visibility = "private" | "org" | "public";
-export type Role = "viewer" | "editor" | "admin";
+export type Role = "viewer" | "commenter" | "editor" | "admin";
 
 export interface RoleCopy {
   label: string;
@@ -77,6 +77,7 @@ export const VIS_META: Record<Visibility, { Icon: typeof IconLock }> = {
 
 export const ROLE_OPTIONS: Array<{ value: Role; label: string }> = [
   { value: "viewer", label: "Viewer" },
+  { value: "commenter", label: "Commenter" },
   { value: "editor", label: "Editor" },
   { value: "admin", label: "Admin" },
 ];
@@ -177,6 +178,7 @@ export function GeneralAccessSelect({
   isPending,
   onChange,
   publicDescription,
+  showDescription = true,
 }: {
   visibility: Visibility;
   canManage: boolean;
@@ -184,6 +186,7 @@ export function GeneralAccessSelect({
   onChange: (next: Visibility) => void;
   /** Override for the "public" visibility description (e.g. Clips comment hint). */
   publicDescription?: string;
+  showDescription?: boolean;
 }) {
   const t = useT();
   const meta = VIS_META[visibility];
@@ -221,7 +224,12 @@ export function GeneralAccessSelect({
               ))}
             </SelectContent>
           </Select>
-          <div className="mt-0.5 text-xs text-muted-foreground">
+          <div
+            className={cn(
+              "mt-0.5 text-xs text-muted-foreground",
+              !showDescription && "sr-only",
+            )}
+          >
             {description}
           </div>
         </div>
@@ -243,14 +251,19 @@ export function MakePublicCard({
 }) {
   const t = useT();
   return (
-    <div className="rounded-md border border-border bg-muted/40 px-3 py-2.5">
-      <p className="text-xs text-muted-foreground">
-        {t("shareUi.restrictedLinkDescription")}
-      </p>
+    <div className="flex items-center justify-between gap-2 rounded-md bg-muted/40 px-3 py-2">
+      <p className="sr-only">{t("shareUi.restrictedLinkDescription")}</p>
+      <IconLock
+        aria-hidden
+        size={14}
+        strokeWidth={1.8}
+        className="text-muted-foreground"
+      />
       <Button
         type="button"
+        variant="outline"
         size="sm"
-        className="mt-2 h-7"
+        className="h-7"
         onClick={onMakePublic}
         disabled={isPending}
       >

package/corpus/templates/clips/app/i18n/en-US.ts

@@ -505,10 +505,11 @@ const messages = {
     },
     roles: {
       viewer: "Viewer",
+      commenter: "Commenter",
       editor: "Editor",
       admin: "Admin",
     },
-    recordingViewer: {
+    recordingCommenter: {
       label: "Commenter",
       description: "Can view, comment, and react",
     },

package/corpus/templates/clips/app/lib/public-meeting.ts

@@ -43,7 +43,7 @@ export interface PublicMeeting {
 export interface PublicMeetingPayload {
   meeting: PublicMeeting;
   viewer: {
-    role: "owner" | "admin" | "editor" | "viewer";
+    role: "owner" | "admin" | "editor" | "commenter" | "viewer";
     canEdit: boolean;
     isOwner: boolean;
   } | null;

package/corpus/templates/clips/app/lib/thumbnail-capture.ts

@@ -4,6 +4,8 @@ const PROBE_WIDTH = 40;
 const MIN_VISIBLE_MEAN_LUMA = 8;
 const MIN_VISIBLE_MAX_LUMA = 28;
 const MIN_VISIBLE_PIXEL_RATIO = 0.005;
+const SEEK_TOLERANCE_SECONDS = 0.25;
+const DEFAULT_SEEK_TIMEOUT_MS = 5_000;
 
 function resolveAppUrl(url: string | null | undefined): string | undefined {
   if (!url) return undefined;
@@ -122,6 +124,75 @@ export async function captureVideoThumbnailBlob(
   });
 }
 
+export function seekVideoToTime(
+  video: HTMLVideoElement,
+  timeMs: number,
+  options: { timeoutMs?: number } = {},
+): Promise<void> {
+  const targetSeconds = Math.max(0, timeMs) / 1000;
+  if (!Number.isFinite(targetSeconds)) {
+    return Promise.reject(new Error("Thumbnail time must be finite"));
+  }
+
+  const timeoutMs = options.timeoutMs ?? DEFAULT_SEEK_TIMEOUT_MS;
+  const hasTargetTime = () =>
+    Number.isFinite(video.currentTime) &&
+    Math.abs(video.currentTime - targetSeconds) <= SEEK_TOLERANCE_SECONDS;
+
+  if (video.readyState >= 2 && hasTargetTime()) return Promise.resolve();
+
+  return new Promise((resolve, reject) => {
+    let settled = false;
+    let timeout: ReturnType<typeof setTimeout> | undefined;
+
+    const cleanup = () => {
+      video.removeEventListener("loadedmetadata", requestSeek);
+      video.removeEventListener("seeked", handleSeeked);
+      video.removeEventListener("error", handleError);
+      if (timeout) clearTimeout(timeout);
+    };
+
+    const finish = (error?: Error) => {
+      if (settled) return;
+      settled = true;
+      cleanup();
+      if (error) reject(error);
+      else resolve();
+    };
+
+    const handleSeeked = () => {
+      if (hasTargetTime()) {
+        finish();
+      } else {
+        finish(new Error("Thumbnail seek landed on the wrong frame"));
+      }
+    };
+
+    const handleError = () =>
+      finish(new Error("Thumbnail video could not seek"));
+
+    const requestSeek = () => {
+      if (settled) return;
+      try {
+        video.currentTime = targetSeconds;
+        if (video.readyState >= 2 && hasTargetTime()) finish();
+      } catch {
+        finish(new Error("Thumbnail video could not seek"));
+      }
+    };
+
+    video.addEventListener("loadedmetadata", requestSeek);
+    video.addEventListener("seeked", handleSeeked);
+    video.addEventListener("error", handleError);
+    timeout = setTimeout(
+      () => finish(new Error("Thumbnail seek timed out")),
+      timeoutMs,
+    );
+
+    if (video.readyState >= 1) requestSeek();
+  });
+}
+
 export async function uploadRecordingThumbnail(
   recordingId: string,
   blob: Blob,

package/corpus/templates/clips/app/lib/thumbnail-picker-state.ts

@@ -0,0 +1,93 @@
+import type { ThumbnailSpec } from "./timestamp-mapping";
+
+export type ThumbnailPickerTab = "upload" | "frame" | "gif";
+
+export interface ThumbnailPickerState {
+  tab: ThumbnailPickerTab;
+  frameTime: number;
+  gifStart: number;
+  gifDuration: number;
+}
+
+const DEFAULT_GIF_DURATION_MS = 3_000;
+const MIN_GIF_DURATION_MS = 500;
+const MAX_GIF_DURATION_MS = 10_000;
+
+function clamp(value: number, min: number, max: number): number {
+  return Math.min(max, Math.max(min, value));
+}
+
+function finiteNumber(value: unknown, fallback: number): number {
+  if (typeof value !== "number" || !Number.isFinite(value)) return fallback;
+  return value;
+}
+
+function parseGifValue(value: string): {
+  startMs?: unknown;
+  durationMs?: unknown;
+} {
+  try {
+    const parsed: unknown = JSON.parse(value);
+    if (!parsed || typeof parsed !== "object") return {};
+    return parsed as { startMs?: unknown; durationMs?: unknown };
+  } catch {
+    // coercion-ok: malformed saved GIF metadata falls back to safe picker defaults.
+    return {};
+  }
+}
+
+export function resolveThumbnailPickerState(
+  thumbnail: ThumbnailSpec | null | undefined,
+  options: {
+    durationMs: number;
+    hasAnimatedThumbnail?: boolean;
+  },
+): ThumbnailPickerState {
+  const durationMs = Math.max(0, finiteNumber(options.durationMs, 0));
+  const frameMax = Math.max(1_000, durationMs);
+  const defaultGifDuration = clamp(
+    DEFAULT_GIF_DURATION_MS,
+    MIN_GIF_DURATION_MS,
+    MAX_GIF_DURATION_MS,
+  );
+
+  if (thumbnail?.kind === "frame") {
+    return {
+      tab: "frame",
+      frameTime: clamp(finiteNumber(Number(thumbnail.value), 0), 0, frameMax),
+      gifStart: 0,
+      gifDuration: defaultGifDuration,
+    };
+  }
+
+  if (thumbnail?.kind === "gif") {
+    const gif = parseGifValue(thumbnail.value);
+    const gifDuration = clamp(
+      finiteNumber(gif.durationMs, defaultGifDuration),
+      MIN_GIF_DURATION_MS,
+      MAX_GIF_DURATION_MS,
+    );
+    return {
+      tab: "gif",
+      frameTime: 0,
+      gifStart: clamp(
+        finiteNumber(gif.startMs, 0),
+        0,
+        Math.max(0, durationMs - gifDuration),
+      ),
+      gifDuration,
+    };
+  }
+
+  return {
+    tab:
+      thumbnail?.kind === "url"
+        ? "upload"
+        : options.hasAnimatedThumbnail
+          ? "gif"
+          : "frame",
+    frameTime: 0,
+    gifStart: 0,
+    gifDuration: defaultGifDuration,
+  };
+}

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

@@ -322,7 +322,7 @@ export default function MeetingDetailRoute() {
       segmentsJson?: TranscriptSegment[] | null;
     } | null;
     recording?: { id: string; durationMs?: number | null } | null;
-    role?: "owner" | "admin" | "editor" | "viewer";
+    role?: "owner" | "admin" | "editor" | "commenter" | "viewer";
   };
 
   const { data, isLoading, isError } = useActionQuery<GetMeetingResp>(

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

@@ -379,6 +379,7 @@ export default function RecordingPage() {
     | "owner"
     | "admin"
     | "editor"
+    | "commenter"
     | "viewer"
     | undefined;
   const comments = playerDataQ.data?.comments ?? [];
@@ -391,6 +392,11 @@ export default function RecordingPage() {
   const transcriptCleanup = playerDataQ.data?.transcript?.cleanup ?? null;
   const ctas = playerDataQ.data?.ctas ?? [];
   const canEdit = role === "owner" || role === "admin" || role === "editor";
+  const canComment =
+    role === "owner" ||
+    role === "admin" ||
+    role === "editor" ||
+    role === "commenter";
   useEffect(() => {
     if (!canEdit && (panel === "insights" || panel === "settings")) {
       setPanel("comments");
@@ -1051,11 +1057,7 @@ export default function RecordingPage() {
         <p className="text-sm text-muted-foreground mb-4 max-w-md text-center">
           {failureReason}
         </p>
-        {isFailure &&
-        !storageSetupFailure &&
-        detail &&
-        role &&
-        role !== "viewer" ? (
+        {isFailure && !storageSetupFailure && detail && role && canEdit ? (
           <div className="mb-4 w-full max-w-xl rounded-md border border-border bg-card p-4 text-start shadow-sm">
             <div className="mb-2 text-xs font-medium uppercase tracking-wide text-muted-foreground">
               {t("recordingPage.details")}
@@ -1254,6 +1256,7 @@ export default function RecordingPage() {
             currentMs={currentMs}
             currentUserEmail={session?.email}
             enableComments={recording.enableComments}
+            canComment={canComment}
             onSeek={(ms) => playerRef.current?.seek(ms)}
             queryKey={[
               "action",
@@ -1615,7 +1618,7 @@ export default function RecordingPage() {
                   onCommentClick={openCommentsPanel}
                   className="h-full w-full rounded-none sm:rounded-xl"
                 />
-                {commentOpen ? (
+                {commentOpen && canComment ? (
                   <TimestampedCommentBar
                     recordingId={recording.id}
                     atMs={commentAtMs}
@@ -1667,21 +1670,24 @@ export default function RecordingPage() {
                     </NavLink>
                   ) : null}
                   <div className="flex flex-wrap items-center gap-2">
-                    <TimestampedCommentButton
-                      enableComments={recording.enableComments}
-                      className="shrink-0"
-                      onOpen={() => {
-                        if (isCompactLayout) {
-                          openCommentsPanel();
-                          return;
-                        }
-                        setCommentAtMs(resolvePlaybackMs());
-                        setCommentOpen(true);
-                      }}
-                    />
+                    {canComment ? (
+                      <TimestampedCommentButton
+                        enableComments={recording.enableComments}
+                        canComment={canComment}
+                        className="shrink-0"
+                        onOpen={() => {
+                          if (isCompactLayout) {
+                            openCommentsPanel();
+                            return;
+                          }
+                          setCommentAtMs(resolvePlaybackMs());
+                          setCommentOpen(true);
+                        }}
+                      />
+                    ) : null}
                     {recording.enableReactions ? (
                       <ReactionsTray
-                        disabled={!recording.enableReactions}
+                        disabled={!recording.enableReactions || !canComment}
                         onReact={(emoji) => {
                           tracking.reportReaction(emoji);
                           const liveMs = resolvePlaybackMs();

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

@@ -518,6 +518,7 @@ export default function ShareRoute() {
     | "owner"
     | "admin"
     | "editor"
+    | "commenter"
     | "viewer"
     | undefined;
   const viewerCanEdit =
@@ -525,6 +526,11 @@ export default function ShareRoute() {
     viewerRole === "owner" ||
     viewerRole === "admin" ||
     viewerRole === "editor";
+  const viewerCanComment =
+    viewerRole === "owner" ||
+    viewerRole === "admin" ||
+    viewerRole === "editor" ||
+    viewerRole === "commenter";
   const viewerIsOwner = Boolean(dataQ.data?.data?.viewer?.isOwner);
   const viewerCanOpenDashboard = Boolean(
     dataQ.data?.data?.viewer?.canOpenDashboard,
@@ -1048,6 +1054,7 @@ export default function ShareRoute() {
             <div className="flex max-w-full flex-col items-stretch gap-2 sm:items-end">
               {recording.enableReactions ? (
                 <ReactionsTray
+                  disabled={!viewerCanComment}
                   onReact={(emoji) => {
                     if (!session) {
                       requireSignIn("react");
@@ -1182,6 +1189,7 @@ export default function ShareRoute() {
               currentMs={currentMs}
               currentUserEmail={session?.email}
               enableComments={recording.enableComments}
+              canComment={viewerCanComment}
               onSeek={(ms) => playerRef.current?.seek(ms)}
               onUnauthenticated={requireSignIn}
               queryKey={[

package/corpus/templates/clips/changelog/2026-07-23-meeting-recording-meters-and-dismissed-prompts.md

@@ -3,4 +3,4 @@ type: fixed
 date: 2026-07-23
 ---
 
-Meeting recording meters now use thin, responsive audio bars, while dismissed reminders stay dismissed and frontmost Zoom detection stays quiet unless Auto mode is enabled.
+Meeting recording meters now use thin, responsive audio bars, and dismissed reminders stay dismissed.

package/corpus/templates/clips/changelog/2026-08-11-clips-asks-to-take-notes-again-when-you-join-an-adhoc-zoom-o.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-08-11
+---
+
+Clips asks to take notes again when you join an adhoc Zoom or Teams call, and now waits until the call is actually live before offering.

package/corpus/templates/clips/changelog/2026-08-12-viewers-are-read-only-and-commenters-can-comment.md

@@ -0,0 +1,6 @@
+---
+type: improved
+date: 2026-08-12
+---
+
+Shared recordings now distinguish read-only viewers from commenters who can comment and react without editing the recording.

package/corpus/templates/clips/desktop/src/app.tsx

@@ -2629,7 +2629,7 @@ export function App() {
       isRecording ||
       recordingFlowActive,
     width:
-      popoverView === "settings" ? 920 : popoverView === "memory" ? 440 : 360,
+      popoverView === "settings" ? 920 : popoverView === "memory" ? 440 : 320,
   });
 
   const loadPendingUploads = useCallback(async () => {