inspector/clients/web/src/components/groups/ConnectionInfoContent/ConnectionInfoContent.stories.tsx

import type {
  ClientCapabilities,
  InitializeResult,
} from "@modelcontextprotocol/client";
import type { Meta, StoryObj } from "@storybook/react-vite";
import { ConnectionInfoContent } from "./ConnectionInfoContent";

const fullResult: InitializeResult = {
  protocolVersion: "2025-03-26",
  serverInfo: { name: "Everything Server", version: "2.1.0" },
  capabilities: {
    tools: { listChanged: true },
    resources: { subscribe: true, listChanged: true },
    prompts: { listChanged: true },
    logging: {},
    completions: {},
  },
  instructions:
    "This server provides access to the project management system. Use the list_projects tool first to discover available projects before querying tasks. Rate limiting applies: max 60 requests per minute.",
};

const fullClientCaps: ClientCapabilities = {
  roots: { listChanged: true },
  sampling: {},
  elicitation: {},
  experimental: {},
};

const meta: Meta<typeof ConnectionInfoContent> = {
  title: "Groups/ConnectionInfoContent",
  component: ConnectionInfoContent,
};

export default meta;
type Story = StoryObj<typeof ConnectionInfoContent>;

export const FullCapabilities: Story = {
  args: {
    initializeResult: fullResult,
    clientCapabilities: fullClientCaps,
    transport: "stdio",
  },
};

export const ModernEra: Story = {
  args: {
    initializeResult: {
      protocolVersion: "2026-07-28",
      serverInfo: { name: "Modern Server", version: "2.0.0" },
      capabilities: {
        tools: { listChanged: true },
        resources: { subscribe: true },
        // The Server Extensions row reads the negotiated server capabilities
        // (era-transparent), not discoverResult — carry it here too so the
        // modern story demonstrates the extension. (#1740)
        extensions: {
          "io.modelcontextprotocol/tasks": {},
        },
      },
    },
    clientCapabilities: fullClientCaps,
    transport: "streamable-http",
    protocolEra: "modern",
    discoverResult: {
      supportedVersions: ["2026-07-28", "2025-11-25"],
      serverInfo: { name: "Modern Server", version: "2.0.0" },
      capabilities: {
        tools: { listChanged: true },
        resources: { subscribe: true },
        extensions: {
          "io.modelcontextprotocol/tasks": {},
        },
      },
    },
  },
};

export const MinimalCapabilities: Story = {
  args: {
    initializeResult: {
      protocolVersion: "2025-03-26",
      serverInfo: { name: "Simple Server", version: "1.0.0" },
      capabilities: {
        tools: { listChanged: false },
      },
    },
    clientCapabilities: {
      roots: { listChanged: true },
    },
    transport: "streamable-http",
  },
};

export const WithInstructions: Story = {
  args: {
    initializeResult: fullResult,
    clientCapabilities: {
      roots: { listChanged: true },
      sampling: {},
    },
    transport: "stdio",
  },
};

export const WithOAuth: Story = {
  args: {
    initializeResult: {
      protocolVersion: "2025-03-26",
      serverInfo: { name: "Authenticated Server", version: "3.0.0" },
      capabilities: {
        tools: { listChanged: true },
        resources: { subscribe: true },
      },
    },
    clientCapabilities: {
      roots: { listChanged: true },
    },
    transport: "streamable-http",
    oauth: {
      protocol: "standard",
      authorized: true,
      authUrl: "https://auth.example.com/oauth2/authorize",
      scopes: ["read", "write", "admin"],
      accessToken: "eyJhbGciOiJSUzI1NiIs...truncated",
    },
  },
};