diff --git a/clients/web/src/App.css b/clients/web/src/App.css index 5a0a75f2..47b315bd 100644 --- a/clients/web/src/App.css +++ b/clients/web/src/App.css @@ -49,15 +49,6 @@ --inspector-log-alert: var(--mantine-color-red-9); --inspector-log-emergency: var(--mantine-color-red-9); - /* ── Annotations ───────────────────────────────────────── */ - --inspector-annotation-destructive: var(--mantine-color-red-6); - --inspector-annotation-long-run: var(--mantine-color-yellow-6); - --inspector-annotation-read-only: var(--mantine-color-dark-6); - --inspector-annotation-audience: var(--mantine-color-gray-6); - --inspector-annotation-priority-high: var(--mantine-color-orange-6); - --inspector-annotation-priority-medium: var(--mantine-color-yellow-6); - --inspector-annotation-priority-low: var(--mantine-color-green-6); - /* ── Task status ───────────────────────────────────────── */ --inspector-task-waiting: var(--mantine-color-gray-5); --inspector-task-running: var(--mantine-color-blue-6); diff --git a/clients/web/src/components/elements/AnnotationBadge/AnnotationBadge.tsx b/clients/web/src/components/elements/AnnotationBadge/AnnotationBadge.tsx index babee2f4..9f1f08f9 100644 --- a/clients/web/src/components/elements/AnnotationBadge/AnnotationBadge.tsx +++ b/clients/web/src/components/elements/AnnotationBadge/AnnotationBadge.tsx @@ -32,8 +32,12 @@ function formatLabel( switch (facet) { case "audience": return `audience: ${(value as Role[]).join(", ")}`; - case "priority": - return `priority: ${value}`; + case "priority": { + const n = value as number; + if (n >= 0.7) return "priority: high"; + if (n >= 0.4) return "priority: medium"; + return "priority: low"; + } case "readOnlyHint": return "read-only"; case "destructiveHint": diff --git a/clients/web/src/components/elements/ContentViewer/ContentViewer.tsx b/clients/web/src/components/elements/ContentViewer/ContentViewer.tsx index 74d32716..a5710e32 100644 --- a/clients/web/src/components/elements/ContentViewer/ContentViewer.tsx +++ b/clients/web/src/components/elements/ContentViewer/ContentViewer.tsx @@ -17,16 +17,6 @@ function formatJson(content: string): string { function isJsonText(block: ContentBlock): boolean { if (block.type !== "text") return false; - if ( - "annotations" in block && - block.annotations && - "mimeType" in block.annotations - ) { - return ( - (block.annotations as Record).mimeType === - "application/json" - ); - } const trimmed = block.text.trimStart(); return trimmed.startsWith("{") || trimmed.startsWith("["); } diff --git a/clients/web/src/components/elements/MessageBubble/MessageBubble.tsx b/clients/web/src/components/elements/MessageBubble/MessageBubble.tsx index d1ba15ec..68465ed6 100644 --- a/clients/web/src/components/elements/MessageBubble/MessageBubble.tsx +++ b/clients/web/src/components/elements/MessageBubble/MessageBubble.tsx @@ -51,6 +51,18 @@ function extractContent( audioUri = buildDataUri(block.mimeType, block.data); audioMime = block.mimeType; break; + case "resource": + text += + "text" in block.resource + ? block.resource.text + : `[resource: ${block.resource.uri}]`; + break; + case "resource_link": + text += `[resource: ${block.uri}]`; + break; + default: + text += `[${block.type}]`; + break; } } diff --git a/clients/web/src/components/elements/ProgressDisplay/ProgressDisplay.stories.tsx b/clients/web/src/components/elements/ProgressDisplay/ProgressDisplay.stories.tsx index 23bab30c..914b866b 100644 --- a/clients/web/src/components/elements/ProgressDisplay/ProgressDisplay.stories.tsx +++ b/clients/web/src/components/elements/ProgressDisplay/ProgressDisplay.stories.tsx @@ -11,14 +11,13 @@ type Story = StoryObj; export const ZeroPercent: Story = { args: { - params: { progressToken: "t1", progress: 0, total: 100 }, + params: { progress: 0, total: 100 }, }, }; export const HalfComplete: Story = { args: { params: { - progressToken: "t2", progress: 50, total: 100, message: "Processing...", @@ -29,7 +28,6 @@ export const HalfComplete: Story = { export const NearComplete: Story = { args: { params: { - progressToken: "t3", progress: 95, total: 100, message: "Almost done", @@ -41,7 +39,6 @@ export const NearComplete: Story = { export const Complete: Story = { args: { params: { - progressToken: "t4", progress: 100, total: 100, message: "Done", @@ -53,7 +50,6 @@ export const Complete: Story = { export const WithoutTotal: Story = { args: { params: { - progressToken: "t5", progress: 42, message: "Working...", }, diff --git a/clients/web/src/components/elements/ProgressDisplay/ProgressDisplay.tsx b/clients/web/src/components/elements/ProgressDisplay/ProgressDisplay.tsx index 7968aa3b..1e03791d 100644 --- a/clients/web/src/components/elements/ProgressDisplay/ProgressDisplay.tsx +++ b/clients/web/src/components/elements/ProgressDisplay/ProgressDisplay.tsx @@ -2,7 +2,10 @@ import { Group, Progress, Stack, Text } from "@mantine/core"; import type { ProgressNotification } from "@modelcontextprotocol/sdk/types.js"; export interface ProgressDisplayProps { - params: ProgressNotification["params"]; + params: Pick< + ProgressNotification["params"], + "progress" | "total" | "message" + >; elapsed?: string; } diff --git a/clients/web/src/components/groups/ResourcePreviewPanel/ResourcePreviewPanel.tsx b/clients/web/src/components/groups/ResourcePreviewPanel/ResourcePreviewPanel.tsx index 9e1cf873..7ee3c638 100644 --- a/clients/web/src/components/groups/ResourcePreviewPanel/ResourcePreviewPanel.tsx +++ b/clients/web/src/components/groups/ResourcePreviewPanel/ResourcePreviewPanel.tsx @@ -1,4 +1,5 @@ import { Button, Flex, Group, Stack, Text, Title } from "@mantine/core"; +import type { ContentBlock } from "@modelcontextprotocol/sdk/types.js"; import { AnnotationBadge } from "../../elements/AnnotationBadge/AnnotationBadge"; import { ContentViewer } from "../../elements/ContentViewer/ContentViewer"; import { CopyButton } from "../../elements/CopyButton/CopyButton"; @@ -16,8 +17,6 @@ export interface ResourcePreviewPanelProps { onUnsubscribe: () => void; } -import type { ContentBlock } from "@modelcontextprotocol/sdk/types.js"; - function toContentBlock(content: string, mimeType: string): ContentBlock { if (mimeType.startsWith("image/")) { return { type: "image", data: content, mimeType }; diff --git a/clients/web/src/components/groups/ServerCard/ServerCard.tsx b/clients/web/src/components/groups/ServerCard/ServerCard.tsx index dc4f8c42..20db7895 100644 --- a/clients/web/src/components/groups/ServerCard/ServerCard.tsx +++ b/clients/web/src/components/groups/ServerCard/ServerCard.tsx @@ -1,5 +1,9 @@ import { useEffect } from "react"; import { Badge, Button, Card, Group, Menu, Stack, Text } from "@mantine/core"; +import type { + ConnectionStatus, + ServerType, +} from "@inspector/core/mcp/types.js"; import { ServerStatusIndicator } from "../../elements/ServerStatusIndicator/ServerStatusIndicator"; import { TransportBadge } from "../../elements/TransportBadge/TransportBadge"; import { ConnectionToggle } from "../../elements/ConnectionToggle/ConnectionToggle"; @@ -9,10 +13,10 @@ import { InlineError } from "../../elements/InlineError/InlineError"; export interface ServerCardProps { name: string; version?: string; - transport: "stdio" | "sse" | "streamable-http"; + transport: ServerType; connectionMode: string; command: string; - status: "connected" | "connecting" | "disconnected" | "error"; + status: ConnectionStatus; retryCount?: number; error?: { message: string; details?: string }; canTestClientFeatures: boolean; diff --git a/clients/web/src/components/groups/TaskCard/TaskCard.tsx b/clients/web/src/components/groups/TaskCard/TaskCard.tsx index 736818a6..1ff14d07 100644 --- a/clients/web/src/components/groups/TaskCard/TaskCard.tsx +++ b/clients/web/src/components/groups/TaskCard/TaskCard.tsx @@ -197,7 +197,6 @@ export function TaskCard(props: TaskCardProps) { {progress !== undefined && isActive && (