feat(frontend): SessionMenu kebab + NavSessions prop-driven; AppShell owns sessions query

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-06-29 12:50:24 +02:00
co-authored by Claude Sonnet 4.6
parent 8243ce6446
commit d5f82b70a4
4 changed files with 116 additions and 118 deletions
+17 -71
View File
@@ -1,81 +1,27 @@
// frontend/src/shell/NavSessions.test.tsx
import { render, screen, waitFor } from "@testing-library/react";
import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { http, HttpResponse } from "msw";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { server } from "../test/msw";
import { NavSessions } from "./NavSessions";
import type { SessionSummary } from "../api/types";
function makeClient() {
return new QueryClient({ defaultOptions: { queries: { retry: false } } });
}
function renderWithClient(ui: React.ReactElement) {
const client = makeClient();
return render(<QueryClientProvider client={client}>{ui}</QueryClientProvider>);
}
const SESSION_LIST = [
{
id: "s1",
status: "open",
question: "Come va?",
summary: null,
created_at: "2026-01-01T00:00:00Z",
updated_at: null,
author: null,
},
{
id: "s2",
status: "closed",
question: "Seconda domanda",
summary: "riassunto",
created_at: "2026-01-02T00:00:00Z",
updated_at: null,
author: null,
},
const SESSIONS: SessionSummary[] = [
{ id: "s1", status: "open", question: "Come va?", summary: null, created_at: "2026-01-01T00:00:00Z", updated_at: null, author: null, name: null, group: null, archived: false },
{ id: "s2", status: "closed", question: "Seconda domanda", summary: "r", created_at: "2026-01-02T00:00:00Z", updated_at: null, author: null, name: "Etichetta", group: null, archived: false },
];
beforeEach(() => {
server.use(
http.get("http://localhost:8787/sessions", () =>
HttpResponse.json(SESSION_LIST),
),
http.post("http://localhost:8787/sessions/:id/resume", () =>
new HttpResponse(null, { status: 204 }),
),
);
test("lists sessions and shows name when present", () => {
render(<NavSessions sessions={SESSIONS} activeSessionId={null} onOpenPanel={vi.fn()} menuFor={() => null} />);
expect(screen.getByText("Come va?")).toBeInTheDocument();
expect(screen.getByText("Etichetta")).toBeInTheDocument(); // name overrides question
});
test("lists sessions loaded from listSessions", async () => {
const onSelect = vi.fn();
renderWithClient(<NavSessions onSessionSelect={onSelect} activeSessionId={null} />);
await screen.findByText(/Come va\?/);
expect(screen.getByText(/Seconda domanda/)).toBeInTheDocument();
test("clicking a row opens the panel (does not resume)", async () => {
const onOpenPanel = vi.fn();
render(<NavSessions sessions={SESSIONS} activeSessionId={null} onOpenPanel={onOpenPanel} menuFor={() => null} />);
await userEvent.click(screen.getByText("Come va?"));
expect(onOpenPanel).toHaveBeenCalledWith("s1");
});
test("clicking a session calls resumeSession and onSessionSelect", async () => {
const onSelect = vi.fn();
let resumeCalledWith: string | null = null;
server.use(
http.post("http://localhost:8787/sessions/:id/resume", ({ params }) => {
resumeCalledWith = params.id as string;
return new HttpResponse(null, { status: 204 });
}),
);
renderWithClient(<NavSessions onSessionSelect={onSelect} activeSessionId={null} />);
await screen.findByText(/Come va\?/);
await userEvent.click(screen.getByText(/Come va\?/));
await waitFor(() => {
expect(resumeCalledWith).toBe("s1");
expect(onSelect).toHaveBeenCalledWith("s1");
});
});
test("active session is visually highlighted", async () => {
const onSelect = vi.fn();
renderWithClient(<NavSessions onSessionSelect={onSelect} activeSessionId="s2" />);
await screen.findByText(/Seconda domanda/);
const activeItem = screen.getByTestId("session-item-s2");
expect(activeItem).toHaveAttribute("data-active", "true");
test("active session is highlighted", () => {
render(<NavSessions sessions={SESSIONS} activeSessionId="s2" onOpenPanel={vi.fn()} menuFor={() => null} />);
expect(screen.getByTestId("session-item-s2")).toHaveAttribute("data-active", "true");
});