@agent-native/core 0.90.1 → 0.90.2

package/corpus/templates/design/actions/apply-motion-edit.ts

@@ -16,6 +16,10 @@
  */
 
 import { defineAction } from "@agent-native/core";
+import {
+  agentEnterDocument,
+  agentLeaveDocument,
+} from "@agent-native/core/collab";
 import {
   getRequestOrgId,
   getRequestUserEmail,
@@ -27,13 +31,41 @@ import { z } from "zod";
 
 import { getDb, schema } from "../server/db/index.js";
 import "../server/db/index.js"; // ensure registerShareableResource runs
+import {
+  readLiveSourceFile,
+  writeInlineSourceFile,
+  type SourceWorkspaceFile,
+} from "../server/source-workspace.js";
 import {
   assertSafeMotionCssProperty,
   assertSafeMotionCssToken,
   compile,
   injectManagedMotionCss,
 } from "../shared/motion-compiler.js";
-import type { MotionTrack } from "../shared/motion-timeline.js";
+import { parseSpringToken } from "../shared/motion-easing.js";
+import type {
+  MotionPlaybackMode,
+  MotionTrack,
+} from "../shared/motion-timeline.js";
+import {
+  readTimelinePlaybackMode,
+  withTimelinePlaybackMode,
+} from "../shared/motion-timeline.js";
+import { sourceContentHash } from "../shared/source-workspace.js";
+
+// ─── DoS-guard caps ──────────────────────────────────────────────────────────
+//
+// Mirrors the style of other hard resource caps in this template (e.g.
+// MAX_SHADERS_PER_ARTBOARD in shared/shader-safety.ts): a small, exported
+// constant plus a clear thrown Error (never a silent clamp) so callers see
+// exactly which limit was exceeded and by how much.
+
+/** Max tracks per timeline/screen — keeps compile() bounded and DOM-safe. */
+export const MAX_MOTION_TRACKS = 64;
+/** Max keyframes per track — keeps @keyframes blocks bounded. */
+export const MAX_MOTION_KEYFRAMES_PER_TRACK = 128;
+/** Max total timeline duration, ms (120s) — guards against runaway timelines. */
+export const MAX_MOTION_DURATION_MS = 120_000;
 
 // ─── Zod schemas ─────────────────────────────────────────────────────────────
 
@@ -42,13 +74,23 @@ const keyframeSchema = z.object({
     .number()
     .min(0)
     .max(1)
-    .describe("Normalised time in [0, 1] where 0 = 0% and 1 = 100%."),
+    .describe(
+      "Normalised time in [0, 1] within the track's own span " +
+        "(0 = span start, 1 = span end; the span is the whole timeline " +
+        "unless the track sets delayMs/durationMs).",
+    ),
   value: z.string().describe("CSS property value at this keyframe."),
   ease: z
     .string()
     .optional()
     .describe(
-      'Per-keyframe easing, e.g. "ease-out" or "cubic-bezier(0.4,0,0.2,1)".',
+      "Easing of the SEGMENT leaving this keyframe toward the next one " +
+        "(Figma semantics: the easing INTO the following keyframe). " +
+        'Accepts CSS keywords ("linear", "ease-out", "step-start" — the ' +
+        '"Hold" preset), "cubic-bezier(x1,y1,x2,y2)", "steps(n, pos)", ' +
+        'CSS "linear(...)" stop lists, and spring physics as ' +
+        '"spring(bounce)" or "spring(bounce, settle)" with bounce in [0, 1] ' +
+        "(compiled to a CSS linear() approximation).",
     ),
 });
 
@@ -61,11 +103,45 @@ const trackSchema = z.object({
     ),
   property: z
     .string()
-    .describe('CSS property to animate, e.g. "opacity" or "transform".'),
+    .describe(
+      "CSS property to animate. Figma-parity mapping: translation → " +
+        '"translate", scale → "scale", rotation → "rotate", opacity → ' +
+        '"opacity", corner radius → "border-radius", fill → ' +
+        '"background-color", stroke paint → "border-color", stroke weight ' +
+        '→ "border-width", drop shadow → "box-shadow". translate/scale/' +
+        "rotate are individual CSS transform properties, so they compose " +
+        "freely on one node as separate tracks.",
+    ),
   keyframes: z
     .array(keyframeSchema)
     .min(1)
-    .describe("At least one keyframe is required per track."),
+    .describe(
+      "At least one keyframe is required per track " +
+        `(max ${MAX_MOTION_KEYFRAMES_PER_TRACK} per track).`,
+    ),
+  delayMs: z
+    .number()
+    .min(0)
+    .optional()
+    .describe(
+      "Start-time offset of this track within the timeline, in ms " +
+        "(compiled to animation-delay). Use for staggering layers.",
+    ),
+  durationMs: z
+    .number()
+    .positive()
+    .optional()
+    .describe(
+      "This track's own animation span in ms (compiled to a per-track " +
+        "animation-duration). Omit to span the whole timeline.",
+    ),
+  timelinePlaybackMode: z
+    .enum(["loop", "once", "ping-pong"])
+    .optional()
+    .describe(
+      "Internal: timeline-level playback mode stamp persisted on the first " +
+        "track. Prefer the top-level playbackMode parameter.",
+    ),
 });
 
 // ─── Helpers ──────────────────────────────────────────────────────────────────
@@ -109,30 +185,64 @@ export function motionTrackKey(targetNodeId: string, property: string): string {
   return `${targetNodeId}${MOTION_TRACK_KEY_SEPARATOR}${property}`;
 }
 
+/**
+ * Validate a caller-supplied ease token: CSS-injection safety plus
+ * spring-token well-formedness. A string that LOOKS like a spring token but
+ * cannot be parsed would otherwise pass injection checks and then be emitted
+ * verbatim into the stylesheet as an invalid timing function.
+ */
+export function assertValidMotionEase(ease: string, field: string): string {
+  assertSafeMotionCssToken(ease, field);
+  if (/^\s*spring/i.test(ease) && parseSpringToken(ease) === null) {
+    throw new Error(
+      `Invalid ${field}: "${ease}" is not a valid spring token. ` +
+        'Use "spring(bounce)" or "spring(bounce, settle)" with bounce in [0, 1].',
+    );
+  }
+  return ease;
+}
+
+/**
+ * Persist the patched HTML through the same collab-aware seam as
+ * apply-visual-edit.ts / remove-motion-timeline.ts: `writeInlineSourceFile`
+ * re-reads the live (collab-authoritative, else SQL) text immediately before
+ * its own write and rejects if it no longer matches `expectedVersionHash` —
+ * closing the race window where a concurrent editor's change lands between
+ * the base read that produced `content` and this persist call. It also bumps
+ * `schema.designs.updatedAt` internally, so no separate designs-row bump is
+ * needed here (unlike the old raw-SQL `persistFileContent`).
+ */
 async function persistFileContent(
-  fileId: string,
-  designId: string,
+  file: {
+    id: string;
+    designId: string;
+    filename: string;
+    fileType: string;
+  },
   content: string,
-  now: string,
+  expectedVersionHash: string,
 ): Promise<string> {
-  const db = getDb();
-  await db
-    .update(schema.designFiles)
-    .set({ content, updatedAt: now })
-    .where(eq(schema.designFiles.id, fileId));
-
-  // Keep SQL as the source of truth for this atomic write. The editor adopts
-  // the returned HTML content without re-saving it; applying the whole document
-  // through an existing collab text snapshot can merge against stale iframe
-  // state and duplicate the managed motion stylesheet.
-  // guard:allow-unscoped — editor access on this design is asserted in run()
-  // before this helper is invoked; this only bumps the addressed design row.
-  await db
-    .update(schema.designs)
-    .set({ updatedAt: now })
-    .where(eq(schema.designs.id, designId));
-
-  return now;
+  agentEnterDocument(file.id);
+  try {
+    const workspaceFile: SourceWorkspaceFile = {
+      id: file.id,
+      designId: file.designId,
+      filename: file.filename,
+      fileType: file.fileType,
+      content,
+      createdAt: null,
+      updatedAt: null,
+    };
+    const result = await writeInlineSourceFile({
+      designId: file.designId,
+      file: workspaceFile,
+      content,
+      expectedVersionHash,
+    });
+    return result.updatedAt;
+  } finally {
+    agentLeaveDocument(file.id);
+  }
 }
 
 // ─── Action ───────────────────────────────────────────────────────────────────
@@ -143,6 +253,11 @@ export default defineAction({
     "Persists the motion_timeline row, compiles tracks to CSS, injects the " +
     "managed <style data-agent-native-motion> block into the design's HTML, " +
     "and updates compiledHash — all in one atomic step. " +
+    "Supports the full keyframe model: per-property tracks (translate/scale/" +
+    "rotate compose as separate tracks on one node), per-segment easing " +
+    "(curves, steps, springs via spring(bounce)), playback modes " +
+    "(loop/once/ping-pong), and per-track start offsets/durations for " +
+    "staggering. " +
     "This is the durable timeline persist path; preview/scrubbing uses the " +
     "motion-preview postMessage bridge, NOT this action.",
   schema: z.object({
@@ -174,23 +289,44 @@ export default defineAction({
       )
       .describe(
         "Animation tracks. Each track targets one DOM element by " +
-          "data-agent-native-node-id and animates one CSS property.",
+          "data-agent-native-node-id and animates one CSS property. " +
+          `Max ${MAX_MOTION_TRACKS} tracks per timeline.`,
       ),
     durationMs: z
       .number()
       .int()
       .positive()
+      .max(
+        MAX_MOTION_DURATION_MS,
+        `Total animation duration must be at most ${MAX_MOTION_DURATION_MS}ms (${
+          MAX_MOTION_DURATION_MS / 1000
+        }s).`,
+      )
       // Keep in sync with the MotionDock default (DesignEditor
       // motionDurationMs) and get-motion-timeline's CSS-recovery fallback so
       // an omitted duration means the same thing on every surface.
       .default(1000)
-      .describe("Total animation duration in milliseconds."),
+      .describe(
+        "Total animation duration in milliseconds. " +
+          `Capped at ${MAX_MOTION_DURATION_MS}ms (${
+            MAX_MOTION_DURATION_MS / 1000
+          }s) to guard against runaway/DoS timelines.`,
+      ),
+    playbackMode: z
+      .enum(["loop", "once", "ping-pong"])
+      .optional()
+      .describe(
+        'Timeline playback mode: "loop" repeats, "once" plays a single ' +
+          'time, "ping-pong" alternates forward/backward. Omit to keep the ' +
+          'timeline\'s existing mode (or "once" for new timelines).',
+      ),
     defaultEase: z
       .string()
       .default("ease")
       .describe(
         "Default easing applied to keyframe intervals that omit ease. " +
-          'E.g. "ease", "ease-in-out", "cubic-bezier(0.4,0,0.2,1)".',
+          'E.g. "ease", "ease-in-out", "cubic-bezier(0.4,0,0.2,1)", or ' +
+          '"spring(0.25)".',
       ),
     label: z
       .string()
@@ -217,6 +353,7 @@ export default defineAction({
     sourceRef,
     tracks,
     durationMs,
+    playbackMode,
     defaultEase,
     includeContent,
     currentContent: currentContentInput,
@@ -239,6 +376,7 @@ export default defineAction({
         id: schema.designFiles.id,
         designId: schema.designFiles.designId,
         filename: schema.designFiles.filename,
+        fileType: schema.designFiles.fileType,
         content: schema.designFiles.content,
       })
       .from(schema.designFiles)
@@ -259,13 +397,63 @@ export default defineAction({
 
     const fileId = file.id;
     const resolvedSourceRef = sourceRef ?? fileId;
-    const currentContent =
-      currentContentInput !== undefined
-        ? currentContentInput
-        : (file.content ?? "");
+
+    // The EDITABLE base for compiling/injecting CSS: prefer the caller's
+    // in-flight editor snapshot when supplied (currentContentInput), else the
+    // LIVE collab-authoritative content for this file (not the raw SQL row —
+    // a live editor's Y.Text may be ahead of the last SQL snapshot). Either
+    // way, `baseVersionHash` is computed from the EXACT string chosen as the
+    // base, at this same point in time, so it faithfully represents "what
+    // this transform's base was" for the persist's optimistic-concurrency
+    // check below — never a fresh re-hash of already-transformed content
+    // (that would trivially match itself and prove nothing raced).
+    let currentContent: string;
+    let baseVersionHash: string;
+    if (currentContentInput !== undefined) {
+      // Caller supplied their own editor snapshot as the patch base. It may
+      // already be stale relative to the live doc — that's fine.
+      // writeInlineSourceFile's own guard (via readLiveSourceFile at write
+      // time) correctly rejects the write if this base no longer matches
+      // live state, exactly as designed for every other caller-supplied-base
+      // action (see apply-component-prop-edit.ts / apply-shader-fill.ts).
+      currentContent = currentContentInput;
+      baseVersionHash = sourceContentHash(currentContent);
+    } else {
+      const workspaceFileForRead: SourceWorkspaceFile = {
+        id: file.id,
+        designId: file.designId,
+        filename: file.filename,
+        fileType: file.fileType,
+        content: file.content,
+        createdAt: null,
+        updatedAt: null,
+      };
+      const live = await readLiveSourceFile(workspaceFileForRead);
+      currentContent = live.content;
+      baseVersionHash = live.versionHash;
+    }
 
     // ── 2. Compile tracks → CSS ─────────────────────────────────────────────
-    const typedTracks = tracks as MotionTrack[];
+    const inputTracks = tracks as MotionTrack[];
+
+    // DoS guards: reject (never silently clamp) before any compilation work
+    // so an over-limit request fails fast with a clear, actionable error.
+    if (inputTracks.length > MAX_MOTION_TRACKS) {
+      throw new Error(
+        `Too many motion tracks: ${inputTracks.length} exceeds the ` +
+          `${MAX_MOTION_TRACKS}-track limit per timeline. Split the ` +
+          "animation across multiple timelines/screens or remove unused tracks.",
+      );
+    }
+    for (const track of inputTracks) {
+      if (track.keyframes.length > MAX_MOTION_KEYFRAMES_PER_TRACK) {
+        throw new Error(
+          `Too many keyframes on track "${track.targetNodeId}"/"${track.property}": ` +
+            `${track.keyframes.length} exceeds the ${MAX_MOTION_KEYFRAMES_PER_TRACK}-keyframe ` +
+            "limit per track.",
+        );
+      }
+    }
 
     // Reject CSS-injection vectors in caller-supplied track properties,
     // keyframe values, and easing strings before they are compiled into the
@@ -273,7 +461,7 @@ export default defineAction({
     // pairs: the compiler derives the animation name from that pair, so a
     // duplicate would silently overwrite the earlier track's keyframes.
     const seenTrackKeys = new Set<string>();
-    for (const track of typedTracks) {
+    for (const track of inputTracks) {
       assertSafeMotionCssProperty(track.property, "track.property");
       const trackKey = motionTrackKey(track.targetNodeId, track.property);
       if (seenTrackKeys.has(trackKey)) {
@@ -287,11 +475,21 @@ export default defineAction({
       for (const kf of track.keyframes) {
         assertSafeMotionCssToken(kf.value, "keyframe value");
         if (kf.ease !== undefined) {
-          assertSafeMotionCssToken(kf.ease, "keyframe ease");
+          assertValidMotionEase(kf.ease, "keyframe ease");
         }
       }
     }
-    assertSafeMotionCssToken(defaultEase, "defaultEase");
+    assertValidMotionEase(defaultEase, "defaultEase");
+
+    // Persist the timeline-level playback mode as a stamp on the first track
+    // so the stored tracks JSON stays a plain (schema-compatible) array. An
+    // explicit playbackMode wins; otherwise any stamp already present in the
+    // incoming tracks is preserved.
+    const typedTracks = playbackMode
+      ? withTimelinePlaybackMode(inputTracks, playbackMode)
+      : inputTracks;
+    const resolvedPlaybackMode: MotionPlaybackMode =
+      playbackMode ?? readTimelinePlaybackMode(inputTracks) ?? "once";
 
     const { css, hash } = compile({
       id: timelineId ?? "",
@@ -300,6 +498,7 @@ export default defineAction({
       filePath: null,
       tracks: typedTracks,
       durationMs,
+      playbackMode: resolvedPlaybackMode,
       defaultEase,
       compiledHash: null,
       createdAt: now,
@@ -413,8 +612,21 @@ export default defineAction({
     // Written after the row so a SQL failure here leaves the timeline row
     // accurate (correct tracks + hash) and the stale HTML can be recompiled on
     // the next apply-motion-edit call via compiledHash drift detection.
+    // Goes through the collab-aware writeInlineSourceFile seam, conditioned on
+    // baseVersionHash (the hash of the SAME base string used above to compile
+    // patchedContent), so a concurrent editor's write between that base read
+    // and this persist is rejected loud rather than silently overwritten.
     const updatedAt = contentPatched
-      ? await persistFileContent(fileId, designId, patchedContent, now)
+      ? await persistFileContent(
+          {
+            id: fileId,
+            designId,
+            filename: file.filename,
+            fileType: file.fileType,
+          },
+          patchedContent,
+          baseVersionHash,
+        )
       : now;
 
     return {
@@ -423,6 +635,7 @@ export default defineAction({
       fileId,
       sourceRef: resolvedSourceRef,
       trackCount: typedTracks.length,
+      playbackMode: resolvedPlaybackMode,
       compiledHash: hash,
       updatedAt,
       bytesBefore,

package/corpus/templates/design/actions/apply-shader-fill.ts

@@ -27,12 +27,21 @@
  */
 
 import { defineAction } from "@agent-native/core";
-import { agentUpdateSelection } from "@agent-native/core/collab";
+import {
+  agentEnterDocument,
+  agentLeaveDocument,
+  agentUpdateSelection,
+} from "@agent-native/core/collab";
 import { accessFilter, assertAccess } from "@agent-native/core/sharing";
 import { and, eq } from "drizzle-orm";
 import { z } from "zod";
 
 import { getDb, schema } from "../server/db/index.js";
+import {
+  readLiveSourceFile,
+  writeInlineSourceFile,
+  type SourceWorkspaceFile,
+} from "../server/source-workspace.js";
 import {
   applyVisualEdit,
   type CodeLayerSource,
@@ -49,6 +58,7 @@ import {
   type ShaderPresetName,
   validateDescriptor,
 } from "../shared/shader-presets.js";
+import { sourceContentHash } from "../shared/source-workspace.js";
 
 // ─── Schema ──────────────────────────────────────────────────────────────────
 
@@ -141,9 +151,10 @@ interface ResolvedDesignFile {
   id: string;
   designId: string;
   filename: string;
+  fileType: string;
   content: string;
-  updatedAt: string | null;
-  expectedUpdatedAt?: string;
+  /** versionHash of `content` — the exact base the transform reads from. */
+  versionHash: string;
   codeLayerSource: CodeLayerSource;
 }
 
@@ -151,6 +162,15 @@ interface ResolvedDesignFile {
  * Resolve the target HTML design file with an access-scoped read, then assert
  * editor access. Mirrors `resolveEditableDesignFile` in apply-visual-edit.ts so
  * the shader-fill write goes through the exact same ownership gate.
+ *
+ * The editable base is collab-aware: `readLiveSourceFile` returns the live
+ * Y.Text content when a collab doc exists for this file, else the SQL row —
+ * never only the raw SQL snapshot. When the caller supplies
+ * `source.currentContent`, that in-flight editor snapshot is preferred as the
+ * base instead (same precedence as apply-motion-edit.ts / apply-component-
+ * prop-edit.ts), and its versionHash is computed directly from that exact
+ * string via `sourceContentHash` — not from a fresh live re-read, which would
+ * prove nothing about whether this specific base is still current.
  */
 async function resolveEditableDesignFile(source: {
   designId?: string;
@@ -221,6 +241,9 @@ async function resolveEditableDesignFile(source: {
       "source.revision is required when source.currentContent is provided.",
     );
   }
+  // Legitimate pre-check, distinct from the CAS write-guard below: reject
+  // early when the caller's own revision stamp doesn't match the file's SQL
+  // updatedAt, before any transform work happens.
   if (
     source.currentContent !== undefined &&
     source.revision &&
@@ -230,17 +253,33 @@ async function resolveEditableDesignFile(source: {
     throw new ShaderFillRevisionConflictError();
   }
 
+  let content: string;
+  let versionHash: string;
+  if (source.currentContent !== undefined) {
+    content = source.currentContent;
+    versionHash = sourceContentHash(content);
+  } else {
+    const workspaceFile: SourceWorkspaceFile = {
+      id: file.id,
+      designId: file.designId,
+      filename: file.filename,
+      fileType: file.fileType,
+      content: file.content,
+      createdAt: null,
+      updatedAt: file.updatedAt,
+    };
+    const live = await readLiveSourceFile(workspaceFile);
+    content = live.content;
+    versionHash = live.versionHash;
+  }
+
   return {
     id: file.id,
     designId: file.designId,
     filename: file.filename,
-    updatedAt: file.updatedAt,
-    expectedUpdatedAt:
-      source.currentContent !== undefined ? source.revision : undefined,
-    content:
-      source.currentContent !== undefined
-        ? source.currentContent
-        : (file.content ?? ""),
+    fileType: file.fileType,
+    content,
+    versionHash,
     codeLayerSource: {
       kind: "design-file",
       designId: file.designId,
@@ -251,69 +290,52 @@ async function resolveEditableDesignFile(source: {
   };
 }
 
+/**
+ * Persist the patched HTML through the collab-aware seam
+ * (`writeInlineSourceFile`), conditioned on the versionHash of the SAME base
+ * the `applyVisualEdit` transform used — not a fresh re-read/re-check at
+ * persist time. `writeInlineSourceFile` re-reads the live text immediately
+ * before its own write and throws "Source file changed since it was read..."
+ * if it no longer matches; callers map that rejection to the existing
+ * `ShaderFillRevisionConflictError`-shaped response (see run()'s catch block).
+ */
 async function persistDesignFileEdit(file: {
   id: string;
   designId: string;
+  filename: string;
+  fileType: string;
   content: string;
-  expectedUpdatedAt?: string;
+  expectedVersionHash: string;
 }): Promise<string> {
-  await assertAccess("design", file.designId, "editor");
-
-  const db = getDb();
-  const now = new Date().toISOString();
-
-  if (file.expectedUpdatedAt) {
-    const [latest] = await db
-      .select({ updatedAt: schema.designFiles.updatedAt })
-      .from(schema.designFiles)
-      .where(eq(schema.designFiles.id, file.id))
-      .limit(1);
-    if (!latest) {
-      throw new Error("Design HTML file not found.");
-    }
-    if (latest.updatedAt && latest.updatedAt !== file.expectedUpdatedAt) {
-      throw new ShaderFillRevisionConflictError();
-    }
-  }
-
-  await db
-    .update(schema.designFiles)
-    .set({ content: file.content, updatedAt: now })
-    .where(
-      file.expectedUpdatedAt
-        ? and(
-            eq(schema.designFiles.id, file.id),
-            eq(schema.designFiles.updatedAt, file.expectedUpdatedAt),
-          )
-        : eq(schema.designFiles.id, file.id),
-    );
-
-  if (file.expectedUpdatedAt) {
-    const [saved] = await db
-      .select({
-        content: schema.designFiles.content,
-        updatedAt: schema.designFiles.updatedAt,
-      })
-      .from(schema.designFiles)
-      .where(eq(schema.designFiles.id, file.id))
-      .limit(1);
-    if (!saved || saved.updatedAt !== now || saved.content !== file.content) {
+  agentEnterDocument(file.id);
+  try {
+    const workspaceFile: SourceWorkspaceFile = {
+      id: file.id,
+      designId: file.designId,
+      filename: file.filename,
+      fileType: file.fileType,
+      content: file.content,
+      createdAt: null,
+      updatedAt: null,
+    };
+    const result = await writeInlineSourceFile({
+      designId: file.designId,
+      file: workspaceFile,
+      content: file.content,
+      expectedVersionHash: file.expectedVersionHash,
+    });
+    return result.updatedAt;
+  } catch (error) {
+    if (
+      error instanceof Error &&
+      /changed since it was read/.test(error.message)
+    ) {
       throw new ShaderFillRevisionConflictError();
     }
+    throw error;
+  } finally {
+    agentLeaveDocument(file.id);
   }
-
-  // Keep SQL as the source of truth for this guarded server write. The editor
-  // already has the live shader preview applied; feeding a full HTML document
-  // back through an existing collab text snapshot can merge against stale
-  // iframe state and corrupt the saved source.
-  // guard:allow-unscoped — editor access on this design is asserted above
-  // before this helper is invoked; this only bumps the addressed design row.
-  await db
-    .update(schema.designs)
-    .set({ updatedAt: now })
-    .where(eq(schema.designs.id, file.designId));
-
-  return now;
 }
 
 // ─── Action ──────────────────────────────────────────────────────────────────
@@ -448,8 +470,10 @@ snippet (WebGL canvas / JSX component), call apply-shader.
         updatedAt = await persistDesignFileEdit({
           id: file.id,
           designId: file.designId,
+          filename: file.filename,
+          fileType: file.fileType,
           content: patch.content,
-          expectedUpdatedAt: file.expectedUpdatedAt,
+          expectedVersionHash: file.versionHash,
         });
       } catch (error) {
         if (error instanceof ShaderFillRevisionConflictError) {