feat(sprints): interface de création et gestion des sprints (frontend)

Ticket #11 — surface UI de gestion des sprints (frontend pur).

- Nouveau composant SprintManager : création (nom optionnel), édition et
  gestion du cycle de vie d'un sprint, contrôles accessibles (pas de DnD).
- useTickets étendu aux opérations de gestion de sprint ; ports, adaptateurs
  (ticket.ts, mock/index.ts) et TicketsPanel câblés en conséquence.
- Tests Vitest associés (tickets.test.tsx).

Typecheck / vitest (497+ tests) / build verts.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

frontend/src/adapters/mock/index.ts

@@ -1815,6 +1815,7 @@ export class MockTicketGateway implements TicketGateway {
   private carnets = new Map<string, Map<string, string>>();
   private counters = new Map<string, number>();
   private sprints = new Map<string, Map<string, Sprint>>();
+  private sprintCounters = new Map<string, number>();
 
   constructor(private readonly system?: MockSystemGateway) {}
 
@@ -2141,6 +2142,118 @@ export class MockTicketGateway implements TicketGateway {
     });
     return structuredClone(ticket);
   }
+
+  async createSprint(projectId: string, name: string): Promise<Sprint> {
+    const sprints = this.projectSprints(projectId);
+    const seq = (this.sprintCounters.get(projectId) ?? 0) + 1;
+    this.sprintCounters.set(projectId, seq);
+    const order =
+      sprints.size === 0
+        ? 1
+        : Math.max(...[...sprints.values()].map((s) => s.order)) + 1;
+    const sprint: Sprint = {
+      id: `mock-sprint-${projectId}-${seq}`,
+      order,
+      name,
+      status: "planned",
+      ticketCount: 0,
+      version: 1,
+    };
+    sprints.set(sprint.id, sprint);
+    this.system?.emit({
+      type: "sprintCreated",
+      sprintId: sprint.id,
+      order: sprint.order,
+    });
+    return structuredClone(sprint);
+  }
+
+  async renameSprint(
+    projectId: string,
+    sprintId: string,
+    name: string,
+    expectedVersion: number,
+  ): Promise<Sprint> {
+    const sprint = this.requireSprint(projectId, sprintId);
+    this.guardSprint(sprint, expectedVersion);
+    sprint.name = name;
+    sprint.version += 1;
+    this.system?.emit({
+      type: "sprintRenamed",
+      sprintId,
+      name,
+      version: sprint.version,
+    });
+    return structuredClone(sprint);
+  }
+
+  async reorderSprints(
+    projectId: string,
+    orderedIds: string[],
+  ): Promise<Sprint[]> {
+    const sprints = this.projectSprints(projectId);
+    for (const id of orderedIds) this.requireSprint(projectId, id);
+    // Assign 1-based order following the provided id sequence; ids omitted from
+    // `orderedIds` keep their relative order after the listed ones.
+    const rest = [...sprints.values()]
+      .filter((s) => !orderedIds.includes(s.id))
+      .sort((a, b) => a.order - b.order)
+      .map((s) => s.id);
+    [...orderedIds, ...rest].forEach((id, index) => {
+      const sprint = sprints.get(id);
+      if (sprint) {
+        sprint.order = index + 1;
+        this.system?.emit({
+          type: "sprintReordered",
+          sprintId: id,
+          order: sprint.order,
+          version: sprint.version,
+        });
+      }
+    });
+    return this.listSprints(projectId);
+  }
+
+  async deleteSprint(projectId: string, sprintId: string): Promise<void> {
+    this.requireSprint(projectId, sprintId);
+    // Delete unassigns the sprint's tickets (it does NOT delete them): they fall
+    // back to the "no sprint" bucket.
+    for (const ticket of this.projectTickets(projectId).values()) {
+      if (ticket.sprintId === sprintId) {
+        ticket.sprintId = null;
+        this.bump(ticket);
+        this.system?.emit({
+          type: "issueSprintChanged",
+          issueRef: ticket.ref,
+          from: sprintId,
+          to: null,
+          version: ticket.version,
+        });
+      }
+    }
+    this.projectSprints(projectId).delete(sprintId);
+    this.system?.emit({ type: "sprintDeleted", sprintId });
+  }
+
+  private requireSprint(projectId: string, sprintId: string): Sprint {
+    const sprint = this.projectSprints(projectId).get(sprintId);
+    if (!sprint) {
+      throw {
+        code: "NOT_FOUND",
+        message: `sprint ${sprintId} not found`,
+      } as GatewayError;
+    }
+    return sprint;
+  }
+
+  private guardSprint(sprint: Sprint, expectedVersion: number): void {
+    if (sprint.version !== expectedVersion) {
+      throw {
+        code: "INVALID",
+        message: `sprint version conflict: expected ${expectedVersion}, actual ${sprint.version}`,
+      } as GatewayError;
+    }
+  }
 }
 
 function mostRestrictive(

frontend/src/adapters/ticket.ts

@@ -148,4 +148,38 @@ export class TauriTicketGateway implements TicketGateway {
       request: { projectId, ref, sprintId, expectedVersion },
     });
   }
+
+  async createSprint(projectId: string, name: string): Promise<Sprint> {
+    return invoke<Sprint>("sprint_create", {
+      request: { projectId, name },
+    });
+  }
+
+  async renameSprint(
+    projectId: string,
+    sprintId: string,
+    name: string,
+    expectedVersion: number,
+  ): Promise<Sprint> {
+    return invoke<Sprint>("sprint_rename", {
+      request: { projectId, sprintId, name, expectedVersion },
+    });
+  }
+
+  async reorderSprints(
+    projectId: string,
+    orderedIds: string[],
+  ): Promise<Sprint[]> {
+    // `sprint_reorder` returns a `SprintListDto { items }`; unwrap to the array.
+    const list = await invoke<{ items: Sprint[] }>("sprint_reorder", {
+      request: { projectId, orderedIds },
+    });
+    return list.items;
+  }
+
+  async deleteSprint(projectId: string, sprintId: string): Promise<void> {
+    await invoke<void>("sprint_delete", {
+      request: { projectId, sprintId },
+    });
+  }
 }

frontend/src/features/tickets/SprintManager.tsx

@@ -0,0 +1,286 @@
+/**
+ * Sprint management overlay (ticket #11, F3).
+ *
+ * A full-screen dialog to create, rename, reorder (accessible up/down buttons,
+ * no drag-and-drop required) and delete sprints, plus add/remove tickets to a
+ * sprint. All behaviour comes from {@link useTickets} via the injected view-model
+ * — this component is pure presentation over the same hook instance the panel
+ * uses, so mutations reflect live.
+ *
+ * Deleting a sprint UNASSIGNS its tickets (they fall back to the backlog); it
+ * never deletes tickets — the confirmation says so explicitly.
+ */
+
+import { useState } from "react";
+
+import { Button, Input, cn } from "@/shared";
+import { TicketRef } from "./ticketMeta";
+import type { TicketsViewModel } from "./useTickets";
+
+const selectClass = cn(
+  "h-8 rounded-md bg-raised px-2 text-xs text-content",
+  "border border-border outline-none transition-colors",
+  "focus:border-primary disabled:cursor-not-allowed disabled:opacity-50",
+);
+
+export interface SprintManagerProps {
+  vm: TicketsViewModel;
+  onClose: () => void;
+}
+
+export function SprintManager({ vm, onClose }: SprintManagerProps) {
+  const items = vm.list?.items ?? [];
+  const sprints = [...vm.sprints].sort((a, b) => a.order - b.order);
+
+  const [newName, setNewName] = useState("");
+  // Local rename drafts keyed by sprint id; falls back to the stored name.
+  const [renameDrafts, setRenameDrafts] = useState<Record<string, string>>({});
+  // Sprint pending delete confirmation, or null.
+  const [confirmDelete, setConfirmDelete] = useState<
+    { id: string; name: string } | null
+  >(null);
+
+  async function handleCreate(e: React.FormEvent) {
+    e.preventDefault();
+    // Name is optional in the UI; default to a positional name (the backend
+    // requires a non-empty name).
+    const name = newName.trim() || `Sprint ${sprints.length + 1}`;
+    const created = await vm.createSprint(name);
+    if (created) setNewName("");
+  }
+
+  return (
+    <div
+      className="fixed inset-0 z-50 flex flex-col bg-canvas"
+      role="dialog"
+      aria-modal="true"
+      aria-label="manage sprints"
+    >
+      {/* ── Header ── */}
+      <header className="flex shrink-0 items-center justify-between gap-3 border-b border-border px-5 py-3">
+        <span className="text-sm font-medium text-content">Manage sprints</span>
+        <Button size="sm" variant="ghost" onClick={onClose}>
+          Close
+        </Button>
+      </header>
+
+      {vm.error && (
+        <p
+          role="alert"
+          className="shrink-0 border-b border-danger/40 bg-danger/10 px-5 py-2 text-sm text-danger"
+        >
+          {vm.error}
+        </p>
+      )}
+
+      <div className="flex-1 overflow-auto p-5">
+        {/* ── Create ── */}
+        <form
+          onSubmit={handleCreate}
+          className="mb-5 flex items-center gap-2 rounded-md border border-border bg-raised/50 p-2"
+        >
+          <Input
+            aria-label="new sprint name"
+            placeholder="Sprint name (optional)"
+            value={newName}
+            onChange={(e) => setNewName(e.target.value)}
+            className="max-w-xs"
+          />
+          <Button type="submit" size="sm" disabled={vm.busy}>
+            Create sprint
+          </Button>
+        </form>
+
+        {sprints.length === 0 ? (
+          <p className="text-sm text-muted">No sprints yet.</p>
+        ) : (
+          <ul className="flex flex-col gap-4">
+            {sprints.map((sprint, index) => {
+              const inSprint = items.filter((t) => t.sprintId === sprint.id);
+              const addable = items.filter((t) => t.sprintId !== sprint.id);
+              const draft = renameDrafts[sprint.id] ?? sprint.name;
+              return (
+                <li
+                  key={sprint.id}
+                  aria-label={`sprint row ${sprint.name}`}
+                  className="rounded-md border border-border p-3"
+                >
+                  {/* ── Row header: order, rename, reorder, delete ── */}
+                  <div className="flex flex-wrap items-center gap-2">
+                    <span className="text-xs font-semibold text-muted">
+                      #{sprint.order}
+                    </span>
+                    <Input
+                      aria-label={`rename sprint ${sprint.name}`}
+                      value={draft}
+                      disabled={vm.busy}
+                      onChange={(e) =>
+                        setRenameDrafts((prev) => ({
+                          ...prev,
+                          [sprint.id]: e.target.value,
+                        }))
+                      }
+                      className="max-w-xs"
+                    />
+                    <Button
+                      size="sm"
+                      aria-label={`save sprint ${sprint.name}`}
+                      disabled={
+                        vm.busy ||
+                        draft.trim() === "" ||
+                        draft.trim() === sprint.name
+                      }
+                      onClick={async () => {
+                        const ok = await vm.renameSprint(
+                          sprint.id,
+                          draft.trim(),
+                        );
+                        if (ok) {
+                          setRenameDrafts((prev) => {
+                            const { [sprint.id]: _drop, ...rest } = prev;
+                            return rest;
+                          });
+                        }
+                      }}
+                    >
+                      Save
+                    </Button>
+                    <div className="ml-auto flex items-center gap-1">
+                      <Button
+                        size="sm"
+                        variant="ghost"
+                        aria-label={`move sprint ${sprint.name} up`}
+                        disabled={vm.busy || index === 0}
+                        onClick={() => void vm.moveSprint(sprint.id, "up")}
+                      >
+                        ↑
+                      </Button>
+                      <Button
+                        size="sm"
+                        variant="ghost"
+                        aria-label={`move sprint ${sprint.name} down`}
+                        disabled={vm.busy || index === sprints.length - 1}
+                        onClick={() => void vm.moveSprint(sprint.id, "down")}
+                      >
+                        ↓
+                      </Button>
+                      <Button
+                        size="sm"
+                        variant="ghost"
+                        aria-label={`delete sprint ${sprint.name}`}
+                        disabled={vm.busy}
+                        className="text-danger hover:text-danger"
+                        onClick={() =>
+                          setConfirmDelete({ id: sprint.id, name: sprint.name })
+                        }
+                      >
+                        Delete
+                      </Button>
+                    </div>
+                  </div>
+
+                  {/* ── Tickets in this sprint ── */}
+                  <div className="mt-3 flex flex-col gap-1">
+                    {inSprint.length === 0 ? (
+                      <p className="text-xs text-muted">No tickets in this sprint.</p>
+                    ) : (
+                      <ul className="flex flex-col gap-1">
+                        {inSprint.map((t) => (
+                          <li
+                            key={t.ref}
+                            className="flex items-center gap-2 text-sm"
+                          >
+                            <TicketRef ticketRef={t.ref} />
+                            <span className="min-w-0 flex-1 truncate text-content">
+                              {t.title}
+                            </span>
+                            <Button
+                              size="sm"
+                              variant="ghost"
+                              aria-label={`remove ${t.ref} from sprint`}
+                              disabled={vm.busy}
+                              onClick={() => void vm.assignSprint(t.ref, null)}
+                            >
+                              Remove
+                            </Button>
+                          </li>
+                        ))}
+                      </ul>
+                    )}
+
+                    {/* Add an existing ticket (backlog or another sprint). */}
+                    <select
+                      aria-label={`add ticket to sprint ${sprint.name}`}
+                      className={cn(selectClass, "mt-1 max-w-xs")}
+                      value=""
+                      disabled={vm.busy || addable.length === 0}
+                      onChange={(e) => {
+                        const ref = e.target.value;
+                        if (ref) void vm.assignSprint(ref, sprint.id);
+                      }}
+                    >
+                      <option value="">
+                        {addable.length === 0
+                          ? "No tickets to add"
+                          : "Add a ticket…"}
+                      </option>
+                      {addable.map((t) => (
+                        <option key={t.ref} value={t.ref}>
+                          {t.ref} {t.title}
+                        </option>
+                      ))}
+                    </select>
+                  </div>
+                </li>
+              );
+            })}
+          </ul>
+        )}
+      </div>
+
+      {/* ── Delete confirmation ── */}
+      {confirmDelete && (
+        <div
+          role="dialog"
+          aria-modal="true"
+          aria-label="delete sprint confirmation"
+          className="fixed inset-0 z-[60] flex items-center justify-center bg-black/55 p-4"
+        >
+          <div className="w-full max-w-sm rounded-lg border border-border bg-surface p-5 shadow-xl">
+            <h4 className="text-sm font-semibold text-content">
+              Supprimer le sprint « {confirmDelete.name} »&nbsp;?
+            </h4>
+            <p className="mt-2 text-sm text-muted">
+              Les tickets de ce sprint ne seront pas supprimés&nbsp;: ils seront
+              simplement désassignés et retourneront au backlog «&nbsp;Sans
+              sprint&nbsp;».
+            </p>
+            <div className="mt-4 flex items-center justify-end gap-2">
+              <Button
+                size="sm"
+                variant="ghost"
+                aria-label="cancel delete sprint"
+                disabled={vm.busy}
+                onClick={() => setConfirmDelete(null)}
+              >
+                Annuler
+              </Button>
+              <Button
+                size="sm"
+                aria-label="confirm delete sprint"
+                className="text-danger hover:text-danger"
+                disabled={vm.busy}
+                onClick={async () => {
+                  await vm.deleteSprint(confirmDelete.id);
+                  setConfirmDelete(null);
+                }}
+              >
+                Supprimer
+              </Button>
+            </div>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}

frontend/src/features/tickets/TicketsPanel.tsx

@@ -18,6 +18,7 @@ import type {
 import { Button, Input, Panel, Spinner, cn } from "@/shared";
 import { useTickets } from "./useTickets";
 import { useProjectAgents } from "./useProjectAgents";
+import { SprintManager } from "./SprintManager";
 import {
   PriorityBadge,
   StatusBadge,
@@ -44,6 +45,7 @@ export function TicketsPanel({ projectId, onOpen }: TicketsPanelProps) {
   const vm = useTickets(projectId);
   const { agents, nameOf } = useProjectAgents(projectId);
   const [showCreate, setShowCreate] = useState(false);
+  const [showSprints, setShowSprints] = useState(false);
   const [newTitle, setNewTitle] = useState("");
   const [newPriority, setNewPriority] = useState<TicketPriority>("medium");
 
@@ -90,6 +92,14 @@ export function TicketsPanel({ projectId, onOpen }: TicketsPanelProps) {
           >
             {showCreate ? "Cancel" : "New"}
           </Button>
+          <Button
+            size="sm"
+            variant="ghost"
+            aria-label="manage sprints"
+            onClick={() => setShowSprints(true)}
+          >
+            Sprints
+          </Button>
           <Button
             size="sm"
             variant="ghost"
@@ -268,6 +278,10 @@ export function TicketsPanel({ projectId, onOpen }: TicketsPanelProps) {
           </Button>
         </div>
       )}
+
+      {showSprints && (
+        <SprintManager vm={vm} onClose={() => setShowSprints(false)} />
+      )}
     </Panel>
   );
 }

frontend/src/features/tickets/index.ts

@@ -7,6 +7,8 @@ export { TicketsPanel } from "./TicketsPanel";
 export type { TicketsPanelProps } from "./TicketsPanel";
 export { TicketDetail } from "./TicketDetail";
 export type { TicketDetailProps } from "./TicketDetail";
+export { SprintManager } from "./SprintManager";
+export type { SprintManagerProps } from "./SprintManager";
 export { useTickets } from "./useTickets";
 export type { TicketsViewModel } from "./useTickets";
 export { useTicketDetail } from "./useTicketDetail";

frontend/src/features/tickets/tickets.test.tsx

@@ -428,3 +428,155 @@ describe("TicketsView", () => {
     );
   });
 });
+
+describe("SprintManager (#11)", () => {
+  let system: MockSystemGateway;
+  let ticket: MockTicketGateway;
+  let agent: MockAgentGateway;
+
+  beforeEach(() => {
+    system = new MockSystemGateway();
+    ticket = new MockTicketGateway(system);
+    agent = new MockAgentGateway();
+  });
+
+  /** Renders the view and opens the sprint-management overlay. */
+  async function openManager(): Promise<HTMLElement> {
+    renderView(ticket, system, agent);
+    await waitFor(() =>
+      expect(
+        screen.getByRole("button", { name: "manage sprints" }),
+      ).toBeTruthy(),
+    );
+    fireEvent.click(screen.getByRole("button", { name: "manage sprints" }));
+    return screen.findByRole("dialog", { name: "manage sprints" });
+  }
+
+  it("creates a sprint", async () => {
+    const dialog = await openManager();
+
+    fireEvent.change(within(dialog).getByLabelText("new sprint name"), {
+      target: { value: "Alpha" },
+    });
+    fireEvent.click(within(dialog).getByText("Create sprint"));
+
+    await waitFor(async () => {
+      const sprints = await ticket.listSprints(PROJECT_ID);
+      expect(sprints.map((s) => s.name)).toEqual(["Alpha"]);
+    });
+    expect(
+      await within(dialog).findByLabelText("sprint row Alpha"),
+    ).toBeTruthy();
+  });
+
+  it("creates a sprint with a default positional name when the name is empty", async () => {
+    const dialog = await openManager();
+
+    // Leave the name field empty and create → default "Sprint N" (here N=1).
+    expect(
+      (within(dialog).getByLabelText("new sprint name") as HTMLInputElement)
+        .value,
+    ).toBe("");
+    fireEvent.click(within(dialog).getByText("Create sprint"));
+
+    await waitFor(async () => {
+      const sprints = await ticket.listSprints(PROJECT_ID);
+      expect(sprints.map((s) => s.name)).toEqual(["Sprint 1"]);
+    });
+    expect(
+      await within(dialog).findByLabelText("sprint row Sprint 1"),
+    ).toBeTruthy();
+  });
+
+  it("renames a sprint", async () => {
+    ticket._seedSprint(PROJECT_ID, { id: "s1", order: 1, name: "Old" });
+    const dialog = await openManager();
+
+    fireEvent.change(
+      await within(dialog).findByLabelText("rename sprint Old"),
+      { target: { value: "New" } },
+    );
+    fireEvent.click(within(dialog).getByLabelText("save sprint Old"));
+
+    await waitFor(async () => {
+      const [s] = await ticket.listSprints(PROJECT_ID);
+      expect(s.name).toBe("New");
+    });
+  });
+
+  it("reorders sprints via the accessible down button", async () => {
+    ticket._seedSprint(PROJECT_ID, { id: "s1", order: 1, name: "One" });
+    ticket._seedSprint(PROJECT_ID, { id: "s2", order: 2, name: "Two" });
+    const dialog = await openManager();
+
+    fireEvent.click(
+      await within(dialog).findByLabelText("move sprint One down"),
+    );
+
+    await waitFor(async () => {
+      const sprints = await ticket.listSprints(PROJECT_ID);
+      // "Two" is now first (order 1), "One" second.
+      expect(sprints.map((s) => s.name)).toEqual(["Two", "One"]);
+    });
+  });
+
+  it("deletes a sprint and unassigns (does not delete) its tickets", async () => {
+    ticket._seedSprint(PROJECT_ID, { id: "s1", order: 1, name: "Doomed" });
+    const t = await ticket.create(PROJECT_ID, { title: "Kept" });
+    await ticket.setTicketSprint(PROJECT_ID, t.ref, "s1", t.version);
+
+    const dialog = await openManager();
+
+    fireEvent.click(
+      await within(dialog).findByLabelText("delete sprint Doomed"),
+    );
+    // The confirmation explains tickets are unassigned, not deleted.
+    const confirm = await screen.findByRole("dialog", {
+      name: "delete sprint confirmation",
+    });
+    expect(confirm.textContent).toMatch(/ne seront pas supprimés/i);
+    fireEvent.click(within(confirm).getByLabelText("confirm delete sprint"));
+
+    await waitFor(async () => {
+      expect(await ticket.listSprints(PROJECT_ID)).toHaveLength(0);
+    });
+    // The ticket still exists, just unassigned.
+    const fresh = await ticket.read(PROJECT_ID, t.ref);
+    expect(fresh.sprintId).toBeNull();
+    expect(fresh.title).toBe("Kept");
+  });
+
+  it("adds a backlog ticket to a sprint via the add selector", async () => {
+    ticket._seedSprint(PROJECT_ID, { id: "s1", order: 1, name: "Target" });
+    const t = await ticket.create(PROJECT_ID, { title: "Backlog item" });
+
+    const dialog = await openManager();
+
+    fireEvent.change(
+      await within(dialog).findByLabelText("add ticket to sprint Target"),
+      { target: { value: t.ref } },
+    );
+
+    await waitFor(async () => {
+      const fresh = await ticket.read(PROJECT_ID, t.ref);
+      expect(fresh.sprintId).toBe("s1");
+    });
+  });
+
+  it("removes a ticket from a sprint", async () => {
+    ticket._seedSprint(PROJECT_ID, { id: "s1", order: 1, name: "Holder" });
+    const t = await ticket.create(PROJECT_ID, { title: "Member" });
+    await ticket.setTicketSprint(PROJECT_ID, t.ref, "s1", t.version);
+
+    const dialog = await openManager();
+
+    fireEvent.click(
+      await within(dialog).findByLabelText(`remove ${t.ref} from sprint`),
+    );
+
+    await waitFor(async () => {
+      const fresh = await ticket.read(PROJECT_ID, t.ref);
+      expect(fresh.sprintId).toBeNull();
+    });
+  });
+});

frontend/src/features/tickets/useTickets.ts

@@ -40,6 +40,20 @@ export interface TicketsViewModel {
    * version column. Refreshes on the resulting `issueSprintChanged` event.
    */
   assignSprint: (ref: string, sprintId: string | null) => Promise<boolean>;
+  /** Creates a sprint (#11). Returns the created sprint, or `null` on error. */
+  createSprint: (name: string) => Promise<Sprint | null>;
+  /** Renames a sprint using its current version (#11). */
+  renameSprint: (sprintId: string, name: string) => Promise<boolean>;
+  /**
+   * Moves a sprint one slot up/down in execution order via `reorderSprints`
+   * (#11). A no-op at the ends. Accessible (button-driven), non-DnD.
+   */
+  moveSprint: (sprintId: string, direction: "up" | "down") => Promise<boolean>;
+  /**
+   * Deletes a sprint (#11). The backend unassigns its tickets (does NOT delete
+   * them). Refreshes both the sprint list and the tickets.
+   */
+  deleteSprint: (sprintId: string) => Promise<boolean>;
 }
 
 function describe(e: unknown): string {
@@ -116,6 +130,80 @@ export function useTickets(projectId: string): TicketsViewModel {
     [projectId, ticket, refresh, refreshSprints],
   );
 
+  const createSprint = useCallback(
+    async (name: string): Promise<Sprint | null> => {
+      setError(null);
+      try {
+        const created = await ticket.createSprint(projectId, name);
+        await refreshSprints();
+        return created;
+      } catch (e) {
+        setError(describe(e));
+        return null;
+      }
+    },
+    [projectId, ticket, refreshSprints],
+  );
+
+  const renameSprint = useCallback(
+    async (sprintId: string, name: string): Promise<boolean> => {
+      setError(null);
+      try {
+        const current = sprints.find((s) => s.id === sprintId);
+        if (!current) return false;
+        await ticket.renameSprint(projectId, sprintId, name, current.version);
+        await refreshSprints();
+        return true;
+      } catch (e) {
+        setError(describe(e));
+        return false;
+      }
+    },
+    [projectId, ticket, sprints, refreshSprints],
+  );
+
+  const moveSprint = useCallback(
+    async (sprintId: string, direction: "up" | "down"): Promise<boolean> => {
+      setError(null);
+      const ordered = [...sprints].sort((a, b) => a.order - b.order);
+      const index = ordered.findIndex((s) => s.id === sprintId);
+      const swapWith = direction === "up" ? index - 1 : index + 1;
+      if (index === -1 || swapWith < 0 || swapWith >= ordered.length) {
+        return false;
+      }
+      const next = [...ordered];
+      [next[index], next[swapWith]] = [next[swapWith], next[index]];
+      try {
+        await ticket.reorderSprints(
+          projectId,
+          next.map((s) => s.id),
+        );
+        await refreshSprints();
+        return true;
+      } catch (e) {
+        setError(describe(e));
+        return false;
+      }
+    },
+    [projectId, ticket, sprints, refreshSprints],
+  );
+
+  const deleteSprint = useCallback(
+    async (sprintId: string): Promise<boolean> => {
+      setError(null);
+      try {
+        await ticket.deleteSprint(projectId, sprintId);
+        // Delete unassigns tickets → refresh both projections.
+        await Promise.all([refresh(), refreshSprints()]);
+        return true;
+      } catch (e) {
+        setError(describe(e));
+        return false;
+      }
+    },
+    [projectId, ticket, refresh, refreshSprints],
+  );
+
   useEffect(() => {
     void refresh();
   }, [refresh]);
@@ -157,5 +245,9 @@ export function useTickets(projectId: string): TicketsViewModel {
     refresh,
     create,
     assignSprint,
+    createSprint,
+    renameSprint,
+    moveSprint,
+    deleteSprint,
   };
 }

frontend/src/ports/index.ts

@@ -807,6 +807,28 @@ export interface TicketGateway {
     sprintId: string | null,
     expectedVersion: number,
   ): Promise<Ticket>;
+  /** Creates a sprint (name required by the backend) and returns it (#11). */
+  createSprint(projectId: string, name: string): Promise<Sprint>;
+  /**
+   * Renames a sprint. Optimistic concurrency: `expectedVersion` must match the
+   * sprint's current version (#11).
+   */
+  renameSprint(
+    projectId: string,
+    sprintId: string,
+    name: string,
+    expectedVersion: number,
+  ): Promise<Sprint>;
+  /**
+   * Reorders sprints to the given full list of ids (execution order). Returns
+   * the reordered sprint list (#11).
+   */
+  reorderSprints(projectId: string, orderedIds: string[]): Promise<Sprint[]>;
+  /**
+   * Deletes a sprint. The backend unassigns its tickets (it does NOT delete
+   * them); they fall back to the "no sprint" bucket (#11).
+   */
+  deleteSprint(projectId: string, sprintId: string): Promise<void>;
 }
 
 /**