Phase 2: Refactor Server/Settings/ViewShell cluster to MCP SDK types

ServerCard: Replace flat scalar props (name, version, transport, status,
error) with grouped objects (config: MCPServerConfig, info?: Implementation,
connection: ConnectionState). Remove auto-connect useEffect — dumb
components must not self-dispatch side effects. Derive transport and
command/url from config.

ServerInfoContent: Replace flat props with initializeResult: InitializeResult
and clientCapabilities: ClientCapabilities from MCP SDK. Derive capability
lists by iterating the ServerCapabilities record.

ServerSettingsForm: Collapse flat setting props (connectionMode, headers,
metadata, timeouts, oauth*) into settings: InspectorServerSettings. Add
InspectorServerSettings type to core/mcp/types.ts.

ImportServerJsonPanel: Replace scattered scalar props (jsonContent,
selectedPackageIndex, serverName) with draft: InspectorServerJsonDraft.

ViewHeader: Replace serverName: string with serverInfo: Implementation.
Use ConnectionStatus from core types.

ConnectedView: Update to pass serverInfo: Implementation instead of
serverName. Use ConnectionStatus type.

Update all stories for ServerCard, ServerInfoContent, ServerSettingsForm,
ImportServerJsonPanel, ViewHeader, ServerListScreen, ConnectedView, and
UnconnectedView.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
cliffhall 2026-04-21 15:22:08 -04:00
commit 771a67ee20

View file

@ -150,7 +150,7 @@ const meta: Meta<typeof ConnectedView> = {
component: ConnectedView,
parameters: { layout: "fullscreen" },
args: {
serverName: "my-mcp-server",
serverInfo: { name: "my-mcp-server", version: "1.0.0" },
status: "connected",
latencyMs: 23,
availableTabs: allTabs,
@ -705,7 +705,10 @@ export const LimitedTabs: Story = {
export const LongServerName: Story = {
args: {
serverName: "my-very-long-server-name-that-might-overflow-is",
serverInfo: {
name: "my-very-long-server-name-that-might-overflow-is",
version: "1.0.0",
},
children: <Text>Tools screen content</Text>,
},
};