@jcjeon/integration-cli 0.2.0

package/apps/web/src/features/tasks/api/__tests__/tasks.api.test.ts

@@ -0,0 +1,282 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+
+import {
+  archiveTask,
+  createTask,
+  deleteTask,
+  executeTask,
+  fetchTaskConversations,
+  fetchTask,
+  fetchTaskRuns,
+  fetchTasks,
+  rerunTask,
+  rerunTaskAgent,
+  stopTask,
+  updateTask,
+} from "../tasks.api";
+import type { CreateTaskPayload } from "../tasks.api";
+
+const mockFetch = vi.fn();
+
+beforeEach(() => { vi.stubGlobal("fetch", mockFetch); });
+afterEach(() => { vi.unstubAllGlobals(); });
+
+function ok(body: unknown) {
+  return Promise.resolve({ ok: true, json: () => Promise.resolve(body) } as Response);
+}
+function err(status: number) {
+  return Promise.resolve({ ok: false, status } as Response);
+}
+
+const mockTask = {
+  id: "task-1",
+  title: "로그인 구현",
+  status: "pending",
+  workingDir: null,
+  requirements: [],
+  agents: [],
+  createdAt: "2024-01-01",
+  updatedAt: "2024-01-01",
+};
+
+describe("createTask", () => {
+  const payload: CreateTaskPayload = {
+    title: "로그인 구현",
+    requirements: [{ content: "UI 디자인", orderIndex: 0 }],
+    agents: [{ agentType: "claude", role: "frontend" }],
+  };
+
+  it("sends POST with correct body", async () => {
+    mockFetch.mockReturnValueOnce(ok(mockTask));
+
+    await createTask(payload);
+
+    expect(mockFetch).toHaveBeenCalledWith(
+      expect.stringContaining("/tasks"),
+      expect.objectContaining({
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(payload),
+      }),
+    );
+  });
+
+  it("returns created task", async () => {
+    mockFetch.mockReturnValueOnce(ok(mockTask));
+    const result = await createTask(payload);
+    expect(result.id).toBe("task-1");
+    expect(result.title).toBe("로그인 구현");
+  });
+
+  it("throws on HTTP error", async () => {
+    mockFetch.mockReturnValueOnce(err(422));
+    await expect(createTask(payload)).rejects.toThrow("HTTP 422");
+  });
+
+  it("includes workingDir when provided", async () => {
+    mockFetch.mockReturnValueOnce(ok(mockTask));
+    const payloadWithDir = { ...payload, workingDir: "/project" };
+    await createTask(payloadWithDir);
+    expect(mockFetch).toHaveBeenCalledWith(
+      expect.any(String),
+      expect.objectContaining({ body: JSON.stringify(payloadWithDir) }),
+    );
+  });
+});
+
+describe("fetchTasks", () => {
+  it("returns task list", async () => {
+    mockFetch.mockReturnValueOnce(ok([mockTask]));
+
+    const result = await fetchTasks();
+
+    expect(result).toHaveLength(1);
+    expect(result[0].id).toBe("task-1");
+    expect(mockFetch).toHaveBeenCalledWith(expect.stringContaining("/tasks"));
+  });
+
+  it("returns empty array when no tasks", async () => {
+    mockFetch.mockReturnValueOnce(ok([]));
+    const result = await fetchTasks();
+    expect(result).toHaveLength(0);
+  });
+
+  it("throws on HTTP error", async () => {
+    mockFetch.mockReturnValueOnce(err(500));
+    await expect(fetchTasks()).rejects.toThrow("HTTP 500");
+  });
+});
+
+describe("fetchTask", () => {
+  it("returns one task", async () => {
+    mockFetch.mockReturnValueOnce(ok(mockTask));
+
+    const result = await fetchTask("task-1");
+
+    expect(mockFetch).toHaveBeenCalledWith(expect.stringContaining("/tasks/task-1"));
+    expect(result).toEqual(mockTask);
+  });
+
+  it("throws on HTTP error", async () => {
+    mockFetch.mockReturnValueOnce(err(404));
+    await expect(fetchTask("missing")).rejects.toThrow("HTTP 404");
+  });
+});
+
+describe("updateTask", () => {
+  it("sends PATCH with JSON body", async () => {
+    mockFetch.mockReturnValueOnce(ok(mockTask));
+
+    await updateTask("task-1", { title: "수정" });
+
+    expect(mockFetch).toHaveBeenCalledWith(
+      expect.stringContaining("/tasks/task-1"),
+      expect.objectContaining({
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ title: "수정" }),
+      }),
+    );
+  });
+
+  it("throws on HTTP error", async () => {
+    mockFetch.mockReturnValueOnce(err(400));
+    await expect(updateTask("task-1", { title: "" })).rejects.toThrow("HTTP 400");
+  });
+});
+
+describe("archiveTask", () => {
+  it("posts to archive endpoint", async () => {
+    mockFetch.mockReturnValueOnce(Promise.resolve({ ok: true } as Response));
+
+    await archiveTask("task-1");
+
+    expect(mockFetch).toHaveBeenCalledWith(
+      expect.stringContaining("/tasks/task-1/archive"),
+      { method: "POST" },
+    );
+  });
+
+  it("throws on HTTP error", async () => {
+    mockFetch.mockReturnValueOnce(err(409));
+    await expect(archiveTask("task-1")).rejects.toThrow("HTTP 409");
+  });
+});
+
+describe("deleteTask", () => {
+  it("sends DELETE to correct URL", async () => {
+    mockFetch.mockReturnValueOnce(Promise.resolve({ ok: true } as Response));
+
+    await deleteTask("task-123");
+
+    expect(mockFetch).toHaveBeenCalledWith(
+      expect.stringContaining("/tasks/task-123"),
+      expect.objectContaining({ method: "DELETE" }),
+    );
+  });
+
+  it("throws on HTTP error", async () => {
+    mockFetch.mockReturnValueOnce(err(500));
+    await expect(deleteTask("task-123")).rejects.toThrow("HTTP 500");
+  });
+});
+
+describe("execution controls", () => {
+  it("executeTask posts and returns the updated task", async () => {
+    mockFetch.mockReturnValueOnce(ok({ ...mockTask, status: "running" }));
+
+    const result = await executeTask("task-1", [{ agentId: 7, writeTestCode: true }]);
+
+    expect(mockFetch).toHaveBeenCalledWith(
+      expect.stringContaining("/tasks/task-1/execute"),
+      {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ agentTestCodePreferences: [{ agentId: 7, writeTestCode: true }] }),
+      },
+    );
+    expect(result.status).toBe("running");
+  });
+
+  it("stopTask posts and returns the updated task", async () => {
+    mockFetch.mockReturnValueOnce(ok({ ...mockTask, status: "stopped" }));
+
+    const result = await stopTask("task-1");
+
+    expect(mockFetch).toHaveBeenCalledWith(
+      expect.stringContaining("/tasks/task-1/stop"),
+      { method: "POST" },
+    );
+    expect(result.status).toBe("stopped");
+  });
+
+  it("rerunTask posts supplement note and test flag as JSON", async () => {
+    mockFetch.mockReturnValueOnce(ok({ ...mockTask, status: "running" }));
+
+    await rerunTask("task-1", "추가 지시", true);
+
+    expect(mockFetch).toHaveBeenCalledWith(
+      expect.stringContaining("/tasks/task-1/rerun"),
+      {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ supplementNote: "추가 지시", writeTestCode: true }),
+      },
+    );
+  });
+
+  it("rerunTaskAgent posts supplement note and test flag as JSON", async () => {
+    mockFetch.mockReturnValueOnce(ok({ ...mockTask, status: "running" }));
+
+    await rerunTaskAgent("task-1", 7, "agent note", true);
+
+    expect(mockFetch).toHaveBeenCalledWith(
+      expect.stringContaining("/tasks/task-1/agents/7/rerun"),
+      {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ supplementNote: "agent note", writeTestCode: true }),
+      },
+    );
+  });
+
+  it("throws when execution endpoints fail", async () => {
+    mockFetch.mockReturnValueOnce(err(500));
+    await expect(executeTask("task-1")).rejects.toThrow("HTTP 500");
+
+    mockFetch.mockReturnValueOnce(err(409));
+    await expect(stopTask("task-1")).rejects.toThrow("HTTP 409");
+
+    mockFetch.mockReturnValueOnce(err(422));
+    await expect(rerunTask("task-1")).rejects.toThrow("HTTP 422");
+  });
+});
+
+describe("fetchTaskRuns", () => {
+  it("returns run history", async () => {
+    const runs = [{ id: 1, version: 1, supplementNote: null, status: "completed", startedAt: "2024-01-01", completedAt: null, agentRuns: [] }];
+    mockFetch.mockReturnValueOnce(ok(runs));
+
+    const result = await fetchTaskRuns("task-1");
+
+    expect(mockFetch).toHaveBeenCalledWith(expect.stringContaining("/tasks/task-1/runs"));
+    expect(result).toEqual(runs);
+  });
+
+  it("throws on HTTP error", async () => {
+    mockFetch.mockReturnValueOnce(err(500));
+    await expect(fetchTaskRuns("task-1")).rejects.toThrow("HTTP 500");
+  });
+});
+
+describe("fetchTaskConversations", () => {
+  it("returns task conversations", async () => {
+    const conversations = [{ id: "c1", sessionId: "task-1", promptId: "p1", agentId: 1, runId: 2, content: "log", agentModel: "claude", type: "agent_message", createdAt: "2024-01-01" }];
+    mockFetch.mockReturnValueOnce(ok(conversations));
+
+    const result = await fetchTaskConversations("task-1");
+
+    expect(mockFetch).toHaveBeenCalledWith(expect.stringContaining("/conversations/session/task-1"));
+    expect(result).toEqual(conversations);
+  });
+});

package/apps/web/src/features/tasks/api/changelog.api.ts

@@ -0,0 +1,52 @@
+import { SERVER_URL } from "@/lib/constants";
+
+export type ChangeType = "added" | "modified" | "deleted" | "renamed";
+
+export interface ChangelogFile {
+  id: number;
+  filePath: string;
+  changeType: ChangeType;
+  additions: number;
+  deletions: number;
+  patch: string | null;
+}
+
+export interface AgentChangelog {
+  agentId: number;
+  files: ChangelogFile[];
+}
+
+export interface MergeResult {
+  success: boolean;
+  message: string;
+}
+
+export async function fetchTaskChangelog(taskId: string, signal?: AbortSignal): Promise<AgentChangelog[]> {
+  const res = await fetch(`${SERVER_URL}/tasks/${taskId}/changelog`, { signal });
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}
+
+export async function fetchTaskRunChangelog(taskId: string, runId: number, signal?: AbortSignal): Promise<AgentChangelog[]> {
+  const res = await fetch(`${SERVER_URL}/tasks/${taskId}/runs/${runId}/changelog`, { signal });
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}
+
+export async function mergeAgentAll(taskId: string, agentId: number): Promise<MergeResult> {
+  const res = await fetch(`${SERVER_URL}/tasks/${taskId}/agents/${agentId}/merge`, {
+    method: "POST",
+  });
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}
+
+export async function mergeAgentFile(taskId: string, agentId: number, filePath: string): Promise<MergeResult> {
+  const res = await fetch(`${SERVER_URL}/tasks/${taskId}/agents/${agentId}/merge-file`, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ filePath }),
+  });
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}

package/apps/web/src/features/tasks/api/tasks.api.ts

@@ -0,0 +1,175 @@
+import { SERVER_URL } from "@/lib/constants";
+
+export type AgentRole = "frontend" | "backend" | "doc" | "operation" | "other";
+
+export interface TaskAgentRun {
+  id: number;
+  agentId: number;
+  status: string;
+  worktreePath: string | null;
+  startCommitHash: string | null;
+  durationMs: number | null;
+  costUsd: number | null;
+}
+
+export interface TaskRun {
+  id: number;
+  version: number;
+  supplementNote: string | null;
+  status: string;
+  startedAt: string;
+  completedAt: string | null;
+  agentRuns: TaskAgentRun[];
+}
+
+export interface TaskConversation {
+  id: string;
+  sessionId: string;
+  promptId: string;
+  agentId: number | null;
+  runId: number | null;
+  content: string;
+  agentModel: string;
+  type: "user_message" | "agent_message";
+  createdAt: string;
+}
+
+export type TaskStatus = "pending" | "running" | "stopped" | "completed" | "error";
+export type AgentStatus = "pending" | "running" | "stopped" | "completed" | "error";
+
+export interface TaskRequirement {
+  id: number;
+  content: string;
+  status: string;
+  orderIndex: number;
+}
+
+export type AgentType = "claude" | "gemini" | "codex" | "opencode";
+
+export interface TaskAgent {
+  id: number;
+  agentType: AgentType;
+  role: AgentRole;
+  customRole: string | null;
+  status: AgentStatus;
+  claudeSessionId?: string | null;
+}
+
+export interface Task {
+  id: string;
+  title: string;
+  status: TaskStatus;
+  workingDir: string | null;
+  requirements: TaskRequirement[];
+  agents: TaskAgent[];
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface CreateTaskPayload {
+  title: string;
+  workingDir?: string;
+  requirements: { content: string; orderIndex: number }[];
+  agents: { agentType: AgentType; role: AgentRole; customRole?: string }[];
+}
+
+export type UpdateTaskPayload = Partial<CreateTaskPayload>;
+
+export interface AgentTestCodePreference {
+  agentId: number;
+  writeTestCode: boolean;
+}
+
+// ─── CRUD ────────────────────────────────────────────────────────────────────
+
+export async function createTask(payload: CreateTaskPayload): Promise<Task> {
+  const res = await fetch(`${SERVER_URL}/tasks`, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(payload),
+  });
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}
+
+export async function fetchTasks(): Promise<Task[]> {
+  const res = await fetch(`${SERVER_URL}/tasks`);
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}
+
+export async function fetchTask(id: string): Promise<Task> {
+  const res = await fetch(`${SERVER_URL}/tasks/${id}`);
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}
+
+export async function updateTask(id: string, payload: UpdateTaskPayload): Promise<Task> {
+  const res = await fetch(`${SERVER_URL}/tasks/${id}`, {
+    method: "PATCH",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(payload),
+  });
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}
+
+export async function archiveTask(id: string): Promise<void> {
+  const res = await fetch(`${SERVER_URL}/tasks/${id}/archive`, { method: "POST" });
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+}
+
+export async function deleteTask(id: string): Promise<void> {
+  const res = await fetch(`${SERVER_URL}/tasks/${id}`, { method: "DELETE" });
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+}
+
+// ─── 실행 제어 ────────────────────────────────────────────────────────────────
+
+export async function executeTask(id: string, agentTestCodePreferences: AgentTestCodePreference[] = []): Promise<Task> {
+  const res = await fetch(`${SERVER_URL}/tasks/${id}/execute`, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ agentTestCodePreferences }),
+  });
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}
+
+export async function stopTask(id: string): Promise<Task> {
+  const res = await fetch(`${SERVER_URL}/tasks/${id}/stop`, { method: "POST" });
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}
+
+export async function fetchTaskRuns(id: string): Promise<TaskRun[]> {
+  const res = await fetch(`${SERVER_URL}/tasks/${id}/runs`);
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}
+
+export async function fetchTaskConversations(id: string): Promise<TaskConversation[]> {
+  const res = await fetch(`${SERVER_URL}/conversations/session/${id}`);
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}
+
+export async function rerunTask(id: string, supplementNote?: string, writeTestCode?: boolean): Promise<Task> {
+  const res = await fetch(`${SERVER_URL}/tasks/${id}/rerun`, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ supplementNote, writeTestCode }),
+  });
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}
+
+export async function rerunTaskAgent(id: string, agentId: number, supplementNote?: string, writeTestCode?: boolean): Promise<Task> {
+  const res = await fetch(`${SERVER_URL}/tasks/${id}/agents/${agentId}/rerun`, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ supplementNote, writeTestCode }),
+  });
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return res.json();
+}

package/apps/web/src/features/tasks/container/TaskDetailPageContainer.tsx

@@ -0,0 +1,69 @@
+"use client";
+
+import Link from "next/link";
+import { useEffect, useState } from "react";
+
+import { fetchTask } from "../api/tasks.api";
+import type { Task } from "../api/tasks.api";
+import { TaskDetailView } from "../ui/TaskDetailView";
+
+interface Props {
+  taskId: string;
+}
+
+export function TaskDetailPageContainer({ taskId }: Props) {
+  const [task, setTask] = useState<Task | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    let active = true;
+    setLoading(true);
+    setError(null);
+
+    fetchTask(taskId)
+      .then((nextTask) => { if (active) setTask(nextTask); })
+      .catch((e: Error) => { if (active) setError(e.message); })
+      .finally(() => { if (active) setLoading(false); });
+
+    return () => { active = false; };
+  }, [taskId]);
+
+  return (
+    <main className="min-h-screen bg-[#faf8f5] px-4 py-8 dark:bg-[#07090e]">
+      <div className="mx-auto mb-6 flex max-w-4xl items-center justify-between">
+        <div className="flex items-center gap-3">
+          <Link
+            href="/"
+            className="flex h-7 w-7 items-center justify-center rounded-lg border border-gray-900/[0.08] text-gray-900/30 transition-colors hover:border-gray-900/[0.15] hover:text-gray-900/60 dark:border-white/[0.08] dark:text-white/30 dark:hover:border-white/[0.15] dark:hover:text-white/60"
+            aria-label="홈으로 이동"
+          >
+            <svg viewBox="0 0 16 16" fill="currentColor" className="h-3.5 w-3.5">
+              <path fillRule="evenodd" d="M9.78 4.22a.75.75 0 010 1.06L7.06 8l2.72 2.72a.75.75 0 11-1.06 1.06L5.47 8.53a.75.75 0 010-1.06l3.25-3.25a.75.75 0 011.06 0z" clipRule="evenodd" />
+            </svg>
+          </Link>
+          <div>
+            <p className="text-sm font-semibold text-gray-900/80 dark:text-white/80">작업 상세보기</p>
+            <p className="font-mono text-[11px] text-gray-900/30 dark:text-white/30">{taskId}</p>
+          </div>
+        </div>
+      </div>
+
+      {loading && (
+        <div className="mx-auto flex max-w-4xl flex-col gap-3">
+          {[0, 1, 2].map((index) => (
+            <div key={index} className="h-24 animate-pulse rounded-xl border border-gray-900/[0.05] bg-white/50 dark:border-white/[0.05] dark:bg-white/[0.03]" />
+          ))}
+        </div>
+      )}
+
+      {!loading && error && (
+        <p className="mx-auto max-w-4xl rounded-xl border border-red-200 bg-red-50 px-3 py-2.5 text-xs text-red-600 dark:border-red-900/50 dark:bg-red-950/30 dark:text-red-400">
+          {error}
+        </p>
+      )}
+
+      {!loading && !error && task && <TaskDetailView task={task} />}
+    </main>
+  );
+}

package/apps/web/src/features/tasks/hooks/__tests__/useChangelogCodeCopy.test.ts

@@ -0,0 +1,48 @@
+import { describe, expect, it } from "vitest";
+
+import { extractCopyableCodeFromPatch } from "../useChangelogCodeCopy";
+
+describe("extractCopyableCodeFromPatch", () => {
+  it("diff 메타데이터와 삭제 라인을 제거하고 붙여넣기 가능한 코드만 반환한다", () => {
+    const patch = [
+      "diff --git a/src/App.tsx b/src/App.tsx",
+      "index abc..def 100644",
+      "--- a/src/App.tsx",
+      "+++ b/src/App.tsx",
+      "@@ -1,4 +1,5 @@",
+      " import React from \"react\";",
+      "-const title = \"old\";",
+      "+const title = \"new\";",
+      "+const enabled = true;",
+      " export function App() {",
+      "   return title;",
+      " }",
+    ].join("\n");
+
+    expect(extractCopyableCodeFromPatch(patch)).toBe([
+      "import React from \"react\";",
+      "const title = \"new\";",
+      "const enabled = true;",
+      "export function App() {",
+      "  return title;",
+      "}",
+    ].join("\n"));
+  });
+
+  it("새 파일 patch는 파일 내용만 반환한다", () => {
+    const patch = [
+      "diff --git a/src/new.ts b/src/new.ts",
+      "new file mode 100644",
+      "--- /dev/null",
+      "+++ b/src/new.ts",
+      "@@ -0,0 +1,2 @@",
+      "+export const value = 1;",
+      "+export const name = \"ji\";",
+    ].join("\n");
+
+    expect(extractCopyableCodeFromPatch(patch)).toBe([
+      "export const value = 1;",
+      "export const name = \"ji\";",
+    ].join("\n"));
+  });
+});

package/apps/web/src/features/tasks/hooks/__tests__/useTaskChangelog.test.ts

@@ -0,0 +1,48 @@
+import { renderHook, waitFor } from "@testing-library/react";
+import { afterEach, describe, expect, it, vi } from "vitest";
+
+import type { AgentChangelog } from "../../api/changelog.api";
+import * as changelogApi from "../../api/changelog.api";
+import { useTaskChangelog } from "../useTaskChangelog";
+
+vi.mock("../../api/changelog.api", () => ({
+  fetchTaskChangelog: vi.fn(),
+}));
+
+const mockFetchTaskChangelog = vi.mocked(changelogApi.fetchTaskChangelog);
+
+const changelog: AgentChangelog = {
+  agentId: 1,
+  files: [
+    { id: 1, filePath: "src/App.tsx", changeType: "modified", additions: 3, deletions: 1, patch: "@@" },
+  ],
+};
+
+afterEach(() => { vi.clearAllMocks(); });
+
+describe("useTaskChangelog", () => {
+  it("clears changelogs and skips fetch without a task id", () => {
+    const { result } = renderHook(() => useTaskChangelog(null));
+
+    expect(result.current.changelogs).toEqual([]);
+    expect(mockFetchTaskChangelog).not.toHaveBeenCalled();
+  });
+
+  it("loads changelogs with an abort signal", async () => {
+    mockFetchTaskChangelog.mockResolvedValueOnce([changelog]);
+    const { result } = renderHook(() => useTaskChangelog("task-1"));
+
+    expect(result.current.loading).toBe(true);
+    await waitFor(() => expect(result.current.loading).toBe(false));
+    expect(mockFetchTaskChangelog).toHaveBeenCalledWith("task-1", expect.any(AbortSignal));
+    expect(result.current.changelogs).toEqual([changelog]);
+  });
+
+  it("stores errors from the API", async () => {
+    mockFetchTaskChangelog.mockRejectedValueOnce(new Error("diff failed"));
+    const { result } = renderHook(() => useTaskChangelog("task-1"));
+
+    await waitFor(() => expect(result.current.loading).toBe(false));
+    expect(result.current.error).toBe("diff failed");
+  });
+});