@agent-native/core 0.157.0 → 0.157.2

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

@@ -6,8 +6,8 @@ import {
   useSession,
 } from "@agent-native/core/client/hooks";
 import { useT } from "@agent-native/core/client/i18n";
+import { ShareAgentsSection } from "@agent-native/toolkit/sharing";
 import {
-  IconChevronDown,
   IconCode,
   IconExternalLink,
   IconLink,
@@ -35,11 +35,6 @@ 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";
@@ -52,6 +47,7 @@ import { Switch } from "@/components/ui/switch";
 import { Tabs, TabsList, TabsTrigger, TabsContent } from "@/components/ui/tabs";
 import { cn } from "@/lib/utils";
 
+import { buildAgentApiUrls } from "../../../shared/agent-context";
 import { buildEmailPreviewMarkup } from "../../../shared/email-preview";
 import { isLoomEmbedUrl } from "../../../shared/loom";
 import { withShareAttribution } from "../../../shared/share-attribution";
@@ -62,6 +58,14 @@ function absoluteAppUrl(path: string): string {
   return new URL(appPath(path), window.location.origin).toString();
 }
 
+function absolutePublicAgentContextUrl(recordingId: string): string {
+  if (typeof window === "undefined") return "";
+  return buildAgentApiUrls(recordingId, {
+    origin: window.location.origin,
+    basePath: appPath("/").replace(/\/$/, ""),
+  }).contextUrl;
+}
+
 export interface ShareRecordingPopoverProps {
   recordingId: string;
   recordingTitle?: string;
@@ -375,6 +379,14 @@ function LinkTab({
   const sharesLoaded = visibility !== null;
   const visibilityPending = isPending || sharesQuery.isLoading;
   const isLoomRecording = isLoomRecordingProp || isLoomEmbedUrl(videoUrl);
+  const needsScopedAgentContext = !isPublic || hasPassword !== false;
+  const publicAgentContextUrl = useMemo(
+    () =>
+      isPublic && hasPassword === false
+        ? absolutePublicAgentContextUrl(recordingId)
+        : "",
+    [hasPassword, isPublic, recordingId],
+  );
   const emailPreviewThumbnailUrl = useMemo(() => {
     if (!isPublic || hasPassword !== false || !sharesLoaded) return null;
     const variant = preferredThumbnailVariant({
@@ -438,10 +450,10 @@ function LinkTab({
     try {
       const result = (await createAgentLinkAsyncRef.current({
         recordingId,
-      })) as { url?: string };
+      })) as { contextUrl?: string };
       if (agentLinkRequestIdRef.current !== requestId) return;
-      if (result?.url) {
-        setAgentContextUrl(result.url);
+      if (result?.contextUrl) {
+        setAgentContextUrl(result.contextUrl);
       } else {
         setAgentLinkError(true);
       }
@@ -457,20 +469,30 @@ function LinkTab({
     setAgentLinkError(false);
     if (!sharesLoaded) return;
 
-    if (!isPublic) {
+    if (needsScopedAgentContext) {
       void loadAgentContextUrl();
     }
 
     return () => {
       agentLinkRequestIdRef.current += 1;
     };
-  }, [isPublic, loadAgentContextUrl, recordingId, sharesLoaded, visibility]);
+  }, [
+    loadAgentContextUrl,
+    needsScopedAgentContext,
+    recordingId,
+    sharesLoaded,
+    visibility,
+  ]);
 
-  const agentLink = isPublic ? shareUrl : agentContextUrl;
+  const agentLink = isPublic
+    ? publicAgentContextUrl || agentContextUrl
+    : agentContextUrl;
   const agentShareDisabled =
     visibilityPending ||
     !sharesLoaded ||
-    (!isPublic && (isPending || createAgentLink.isPending || !agentContextUrl));
+    !agentLink ||
+    (needsScopedAgentContext &&
+      (isPending || createAgentLink.isPending || !agentContextUrl));
   const agentPrompt = agentLink
     ? t("shareDialog.agentPrompt", { agentContextUrl: agentLink })
     : "";
@@ -529,71 +551,49 @@ function LinkTab({
         disabled={visibilityPending || !sharesLoaded}
       />
 
-      {!isPublic ? (
-        <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.shareWithAgents")}
-                value={agentLink}
-                disabled={agentShareDisabled}
-              />
-              {sharesLoaded ? (
-                <>
+      <ShareAgentsSection
+        label={t("shareDialog.shareWithAgents")}
+        open={agentDetailsOpen}
+        onOpenChange={setAgentDetailsOpen}
+        contentClassName="clips-collapsible-content"
+      >
+        <div className="space-y-2">
+          <CopyField
+            label={t("shareDialog.shareLink")}
+            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.agentTokenDescription")}
+                    {t("shareDialog.agentLinkUnavailable")}
                   </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}
-                  />
-                </>
+                  <Button
+                    type="button"
+                    variant="ghost"
+                    size="sm"
+                    className="h-7"
+                    onClick={() => void loadAgentContextUrl()}
+                    disabled={createAgentLink.isPending}
+                  >
+                    {t("shareDialog.retryAgentLink")}
+                  </Button>
+                </div>
               ) : null}
-            </div>
-          </CollapsibleContent>
-        </Collapsible>
-      ) : null}
+              <CopyField
+                label={t("shareDialog.copyAgentPrompt")}
+                value={agentPrompt}
+                disabled={agentShareDisabled}
+              />
+            </>
+          ) : null}
+        </div>
+      </ShareAgentsSection>
 
       {showMakePublic ? (
         <MakePublicCard

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

@@ -8,10 +8,6 @@ import {
   isLikelyPhoneMicLabel,
   type AudioInputFallback,
 } from "@shared/media-device-selection";
-import {
-  createMicAudioCleanup,
-  type MicAudioCleanupHandle,
-} from "@shared/mic-audio-cleanup";
 import {
   SCREEN_CAPTURE_FRAME_RATE,
   screenCaptureDisplayOptions,
@@ -509,7 +505,6 @@ export class RecorderEngine {
   private cameraComposite: CameraCompositeHandle | null = null;
   private audioMixCtx: AudioContext | null = null;
   private audioMixSources: MediaStreamAudioSourceNode[] = [];
-  private micAudioCleanup: MicAudioCleanupHandle[] = [];
   private recorder: MediaRecorder | null = null;
   private mimeType: string = "video/webm";
 
@@ -1360,7 +1355,6 @@ export class RecorderEngine {
     // Full stream teardown happens in the finally block below.
     this.cameraLive = false;
     this.audioMixSources = [];
-    this.stopMicAudioCleanup();
     this.audioMixCtx?.close().catch(() => {});
     this.audioMixCtx = null;
     for (const s of [this.cameraStream, this.rawCameraStream, this.micStream]) {
@@ -1828,26 +1822,15 @@ export class RecorderEngine {
     this.audioMixSources = [];
     const dest = ctx.createMediaStreamDestination();
     for (const input of audioInputs) {
-      let track = input.track;
-      if (input.isMicrophone) {
-        const cleanup = createMicAudioCleanup(new MediaStream([track]), {
-          audioContext: ctx,
-        });
-        this.micAudioCleanup.push(cleanup);
-        track = cleanup.stream.getAudioTracks()[0] ?? track;
-      }
-      const source = ctx.createMediaStreamSource(new MediaStream([track]));
+      const source = ctx.createMediaStreamSource(
+        new MediaStream([input.track]),
+      );
       source.connect(dest);
       this.audioMixSources.push(source);
     }
     return dest.stream.getAudioTracks()[0];
   }
 
-  private stopMicAudioCleanup(): void {
-    for (const cleanup of this.micAudioCleanup) cleanup.stop();
-    this.micAudioCleanup = [];
-  }
-
   private buildCombinedStream(): MediaStream {
     if (this.opts.mode === "screen") {
       return this.buildDisplayRecordingStream();
@@ -2382,7 +2365,6 @@ export class RecorderEngine {
     // aren't mistaken for a disconnect.
     this.cameraLive = false;
     this.audioMixSources = [];
-    this.stopMicAudioCleanup();
     this.audioMixCtx?.close().catch(() => {});
     this.audioMixCtx = null;
     this.cameraComposite?.cleanup();

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

@@ -4,9 +4,8 @@ import {
   useActionQuery,
 } from "@agent-native/core/client/hooks";
 import { useT } from "@agent-native/core/client/i18n";
+import { ShareCopyRow } from "@agent-native/toolkit/sharing";
 import {
-  IconCheck,
-  IconLink,
   IconLock,
   IconSend2,
   IconTrash,
@@ -281,35 +280,19 @@ export function CopyField({
   description?: string;
 }) {
   const t = useT();
-  const [copied, setCopied] = useState(false);
-  const copy = () => {
-    if (disabled) return;
-    copyToClipboard(value);
-    setCopied(true);
-    setTimeout(() => setCopied(false), 1400);
-  };
   return (
-    <div className="flex items-center justify-between gap-3">
-      <div className="min-w-0">
-        {label ? <div className="text-sm font-medium">{label}</div> : null}
-        {description ? (
-          <div className="text-xs text-muted-foreground">{description}</div>
-        ) : null}
-      </div>
-      <div aria-live="polite" className="shrink-0">
-        <Button
-          type="button"
-          variant="outline"
-          size="sm"
-          onClick={copy}
-          disabled={disabled}
-          className="h-9"
-        >
-          {copied ? <IconCheck size={14} /> : <IconLink size={14} />}
-          {copied ? t("recordRoute.linkCopied") : t("shareUi.copy")}
-        </Button>
-      </div>
-    </div>
+    <ShareCopyRow
+      label={label}
+      value={value}
+      description={description}
+      disabled={disabled}
+      copyLabel={t("shareUi.copy")}
+      copiedLabel={t("recordRoute.linkCopied")}
+      onCopy={(nextValue) => {
+        copyToClipboard(nextValue);
+        return true;
+      }}
+    />
   );
 }
 

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

@@ -256,6 +256,16 @@ const messages = {
     passwordProtected: "This clip is password-protected",
     linkExpired: "Link expired",
     linkExpiredMessage: "The creator set an expiry on this share link.",
+    privateClip: "Private clip",
+    privateClipMessage:
+      "This clip is private. Request access and the owner will be notified.",
+    privateClipSignedOutMessage:
+      "This clip is private. Sign in to request access from the owner.",
+    requestAccess: "Request access",
+    requestingAccess: "Requesting access...",
+    accessRequested: "Access requested",
+    accessRequestSent: "The clip owner was notified.",
+    accessRequestFailed: "Couldn't request access. Try again.",
     clipUnavailable: "Clip unavailable",
     clipUnavailableMessage:
       "This recording isn't public, or the link is invalid. If it's your clip, sign in to check access.",

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

@@ -5,6 +5,7 @@ import {
   useActionQuery,
 } from "@agent-native/core/client/hooks";
 import { useT } from "@agent-native/core/client/i18n";
+import { ShareTrigger } from "@agent-native/toolkit/sharing";
 import {
   IconArrowLeft,
   IconCheck,
@@ -18,7 +19,6 @@ import {
   IconNotes,
   IconPlayerStop,
   IconRefresh,
-  IconShare3,
   IconTrash,
   IconUsers,
 } from "@tabler/icons-react";
@@ -711,10 +711,10 @@ export default function MeetingDetailRoute() {
                 Boolean(data?.transcript?.fullText?.trim()))
             }
           >
-            <Button size="sm" className="shrink-0 gap-1.5">
-              <IconShare3 className="h-4 w-4" />
-              {t("meetingDetail.share")}
-            </Button>
+            <ShareTrigger
+              label={t("meetingDetail.share")}
+              className="shrink-0"
+            />
           </ShareMeetingPopover>
           {canEdit && (
             <AlertDialog open={deleteOpen} onOpenChange={setDeleteOpen}>

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

@@ -16,6 +16,7 @@ import {
   isHumanReadableDocumentTitle,
   normalizeDocumentTitle,
 } from "@agent-native/core/shared";
+import { ShareTrigger } from "@agent-native/toolkit/sharing";
 import {
   BUILDER_CREDITS_UPGRADE_URL,
   type BuilderCreditsStatus,
@@ -33,7 +34,6 @@ import {
 } from "@shared/share-attribution";
 import type { WorkflowKind } from "@shared/workflow";
 import {
-  IconShare3,
   IconArrowLeft,
   IconChevronDown,
   IconCalendar,
@@ -1002,12 +1002,10 @@ export default function RecordingPage() {
               hasPassword={Boolean(recording.hasPassword)}
               viewerReshareOnly={viewerReshareOnly}
             >
-              <Button className="shrink-0 gap-1.5" size="sm">
-                {recording.visibility !== "public" ? (
-                  <IconShare3 className="h-4 w-4" />
-                ) : null}
-                {t("recordingPage.share")}
-              </Button>
+              <ShareTrigger
+                label={t("recordingPage.share")}
+                className="shrink-0"
+              />
             </ShareRecordingPopover>
           </header>
 
@@ -1570,15 +1568,10 @@ export default function RecordingPage() {
               hasPassword={Boolean(recording.hasPassword)}
               viewerReshareOnly={viewerReshareOnly}
             >
-              <Button
-                className="shrink-0 gap-1.5 bg-primary text-primary-foreground hover:bg-primary/90"
-                size="sm"
-              >
-                {recording.visibility !== "public" ? (
-                  <IconShare3 className="h-4 w-4" />
-                ) : null}
-                {t("recordingPage.share")}
-              </Button>
+              <ShareTrigger
+                label={t("recordingPage.share")}
+                className="shrink-0"
+              />
             </ShareRecordingPopover>
           ) : null}