Skip to content

Fixes #27678 : (feat) add MCP Client in UI#27717

Closed
hassaansaleem28 wants to merge 4 commits intoopen-metadata:mainfrom
hassaansaleem28:feat/mcp-chat-ui
Closed

Fixes #27678 : (feat) add MCP Client in UI#27717
hassaansaleem28 wants to merge 4 commits intoopen-metadata:mainfrom
hassaansaleem28:feat/mcp-chat-ui

Conversation

@hassaansaleem28
Copy link
Copy Markdown
Contributor

@hassaansaleem28 hassaansaleem28 commented Apr 24, 2026

Describe your changes:

Fixes #27678

This PR implements a proper MCP Client chat UI inside OpenMetadata, replacing the rough WIP from #26343 with a production-quality interface that follows OpenMetadata's UI conventions.

SCREEN REC:
Screencast from 2026-04-25 15-41-58.webm

Includes:

  • Chat interface —> a two-panel layout with a conversation sidebar (list, new/delete) and a main message area with SSE-streamed responses from the MCP server
  • Plugin integration —> McpApplicationPlugin hooks into the existing AppPlugin registry, adding a sidebar icon and authenticated routes (/mcp-chat, /mcp-chat/:conversationId) with no changes to core routing infrastructure
  • Typed streaming API layer (mcpClientAPI.ts) —> uses native fetch + an async generator over ReadableStream to handle authenticated POST-based SSE, since EventSource cannot send a request body or Authorization headers
  • Tool call visibility —> each assistant message surfaces its tool calls (name + JSON input + result) in a collapsible block so users can see exactly what the AI did under the hood
  • Optimistic UX —> user messages appear instantly; a typing indicator (TypingIndicator) shows while the stream is in flight; the assistant bubble builds up in real time as tokens arrive
  • Abort safety —> an AbortController ref cancels the in-flight stream on unmount or when a new message is sent before the previous one finishes

Type of change:

  • New feature

Checklist:

  • I have read the CONTRIBUTING document.
  • My PR title is Fixes #27678 : (feat) add MCP Client in UI
  • I have commented on my code, particularly in hard-to-understand areas.
  • For JSON Schema changes: I updated the migration scripts or explained why it is not needed.
  • The issue properly describes why the new feature is needed, what's the goal, and how we are building it. Any discussion
    or decision-making process is reflected in the issue.
  • I have updated the documentation.
  • I have added tests around the new logic.

Summary by Gitar

  • Test coverage:
    • Added unit tests for mcpClientAPI covering SSE parsing, error handling, and AbortSignal support
    • Added component tests for MessageBubble and ToolCallBlock to verify rendering logic
  • Localization:
    • Updated 19 language files with new labels and messages for the MCP chat interface

This will update automatically on new commits.

Signed-off-by: hassaansaleem28 <iamhassaans@gmail.com>
@github-actions
Copy link
Copy Markdown
Contributor

Hi there 👋 Thanks for your contribution!

The OpenMetadata team will review the PR shortly! Once it has been labeled as safe to test, the CI workflows
will start executing and we'll be able to make sure everything is working as expected.

Let us know if you need any help!

1 similar comment
@github-actions
Copy link
Copy Markdown
Contributor

Hi there 👋 Thanks for your contribution!

The OpenMetadata team will review the PR shortly! Once it has been labeled as safe to test, the CI workflows
will start executing and we'll be able to make sure everything is working as expected.

Let us know if you need any help!

Comment thread openmetadata-ui/src/main/resources/ui/src/rest/mcpClientAPI.ts Outdated
Comment thread openmetadata-ui/src/main/resources/ui/src/rest/mcpClientAPI.ts Outdated
Signed-off-by: hassaansaleem28 <iamhassaans@gmail.com>
@github-actions
Copy link
Copy Markdown
Contributor

Hi there 👋 Thanks for your contribution!

The OpenMetadata team will review the PR shortly! Once it has been labeled as safe to test, the CI workflows
will start executing and we'll be able to make sure everything is working as expected.

Let us know if you need any help!

@hassaansaleem28 hassaansaleem28 marked this pull request as ready for review April 25, 2026 10:43
@hassaansaleem28 hassaansaleem28 requested a review from a team as a code owner April 25, 2026 10:43
Copilot AI review requested due to automatic review settings April 25, 2026 10:43
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot encountered an error and was unable to review this pull request. You can try again by re-requesting a review.

@hassaansaleem28 hassaansaleem28 requested a review from Copilot April 25, 2026 11:10
@github-actions
Copy link
Copy Markdown
Contributor

Hi there 👋 Thanks for your contribution!

The OpenMetadata team will review the PR shortly! Once it has been labeled as safe to test, the CI workflows
will start executing and we'll be able to make sure everything is working as expected.

Let us know if you need any help!

@gitar-bot
Copy link
Copy Markdown

gitar-bot Bot commented Apr 25, 2026

Code Review 👍 Approved with suggestions 4 resolved / 6 findings

Implements the MCP Client in OpenMetadata UI with robust SSE parsing and AbortController stream cancellation. Please update the new i18n keys and placeholders across all non-English locale files to ensure proper localization.

💡 Quality: i18n keys added as untranslated English in all non-English locale files

📄 openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:100 📄 openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:1361 📄 openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:2197-2198 📄 openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:2234 📄 openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:2719-2721 📄 openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:2872-2874 📄 openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:2979

All 12 new i18n keys (e.g., ai-assistant, new-conversation, tool-call, mcp-chat-welcome, etc.) are added with English text in every locale file (ar-sa, de-de, ja-jp, zh-cn, etc.). This means non-English users will see English strings. Per the CI rule about synced i18n keys, the keys should be present but ideally flagged for translation. Consider adding a TODO or using the project's translation workflow to ensure these get translated.

💡 Quality: i18n placeholder still untranslated English in all locales

📄 openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:2239

The new key type-mcp-placeholder is added as "What do you want?" in every locale file (ar-sa, de-de, ja-jp, etc.). This was flagged in the previous review for other keys and the same pattern continues here. All non-English locales should have proper translations, or at minimum the English string should be more polished — "What do you want?" reads quite bluntly for a chat placeholder. Consider something like "Ask a question…" or "How can I help you?".

Suggested fix
Use a friendlier placeholder like "Ask a question…" in en-us.json and provide actual translations for other locales, or leave non-English files empty so they fall back to the English default.
✅ 4 resolved
Bug: AbortController is created but never wired up — streams cannot be cancelled

📄 openmetadata-ui/src/main/resources/ui/src/components/McpChat/McpChatPage/McpChatPage.component.tsx:71 📄 openmetadata-ui/src/main/resources/ui/src/components/McpChat/McpChatPage/McpChatPage.component.tsx:166 📄 openmetadata-ui/src/main/resources/ui/src/components/McpChat/McpChatPage/McpChatPage.component.tsx:182 📄 openmetadata-ui/src/main/resources/ui/src/rest/mcpClientAPI.ts:140-154
The component creates an AbortController at line 166 and checks signal.aborted at line 182, but:

  1. abort() is never called anywhere — not on unmount, not before sending a new message.
  2. The signal is never passed to streamChat(), so even if abort() were called, the underlying fetch request would remain open.

This means: (a) navigating away while streaming leaves an orphaned HTTP connection open until the server finishes, (b) the signal.aborted check is dead code since nothing triggers the abort, and (c) rapidly sending messages could cause overlapping streams (the isStreaming guard helps, but unmount is not covered).

To fix, pass the signal through to streamChat and add a cleanup effect.

Bug: JSON.parse in SSE parser has no error handling for malformed payloads

📄 openmetadata-ui/src/main/resources/ui/src/rest/mcpClientAPI.ts:188
In streamChat, JSON.parse(payload) at line 188 is called without a try-catch. If the server sends a malformed SSE data line (e.g., partial JSON from a network issue, or an unexpected server message), this will throw an uncaught error that propagates up as a stream error and kills the entire streaming session.

Since this is a network boundary parsing untrusted data, it should be wrapped in a try-catch that either yields an error event or skips the malformed line.

Edge Case: SSE parser doesn't handle 'data:' lines without space after colon

📄 openmetadata-ui/src/main/resources/ui/src/rest/mcpClientAPI.ts:178-183
The SSE spec allows data:payload (no space after colon) as well as data: payload. The current parser only matches line.startsWith('data: ') (with space), so a server sending data:payload would be silently dropped. While unlikely if the server is controlled, it's a subtle spec compliance gap.

Additionally, empty lines and comment lines (starting with :) are already implicitly skipped by the data: check, which is fine.

Edge Case: User message with optimistic- ID prefix could collide with server IDs

📄 openmetadata-ui/src/main/resources/ui/src/components/McpChat/McpChatPage/McpChatPage.component.tsx:157-158 📄 openmetadata-ui/src/main/resources/ui/src/components/McpChat/McpChatPage/McpChatPage.component.tsx:217-219 📄 openmetadata-ui/src/main/resources/ui/src/components/McpChat/McpChatPage/McpChatPage.component.tsx:242-244
Optimistic user messages use id: \optimistic-${Date.now()}`and are later filtered out viam.id.startsWith('optimistic-'). If the message_completeevent doesn't arrive (e.g., network drop after sending), the optimistic message stays in state permanently with a fake ID. The catch block at line 240-244 handles this by removing optimistic messages on error, but if the generator simply ends without error (e.g., server closes stream withoutmessage_completeorerror`), the optimistic message will remain as a ghost.

🤖 Prompt for agents
Code Review: Implements the MCP Client in OpenMetadata UI with robust SSE parsing and AbortController stream cancellation. Please update the new i18n keys and placeholders across all non-English locale files to ensure proper localization.

1. 💡 Quality: i18n keys added as untranslated English in all non-English locale files
   Files: openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:100, openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:1361, openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:2197-2198, openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:2234, openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:2719-2721, openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:2872-2874, openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:2979

   All 12 new i18n keys (e.g., `ai-assistant`, `new-conversation`, `tool-call`, `mcp-chat-welcome`, etc.) are added with English text in every locale file (ar-sa, de-de, ja-jp, zh-cn, etc.). This means non-English users will see English strings. Per the CI rule about synced i18n keys, the keys should be present but ideally flagged for translation. Consider adding a TODO or using the project's translation workflow to ensure these get translated.

2. 💡 Quality: i18n placeholder still untranslated English in all locales
   Files: openmetadata-ui/src/main/resources/ui/src/locale/languages/ar-sa.json:2239

   The new key `type-mcp-placeholder` is added as `"What do you want?"` in every locale file (ar-sa, de-de, ja-jp, etc.). This was flagged in the previous review for other keys and the same pattern continues here. All non-English locales should have proper translations, or at minimum the English string should be more polished — "What do you want?" reads quite bluntly for a chat placeholder. Consider something like "Ask a question…" or "How can I help you?".

   Suggested fix:
   Use a friendlier placeholder like "Ask a question…" in en-us.json and provide actual translations for other locales, or leave non-English files empty so they fall back to the English default.

Options

Display: compact → Showing less information.

Comment with these commands to change:

Compact
gitar display:verbose         

Was this helpful? React with 👍 / 👎 | Gitar

@hassaansaleem28 hassaansaleem28 changed the title feat: add MCP Client in Openmetadata UI Fixes #27678 : (feat) add MCP Client in UI Apr 25, 2026
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot encountered an error and was unable to review this pull request. You can try again by re-requesting a review.

Copy link
Copy Markdown
Contributor Author

@hassaansaleem28 hassaansaleem28 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

#27678 is completed so am closing this

@hassaansaleem28 hassaansaleem28 deleted the feat/mcp-chat-ui branch April 29, 2026 10:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Implement MCP Client in OpenMetadata UI

2 participants