Add initial PoC for MCP Apps for select tools under Insiders #1957
Conversation
…ce CreateIssueApp to manage existing issue data
mattdholloway
added
the
insiders
…server into mcp-ui-apps-3
mattdholloway
force-pushed
the
mcp-ui-apps-3
branch
2 times, most recently
from
3096894 to
fcefcaa
Compare
mattdholloway
changed the title
Remove advanced features to be kept in mcp-ui-apps-advanced: - Strip labels, assignees, milestones, issue types, repo picker from issue-write - Strip repo picker, branch selectors from pr-write - Delete ui_get tool (ui_tools.go, ui_tools_test.go, ui_get.snap) - Remove UIGet registration from tools.go Basic forms retain: title, body, submit with _ui_submitted, draft/regular split button (PR), MarkdownEditor, and SuccessView.
Add proper spacing between icon, title text, and repo name in the header bar for both issue-write and create-pull-request forms.
When InsidersMode is enabled, append '(insiders)' to the User-Agent string sent with GitHub API requests, enabling server-side adoption tracking.
There was a problem hiding this comment.
Just tested this again, nice improvements! Some things I have noticed
-
What is the behaviour of these tools on hosts where MCP Apps is not supported? For example, in
issue_writeandcreate_pull_request, when Insiders is on and_ui_submittedis false, the tool early-returns a placeholder message like "Ready to create an issue". So it seems like on a host without MCP Apps support, users would get the placeholder text instead of the tool actually executing. I think we should have a way for people opting into insiders but using hosts that won't support Apps (which include 1P ones like Copilot CLI) to still be able to use the tool without the UI -
On hover, the "Write" and "Preview" options in the markdown look inconsistent with the rich text options, in that they don't have rounded corners. A quick fix is to round the corners to make them consistent
-
In the markdown editor, the toolbar isn't responsive: I cannot scroll horizontally to reveal some of the options (like bullet point list, numbered list)
- The UI to create a PR doesn't seem to work anymore: when I click "create pull request" it effectively creates the pull request, but it shows the error message instead of the success UI, even though it does create the PR
- In the issue creation success screen, we need to add spacing between the issue icon and the title of the issue (same for the PR success UI)
-
(nit) I have noticed that I cannot just pull up the create issue UI without populating it with title and body to create an issue. It only works by having the model write a test title and body, calling the
issue_writetool and then showing the form pre-populated with that mock text for me to edit. Is that intentional? I wonder if we should let folks see an empty UI that they can fill out -
(nit) maybe unrelated, but getting 422 error when trying to create a draft PR as it assumes my default branch is
mainbut instead it'smaster. Don't think this was introduced with these changes but wanted to flag, maybe we can show a more helpful error message here
Screenshot
4 participants
Summary
Based on initial work by @tommaso-moro
This PR adds support for MCP Apps, enabling rich interactive UIs for MCP tools.
New MCP App UIs
get_me- User profile display with avatar and statsissue_write- Create/update issues with title, body, and Markdown editorcreate_pull_request- Create PRs with title, body, and draft/regular toggleImplementation
ui/): React + Primer design system, built to single HTML files viascript/build-uiInsiders Mode
All MCP Apps functionality gated behind Insiders
insidersOnlyMetaKeysmechanism for future experimental featuresThese new UIs require a new React app that exists under the
uifolder with components made available in iframes for clients that support the feature. This has been extensively tested under VSCode-Insiders.This will require additional support in Remote MCP to ensure Insiders and resources support works correctly.
Why
As part of https://github.com/github/copilot-mcp-core/issues/1125
What changed
ui/directory with React + Primer design system apps forget_me,issue_write, andcreate_pull_requestscript/build-uito compile React apps into single HTML filespkg/github/ui_embed.goto embed built HTML assets into binarypkg/github/ui_resources.goto register UI resources with the MCP serverMeta.ui.resourceUri) toget_me,issue_write, andcreate_pull_requesttoolsget_meresource_ui_submittedmechanism to distinguish UI form submissions from LLM tool callsWithInsidersMode()to inventory builder to gate experimental featuresinsidersOnlyMetaKeysmechanism to strip insiders-only metadata when disabledMCP impact
Prompts tested (tool changes only)
Security / limits
Tool renaming
deprecated_tool_aliases.goNote: if you're renaming tools, you must add the tool aliases. For more information on how to do so, please refer to the official docs.
Lint & tests
./script/lint./script/testDocs