-
Notifications
You must be signed in to change notification settings - Fork 1k
V2 Spec Additions #945
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: v2/main
Are you sure you want to change the base?
V2 Spec Additions #945
Conversation
- Express: cleaner routing/middleware for proxy CRUD endpoints, well-maintained ecosystem - Pino: fastest logger option, JSON-structured logs work well for debugging MCP traffic 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]>
Based on MCPJam Inspector analysis: - Server connection card with status indicators - Resizable panel layouts for Tools/Resources/Prompts screens - Form generation from JSON Schema - Error handling patterns (inline errors, retry count, doc links) Also updates nav links in all spec files to include v2_ux.md. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]>
- Add server.json import support (Issue modelcontextprotocol#922) for MCP Registry format - Add History Screen with automatic capture and replay functionality - Add Pino logging rationale with log-as-history architecture - Remove emojis from markdown files, use text alternatives New UX sections added: - Logging Screen (notifications/message, logging/setLevel) - Tasks Screen (tasks/*, notifications/task/statusChanged) - Sampling Panel (sampling/createMessage) - Elicitation Handler (form + URL modes) - Roots Configuration (roots/list) - Experimental Features Panel (raw JSON-RPC tester) Enhanced existing screens: - Tools: annotations, autocomplete, progress indicators, image/audio - Resources: annotations, subscriptions - Prompts: autocomplete - Navigation: ping latency, listChanged indicators 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]>
Implements UI-only prototype for component library evaluation: - Server List home page with server cards - AppLayout with top navigation (Tools, Resources, Prompts, Logs, Tasks, History) - All 7 screen stubs with mock data - ServerCard and StatusIndicator components - Dark theme with Mantine v7 Based on v2_ux.md specification from PR modelcontextprotocol#945. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]>
Implements UI-only prototype for component library evaluation: - Server List home page with server cards - AppLayout with top navigation (Tools, Resources, Prompts, Logs, Tasks, History) - All 7 screen stubs with mock data - ServerCard and StatusIndicator components - Shadcn UI components (Button, Card, Badge, Switch, Input, Select) - Tailwind CSS dark theme Based on v2_ux.md specification from PR modelcontextprotocol#945. Mirror of Mantine prototype for comparison. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]>
cliffhall
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for all this great work, @olaservo. I added a few thoughts.
specification/v2_ux.md
Outdated
| │ [user] │ │ | ||
| │ │ { │ | ||
| │ ○ data.csv │ "name": "my-app", │ | ||
| │ │ "version": "1.0.0" │ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Perhaps we can split this left pane to have dynamically up to three scrollable regions. If there are only resources, they take up the whole pane. If there are also templates, the pane is split in two. When there are subscriptions, another pane could be added for them.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
might try a "selector" for resources / templates / subscriptions, and show that on the left? or accordion style maybe? Multiple panes with resizing feels fiddly
specification/v2_ux.md
Outdated
| - Display server's experimental capabilities from initialization | ||
| - Toggle client experimental capabilities to advertise | ||
| - Add custom client experimental capabilities | ||
| - **Raw JSON-RPC Tester:** |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
What if the experimental feature requires custom headers?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I support this Raw JSON-RPC tester not just for experimental features, but overall.
For example, the TS SDK servers supported adding extra parameters ourside of the spec, because of zod v3 and passthroughs all over the place (which shouldn't have been the case). Having the ability to test raw will be able to see how a server reacts to invalid parameters on any JSON-RPC calls etc.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I support this Raw JSON-RPC tester not just for experimental features, but overall.
@KKonstantinov Same. I just happened to be reviewing old issues this morning and noticed this one which points out that our history panel is not including everything, e.g., _meta/progressToken is not being included in the params for calls like resources/list even though you can see it if you examine the traffic in the browser inspector's network tab. This points to a problem where the SDK creates the fully formed message from the JSON we pass in (adding jsonrpc:2.0, etc), and we might need to add affordances to the SDK to get the message that actually was sent for display.
specification/v2_ux.md
Outdated
| ├─────────────────────────────────────────────────────────┤ | ||
| │ npx -y @modelcontextprotocol/server-everything [Copy]│ | ||
| ├─────────────────────────────────────────────────────────┤ | ||
| │ [Server Info] [Edit] [Remove] │ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Also, how to choose connection type is maybe a server specific thing. If the server has its CORS open then you can connect direct, otherwise you'll want to connect via proxy. Maybe this is a dropdown option on this card.
specification/v2_tech_stack.md
Outdated
| ### Transport Operation | ||
| Let's consider how to operate the server transports. | ||
| * -[ ] [Express](https://expressjs.com/) | ||
| * -[x] [Express](https://expressjs.com/) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
we could do Hono or something that uses web standards as well. we're planning add support for that for typescript-sdk v2
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good point, @pcarleton. Can you share links to any pros and cons discussions that have been had about moving to hono on the sdk?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hi Cliff,
Don't think we've got anything written up yet, but the general idea is (on the TS SDK) to go modern Web Standards handlers which will enable easy deployment on all kinds of environments (Deno, Bun, serverless, edge environments, etc)
This is where Hono comes in because it works with web standards ootb (while express and others can be shimmed to work with web standards so anyone using express cam still use it).
Not sure the above argument is relevant for inspector.
But what I believe would be relevant:
- 12kb as opposed to near 1mb
- includes a lot natively which would be another plug-in for express (think body parsing, auth middlewares and such) - saves more bundle size
- fully tree shakable
- typescript native, no @types package
- has http2 (which express doesn't since SPDY support was dropped). While most setups terminate http2 at the ingress / gateway / reverse proxy and then serve http1 locally, this is also about future proofing. (Example: if gRPC was ever added as a transport, http2 is a blocking requirement; there are likely more use cases here to future proof it)
Developer experience and friction is quite low due to its simplicity - no monkey patching of the request object (think ExpressRequest), full type safety on the request context added by your app.
I am likely missing more, but there should be enough on their website.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for the run-down, @KKonstantinov. Sounds like we should definitely give it a chance. Express is definitely creaky and so large comparatively.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
+1 for hono. @KKonstantinov said it perfectly.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks! I changed this to Hono.
| │ │ }] │ │ | ||
| │ │ } │ │ | ||
| │ └─────────────────────────────────────────────────────────────────────────┘ │ | ||
| │ [Browse...] [Clear]│ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
would Browse be for finding a file? or for browsing a registry? I think browsing a registry would be useful too
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Presumably for letting you browse for a file to validate so you can be certain it's formatted correctly before attempting to register. A registry browser would presumably be a nice thing as well, but by the time you get it registered, it's probably holding water. The main use case has been to test servers in development, but with the advent of the registry, perhaps there's a strong enough use case for a registry browser as well. Question is whether it's built-in code or a plugin?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes, this was for selecting a server.json file to validate.
Address reviewer feedback from cliffhall, pcarleton, KKonstantinov, mattzcarey: v2_ux.md changes: - Add Server Settings Modal for per-server config (headers, metadata, timeouts, OAuth) - Add Clone button to Server Card Actions - Add OAuth Debugger section for debugging auth flows - Change Resources Screen from resizable panes to accordion pattern - Update Logging Screen to all 8 RFC 5424 levels with distinct colors - Clarify Browse button as local file picker - Expand JSON-RPC Tester to support all methods with custom headers - Add multi-select support for anyOf/oneOf enums in Form Generation v2_tech_stack.md changes: - Select Hono over Express based on community consensus - Add Hono Rationale section with comparison table 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
- Add [Settings], [Clone] buttons to card - Add separate OAuth example showing [OAuth Debug] button - Widen card to fit all buttons 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
| │ │ │ │ │ | ||
| │ └─────────────────┘ │ ───────────────────────────────────────────────── │ | ||
| │ │ │ | ||
| │ Show Levels: │ │ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@cliffhall I added all log levels to:
- The ASCII art log stream
- The checkbox filters
- The color table
Address cliffhall's feedback about tool-specific metadata: - Add [Edit Metadata] button for per-tool _meta fields - Stored per-server, per-tool (not in global localStorage) - Merged with server-level metadata on each call 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
Brings in PR modelcontextprotocol#945 feedback revisions: - Server Settings Modal spec - OAuth Debugger spec - Resources accordion pattern - 8 RFC 5424 log levels - Hono selected over Express - Advanced JSON-RPC tester spec
Address reviewer feedback from cliffhall, pcarleton, KKonstantinov, mattzcarey: Spec changes (v2_ux.md): - Add Server Settings Modal for per-server config (headers, metadata, timeouts, OAuth) - Add Clone button to Server Card Actions - Add OAuth Debugger section for debugging auth flows - Change Resources Screen from resizable panes to accordion pattern - Update Logging Screen to all 8 RFC 5424 levels with distinct colors - Clarify Browse button as local file picker - Expand JSON-RPC Tester to support all methods with custom headers - Add multi-select support for anyOf/oneOf enums in Form Generation Tech stack changes (v2_tech_stack.md): - Select Hono over Express based on community consensus - Add Hono Rationale section with comparison table Prototype changes (shadcn branch): - Resources.tsx: Implement accordion pattern with collapsible sections - Logs.tsx: Add all 8 RFC 5424 levels with distinct color styles 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
Fixes: #947
Changes:
Methodology:
Other notes: