[LG-5666] MCP-UI App Scaffolding #3280
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Contributor
|
Size Change: +1.18 kB (+0.07%) Total Size: 1.79 MB
ℹ️ View Unchanged
|
Contributor
There was a problem hiding this comment.
Pull Request Overview
This PR scaffolds the foundational infrastructure for an MCP UI system within the LeafyGreen UI monorepo. It introduces a new Next.js application for iframe-embeddable micro-UIs, along with supporting workspace configurations and build scripts.
Key Changes:
- New Next.js app (
@lg-apps/mcp-ui-app) with CORS/CSP configuration for iframe embedding - New
@lg-mcp-uinamespace containing a micro-UI component (list-databases) and an SDK package - Workspace and build system updates to support new scopes while excluding the Next.js app from default builds
Reviewed Changes
Copilot reviewed 19 out of 20 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| turbo.json | Adds dev task configuration for running Next.js development server |
| pnpm-workspace.yaml | Registers new workspace paths for apps and mcp-ui packages |
| pnpm-lock.yaml | Adds dependencies for Next.js 14.2.33 and associated packages |
| package.json | Updates build scripts to exclude Next.js app and adds new scope mappings |
| mcp-ui/sdk/src/mapper.ts | Defines tool name mappings for MCP UI components |
| mcp-ui/sdk/src/index.ts | Exports stub function for SDK (to be implemented) |
| mcp-ui/sdk/index.ts | Re-exports SDK functionality |
| mcp-ui/micro-uis/list-databases/* | Implements React component for displaying database lists |
| apps/mcp-ui-app/* | Next.js application with routing, configuration, and deployment setup |
Files not reviewed (1)
- pnpm-lock.yaml: Language not supported
| "@lg-chat": "chat", | ||
| "@lg-tools": "tools" | ||
| "@lg-tools": "tools", | ||
| "@lg-mcp-ui": "mcp-ui" |
There was a problem hiding this comment.
The new scope '@lg-mcp-ui' is defined but there's no corresponding '@lg-apps' scope definition for the apps directory. For consistency with the new 'apps/*' workspace and the '@lg-apps/mcp-ui-app' package name, consider adding an entry like '@lg-apps': 'apps' to the scopes configuration.
Suggested change
| "@lg-mcp-ui": "mcp-ui" | |
| "@lg-mcp-ui": "mcp-ui", | |
| "@lg-apps": "apps" |
Collaborator
Author
There was a problem hiding this comment.
Not necessary as we're not publishing anything in the apps folder as of right now
Comment on lines
+8
to
+9
| <h1>MCP UI App</h1> | ||
| <p>Welcome to the MCP UI Application!</p> |
| Configuration | ||
| </h2> | ||
| <p> | ||
| <strong>Base URL:</strong> {config.baseUrl} |
Collaborator
There was a problem hiding this comment.
I assume we'll probably want to list all the available pages here at some point
Comment on lines
+1
to
+8
| 'use client'; | ||
|
|
||
| import React from 'react'; | ||
| import { ListDatabases } from '@lg-mcp-ui/list-databases'; | ||
|
|
||
| export default function ListDatabasesPage() { | ||
| return <ListDatabases databases={[]} />; | ||
| } |
Collaborator
There was a problem hiding this comment.
Future consideration — this could probably be a [microui].tsx slug file, with getStaticPaths checking for all the installed micro-ui packages
TheSonOfThomp
approved these changes
Nov 7, 2025
| @@ -0,0 +1,24 @@ | |||
| { | |||
| "name": "@lg-apps/mcp-ui-app", | |||
Collaborator
There was a problem hiding this comment.
nit: This probably doesn't need to be scoped since we're not publishing it to npm
| "private": true, | ||
| "scripts": { | ||
| "dev": "next dev", | ||
| "build": "next build", |
Collaborator
There was a problem hiding this comment.
Turbo is complaining that there's nothing to cache when I run this. Probable need to add a custom turbo config for the app that sets the outputs https://turborepo.com/docs/reference/configuration#outputs
...Finishing writing to cache...
WARNING no output files found for task @lg-apps/mcp-ui-app#build. Please check your `outputs` key in `turbo.json`
* update r17 scripts * filter apps from r17 build workflow * add mcpui to caches
Contributor
|
Coverage after merging ar/LG-5666-mcpui-app into main will be
Coverage Report
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
stephl3
reviewed
Nov 17, 2025
Comment on lines
+48
to
+49
| '/apps/', | ||
| '/mcp-ui/', |
Collaborator
There was a problem hiding this comment.
any additional context on why we are choosing to ignore these test paths?
| '@lg-tools/test-harnesses', | ||
| '@lg-tools/update', | ||
| '@lg-tools/validate', | ||
| '@lg-mcp-ui/list-databases', |
Collaborator
There was a problem hiding this comment.
should @lg-apps/mcp-ui-app be included here?
Comment on lines
+69
to
+71
| // Read the root package.json to get package directories dynamically | ||
| const rootPackage = JSON.parse( | ||
| fs.readFileSync(ROOT_PACKAGE_JSON_PATH, 'utf-8'), |
Collaborator
There was a problem hiding this comment.
can we check that this doesn't inadvertently bring in packages from the deprecated-packages` directory?
| @@ -0,0 +1,37 @@ | |||
| # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. | |||
Collaborator
There was a problem hiding this comment.
I would think that a benefit of keeping these different components in a monorepo is being able to centralize .gitignore patterns in the root .gitignore file. Is there an explicit reason we need a separate one defined here?
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
✍️ Proposed changes
This PR introduces the foundational infrastructure for the MCP UI system, including:
apps/mcp-ui-app) configured for iframe embedding with CORS and CSP headerslist-databases) for displaying database listsmcp-ui/sdk) with tool mappings and anaugmentWithUIfunction stub@lg-mcp-uiand@lg-appsnamespacesThe Next.js app is configured with environment-based CORS settings and is excluded from the default build to avoid impacting existing build processes.
🎟️ Jira ticket: LG-5666
Next Steps:
✅ Checklist
🧪 How to test changes
cd apps/mcp-ui-app.env.localfile with the required environment variables (see the app's README)pnpm dev:mcp-uifrom the workspace roothttp://localhost:3000to verify the app loadshttp://localhost:3000/list-databasesto verify the list-databases component renders