DayuanJiang/next-ai-draw-io

This system is a multi-provider AI chat application that integrates with Draw.io to generate, edit, and validate diagrams using Vision Language Models. It features a robust backend for managing diverse AI providers, enforcing server-side quotas and access controls, and persisting sessions via IndexedDB. The application supports deployment as a web service, a self-hosted edge function, or a native Electron desktop client, with comprehensive internationalization and observability tools.

28 changes.

The project was initialized with a complete Next.js application structure, establishing core infrastructure for multi-provider AI integration, session persistence, and observability. Significant effort was directed toward building a native Electron desktop application with offline capabilities, alongside implementing comprehensive internationalization and a redesigned chat interface with advanced diagram editing features.

7 changes.

The chat interface was refactored into modular components with template management and VLM-based diagram validation. A new file-based admin panel was introduced for managing AI providers and settings, alongside a secure URL parsing API. Comprehensive test coverage was added for the frontend, backend APIs, and the MCP server.

A new edge function at /api/edgeai/chat/completions has been added to support EdgeOne Pages as an AI provider. This endpoint implements an OpenAI-compatible API, allowing clients to use the AI SDK with a custom base URL. It supports streaming responses and native tool calling using specific DeepSeek models (v3.2, r1-0528, v3-0324) accessible via aliases. The implementation includes input validation via Zod, CORS handling, and model selection logic, effectively exposing EdgeOne's AI capabilities through a standard interface.

edge-functions · high confidence

The app now supports multiple languages (English, Simplified Chinese, Traditional Chinese, and Japanese) via dynamic routing under the \[lang\] segment. The root layout generates locale-specific SEO metadata (titles, descriptions, Open Graph tags) and serves the correct dictionary translations through a new DictionaryProvider. The main page detects the current locale from the URL path, respects user preferences stored in localStorage, and passes the language setting to the Draw.io embed to ensure the diagram editor interface matches the app's locale.

app/\[lang\] · high confidence

The chat API route has been significantly expanded to include server-side quota enforcement via DynamoDB (tracking daily request and token limits), access code authentication, and dynamic model selection from a server-side configuration. It now supports file uploads with validation, cached example responses to save tokens, and detailed Langfuse observability. Additionally, the route introduces a new \server-models\ endpoint to expose available AI models and integrates a Draw.io XML schema guide to improve diagram generation accuracy.

app/api/chat · high confidence

New scripts have been added to support the Electron desktop application build process. The \prepare-electron-build.mjs\ script now copies the Next.js standalone output, static files, and public assets into a dedicated directory, specifically handling symlinks by dereferencing them to ensure macOS codesigning succeeds. The \afterPack.cjs\ hook further processes the build by copying \node\_modules\ into the standalone directory and performing ad-hoc signing on macOS to resolve signature issues with bundled draw.io files. Additionally, \electron-dev.mjs\ provides a development workflow that manages the Next.js server lifecycle and Electron compilation, while \test-diagram-operations.mjs\ offers a standalone test runner for diagram operation logic.

scripts · high confidence

A new API endpoint at /api/config now exposes server-side configuration settings to the client, including whether an access code is required, and the specific daily request limits, daily token limits, and tokens-per-minute (TPM) limits defined by environment variables. This allows the frontend to dynamically adapt its behavior and UI based on the current server constraints rather than relying on hardcoded values.

app/api/config · high confidence

This change introduces the core infrastructure for a native desktop application using Electron, enabling users to run the tool offline by bundling the standalone draw.io assets directly within the app package. The implementation includes the Electron build configuration (electron-builder.yml) for generating installers and archives across macOS (DMG, zip), Windows (NSIS, portable), and Linux (AppImage, deb, rpm), along with TypeScript type definitions and preload scripts that expose native capabilities—such as window controls, file dialogs, proxy settings, and configuration presets—to the web-based renderer process.

electron · high confidence

The lib/i18n directory now contains the core internationalization setup, including config.ts defining the supported locales (en, zh, ja, zh-Hant), dictionaries.ts for dynamic loading of translation JSON files, and utils.ts for message formatting. The initial dictionary files (en.json, zh.json, ja.json, zh-Hant.json) provide translations for the application's UI, covering navigation, settings, chat interactions, provider names, error messages, and save/history dialogs.

lib/i18n · high confidence

The repository is initialized with a complete Next.js application structure, including a multi-stage Dockerfile for standalone builds, a docker-compose setup for local development with draw.io, and configuration files for Vercel, Cloudflare Workers, and EdgeOne Pages. The project adopts Biome for linting and formatting, integrates Langfuse for observability via an instrumentation hook, and supports features like subdirectory deployment, self-hosted draw.io, and an admin settings panel. Additionally, testing infrastructure is added with Vitest and Playwright, and the project is licensed under Apache 2.0.

(repo-wide) · high confidence

This change adds the Electron main process, establishing the desktop application shell. It introduces a settings system that persists configuration presets (including AI API keys, which are encrypted via Electron's safeStorage when available) and proxy settings to the user data directory. The application menu is now fully internationalized, supporting English, Simplified Chinese, Japanese, and Traditional Chinese. To ensure a stable user experience, the app uses fixed local ports for the embedded Next.js server to preserve localStorage across restarts, and overrides the draw.io iframe's beforeunload handler to prevent unwanted close prompts.

electron/main · high confidence

The application now supports configuring multiple AI providers simultaneously through a new type system defined in \lib/types/model-config.ts\. This change introduces structured types for managing a list of providers (including OpenAI, Anthropic, Google Vertex AI, Azure, Bedrock, Ollama, and many others like SiliconFlow, Doubao, and ModelScope), each with their own API keys, base URLs, and specific model configurations. Users can now select from a unified pool of models across different providers, with support for showing unvalidated models and distinguishing between user-defined and server-default models.

lib/types · high confidence

The MCP server now includes a robust core for managing diagram sessions and editing operations. It supports multi-page diagrams by normalizing inputs to an \<mxfile\> structure and providing page-targeting selectors (by ID, name, or index) for tools like edit\_diagram and get\_diagram. A new content-based edit gate replaces the previous 30-second time gate, allowing edits as long as the diagram content hasn't changed since the model last saw it, preventing stale updates. The server also introduces a simple in-memory history system (circular buffer of 20 entries) to track diagram versions. Under the hood, it uses an embedded HTTP server to serve the draw.io embed, with configurable base URLs for private deployments, a 10MB body size limit, and strict CORS policies. XML validation and auto-fixing are integrated to handle common errors like duplicate IDs and structural attribute issues.

packages/mcp-server/src · high confidence

This change introduces a new set of UI components in the \components/ai-elements\ directory to enhance the chat interface. The \ModelSelector\ component allows users to choose between different AI providers and models, featuring a hidden scrollbar with a dynamic shadow indicator to signal scrollable content. Additionally, the \Reasoning\ component (including \ReasoningTrigger\ and \ReasoningContent\) enables the display of AI thinking blocks as collapsible sections that track streaming duration and auto-close after a delay. A \Shimmer\ component is also added to provide loading animations for thinking states.

components/ai-elements · high confidence

The application now supports the AIHubMix provider, including a new API route to fetch available models and integration into the model validation endpoint. To ensure security, the model validation endpoint now includes SSRF protection that blocks private base URLs by default, preventing potential server-side request forgery attacks when validating custom endpoints.

app/api/validate-model · high confidence

A new API route at /api/validate-diagram has been added to support visual quality checks on diagrams using a Vision Language Model (VLM). Users can now submit PNG images via this endpoint to receive structured validation results, including identified issues and suggestions. The service is enabled by default but can be disabled via the ENABLE\_VLM\_VALIDATION environment variable, and it includes configurable timeouts and graceful fallbacks to a 'valid' state if the VLM provider is unavailable or an error occurs.

app/api/validate-diagram · high confidence

The application now includes a comprehensive set of new UI components built on Radix UI primitives, including AlertDialog, Collapsible, Command (with a command palette dialog), Dialog, Input, Label, Popover, Resizable panels, ScrollArea, Select, Switch, and Textarea. These components provide consistent, accessible patterns for common interface elements. Additionally, the default button hover state has been changed from a lighter background to a darker brightness effect, providing a more distinct visual feedback when interacting with buttons.

components/ui · high confidence

The new /api/parse-url endpoint allows users to submit a URL and receive the extracted article content as Markdown. To ensure security, the endpoint strictly blocks requests to private or internal IP addresses and rejects any HTTP redirects to prevent Server-Side Request Forgery (SSRF) attacks. It also handles character encoding detection for non-UTF-8 pages, enforces a 15-second timeout, and returns a clear error if the target URL points to a PDF file.

app/api/parse-url · high confidence

A new admin interface is now available at /admin, allowing administrators to manage AI provider configurations and general application settings via a file-based backend (settings.json) rather than solely relying on environment variables. The panel includes a Models section for adding, editing, and testing AI provider credentials (with support for masking secrets and validating connections) and a General Settings section for toggling features, access controls, and observability options. Authentication is enforced via the ADMIN\_PASSWORD environment variable, and changes are persisted to disk, with the system handling precedence (file \> env \> default) and providing UI indicators for the source of each setting.

app/\[lang\]/admin, app/api/admin, lib/admin · high confidence

This change introduces several new React hooks in the hooks directory to support expanded application capabilities. useDiagramToolHandlers centralizes logic for diagram-related tool calls (display, edit, append) and handles XML truncation and validation state updates. useModelConfig manages multi-provider model settings with a migration path from the previous single-provider localStorage format and includes a toggle to show unvalidated models. useSessionManager implements IndexedDB-based persistence for chat sessions, including migration from localStorage and multi-tab synchronization. useValidateDiagram adds VLM-based diagram validation via the AI SDK, and useDictionary provides context-based internationalization support.

hooks · high confidence

The application now includes a comprehensive set of backend libraries to support a multi-provider AI architecture and improved data handling. A new \lib/ai-providers.ts\ file centralizes configuration for numerous AI providers (including OpenAI, Anthropic, Bedrock, Ollama, and others) and introduces logic to resolve base URLs and API keys, ensuring user-provided credentials are isolated from server defaults. Server-side model configuration is now managed via \lib/server-model-config.ts\, supporting file-based settings and environment variables. To improve reliability and performance, chat sessions are now persisted to IndexedDB via \lib/session-storage.ts\, and example prompt responses are cached in \lib/cached-responses.ts\. Security is enhanced with \lib/ssrf-protection.ts\ to prevent server-side request forgery, while \lib/dynamo-quota-manager.ts\ enables optional server-side usage tracking. Additional utilities include \lib/pdf-utils.ts\ for file extraction, \lib/diagram-validator.ts\ for visual validation, and \lib/output-token-limit.ts\ to handle provider-specific token constraints.

lib · high confidence

A new API route at /api/verify-access-code has been added to validate access codes on the server before allowing actions. This endpoint checks the 'x-access-code' header against a comma-separated list defined in the ACCESS\_CODE\_LIST environment variable. If no codes are configured, verification automatically passes; otherwise, it returns a 401 Unauthorized status for missing or invalid codes.

app/api/verify-access-code · high confidence

The chat lobby interface has been restructured into distinct, reusable components: ChatLobby (the main lobby view), TemplatePanel (for browsing and managing user templates), ToolCallCard (for displaying tool execution results), and ValidationCard (for showing diagram validation status). This change introduces a personal 'My Templates' library alongside existing Quick Examples, allowing users to create, edit, pin, duplicate, and delete their own templates. Additionally, the UI now supports VLM-based diagram validation, providing visual feedback on diagram quality and suggestions for improvement.

components/chat · high confidence

The application now logs user interactions to Langfuse, enabling observability for both feedback and diagram saves. When a user submits good or bad feedback, the system attaches a score to the corresponding chat trace in Langfuse; if no trace exists for the session, a standalone feedback trace is created. Similarly, when a user saves a diagram, a 'diagram-saved' score is attached to the active chat trace. Both endpoints validate input using Zod and gracefully handle cases where Langfuse is unavailable or no session trace is found.

app/api/log-feedback · high confidence

The \components/assistant-ui\ directory has been removed, deleting the \markdown-text\, \thread-list\, \thread\, and \tooltip-icon-button\ components. This eliminates the custom UI implementations for rendering markdown content, managing chat thread lists, handling the main chat thread interface, and providing tooltip-enabled icon buttons within this specific component location.

components/assistant-ui · high confidence

A new entitlements file (entitlements.mac.plist) has been added to the resources directory to configure macOS security permissions for the desktop application. This includes enabling Just-In-Time (JIT) compilation, allowing unsigned executable memory, permitting dyld environment variables, and granting network client and server access, which are required for the Electron-based desktop app to function correctly on macOS.

resources · high confidence

The Electron settings panel now displays a prominent deprecation warning informing users that this interface will be removed in a future update. Users are directed to use the 'AI Model Configuration' button located in the chat panel instead, as settings configured there will persist across updates. The panel itself, which allows managing AI provider presets (including ModelScope support), remains functional for now but is marked for removal.

electron/settings · high confidence

The project now automatically runs lint-staged and TypeScript type-checking before every commit, and executes the test suite before every push (skipped if node\_modules are missing). This ensures code quality and test coverage are maintained without manual intervention.

.husky · high confidence

The application now uses a new \DiagramContext\ to manage diagram state, history, and interactions. This change introduces XML validation and auto-fixing before diagrams are displayed to prevent errors from invalid markup. It also adds support for exporting diagrams in \xmlsvg\ format, capturing PNG thumbnails for session storage, and implementing a save-to-file feature with user feedback via toast notifications. Additionally, the context handles diagram restoration after component remounts (e.g., during theme changes) and prevents data loss by managing the Draw.io iframe lifecycle more robustly.

contexts · high confidence

The application now enforces long-term immutable caching for Next.js static assets via a new \\_headers\ configuration, improving load performance for repeat visitors. Additionally, the public folder has been updated with new SVG diagrams, including an Agile Scrum workflow and a Transformer Architecture visualization, which replace or supplement previous assets to better illustrate these concepts.

public · high confidence

The chat experience has been redesigned with a new Example Panel that provides quick-start cards for diagrams and PDFs, alongside a completely rewritten Chat Input that now supports drag-and-drop and paste uploads for images, PDFs, and text files with client-side validation. The Chat Message Display has been enhanced to render AI reasoning blocks, handle file/URL content sections, and display improved error toasts, while a new ButtonWithTooltip component standardizes accessible tooltips across the UI.

components · high confidence

The application now includes structured SEO metadata via new manifest, robots, and sitemap files to improve search engine visibility and PWA support. Additionally, the visual design has been updated with a new color palette, increased border radius, and the addition of the Tailwind Typography plugin for better text rendering.

app · high confidence

The About page components (app/\[lang\]/about) have been updated to import and use a custom Image component from @/components/image-with-basepath instead of the default Next.js Image. This change ensures that images on the About page are correctly served when the application is deployed under a non-root base path, fixing potential broken image links in such configurations.

app/\[lang\]/about · high confidence

Added Playwright end-to-end test suite; Added tests for MCP server multi-page support, diagram loading, and edit gating; Added unit tests for core application logic.

The application dependencies have been significantly upgraded, including Next.js to v16, React to v19.1.2, the AI SDK to v6, and Zod to v4, alongside the addition of new providers like Amazon Bedrock, DeepSeek, and OpenRouter. A new \@next-ai-drawio/mcp-server\ package has been introduced for npx distribution, bundling the Model Context Protocol SDK, Linkedom, Open, and Zod. The main project also integrates Electron for desktop support, Biome for linting, and Langfuse for observability.

(dependencies) · high confidence

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

• First survey — no prior run to compare against. CAI 60.

• Code Health 56
• Architecture 95
• Maturity 78
• Readiness 57
• Security 69
• Accessibility 63

• 300 commits — 179 feature/other, 121 fixes

• (root) — 77 commits
• (repo) — 33 commits
• lib/i18n — 22 commits
• packages/mcp-server — 20 commits
• app/[lang] — 19 commits
• app/api — 19 commits
• .github/workflows — 16 commits
• lib/ai-providers.ts — 14 commits
• components/chat-panel.tsx — 10 commits
• electron/main — 8 commits
• components/chat-input.tsx — 7 commits
• components/image-with-basepath.tsx — 7 commits
• components/model-config-dialog.tsx — 5 commits
• docs/cn — 5 commits
• components/chat — 4 commits
• app/globals.css — 3 commits
• components/chat-message-display.tsx — 3 commits
• components/settings-dialog.tsx — 3 commits
• contexts/diagram-context.tsx — 3 commits
• electron/electron-builder.yml — 3 commits

• fix: Add base URL + fix thinking
• fix: Fix #525: Copy public folder in Electron build to include favicon-white.svg (#545)
• fix: Fix: return clear error for PDF URLs in content extraction (#694)
• fix: Merge pull request #425 from vansh-nagar/fix/theme-based-logo
• fix: Merge pull request #578 from DayuanJiang/fix/user-apikey-baseurl-isolation
• fix: Merge pull request #586 from Biki-dev/fix-inputFocus
• fix: Merge pull request #601 from DayuanJiang/fix/edit-diagram-json-quote-escaping
• fix: Merge pull request #648 from DayuanJiang/fix/idb-closing-retry
• fix: Merge pull request #657 from shibamudi/fix/path-handling-with-basepath
• fix: Merge pull request #662 from DayuanJiang/fix/ollama-ssrf-exception
• fix: Merge pull request #663 from DayuanJiang/fix/ollama-allowed-client-provider
• fix: Merge pull request #664 from DayuanJiang/fix/ollama-client-base-url
• fix: Merge pull request #709 from DayuanJiang/fix/electron-startup-port-issues
• fix: Merge pull request #743 from Biki-dev/some-ui-fixes
• fix: Revert "fix(electron): prevent beforeunload prompt by using autosave (#642)" (#646)
• fix: chore(mcp-server): fix author and repository to DayuanJiang (#529)
• fix: chore: remove dead code from previous #815 fix attempts (#841)
• fix: chore: revert version to 0.4.9 (#509)
• fix: fix - not clearing the loading state (#524)
• fix: fix(anthropic): support ANTHROPIC_AUTH_TOKEN as alternative to ANTHROPIC_API_KEY (#853)
• …and 280 more

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

DayuanJiang/next-ai-draw-io was measured the same way every project in this corpus was: the same rubric, at a pinned commit, with the result published in full. Point a surveyor at a repository you know and see whether you agree with it.