@agent-native/core 0.125.0 → 0.127.1

package/corpus/templates/assets/actions/edit-image.ts

@@ -1,9 +1,11 @@
 import { defineAction } from "@agent-native/core";
+import type { ActionRunContext } from "@agent-native/core/action";
 import { z } from "zod";
 
 import { IMAGE_MODELS, IMAGE_QUALITY_TIERS } from "../shared/api.js";
 import { getAssetOrThrow } from "./_helpers.js";
 import generateImage from "./generate-image.js";
+import { resolveLiveBatchContinuation } from "./variant-slots.js";
 
 export default defineAction({
   description:
@@ -24,26 +26,37 @@ export default defineAction({
     contextModeOverride: z.literal("off").optional(),
   }),
   parallelSafe: true,
-  run: async (args) => {
+  run: async (args, context?: ActionRunContext) => {
     const asset = await getAssetOrThrow(args.assetId);
-    return generateImage.run({
+    const continuation = await resolveLiveBatchContinuation({
+      threadId: context?.threadId,
       libraryId: asset.libraryId,
-      collectionId: asset.collectionId ?? undefined,
-      prompt: args.instruction,
-      aspectRatio: (asset.aspectRatio ?? "16:9") as any,
-      imageSize: (asset.imageSize ?? "2K") as any,
-      model: args.model,
-      tier: args.tier,
-      intent: "edit",
-      styleStrength: "balanced",
-      referenceAssetIds: [],
-      includeLogo: false,
-      groundingMode: "off",
-      subjectAssetId: asset.id,
-      slotId: args.slotId,
-      source: args.source,
-      callerAppId: args.callerAppId,
-      contextModeOverride: args.contextModeOverride,
     });
+    return generateImage.run(
+      {
+        libraryId: asset.libraryId,
+        collectionId:
+          asset.collectionId ?? continuation?.collectionId ?? undefined,
+        presetId: continuation?.presetId ?? undefined,
+        sessionId: continuation?.sessionId ?? undefined,
+        prompt: args.instruction,
+        aspectRatio: (asset.aspectRatio ?? "16:9") as any,
+        imageSize: (asset.imageSize ?? "2K") as any,
+        model: args.model,
+        tier: args.tier,
+        intent: "edit",
+        styleStrength: "balanced",
+        referenceAssetIds: [],
+        includeLogo: false,
+        groundingMode: "off",
+        subjectAssetId: asset.id,
+        slotId: args.slotId,
+        variantBatchId: continuation?.variantBatchId,
+        source: args.source,
+        callerAppId: args.callerAppId,
+        contextModeOverride: args.contextModeOverride,
+      },
+      context,
+    );
   },
 });

package/corpus/templates/assets/actions/refine-image.ts

@@ -1,4 +1,5 @@
 import { defineAction } from "@agent-native/core";
+import type { ActionRunContext } from "@agent-native/core/action";
 import { z } from "zod";
 
 import { parseJson } from "../server/lib/json.js";
@@ -8,6 +9,7 @@ import {
   requireGenerationSessionInLibrary,
 } from "./_helpers.js";
 import generateImage from "./generate-image.js";
+import { resolveLiveBatchContinuation } from "./variant-slots.js";
 
 export default defineAction({
   description:
@@ -31,19 +33,22 @@ export default defineAction({
     contextModeOverride: z.literal("off").optional(),
   }),
   parallelSafe: true,
-  run: async ({
-    assetId,
-    feedback,
-    presetId,
-    sessionId,
-    model,
-    aspectRatio,
-    imageSize,
-    slotId,
-    source,
-    callerAppId,
-    contextModeOverride,
-  }) => {
+  run: async (
+    {
+      assetId,
+      feedback,
+      presetId,
+      sessionId,
+      model,
+      aspectRatio,
+      imageSize,
+      slotId,
+      source,
+      callerAppId,
+      contextModeOverride,
+    },
+    context?: ActionRunContext,
+  ) => {
     const asset = await getAssetOrThrow(assetId);
     if (sessionId) {
       await requireGenerationSessionInLibrary(sessionId, asset.libraryId);
@@ -57,23 +62,32 @@ export default defineAction({
       "",
       "Preserve the strongest successful parts of the prior candidate unless the feedback contradicts them.",
     ].join("\n");
-    return generateImage.run({
+    const continuation = await resolveLiveBatchContinuation({
+      threadId: context?.threadId,
       libraryId: asset.libraryId,
-      collectionId: asset.collectionId ?? undefined,
-      presetId,
-      sessionId,
-      prompt,
-      aspectRatio: (aspectRatio ?? asset.aspectRatio ?? "16:9") as any,
-      imageSize: (imageSize ?? asset.imageSize ?? "2K") as any,
-      model: (model ?? asset.model ?? "gemini-3.1-flash-image") as any,
-      categories: metadata.category ? [metadata.category] : undefined,
-      includeLogo: false,
-      groundingMode: "auto",
-      sourceAssetId: asset.id,
-      slotId,
-      source,
-      callerAppId,
-      contextModeOverride,
     });
+    return generateImage.run(
+      {
+        libraryId: asset.libraryId,
+        collectionId:
+          asset.collectionId ?? continuation?.collectionId ?? undefined,
+        presetId: presetId ?? continuation?.presetId ?? undefined,
+        sessionId: sessionId ?? continuation?.sessionId ?? undefined,
+        prompt,
+        aspectRatio: (aspectRatio ?? asset.aspectRatio ?? "16:9") as any,
+        imageSize: (imageSize ?? asset.imageSize ?? "2K") as any,
+        model: (model ?? asset.model ?? "gemini-3.1-flash-image") as any,
+        categories: metadata.category ? [metadata.category] : undefined,
+        includeLogo: false,
+        groundingMode: "auto",
+        sourceAssetId: asset.id,
+        slotId,
+        variantBatchId: continuation?.variantBatchId,
+        source,
+        callerAppId,
+        contextModeOverride,
+      },
+      context,
+    );
   },
 });

package/corpus/templates/assets/actions/restyle-image.ts

@@ -1,4 +1,5 @@
 import { defineAction } from "@agent-native/core";
+import type { ActionRunContext } from "@agent-native/core/action";
 import { z } from "zod";
 
 import {
@@ -10,6 +11,7 @@ import {
 } from "../shared/api.js";
 import { getAssetOrThrow } from "./_helpers.js";
 import generateImage from "./generate-image.js";
+import { resolveLiveBatchContinuation } from "./variant-slots.js";
 
 export default defineAction({
   description:
@@ -38,30 +40,39 @@ export default defineAction({
     contextModeOverride: z.literal("off").optional(),
   }),
   parallelSafe: true,
-  run: async (args) => {
+  run: async (args, context?: ActionRunContext) => {
     const subject = await getAssetOrThrow(args.subjectAssetId);
     const prompt =
       args.prompt?.trim() ||
       "Apply this library's brand style to the subject image while preserving the subject, pose, composition, and framing.";
-    return generateImage.run({
+    const continuation = await resolveLiveBatchContinuation({
+      threadId: context?.threadId,
       libraryId: subject.libraryId,
-      collectionId: subject.collectionId ?? undefined,
-      presetId: args.presetId,
-      sessionId: args.sessionId,
-      prompt,
-      aspectRatio: (args.aspectRatio ?? subject.aspectRatio ?? "16:9") as any,
-      imageSize: (args.imageSize ?? subject.imageSize ?? "2K") as any,
-      model: args.model,
-      tier: args.tier,
-      intent: "restyle",
-      styleStrength: args.styleStrength,
-      includeLogo: false,
-      groundingMode: "auto",
-      subjectAssetId: subject.id,
-      slotId: args.slotId,
-      source: args.source,
-      callerAppId: args.callerAppId,
-      contextModeOverride: args.contextModeOverride,
     });
+    return generateImage.run(
+      {
+        libraryId: subject.libraryId,
+        collectionId:
+          subject.collectionId ?? continuation?.collectionId ?? undefined,
+        presetId: args.presetId ?? continuation?.presetId ?? undefined,
+        sessionId: args.sessionId ?? continuation?.sessionId ?? undefined,
+        prompt,
+        aspectRatio: (args.aspectRatio ?? subject.aspectRatio ?? "16:9") as any,
+        imageSize: (args.imageSize ?? subject.imageSize ?? "2K") as any,
+        model: args.model,
+        tier: args.tier,
+        intent: "restyle",
+        styleStrength: args.styleStrength,
+        includeLogo: false,
+        groundingMode: "auto",
+        subjectAssetId: subject.id,
+        slotId: args.slotId,
+        variantBatchId: continuation?.variantBatchId,
+        source: args.source,
+        callerAppId: args.callerAppId,
+        contextModeOverride: args.contextModeOverride,
+      },
+      context,
+    );
   },
 });

package/corpus/templates/assets/actions/variant-slots.ts

@@ -177,6 +177,32 @@ export async function readVariantState(
   return withVariantStateLock(() => readVariantStateUnlocked(scopeId));
 }
 
+// Iterations (refine/edit/restyle) are a continuation of what is already on
+// screen for this thread, not a new generation topic: they should append into
+// the live tray instead of tripping the "new batch/run" reset in
+// isSameVariantScope. Passing the current tray's batch/run id plus its
+// collection/preset/session back through keeps every isSameVariantScope check
+// satisfied.
+export async function resolveLiveBatchContinuation(input: {
+  threadId?: string | null;
+  libraryId: string;
+}): Promise<{
+  variantBatchId: string;
+  collectionId: string | null;
+  presetId: string | null;
+  sessionId: string | null;
+} | null> {
+  if (!input.threadId) return null;
+  const state = await readVariantState(input.threadId);
+  if (!state || state.libraryId !== input.libraryId) return null;
+  return {
+    variantBatchId: state.batchId ?? state.runId,
+    collectionId: state.collectionId ?? null,
+    presetId: state.presetId ?? null,
+    sessionId: state.sessionId ?? null,
+  };
+}
+
 export async function writeVariantState(
   state: AssetVariantState,
   scopeId?: string | null,

package/corpus/templates/assets/app/components/generation/GenerationResults.tsx

@@ -89,6 +89,9 @@ export function GenerationResults({ threadId }: { threadId: string | null }) {
   const queryClient = useQueryClient();
   const [clearAllOpen, setClearAllOpen] = useState(false);
   const [previewSlotId, setPreviewSlotId] = useState<string | null>(null);
+  const trayScrollRef = useRef<HTMLDivElement | null>(null);
+  const [canScrollLeft, setCanScrollLeft] = useState(false);
+  const [canScrollRight, setCanScrollRight] = useState(false);
   const stateKey = variantStateKey(threadId);
   const stateQueryKey = useMemo(() => ["app-state", stateKey], [stateKey]);
   const { data: variants } = useQuery({
@@ -129,6 +132,21 @@ export function GenerationResults({ threadId }: { threadId: string | null }) {
         ),
     [variants?.slots],
   );
+  // Variant numbers reflect generation order (oldest = 1), not display order:
+  // refined candidates render first but keep the next number in sequence
+  // instead of stealing "Variant 1" from the newest-first display sort above.
+  const variantNumberBySlotId = useMemo(() => {
+    const map = new Map<string, number>();
+    (variants?.slots ?? [])
+      .slice()
+      .sort(
+        (left, right) =>
+          slotTime(left) - slotTime(right) ||
+          left.slotId.localeCompare(right.slotId),
+      )
+      .forEach((slot, index) => map.set(slot.slotId, index + 1));
+    return map;
+  }, [variants?.slots]);
   const belongsToThread = Boolean(
     variants &&
     (threadId ? variants.threadId === threadId : !variants.threadId),
@@ -165,6 +183,25 @@ export function GenerationResults({ threadId }: { threadId: string | null }) {
     [previewSlotId, slots],
   );
 
+  const updateScrollEdges = () => {
+    const el = trayScrollRef.current;
+    if (!el) return;
+    setCanScrollLeft(el.scrollLeft > 1);
+    setCanScrollRight(el.scrollLeft + el.clientWidth < el.scrollWidth - 1);
+  };
+
+  useEffect(() => {
+    // Re-measure after the slot list changes size (new/removed candidates)
+    // since that can flip whether either arrow should be enabled.
+    updateScrollEdges();
+  }, [slots.length]);
+
+  const scrollTrayBy = (direction: 1 | -1) => {
+    const el = trayScrollRef.current;
+    if (!el) return;
+    el.scrollBy({ left: direction * el.clientWidth * 0.9, behavior: "smooth" });
+  };
+
   if (!belongsToThread || !variants) return null;
   if (slots.length === 0) return null;
 
@@ -296,6 +333,7 @@ export function GenerationResults({ threadId }: { threadId: string | null }) {
       <GenerationPreviewDialog
         slot={previewSlot}
         slots={slots}
+        variantNumberBySlotId={variantNumberBySlotId}
         prompt={variants.prompt}
         libraryTitle={libraryTitle}
         isSaving={saveGenerated.isPending}
@@ -351,22 +389,50 @@ export function GenerationResults({ threadId }: { threadId: string | null }) {
             </Button>
           </div>
 
-          <div className="max-h-[min(640px,52vh)] overflow-y-auto p-3">
-            <div className="assets-library-grid grid grid-cols-2 gap-3 sm:grid-cols-3">
-              {slots.map((slot, index) => (
-                <GenerationDraftCard
-                  key={slot.slotId}
-                  slot={slot}
-                  variantNumber={index + 1}
-                  isSaving={saveGenerated.isPending}
-                  isDismissing={dismissSlot.isPending}
-                  onPreview={() => setPreviewSlotId(slot.slotId)}
-                  onSave={() => saveSlot(slot)}
-                  onRefine={() => refineSlot(slot, index + 1)}
-                  onDismiss={() => dismissSlotById(slot)}
-                />
-              ))}
+          <div className="relative">
+            <div
+              ref={trayScrollRef}
+              onScroll={updateScrollEdges}
+              className="assets-library-tray flex gap-3 overflow-x-auto scroll-smooth p-3"
+            >
+              {slots.map((slot) => {
+                const variantNumber =
+                  variantNumberBySlotId.get(slot.slotId) ?? 1;
+                return (
+                  <GenerationDraftCard
+                    key={slot.slotId}
+                    slot={slot}
+                    variantNumber={variantNumber}
+                    isSaving={saveGenerated.isPending}
+                    isDismissing={dismissSlot.isPending}
+                    onPreview={() => setPreviewSlotId(slot.slotId)}
+                    onSave={() => saveSlot(slot)}
+                    onRefine={() => refineSlot(slot, variantNumber)}
+                    onDismiss={() => dismissSlotById(slot)}
+                  />
+                );
+              })}
             </div>
+            {canScrollLeft ? (
+              <button
+                type="button"
+                aria-label={t("library.previousImage")}
+                onClick={() => scrollTrayBy(-1)}
+                className="absolute left-1 top-1/2 z-10 inline-flex h-8 w-8 -translate-y-1/2 items-center justify-center rounded-full border border-border/80 bg-background/90 text-foreground shadow-sm transition hover:bg-accent focus:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+              >
+                <IconChevronLeft className="h-4 w-4" />
+              </button>
+            ) : null}
+            {canScrollRight ? (
+              <button
+                type="button"
+                aria-label={t("library.nextImage")}
+                onClick={() => scrollTrayBy(1)}
+                className="absolute right-1 top-1/2 z-10 inline-flex h-8 w-8 -translate-y-1/2 items-center justify-center rounded-full border border-border/80 bg-background/90 text-foreground shadow-sm transition hover:bg-accent focus:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+              >
+                <IconChevronRight className="h-4 w-4" />
+              </button>
+            ) : null}
           </div>
         </div>
       </section>
@@ -399,7 +465,7 @@ function GenerationDraftCard({
     number: variantNumber,
   });
   return (
-    <div className="overflow-hidden rounded-lg border border-border/80 bg-background transition hover:border-foreground/25 hover:bg-muted/10">
+    <div className="w-36 shrink-0 overflow-hidden rounded-lg border border-border/80 bg-background transition hover:border-foreground/25 hover:bg-muted/10 sm:w-44">
       <div className="group relative">
         <button
           type="button"
@@ -510,6 +576,7 @@ function GenerationDraftCard({
 function GenerationPreviewDialog({
   slot,
   slots,
+  variantNumberBySlotId,
   prompt,
   libraryTitle,
   isSaving,
@@ -522,6 +589,7 @@ function GenerationPreviewDialog({
 }: {
   slot: VariantSlot | null;
   slots: VariantSlot[];
+  variantNumberBySlotId: Map<string, number>;
   prompt: string;
   libraryTitle: string | null;
   isSaving: boolean;
@@ -553,7 +621,7 @@ function GenerationPreviewDialog({
   const sources = slot ? assetPreviewSources(slot, "preview") : [];
   const src = sources[0];
   const variantNumber = slot
-    ? slots.findIndex((item) => item.slotId === slot.slotId) + 1
+    ? (variantNumberBySlotId.get(slot.slotId) ?? 0)
     : 0;
   const variantLabel = t("library.variantWithNumber", {
     number: variantNumber,

package/corpus/templates/clips/changelog/2026-07-27-share-notification-emails-now-include-a-clickable-recording-.md

@@ -0,0 +1,6 @@
+---
+type: added
+date: 2026-07-27
+---
+
+Share notification emails now include a clickable recording thumbnail that opens the clip

package/corpus/templates/clips/server/db/index.ts

@@ -1,8 +1,12 @@
 import { createGetDb, getDbExec } from "@agent-native/core/db";
-import { getAppProductionUrl } from "@agent-native/core/server";
+import { organizations } from "@agent-native/core/org";
 import { registerShareableResource } from "@agent-native/core/sharing";
 import { eq } from "drizzle-orm";
 
+import {
+  absoluteUrl,
+  recordingShareHeroHtml,
+} from "../lib/share-email-hero.js";
 import * as schema from "./schema.js";
 
 export const getDb = createGetDb(schema);
@@ -22,9 +26,20 @@ async function orgBrandLogoUrl(
     .from(schema.organizationSettings)
     .where(eq(schema.organizationSettings.organizationId, organizationId))
     .limit(1);
-  const logo = row?.brandLogoUrl?.trim();
-  if (!logo) return undefined;
-  return logo.startsWith("/") ? `${getAppProductionUrl()}${logo}` : logo;
+  return absoluteUrl(row?.brandLogoUrl);
+}
+
+/** Show the sharing org's name beside the logo instead of the app name. */
+async function orgBrandName(
+  organizationId: string | undefined,
+): Promise<string | undefined> {
+  if (!organizationId) return undefined;
+  const [row] = await getDb()
+    .select({ name: organizations.name })
+    .from(organizations)
+    .where(eq(organizations.id, organizationId))
+    .limit(1);
+  return row?.name?.trim() || undefined;
 }
 
 registerShareableResource({
@@ -34,8 +49,15 @@ registerShareableResource({
   displayName: "Recording",
   titleColumn: "title",
   getResourcePath: (recording) => `/r/${recording.id}`,
-  getShareEmailLogoUrl: (recording) =>
-    orgBrandLogoUrl(recording.organizationId),
+  getLogoUrl: (recording) => orgBrandLogoUrl(recording.organizationId),
+  getBrandName: (recording) => orgBrandName(recording.organizationId),
+  // Replies reach the person who shared the clip; the sending address stays
+  // the verified one so SPF/DKIM still pass.
+  getSender: (_recording, ctx) => ({
+    fromName: `${ctx.sender.name} via Clips`,
+    replyTo: ctx.sender.email,
+  }),
+  getHeroHtml: (recording, ctx) => recordingShareHeroHtml(recording, ctx),
   getDb,
   ownerAccessIgnoresOrg: true,
 });

package/corpus/templates/clips/server/lib/share-email-hero.ts

@@ -0,0 +1,105 @@
+import {
+  getAppProductionUrl,
+  withConfiguredAppBasePath,
+} from "@agent-native/core/server";
+
+/**
+ * Origin plus the configured mount path. Deployments served under
+ * APP_BASE_PATH (e.g. `/clips`) would otherwise link email assets at the
+ * gateway root, where nothing is served.
+ */
+function appBaseUrl(): string {
+  return withConfiguredAppBasePath(getAppProductionUrl());
+}
+
+/** Make a stored URL absolute for use in emails (relative paths won't load). */
+export function absoluteUrl(
+  url: string | null | undefined,
+): string | undefined {
+  const trimmed = url?.trim();
+  if (!trimmed) return undefined;
+  return trimmed.startsWith("/") ? `${appBaseUrl()}${trimmed}` : trimmed;
+}
+
+function escapeAttr(s: string): string {
+  return s
+    .replace(/&/g, "&")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/"/g, "&quot;")
+    .replace(/'/g, "&#39;");
+}
+
+/**
+ * Percent-encode characters that could terminate a CSS `url('…')`. A style
+ * attribute is HTML-decoded before it is parsed as CSS, so HTML escaping alone
+ * does not protect the CSS context — an escaped quote decodes back to a real
+ * one and lets the value break out into further declarations.
+ */
+function escapeCssUrl(url: string): string {
+  return url.replace(
+    /['"()\\\s]/g,
+    (c) => `%${c.charCodeAt(0).toString(16).toUpperCase().padStart(2, "0")}`,
+  );
+}
+
+function isHttpUrl(value: string): boolean {
+  try {
+    const { protocol } = new URL(value);
+    return protocol === "https:" || protocol === "http:";
+  } catch {
+    return false;
+  }
+}
+
+export type ShareHeroRecording = {
+  thumbnailUrl?: string | null;
+  animatedThumbnailUrl?: string | null;
+};
+
+/**
+ * Build the share-email preview for a recording: a 16:9 thumbnail with a
+ * centered play badge, linking to the clip. Uses the background-image + VML
+ * technique so the badge stays centered across clients, including Outlook. The
+ * play badge is served from Clips' own public assets.
+ */
+export function recordingShareHeroHtml(
+  recording: ShareHeroRecording,
+  ctx: { href: string; alt?: string },
+): string | undefined {
+  // GIF-only recordings leave `thumbnailUrl` empty, so fall back to the
+  // animated thumbnail rather than dropping the preview entirely.
+  const thumb = absoluteUrl(
+    recording.thumbnailUrl || recording.animatedThumbnailUrl,
+  );
+  if (!thumb || !isHttpUrl(thumb)) return undefined;
+  const url = escapeAttr(thumb);
+  const cssUrl = escapeAttr(escapeCssUrl(thumb));
+  const href = escapeAttr(ctx.href);
+  const title = escapeAttr(ctx.alt ?? "Play video");
+  const badge = escapeAttr(`${appBaseUrl()}/play-badge.png`);
+  const W = 488;
+  const H = 275;
+  return `
+      <table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" style="margin:24px 0 0 0;">
+        <tr>
+          <td>
+            <a href="${href}" style="display:block; text-decoration:none;" title="${title}">
+              <!--[if mso]>
+              <v:image xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:${W}px;height:${H}px;" src="${url}" />
+              <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="false" stroke="false" style="position:absolute;width:${W}px;height:${H}px;">
+              <v:textbox inset="0,0,0,0"><center>
+              <![endif]-->
+              <table role="presentation" cellpadding="0" cellspacing="0" border="0" width="${W}" height="${H}" background="${url}" style="width:100%; max-width:${W}px; height:${H}px; background-image:url('${cssUrl}'); background-size:cover; background-position:center; background-color:#141417; border-radius:12px;">
+                <tr>
+                  <td align="center" valign="middle" height="${H}" style="height:${H}px;">
+                    <img src="${badge}" alt="Play video" width="64" height="64" style="width:64px; height:64px; border:0; display:inline-block;" />
+                  </td>
+                </tr>
+              </table>
+              <!--[if mso]></center></v:textbox></v:rect><![endif]-->
+            </a>
+          </td>
+        </tr>
+      </table>`;
+}