refactor(web): edit and wrap diagrams with the MCP server's code

- edit_diagram runs the MCP server's editDiagram: every new_xml is checked
  first, one cell per operation, and after the edit only the target page
  is checked, rejecting only errors this edit introduced. An unrelated
  problem elsewhere in the document no longer blocks every edit. The
  error lists each failed operation
- The streaming edit preview uses the MCP applyDiagramOperations
- Delete applyDiagramOperations (292 lines) and wrapWithMxFile from
  lib/utils.ts, and the unused hand-copied scripts/test-diagram-operations.mjs
- One blank document (BLANK_MXFILE) for the web app and the MCP preview,
  replacing four copies
- Saving a .drawio wraps a bare model with normalizeToMxfile
- The empty-diagram check uses hasCells, which also counts cells wrapped
  in a UserObject/object
- DiagramOperation is the MCP type
- The wrapped-cell and empty-diagram tests now run against the MCP code
- New e2e test: edit_diagram changes the canvas, and a failing edit
  leaves it as it was

components/chat-message-display.tsx

@@ -37,11 +37,12 @@ import { ScrollArea } from "@/components/ui/scroll-area"
 import { useDictionary } from "@/hooks/use-dictionary"
 import { getApiEndpoint } from "@/lib/base-path"
 import {
-    applyDiagramOperations,
     convertToLegalXml,
     extractCompleteMxCells,
     replaceNodes,
 } from "@/lib/utils"
+import { applyDiagramOperations } from "@/packages/mcp-server/src/diagram-operations.ts"
+import { BLANK_MXFILE } from "@/packages/mcp-server/src/pages.ts"
 
 // Helper to extract complete operations from streaming input
 function getCompleteOperations(
@@ -362,9 +363,7 @@ export function ChatMessageDisplay({
 
             try {
                 // An empty canvas gets a default mxfile to put the cells in
-                const baseXML =
-                    chartXML ||
-                    `<mxfile><diagram name="Page-1" id="page-1"><mxGraphModel><root><mxCell id="0"/><mxCell id="1" parent="0"/></root></mxGraphModel></diagram></mxfile>`
+                const baseXML = chartXML || BLANK_MXFILE
                 const replacedXML = replaceNodes(baseXML, convertedXml)
                 previousXML.current = convertedXml
                 onDisplayChart(replacedXML, true)

components/chat-panel.tsx

@@ -32,7 +32,6 @@ import { useSessionManager } from "@/hooks/use-session-manager"
 import { useValidateDiagram } from "@/hooks/use-validate-diagram"
 import { getApiEndpoint } from "@/lib/base-path"
 import { findCachedResponse } from "@/lib/cached-responses"
-import { isMinimalDiagram } from "@/lib/chat-helpers"
 import type { DrawioTheme } from "@/lib/drawio-themes"
 import { formatMessage } from "@/lib/i18n/utils"
 import { isPdfFile, isTextFile } from "@/lib/pdf-utils"
@@ -41,7 +40,8 @@ import { STORAGE_KEYS } from "@/lib/storage"
 import type { UrlData } from "@/lib/url-utils"
 import { type FileData, useFileProcessor } from "@/lib/use-file-processor"
 import { useQuotaManager } from "@/lib/use-quota-manager"
-import { cn, formatXML, isRealDiagram, wrapWithMxFile } from "@/lib/utils"
+import { cn, formatXML, isRealDiagram } from "@/lib/utils"
+import { BLANK_MXFILE, hasCells } from "@/packages/mcp-server/src/pages.ts"
 import type { ValidationState } from "./chat/ValidationCard"
 import {
     APPENDED_FILE_SECTIONS_PATTERN,
@@ -812,10 +812,7 @@ export default function ChatPanel({
         if (input.trim() && !isProcessing && !isExtracting) {
             // Check if input matches a cached example (only when no messages
             // yet and the canvas is empty, same rule as the server)
-            if (
-                messages.length === 0 &&
-                isMinimalDiagram(chartXMLRef.current || "")
-            ) {
+            if (messages.length === 0 && !hasCells(chartXMLRef.current || "")) {
                 // Pass the file name so a user's own file never matches an example
                 const cached = findCachedResponse(
                     input.trim(),
@@ -859,7 +856,7 @@ export default function ChatPanel({
                     // Snapshot the canvas before the example so editing this message works
                     xmlSnapshotsRef.current.set(
                         0,
-                        chartXMLRef.current || wrapWithMxFile(""),
+                        chartXMLRef.current || BLANK_MXFILE,
                     )
                     setInput("")
                     sessionStorage.removeItem(SESSION_STORAGE_INPUT_KEY)

components/chat/types.ts

@@ -1,8 +1,6 @@
-export interface DiagramOperation {
-    operation: "update" | "add" | "delete"
-    cell_id: string
-    new_xml?: string
-}
+import type { DiagramOperation } from "@/packages/mcp-server/src/diagram-operations.ts"
+
+export type { DiagramOperation }
 
 export interface ToolPartLike {
     type: string

components/dev-xml-simulator.tsx

@@ -2,7 +2,7 @@
 
 import { useEffect, useRef, useState } from "react"
 import { useDictionary } from "@/hooks/use-dictionary"
-import { wrapWithMxFile } from "@/lib/utils"
+import { prepareNewDiagram } from "@/packages/mcp-server/src/new-diagram.ts"
 
 // Dev XML presets for streaming simulator
 const DEV_XML_PRESETS: Record<string, string> = {
@@ -237,8 +237,8 @@ export function DevXmlSimulator({
         })
 
         // Display the final diagram
-        const fullXml = wrapWithMxFile(xml)
-        onDisplayChart(fullXml)
+        const prepared = prepareNewDiagram(xml)
+        if (prepared.ok) onDisplayChart(prepared.xml)
 
         setIsSimulating(false)
     }