Skip to content

AT-360 Added Diagram Chat Functionality To Mermaid/sdk So MCP Server Can Directly Access Mermaid AI #43

Open
Prashant-7718 wants to merge 5 commits intomainfrom
AT-360-new-mcp-tool-for-the-chat-with-mermaid
Open

AT-360 Added Diagram Chat Functionality To Mermaid/sdk So MCP Server Can Directly Access Mermaid AI #43
Prashant-7718 wants to merge 5 commits intomainfrom
AT-360-new-mcp-tool-for-the-chat-with-mermaid

Conversation

@Prashant-7718
Copy link
Copy Markdown
Contributor

@Prashant-7718 Prashant-7718 commented Mar 31, 2026

This pull request adds a diagramChat method to the @mermaidchart/sdk, enabling external clients such as MCP servers to chat directly with Mermaid AI without handling streaming internals themselves.

These changes also expose the necessary types (DiagramChatRequest, DiagramChatResponse) so consumers get full TypeScript support for the new chat capability.

New diagramChat method in SDK:

  • Added MermaidChart.diagramChat() which posts a single user message to the collab chat endpoint with autoFetchHistory: true, so callers never need to track or resend previous messages.
  • Used responseType: 'text' on the axios request to buffer the full Vercel AI data-stream body as a plain string, then parsed it with two dedicated helpers: parseVercelAIStreamText (extracts AI reply from 0: lines) and parseVercelAIStreamData (extracts documentChatThreadID from 2: data lines).
  • Returns a clean { text, documentChatThreadID, documentID } object — the resolved thread ID falls back to the caller-supplied one if the backend did not return a new one.
  • Added DiagramChatRequest and DiagramChatResponse interfaces to types.ts covering message, code, documentID, documentChatThreadID, and the full response shape.

Copilot AI review requested due to automatic review settings March 31, 2026 08:05
@vercel
Copy link
Copy Markdown

vercel bot commented Mar 31, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Actions Updated (UTC)
office-plugin-site Ignored Ignored Mar 31, 2026 0:14am

Request Review

Copy link
Copy Markdown

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.

Pull request overview

Adds SDK support for a new Mermaid AI “diagram chat” endpoint so consumers (e.g., an MCP server) can send a user prompt + optional diagram context and receive streamed AI output.

Changes:

  • Added /rest-api/openai/chat URL constant.
  • Introduced DiagramChatRequest / DiagramChatResponse public types.
  • Implemented MermaidChart.diagramChat() including parsing of Vercel AI SDK data-stream output.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 5 comments.

File Description
packages/sdk/src/urls.ts Adds the REST URL for the new OpenAI chat endpoint.
packages/sdk/src/types.ts Defines request/response types for diagram chat.
packages/sdk/src/index.ts Implements diagramChat() and helpers to parse the streamed response body.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot AI review requested due to automatic review settings March 31, 2026 10:48
Copy link
Copy Markdown

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.

Pull request overview

Copilot reviewed 5 out of 5 changed files in this pull request and generated 3 comments.

Comments suppressed due to low confidence (1)

packages/sdk/src/index.ts:24

  • The PR description says the new DiagramChatRequest/DiagramChatResponse types are exposed for SDK consumers, but the entrypoint doesn’t re-export them. Since this package’s public surface is src/index.ts (and dist/index.d.ts), consider adding explicit export type { DiagramChatRequest, DiagramChatResponse } from './types.js' so consumers can import them from @mermaidchart/sdk without deep imports.
import type {
  AuthState,
  AuthorizationData,
  DiagramChatRequest,
  DiagramChatResponse,
  Document,
  InitParams,
  MCDocument,
  MCProject,
  MCUser,
  RepairDiagramRequest,
  RepairDiagramResponse,
  AICreditsUsage,
} from './types.js';
import { URLS } from './urls.js';

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment on lines +118 to +120
vi.spyOn(client, 'diagramChat').mockRejectedValue(
new AICreditsLimitExceededError('AI credits limit exceeded'),
);
Copy link

Copilot AI Mar 31, 2026

Choose a reason for hiding this comment

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

This test doesn’t exercise the 402-handling logic in diagramChat() because it mocks client.diagramChat() itself to reject. Instead, mock the underlying axios .post() to reject with a { response: { status: 402, data: ... } } shape and assert that diagramChat() maps it to AICreditsLimitExceededError.

Suggested change
vi.spyOn(client, 'diagramChat').mockRejectedValue(
new AICreditsLimitExceededError('AI credits limit exceeded'),
);
// Mock the underlying axios call to simulate a 402 response from the API.
// eslint-disable-next-line @typescript-eslint/no-explicit-any
vi.spyOn((client as any).axios, 'post').mockRejectedValue({
response: {
status: 402,
data: {
message: 'AI credits limit exceeded',
},
},
});

Copilot uses AI. Check for mistakes.
Copy link
Copy Markdown

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.

Pull request overview

Copilot reviewed 5 out of 5 changed files in this pull request and generated 2 comments.


💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

// can parse the Vercel AI SDK data-stream format after the request completes.
const response = await this.axios.post<string>(URLS.rest.openai.chat, requestBody, {
responseType: 'text',
timeout: 120_000,
Copy link

Copilot AI Mar 31, 2026

Choose a reason for hiding this comment

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

diagramChat() hard-codes a 120s Axios timeout, which bypasses the instance-level requestTimeout configured via InitParams (and used when creating the Axios client). Consider respecting this.requestTimeout (or using something like max(this.requestTimeout, 120_000) and documenting it) so callers can control request timing consistently across SDK methods.

Suggested change
timeout: 120_000,
timeout: Math.max(this.requestTimeout ?? 0, 120_000),

Copilot uses AI. Check for mistakes.
Comment on lines +436 to +452
} catch (error: unknown) {
if (
error &&
typeof error === 'object' &&
'response' in error &&
error.response &&
typeof error.response === 'object' &&
'status' in error.response &&
(error as { response: { status: number } }).response.status === 402
) {
const axiosError = error as { response: { status: number; data?: unknown } };
throw new AICreditsLimitExceededError(
typeof axiosError.response.data === 'string'
? axiosError.response.data
: 'AI credits limit exceeded',
);
}
Copy link

Copilot AI Mar 31, 2026

Choose a reason for hiding this comment

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

The 402->AICreditsLimitExceededError mapping logic is now duplicated in both repairDiagram() and diagramChat(). To reduce divergence risk (e.g., message formatting changes), consider extracting a small shared helper (or a private method) to detect the 402 Axios shape and build the error consistently.

Copilot uses AI. Check for mistakes.
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.

4 participants