import type { Meta, StoryObj } from "@storybook/react-vite"; import type { LoggingLevel } from "@modelcontextprotocol/client"; import { fn } from "storybook/test"; import { LogStreamPanel } from "./LogStreamPanel"; import type { LogEntryData } from "../../elements/LogEntry/LogEntry"; import { expectScrollbarGutterIdleHidden } from "../../../test/scrollAreaStoryAssertions"; const meta: Meta = { title: "Groups/LogStreamPanel", component: LogStreamPanel, args: { filterText: "", visibleLevels: { debug: true, info: true, notice: true, warning: true, error: true, critical: true, alert: true, emergency: true, }, onClear: fn(), onExport: fn(), sortDirection: "newest-first", onSortChange: fn(), }, }; export default meta; type Story = StoryObj; export const Empty: Story = { args: { entries: [], }, }; const logMessages: { level: LoggingLevel; data: string; logger?: string; }[] = [ { level: "info", data: "Server started on port 3000" }, { level: "debug", data: "Loading configuration", logger: "config" }, { level: "warning", data: "Deprecated API endpoint called", logger: "http", }, { level: "error", data: "Failed to read resource", logger: "resources" }, { level: "info", data: "Tool execution completed (245ms)", logger: "tools", }, { level: "critical", data: "Database connection pool exhausted", logger: "db", }, { level: "alert", data: "Memory usage exceeds 95%", logger: "system" }, { level: "emergency", data: "System unresponsive", logger: "system" }, ]; const entries: LogEntryData[] = Array.from({ length: 30 }, (_, i) => { const src = logMessages[i % logMessages.length]; return { receivedAt: new Date(`2026-03-17T10:00:${String(i + 1).padStart(2, "0")}Z`), params: { level: src.level, data: src.data, logger: src.logger }, }; }); export const WithEntries: Story = { args: { entries, }, // List scrollbar reserves a gutter and stays hidden when idle (#1474). play: async ({ canvasElement }) => { expectScrollbarGutterIdleHidden(canvasElement); }, };