@ripla/godd-mcp 1.0.4-canary.2 → 1.0.4-canary.4

package/notes-app/src/components/IssueDetailView.test.tsx

@@ -0,0 +1,140 @@
+import { describe, it, expect, vi, beforeEach } from "vitest";
+import { render, screen, fireEvent, waitFor, act } from "@testing-library/react";
+
+vi.mock("@/lib/api", () => ({
+  createIssueApi: vi.fn(),
+  updateIssueApi: vi.fn(),
+  getIssueApi: vi.fn(),
+  getErrorMessage: vi.fn((e: unknown) => String(e)),
+  isAbortError: vi.fn(() => false),
+}));
+
+vi.mock("@/contexts/AuthContext", () => ({
+  useAuth: () => ({ canEdit: true }),
+}));
+
+const mockShowToast = vi.hoisted(() => vi.fn());
+vi.mock("@/contexts/ToastContext", () => ({
+  useToast: () => ({ showToast: mockShowToast }),
+}));
+
+vi.mock("@/components/FileContentView", () => ({
+  default: ({ content }: { content: string }) => (
+    <div data-testid="file-content-view">{content}</div>
+  ),
+}));
+
+import { createIssueApi, updateIssueApi, getIssueApi } from "@/lib/api";
+import IssueDetailView from "./IssueDetailView";
+
+const mockCreateIssue = vi.mocked(createIssueApi);
+const mockUpdateIssue = vi.mocked(updateIssueApi);
+const mockGetIssue = vi.mocked(getIssueApi);
+
+const MOCK_ISSUE = {
+  number: 123,
+  title: "テスト Issue",
+  body: "本文テスト",
+  state: "open" as const,
+  author: "testuser",
+  assignees: [],
+  comments: 0,
+  createdAt: "2026-05-19T00:00:00Z",
+  updatedAt: "2026-05-19T00:00:00Z",
+  url: "https://github.com/test/repo/issues/123",
+  labels: [],
+};
+
+describe("IssueDetailView — 新規 Issue 作成", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it("作成フォームが表示される（isNew=true）", () => {
+    render(
+      <IssueDetailView issueNumber="new" onCreated={vi.fn()} onClose={vi.fn()} />,
+    );
+    expect(screen.getByText("新規 Issue 作成")).toBeTruthy();
+    expect(screen.getByPlaceholderText("Issue のタイトル")).toBeTruthy();
+    expect(screen.getByText("作成")).toBeTruthy();
+  });
+
+  it("タイトル未入力時は作成ボタンが disabled", () => {
+    render(
+      <IssueDetailView issueNumber="new" onCreated={vi.fn()} onClose={vi.fn()} />,
+    );
+    const btn = screen.getByText("作成");
+    expect((btn as HTMLButtonElement).disabled).toBe(true);
+  });
+
+  it("作成成功後にプレビュー画面へ遷移し、onCreated が呼ばれる", async () => {
+    mockCreateIssue.mockResolvedValue(MOCK_ISSUE);
+
+    const onCreated = vi.fn();
+    render(
+      <IssueDetailView issueNumber="new" onCreated={onCreated} onClose={vi.fn()} />,
+    );
+
+    const titleInput = screen.getByPlaceholderText("Issue のタイトル");
+    fireEvent.change(titleInput, { target: { value: "テスト Issue" } });
+
+    await act(async () => {
+      fireEvent.click(screen.getByText("作成"));
+    });
+
+    // プレビュー画面に遷移（編集フォームが消える）
+    await waitFor(() => {
+      expect(screen.queryByText("新規 Issue 作成")).toBeNull();
+    });
+
+    // Issue タイトルがプレビュー表示される
+    expect(screen.getByText("テスト Issue")).toBeTruthy();
+
+    // onCreated コールバックが作成された Issue 番号で呼ばれる
+    expect(onCreated).toHaveBeenCalledWith(123);
+  });
+
+  it("キャンセルボタンで onClose が呼ばれる", () => {
+    const onClose = vi.fn();
+    render(
+      <IssueDetailView issueNumber="new" onCreated={vi.fn()} onClose={onClose} />,
+    );
+    fireEvent.click(screen.getByText("キャンセル"));
+    expect(onClose).toHaveBeenCalledOnce();
+  });
+});
+
+describe("IssueDetailView — 既存 Issue 更新", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    mockGetIssue.mockResolvedValue(MOCK_ISSUE);
+  });
+
+  it("更新成功後にプレビュー画面へ遷移する（既存の更新と同じ挙動）", async () => {
+    const updatedIssue = { ...MOCK_ISSUE, title: "更新後タイトル" };
+    mockUpdateIssue.mockResolvedValue(updatedIssue);
+
+    render(
+      <IssueDetailView issueNumber={123} onCreated={vi.fn()} onClose={vi.fn()} />,
+    );
+
+    await waitFor(() => {
+      expect(screen.getByText("テスト Issue")).toBeTruthy();
+    });
+
+    fireEvent.click(screen.getByText("編集"));
+
+    const titleInput = screen.getByDisplayValue("テスト Issue");
+    fireEvent.change(titleInput, { target: { value: "更新後タイトル" } });
+
+    await act(async () => {
+      fireEvent.click(screen.getByText("保存"));
+    });
+
+    await waitFor(() => {
+      expect(screen.queryByText("保存")).toBeNull();
+    });
+
+    expect(screen.getByText("更新後タイトル")).toBeTruthy();
+  });
+});

package/notes-app/src/components/IssueDetailView.tsx

@@ -77,6 +77,8 @@ export default function IssueDetailView({
       if (isNew) {
         const created = await createIssueApi({ title: title.trim(), body });
         showToast(`Issue #${created.number} を作成しました`, "success");
+        setIssue(created);
+        setEditing(false);
         onCreated?.(created.number);
       } else {
         const updated = await updateIssueApi(issueNumber as number, {

package/notes-app/src/components/IssueList.test.tsx

@@ -0,0 +1,93 @@
+import { describe, it, expect, vi, beforeEach } from "vitest";
+import { render, screen, waitFor } from "@testing-library/react";
+
+vi.mock("@/lib/api", () => ({
+  listIssuesApi: vi.fn(),
+  getErrorMessage: vi.fn((e: unknown) => String(e)),
+  isAbortError: vi.fn(() => false),
+}));
+
+import { listIssuesApi } from "@/lib/api";
+import IssueList from "./IssueList";
+
+const mockListIssues = vi.mocked(listIssuesApi);
+
+const MOCK_ISSUES = [
+  {
+    number: 10,
+    title: "Issue 10",
+    state: "open" as const,
+    author: "user1",
+    assignees: [],
+    comments: 0,
+    labels: [],
+    createdAt: "2026-05-19T00:00:00Z",
+    updatedAt: "2026-05-19T00:00:00Z",
+  },
+  {
+    number: 9,
+    title: "Issue 9",
+    state: "open" as const,
+    author: "user1",
+    assignees: [],
+    comments: 0,
+    labels: [],
+    createdAt: "2026-05-18T00:00:00Z",
+    updatedAt: "2026-05-18T00:00:00Z",
+  },
+];
+
+describe("IssueList", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it("Issueリストを取得して表示する", async () => {
+    mockListIssues.mockResolvedValue({ issues: MOCK_ISSUES });
+
+    render(<IssueList onSelect={vi.fn()} selectedIssue={null} />);
+
+    await waitFor(() => {
+      expect(screen.getByText("Issue 10")).toBeTruthy();
+      expect(screen.getByText("Issue 9")).toBeTruthy();
+    });
+  });
+
+  it("reloadTrigger が変わると listIssuesApi を再呼び出しする", async () => {
+    mockListIssues.mockResolvedValue({ issues: MOCK_ISSUES });
+
+    const { rerender } = render(
+      <IssueList onSelect={vi.fn()} selectedIssue={null} reloadTrigger={0} />,
+    );
+
+    await waitFor(() => {
+      expect(mockListIssues).toHaveBeenCalledTimes(1);
+    });
+
+    rerender(
+      <IssueList onSelect={vi.fn()} selectedIssue={null} reloadTrigger={1} />,
+    );
+
+    await waitFor(() => {
+      expect(mockListIssues).toHaveBeenCalledTimes(2);
+    });
+  });
+
+  it("reloadTrigger が同じ値のままなら再呼び出しされない", async () => {
+    mockListIssues.mockResolvedValue({ issues: MOCK_ISSUES });
+
+    const { rerender } = render(
+      <IssueList onSelect={vi.fn()} selectedIssue={null} reloadTrigger={0} />,
+    );
+
+    await waitFor(() => {
+      expect(mockListIssues).toHaveBeenCalledTimes(1);
+    });
+
+    rerender(
+      <IssueList onSelect={vi.fn()} selectedIssue={null} reloadTrigger={0} />,
+    );
+
+    expect(mockListIssues).toHaveBeenCalledTimes(1);
+  });
+});

package/notes-app/src/components/IssueList.tsx

@@ -11,9 +11,10 @@ import { InlineError } from "@/components/Skeleton";
 type IssueListProps = {
   onSelect: (number: number) => void;
   selectedIssue: number | null;
+  reloadTrigger?: number;
 };
 
-export default function IssueList({ onSelect, selectedIssue }: IssueListProps) {
+export default function IssueList({ onSelect, selectedIssue, reloadTrigger }: IssueListProps) {
   const [issues, setIssues] = useState<IssueSummary[]>([]);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
@@ -43,7 +44,7 @@ export default function IssueList({ onSelect, selectedIssue }: IssueListProps) {
     listIssuesApi({ state: stateFilter, per_page: 50, signal: ac.signal })
       .then((data) => {
         if (ac.signal.aborted || requestSeq.current !== requestId) return;
-        setIssues(data.issues);
+        setIssues([...data.issues].sort((a, b) => b.number - a.number));
       })
       .catch((e) => {
         if (ac.signal.aborted || requestSeq.current !== requestId || isAbortError(e)) return;
@@ -55,7 +56,7 @@ export default function IssueList({ onSelect, selectedIssue }: IssueListProps) {
         }
       });
     return () => ac.abort();
-  }, [stateFilter, reloadKey]);
+  }, [stateFilter, reloadKey, reloadTrigger]);
 
   return (
     <div className="flex flex-col h-full">

package/notes-app/src/pages/MainPage.tsx

@@ -614,6 +614,7 @@ export default function MainPage() {
   const [sidebarOpen, setSidebarOpen] = useState(false);
   const [sidebarTab, setSidebarTab] = useState<SidebarTab>("files");
   const [selectedIssue, setSelectedIssue] = useState<number | "new" | null>(null);
+  const [issueListReloadTrigger, setIssueListReloadTrigger] = useState(0);
 
   const handleFileSelectResponsive = useCallback(
     (path: string) => {
@@ -853,6 +854,7 @@ export default function MainPage() {
             )}
             <IssueList
               selectedIssue={typeof selectedIssue === "number" ? selectedIssue : null}
+              reloadTrigger={issueListReloadTrigger}
               onSelect={(num) => {
                 setSelectedIssue(num);
                 setSelectedFile(null);
@@ -945,9 +947,11 @@ export default function MainPage() {
             {selectedIssue != null && !selectedFile && (
               <Suspense fallback={<ContentSkeleton />}>
                 <IssueDetailView
+                  key={String(selectedIssue)}
                   issueNumber={selectedIssue}
                   onCreated={(num) => {
                     setSelectedIssue(num);
+                    setIssueListReloadTrigger((k) => k + 1);
                   }}
                   onClose={() => setSelectedIssue(null)}
                 />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ripla/godd-mcp",
-  "version": "1.0.4-canary.2",
+  "version": "1.0.4-canary.4",
   "type": "module",
   "description": "GoDD MCP Server - AI-powered development workflow tools via Model Context Protocol (slash commands support)",
   "main": "dist/index.js",