Refine use cases rule examples

tests/components/AskOrganizer.test.tsx

@@ -91,11 +91,35 @@ describe("AskOrganizer (behavioral tests)", () => {
         variant="use-case-detail"
       />,
     );
-    expect(
-      container.querySelector('[data-figma-node="22015-42624"]'),
-    ).toBeInTheDocument();
+    const section = container.querySelector('[data-figma-node="22015-42624"]');
+    expect(section).toBeInTheDocument();
+    expect(section).toHaveClass("py-[var(--spacing-scale-032)]");
+    expect(section).not.toHaveClass("py-[var(--spacing-scale-096)]");
     expect(
       screen.getByRole("heading", { name: "Still have questions?" }),
     ).toBeInTheDocument();
   });
+
+  it("centered variant uses baseline section padding per Figma 17487-12288", () => {
+    const { container } = render(
+      <AskOrganizer
+        title="Still have questions?"
+        subtitle="Get answers from an experienced organizer"
+        variant="centered"
+      />,
+    );
+    const section = container.querySelector('[data-figma-node="18116-15960"]');
+    expect(section).toHaveClass(
+      "py-[var(--spacing-scale-040)]",
+      "px-[var(--spacing-scale-032)]",
+    );
+    expect(section).not.toHaveClass("py-[var(--spacing-scale-096)]");
+  });
+
+  it("does not force 358px min-width below md (fits 320px baseline)", () => {
+    const { container } = render(<AskOrganizer title="Test Title" />);
+    const inner = container.querySelector("section > div");
+    expect(inner).toHaveClass("min-w-0", "md:min-w-[358px]");
+    expect(inner?.className).not.toContain(" min-w-[358px]");
+  });
 });

tests/components/CommunityRule.test.tsx

@@ -1,4 +1,5 @@
-import { describe } from "vitest";
+import { describe, expect, it } from "vitest";
+import { render, screen } from "@testing-library/react";
 import {
   componentTestSuite,
   type ComponentTestSuiteConfig,
@@ -34,4 +35,19 @@ const config: ComponentTestSuiteConfig<Props> = {
 
 describe("CommunityRule", () => {
   componentTestSuite<Props>(config);
+
+  it("uses cardAccentColor for the card left border when useCardStyle is true", () => {
+    const { container } = render(
+      <CommunityRule
+        sections={sampleSections}
+        useCardStyle
+        cardAccentColor="var(--color-surface-invert-brand-lavender)"
+      />,
+    );
+    const root = container.firstElementChild as HTMLElement;
+    expect(root.style.boxShadow).toBe(
+      "inset 4px 0 0 0 var(--color-surface-invert-brand-lavender)",
+    );
+    expect(screen.getByText("How proposals pass")).toBeInTheDocument();
+  });
 });

tests/components/ContentBanner.test.tsx

@@ -62,6 +62,28 @@ describe("ContentBanner", () => {
     expect(screen.getByText("Test description")).toBeInTheDocument();
   });
 
+  it("renders useCase variant rule preview as link when href is set", () => {
+    const { container } = render(
+      <ContentBanner
+        post={mockPost}
+        variant="useCase"
+        rulePreview={{
+          title: "Sample Operating Manual",
+          description: "Governance preview for the case study.",
+          backgroundColor: "bg-[var(--color-surface-invert-brand-lavender)]",
+          iconPath: "assets/case-study/case-study-mutual-aid.svg",
+          href: "/use-cases/mutual-aid-colorado/rule",
+        }}
+      />,
+    );
+
+    const link = screen.getByRole("link", {
+      name: /view sample operating manual community rule/i,
+    });
+    expect(link).toHaveAttribute("href", "/use-cases/mutual-aid-colorado/rule");
+    expect(container.querySelector(".pointer-events-none")).toBeNull();
+  });
+
   it("renders useCase variant with ContentContainer copy and rule preview", () => {
     const { container } = render(
       <ContentBanner
@@ -76,13 +98,18 @@ describe("ContentBanner", () => {
       />,
     );
 
-    expect(
-      screen.getByRole("heading", { name: "Test Article" }),
-    ).toBeInTheDocument();
+    const title = screen.getByRole("heading", { name: "Test Article" });
+    expect(title).toBeInTheDocument();
+    expect(title).toHaveClass("sm:text-[24px]", "md:text-[32px]");
     expect(screen.getByText("Sample Operating Manual")).toBeInTheDocument();
-    expect(
-      container.querySelector('[data-figma-node="22015:42621"]'),
-    ).toBeInTheDocument();
+    const copyColumn = container.querySelector('[data-node-id="19189:9171"]');
+    expect(copyColumn).toHaveClass("lg:max-w-[365px]");
+    expect(copyColumn).not.toHaveClass("max-w-[365px]");
+    const bannerRow = container.querySelector(
+      '[data-figma-node="22015:42621"]',
+    );
+    expect(bannerRow).toBeInTheDocument();
+    expect(bannerRow).toHaveClass("lg:grid-cols-2");
   });
 
   it("renders guide variant with left-aligned copy and logo mark", () => {

tests/components/CreateFlowTopNav.test.tsx

@@ -1,6 +1,10 @@
 import React from "react";
-import { describe, it, expect, vi } from "vitest";
-import { renderWithProviders as render, screen } from "../utils/test-utils";
+import { afterEach, beforeEach, describe, it, expect, vi } from "vitest";
+import {
+  renderWithProviders as render,
+  screen,
+  waitFor,
+} from "../utils/test-utils";
 import userEvent from "@testing-library/user-event";
 import "@testing-library/jest-dom/vitest";
 import CreateFlowTopNav from "../../app/components/navigation/CreateFlowTopNav";
@@ -150,6 +154,25 @@ describe("CreateFlowTopNav (behavioral tests)", () => {
     expect(handler).toHaveBeenCalledTimes(1);
   });
 
+  it("renders Duplicate button when hasDuplicate is true", () => {
+    render(
+      <CreateFlowTopNav
+        hasDuplicate={true}
+        duplicateLabel="Duplicate"
+        duplicateAriaLabel="Duplicate"
+        onDuplicate={vi.fn()}
+      />,
+    );
+    expect(
+      screen.getByRole("button", { name: "Duplicate" }),
+    ).toBeInTheDocument();
+  });
+
+  it("uses exitLabel override when provided", () => {
+    render(<CreateFlowTopNav exitLabel="Return" />);
+    expect(screen.getByRole("button", { name: "Return" })).toBeInTheDocument();
+  });
+
   it("calls onExit when Exit button is clicked", async () => {
     const user = userEvent.setup();
     const handleExit = vi.fn();
@@ -161,3 +184,107 @@ describe("CreateFlowTopNav (behavioral tests)", () => {
     expect(handleExit).toHaveBeenCalledTimes(1);
   });
 });
+
+describe("CreateFlowTopNav (viewport < sm2 / 440px)", () => {
+  const defaultInnerWidth = 1200;
+
+  beforeEach(() => {
+    Object.defineProperty(window, "innerWidth", {
+      writable: true,
+      configurable: true,
+      value: 320,
+    });
+  });
+
+  afterEach(() => {
+    Object.defineProperty(window, "innerWidth", {
+      writable: true,
+      configurable: true,
+      value: defaultInnerWidth,
+    });
+  });
+
+  const completedScreenProps = {
+    hasShare: true,
+    hasExport: true,
+    hasEdit: true,
+    saveDraftOnExit: true,
+    onShare: vi.fn(),
+    onSelectExportFormat: vi.fn(),
+    onEdit: vi.fn(),
+    onExit: vi.fn(),
+  } as const;
+
+  it("collapses secondary actions into a kebab menu", async () => {
+    render(<CreateFlowTopNav {...completedScreenProps} />);
+
+    await waitFor(() => {
+      expect(
+        screen.getByRole("button", { name: "More options" }),
+      ).toBeInTheDocument();
+    });
+
+    expect(
+      screen.queryByRole("button", { name: "Share" }),
+    ).not.toBeInTheDocument();
+    expect(
+      screen.queryByRole("button", { name: "Export" }),
+    ).not.toBeInTheDocument();
+    expect(screen.queryByRole("button", { name: "Edit" })).not.toBeInTheDocument();
+    expect(
+      screen.queryByRole("button", { name: "Save & Exit" }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("opens kebab menu with share, export formats, edit, and save & exit", async () => {
+    const user = userEvent.setup();
+    render(<CreateFlowTopNav {...completedScreenProps} />);
+
+    const kebab = await screen.findByRole("button", { name: "More options" });
+    await user.click(kebab);
+
+    expect(screen.getByRole("menuitem", { name: "Share" })).toBeInTheDocument();
+    expect(
+      screen.getByRole("menuitem", { name: "Download PDF" }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("menuitem", { name: "Download CSV" }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("menuitem", { name: "Download Markdown" }),
+    ).toBeInTheDocument();
+    expect(screen.getByRole("menuitem", { name: "Edit" })).toBeInTheDocument();
+    expect(
+      screen.getByRole("menuitem", { name: "Save & Exit" }),
+    ).toBeInTheDocument();
+  });
+
+  it("invokes handlers from kebab menu items", async () => {
+    const user = userEvent.setup();
+    const handleShare = vi.fn();
+    const handleEdit = vi.fn();
+    const handleExit = vi.fn();
+
+    render(
+      <CreateFlowTopNav
+        {...completedScreenProps}
+        onShare={handleShare}
+        onEdit={handleEdit}
+        onExit={handleExit}
+      />,
+    );
+
+    const kebab = await screen.findByRole("button", { name: "More options" });
+    await user.click(kebab);
+    await user.click(screen.getByRole("menuitem", { name: "Share" }));
+    expect(handleShare).toHaveBeenCalledTimes(1);
+
+    await user.click(kebab);
+    await user.click(screen.getByRole("menuitem", { name: "Edit" }));
+    expect(handleEdit).toHaveBeenCalledTimes(1);
+
+    await user.click(kebab);
+    await user.click(screen.getByRole("menuitem", { name: "Save & Exit" }));
+    expect(handleExit).toHaveBeenCalledTimes(1);
+  });
+});

tests/components/FinalReviewPage.test.tsx

@@ -702,17 +702,48 @@ function FinalReviewEditPublishedWithStateProbe({
   return <FinalReviewScreen variant="editPublished" />;
 }
 
-describe("FinalReviewScreen — edit published description", () => {
-  it("does not expose click-to-edit description on default final review", () => {
+describe("FinalReviewScreen — edit published title and description", () => {
+  it("does not expose click-to-edit title or description on default final review", () => {
     render(
       <FinalReviewWithFlowState
         title="Oak"
         communityContext="Visible body"
       />,
     );
+    expect(screen.queryByTestId("rule-title-edit")).not.toBeInTheDocument();
     expect(screen.queryByTestId("rule-description-edit")).not.toBeInTheDocument();
   });
 
+  it("opens Save modal from title click and updates title", async () => {
+    let latest: CreateFlowState = {};
+    render(
+      <FinalReviewEditPublishedWithStateProbe
+        onState={(s) => {
+          latest = s;
+        }}
+        initial={{
+          title: "Oak Park Commons",
+          communityContext: "Original",
+          selectedCommunicationMethodIds: ["signal"],
+        }}
+      />,
+    );
+
+    fireEvent.click(await screen.findByTestId("rule-title-edit"));
+    const dialog = await screen.findByRole("dialog");
+    expect(within(dialog).getByText(/Community name/i)).toBeInTheDocument();
+    const input = within(dialog).getByRole("textbox");
+    fireEvent.change(input, { target: { value: "Renamed Commons" } });
+    fireEvent.click(within(dialog).getByRole("button", { name: "Save" }));
+
+    await waitFor(() => {
+      expect(screen.queryByRole("dialog")).not.toBeInTheDocument();
+    });
+    await waitFor(() => {
+      expect(latest.title).toBe("Renamed Commons");
+    });
+  });
+
   it("opens Save modal from description click and updates communityContext + summary", async () => {
     let latest: CreateFlowState = {};
     render(

tests/components/SectionHeader.test.tsx

@@ -1,4 +1,6 @@
 import React from "react";
+import { describe, it, expect } from "vitest";
+import { render, screen } from "@testing-library/react";
 import SectionHeader from "../../app/components/type/SectionHeader";
 import { componentTestSuite } from "../utils/componentTestSuite";
 
@@ -21,3 +23,22 @@ componentTestSuite<SectionHeaderProps>({
     errorState: false,
   },
 });
+
+describe("SectionHeader twoColumnsFromMd", () => {
+  it("splits rule stack header at md when twoColumnsFromMd is set", () => {
+    const { container } = render(
+      <SectionHeader
+        title="Popular templates"
+        subtitle="Start from a proven pattern."
+        variant="multi-line"
+        ruleStackDesktopTypeScale
+        twoColumnsFromMd
+      />,
+    );
+
+    expect(
+      screen.getByRole("heading", { name: /popular templates/i }),
+    ).toBeInTheDocument();
+    expect(container.firstElementChild).toHaveClass("md:flex-row");
+  });
+});

tests/components/type/TripleTextBlock.test.tsx

@@ -66,9 +66,10 @@ describe("TripleTextBlock", () => {
       />,
     );
 
-    expect(
-      container.querySelector('[data-figma-node="22085-860414"]'),
-    ).toBeTruthy();
+    const section = container.querySelector('[data-figma-node="22085-860414"]');
+    expect(section).toBeTruthy();
+    expect(section).toHaveClass("px-[var(--spacing-scale-032)]");
+    expect(section).not.toHaveClass("px-[calc(var(--spacing-scale-032)+var(--spacing-scale-096))]");
 
     expect(
       screen.getByRole("heading", {
@@ -84,6 +85,9 @@ describe("TripleTextBlock", () => {
     ).toBeInTheDocument();
     expect(screen.getByText("First paragraph.")).toBeInTheDocument();
     expect(screen.getByText("Second paragraph.")).toBeInTheDocument();
+    expect(screen.getByText("Second paragraph.")).toHaveClass(
+      "mt-[var(--spacing-scale-024)]",
+    );
     expect(screen.getByRole("link", { name: "Setup your community" })).toHaveAttribute(
       "href",
       "/create",

tests/pages/use-cases-completed-rule.test.jsx

@@ -0,0 +1,153 @@
+import { describe, test, expect, vi } from "vitest";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { renderWithProviders as render } from "../utils/test-utils";
+import UseCaseCompletedRulePage from "../../app/(marketing-case-study)/use-cases/[slug]/rule/page";
+import messages from "../../messages/en/index";
+import { USE_CASE_DETAIL_SLUGS } from "../../lib/useCaseSyntheticPost";
+
+const mockPush = vi.fn();
+const mockOpenLogin = vi.fn();
+const mockFetchAuthSession = vi.fn();
+const mockDuplicateUseCaseTemplate = vi.fn();
+
+vi.mock("next/navigation", () => ({
+  notFound: vi.fn(),
+  useRouter: () => ({ push: mockPush }),
+  usePathname: () => "/use-cases/food-not-bombs/rule",
+}));
+
+vi.mock("../../app/contexts/AuthModalContext", async (importOriginal) => {
+  const actual = await importOriginal();
+  return {
+    ...actual,
+    useAuthModal: () => ({
+      openLogin: mockOpenLogin,
+      closeLogin: vi.fn(),
+    }),
+  };
+});
+
+vi.mock("../../lib/create/api", async (importOriginal) => {
+  const actual = await importOriginal();
+  return {
+    ...actual,
+    fetchAuthSession: () => mockFetchAuthSession(),
+    duplicateUseCaseTemplate: (slug) => mockDuplicateUseCaseTemplate(slug),
+  };
+});
+
+vi.mock(
+  "../../app/(app)/create/hooks/useCreateFlowMdUp",
+  () => ({
+    useCreateFlowMdUp: () => true,
+  }),
+);
+
+describe("UseCaseCompletedRulePage", () => {
+  test.each(USE_CASE_DETAIL_SLUGS)(
+    "renders completed rule for %s",
+    async (slug) => {
+      const contentKey =
+        slug === "mutual-aid-colorado"
+          ? "mutualAidColorado"
+          : slug === "food-not-bombs"
+            ? "foodNotBombs"
+            : "boulderCountyStreetMedics";
+      const fixture = messages.pages.useCasesCompletedRules[contentKey];
+
+      render(
+        await UseCaseCompletedRulePage({
+          params: Promise.resolve({ slug }),
+        }),
+      );
+
+      expect(
+        screen.getByRole("heading", { name: fixture.title }),
+      ).toBeInTheDocument();
+      if (slug === "mutual-aid-colorado") {
+        expect(
+          screen.getByText(/Food Not Bombs is not a charity/),
+        ).toBeInTheDocument();
+      }
+      if (slug === "boulder-county-street-medics") {
+        expect(screen.getByText("Membership")).toBeInTheDocument();
+        expect(screen.getByText(/Tiered Membership/)).toBeInTheDocument();
+      }
+      expect(screen.getByText("Values")).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: /return/i }),
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", {
+          name: messages.pages.useCasesCompletedRule.topNav.duplicateAriaLabel,
+        }),
+      ).toBeInTheDocument();
+    },
+  );
+
+  test("Duplicate opens login when signed out", async () => {
+    const user = userEvent.setup();
+    mockOpenLogin.mockClear();
+    mockFetchAuthSession.mockResolvedValue({ user: null });
+
+    render(
+      await UseCaseCompletedRulePage({
+        params: Promise.resolve({ slug: "food-not-bombs" }),
+      }),
+    );
+
+    await user.click(
+      screen.getByRole("button", {
+        name: messages.pages.useCasesCompletedRule.topNav.duplicateAriaLabel,
+      }),
+    );
+    expect(mockOpenLogin).toHaveBeenCalledWith(
+      expect.objectContaining({
+        nextPath: "/use-cases/food-not-bombs/rule",
+      }),
+    );
+    expect(mockDuplicateUseCaseTemplate).not.toHaveBeenCalled();
+  });
+
+  test("Duplicate saves to profile when signed in", async () => {
+    const user = userEvent.setup();
+    mockPush.mockClear();
+    mockFetchAuthSession.mockResolvedValue({
+      user: { id: "u1", email: "a@b.c" },
+    });
+    mockDuplicateUseCaseTemplate.mockResolvedValue({
+      ok: true,
+      id: "rule-copy",
+      title: "Food Not Bombs Boulder Template (Copy)",
+    });
+
+    render(
+      await UseCaseCompletedRulePage({
+        params: Promise.resolve({ slug: "food-not-bombs" }),
+      }),
+    );
+
+    await user.click(
+      screen.getByRole("button", {
+        name: messages.pages.useCasesCompletedRule.topNav.duplicateAriaLabel,
+      }),
+    );
+    expect(mockDuplicateUseCaseTemplate).toHaveBeenCalledWith("food-not-bombs");
+    expect(mockPush).toHaveBeenCalledWith("/profile");
+  });
+
+  test("Return navigates to use case detail", async () => {
+    const user = userEvent.setup();
+    mockPush.mockClear();
+
+    render(
+      await UseCaseCompletedRulePage({
+        params: Promise.resolve({ slug: "mutual-aid-colorado" }),
+      }),
+    );
+
+    await user.click(screen.getByRole("button", { name: /return/i }));
+    expect(mockPush).toHaveBeenCalledWith("/use-cases/mutual-aid-colorado");
+  });
+});

tests/pages/use-cases-detail.test.jsx

@@ -18,6 +18,9 @@ vi.mock("../../app/components/sections/ContentBanner", () => ({
         <>
           <p>{rulePreview.title}</p>
           <p>{rulePreview.description}</p>
+          {rulePreview.href ? (
+            <a href={rulePreview.href}>View community rule</a>
+          ) : null}
         </>
       ) : null}
     </section>
@@ -61,6 +64,9 @@ describe("UseCaseDetailPage", () => {
         screen.getByRole("heading", { name: entry.banner.title }),
       ).toBeInTheDocument();
       expect(screen.getByText(entry.ruleCard.description)).toBeInTheDocument();
+      expect(
+        screen.getByRole("link", { name: /view community rule/i }),
+      ).toHaveAttribute("href", `/use-cases/${slug}/rule`);
 
       const bodySnippet =
         slug === "mutual-aid-colorado"

tests/unit/Rule.test.jsx

@@ -106,6 +106,22 @@ describe("Rule Component", () => {
     ).not.toBeInTheDocument();
   });
 
+  it("clicking editable title calls onTitleClick and does not fire card onClick", () => {
+    const onCard = vi.fn();
+    const onTitle = vi.fn();
+    render(
+      <Rule
+        {...defaultProps}
+        expanded={true}
+        onClick={onCard}
+        onTitleClick={onTitle}
+      />,
+    );
+    fireEvent.click(screen.getByTestId("rule-title-edit"));
+    expect(onTitle).toHaveBeenCalledTimes(1);
+    expect(onCard).not.toHaveBeenCalled();
+  });
+
   it("clicking editable description calls onDescriptionClick and does not fire card onClick", () => {
     const onCard = vi.fn();
     const onDesc = vi.fn();

tests/unit/buildPublishPayload.test.ts

@@ -314,6 +314,40 @@ describe("parseDocumentSectionsForDisplay", () => {
     expect(parseDocumentSectionsForDisplay(doc)).toEqual(doc.sections);
   });
 
+  it("accepts entries with labeled blocks and omits body in JSON (normalized to \"\")", () => {
+    const doc = {
+      sections: [
+        {
+          categoryName: "Membership",
+          entries: [
+            {
+              title: "Open membership",
+              blocks: [
+                { label: "Eligibility", body: "Anyone may join." },
+                { label: "Process", body: "Sign the sheet." },
+              ],
+            },
+          ],
+        },
+      ],
+    };
+    expect(parseDocumentSectionsForDisplay(doc)).toEqual([
+      {
+        categoryName: "Membership",
+        entries: [
+          {
+            title: "Open membership",
+            body: "",
+            blocks: [
+              { label: "Eligibility", body: "Anyone may join." },
+              { label: "Process", body: "Sign the sheet." },
+            ],
+          },
+        ],
+      },
+    ]);
+  });
+
   it("accepts entries with labeled blocks and empty body", () => {
     const doc = {
       sections: [

tests/unit/lib/navigationChromelessPath.test.ts

@@ -0,0 +1,23 @@
+import { describe, expect, it } from "vitest";
+import { isChromelessNavigationPath } from "../../../lib/navigationChromelessPath";
+
+describe("isChromelessNavigationPath", () => {
+  it.each([
+    ["/create", true],
+    ["/create/completed", true],
+    ["/login", true],
+    ["/use-cases/mutual-aid-colorado/rule", true],
+    ["/use-cases/food-not-bombs/rule/", true],
+    ["/", false],
+    ["/use-cases", false],
+    ["/use-cases/mutual-aid-colorado", false],
+    ["/use-cases/mutual-aid-colorado/rule/extra", false],
+  ] as const)("returns %s -> %s", (pathname, expected) => {
+    expect(isChromelessNavigationPath(pathname)).toBe(expected);
+  });
+
+  it("returns false for null or undefined", () => {
+    expect(isChromelessNavigationPath(null)).toBe(false);
+    expect(isChromelessNavigationPath(undefined)).toBe(false);
+  });
+});

tests/unit/normalizePublishedDocumentForEdit.test.ts

@@ -0,0 +1,48 @@
+import { describe, expect, it } from "vitest";
+import useCasesCompletedRules from "../../messages/en/pages/useCasesCompletedRules.json";
+import { createFlowStateFromPublishedRule } from "../../lib/create/publishedDocumentToCreateFlowState";
+import { normalizePublishedDocumentForEdit } from "../../lib/create/normalizePublishedDocumentForEdit";
+
+describe("normalizePublishedDocumentForEdit", () => {
+  it("derives methodSelections and coreValues from use-case display sections", () => {
+    const fixture = useCasesCompletedRules.mutualAidColorado;
+    const normalized = normalizePublishedDocumentForEdit(fixture.document);
+
+    expect(Array.isArray(normalized.coreValues)).toBe(true);
+    expect((normalized.coreValues as unknown[]).length).toBeGreaterThan(0);
+
+    const ms = normalized.methodSelections as Record<string, unknown>;
+    expect(Array.isArray(ms.membership)).toBe(true);
+    expect((ms.membership as unknown[]).length).toBeGreaterThan(0);
+    expect(Array.isArray(ms.decisionApproaches)).toBe(true);
+    expect((ms.decisionApproaches as unknown[]).length).toBeGreaterThan(0);
+  });
+
+  it("is idempotent when methodSelections already exist", () => {
+    const once = normalizePublishedDocumentForEdit(
+      useCasesCompletedRules.mutualAidColorado.document,
+    );
+    const twice = normalizePublishedDocumentForEdit(once);
+    expect(twice.methodSelections).toEqual(once.methodSelections);
+    expect(twice.coreValues).toEqual(once.coreValues);
+  });
+});
+
+describe("createFlowStateFromPublishedRule with section-only documents", () => {
+  it("hydrates method ids from normalized use-case duplicate shape", () => {
+    const doc = normalizePublishedDocumentForEdit(
+      useCasesCompletedRules.mutualAidColorado.document,
+    );
+    const patch = createFlowStateFromPublishedRule({
+      id: "rule-1",
+      title: "Mutual Aid Colorado Template (Copy)",
+      summary: "Summary",
+      document: doc as Record<string, unknown>,
+    });
+
+    expect(patch.selectedMembershipMethodIds?.length).toBeGreaterThan(0);
+    expect(patch.selectedDecisionApproachIds?.length).toBeGreaterThan(0);
+    expect(patch.selectedCoreValueIds?.length).toBeGreaterThan(0);
+    expect(patch.sections).toEqual([]);
+  });
+});

tests/unit/useCaseTemplateDuplicate.test.ts

@@ -0,0 +1,16 @@
+import { describe, expect, it } from "vitest";
+import { useCaseTemplateDuplicateTitle } from "../../lib/useCaseTemplateDuplicate";
+
+describe("useCaseTemplateDuplicateTitle", () => {
+  it("appends Template (Copy) to the source title", () => {
+    expect(useCaseTemplateDuplicateTitle("BoCo Street Medics")).toBe(
+      "BoCo Street Medics Template (Copy)",
+    );
+  });
+
+  it("falls back when the source title is empty", () => {
+    expect(useCaseTemplateDuplicateTitle("   ")).toBe(
+      "Community Rule Template (Copy)",
+    );
+  });
+});

tests/unit/useCasesDuplicateRoute.test.ts

@@ -0,0 +1,98 @@
+import { NextRequest } from "next/server";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+
+const isDatabaseConfiguredMock = vi.fn();
+const createMock = vi.fn();
+const getSessionUserMock = vi.fn();
+
+vi.mock("../../lib/server/env", () => ({
+  isDatabaseConfigured: () => isDatabaseConfiguredMock(),
+}));
+
+vi.mock("../../lib/server/db", () => ({
+  prisma: {
+    publishedRule: {
+      create: (...args: unknown[]) => createMock(...args),
+    },
+  },
+}));
+
+vi.mock("../../lib/server/session", () => ({
+  getSessionUser: () => getSessionUserMock(),
+}));
+
+import { POST } from "../../app/api/use-cases/[slug]/duplicate/route";
+
+function makeContext(slug: string) {
+  return { params: Promise.resolve({ slug }) };
+}
+
+beforeEach(() => {
+  isDatabaseConfiguredMock.mockReset();
+  createMock.mockReset();
+  getSessionUserMock.mockReset();
+});
+
+describe("POST /api/use-cases/[slug]/duplicate", () => {
+  it("returns 401 when not signed in", async () => {
+    isDatabaseConfiguredMock.mockReturnValue(true);
+    getSessionUserMock.mockResolvedValue(null);
+    const res = await POST(
+      new NextRequest("https://x.test/api/use-cases/food-not-bombs/duplicate"),
+      makeContext("food-not-bombs"),
+    );
+    expect(res.status).toBe(401);
+  });
+
+  it("returns 404 for an unknown slug", async () => {
+    isDatabaseConfiguredMock.mockReturnValue(true);
+    getSessionUserMock.mockResolvedValue({ id: "u1", email: "a@b.c" });
+    const res = await POST(
+      new NextRequest("https://x.test/api/use-cases/unknown/duplicate"),
+      makeContext("unknown"),
+    );
+    expect(res.status).toBe(404);
+    expect(createMock).not.toHaveBeenCalled();
+  });
+
+  it("creates a published rule from the use-case fixture", async () => {
+    isDatabaseConfiguredMock.mockReturnValue(true);
+    getSessionUserMock.mockResolvedValue({ id: "u1", email: "a@b.c" });
+    createMock.mockResolvedValueOnce({
+      id: "r-new",
+      title: "Food Not Bombs Boulder Template (Copy)",
+      summary: "Summary",
+      createdAt: new Date("2026-01-01T00:00:00Z"),
+      updatedAt: new Date("2026-01-01T00:00:00Z"),
+    });
+
+    const res = await POST(
+      new NextRequest(
+        "https://x.test/api/use-cases/food-not-bombs/duplicate",
+      ),
+      makeContext("food-not-bombs"),
+    );
+
+    expect(res.status).toBe(200);
+    const body = (await res.json()) as { rule: { id: string; title: string } };
+    expect(body.rule.id).toBe("r-new");
+    expect(createMock).toHaveBeenCalledWith(
+      expect.objectContaining({
+        data: expect.objectContaining({
+          userId: "u1",
+          title: "Food Not Bombs Boulder Template (Copy)",
+          document: expect.objectContaining({
+            methodSelections: expect.objectContaining({
+              membership: expect.arrayContaining([
+                expect.objectContaining({ id: expect.any(String), label: expect.any(String) }),
+              ]),
+            }),
+            coreValues: expect.arrayContaining([
+              expect.objectContaining({ chipId: expect.any(String), label: expect.any(String) }),
+            ]),
+          }),
+        }),
+      }),
+    );
+  });
+});