Read the review card fill from localStorage before picking a new one.

The review screen’s effect ran before draft hydration, so reload always generated a fresh color and overwrote the stored one.

Co-authored-by: Cursor <cursoragent@cursor.com>

tests/unit/resolvePreviewSurfaceFallback.test.ts

@@ -0,0 +1,71 @@
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import { CREATE_FLOW_ANONYMOUS_KEY } from "../../app/(app)/create/utils/anonymousDraftStorage";
+import {
+  persistDraftPreviewSurfaceColor,
+  readDraftPreviewSurfaceColor,
+  resolvePreviewSurfaceFallback,
+} from "../../app/(app)/create/utils/resolvePreviewSurfaceFallback";
+import { randomPreviewSurfaceColor } from "../../lib/create/previewSurfaceColor";
+
+vi.mock("../../lib/create/previewSurfaceColor", async (importOriginal) => {
+  const actual =
+    await importOriginal<
+      typeof import("../../lib/create/previewSurfaceColor")
+    >();
+  return {
+    ...actual,
+    randomPreviewSurfaceColor: vi.fn(() => "hsl(12, 50%, 80%)"),
+  };
+});
+
+describe("resolvePreviewSurfaceFallback", () => {
+  beforeEach(() => {
+    window.localStorage.removeItem(CREATE_FLOW_ANONYMOUS_KEY);
+    vi.mocked(randomPreviewSurfaceColor).mockClear();
+  });
+
+  it("reuses a valid fill already on React state", () => {
+    expect(resolvePreviewSurfaceFallback("hsl(200, 60%, 80%)")).toBe(
+      "hsl(200, 60%, 80%)",
+    );
+    expect(randomPreviewSurfaceColor).not.toHaveBeenCalled();
+  });
+
+  it("reuses a fill already on the anonymous draft", () => {
+    window.localStorage.setItem(
+      CREATE_FLOW_ANONYMOUS_KEY,
+      JSON.stringify({
+        title: "Oak Park Commons",
+        previewSurfaceColor: "hsl(200, 60%, 80%)",
+      }),
+    );
+    expect(resolvePreviewSurfaceFallback(undefined)).toBe(
+      "hsl(200, 60%, 80%)",
+    );
+    expect(randomPreviewSurfaceColor).not.toHaveBeenCalled();
+  });
+
+  it("picks once and writes it onto the anonymous draft", () => {
+    expect(resolvePreviewSurfaceFallback(undefined)).toBe(
+      "hsl(12, 50%, 80%)",
+    );
+    expect(randomPreviewSurfaceColor).toHaveBeenCalledTimes(1);
+    expect(readDraftPreviewSurfaceColor()).toBe("hsl(12, 50%, 80%)");
+    expect(resolvePreviewSurfaceFallback(undefined)).toBe(
+      "hsl(12, 50%, 80%)",
+    );
+    expect(randomPreviewSurfaceColor).toHaveBeenCalledTimes(1);
+  });
+
+  it("does not replace a fill already stored on the draft", () => {
+    window.localStorage.setItem(
+      CREATE_FLOW_ANONYMOUS_KEY,
+      JSON.stringify({
+        title: "Oak Park Commons",
+        previewSurfaceColor: "hsl(200, 60%, 80%)",
+      }),
+    );
+    persistDraftPreviewSurfaceColor("hsl(12, 50%, 80%)");
+    expect(readDraftPreviewSurfaceColor()).toBe("hsl(200, 60%, 80%)");
+  });
+});