Compare commits

..

2 Commits

Author SHA1 Message Date
dayuan.jiang
2158d26bbb fix: address PR review feedback for auto-update
- Register manual check listeners before checkForUpdates() to avoid race
- Strip prerelease/build metadata in version comparison
- Add res.setEncoding("utf8") for GitHub API response
- Stream file hashing in CI script instead of reading into memory
- Add directory existence checks in fix-latest-yml.mjs
- Define UpdateStatus type locally in preload to avoid tsconfig scope issues
- Show error dialog for manual check failures (parse/network errors)
2026-04-03 17:59:57 +09:00
dayuan.jiang
e27afe6f0d feat: add automatic update functionality for Electron app
Closes #613

- Add electron-updater for Windows NSIS and Linux AppImage auto-update
- macOS and Linux DEB fall back to GitHub API check with download link
- Add "Check for Updates" menu item with i18n (en, zh, ja, zh-Hant)
- Fix Windows CI workflow to publish correct latest.yml after code signing
- Add update toast notifications in renderer via sonner
2026-04-03 17:46:27 +09:00
93 changed files with 3385 additions and 11053 deletions

View File

@@ -23,9 +23,7 @@ jobs:
node-version: '24' node-version: '24'
- name: Run Biome format - name: Run Biome format
# Pin to the version in package.json so CI matches local/pre-commit run: npx @biomejs/biome@latest check --write --no-errors-on-unmatched .
# (npx @latest drifts — e.g. 2.5.0 broke this job on unrelated PRs).
run: npx @biomejs/biome@2.4.13 check --write --no-errors-on-unmatched .
- name: Check for changes - name: Check for changes
id: changes id: changes

View File

@@ -37,7 +37,7 @@ jobs:
- name: Download draw.io static files for offline use - name: Download draw.io static files for offline use
run: | run: |
rm -rf public/drawio rm -rf public/drawio
git clone --depth 1 https://github.com/jgraph/drawio.git /tmp/drawio git clone --depth 1 --branch v29.3.5 https://github.com/jgraph/drawio.git /tmp/drawio
mkdir -p public/drawio mkdir -p public/drawio
cp -r /tmp/drawio/src/main/webapp/* public/drawio/ cp -r /tmp/drawio/src/main/webapp/* public/drawio/
rm -rf public/drawio/WEB-INF rm -rf public/drawio/WEB-INF
@@ -70,7 +70,7 @@ jobs:
shell: bash shell: bash
run: | run: |
rm -rf public/drawio rm -rf public/drawio
git clone --depth 1 https://github.com/jgraph/drawio.git /tmp/drawio git clone --depth 1 --branch v29.3.5 https://github.com/jgraph/drawio.git /tmp/drawio
mkdir -p public/drawio mkdir -p public/drawio
cp -r /tmp/drawio/src/main/webapp/* public/drawio/ cp -r /tmp/drawio/src/main/webapp/* public/drawio/
rm -rf public/drawio/WEB-INF rm -rf public/drawio/WEB-INF
@@ -105,9 +105,14 @@ jobs:
wait-for-completion: true wait-for-completion: true
output-artifact-directory: release-signed output-artifact-directory: release-signed
- name: Upload signed artifacts to release - name: Fix latest.yml with signed exe hashes
run: node scripts/fix-latest-yml.mjs
- name: Upload signed artifacts and update metadata to release
uses: softprops/action-gh-release@v2 uses: softprops/action-gh-release@v2
with: with:
files: release-signed/*.exe files: |
release-signed/*.exe
release/latest*.yml
env: env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

View File

@@ -28,16 +28,6 @@ jobs:
- name: Run unit tests - name: Run unit tests
run: npm run test -- --run run: npm run test -- --run
# The MCP server package ships its own vitest because its DOM polyfill
# (linkedom) needs `environment: node`, while the root vitest uses jsdom
# for the Next.js app. Install + run its tests separately so CI catches
# multi-page mxfile regressions.
- name: Install MCP server dependencies
run: npm --prefix packages/mcp-server ci
- name: Run MCP server unit tests
run: npm --prefix packages/mcp-server test
e2e: e2e:
name: E2E Tests name: E2E Tests
runs-on: ubuntu-latest runs-on: ubuntu-latest

3
.gitignore vendored
View File

@@ -76,6 +76,3 @@ ai-models.json
# local backups # local backups
*.bak *.bak
.gstack/ .gstack/
# admin panel settings (contains secrets)
data/

View File

@@ -61,9 +61,6 @@ COPY --from=builder /app/public ./public
COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./ COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static
# Writable dir for admin panel settings (data/settings.json)
RUN mkdir -p /app/data && chown nextjs:nodejs /app/data
USER nextjs USER nextjs
EXPOSE 3000 EXPOSE 3000

View File

@@ -31,7 +31,7 @@ https://github.com/user-attachments/assets/9d60a3e8-4a1c-4b5e-acbb-26af2d3eabd1
- [Table of Contents](#table-of-contents) - [Table of Contents](#table-of-contents)
- [Examples](#examples) - [Examples](#examples)
- [Features](#features) - [Features](#features)
- [MCP Server](#mcp-server) - [MCP Server (Preview)](#mcp-server-preview)
- [Claude Code CLI](#claude-code-cli) - [Claude Code CLI](#claude-code-cli)
- [Getting Started](#getting-started) - [Getting Started](#getting-started)
- [Try it Online](#try-it-online) - [Try it Online](#try-it-online)
@@ -43,8 +43,6 @@ https://github.com/user-attachments/assets/9d60a3e8-4a1c-4b5e-acbb-26af2d3eabd1
- [Deploy on Vercel](#deploy-on-vercel) - [Deploy on Vercel](#deploy-on-vercel)
- [Deploy on Cloudflare Workers](#deploy-on-cloudflare-workers) - [Deploy on Cloudflare Workers](#deploy-on-cloudflare-workers)
- [Multi-Provider Support](#multi-provider-support) - [Multi-Provider Support](#multi-provider-support)
- [Server-Side Multi-Model Configuration](#server-side-multi-model-configuration)
- [Admin Panel](#admin-panel)
- [How It Works](#how-it-works) - [How It Works](#how-it-works)
- [Support \& Contact](#support--contact) - [Support \& Contact](#support--contact)
- [FAQ](#faq) - [FAQ](#faq)
@@ -65,24 +63,24 @@ Here are some example prompts and their generated diagrams:
</tr> </tr>
<tr> <tr>
<td width="50%" valign="top"> <td width="50%" valign="top">
<strong>RAG Technique Diagram</strong><br /> <strong>GCP architecture diagram</strong><br />
<p><strong>Prompt:</strong> Generate a RAG architecture diagram for **chat application**. Use connected diagram for data ingestion</p> <p><strong>Prompt:</strong> Generate a GCP architecture diagram with **GCP icons**. In this diagram, users connect to a frontend hosted on an instance.</p>
<img src="./public/rag_prod.svg" alt="RAG Architecture Diagram" width="480" /> <img src="./public/gcp_demo.svg" alt="GCP Architecture Diagram" width="480" />
</td> </td>
<td width="50%" valign="top"> <td width="50%" valign="top">
<strong>Authentication using React and AWS</strong><br /> <strong>AWS architecture diagram</strong><br />
<p><strong>Prompt:</strong> Generate authentication process using React with **AWS**. Use Serverless architecture.</p> <p><strong>Prompt:</strong> Generate a AWS architecture diagram with **AWS icons**. In this diagram, users connect to a frontend hosted on an instance.</p>
<img src="./public/auth.svg" alt="Authentication Architecture Diagram" width="480" /> <img src="./public/aws_demo.svg" alt="AWS Architecture Diagram" width="480" />
</td> </td>
</tr> </tr>
<tr> <tr>
<td width="50%" valign="top"> <td width="50%" valign="top">
<strong>Open Innovation</strong><br /> <strong>Azure architecture diagram</strong><br />
<p><strong>Prompt:</strong> Create visualization of Henry Chesbrough's Open Innovation model.</p> <p><strong>Prompt:</strong> Generate a Azure architecture diagram with **Azure icons**. In this diagram, users connect to a frontend hosted on an instance.</p>
<img src="./public/inno.svg" alt="Open Innovation Diagram" width="480" /> <img src="./public/azure_demo.svg" alt="Azure Architecture Diagram" width="480" />
</td> </td>
<td width="50%" valign="top"> <td width="50%" valign="top">
<strong>Cat sketch</strong><br /> <strong>Cat sketch prompt</strong><br />
<p><strong>Prompt:</strong> Draw a cute cat for me.</p> <p><strong>Prompt:</strong> Draw a cute cat for me.</p>
<img src="./public/cat_demo.svg" alt="Cat Drawing" width="240" /> <img src="./public/cat_demo.svg" alt="Cat Drawing" width="240" />
</td> </td>
@@ -101,7 +99,9 @@ Here are some example prompts and their generated diagrams:
- **Cloud Architecture Diagram Support**: Specialized support for generating cloud architecture diagrams (AWS, GCP, Azure) - **Cloud Architecture Diagram Support**: Specialized support for generating cloud architecture diagrams (AWS, GCP, Azure)
- **Animated Connectors**: Create dynamic and animated connectors between diagram elements for better visualization - **Animated Connectors**: Create dynamic and animated connectors between diagram elements for better visualization
## MCP Server ## MCP Server (Preview)
> **Preview Feature**: This feature is experimental and may not be stable.
Use Next AI Draw.io with AI agents like Claude Desktop, Cursor, and VS Code via MCP (Model Context Protocol). Use Next AI Draw.io with AI agents like Claude Desktop, Cursor, and VS Code via MCP (Model Context Protocol).
@@ -211,7 +211,6 @@ See the [Next.js deployment documentation](https://nextjs.org/docs/app/building-
- Azure OpenAI - Azure OpenAI
- Ollama - Ollama
- OpenRouter - OpenRouter
- AIHubMix
- DeepSeek - DeepSeek
- SiliconFlow - SiliconFlow
- ModelScope - ModelScope
@@ -225,13 +224,7 @@ All providers except AWS Bedrock and OpenRouter support custom endpoints.
### Server-Side Multi-Model Configuration ### Server-Side Multi-Model Configuration
Administrators can configure multiple server-side models that are available to all users without requiring personal API keys. Configure via `AI_MODELS_CONFIG` environment variable (JSON string) or `ai-models.json` file. For a single-provider quick setup, list comma-separated model IDs in `AI_MODEL`. Administrators can configure multiple server-side models that are available to all users without requiring personal API keys. Configure via `AI_MODELS_CONFIG` environment variable (JSON string) or `ai-models.json` file.
### Admin Panel
Set the `ADMIN_PASSWORD` environment variable and visit `/admin` to manage server settings (models, access codes, features, observability, quota) from a web panel instead of hand-editing `.env`.
📖 **[Admin Panel Guide](./docs/en/admin-panel.md)** — setup, precedence rules, and notes.
**Model Requirements**: This task requires strong model capabilities for generating long-form text with strict formatting constraints (draw.io XML). Recommended models include Claude Sonnet 4.5, GPT-5.1, Gemini 3 Pro, and DeepSeek V3.2/R1. **Model Requirements**: This task requires strong model capabilities for generating long-form text with strict formatting constraints (draw.io XML). Recommended models include Claude Sonnet 4.5, GPT-5.1, Gemini 3 Pro, and DeepSeek V3.2/R1.

View File

@@ -175,106 +175,92 @@ export default function AboutCN() {
</p> </p>
<div className="space-y-8"> <div className="space-y-8">
{/* ResNet50 Architecture */} {/* Animated Transformer */}
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
ResNet50模型架构动画 Transformer连接器
</h3> </h3>
<p className="text-gray-600 mb-4"> <p className="text-gray-600 mb-4">
<strong>Prompt:</strong> Give me an{" "} <strong></strong>
<strong>animated</strong> architecture diagram <strong></strong>Transformer架构图
of the ResNet50 model.
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 inline-block"> <Image
<Image src="/animated_connectors.svg"
src="/resnet50.svg" alt="带动画连接器的Transformer架构"
alt="ResNet50模型架构图" width={480}
width={480} height={360}
height={360} className="mx-auto"
className="mx-auto" />
/>
</div>
</div> </div>
{/* Diagram Grid */} {/* Cloud Architecture Grid */}
<div className="grid md:grid-cols-2 gap-6"> <div className="grid md:grid-cols-2 gap-6">
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
RAG技术 GCP架构
</h3> </h3>
<p className="text-gray-600 text-sm mb-4"> <p className="text-gray-600 text-sm mb-4">
<strong>Prompt:</strong> Generate a RAG <strong></strong> 使
architecture diagram for{" "} <strong>GCP图标</strong>
<strong>chat application</strong>. Use GCP架构图
connected diagram for data ingestion
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 flex items-center justify-center w-full h-[400px]"> <Image
<Image src="/gcp_demo.svg"
src="/rag_prod.svg" alt="GCP架构图"
alt="RAG架构图" width={400}
width={480} height={300}
height={360} className="mx-auto"
className="max-w-full max-h-full object-contain" />
/>
</div>
</div> </div>
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
React和AWS认证流程 AWS架构图
</h3> </h3>
<p className="text-gray-600 text-sm mb-4"> <p className="text-gray-600 text-sm mb-4">
<strong>Prompt:</strong> Generate <strong></strong> 使
authentication process using React with{" "} <strong>AWS图标</strong>
<strong>AWS</strong>. Use Serverless AWS架构图
architecture.
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 flex items-center justify-center w-full h-[400px]"> <Image
<Image src="/aws_demo.svg"
src="/auth.svg" alt="AWS架构图"
alt="认证架构图" width={400}
width={480} height={300}
height={360} className="mx-auto"
className="max-w-full max-h-full object-contain" />
/>
</div>
</div> </div>
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
Scrum流程 Azure架构图
</h3> </h3>
<p className="text-gray-600 text-sm mb-4"> <p className="text-gray-600 text-sm mb-4">
<strong>Prompt:</strong> Generate agile <strong></strong> 使
scrum workflow diagram for software <strong>Azure图标</strong>
development team. Azure架构图
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 flex items-center justify-center w-full h-[400px]"> <Image
<Image src="/azure_demo.svg"
src="/agile_scrum.svg" alt="Azure架构图"
alt="敏捷Scrum流程图" width={400}
width={480} height={300}
height={360} className="mx-auto"
className="max-w-full max-h-full object-contain" />
/>
</div>
</div> </div>
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
</h3> </h3>
<p className="text-gray-600 text-sm mb-4"> <p className="text-gray-600 text-sm mb-4">
<strong>Prompt:</strong> Create <strong></strong>{" "}
visualization of Henry Chesbrough&apos;s
Open Innovation model.
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 flex items-center justify-center w-full h-[400px]"> <Image
<Image src="/cat_demo.svg"
src="/inno.svg" alt="猫咪绘图"
alt="开放式创新图" width={240}
width={480} height={240}
height={360} className="mx-auto"
className="max-w-full max-h-full object-contain" />
/>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@@ -168,106 +168,93 @@ export default function AboutJA() {
</p> </p>
<div className="space-y-8"> <div className="space-y-8">
{/* ResNet50 Architecture */} {/* Animated Transformer */}
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
ResNet50モデルアーキテクチャアニメーション Transformerコネクタ
</h3> </h3>
<p className="text-gray-600 mb-4"> <p className="text-gray-600 mb-4">
<strong>Prompt:</strong> Give me an{" "} <strong></strong>{" "}
<strong>animated</strong> architecture diagram <strong></strong>
of the ResNet50 model. Transformerアーキテクチャ図を作成してください
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 inline-block"> <Image
<Image src="/animated_connectors.svg"
src="/resnet50.svg" alt="アニメーションコネクタ付きTransformerアーキテクチャ"
alt="ResNet50モデルアーキテクチャ図" width={480}
width={480} height={360}
height={360} className="mx-auto"
className="mx-auto" />
/>
</div>
</div> </div>
{/* Diagram Grid */} {/* Cloud Architecture Grid */}
<div className="grid md:grid-cols-2 gap-6"> <div className="grid md:grid-cols-2 gap-6">
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
RAG技術ダイアグラム GCPアーキテクチャ図
</h3> </h3>
<p className="text-gray-600 text-sm mb-4"> <p className="text-gray-600 text-sm mb-4">
<strong>Prompt:</strong> Generate a RAG <strong></strong>{" "}
architecture diagram for{" "} <strong>GCPアイコン</strong>
<strong>chat application</strong>. Use 使GCPアーキテクチャ図を生成してください
connected diagram for data ingestion
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 flex items-center justify-center w-full h-[400px]"> <Image
<Image src="/gcp_demo.svg"
src="/rag_prod.svg" alt="GCPアーキテクチャ図"
alt="RAGアーキテクチャ図" width={400}
width={480} height={300}
height={360} className="mx-auto"
className="max-w-full max-h-full object-contain" />
/>
</div>
</div> </div>
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
ReactとAWSによる認証 AWSアーキテクチャ図
</h3> </h3>
<p className="text-gray-600 text-sm mb-4"> <p className="text-gray-600 text-sm mb-4">
<strong>Prompt:</strong> Generate <strong></strong>{" "}
authentication process using React with{" "} <strong>AWSアイコン</strong>
<strong>AWS</strong>. Use Serverless 使AWSアーキテクチャ図を生成してください
architecture.
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 flex items-center justify-center w-full h-[400px]"> <Image
<Image src="/aws_demo.svg"
src="/auth.svg" alt="AWSアーキテクチャ図"
alt="認証アーキテクチャ図" width={400}
width={480} height={300}
height={360} className="mx-auto"
className="max-w-full max-h-full object-contain" />
/>
</div>
</div> </div>
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
Azureアーキテクチャ図
</h3> </h3>
<p className="text-gray-600 text-sm mb-4"> <p className="text-gray-600 text-sm mb-4">
<strong>Prompt:</strong> Generate agile <strong></strong>{" "}
scrum workflow diagram for software <strong>Azureアイコン</strong>
development team. 使Azureアーキテクチャ図を生成してください
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 flex items-center justify-center w-full h-[400px]"> <Image
<Image src="/azure_demo.svg"
src="/agile_scrum.svg" alt="Azureアーキテクチャ図"
alt="アジャイルスクラム図" width={400}
width={480} height={300}
height={360} className="mx-auto"
className="max-w-full max-h-full object-contain" />
/>
</div>
</div> </div>
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
</h3> </h3>
<p className="text-gray-600 text-sm mb-4"> <p className="text-gray-600 text-sm mb-4">
<strong>Prompt:</strong> Create <strong></strong>{" "}
visualization of Henry Chesbrough&apos;s
Open Innovation model.
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 flex items-center justify-center w-full h-[400px]"> <Image
<Image src="/cat_demo.svg"
src="/inno.svg" alt="猫の絵"
alt="オープンイノベーション図" width={240}
width={480} height={240}
height={360} className="mx-auto"
className="max-w-full max-h-full object-contain" />
/>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@@ -182,106 +182,96 @@ export default function About() {
</p> </p>
<div className="space-y-8"> <div className="space-y-8">
{/* ResNet50 Architecture */} {/* Animated Transformer */}
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
Animated ResNet50 Model Architecture Animated Transformer Connectors
</h3> </h3>
<p className="text-gray-600 mb-4"> <p className="text-gray-600 mb-4">
<strong>Prompt:</strong> Give me an{" "} <strong>Prompt:</strong> Give me an{" "}
<strong>animated</strong> architecture diagram <strong>animated connector</strong> diagram of
of the ResNet50 model. transformer&apos;s architecture.
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 inline-block"> <Image
<Image src="/animated_connectors.svg"
src="/resnet50.svg" alt="Transformer Architecture with Animated Connectors"
alt="Architecture diagram for ResNet50 model" width={480}
width={480} height={360}
height={360} className="mx-auto"
className="mx-auto" />
/>
</div>
</div> </div>
{/* Diagram Grid */} {/* Cloud Architecture Grid */}
<div className="grid md:grid-cols-2 gap-6"> <div className="grid md:grid-cols-2 gap-6">
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
RAG Technique Diagram GCP Architecture Diagram
</h3> </h3>
<p className="text-gray-600 text-sm mb-4"> <p className="text-gray-600 text-sm mb-4">
<strong>Prompt:</strong> Generate a RAG <strong>Prompt:</strong> Generate a GCP
architecture diagram for{" "} architecture diagram with{" "}
<strong>chat application</strong>. Use <strong>GCP icons</strong>. Users connect to
connected diagram for data ingestion a frontend hosted on an instance.
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 flex items-center justify-center w-full h-[400px]"> <Image
<Image src="/gcp_demo.svg"
src="/rag_prod.svg" alt="GCP Architecture Diagram"
alt="RAG Architecture Diagram" width={400}
width={480} height={300}
height={360} className="mx-auto"
className="max-w-full max-h-full object-contain" />
/>
</div>
</div> </div>
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
Authentication using React and AWS AWS Architecture Diagram
</h3> </h3>
<p className="text-gray-600 text-sm mb-4"> <p className="text-gray-600 text-sm mb-4">
<strong>Prompt:</strong> Generate <strong>Prompt:</strong> Generate an AWS
authentication process using React with{" "} architecture diagram with{" "}
<strong>AWS</strong>. Use Serverless <strong>AWS icons</strong>. Users connect to
architecture. a frontend hosted on an instance.
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 flex items-center justify-center w-full h-[400px]"> <Image
<Image src="/aws_demo.svg"
src="/auth.svg" alt="AWS Architecture Diagram"
alt="Authentication Architecture Diagram" width={400}
width={480} height={300}
height={360} className="mx-auto"
className="max-w-full max-h-full object-contain" />
/>
</div>
</div> </div>
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
Agile Scrum Process Azure Architecture Diagram
</h3> </h3>
<p className="text-gray-600 text-sm mb-4"> <p className="text-gray-600 text-sm mb-4">
<strong>Prompt:</strong> Generate agile <strong>Prompt:</strong> Generate an Azure
scrum workflow diagram for software architecture diagram with{" "}
development team. <strong>Azure icons</strong>. Users connect
to a frontend hosted on an instance.
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 flex items-center justify-center w-full h-[400px]"> <Image
<Image src="/azure_demo.svg"
src="/agile_scrum.svg" alt="Azure Architecture Diagram"
alt="Agile Scrum Diagram" width={400}
width={480} height={300}
height={360} className="mx-auto"
className="max-w-full max-h-full object-contain" />
/>
</div>
</div> </div>
<div className="text-center"> <div className="text-center">
<h3 className="text-lg font-semibold text-gray-900 mb-2"> <h3 className="text-lg font-semibold text-gray-900 mb-2">
Open Innovation Cat Sketch
</h3> </h3>
<p className="text-gray-600 text-sm mb-4"> <p className="text-gray-600 text-sm mb-4">
<strong>Prompt:</strong> Create <strong>Prompt:</strong> Draw a cute cat for
visualization of Henry Chesbrough&apos;s me.
Open Innovation model.
</p> </p>
<div className="bg-neutral-950 rounded-lg p-4 flex items-center justify-center w-full h-[400px]"> <Image
<Image src="/cat_demo.svg"
src="/inno.svg" alt="Cat Drawing"
alt="Open Innovation Diagram" width={240}
width={480} height={240}
height={360} className="mx-auto"
className="max-w-full max-h-full object-contain" />
/>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@@ -1,65 +0,0 @@
import { getApiEndpoint } from "@/lib/base-path"
import type { ProviderName } from "@/lib/types/model-config"
export const SESSION_PASSWORD_KEY = "next-ai-draw-io-admin-password"
// ── Shared types ─────────────────────────────────────────────────────
export type SecretValue = { isSet: true; hint: string }
export function isSecretValue(v: unknown): v is SecretValue {
return typeof v === "object" && v !== null && "isSet" in v
}
export interface SettingState {
key: string
source: "file" | "env" | "default"
value: string | SecretValue | null
}
export type SettingsMap = Record<string, SettingState>
// Editable text of a saved setting; secrets have none (write-only)
export function savedTextOf(state: SettingState | undefined): string {
return state && !isSecretValue(state.value) ? (state.value ?? "") : ""
}
// Admin provider in client state. Secret fields hold either a masked
// marker (unchanged) or a plaintext string (new value).
export interface AdminProvider {
id: string
provider: ProviderName
name?: string
apiKey?: string | SecretValue
baseUrl?: string
awsAccessKeyId?: string | SecretValue
awsSecretAccessKey?: string | SecretValue
awsRegion?: string
vertexApiKey?: string | SecretValue
models: string[]
isDefault?: boolean
}
// Provider defined in AI_MODELS_CONFIG / ai-models.json — shown read-only
export interface EnvProvider {
name: string
provider: ProviderName
models: string[]
isDefault: boolean
}
export async function adminFetch(path: string, pw: string, init?: RequestInit) {
const res = await fetch(getApiEndpoint(path), {
...init,
headers: {
...init?.headers,
"x-admin-password": pw,
...(init?.body ? { "Content-Type": "application/json" } : {}),
},
})
const data = await res.json().catch(() => ({}))
if (!res.ok) {
throw new Error(data.error || `Request failed (${res.status})`)
}
return data
}

View File

@@ -1,609 +0,0 @@
import {
AlertCircle,
Check,
Loader2,
Plus,
Star,
Trash2,
X,
Zap,
} from "lucide-react"
import { useState } from "react"
import { ProviderCredentialsFields } from "@/components/provider-credentials-fields"
import { ProviderLogo } from "@/components/provider-logo"
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
} from "@/components/ui/alert-dialog"
import { Button } from "@/components/ui/button"
import { Input } from "@/components/ui/input"
import { Label } from "@/components/ui/label"
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
} from "@/components/ui/select"
import { Switch } from "@/components/ui/switch"
import { useDictionary } from "@/hooks/use-dictionary"
import { formatMessage } from "@/lib/i18n/utils"
import {
FIXED_CRED_PROVIDERS,
PROVIDER_INFO,
type ProviderName,
SUGGESTED_MODELS,
} from "@/lib/types/model-config"
import { cn } from "@/lib/utils"
import {
type AdminProvider,
adminFetch,
type EnvProvider,
} from "./admin-shared"
import { SecretInput } from "./setting-field"
// ── Models section (mirrors the user ModelConfigDialog) ──────────────
function ProviderDetail({
provider,
disabled,
password,
onUpdate,
onDelete,
}: {
provider: AdminProvider
disabled: boolean
password: string
onUpdate: (patch: Partial<AdminProvider>) => void
onDelete: () => void
}) {
const dict = useDictionary()
const [modelInput, setModelInput] = useState("")
const [deleteOpen, setDeleteOpen] = useState(false)
const [testing, setTesting] = useState<string | null>(null)
const [testResults, setTestResults] = useState<
Record<string, { ok: boolean; message: string }>
>({})
const info = PROVIDER_INFO[provider.provider]
const suggestions = (SUGGESTED_MODELS[provider.provider] || []).filter(
(m) => !provider.models.includes(m),
)
const addModel = (modelId: string) => {
const trimmed = modelId.trim()
if (!trimmed || provider.models.includes(trimmed)) return
onUpdate({ models: [...provider.models, trimmed] })
setModelInput("")
}
const testModel = async (modelId: string) => {
setTesting(modelId)
try {
const data = await adminFetch("/api/admin/test-model", password, {
method: "POST",
body: JSON.stringify({ provider, modelId }),
})
setTestResults((prev) => ({
...prev,
[modelId]: data.valid
? {
ok: true,
message: formatMessage(dict.admin.testOk, {
ms: data.responseTime,
}),
}
: {
ok: false,
message: data.error || dict.admin.testFailed,
},
}))
} catch (err) {
setTestResults((prev) => ({
...prev,
[modelId]: {
ok: false,
message:
err instanceof Error
? err.message
: dict.admin.testFailed,
},
}))
} finally {
setTesting(null)
}
}
return (
<div className="space-y-6">
<div className="flex items-center gap-3">
<div className="flex h-10 w-10 items-center justify-center rounded-lg bg-muted">
<ProviderLogo
provider={provider.provider}
className="size-5"
/>
</div>
<div className="min-w-0 flex-1">
<h3 className="font-semibold">{info.label}</h3>
<p className="text-xs text-muted-foreground">
{provider.models.length === 0
? dict.admin.noModelsConfigured
: formatMessage(
provider.models.length === 1
? dict.admin.modelCount
: dict.admin.modelCountPlural,
{ count: provider.models.length },
)}
</p>
</div>
<label className="flex cursor-pointer items-center gap-1.5 text-xs text-muted-foreground">
<Star
className={cn(
"h-3.5 w-3.5",
provider.isDefault &&
"fill-amber-400 text-amber-400",
)}
aria-hidden="true"
/>
{dict.admin.default}
<Switch
checked={!!provider.isDefault}
disabled={disabled}
aria-label={dict.admin.setAsDefault}
onCheckedChange={(checked) =>
onUpdate({ isDefault: checked })
}
/>
</label>
<Button
type="button"
variant="ghost"
size="sm"
disabled={disabled}
className="text-destructive hover:bg-destructive/10 hover:text-destructive"
onClick={() => setDeleteOpen(true)}
>
<Trash2 className="mr-1.5 h-4 w-4" aria-hidden="true" />
{dict.admin.delete}
</Button>
</div>
{/* Credentials (shared with the user ModelConfigDialog) */}
<ProviderCredentialsFields
provider={provider.provider}
name={provider.name}
baseUrl={provider.baseUrl}
awsRegion={provider.awsRegion}
disabled={disabled}
onChange={(field, value) => onUpdate({ [field]: value })}
renderSecret={({ field, id }) => (
// Bare id keeps the shared component's <Label htmlFor={id}>
// associated; only one ProviderDetail is mounted at a time.
<SecretInput
id={id}
keepOnEmpty
value={provider[field]}
disabled={disabled}
onChange={(v) => onUpdate({ [field]: v })}
/>
)}
/>
{/* Models */}
<div>
<div className="mb-2 flex flex-wrap items-center justify-between gap-2">
<Label className="text-xs font-medium uppercase tracking-wider text-muted-foreground">
{dict.admin.models}
</Label>
<div className="flex items-center gap-1.5">
<Input
value={modelInput}
disabled={disabled}
placeholder={dict.admin.modelIdPlaceholder}
spellCheck={false}
className="h-8 w-48 font-mono text-xs"
onChange={(e) => setModelInput(e.target.value)}
onKeyDown={(e) => {
if (e.key === "Enter") addModel(modelInput)
}}
/>
<Button
type="button"
variant="outline"
size="sm"
className="h-8"
disabled={disabled || !modelInput.trim()}
aria-label={dict.admin.addModel}
onClick={() => addModel(modelInput)}
>
<Plus className="h-3.5 w-3.5" aria-hidden="true" />
</Button>
{suggestions.length > 0 && (
<Select
disabled={disabled}
onValueChange={(v) => addModel(v)}
>
<SelectTrigger className="h-8 w-28 text-xs">
{dict.admin.suggested}
</SelectTrigger>
<SelectContent className="max-h-72">
{suggestions.map((m) => (
<SelectItem
key={m}
value={m}
className="font-mono text-xs"
>
{m}
</SelectItem>
))}
</SelectContent>
</Select>
)}
</div>
</div>
<div className="overflow-hidden rounded-lg border">
{provider.models.length === 0 ? (
<p className="p-5 text-center text-sm text-muted-foreground">
{dict.admin.addProviderToOfferModels}
</p>
) : (
<ul className="divide-y">
{provider.models.map((modelId, index) => {
const result = testResults[modelId]
return (
<li
key={modelId}
className="flex items-center gap-2 px-3 py-2"
>
<span className="min-w-0 flex-1 truncate font-mono text-xs">
{modelId}
{provider.isDefault &&
index === 0 && (
<span className="ml-2 rounded bg-amber-500/10 px-1.5 py-0.5 text-[10px] font-medium uppercase text-amber-600 dark:text-amber-400">
{
dict.admin
.defaultModel
}
</span>
)}
</span>
{result && (
<span
className={cn(
"flex items-center gap-1 text-xs",
result.ok
? "text-green-600 dark:text-green-400"
: "text-destructive",
)}
>
{result.ok ? (
<Check
className="h-3.5 w-3.5"
aria-hidden="true"
/>
) : (
<AlertCircle
className="h-3.5 w-3.5"
aria-hidden="true"
/>
)}
<span className="max-w-48 truncate">
{result.message}
</span>
</span>
)}
<Button
type="button"
variant="ghost"
size="sm"
className="h-7 px-2 text-xs"
disabled={
disabled || testing !== null
}
onClick={() =>
void testModel(modelId)
}
>
{testing === modelId ? (
<Loader2
className="h-3.5 w-3.5 animate-spin motion-reduce:animate-none"
aria-hidden="true"
/>
) : (
<Zap
className="h-3.5 w-3.5"
aria-hidden="true"
/>
)}
<span className="ml-1">
{dict.admin.test}
</span>
</Button>
<Button
type="button"
variant="ghost"
size="icon"
className="h-7 w-7"
disabled={disabled}
aria-label={formatMessage(
dict.admin.removeModel,
{ model: modelId },
)}
onClick={() =>
onUpdate({
models: provider.models.filter(
(m) => m !== modelId,
),
})
}
>
<X
className="h-3.5 w-3.5"
aria-hidden="true"
/>
</Button>
</li>
)
})}
</ul>
)}
</div>
</div>
<AlertDialog open={deleteOpen} onOpenChange={setDeleteOpen}>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>
{formatMessage(dict.admin.deleteProviderTitle, {
name: provider.name || info.label,
})}
</AlertDialogTitle>
<AlertDialogDescription>
{dict.admin.deleteProviderDesc}
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>
{dict.admin.cancel}
</AlertDialogCancel>
<AlertDialogAction
className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
onClick={() => {
setDeleteOpen(false)
onDelete()
}}
>
{dict.admin.delete}
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</div>
)
}
export function ModelsSection({
providers,
envProviders,
disabled,
password,
onChange,
}: {
providers: AdminProvider[]
envProviders: EnvProvider[]
disabled: boolean
password: string
onChange: (providers: AdminProvider[]) => void
}) {
const dict = useDictionary()
const [selectedId, setSelectedId] = useState<string | null>(
providers[0]?.id ?? null,
)
const selected = providers.find((p) => p.id === selectedId)
const selectedEnv = envProviders.find((p) => `env:${p.name}` === selectedId)
const addProvider = (provider: ProviderName) => {
const newProvider: AdminProvider = {
id: crypto.randomUUID(),
provider,
models: [],
isDefault: providers.length === 0,
}
onChange([...providers, newProvider])
setSelectedId(newProvider.id)
}
const updateProvider = (id: string, patch: Partial<AdminProvider>) => {
onChange(
providers.map((p) => {
if (p.id !== id) {
// Only one default at a time
return patch.isDefault ? { ...p, isDefault: false } : p
}
return { ...p, ...patch }
}),
)
}
const deleteProvider = (id: string) => {
const next = providers.filter((p) => p.id !== id)
onChange(next)
setSelectedId(next[0]?.id ?? null)
}
return (
<div className="flex min-h-72 flex-col sm:flex-row">
{/* Provider list */}
<div className="flex w-full shrink-0 flex-col border-b sm:w-52 sm:border-b-0 sm:border-r">
<div className="flex-1 space-y-1 p-2">
{providers.length === 0 && envProviders.length === 0 && (
<p className="px-2 py-6 text-center text-xs text-muted-foreground">
{dict.admin.addProviderHint}
</p>
)}
{envProviders.map((p) => (
<button
key={`env:${p.name}`}
type="button"
onClick={() => setSelectedId(`env:${p.name}`)}
className={cn(
"flex w-full items-center gap-2 rounded-md px-2.5 py-2 text-left text-sm hover:bg-muted/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
selectedId === `env:${p.name}` &&
"bg-muted font-medium",
)}
>
<ProviderLogo provider={p.provider} />
<span className="min-w-0 flex-1 truncate">
{p.name}
</span>
<span className="rounded bg-muted px-1 py-0.5 text-[10px] font-medium uppercase text-muted-foreground">
{dict.admin.sourceEnv}
</span>
{p.isDefault && (
<Star
className="h-3.5 w-3.5 shrink-0 fill-amber-400 text-amber-400"
aria-label={dict.admin.defaultProvider}
/>
)}
</button>
))}
{providers.map((p) => (
<button
key={p.id}
type="button"
onClick={() => setSelectedId(p.id)}
className={cn(
"flex w-full items-center gap-2 rounded-md px-2.5 py-2 text-left text-sm hover:bg-muted/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
selectedId === p.id && "bg-muted font-medium",
)}
>
<ProviderLogo provider={p.provider} />
<span className="min-w-0 flex-1 truncate">
{p.name || PROVIDER_INFO[p.provider].label}
</span>
{p.isDefault && (
<Star
className="h-3.5 w-3.5 shrink-0 fill-amber-400 text-amber-400"
aria-label={dict.admin.defaultProvider}
/>
)}
</button>
))}
</div>
<div className="border-t p-2">
<Select
disabled={disabled}
onValueChange={(v) => addProvider(v as ProviderName)}
>
<SelectTrigger className="w-full">
<Plus
className="mr-1 h-4 w-4 text-muted-foreground"
aria-hidden="true"
/>
{dict.modelConfig.addProvider}
</SelectTrigger>
<SelectContent className="max-h-72">
{(Object.keys(PROVIDER_INFO) as ProviderName[]).map(
(p) => {
// Global-credential providers already in
// the env config can't be added here —
// panel credentials would override theirs
const envBlocked =
FIXED_CRED_PROVIDERS.includes(p) &&
envProviders.some(
(e) => e.provider === p,
)
return (
<SelectItem
key={p}
value={p}
disabled={envBlocked}
>
<div className="flex items-center gap-2">
<ProviderLogo provider={p} />
{PROVIDER_INFO[p].label}
{envBlocked && (
<span className="text-xs text-muted-foreground">
{
dict.admin
.managedViaEnv
}
</span>
)}
</div>
</SelectItem>
)
},
)}
</SelectContent>
</Select>
</div>
</div>
{/* Detail */}
<div className="min-w-0 flex-1 p-4">
{selected ? (
<ProviderDetail
key={selected.id}
provider={selected}
disabled={disabled}
password={password}
onUpdate={(patch) => updateProvider(selected.id, patch)}
onDelete={() => deleteProvider(selected.id)}
/>
) : selectedEnv ? (
<div className="space-y-4">
<div className="flex items-center gap-3">
<div className="flex h-10 w-10 items-center justify-center rounded-lg bg-muted">
<ProviderLogo
provider={selectedEnv.provider}
className="size-5"
/>
</div>
<div className="min-w-0 flex-1">
<h3 className="font-semibold">
{selectedEnv.name}
</h3>
<p className="text-xs text-muted-foreground">
{dict.admin.envReadOnly}
</p>
</div>
</div>
<div className="overflow-hidden rounded-lg border">
<ul className="divide-y">
{selectedEnv.models.map((modelId, index) => (
<li
key={modelId}
className="flex items-center gap-2 px-3 py-2"
>
<span className="min-w-0 flex-1 truncate font-mono text-xs">
{modelId}
{selectedEnv.isDefault &&
index === 0 && (
<span className="ml-2 rounded bg-amber-500/10 px-1.5 py-0.5 text-[10px] font-medium uppercase text-amber-600 dark:text-amber-400">
{
dict.admin
.defaultModel
}
</span>
)}
</span>
</li>
))}
</ul>
</div>
</div>
) : (
<p className="py-12 text-center text-sm text-muted-foreground">
{dict.admin.selectProviderHint}
</p>
)}
</div>
</div>
)
}

View File

@@ -1,610 +0,0 @@
"use client"
import {
AlertTriangle,
Check,
Loader2,
LockKeyhole,
ShieldCheck,
} from "lucide-react"
import { useCallback, useEffect, useState } from "react"
import { Button } from "@/components/ui/button"
import { Input } from "@/components/ui/input"
import { Label } from "@/components/ui/label"
import { Switch } from "@/components/ui/switch"
import { useDictionary } from "@/hooks/use-dictionary"
import {
SETTING_GROUPS,
SETTINGS_BY_GROUP,
} from "@/lib/admin/settings-registry"
import { getApiEndpoint } from "@/lib/base-path"
import { formatMessage } from "@/lib/i18n/utils"
import { cn } from "@/lib/utils"
import {
type AdminProvider,
adminFetch,
type EnvProvider,
isSecretValue,
SESSION_PASSWORD_KEY,
type SettingState,
type SettingsMap,
savedTextOf,
} from "./admin-shared"
import { ModelsSection } from "./models-section"
import { SettingField } from "./setting-field"
// ── Page ─────────────────────────────────────────────────────────────
const NAV_GROUP_IDS = ["models", ...SETTING_GROUPS.map((g) => g.id)]
export default function AdminPage() {
const dict = useDictionary()
// Localized group title/description, keyed by group id
const groupText = (id: string) =>
(
dict.admin.groups as Record<
string,
{ title: string; description: string } | undefined
>
)[id]
const navItems = NAV_GROUP_IDS.map((id) => ({
id,
title:
id === "models" ? dict.admin.models : (groupText(id)?.title ?? id),
}))
const [password, setPassword] = useState("")
const [authedPassword, setAuthedPassword] = useState<string | null>(null)
const [authError, setAuthError] = useState("")
const [authLoading, setAuthLoading] = useState(false)
const [writable, setWritable] = useState(true)
// Models section state
const [providers, setProviders] = useState<AdminProvider[]>([])
const [envProviders, setEnvProviders] = useState<EnvProvider[]>([])
const [savedProviders, setSavedProviders] = useState<string>("[]")
const providersDirty = JSON.stringify(providers) !== savedProviders
// General settings state
const [settings, setSettings] = useState<SettingsMap>({})
const [pending, setPending] = useState<Record<string, string | null>>({})
const [errors, setErrors] = useState<Record<string, string>>({})
const [enabledGroups, setEnabledGroups] = useState<Record<string, boolean>>(
{},
)
const [saving, setSaving] = useState(false)
const [saveMessage, setSaveMessage] = useState<{
ok: boolean
text: string
} | null>(null)
const [activeGroup, setActiveGroup] = useState("models")
const dirtyCount = Object.keys(pending).length + (providersDirty ? 1 : 0)
const applySettingsResponse = useCallback(
(data: { writable: boolean; settings: SettingState[] }) => {
setWritable(data.writable)
const map: SettingsMap = {}
for (const s of data.settings) map[s.key] = s
setSettings(map)
// Seed each toggle once from whether the group has configured
// values; don't stomp a user's explicit toggle on later saves
setEnabledGroups((prev) => {
const next = { ...prev }
for (const group of SETTING_GROUPS) {
if (!group.toggleable || group.id in next) continue
next[group.id] = !!SETTINGS_BY_GROUP.get(group.id)?.some(
(d) => map[d.key]?.source !== "default",
)
}
return next
})
},
[],
)
const applyProvidersResponse = useCallback(
(data: {
providers: AdminProvider[]
envProviders?: EnvProvider[]
}) => {
setProviders(data.providers)
setSavedProviders(JSON.stringify(data.providers))
setEnvProviders(data.envProviders ?? [])
},
[],
)
const login = useCallback(
async (pw: string) => {
setAuthLoading(true)
setAuthError("")
try {
const [settingsData, providersData] = await Promise.all([
adminFetch("/api/admin/settings", pw),
adminFetch("/api/admin/providers", pw),
])
applySettingsResponse(settingsData)
applyProvidersResponse(providersData)
setAuthedPassword(pw)
sessionStorage.setItem(SESSION_PASSWORD_KEY, pw)
} catch (err) {
setAuthError(
err instanceof Error ? err.message : dict.admin.loginFailed,
)
} finally {
setAuthLoading(false)
}
},
[applySettingsResponse, applyProvidersResponse, dict],
)
// Restore session on mount
useEffect(() => {
const stored = sessionStorage.getItem(SESSION_PASSWORD_KEY)
if (stored) void login(stored)
}, [login])
// Warn before leaving with unsaved changes
const hasDirty = dirtyCount > 0
useEffect(() => {
if (!hasDirty) return
const handler = (e: BeforeUnloadEvent) => {
e.preventDefault()
// Some browsers only show the prompt when returnValue is set
e.returnValue = ""
}
window.addEventListener("beforeunload", handler)
return () => window.removeEventListener("beforeunload", handler)
}, [hasDirty])
// Highlight the section currently in view in the sidebar
useEffect(() => {
if (!authedPassword) return
const observer = new IntersectionObserver(
(entries) => {
const visible = entries
.filter((e) => e.isIntersecting)
.sort(
(a, b) =>
a.boundingClientRect.top - b.boundingClientRect.top,
)
if (visible[0]) setActiveGroup(visible[0].target.id)
},
{ rootMargin: "-10% 0px -50% 0px" },
)
for (const id of NAV_GROUP_IDS) {
const el = document.getElementById(id)
if (el) observer.observe(el)
}
return () => observer.disconnect()
}, [authedPassword])
const handleChange = useCallback(
(key: string, value: string | null) => {
setSaveMessage(null)
setErrors((prev) => {
if (!(key in prev)) return prev
const next = { ...prev }
delete next[key]
return next
})
setPending((prev) => {
const state = settings[key]
const isRevert =
value !== null &&
state?.source === "file" &&
!isSecretValue(state?.value) &&
value === savedTextOf(state)
const isNoop =
value === "" &&
(!state || state.source !== "file") &&
!isSecretValue(state?.value)
if (isRevert || isNoop) {
const next = { ...prev }
delete next[key]
return next
}
return { ...prev, [key]: value === "" ? null : value }
})
},
[settings],
)
// Toggling a group off stages deletion of its saved values so the
// feature actually turns off on save; toggling on drops those deletions.
const handleGroupToggle = useCallback(
(groupId: string, enabled: boolean) => {
setSaveMessage(null)
setEnabledGroups((prev) => ({ ...prev, [groupId]: enabled }))
const keys = (SETTINGS_BY_GROUP.get(groupId) ?? []).map(
(d) => d.key,
)
setPending((prev) => {
const next = { ...prev }
for (const key of keys) {
if (!enabled) {
// Stage deletion only for values currently set
if (settings[key]?.source !== "default")
next[key] = null
} else if (next[key] === null) {
delete next[key]
}
}
return next
})
},
[settings],
)
const handleSave = useCallback(async () => {
if (!authedPassword || dirtyCount === 0) return
setSaving(true)
setSaveMessage(null)
setErrors({})
try {
if (providersDirty) {
const data = await adminFetch(
"/api/admin/providers",
authedPassword,
{ method: "PUT", body: JSON.stringify({ providers }) },
)
applyProvidersResponse(data)
}
if (Object.keys(pending).length > 0) {
const res = await fetch(getApiEndpoint("/api/admin/settings"), {
method: "PUT",
headers: {
"Content-Type": "application/json",
"x-admin-password": authedPassword,
},
body: JSON.stringify({ values: pending }),
})
const data = await res.json().catch(() => ({}))
if (!res.ok) {
// Per-field validation errors come back as {errors: {...}}
if (data.errors) {
setErrors(data.errors)
const firstKey = Object.keys(data.errors)[0]
document.getElementById(`setting-${firstKey}`)?.focus()
throw new Error(dict.admin.invalidSettings)
}
throw new Error(
data.error || `Request failed (${res.status})`,
)
}
applySettingsResponse(data)
setPending({})
}
setSaveMessage({
ok: true,
text: dict.admin.saved,
})
setTimeout(() => setSaveMessage(null), 4000)
} catch (err) {
setSaveMessage({
ok: false,
text:
err instanceof Error ? err.message : dict.admin.saveFailed,
})
} finally {
setSaving(false)
}
}, [
authedPassword,
pending,
providers,
providersDirty,
dirtyCount,
applySettingsResponse,
applyProvidersResponse,
dict,
])
// ── Login screen ─────────────────────────────────────────────────
if (!authedPassword) {
return (
<div className="flex min-h-screen items-center justify-center bg-background p-4">
<form
className="w-full max-w-sm space-y-4 rounded-lg border bg-card p-6 shadow-sm"
onSubmit={(e) => {
e.preventDefault()
void login(password)
}}
>
<div className="flex items-center gap-2">
<LockKeyhole
className="h-5 w-5 text-muted-foreground"
aria-hidden="true"
/>
<h1 className="text-lg font-semibold">
{dict.admin.title}
</h1>
</div>
<p className="text-sm text-muted-foreground">
{dict.admin.loginPrompt}
</p>
<div className="space-y-1.5">
<Label htmlFor="admin-password">
{dict.admin.password}
</Label>
<Input
id="admin-password"
name="admin-password"
type="password"
value={password}
autoComplete="current-password"
spellCheck={false}
onChange={(e) => setPassword(e.target.value)}
/>
</div>
<p
className={cn(
"text-sm text-destructive",
!authError && "sr-only",
)}
aria-live="polite"
>
{authError}
</p>
<Button
type="submit"
className="w-full"
disabled={authLoading}
>
{authLoading ? (
<>
<Loader2
className="mr-2 h-4 w-4 animate-spin motion-reduce:animate-none"
aria-hidden="true"
/>
{dict.admin.signingIn}
</>
) : (
dict.admin.signIn
)}
</Button>
</form>
</div>
)
}
// ── Settings screen ──────────────────────────────────────────────
return (
<div className="min-h-screen bg-background">
<header className="sticky top-0 z-20 border-b bg-background/95 backdrop-blur">
<div className="mx-auto flex max-w-6xl items-center justify-between px-4 py-3">
<div className="flex items-center gap-2">
<ShieldCheck
className="h-5 w-5 text-primary"
aria-hidden="true"
/>
<h1 className="text-lg font-semibold">
{dict.admin.title}
</h1>
</div>
<p className="text-xs text-muted-foreground">
{dict.admin.precedence}
</p>
</div>
</header>
{!writable && (
<div className="border-b bg-amber-500/10">
<div className="mx-auto flex max-w-6xl items-center gap-2 px-4 py-3 text-sm text-amber-700 dark:text-amber-400">
<AlertTriangle
className="h-4 w-4 shrink-0"
aria-hidden="true"
/>
{dict.admin.notWritable}
</div>
</div>
)}
<div className="mx-auto flex max-w-6xl gap-8 px-4 py-6">
<nav
aria-label={dict.admin.settingGroups}
className="sticky top-20 hidden h-fit w-44 shrink-0 md:block"
>
<ul className="space-y-1">
{navItems.map((item) => (
<li key={item.id}>
<a
href={`#${item.id}`}
aria-current={
activeGroup === item.id
? "true"
: undefined
}
className={cn(
"block rounded-md px-3 py-1.5 text-sm hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
activeGroup === item.id
? "bg-muted font-medium text-foreground"
: "text-muted-foreground",
)}
>
{item.title}
</a>
</li>
))}
</ul>
</nav>
<main className="min-w-0 flex-1 pb-24">
{/* Models section */}
<section aria-labelledby="models" className="mb-10">
<h2
id="models"
className="scroll-mt-20 text-base font-semibold"
>
{dict.admin.models}
</h2>
<p className="mb-3 mt-1 text-sm text-muted-foreground text-pretty">
{dict.admin.modelsDescription}
</p>
<div className="overflow-hidden rounded-lg border bg-card">
<ModelsSection
providers={providers}
envProviders={envProviders}
disabled={!writable || saving}
password={authedPassword}
onChange={(next) => {
setSaveMessage(null)
setProviders(next)
}}
/>
</div>
</section>
{/* Registry-driven groups */}
{SETTING_GROUPS.map((group) => {
const defs = SETTINGS_BY_GROUP.get(group.id) ?? []
const groupOff =
group.toggleable && !enabledGroups[group.id]
const fieldsDisabled = !writable || saving || !!groupOff
const gt = groupText(group.id)
const title = gt?.title ?? group.title
return (
<section
key={group.id}
aria-labelledby={group.id}
className="mb-10"
>
<div className="flex items-center justify-between gap-4">
<h2
id={group.id}
className="scroll-mt-20 text-base font-semibold"
>
{title}
</h2>
{group.toggleable && (
<label
className={cn(
"flex cursor-pointer items-center gap-2 rounded-full border px-3 py-1.5 text-xs font-medium transition-colors motion-reduce:transition-none",
enabledGroups[group.id]
? "border-primary/30 bg-primary/5 text-primary"
: "border-border bg-muted/50 text-muted-foreground hover:border-foreground/30 hover:text-foreground",
)}
>
{enabledGroups[group.id]
? dict.admin.enabled
: dict.admin.disabled}
<Switch
checked={
!!enabledGroups[group.id]
}
disabled={!writable || saving}
aria-label={formatMessage(
dict.admin.enableGroup,
{ group: title },
)}
onCheckedChange={(checked) =>
handleGroupToggle(
group.id,
checked,
)
}
/>
</label>
)}
</div>
<p className="mb-3 mt-1 text-sm text-muted-foreground text-pretty">
{gt?.description ?? group.description}
</p>
<div
className={cn(
"rounded-lg border bg-card px-4",
groupOff &&
"pointer-events-none opacity-50",
)}
>
{defs.map((def) => (
<SettingField
key={def.key}
def={def}
state={settings[def.key]}
pendingValue={pending[def.key]}
error={errors[def.key]}
disabled={fieldsDisabled}
onChange={(v) =>
handleChange(def.key, v)
}
/>
))}
</div>
</section>
)
})}
</main>
</div>
{/* Always-mounted live region so save results are announced */}
<p aria-live="polite" className="sr-only">
{saveMessage?.text ?? ""}
</p>
{(dirtyCount > 0 || saveMessage) && (
<div className="fixed inset-x-0 bottom-0 z-30 border-t bg-background/95 backdrop-blur">
<div className="mx-auto flex max-w-6xl items-center justify-between gap-4 px-4 py-3">
<p
className={cn(
"flex min-w-0 items-center gap-1.5 truncate text-sm",
saveMessage?.ok
? "text-green-600 dark:text-green-400"
: saveMessage
? "text-destructive"
: "text-muted-foreground",
)}
>
{saveMessage?.ok && (
<Check
className="h-4 w-4 shrink-0"
aria-hidden="true"
/>
)}
{saveMessage && !saveMessage.ok
? saveMessage.text
: dirtyCount > 0
? dict.admin.unsavedChanges
: saveMessage?.text}
</p>
{dirtyCount > 0 && (
<div className="flex shrink-0 gap-2">
<Button
type="button"
variant="outline"
disabled={saving}
onClick={() => {
setPending({})
setErrors({})
setProviders(JSON.parse(savedProviders))
}}
>
{dict.admin.discard}
</Button>
<Button
type="button"
disabled={saving || !writable}
onClick={() => void handleSave()}
>
{saving ? (
<>
<Loader2
className="mr-2 h-4 w-4 animate-spin motion-reduce:animate-none"
aria-hidden="true"
/>
{dict.admin.saving}
</>
) : (
dict.admin.saveChanges
)}
</Button>
</div>
)}
</div>
</div>
)}
</div>
)
}

View File

@@ -1,312 +0,0 @@
import { Eye, EyeOff, X } from "lucide-react"
import { useState } from "react"
import { Button } from "@/components/ui/button"
import { Input } from "@/components/ui/input"
import { Label } from "@/components/ui/label"
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select"
import { Switch } from "@/components/ui/switch"
import { useDictionary } from "@/hooks/use-dictionary"
import type { SettingDef } from "@/lib/admin/settings-registry"
import { formatMessage } from "@/lib/i18n/utils"
import { cn } from "@/lib/utils"
import {
isSecretValue,
type SecretValue,
type SettingState,
savedTextOf,
} from "./admin-shared"
// ── Small shared UI bits ─────────────────────────────────────────────
export function SourceChip({ source }: { source: "file" | "env" | "default" }) {
const dict = useDictionary()
if (source === "default") return null
return (
<span
className={cn(
"rounded px-1.5 py-0.5 text-[10px] font-medium uppercase tracking-wide",
source === "file"
? "bg-primary/10 text-primary"
: "bg-muted text-muted-foreground",
)}
title={
source === "file"
? dict.admin.sourceSavedTitle
: dict.admin.sourceEnvTitle
}
>
{source === "file" ? dict.admin.sourceSaved : dict.admin.sourceEnv}
</span>
)
}
export function RestartBadge() {
const dict = useDictionary()
return (
<span className="rounded bg-amber-500/10 px-1.5 py-0.5 text-[10px] font-medium uppercase tracking-wide text-amber-600 dark:text-amber-400">
{dict.admin.restartRequired}
</span>
)
}
// Secret input: shows masked hint as placeholder, typing replaces.
// With keepOnEmpty, clearing the field reverts to the stored value
// ("keep") instead of deleting it — explicit deletion is via the X button.
export function SecretInput({
id,
value,
disabled,
keepOnEmpty,
onChange,
}: {
id: string
value: string | SecretValue | undefined
disabled?: boolean
keepOnEmpty?: boolean
onChange: (value: string | SecretValue) => void
}) {
const dict = useDictionary()
const [show, setShow] = useState(false)
// The stored marker as it was at mount, to revert to on empty
const [original] = useState(value)
const hadStored = isSecretValue(original)
const text = typeof value === "string" ? value : ""
const placeholder = isSecretValue(value)
? formatMessage(dict.admin.savedReplace, { hint: value.hint })
: dict.admin.notSet
const handleText = (t: string) => {
if (t === "" && keepOnEmpty && hadStored && original) {
onChange(original)
} else {
onChange(t)
}
}
return (
<div className="flex items-center gap-1">
<Input
id={id}
type={show ? "text" : "password"}
value={text}
disabled={disabled}
spellCheck={false}
autoComplete="off"
placeholder={placeholder}
className="h-9 font-mono text-xs"
onChange={(e) => handleText(e.target.value)}
/>
<Button
type="button"
variant="ghost"
size="icon"
className="shrink-0"
aria-label={show ? dict.admin.hideValue : dict.admin.showValue}
onClick={() => setShow((s) => !s)}
>
{show ? (
<EyeOff className="h-4 w-4" aria-hidden="true" />
) : (
<Eye className="h-4 w-4" aria-hidden="true" />
)}
</Button>
{keepOnEmpty && (hadStored || text) && !disabled && (
<Button
type="button"
variant="ghost"
size="icon"
className="shrink-0"
aria-label={dict.admin.removeValue}
title={dict.admin.removeValueTitle}
onClick={() => onChange("")}
>
<X className="h-4 w-4" aria-hidden="true" />
</Button>
)}
</div>
)
}
// ── General settings field (registry-driven) ─────────────────────────
export function SettingField({
def,
state,
pendingValue,
error,
disabled,
onChange,
}: {
def: SettingDef
state: SettingState | undefined
pendingValue: string | null | undefined
error?: string
disabled: boolean
onChange: (value: string | null) => void
}) {
const dict = useDictionary()
const isDirty = pendingValue !== undefined
const source = state?.source ?? "default"
const currentValue = isDirty ? (pendingValue ?? "") : savedTextOf(state)
const secretState = state && isSecretValue(state.value) ? state.value : null
// Localized label/description keyed by env var name, falling back to the
// registry's English (the registry stays canonical for the server).
const t = (
dict.admin.settings as Record<
string,
{ label?: string; description?: string } | undefined
>
)[def.key]
const label = t?.label ?? def.label
const description = t?.description ?? def.description
const inputId = `setting-${def.key}`
const errorId = `${inputId}-error`
let control: React.ReactNode
switch (def.type) {
case "boolean": {
// When unset, reflect the built-in runtime default so the toggle
// matches actual behavior (e.g. ALLOW_PRIVATE_URLS defaults on).
const effective =
currentValue !== "" ? currentValue : (def.default ?? "false")
// A saved boolean can be cleared back to its env/default value.
const canClear =
(isDirty && pendingValue !== null) || source === "file"
control = (
<div className="flex items-center gap-3">
<Switch
id={inputId}
checked={effective === "true"}
disabled={disabled}
onCheckedChange={(checked) =>
onChange(checked ? "true" : "false")
}
/>
{canClear && !disabled && (
<Button
type="button"
variant="ghost"
size="sm"
className="h-7 px-2 text-xs text-muted-foreground"
onClick={() => onChange(null)}
>
{dict.admin.resetToDefault}
</Button>
)}
</div>
)
break
}
case "enum":
control = (
<Select
value={currentValue || undefined}
disabled={disabled}
onValueChange={onChange}
>
<SelectTrigger id={inputId} className="w-full max-w-xs">
<SelectValue placeholder={dict.admin.notSet} />
</SelectTrigger>
<SelectContent>
{def.options?.map((opt) => (
<SelectItem key={opt} value={opt}>
{opt}
</SelectItem>
))}
</SelectContent>
</Select>
)
break
case "secret":
control = (
<div className="w-full max-w-md">
<SecretInput
id={inputId}
value={
isDirty
? (pendingValue ?? "")
: (secretState ?? currentValue)
}
disabled={disabled}
onChange={(v) =>
onChange(typeof v === "string" ? v : "")
}
/>
</div>
)
break
case "number":
control = (
<Input
id={inputId}
type="number"
inputMode="numeric"
min={def.min}
max={def.max}
value={currentValue}
disabled={disabled}
placeholder={def.placeholder ?? dict.admin.notSet}
className="w-full max-w-xs tabular-nums"
aria-invalid={!!error}
aria-describedby={error ? errorId : undefined}
onChange={(e) => onChange(e.target.value)}
/>
)
break
default:
control = (
<Input
id={inputId}
type="text"
value={currentValue}
disabled={disabled}
spellCheck={false}
autoComplete="off"
placeholder={def.placeholder ?? dict.admin.notSet}
className="w-full max-w-md"
aria-invalid={!!error}
aria-describedby={error ? errorId : undefined}
onChange={(e) => onChange(e.target.value)}
/>
)
}
return (
<div className="border-b border-border/60 py-4 last:border-b-0">
<div className="mb-1.5 flex flex-wrap items-center gap-2">
<Label htmlFor={inputId} className="text-sm font-medium">
{label}
</Label>
<SourceChip source={source} />
{def.restartRequired && <RestartBadge />}
{isDirty && (
<span className="rounded bg-blue-500/10 px-1.5 py-0.5 text-[10px] font-medium uppercase tracking-wide text-blue-600 dark:text-blue-400">
{dict.admin.modified}
</span>
)}
</div>
{description && (
<p className="mb-2 max-w-prose text-xs text-muted-foreground">
{description}
</p>
)}
{control}
<p
id={errorId}
className={cn(
"text-xs text-destructive",
error ? "mt-1.5" : "sr-only",
)}
aria-live="polite"
>
{error ?? ""}
</p>
</div>
)
}

View File

@@ -10,8 +10,8 @@ import {
ResizablePanelGroup, ResizablePanelGroup,
} from "@/components/ui/resizable" } from "@/components/ui/resizable"
import { useDiagram } from "@/contexts/diagram-context" import { useDiagram } from "@/contexts/diagram-context"
import { type DrawioTheme, isDrawioTheme } from "@/lib/drawio-themes"
import { i18n, type Locale } from "@/lib/i18n/config" import { i18n, type Locale } from "@/lib/i18n/config"
import { isIndexedDBUsable } from "@/lib/session-storage"
export default function Home() { export default function Home() {
const { const {
@@ -27,11 +27,13 @@ export default function Home() {
const currentLang = (pathname.split("/")[1] || i18n.defaultLocale) as Locale const currentLang = (pathname.split("/")[1] || i18n.defaultLocale) as Locale
const [isMobile, setIsMobile] = useState(false) const [isMobile, setIsMobile] = useState(false)
const [isChatVisible, setIsChatVisible] = useState(true) const [isChatVisible, setIsChatVisible] = useState(true)
const [drawioUi, setDrawioUi] = useState<DrawioTheme>("kennedy") const [drawioUi, setDrawioUi] = useState<"min" | "sketch">("min")
const [darkMode, setDarkMode] = useState(false) const [darkMode, setDarkMode] = useState(false)
const [isLoaded, setIsLoaded] = useState(false) const [isLoaded, setIsLoaded] = useState(false)
const [isDrawioReady, setIsDrawioReady] = useState(false) const [isDrawioReady, setIsDrawioReady] = useState(false)
const [isElectron, setIsElectron] = useState(false) const [isElectron, setIsElectron] = useState(false)
const [canPersist, setCanPersist] = useState(false)
const [canPersistChecked, setCanPersistChecked] = useState(false)
const [drawioBaseUrl, setDrawioBaseUrl] = useState( const [drawioBaseUrl, setDrawioBaseUrl] = useState(
process.env.NEXT_PUBLIC_DRAWIO_BASE_URL || "https://embed.diagrams.net", process.env.NEXT_PUBLIC_DRAWIO_BASE_URL || "https://embed.diagrams.net",
) )
@@ -54,7 +56,7 @@ export default function Home() {
} }
const savedUi = localStorage.getItem("drawio-theme") const savedUi = localStorage.getItem("drawio-theme")
if (isDrawioTheme(savedUi)) { if (savedUi === "min" || savedUi === "sketch") {
setDrawioUi(savedUi) setDrawioUi(savedUi)
} }
@@ -82,6 +84,11 @@ export default function Home() {
setDrawioBaseUrl(`${window.location.origin}/drawio/index.html`) setDrawioBaseUrl(`${window.location.origin}/drawio/index.html`)
} }
void (async () => {
const usable = await isIndexedDBUsable()
setCanPersist(usable)
setCanPersistChecked(true)
})()
setIsLoaded(true) setIsLoaded(true)
}, [pathname, router]) }, [pathname, router])
@@ -90,6 +97,17 @@ export default function Home() {
onDrawioLoad() onDrawioLoad()
}, [onDrawioLoad]) }, [onDrawioLoad])
const handleDrawioAutoSave = useCallback(
(data: { xml?: string }) => {
handleDiagramAutoSave(data)
// Only suppress modified state when persistence is available
if (canPersist) {
drawioRef.current?.status({ message: "", modified: false })
}
},
[canPersist, drawioRef, handleDiagramAutoSave],
)
const handleDarkModeChange = () => { const handleDarkModeChange = () => {
const newValue = !darkMode const newValue = !darkMode
setDarkMode(newValue) setDarkMode(newValue)
@@ -99,9 +117,10 @@ export default function Home() {
resetDrawioReady() resetDrawioReady()
} }
const handleDrawioUiChange = (theme: DrawioTheme) => { const handleDrawioUiChange = () => {
localStorage.setItem("drawio-theme", theme) const newUi = drawioUi === "min" ? "sketch" : "min"
setDrawioUi(theme) localStorage.setItem("drawio-theme", newUi)
setDrawioUi(newUi)
setIsDrawioReady(false) setIsDrawioReady(false)
resetDrawioReady() resetDrawioReady()
} }
@@ -172,7 +191,7 @@ export default function Home() {
}`} }`}
> >
<div className="h-full rounded-xl overflow-hidden shadow-soft-lg border border-border/30 relative"> <div className="h-full rounded-xl overflow-hidden shadow-soft-lg border border-border/30 relative">
{isLoaded && ( {isLoaded && canPersistChecked && (
<div <div
className={`h-full w-full ${isDrawioReady ? "" : "invisible absolute inset-0"}`} className={`h-full w-full ${isDrawioReady ? "" : "invisible absolute inset-0"}`}
> >
@@ -180,19 +199,28 @@ export default function Home() {
key={`${drawioUi}-${darkMode}-${currentLang}-${isElectron}`} key={`${drawioUi}-${darkMode}-${currentLang}-${isElectron}`}
ref={drawioRef} ref={drawioRef}
autosave autosave
onAutoSave={handleDiagramAutoSave} onAutoSave={handleDrawioAutoSave}
onExport={handleDiagramExport} onExport={handleDiagramExport}
onLoad={handleDrawioLoad} onLoad={handleDrawioLoad}
baseUrl={drawioBaseUrl} baseUrl={drawioBaseUrl}
configuration={
canPersist
? { confirmExit: false }
: undefined
}
urlParameters={{ urlParameters={{
ui: drawioUi, ui: drawioUi,
spin: false, spin: false,
libraries: false, libraries: false,
// Disable modified tracking only when persistence is available
...(canPersist && {
modified: false,
keepmodified: false,
}),
saveAndExit: false, saveAndExit: false,
noSaveBtn: true, noSaveBtn: true,
noExitBtn: true, noExitBtn: true,
dark: dark: darkMode,
darkMode || drawioUi === "dark",
lang: currentLang, lang: currentLang,
// Enable offline mode in Electron to disable external service calls // Enable offline mode in Electron to disable external service calls
...(isElectron && { ...(isElectron && {
@@ -240,7 +268,7 @@ export default function Home() {
isVisible={isChatVisible} isVisible={isChatVisible}
onToggleVisibility={toggleChatPanel} onToggleVisibility={toggleChatPanel}
drawioUi={drawioUi} drawioUi={drawioUi}
onDrawioUiChange={handleDrawioUiChange} onToggleDrawioUi={handleDrawioUiChange}
darkMode={darkMode} darkMode={darkMode}
onToggleDarkMode={handleDarkModeChange} onToggleDarkMode={handleDarkModeChange}
isMobile={isMobile} isMobile={isMobile}

View File

@@ -1,89 +0,0 @@
import { checkAdminAuth } from "@/lib/admin/auth"
import {
AdminProvidersSchema,
deriveEnvUpdates,
loadAdminProviders,
maskAdminProviders,
mergeSecrets,
validateAdminProviders,
} from "@/lib/admin/providers"
import { isSettingsWritable, saveSettings } from "@/lib/admin/settings"
import { loadEnvServerModelsConfig } from "@/lib/server-model-config"
export const runtime = "nodejs"
export const dynamic = "force-dynamic"
async function payload() {
// Env-based providers (AI_MODELS_CONFIG / ai-models.json) are shown
// read-only in the panel; their credentials live in the environment
const envConfig = await loadEnvServerModelsConfig()
const adminProviders = loadAdminProviders()
// A panel default overrides any env default (matches the merge in
// loadRawServerModelsConfig), so env stars must reflect that
const adminHasDefault = adminProviders.some(
(p) => p.isDefault && p.models.length > 0,
)
return {
writable: isSettingsWritable(),
providers: maskAdminProviders(adminProviders),
envProviders:
envConfig?.providers.map((p) => ({
name: p.name,
provider: p.provider,
models: p.models,
isDefault: !!p.default && !adminHasDefault,
})) ?? [],
}
}
export async function GET(req: Request) {
const authError = checkAdminAuth(req)
if (authError) return authError
return Response.json(await payload())
}
export async function PUT(req: Request) {
const authError = checkAdminAuth(req)
if (authError) return authError
if (!isSettingsWritable()) {
return Response.json(
{
error: "Settings file is not writable on this deployment. Configure via environment variables instead.",
},
{ status: 503 },
)
}
let body: unknown
try {
body = await req.json()
} catch {
return Response.json({ error: "Invalid JSON body" }, { status: 400 })
}
const parsed = AdminProvidersSchema.safeParse(
(body as { providers?: unknown })?.providers,
)
if (!parsed.success) {
return Response.json(
{
error: `Invalid providers: ${parsed.error.issues[0]?.message ?? "schema mismatch"}`,
},
{ status: 400 },
)
}
const stored = loadAdminProviders()
const merged = mergeSecrets(parsed.data, stored)
const envConfig = await loadEnvServerModelsConfig()
const validationError = validateAdminProviders(merged, envConfig)
if (validationError) {
return Response.json({ error: validationError }, { status: 400 })
}
saveSettings(deriveEnvUpdates(merged, stored))
return Response.json(await payload())
}

View File

@@ -1,126 +0,0 @@
import { checkAdminAuth, maskSecret } from "@/lib/admin/auth"
import {
getEnvFallback,
getValueSource,
isSettingsWritable,
loadSettings,
saveSettings,
} from "@/lib/admin/settings"
import {
SETTINGS_BY_KEY,
SETTINGS_REGISTRY,
type SettingDef,
} from "@/lib/admin/settings-registry"
export const runtime = "nodejs"
export const dynamic = "force-dynamic"
function serializeSettings() {
const fileValues = loadSettings()
return SETTINGS_REGISTRY.map((def) => {
const source = getValueSource(def.key)
const raw =
source === "file"
? fileValues[def.key]
: (getEnvFallback(def.key) ?? null)
const value = def.type === "secret" && raw ? maskSecret(raw) : raw
return { key: def.key, source, value }
})
}
export async function GET(req: Request) {
const authError = checkAdminAuth(req)
if (authError) return authError
return Response.json({
writable: isSettingsWritable(),
settings: serializeSettings(),
})
}
function validateValue(def: SettingDef, value: string): string | null {
switch (def.type) {
case "number": {
const num = Number(value)
if (!Number.isFinite(num)) return "Must be a number"
if (def.min !== undefined && num < def.min)
return `Must be at least ${def.min}`
if (def.max !== undefined && num > def.max)
return `Must be at most ${def.max}`
return null
}
case "boolean":
return value === "true" || value === "false"
? null
: 'Must be "true" or "false"'
case "enum":
return def.options?.includes(value)
? null
: `Must be one of: ${def.options?.join(", ")}`
default:
return null
}
}
export async function PUT(req: Request) {
const authError = checkAdminAuth(req)
if (authError) return authError
if (!isSettingsWritable()) {
return Response.json(
{
error: "Settings file is not writable on this deployment. Configure via environment variables instead.",
},
{ status: 503 },
)
}
let body: { values?: Record<string, unknown> }
try {
body = await req.json()
} catch {
return Response.json({ error: "Invalid JSON body" }, { status: 400 })
}
if (!body.values || typeof body.values !== "object") {
return Response.json(
{ error: "Body must contain a values object" },
{ status: 400 },
)
}
const updates: Record<string, string | null> = {}
const errors: Record<string, string> = {}
for (const [key, value] of Object.entries(body.values)) {
const def = SETTINGS_BY_KEY.get(key)
if (!def) {
errors[key] = "Unknown setting"
continue
}
if (value === null || value === "") {
updates[key] = null
continue
}
if (typeof value !== "string") {
errors[key] = "Value must be a string"
continue
}
const error = validateValue(def, value)
if (error) {
errors[key] = error
continue
}
updates[key] = value
}
if (Object.keys(errors).length > 0) {
return Response.json({ errors }, { status: 400 })
}
saveSettings(updates)
return Response.json({
writable: true,
settings: serializeSettings(),
})
}

View File

@@ -1,66 +0,0 @@
import { POST as validateModel } from "@/app/api/validate-model/route"
import { checkAdminAuth } from "@/lib/admin/auth"
import {
AdminProviderSchema,
loadAdminProviders,
mergeSecrets,
} from "@/lib/admin/providers"
export const runtime = "nodejs"
export const dynamic = "force-dynamic"
// Test a model with the client's CURRENT provider state (which may be
// unsaved). Secret fields arrive either as plaintext (newly typed) or as
// masked {isSet} markers, which are resolved against settings.json — so
// testing works both before and after saving.
export async function POST(req: Request) {
const authError = checkAdminAuth(req)
if (authError) return authError
let body: { provider?: unknown; modelId?: string }
try {
body = await req.json()
} catch {
return Response.json({ error: "Invalid JSON body" }, { status: 400 })
}
const parsed = AdminProviderSchema.safeParse(body.provider)
if (!parsed.success || !body.modelId) {
return Response.json(
{ valid: false, error: "Invalid provider or model" },
{ status: 400 },
)
}
// SECURITY: a stored secret is only resolved from an {isSet} marker if
// the endpoint it would be sent to (provider + baseUrl) still matches
// the stored entry. Otherwise a tampered baseUrl could exfiltrate the
// stored key to an arbitrary host. Mismatches must re-supply plaintext.
const stored = loadAdminProviders().find((p) => p.id === parsed.data.id)
const sameEndpoint =
stored &&
stored.provider === parsed.data.provider &&
(stored.baseUrl ?? "") === (parsed.data.baseUrl ?? "") &&
(stored.awsRegion ?? "") === (parsed.data.awsRegion ?? "")
const [resolved] = mergeSecrets(
[parsed.data],
sameEndpoint && stored ? [stored] : [],
)
return validateModel(
new Request(new URL("/api/validate-model", req.url), {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
provider: resolved.provider,
apiKey: resolved.apiKey,
baseUrl: resolved.baseUrl,
modelId: body.modelId,
awsAccessKeyId: resolved.awsAccessKeyId,
awsSecretAccessKey: resolved.awsSecretAccessKey,
awsRegion: resolved.awsRegion,
vertexApiKey: resolved.vertexApiKey,
}),
}),
)
}

View File

@@ -1,61 +0,0 @@
import { NextResponse } from "next/server"
import {
AIHUBMIX_MODELS_ENDPOINT,
extractAihubmixModelIds,
} from "@/lib/aihubmix-models"
import { SUGGESTED_MODELS } from "@/lib/types/model-config"
const SUCCESS_CACHE_CONTROL =
"public, max-age=300, s-maxage=3600, stale-while-revalidate=86400"
function fallbackResponse() {
return NextResponse.json(
{
models: SUGGESTED_MODELS.aihubmix || [],
source: "fallback",
},
{
headers: {
"Cache-Control": "no-store",
},
},
)
}
export async function GET() {
try {
const response = await fetch(AIHUBMIX_MODELS_ENDPOINT, {
next: { revalidate: 3600 },
})
if (!response.ok) {
console.warn(
`[aihubmix-models] Failed to fetch models: ${response.status}`,
)
return fallbackResponse()
}
const payload = await response.json()
const models = extractAihubmixModelIds(payload)
if (models.length === 0) {
console.warn("[aihubmix-models] Model list response was empty")
return fallbackResponse()
}
return NextResponse.json(
{
models,
source: "aihubmix",
},
{
headers: {
"Cache-Control": SUCCESS_CACHE_CONTROL,
},
},
)
} catch (error) {
console.warn("[aihubmix-models] Failed to load models:", error)
return fallbackResponse()
}
}

View File

@@ -1,37 +1,12 @@
import { extractFromHtml } from "@extractus/article-extractor" import { extract } from "@extractus/article-extractor"
import { NextResponse } from "next/server" import { NextResponse } from "next/server"
import TurndownService from "turndown" import TurndownService from "turndown"
import { isPrivateUrl } from "@/lib/ssrf-protection" import { allowPrivateUrls, isPrivateUrl } from "@/lib/ssrf-protection"
const MAX_CONTENT_LENGTH = 150000 // Match PDF limit const MAX_CONTENT_LENGTH = 150000 // Match PDF limit
const EXTRACT_TIMEOUT_MS = 15000 const EXTRACT_TIMEOUT_MS = 15000
const USER_AGENT = "Mozilla/5.0 (compatible; NextAIDrawio/1.0)" const USER_AGENT = "Mozilla/5.0 (compatible; NextAIDrawio/1.0)"
// Detect the page's charset so non-UTF-8 pages (Shift_JIS/GBK/EUC/Big5, common
// on CJK sites) are decoded correctly. Response.text() always assumes UTF-8 and
// would produce mojibake; the article-extractor library does the same detection
// when it fetches the page itself, which we no longer rely on.
function detectCharset(
contentType: string | null,
buffer: ArrayBuffer,
): string {
// 1. HTTP Content-Type header charset (most authoritative).
const headerCharset = contentType?.match(/charset=([^;]+)/i)?.[1]?.trim()
// 2. <meta charset> / <meta http-equiv> in the first bytes of the document.
const head = new TextDecoder("utf-8").decode(buffer.slice(0, 4096))
const metaCharset =
head.match(/<meta[^>]+charset=["']?\s*([\w-]+)/i)?.[1] ||
head.match(/<meta[^>]+content=["'][^"']*charset=([\w-]+)/i)?.[1]
const charset = (headerCharset || metaCharset || "utf-8").toLowerCase()
// TextDecoder throws on unknown encoding labels; fall back to UTF-8.
try {
new TextDecoder(charset)
return charset
} catch {
return "utf-8"
}
}
export async function POST(req: Request) { export async function POST(req: Request) {
try { try {
const { url } = await req.json() const { url } = await req.json()
@@ -53,34 +28,22 @@ export async function POST(req: Request) {
) )
} }
// SSRF protection: parse-url has no use case for fetching internal // SSRF protection
// hosts, so private URLs are always rejected. ALLOW_PRIVATE_URLS only if (!allowPrivateUrls && isPrivateUrl(url)) {
// governs LLM provider baseUrl overrides (validate-model, chat).
if (await isPrivateUrl(url)) {
return NextResponse.json( return NextResponse.json(
{ error: "Cannot access private/internal URLs" }, { error: "Cannot access private/internal URLs" },
{ status: 400 }, { status: 400 },
) )
} }
// Fetch the page ourselves so we control redirect handling. The const headController = new AbortController()
// article-extractor library follows redirects internally and ignores a const headTimeout = setTimeout(() => headController.abort(), 3000)
// `redirect` option, which would let a public URL 302 to an internal
// host and bypass the SSRF check above. `redirect: "error"` rejects any
// redirect outright.
const controller = new AbortController()
const timeoutId = setTimeout(() => {
controller.abort()
}, EXTRACT_TIMEOUT_MS)
let html: string
try { try {
const response = await fetch(url, { const headResponse = await fetch(url, {
method: "HEAD",
headers: { "User-Agent": USER_AGENT }, headers: { "User-Agent": USER_AGENT },
redirect: "error", signal: headController.signal,
signal: controller.signal,
}) })
const contentType = headResponse.headers.get("content-type")
const contentType = response.headers.get("content-type")
if (contentType?.includes("application/pdf")) { if (contentType?.includes("application/pdf")) {
return NextResponse.json( return NextResponse.json(
{ {
@@ -89,17 +52,27 @@ export async function POST(req: Request) {
{ status: 422 }, { status: 422 },
) )
} }
} catch (err) {
console.warn(
"HEAD pre-check failed, proceeding with extraction:",
err,
)
} finally {
clearTimeout(headTimeout)
}
if (!response.ok) { // Extract article content with timeout to avoid tying up server resources
return NextResponse.json( const controller = new AbortController()
{ error: "Could not fetch URL content" }, const timeoutId = setTimeout(() => {
{ status: 400 }, controller.abort()
) }, EXTRACT_TIMEOUT_MS)
}
const buffer = await response.arrayBuffer() let article
const charset = detectCharset(contentType, buffer) try {
html = new TextDecoder(charset).decode(buffer) article = await extract(url, undefined, {
headers: { "User-Agent": USER_AGENT },
signal: controller.signal,
})
} catch (err: any) { } catch (err: any) {
if (err?.name === "AbortError") { if (err?.name === "AbortError") {
return NextResponse.json( return NextResponse.json(
@@ -107,25 +80,11 @@ export async function POST(req: Request) {
{ status: 504 }, { status: 504 },
) )
} }
// Redirects are rejected with a TypeError ("failed to fetch" / throw err
// "unexpected redirect") when redirect: "error" is set.
return NextResponse.json(
{ error: "Could not fetch URL content" },
{ status: 400 },
)
} finally { } finally {
clearTimeout(timeoutId) clearTimeout(timeoutId)
} }
// extractFromHtml throws (not returns null) on empty/non-HTML bodies,
// so map any parse error to the same 400 as the no-content case.
let article: Awaited<ReturnType<typeof extractFromHtml>>
try {
article = await extractFromHtml(html, url)
} catch {
article = null
}
if (!article || !article.content) { if (!article || !article.content) {
return NextResponse.json( return NextResponse.json(
{ error: "Could not extract content from URL" }, { error: "Could not extract content from URL" },

View File

@@ -5,16 +5,11 @@ import { createGateway } from "@ai-sdk/gateway"
import { createGoogleGenerativeAI } from "@ai-sdk/google" import { createGoogleGenerativeAI } from "@ai-sdk/google"
import { createVertex } from "@ai-sdk/google-vertex" import { createVertex } from "@ai-sdk/google-vertex"
import { createOpenAI } from "@ai-sdk/openai" import { createOpenAI } from "@ai-sdk/openai"
import { createAihubmix } from "@aihubmix/ai-sdk-provider"
import { createOpenRouter } from "@openrouter/ai-sdk-provider" import { createOpenRouter } from "@openrouter/ai-sdk-provider"
import { generateText } from "ai" import { generateText } from "ai"
import { NextResponse } from "next/server" import { NextResponse } from "next/server"
import { createOllama } from "ollama-ai-provider-v2" import { createOllama } from "ollama-ai-provider-v2"
import { import { normalizeMiniMaxBaseURL } from "@/lib/ai-providers"
AIHUBMIX_APP_CODE,
isAihubmixStandardBaseURL,
normalizeMiniMaxBaseURL,
} from "@/lib/ai-providers"
import { allowPrivateUrls, isPrivateUrl } from "@/lib/ssrf-protection" import { allowPrivateUrls, isPrivateUrl } from "@/lib/ssrf-protection"
import { PROVIDER_INFO, type ProviderName } from "@/lib/types/model-config" import { PROVIDER_INFO, type ProviderName } from "@/lib/types/model-config"
@@ -56,7 +51,7 @@ export async function POST(req: Request) {
} }
// SECURITY: Block SSRF attacks via custom baseUrl // SECURITY: Block SSRF attacks via custom baseUrl
if (baseUrl && !allowPrivateUrls() && (await isPrivateUrl(baseUrl))) { if (baseUrl && !allowPrivateUrls && isPrivateUrl(baseUrl)) {
return NextResponse.json( return NextResponse.json(
{ valid: false, error: "Invalid base URL" }, { valid: false, error: "Invalid base URL" },
{ status: 400 }, { status: 400 },
@@ -158,28 +153,6 @@ export async function POST(req: Request) {
break break
} }
case "aihubmix": {
const defaultBaseURL = PROVIDER_INFO.aihubmix.defaultBaseUrl
if (
isAihubmixStandardBaseURL(baseUrl) ||
baseUrl === defaultBaseURL
) {
const aihubmix = createAihubmix({
apiKey,
appCode: AIHUBMIX_APP_CODE,
})
model = aihubmix(modelId)
} else {
const aihubmixCompatible = createOpenAI({
apiKey,
baseURL: baseUrl,
})
model = aihubmixCompatible.chat(modelId)
}
break
}
case "deepseek": { case "deepseek": {
if (baseUrl || apiKey) { if (baseUrl || apiKey) {
const ds = createDeepSeek({ const ds = createDeepSeek({

View File

@@ -1,5 +1,5 @@
{ {
"$schema": "https://biomejs.dev/schemas/2.4.14/schema.json", "$schema": "https://biomejs.dev/schemas/2.4.4/schema.json",
"vcs": { "vcs": {
"enabled": true, "enabled": true,
"clientKind": "git", "clientKind": "git",

View File

@@ -141,6 +141,9 @@ export default function ExamplePanel({
<span className="text-sm font-medium text-foreground group-hover:text-purple-500 transition-colors"> <span className="text-sm font-medium text-foreground group-hover:text-purple-500 transition-colors">
{dict.examples.mcpServer} {dict.examples.mcpServer}
</span> </span>
<span className="px-1.5 py-0.5 text-[10px] font-semibold bg-purple-500 text-white rounded">
{dict.examples.preview}
</span>
</div> </div>
<p className="text-xs text-muted-foreground"> <p className="text-xs text-muted-foreground">
{dict.examples.mcpDescription} {dict.examples.mcpDescription}

View File

@@ -417,7 +417,6 @@ export function ChatMessageDisplay({
// Track previous message count to detect bulk loads vs streaming // Track previous message count to detect bulk loads vs streaming
const prevMessageCountRef = useRef(0) const prevMessageCountRef = useRef(0)
const scrollThrottleRef = useRef<ReturnType<typeof setTimeout> | null>(null)
useEffect(() => { useEffect(() => {
if (messagesEndRef.current && messages.length > 0) { if (messagesEndRef.current && messages.length > 0) {
@@ -431,17 +430,8 @@ export function ChatMessageDisplay({
return return
} }
// Throttle scroll during streaming to avoid layout thrashing // Single message added - smooth scroll
// Leading + trailing: scroll immediately, then once more after cooldown messagesEndRef.current.scrollIntoView({ behavior: "smooth" })
if (!scrollThrottleRef.current) {
messagesEndRef.current.scrollIntoView({ behavior: "smooth" })
scrollThrottleRef.current = setTimeout(() => {
scrollThrottleRef.current = null
messagesEndRef.current?.scrollIntoView({
behavior: "smooth",
})
}, 150)
}
} }
}, [messages]) }, [messages])

View File

@@ -25,6 +25,7 @@ import Image from "@/components/image-with-basepath"
import { ModelConfigDialog } from "@/components/model-config-dialog" import { ModelConfigDialog } from "@/components/model-config-dialog"
import { SettingsDialog } from "@/components/settings-dialog" import { SettingsDialog } from "@/components/settings-dialog"
import { useDiagram } from "@/contexts/diagram-context" import { useDiagram } from "@/contexts/diagram-context"
import { useAutoUpdate } from "@/hooks/use-auto-update"
import { useDiagramToolHandlers } from "@/hooks/use-diagram-tool-handlers" import { useDiagramToolHandlers } from "@/hooks/use-diagram-tool-handlers"
import { useDictionary } from "@/hooks/use-dictionary" import { useDictionary } from "@/hooks/use-dictionary"
import { getSelectedAIConfig, useModelConfig } from "@/hooks/use-model-config" import { getSelectedAIConfig, useModelConfig } from "@/hooks/use-model-config"
@@ -32,7 +33,6 @@ import { useSessionManager } from "@/hooks/use-session-manager"
import { useValidateDiagram } from "@/hooks/use-validate-diagram" import { useValidateDiagram } from "@/hooks/use-validate-diagram"
import { getApiEndpoint } from "@/lib/base-path" import { getApiEndpoint } from "@/lib/base-path"
import { findCachedResponse } from "@/lib/cached-responses" import { findCachedResponse } from "@/lib/cached-responses"
import type { DrawioTheme } from "@/lib/drawio-themes"
import { formatMessage } from "@/lib/i18n/utils" import { formatMessage } from "@/lib/i18n/utils"
import { isPdfFile, isTextFile } from "@/lib/pdf-utils" import { isPdfFile, isTextFile } from "@/lib/pdf-utils"
import { sanitizeMessages } from "@/lib/session-storage" import { sanitizeMessages } from "@/lib/session-storage"
@@ -69,8 +69,8 @@ interface ChatMessage {
interface ChatPanelProps { interface ChatPanelProps {
isVisible: boolean isVisible: boolean
onToggleVisibility: () => void onToggleVisibility: () => void
drawioUi: DrawioTheme drawioUi: "min" | "sketch"
onDrawioUiChange: (theme: DrawioTheme) => void onToggleDrawioUi: () => void
darkMode: boolean darkMode: boolean
onToggleDarkMode: () => void onToggleDarkMode: () => void
isMobile?: boolean isMobile?: boolean
@@ -111,7 +111,7 @@ export default function ChatPanel({
isVisible, isVisible,
onToggleVisibility, onToggleVisibility,
drawioUi, drawioUi,
onDrawioUiChange, onToggleDrawioUi,
darkMode, darkMode,
onToggleDarkMode, onToggleDarkMode,
isMobile = false, isMobile = false,
@@ -1254,10 +1254,22 @@ export default function ChatPanel({
sendChatMessage(newParts, savedXml, previousXml, sessionId) sendChatMessage(newParts, savedXml, previousXml, sessionId)
} }
// Auto-update listener (must be before early return so it's always active)
useAutoUpdate()
// Collapsed view (desktop only) // Collapsed view (desktop only)
if (!isVisible && !isMobile) { if (!isVisible && !isMobile) {
return ( return (
<div className="h-full flex flex-col items-center pt-4 bg-card border border-border/30 rounded-xl"> <div className="h-full flex flex-col items-center pt-4 bg-card border border-border/30 rounded-xl">
<Toaster
position="bottom-left"
richColors
expand
toastOptions={{
style: { maxWidth: "480px" },
duration: 2000,
}}
/>
<ButtonWithTooltip <ButtonWithTooltip
tooltipContent={dict.nav.showPanel} tooltipContent={dict.nav.showPanel}
variant="ghost" variant="ghost"
@@ -1443,7 +1455,7 @@ export default function ChatPanel({
open={showSettingsDialog} open={showSettingsDialog}
onOpenChange={setShowSettingsDialog} onOpenChange={setShowSettingsDialog}
drawioUi={drawioUi} drawioUi={drawioUi}
onDrawioUiChange={onDrawioUiChange} onToggleDrawioUi={onToggleDrawioUi}
darkMode={darkMode} darkMode={darkMode}
onToggleDarkMode={onToggleDarkMode} onToggleDarkMode={onToggleDarkMode}
minimalStyle={minimalStyle} minimalStyle={minimalStyle}

View File

@@ -107,8 +107,8 @@ export function ChatLobby({
currentInput = "", currentInput = "",
dict, dict,
}: ChatLobbyProps) { }: ChatLobbyProps) {
const [templatesExpanded, setTemplatesExpanded] = useState(true) const [templatesExpanded, setTemplatesExpanded] = useState(false)
const [examplesExpanded, setExamplesExpanded] = useState(true) const [examplesExpanded, setExamplesExpanded] = useState(false)
const [panelVisibility, setPanelVisibility] = useState(getPanelVisibility) const [panelVisibility, setPanelVisibility] = useState(getPanelVisibility)
const [deleteDialogOpen, setDeleteDialogOpen] = useState(false) const [deleteDialogOpen, setDeleteDialogOpen] = useState(false)
const [sessionToDelete, setSessionToDelete] = useState<string | null>(null) const [sessionToDelete, setSessionToDelete] = useState<string | null>(null)
@@ -125,25 +125,19 @@ export function ChatLobby({
const hasHistory = sessions.length > 0 const hasHistory = sessions.length > 0
if (!hasHistory) { if (!hasHistory) {
if (!panelVisibility.myTemplates && !panelVisibility.quickExamples) { if (panelVisibility.myTemplates) {
return null return (
<TemplatePanel
setInput={setInput}
onSendTemplate={onSendTemplate}
currentInput={currentInput}
/>
)
} }
return ( if (panelVisibility.quickExamples) {
<div className="animate-fade-in"> return <ExamplePanel setInput={setInput} setFiles={setFiles} />
{panelVisibility.myTemplates && ( }
<TemplatePanel return null
setInput={setInput}
onSendTemplate={onSendTemplate}
currentInput={currentInput}
/>
)}
{panelVisibility.quickExamples && (
<div className={panelVisibility.myTemplates ? "mt-6" : ""}>
<ExamplePanel setInput={setInput} setFiles={setFiles} />
</div>
)}
</div>
)
} }
// Show history + collapsible examples when there are sessions // Show history + collapsible examples when there are sessions

View File

@@ -195,22 +195,7 @@ export function ToolCallCard({
{input && isExpanded && ( {input && isExpanded && (
<div className="px-4 py-3 border-t border-border/40 bg-muted/20"> <div className="px-4 py-3 border-t border-border/40 bg-muted/20">
{typeof input === "object" && input.xml ? ( {typeof input === "object" && input.xml ? (
state === "input-streaming" || <CodeBlock code={input.xml} language="xml" />
state === "input-available" ? (
<pre
className="text-[11px] leading-relaxed overflow-x-auto overflow-y-auto max-h-48 scrollbar-thin break-all whitespace-pre-wrap"
style={{
fontFamily:
"var(--font-mono), ui-monospace, monospace",
margin: 0,
padding: 0,
}}
>
{input.xml}
</pre>
) : (
<CodeBlock code={input.xml} language="xml" />
)
) : typeof input === "object" && ) : typeof input === "object" &&
input.operations && input.operations &&
Array.isArray(input.operations) ? ( Array.isArray(input.operations) ? (

File diff suppressed because it is too large Load Diff

View File

@@ -1,259 +0,0 @@
"use client"
import { Key, Link2, Tag } from "lucide-react"
import type { ReactNode } from "react"
import { Input } from "@/components/ui/input"
import { Label } from "@/components/ui/label"
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select"
import { useDictionary } from "@/hooks/use-dictionary"
import { formatMessage } from "@/lib/i18n/utils"
import { PROVIDER_INFO, type ProviderName } from "@/lib/types/model-config"
// Logical secret field. The caller owns the actual input — plaintext for the
// user dialog, write-only masked for the admin panel — supplied via
// renderSecret. That (and the optional test action) are the only genuine
// differences between the two screens; the field structure is shared here.
export type SecretField =
| "apiKey"
| "awsAccessKeyId"
| "awsSecretAccessKey"
| "vertexApiKey"
// AWS regions offered for Bedrock (shared by both screens)
const AWS_REGIONS: Array<[string, string]> = [
["us-east-1", "N. Virginia"],
["us-east-2", "Ohio"],
["us-west-2", "Oregon"],
["eu-west-1", "Ireland"],
["eu-west-2", "London"],
["eu-west-3", "Paris"],
["eu-central-1", "Frankfurt"],
["ap-south-1", "Mumbai"],
["ap-northeast-1", "Tokyo"],
["ap-northeast-2", "Seoul"],
["ap-southeast-1", "Singapore"],
["ap-southeast-2", "Sydney"],
["sa-east-1", "São Paulo"],
]
interface ProviderCredentialsFieldsProps {
provider: ProviderName
// Plain (non-secret) field values — secrets are owned by renderSecret
name?: string
baseUrl?: string
awsRegion?: string
disabled?: boolean
// Update a plain text field
onChange: (field: "name" | "baseUrl" | "awsRegion", value: string) => void
// Render the control for a secret field. The caller may include trailing
// UI (e.g. the user dialog's inline Test button + validation error); the
// shared component only supplies the label above it.
renderSecret: (opts: { field: SecretField; id: string }) => ReactNode
// Extra content after the fields — used for the Bedrock test row and the
// EdgeOne test button, which aren't beside a credential input.
footer?: ReactNode
}
// Display name + per-provider credential inputs, shared by the user
// ModelConfigDialog and the admin Models panel.
export function ProviderCredentialsFields({
provider,
name,
baseUrl,
awsRegion,
disabled,
onChange,
renderSecret,
footer,
}: ProviderCredentialsFieldsProps) {
const dict = useDictionary()
const info = PROVIDER_INFO[provider]
const baseUrlLabel = formatMessage(dict.modelConfig.baseUrlWithExample, {
example: info.defaultBaseUrl || "https://api.example.com/v1",
})
// EdgeOne needs no credentials — the caller supplies just a test button
if (provider === "edgeone") {
return <div className="space-y-5">{footer}</div>
}
return (
<div className="space-y-5">
{/* Display Name */}
<div className="space-y-2">
<Label
htmlFor="provider-name"
className="text-xs font-medium flex items-center gap-1.5"
>
<Tag className="h-3.5 w-3.5 text-muted-foreground" />
{dict.modelConfig.displayName}
</Label>
<Input
id="provider-name"
value={name ?? ""}
disabled={disabled}
onChange={(e) => onChange("name", e.target.value)}
placeholder={info.label}
className="h-9"
/>
</div>
{provider === "bedrock" ? (
<>
{/* AWS Access Key ID */}
<div className="space-y-2">
<Label
htmlFor="aws-access-key-id"
className="text-xs font-medium flex items-center gap-1.5"
>
<Key className="h-3.5 w-3.5 text-muted-foreground" />
{dict.modelConfig.awsAccessKeyId}
</Label>
{renderSecret({
field: "awsAccessKeyId",
id: "aws-access-key-id",
})}
</div>
{/* AWS Secret Access Key */}
<div className="space-y-2">
<Label
htmlFor="aws-secret-access-key"
className="text-xs font-medium flex items-center gap-1.5"
>
<Key className="h-3.5 w-3.5 text-muted-foreground" />
{dict.modelConfig.awsSecretAccessKey}
</Label>
{renderSecret({
field: "awsSecretAccessKey",
id: "aws-secret-access-key",
})}
</div>
{/* AWS Region */}
<div className="space-y-2">
<Label
htmlFor="aws-region"
className="text-xs font-medium flex items-center gap-1.5"
>
<Link2 className="h-3.5 w-3.5 text-muted-foreground" />
{dict.modelConfig.awsRegion}
</Label>
<Select
value={awsRegion || ""}
disabled={disabled}
onValueChange={(v) => onChange("awsRegion", v)}
>
<SelectTrigger
id="aws-region"
className="h-9 font-mono text-xs hover:bg-accent"
>
<SelectValue
placeholder={dict.modelConfig.selectRegion}
/>
</SelectTrigger>
<SelectContent className="max-h-64">
{AWS_REGIONS.map(([region, label]) => (
<SelectItem key={region} value={region}>
{region} ({label})
</SelectItem>
))}
</SelectContent>
</Select>
</div>
</>
) : provider === "vertexai" ? (
<>
{/* Vertex AI API Key (Express Mode) */}
<div className="space-y-2">
<Label
htmlFor="vertex-api-key"
className="text-xs font-medium flex items-center gap-1.5"
>
<Key className="h-3.5 w-3.5 text-muted-foreground" />
{dict.modelConfig.apiKey}
</Label>
{renderSecret({
field: "vertexApiKey",
id: "vertex-api-key",
})}
</div>
{/* Base URL (optional) */}
<div className="space-y-2">
<Label
htmlFor="vertex-base-url"
className="text-xs font-medium flex items-center gap-1.5"
>
<Link2 className="h-3.5 w-3.5 text-muted-foreground" />
{baseUrlLabel}
</Label>
<Input
id="vertex-base-url"
value={baseUrl ?? ""}
disabled={disabled}
onChange={(e) =>
onChange("baseUrl", e.target.value)
}
placeholder={dict.modelConfig.customEndpoint}
className="h-9 font-mono text-xs"
/>
</div>
</>
) : (
<>
{/* API Key */}
<div className="space-y-2">
<Label
htmlFor="api-key"
className="text-xs font-medium flex items-center gap-1.5"
>
<Key className="h-3.5 w-3.5 text-muted-foreground" />
{dict.modelConfig.apiKey}
{provider === "ollama" &&
` ${dict.modelConfig.optional}`}
</Label>
{renderSecret({ field: "apiKey", id: "api-key" })}
</div>
{/* Base URL */}
<div className="space-y-2">
<Label
htmlFor="base-url"
className="text-xs font-medium flex items-center gap-1.5"
>
<Link2 className="h-3.5 w-3.5 text-muted-foreground" />
{baseUrlLabel}
</Label>
<Input
id="base-url"
value={baseUrl ?? ""}
disabled={disabled}
onChange={(e) =>
onChange("baseUrl", e.target.value)
}
placeholder={
info.defaultBaseUrl ||
dict.modelConfig.customEndpoint
}
className="h-9 rounded-xl font-mono text-xs"
/>
{provider === "minimax" && (
<p className="text-xs text-muted-foreground">
{dict.modelConfig.minimaxBaseUrlHint}
</p>
)}
</div>
</>
)}
{footer}
</div>
)
}

View File

@@ -1,36 +0,0 @@
import { Cloud, Server, Sparkles } from "lucide-react"
import { PROVIDER_LOGO_MAP, type ProviderName } from "@/lib/types/model-config"
import { cn } from "@/lib/utils"
// Provider logo from models.dev, with Lucide fallbacks for providers
// that have no logo there
export function ProviderLogo({
provider,
className,
}: {
provider: ProviderName
className?: string
}) {
if (provider === "bedrock") {
return <Cloud className={cn("size-4", className)} />
}
if (provider === "sglang") {
return <Server className={cn("size-4", className)} />
}
if (provider === "doubao") {
return <Sparkles className={cn("size-4", className)} />
}
const logoName = PROVIDER_LOGO_MAP[provider] || provider
return (
// biome-ignore lint/performance/noImgElement: External URL from models.dev
<img
alt=""
aria-hidden="true"
className={cn("size-4 dark:invert", className)}
height={16}
src={`https://models.dev/logos/${logoName}.svg`}
width={16}
/>
)
}

View File

@@ -25,7 +25,6 @@ import { Switch } from "@/components/ui/switch"
import { Textarea } from "@/components/ui/textarea" import { Textarea } from "@/components/ui/textarea"
import { useDictionary } from "@/hooks/use-dictionary" import { useDictionary } from "@/hooks/use-dictionary"
import { getApiEndpoint } from "@/lib/base-path" import { getApiEndpoint } from "@/lib/base-path"
import type { DrawioTheme } from "@/lib/drawio-themes"
import { i18n, type Locale } from "@/lib/i18n/config" import { i18n, type Locale } from "@/lib/i18n/config"
import { STORAGE_KEYS } from "@/lib/storage" import { STORAGE_KEYS } from "@/lib/storage"
@@ -64,8 +63,8 @@ const LANGUAGE_LABELS: Record<Locale, string> = {
interface SettingsDialogProps { interface SettingsDialogProps {
open: boolean open: boolean
onOpenChange: (open: boolean) => void onOpenChange: (open: boolean) => void
drawioUi: DrawioTheme drawioUi: "min" | "sketch"
onDrawioUiChange: (theme: DrawioTheme) => void onToggleDrawioUi: () => void
darkMode: boolean darkMode: boolean
onToggleDarkMode: () => void onToggleDarkMode: () => void
minimalStyle?: boolean minimalStyle?: boolean
@@ -91,7 +90,7 @@ function SettingsContent({
open, open,
onOpenChange, onOpenChange,
drawioUi, drawioUi,
onDrawioUiChange, onToggleDrawioUi,
darkMode, darkMode,
onToggleDarkMode, onToggleDarkMode,
minimalStyle = false, minimalStyle = false,
@@ -135,11 +134,8 @@ function SettingsContent({
const [isApplyingProxy, setIsApplyingProxy] = useState(false) const [isApplyingProxy, setIsApplyingProxy] = useState(false)
useEffect(() => { useEffect(() => {
// Re-fetch config whenever the dialog opens to ensure we always show // Only fetch if not cached in localStorage
// the access code input if the server requires it. This fixes the case if (getStoredAccessCodeRequired() !== null) return
// where a stale localStorage cache (from before ACCESS_CODE_LIST was
// configured) would hide the access code input.
if (!open) return
fetch(getApiEndpoint("/api/config")) fetch(getApiEndpoint("/api/config"))
.then((res) => { .then((res) => {
@@ -155,9 +151,10 @@ function SettingsContent({
setAccessCodeRequired(required) setAccessCodeRequired(required)
}) })
.catch(() => { .catch(() => {
// Keep existing cached value on error // Don't cache on error - allow retry on next mount
setAccessCodeRequired(false)
}) })
}, [open]) }, [])
// Detect current language from pathname // Detect current language from pathname
useEffect(() => { useEffect(() => {
@@ -433,40 +430,23 @@ function SettingsContent({
{/* Draw.io Style */} {/* Draw.io Style */}
<SettingItem <SettingItem
label={dict.settings.drawioStyle} label={dict.settings.drawioStyle}
description={dict.settings.drawioStyleDescription} description={`${dict.settings.drawioStyleDescription} ${
drawioUi === "min"
? dict.settings.minimal
: dict.settings.sketch
}`}
> >
<Select <Button
value={drawioUi} id="drawio-ui"
onValueChange={(v) => variant="outline"
onDrawioUiChange(v as DrawioTheme) onClick={onToggleDrawioUi}
} className="h-9 w-[120px] rounded-xl border-border-subtle hover:bg-interactive-hover font-normal"
> >
<SelectTrigger {dict.settings.switchTo}{" "}
id="drawio-ui-select" {drawioUi === "min"
aria-label={dict.settings.drawioStyle} ? dict.settings.sketch
className="w-[120px] h-9 rounded-xl" : dict.settings.minimal}
> </Button>
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="kennedy">
{dict.settings.themeDefault}
</SelectItem>
<SelectItem value="atlas">Atlas</SelectItem>
<SelectItem value="dark">
{dict.settings.themeDark}
</SelectItem>
<SelectItem value="min">
{dict.settings.themeMinimal}
</SelectItem>
<SelectItem value="sketch">
{dict.settings.themeSketch}
</SelectItem>
<SelectItem value="simple">
{dict.settings.themeSimple}
</SelectItem>
</SelectContent>
</Select>
</SettingItem> </SettingItem>
{/* Diagram Style */} {/* Diagram Style */}

124
components/update-toast.tsx Normal file
View File

@@ -0,0 +1,124 @@
"use client"
import type React from "react"
interface UpdateToastAvailableProps {
variant: "download"
version: string
onDownload: () => void
onDismiss: () => void
}
interface UpdateToastManualProps {
variant: "manual"
version: string
url: string
onDismiss: () => void
}
interface UpdateToastDownloadingProps {
variant: "downloading"
percent: number
onDismiss: () => void
}
type UpdateToastProps =
| UpdateToastAvailableProps
| UpdateToastManualProps
| UpdateToastDownloadingProps
export function UpdateToast(props: UpdateToastProps) {
const { variant, onDismiss } = props
const handleKeyDown = (e: React.KeyboardEvent) => {
if (e.key === "Escape") {
e.preventDefault()
onDismiss()
}
}
return (
<div
role="alert"
aria-live="polite"
tabIndex={0}
onKeyDown={handleKeyDown}
className="flex items-center gap-3 bg-card border border-border/50 px-4 py-3 rounded-xl shadow-sm"
>
<div className="flex items-center justify-center w-8 h-8 rounded-full bg-primary/10 flex-shrink-0">
<svg
className="w-4 h-4 text-primary"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
aria-hidden="true"
>
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
<polyline points="7 10 12 15 17 10" />
<line x1="12" y1="15" x2="12" y2="3" />
</svg>
</div>
<div className="flex-1 min-w-0">
{variant === "downloading" ? (
<span className="text-sm text-foreground">
Downloading update... {Math.round(props.percent)}%
</span>
) : (
<span className="text-sm text-foreground">
Version {props.version} is available
</span>
)}
</div>
{variant === "download" && (
<button
type="button"
onClick={(e) => {
e.stopPropagation()
props.onDownload()
}}
className="text-xs font-medium px-3 py-1.5 rounded-lg bg-primary text-primary-foreground hover:bg-primary/90 transition-colors flex-shrink-0"
>
Download
</button>
)}
{variant === "manual" && (
<button
type="button"
onClick={(e) => {
e.stopPropagation()
window.open(props.url, "_blank")
}}
className="text-xs font-medium px-3 py-1.5 rounded-lg bg-primary text-primary-foreground hover:bg-primary/90 transition-colors flex-shrink-0"
>
Download
</button>
)}
<button
type="button"
onClick={onDismiss}
className="text-muted-foreground hover:text-foreground transition-colors flex-shrink-0"
aria-label="Dismiss"
>
<svg
className="w-4 h-4"
viewBox="0 0 20 20"
fill="currentColor"
aria-hidden="true"
>
<path
fillRule="evenodd"
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
clipRule="evenodd"
/>
</svg>
</button>
</div>
)
}

View File

@@ -11,9 +11,6 @@ services:
# - NEXT_PUBLIC_BASE_PATH=/nextaidrawio # - NEXT_PUBLIC_BASE_PATH=/nextaidrawio
ports: ["3000:3000"] ports: ["3000:3000"]
env_file: .env env_file: .env
volumes:
# Persists admin panel settings (data/settings.json)
- ./data:/app/data
# environment: # environment:
# # For subdirectory deployment, uncomment and set your path: # # For subdirectory deployment, uncomment and set your path:
# NEXT_PUBLIC_BASE_PATH: /nextaidrawio # NEXT_PUBLIC_BASE_PATH: /nextaidrawio

View File

@@ -30,7 +30,7 @@ https://github.com/user-attachments/assets/b2eef5f3-b335-4e71-a755-dc2e80931979
- [目录](#目录) - [目录](#目录)
- [示例](#示例) - [示例](#示例)
- [功能特性](#功能特性) - [功能特性](#功能特性)
- [MCP服务器](#mcp服务器) - [MCP服务器(预览)](#mcp服务器预览)
- [Claude Code CLI](#claude-code-cli) - [Claude Code CLI](#claude-code-cli)
- [快速开始](#快速开始) - [快速开始](#快速开始)
- [在线试用](#在线试用) - [在线试用](#在线试用)
@@ -56,31 +56,31 @@ https://github.com/user-attachments/assets/b2eef5f3-b335-4e71-a755-dc2e80931979
<tr> <tr>
<td colspan="2" valign="top" align="center"> <td colspan="2" valign="top" align="center">
<strong>动画Transformer连接器</strong><br /> <strong>动画Transformer连接器</strong><br />
<p><strong>Prompt:</strong> Give me a **animated connector** diagram of transformer's architecture.</p> <p><strong>提示词:</strong> 给我一个带有**动画连接器**的Transformer架构图。</p>
<img src="../../public/animated_connectors.svg" alt="带动画连接器的Transformer架构" width="480" /> <img src="../../public/animated_connectors.svg" alt="带动画连接器的Transformer架构" width="480" />
</td> </td>
</tr> </tr>
<tr> <tr>
<td width="50%" valign="top"> <td width="50%" valign="top">
<strong>RAG技术图</strong><br /> <strong>GCP架构图</strong><br />
<p><strong>Prompt:</strong> Generate a RAG architecture diagram for **chat application**. Use connected diagram for data ingestion</p> <p><strong>提示词:</strong> 使用**GCP图标**生成一个GCP架构图。在这个图中用户连接到托管在实例上的前端。</p>
<img src="../../public/rag_prod.svg" alt="RAG架构图" width="480" /> <img src="../../public/gcp_demo.svg" alt="GCP架构图" width="480" />
</td> </td>
<td width="50%" valign="top"> <td width="50%" valign="top">
<strong>React和AWS认证流程</strong><br /> <strong>AWS架构图</strong><br />
<p><strong>Prompt:</strong> Generate authentication process using React with **AWS**. Use Serverless architecture.</p> <p><strong>提示词:</strong> 使用**AWS图标**生成一个AWS架构图。在这个图中用户连接到托管在实例上的前端。</p>
<img src="../../public/auth.svg" alt="认证架构图" width="480" /> <img src="../../public/aws_demo.svg" alt="AWS架构图" width="480" />
</td> </td>
</tr> </tr>
<tr> <tr>
<td width="50%" valign="top"> <td width="50%" valign="top">
<strong>开放式创新</strong><br /> <strong>Azure架构图</strong><br />
<p><strong>Prompt:</strong> Create visualization of Henry Chesbrough's Open Innovation model.</p> <p><strong>提示词:</strong> 使用**Azure图标**生成一个Azure架构图。在这个图中用户连接到托管在实例上的前端。</p>
<img src="../../public/inno.svg" alt="开放式创新图" width="480" /> <img src="../../public/azure_demo.svg" alt="Azure架构图" width="480" />
</td> </td>
<td width="50%" valign="top"> <td width="50%" valign="top">
<strong>猫咪素描</strong><br /> <strong>猫咪素描</strong><br />
<p><strong>Prompt:</strong> Draw a cute cat for me.</p> <p><strong>提示词:</strong> 给我画一只可爱的猫。</p>
<img src="../../public/cat_demo.svg" alt="猫咪绘图" width="240" /> <img src="../../public/cat_demo.svg" alt="猫咪绘图" width="240" />
</td> </td>
</tr> </tr>
@@ -98,7 +98,9 @@ https://github.com/user-attachments/assets/b2eef5f3-b335-4e71-a755-dc2e80931979
- **云架构图支持**专门支持生成云架构图AWS、GCP、Azure - **云架构图支持**专门支持生成云架构图AWS、GCP、Azure
- **动画连接器**:在图表元素之间创建动态动画连接器,实现更好的可视化效果 - **动画连接器**:在图表元素之间创建动态动画连接器,实现更好的可视化效果
## MCP服务器 ## MCP服务器(预览)
> **预览功能**:此功能为实验性功能,可能不稳定。
通过MCP模型上下文协议在Claude Desktop、Cursor和VS Code等AI代理中使用Next AI Draw.io。 通过MCP模型上下文协议在Claude Desktop、Cursor和VS Code等AI代理中使用Next AI Draw.io。
@@ -204,7 +206,6 @@ npm run dev
- Azure OpenAI - Azure OpenAI
- Ollama - Ollama
- OpenRouter - OpenRouter
- AIHubMix
- DeepSeek - DeepSeek
- SiliconFlow - SiliconFlow
- ModelScope - ModelScope
@@ -217,18 +218,12 @@ npm run dev
### 服务端多模型配置 ### 服务端多模型配置
管理员可以配置多个服务端模型,让所有用户无需提供个人 API Key 即可使用。通过 `AI_MODELS_CONFIG` 环境变量JSON 字符串)或 `ai-models.json` 文件配置。如果只需要单 provider 下的多个模型,也可以直接在 `AI_MODEL` 中用逗号分隔模型 ID。 管理员可以配置多个服务端模型,让所有用户无需提供个人 API Key 即可使用。通过 `AI_MODELS_CONFIG` 环境变量JSON 字符串)或 `ai-models.json` 文件配置。
**模型要求**此任务需要强大的模型能力因为它涉及生成具有严格格式约束的长文本draw.io XML。推荐使用 Claude Sonnet 4.5、GPT-5.1、Gemini 3 Pro 和 DeepSeek V3.2/R1。 **模型要求**此任务需要强大的模型能力因为它涉及生成具有严格格式约束的长文本draw.io XML。推荐使用 Claude Sonnet 4.5、GPT-5.1、Gemini 3 Pro 和 DeepSeek V3.2/R1。
注意:`claude` 系列已在带有 AWS、Azure、GCP 等云架构 Logo 的 draw.io 图表上进行训练,因此如果您想创建云架构图,这是最佳选择。 注意:`claude` 系列已在带有 AWS、Azure、GCP 等云架构 Logo 的 draw.io 图表上进行训练,因此如果您想创建云架构图,这是最佳选择。
### 管理面板
设置 `ADMIN_PASSWORD` 环境变量并访问 `/admin`,即可在 Web 面板中管理服务端设置(模型、访问码、功能开关、可观测性、配额),无需手动编辑 `.env`
📖 **[管理面板指南](./admin-panel.md)** — 启用方法、优先级规则和注意事项。
## 工作原理 ## 工作原理

View File

@@ -1,24 +0,0 @@
# 管理面板
无需手动编辑 `.env`,您可以在 Web 管理面板中管理服务端设置。
## 启用面板
1. 设置 `ADMIN_PASSWORD` 环境变量(不设置则面板禁用)。
2. 访问 `/admin` 并登录。
## 可配置内容
1. **Models模型** — 添加提供商及其 API Key 和模型列表,交互与应用内的模型设置相同。保存后这些模型成为所有用户可用的服务端模型,并在请求时与环境中的 `AI_MODELS_CONFIG` / `ai-models.json` 合并(面板不会修改这些环境文件)。
2. **其余区块** — 访问码、生成参数、功能开关、可观测性和配额。保存的设置会写入 `data/settings.json` 并立即生效,无需重启(少数设置如 Langfuse 和 DynamoDB 标记为"需要重启")。
## 优先级
面板中保存的设置覆盖环境变量,环境变量覆盖内置默认值。删除已保存的值会回退到环境变量。
## 注意事项
- 密钥以明文形式存储在 `data/settings.json` 中(文件权限 600请妥善保管该文件。
- 在无服务器平台Vercel、Cloudflare Workers上没有持久化磁盘面板为只读 — 请改用环境变量配置。
- 使用 Docker 时,`data/` 目录通过 `docker-compose.yml` 中的卷持久化。
- `NEXT_PUBLIC_*` 变量在构建时固化,无法在面板中修改。

View File

@@ -46,21 +46,6 @@ AI_MODEL=gpt-4o
OPENAI_BASE_URL=https://your-custom-endpoint/v1 OPENAI_BASE_URL=https://your-custom-endpoint/v1
``` ```
### AIHubMix
AIHubMix 通过单个 API Key 聚合 Claude、GPT、Gemini、DeepSeek 等模型。
```bash
AIHUBMIX_API_KEY=your_api_key
AI_MODEL=claude-sonnet-4-5-20250929
```
可选的自定义端点:
```bash
AIHUBMIX_BASE_URL=https://aihubmix.com/v1
```
### Anthropic ### Anthropic
```bash ```bash
@@ -68,13 +53,6 @@ ANTHROPIC_API_KEY=your_api_key
AI_MODEL=claude-sonnet-4-5-20250514 AI_MODEL=claude-sonnet-4-5-20250514
``` ```
或者使用 Bearer 认证令牌(例如通过会下发 OAuth 风格 token 的网关时)。`ANTHROPIC_AUTH_TOKEN` 会作为 `Authorization: Bearer <token>` 头发送,而 `ANTHROPIC_API_KEY` 会作为 `x-api-key` 头发送。两者互斥,只能设置其中之一:
```bash
ANTHROPIC_AUTH_TOKEN=your_auth_token
AI_MODEL=claude-sonnet-4-5-20250514
```
可选的自定义端点: 可选的自定义端点:
```bash ```bash
@@ -237,7 +215,7 @@ MiniMax 支持两种 API 格式:
```bash ```bash
MINIMAX_API_KEY=your_api_key MINIMAX_API_KEY=your_api_key
AI_MODEL=MiniMax-M3 AI_MODEL=MiniMax-M2.7
``` ```
可选配置: 可选配置:
@@ -315,7 +293,7 @@ QINIU_BASE_URL=https://your-custom-endpoint
如果您配置了**多个** API 密钥,则必须显式设置 `AI_PROVIDER` 如果您配置了**多个** API 密钥,则必须显式设置 `AI_PROVIDER`
```bash ```bash
AI_PROVIDER=google # 或openai, anthropic, aihubmix, deepseek, siliconflow, doubao, azure, bedrock, openrouter, ollama, gateway, sglang, modelscope, minimax, glm, qwen, kimi, qiniu AI_PROVIDER=google # 或openai, anthropic, deepseek, siliconflow, doubao, azure, bedrock, openrouter, ollama, gateway, sglang, modelscope, minimax, glm, qwen, kimi, qiniu
``` ```
## 服务端多模型配置 ## 服务端多模型配置
@@ -336,17 +314,6 @@ AI_MODELS_CONFIG='{"providers":[{"name":"OpenAI","provider":"openai","models":["
在项目根目录创建 `ai-models.json` 文件(或通过 `AI_MODELS_CONFIG_PATH` 指定路径)。 在项目根目录创建 `ai-models.json` 文件(或通过 `AI_MODELS_CONFIG_PATH` 指定路径)。
**方式三:`AI_MODEL` 用逗号分隔**(单 provider 的快速配置)
如果只需要暴露同一 provider 下的多个模型,可以直接在 `AI_MODEL` 里用逗号分隔。第一个模型会作为默认值。
```bash
AI_PROVIDER=doubao
AI_MODEL=doubao-seed-1-8-251215,doubao-seed-1-6-flash,doubao-seed-1-6-pro
```
这是等价 `ai-models.json` 的简写形式。如果需要配置多个 provider或自定义 `apiKeyEnv` / `baseUrlEnv`,请使用方式一或方式二。
### 配置示例 ### 配置示例
```json ```json

View File

@@ -1,24 +0,0 @@
# Admin Panel
Instead of hand-editing `.env`, you can manage server settings in a web admin panel.
## Enabling the panel
1. Set the `ADMIN_PASSWORD` environment variable (leave unset to disable the panel).
2. Visit `/admin` and sign in.
## What you can configure
1. **Models** — add providers with their API keys and model lists, using the same UI as the in-app model settings. Saved models become server-side models available to all users, merged with any `AI_MODELS_CONFIG` / `ai-models.json` from your environment at request time (the panel does not modify those env files).
2. **Other sections** — access codes, generation parameters, features, observability, and quota. Saved settings are written to `data/settings.json` and apply immediately — no restart needed (a few settings such as Langfuse and DynamoDB are marked "Restart Required").
## Precedence
Settings saved in the panel override environment variables, which override built-in defaults. Removing a saved value falls back to the environment variable.
## Notes
- Secrets are stored in plaintext in `data/settings.json` (file mode 600). Keep the file private.
- On serverless platforms (Vercel, Cloudflare Workers) there is no persistent disk, so the panel is read-only — configure via environment variables there.
- With Docker, the `data/` directory is persisted via the volume in `docker-compose.yml`.
- `NEXT_PUBLIC_*` variables are baked in at build time and cannot be changed in the panel.

View File

@@ -61,21 +61,6 @@ Optional custom endpoint (for OpenAI-compatible services):
OPENAI_BASE_URL=https://your-custom-endpoint/v1 OPENAI_BASE_URL=https://your-custom-endpoint/v1
``` ```
### AIHubMix
AIHubMix provides access to Claude, GPT, Gemini, DeepSeek, and other models through a single API key.
```bash
AIHUBMIX_API_KEY=your_api_key
AI_MODEL=claude-sonnet-4-5-20250929
```
Optional custom endpoint:
```bash
AIHUBMIX_BASE_URL=https://aihubmix.com/v1
```
### Anthropic ### Anthropic
```bash ```bash
@@ -83,13 +68,6 @@ ANTHROPIC_API_KEY=your_api_key
AI_MODEL=claude-sonnet-4-5-20250514 AI_MODEL=claude-sonnet-4-5-20250514
``` ```
Or use a Bearer auth token instead of an API key (e.g. when going through a gateway that issues OAuth-style tokens). `ANTHROPIC_AUTH_TOKEN` is sent as `Authorization: Bearer <token>`, while `ANTHROPIC_API_KEY` is sent as `x-api-key`. The two are mutually exclusive — set only one:
```bash
ANTHROPIC_AUTH_TOKEN=your_auth_token
AI_MODEL=claude-sonnet-4-5-20250514
```
Optional custom endpoint: Optional custom endpoint:
```bash ```bash
@@ -252,7 +230,7 @@ MiniMax supports two API formats:
```bash ```bash
MINIMAX_API_KEY=your_api_key MINIMAX_API_KEY=your_api_key
AI_MODEL=MiniMax-M3 AI_MODEL=MiniMax-M2.7
``` ```
Optional configuration: Optional configuration:
@@ -330,7 +308,7 @@ If you only configure **one** provider's API key, the system will automatically
If you configure **multiple** API keys, you must explicitly set `AI_PROVIDER`: If you configure **multiple** API keys, you must explicitly set `AI_PROVIDER`:
```bash ```bash
AI_PROVIDER=google # or: openai, anthropic, aihubmix, deepseek, siliconflow, doubao, azure, bedrock, openrouter, ollama, gateway, sglang, modelscope, minimax, glm, qwen, kimi, qiniu AI_PROVIDER=google # or: openai, anthropic, deepseek, siliconflow, doubao, azure, bedrock, openrouter, ollama, gateway, sglang, modelscope, minimax, glm, qwen, kimi, qiniu
``` ```
## Server-Side Multi-Model Configuration ## Server-Side Multi-Model Configuration
@@ -351,17 +329,6 @@ AI_MODELS_CONFIG='{"providers":[{"name":"OpenAI","provider":"openai","models":["
Create an `ai-models.json` file in the project root (or set `AI_MODELS_CONFIG_PATH` to a custom location). Create an `ai-models.json` file in the project root (or set `AI_MODELS_CONFIG_PATH` to a custom location).
**Option 3: Comma-separated `AI_MODEL`** (quick setup, single provider)
If you only need multiple models from one provider, list them in `AI_MODEL` separated by commas. The first model is treated as the default.
```bash
AI_PROVIDER=doubao
AI_MODEL=doubao-seed-1-8-251215,doubao-seed-1-6-flash,doubao-seed-1-6-pro
```
This is shorthand for the equivalent `ai-models.json`. For multiple providers or custom `apiKeyEnv` / `baseUrlEnv`, use Option 1 or 2 instead.
### Example Configuration ### Example Configuration
```json ```json

View File

@@ -28,7 +28,7 @@ https://github.com/user-attachments/assets/b2eef5f3-b335-4e71-a755-dc2e80931979
- [目次](#目次) - [目次](#目次)
- [](#例) - [](#例)
- [機能](#機能) - [機能](#機能)
- [MCPサーバー](#mcpサーバー) - [MCPサーバー(プレビュー)](#mcpサーバープレビュー)
- [Claude Code CLI](#claude-code-cli) - [Claude Code CLI](#claude-code-cli)
- [はじめに](#はじめに) - [はじめに](#はじめに)
- [オンラインで試す](#オンラインで試す) - [オンラインで試す](#オンラインで試す)
@@ -54,31 +54,31 @@ https://github.com/user-attachments/assets/b2eef5f3-b335-4e71-a755-dc2e80931979
<tr> <tr>
<td colspan="2" valign="top" align="center"> <td colspan="2" valign="top" align="center">
<strong>アニメーションTransformerコネクタ</strong><br /> <strong>アニメーションTransformerコネクタ</strong><br />
<p><strong>Prompt:</strong> Give me a **animated connector** diagram of transformer's architecture.</p> <p><strong>プロンプト:</strong> **アニメーションコネクタ**付きのTransformerアーキテクチャ図を作成してください。</p>
<img src="../../public/animated_connectors.svg" alt="アニメーションコネクタ付きTransformerアーキテクチャ" width="480" /> <img src="../../public/animated_connectors.svg" alt="アニメーションコネクタ付きTransformerアーキテクチャ" width="480" />
</td> </td>
</tr> </tr>
<tr> <tr>
<td width="50%" valign="top"> <td width="50%" valign="top">
<strong>RAG技術ダイアグラム</strong><br /> <strong>GCPアーキテクチャ図</strong><br />
<p><strong>Prompt:</strong> Generate a RAG architecture diagram for **chat application**. Use connected diagram for data ingestion</p> <p><strong>プロンプト:</strong> **GCPアイコン**を使用してGCPアーキテクチャ図を生成してください。この図では、ユーザーがインスタンス上でホストされているフロントエンドに接続します。</p>
<img src="../../public/rag_prod.svg" alt="RAGアーキテクチャ図" width="480" /> <img src="../../public/gcp_demo.svg" alt="GCPアーキテクチャ図" width="480" />
</td> </td>
<td width="50%" valign="top"> <td width="50%" valign="top">
<strong>ReactとAWSによる認証</strong><br /> <strong>AWSアーキテクチャ図</strong><br />
<p><strong>Prompt:</strong> Generate authentication process using React with **AWS**. Use Serverless architecture.</p> <p><strong>プロンプト:</strong> **AWSアイコン**を使用してAWSアーキテクチャ図を生成してください。この図では、ユーザーがインスタンス上でホストされているフロントエンドに接続します。</p>
<img src="../../public/auth.svg" alt="認証アーキテクチャ図" width="480" /> <img src="../../public/aws_demo.svg" alt="AWSアーキテクチャ図" width="480" />
</td> </td>
</tr> </tr>
<tr> <tr>
<td width="50%" valign="top"> <td width="50%" valign="top">
<strong>オープンイノベーション</strong><br /> <strong>Azureアーキテクチャ図</strong><br />
<p><strong>Prompt:</strong> Create visualization of Henry Chesbrough's Open Innovation model.</p> <p><strong>プロンプト:</strong> **Azureアイコン**を使用してAzureアーキテクチャ図を生成してください。この図では、ユーザーがインスタンス上でホストされているフロントエンドに接続します。</p>
<img src="../../public/inno.svg" alt="オープンイノベーション図" width="480" /> <img src="../../public/azure_demo.svg" alt="Azureアーキテクチャ図" width="480" />
</td> </td>
<td width="50%" valign="top"> <td width="50%" valign="top">
<strong>猫のスケッチ</strong><br /> <strong>猫のスケッチ</strong><br />
<p><strong>Prompt:</strong> Draw a cute cat for me.</p> <p><strong>プロンプト:</strong> かわいい猫を描いてください。</p>
<img src="../../public/cat_demo.svg" alt="猫の絵" width="240" /> <img src="../../public/cat_demo.svg" alt="猫の絵" width="240" />
</td> </td>
</tr> </tr>
@@ -96,7 +96,9 @@ https://github.com/user-attachments/assets/b2eef5f3-b335-4e71-a755-dc2e80931979
- **クラウドアーキテクチャダイアグラムサポート**クラウドアーキテクチャダイアグラムの生成を専門的にサポートAWS、GCP、Azure - **クラウドアーキテクチャダイアグラムサポート**クラウドアーキテクチャダイアグラムの生成を専門的にサポートAWS、GCP、Azure
- **アニメーションコネクタ**:より良い可視化のためにダイアグラム要素間に動的でアニメーション化されたコネクタを作成 - **アニメーションコネクタ**:より良い可視化のためにダイアグラム要素間に動的でアニメーション化されたコネクタを作成
## MCPサーバー ## MCPサーバー(プレビュー)
> **プレビュー機能**:この機能は実験的であり、安定しない可能性があります。
MCPModel Context Protocolを介して、Claude Desktop、Cursor、VS CodeなどのAIエージェントでNext AI Draw.ioを使用できます。 MCPModel Context Protocolを介して、Claude Desktop、Cursor、VS CodeなどのAIエージェントでNext AI Draw.ioを使用できます。
@@ -203,7 +205,6 @@ Next.jsアプリをデプロイする最も簡単な方法は、Next.jsの作成
- Azure OpenAI - Azure OpenAI
- Ollama - Ollama
- OpenRouter - OpenRouter
- AIHubMix
- DeepSeek - DeepSeek
- SiliconFlow - SiliconFlow
- ModelScope - ModelScope
@@ -216,18 +217,12 @@ AWS BedrockとOpenRouter以外のすべてのプロバイダーはカスタム
### サーバーサイドマルチモデル設定 ### サーバーサイドマルチモデル設定
管理者は、ユーザーが個人のAPIキーを提供することなく利用できる複数のサーバーサイドモデルを設定できます。`AI_MODELS_CONFIG` 環境変数JSON文字列または `ai-models.json` ファイルで設定します。同一プロバイダー内の複数モデルだけが必要な場合は、`AI_MODEL` にカンマ区切りでモデルIDを列挙する簡易設定も使えます。 管理者は、ユーザーが個人のAPIキーを提供することなく利用できる複数のサーバーサイドモデルを設定できます。`AI_MODELS_CONFIG` 環境変数JSON文字列または `ai-models.json` ファイルで設定します。
**モデル要件**このタスクは厳密なフォーマット制約draw.io XMLを持つ長文テキスト生成を伴うため、強力なモデル機能が必要です。Claude Sonnet 4.5、GPT-5.1、Gemini 3 Pro、DeepSeek V3.2/R1を推奨します。 **モデル要件**このタスクは厳密なフォーマット制約draw.io XMLを持つ長文テキスト生成を伴うため、強力なモデル機能が必要です。Claude Sonnet 4.5、GPT-5.1、Gemini 3 Pro、DeepSeek V3.2/R1を推奨します。
注:`claude`シリーズはAWS、Azure、GCPなどのクラウドアーキテクチャロゴ付きのdraw.ioダイアグラムで学習されているため、クラウドアーキテクチャダイアグラムを作成したい場合は最適な選択です。 注:`claude`シリーズはAWS、Azure、GCPなどのクラウドアーキテクチャロゴ付きのdraw.ioダイアグラムで学習されているため、クラウドアーキテクチャダイアグラムを作成したい場合は最適な選択です。
### 管理パネル
`ADMIN_PASSWORD` 環境変数を設定して `/admin` にアクセスすると、`.env` を手動で編集する代わりに Web パネルでサーバー設定(モデル、アクセスコード、機能、可観測性、クォータ)を管理できます。
📖 **[管理パネルガイド](./admin-panel.md)** — 有効化の方法、優先順位ルール、注意事項。
## 仕組み ## 仕組み

View File

@@ -1,24 +0,0 @@
# 管理パネル
`.env` を手動で編集する代わりに、Web 管理パネルでサーバー設定を管理できます。
## パネルの有効化
1. `ADMIN_PASSWORD` 環境変数を設定します(未設定の場合、パネルは無効になります)。
2. `/admin` にアクセスしてサインインします。
## 設定できる項目
1. **Modelsモデル** — アプリ内のモデル設定と同じ UI で、プロバイダーの API キーとモデルリストを追加します。保存するとそれらは全ユーザーが利用できるサーバーサイドモデルになり、リクエスト時に環境の `AI_MODELS_CONFIG` / `ai-models.json` とマージされます(パネルがこれらの環境ファイルを変更することはありません)。
2. **その他のセクション** — アクセスコード、生成パラメータ、機能、可観測性、クォータ。保存された設定は `data/settings.json` に書き込まれ、即座に反映されます — 再起動は不要ですLangfuse や DynamoDB など一部の設定は「再起動が必要」と表示されます)。
## 優先順位
パネルで保存された設定は環境変数を上書きし、環境変数は組み込みのデフォルト値を上書きします。保存した値を削除すると環境変数にフォールバックします。
## 注意事項
- シークレットは `data/settings.json` に平文で保存されます(ファイルモード 600。このファイルは非公開に保ってください。
- サーバーレスプラットフォームVercel、Cloudflare Workersには永続ディスクがないため、パネルは読み取り専用です — その環境では環境変数で設定してください。
- Docker 使用時は、`data/` ディレクトリが `docker-compose.yml` のボリュームで永続化されます。
- `NEXT_PUBLIC_*` 変数はビルド時に固定され、パネルでは変更できません。

View File

@@ -46,21 +46,6 @@ AI_MODEL=gpt-4o
OPENAI_BASE_URL=https://your-custom-endpoint/v1 OPENAI_BASE_URL=https://your-custom-endpoint/v1
``` ```
### AIHubMix
AIHubMix は、単一の API キーで Claude、GPT、Gemini、DeepSeek などのモデルへのアクセスを提供します。
```bash
AIHUBMIX_API_KEY=your_api_key
AI_MODEL=claude-sonnet-4-5-20250929
```
任意のカスタムエンドポイント:
```bash
AIHUBMIX_BASE_URL=https://aihubmix.com/v1
```
### Anthropic ### Anthropic
```bash ```bash
@@ -68,13 +53,6 @@ ANTHROPIC_API_KEY=your_api_key
AI_MODEL=claude-sonnet-4-5-20250514 AI_MODEL=claude-sonnet-4-5-20250514
``` ```
または、Bearer 認証トークンを使用することもできますOAuth スタイルのトークンを発行するゲートウェイ経由で利用する場合など)。`ANTHROPIC_AUTH_TOKEN``Authorization: Bearer <token>` ヘッダーで送信され、`ANTHROPIC_API_KEY``x-api-key` ヘッダーで送信されます。両者は排他的なので、いずれか一方のみを設定してください:
```bash
ANTHROPIC_AUTH_TOKEN=your_auth_token
AI_MODEL=claude-sonnet-4-5-20250514
```
任意のカスタムエンドポイント: 任意のカスタムエンドポイント:
```bash ```bash
@@ -237,7 +215,7 @@ MiniMax は 2 つの API 形式をサポートしています:
```bash ```bash
MINIMAX_API_KEY=your_api_key MINIMAX_API_KEY=your_api_key
AI_MODEL=MiniMax-M3 AI_MODEL=MiniMax-M2.7
``` ```
オプション設定: オプション設定:
@@ -315,7 +293,7 @@ QINIU_BASE_URL=https://your-custom-endpoint
**複数**の API キーを設定する場合は、`AI_PROVIDER` を明示的に設定する必要があります: **複数**の API キーを設定する場合は、`AI_PROVIDER` を明示的に設定する必要があります:
```bash ```bash
AI_PROVIDER=google # または: openai, anthropic, aihubmix, deepseek, siliconflow, doubao, azure, bedrock, openrouter, ollama, gateway, sglang, modelscope, minimax, glm, qwen, kimi, qiniu AI_PROVIDER=google # または: openai, anthropic, deepseek, siliconflow, doubao, azure, bedrock, openrouter, ollama, gateway, sglang, modelscope, minimax, glm, qwen, kimi, qiniu
``` ```
## サーバーサイドマルチモデル設定 ## サーバーサイドマルチモデル設定
@@ -336,17 +314,6 @@ AI_MODELS_CONFIG='{"providers":[{"name":"OpenAI","provider":"openai","models":["
プロジェクトルートに `ai-models.json` ファイルを作成します(または `AI_MODELS_CONFIG_PATH` でパスを指定)。 プロジェクトルートに `ai-models.json` ファイルを作成します(または `AI_MODELS_CONFIG_PATH` でパスを指定)。
**方法3`AI_MODEL` をカンマ区切りで指定**(単一プロバイダーの簡易設定)
同一プロバイダー内の複数モデルだけを公開したい場合は、`AI_MODEL` にカンマ区切りで列挙できます。最初のモデルがデフォルトになります。
```bash
AI_PROVIDER=doubao
AI_MODEL=doubao-seed-1-8-251215,doubao-seed-1-6-flash,doubao-seed-1-6-pro
```
これは等価な `ai-models.json` の簡易表記です。複数のプロバイダーや、カスタム `apiKeyEnv` / `baseUrlEnv` を使う場合は、方法1または方法2を使ってください。
### 設定例 ### 設定例
```json ```json

View File

@@ -95,10 +95,6 @@ linux:
arch: arch:
- x64 - x64
- arm64 - arm64
- target: rpm
arch:
- x64
- arm64
# Publish configuration (optional) # Publish configuration (optional)
publish: publish:

View File

@@ -2,6 +2,14 @@
* Type declarations for Electron API exposed via preload script * Type declarations for Electron API exposed via preload script
*/ */
/** Update status data sent from main process */
type UpdateStatusData =
| { status: "available"; version: string }
| { status: "available-manual"; version: string; url: string }
| { status: "downloading"; percent: number }
| { status: "downloaded" }
| { status: "error"; message: string }
/** Configuration preset interface */ /** Configuration preset interface */
interface ConfigPreset { interface ConfigPreset {
id: string id: string
@@ -74,6 +82,12 @@ declare global {
> >
/** Set user's preferred locale */ /** Set user's preferred locale */
setUserLocale: (locale: string) => Promise<SetUserLocaleResult> setUserLocale: (locale: string) => Promise<SetUserLocaleResult>
/** Listen for update status events from main process */
onUpdateStatus: (
callback: (data: UpdateStatusData) => void,
) => () => void
/** Start downloading the available update */
startDownload: () => Promise<void>
} }
/** Settings window Electron API */ /** Settings window Electron API */
@@ -101,8 +115,8 @@ declare global {
} }
export type { export type {
ApplyPresetResult,
ConfigPreset, ConfigPreset,
ApplyPresetResult,
ProxyConfig, ProxyConfig,
SetProxyResult, SetProxyResult,
SetUserLocaleResult, SetUserLocaleResult,

View File

@@ -6,6 +6,7 @@ import {
type MenuItemConstructorOptions, type MenuItemConstructorOptions,
shell, shell,
} from "electron" } from "electron"
import { checkForUpdatesManual } from "./auto-updater"
import { import {
applyPresetToEnv, applyPresetToEnv,
getAllPresets, getAllPresets,
@@ -156,6 +157,11 @@ function getMenuTemplate(): MenuItemConstructorOptions[] {
template.push({ template.push({
label: t.help, label: t.help,
submenu: [ submenu: [
{
label: t.checkForUpdates,
click: () => checkForUpdatesManual(),
},
{ type: "separator" },
{ {
label: t.documentation, label: t.documentation,
click: async () => { click: async () => {

View File

@@ -0,0 +1,282 @@
import https from "node:https"
import { app, dialog, ipcMain } from "electron"
import electronUpdater from "electron-updater"
import { getMainWindow } from "./window-manager"
const { autoUpdater } = electronUpdater
const CHECK_INTERVAL = 4 * 60 * 60 * 1000 // 4 hours
const STARTUP_DELAY = 10_000 // 10 seconds
const GITHUB_API_URL =
"https://api.github.com/repos/DayuanJiang/next-ai-draw-io/releases/latest"
let isChecking = false
let updateDownloaded = false
/**
* Whether this platform supports electron-updater auto-update.
* macOS: disabled because builds are ad-hoc signed (no Apple Developer cert).
*/
function supportsAutoUpdate(): boolean {
if (process.platform === "darwin") return false
if (process.platform === "win32" && process.env.PORTABLE_EXECUTABLE_DIR)
return false
if (process.platform === "linux" && !process.env.APPIMAGE) return false
return true
}
/**
* Compare two semver-like version strings numerically.
* Returns true if remote > local.
* Strips prerelease/build metadata (e.g., "1.2.3-beta.1" → "1.2.3").
*/
function isNewerVersion(remote: string, local: string): boolean {
const strip = (v: string) => v.replace(/^v/, "").split("-")[0].split("+")[0]
const r = strip(remote).split(".").map(Number)
const l = strip(local).split(".").map(Number)
const len = Math.max(r.length, l.length)
for (let i = 0; i < len; i++) {
const rv = r[i] || 0
const lv = l[i] || 0
if (rv > lv) return true
if (rv < lv) return false
}
return false
}
/**
* Send update status to the renderer via IPC
*/
function sendStatus(data: Record<string, unknown>) {
const win = getMainWindow()
if (win && !win.isDestroyed()) {
win.webContents.send("update-status", data)
}
}
/**
* Check GitHub API for latest release (used on macOS and Linux DEB)
*/
function checkGitHubRelease(manual: boolean) {
const req = https.get(
GITHUB_API_URL,
{
headers: { "User-Agent": "next-ai-draw-io" },
timeout: 15000,
},
(res) => {
if (res.statusCode !== 200) {
console.error(`GitHub API returned status ${res.statusCode}`)
if (manual) {
dialog.showMessageBox({
type: "error",
title: "Update Check Failed",
message:
"Could not check for updates. Please try again later.",
})
}
isChecking = false
return
}
res.setEncoding("utf8")
let body = ""
res.on("data", (chunk: string) => {
body += chunk
})
res.on("end", () => {
try {
const data = JSON.parse(body)
const remoteVersion = data.tag_name || ""
const localVersion = app.getVersion()
if (isNewerVersion(remoteVersion, localVersion)) {
sendStatus({
status: "available-manual",
version: remoteVersion.replace(/^v/, ""),
url: data.html_url,
})
} else if (manual) {
dialog.showMessageBox({
type: "info",
title: "No Updates",
message: "You're up to date!",
detail: `Version ${localVersion} is the latest version.`,
})
}
} catch (err) {
console.error("Failed to parse GitHub release:", err)
if (manual) {
dialog.showMessageBox({
type: "error",
title: "Update Check Failed",
message:
"Could not check for updates. Please try again later.",
})
}
}
isChecking = false
})
},
)
req.on("timeout", () => {
req.destroy()
isChecking = false
})
req.on("error", (err) => {
console.error("GitHub API request failed:", err)
if (manual) {
dialog.showMessageBox({
type: "error",
title: "Update Check Failed",
message: "Could not check for updates. Please try again later.",
})
}
isChecking = false
})
req.end()
}
/**
* Set up electron-updater event handlers (Windows NSIS / Linux AppImage)
*/
function setupAutoUpdater() {
autoUpdater.autoDownload = false
autoUpdater.autoInstallOnAppQuit = true
autoUpdater.on("update-available", (info) => {
console.log("Update available:", info.version)
sendStatus({ status: "available", version: info.version })
isChecking = false
})
autoUpdater.on("update-not-available", () => {
console.log("No update available")
isChecking = false
})
autoUpdater.on("download-progress", (progress) => {
sendStatus({
status: "downloading",
percent: progress.percent,
})
})
autoUpdater.on("update-downloaded", () => {
updateDownloaded = true
console.log("Update downloaded")
sendStatus({ status: "downloaded" })
showRestartDialog()
})
autoUpdater.on("error", (err) => {
console.error("Auto-update error:", err)
sendStatus({ status: "error", message: String(err) })
isChecking = false
})
// IPC: renderer requests download
ipcMain.handle("updater:start-download", () => {
return autoUpdater.downloadUpdate()
})
}
/**
* Show restart dialog after update downloaded
*/
async function showRestartDialog() {
const result = await dialog.showMessageBox({
type: "info",
buttons: ["Restart Now", "Later"],
defaultId: 0,
cancelId: 1,
title: "Update Ready",
message: "A new version has been downloaded.",
detail: "Restart the app to install the update.",
})
if (result.response === 0) {
autoUpdater.quitAndInstall()
}
}
/**
* Run a single update check
*/
function doCheck(manual: boolean) {
if (isChecking) return
isChecking = true
// If update already downloaded, just re-show restart dialog
if (updateDownloaded && supportsAutoUpdate()) {
isChecking = false
showRestartDialog()
return
}
if (supportsAutoUpdate()) {
// For manual check, register listeners BEFORE triggering check
// to avoid race where event fires before listeners are attached
if (manual) {
const onNotAvailable = () => {
dialog.showMessageBox({
type: "info",
title: "No Updates",
message: "You're up to date!",
detail: `Version ${app.getVersion()} is the latest version.`,
})
cleanup()
}
const onAvailable = () => cleanup()
const onError = () => cleanup()
const cleanup = () => {
autoUpdater.off("update-not-available", onNotAvailable)
autoUpdater.off("update-available", onAvailable)
autoUpdater.off("error", onError)
}
autoUpdater.once("update-not-available", onNotAvailable)
autoUpdater.once("update-available", onAvailable)
autoUpdater.once("error", onError)
}
autoUpdater.checkForUpdates().catch((err) => {
console.error("checkForUpdates failed:", err)
isChecking = false
})
} else {
checkGitHubRelease(manual)
}
}
/**
* Initialize auto-updater. Call once after createWindow().
*/
export function initAutoUpdater() {
if (!app.isPackaged) return
if (supportsAutoUpdate()) {
setupAutoUpdater()
} else {
// Register no-op handler so renderer doesn't get an unhandled error
ipcMain.handle("updater:start-download", () => {})
}
// First check after startup delay
setTimeout(() => doCheck(false), STARTUP_DELAY)
// Periodic checks
setInterval(() => doCheck(false), CHECK_INTERVAL)
}
/**
* Manual update check from menu item
*/
export function checkForUpdatesManual() {
if (!app.isPackaged) {
dialog.showMessageBox({
type: "info",
title: "Development Mode",
message: "Auto-update is not available in development mode.",
})
return
}
doCheck(true)
}

View File

@@ -1,5 +1,6 @@
import { app, BrowserWindow, dialog, shell } from "electron" import { app, BrowserWindow, dialog, shell } from "electron"
import { buildAppMenu } from "./app-menu" import { buildAppMenu } from "./app-menu"
import { initAutoUpdater } from "./auto-updater"
import { getCurrentPresetEnv } from "./config-manager" import { getCurrentPresetEnv } from "./config-manager"
import { loadEnvFile } from "./env-loader" import { loadEnvFile } from "./env-loader"
import { registerIpcHandlers } from "./ipc-handlers" import { registerIpcHandlers } from "./ipc-handlers"
@@ -58,6 +59,11 @@ if (!gotTheLock) {
// Create main window // Create main window
createWindow(serverUrl) createWindow(serverUrl)
// Initialize auto-updater (production only)
if (!isDev) {
initAutoUpdater()
}
} catch (error) { } catch (error) {
console.error("Failed to start application:", error) console.error("Failed to start application:", error)
dialog.showErrorBox( dialog.showErrorBox(

View File

@@ -33,6 +33,7 @@ export interface MenuTranslations {
help: string help: string
documentation: string documentation: string
reportIssue: string reportIssue: string
checkForUpdates: string
} }
const translations: Record<MenuLocale, MenuTranslations> = { const translations: Record<MenuLocale, MenuTranslations> = {
@@ -62,6 +63,7 @@ const translations: Record<MenuLocale, MenuTranslations> = {
help: "Help", help: "Help",
documentation: "Documentation", documentation: "Documentation",
reportIssue: "Report Issue", reportIssue: "Report Issue",
checkForUpdates: "Check for Updates...",
}, },
zh: { zh: {
@@ -90,6 +92,7 @@ const translations: Record<MenuLocale, MenuTranslations> = {
help: "帮助", help: "帮助",
documentation: "文档", documentation: "文档",
reportIssue: "报告问题", reportIssue: "报告问题",
checkForUpdates: "检查更新...",
}, },
ja: { ja: {
@@ -118,6 +121,7 @@ const translations: Record<MenuLocale, MenuTranslations> = {
help: "ヘルプ", help: "ヘルプ",
documentation: "ドキュメント", documentation: "ドキュメント",
reportIssue: "問題を報告", reportIssue: "問題を報告",
checkForUpdates: "アップデートを確認...",
}, },
"zh-Hant": { "zh-Hant": {
@@ -146,6 +150,7 @@ const translations: Record<MenuLocale, MenuTranslations> = {
help: "說明", help: "說明",
documentation: "文件", documentation: "文件",
reportIssue: "回報問題", reportIssue: "回報問題",
checkForUpdates: "檢查更新...",
}, },
} }

View File

@@ -60,13 +60,6 @@ export function createWindow(serverUrl: string): BrowserWindow {
mainWindow.webContents.openDevTools() mainWindow.webContents.openDevTools()
} }
// Override the draw.io iframe's beforeunload handler so the window can
// close after the user edits text in a shape (fixes #815). Diagrams are
// already persisted via autosave, so the prompt is unnecessary.
mainWindow.webContents.on("will-prevent-unload", (event) => {
event.preventDefault()
})
mainWindow.on("closed", () => { mainWindow.on("closed", () => {
mainWindow = null mainWindow = null
}) })

View File

@@ -1,4 +1,12 @@
import { contextBridge, ipcRenderer } from "electron" import { contextBridge, type IpcRendererEvent, ipcRenderer } from "electron"
// Locally defined to avoid dependency on electron.d.ts compilation scope
type UpdateStatus =
| { status: "available"; version: string }
| { status: "available-manual"; version: string; url: string }
| { status: "downloading"; percent: number }
| { status: "downloaded" }
| { status: "error"; message: string }
/** /**
* Expose safe APIs to the renderer process * Expose safe APIs to the renderer process
@@ -31,4 +39,13 @@ contextBridge.exposeInMainWorld("electronAPI", {
getUserLocale: () => ipcRenderer.invoke("get-user-locale"), getUserLocale: () => ipcRenderer.invoke("get-user-locale"),
setUserLocale: (locale: string) => setUserLocale: (locale: string) =>
ipcRenderer.invoke("set-user-locale", locale), ipcRenderer.invoke("set-user-locale", locale),
// Auto-update
onUpdateStatus: (callback: (data: UpdateStatus) => void) => {
const handler = (_event: IpcRendererEvent, data: UpdateStatus) =>
callback(data)
ipcRenderer.on("update-status", handler)
return () => ipcRenderer.removeListener("update-status", handler)
},
startDownload: () => ipcRenderer.invoke("updater:start-download"),
}) })

View File

@@ -1,14 +1,10 @@
# AI Provider Configuration # AI Provider Configuration
# AI_PROVIDER: Which provider to use # AI_PROVIDER: Which provider to use
# Options: bedrock, openai, anthropic, google, vertexai, azure, ollama, openrouter, aihubmix, deepseek, siliconflow, gateway, novita # Options: bedrock, openai, anthropic, google, vertexai, azure, ollama, openrouter, deepseek, siliconflow, gateway, novita
# Default: bedrock # Default: bedrock
AI_PROVIDER=bedrock AI_PROVIDER=bedrock
# AI_MODEL: The model ID for your chosen provider (REQUIRED) # AI_MODEL: The model ID for your chosen provider (REQUIRED)
# Tip: For a single-provider quick multi-model setup, list comma-separated model IDs.
# The first one becomes the default and the rest appear in the model picker.
# For multiple providers or custom apiKeyEnv/baseUrlEnv, use AI_MODELS_CONFIG / ai-models.json instead.
# Example: AI_MODEL=doubao-seed-1-8-251215,doubao-seed-1-6-flash,doubao-seed-1-6-pro
AI_MODEL=global.anthropic.claude-sonnet-4-5-20250929-v1:0 AI_MODEL=global.anthropic.claude-sonnet-4-5-20250929-v1:0
# AWS Bedrock Configuration # AWS Bedrock Configuration
@@ -29,8 +25,7 @@ AI_MODEL=global.anthropic.claude-sonnet-4-5-20250929-v1:0
# OPENAI_REASONING_SUMMARY=detailed # Optional: Override reasoning summary (none/brief/detailed) # OPENAI_REASONING_SUMMARY=detailed # Optional: Override reasoning summary (none/brief/detailed)
# Anthropic (Direct) Configuration # Anthropic (Direct) Configuration
# ANTHROPIC_API_KEY=sk-ant-... # Sent as `x-api-key` header # ANTHROPIC_API_KEY=sk-ant-...
# ANTHROPIC_AUTH_TOKEN= # Alternative to ANTHROPIC_API_KEY; sent as `Authorization: Bearer` header (mutually exclusive)
# ANTHROPIC_BASE_URL=https://your-custom-anthropic/v1 # ANTHROPIC_BASE_URL=https://your-custom-anthropic/v1
# ANTHROPIC_THINKING_TYPE=enabled # Optional: Anthropic extended thinking (enabled) # ANTHROPIC_THINKING_TYPE=enabled # Optional: Anthropic extended thinking (enabled)
# ANTHROPIC_THINKING_BUDGET_TOKENS=12000 # Optional: Budget for extended thinking in tokens # ANTHROPIC_THINKING_BUDGET_TOKENS=12000 # Optional: Budget for extended thinking in tokens
@@ -73,10 +68,6 @@ AI_MODEL=global.anthropic.claude-sonnet-4-5-20250929-v1:0
# OPENROUTER_API_KEY=sk-or-v1-... # OPENROUTER_API_KEY=sk-or-v1-...
# OPENROUTER_BASE_URL=https://openrouter.ai/api/v1 # Optional: Custom endpoint # OPENROUTER_BASE_URL=https://openrouter.ai/api/v1 # Optional: Custom endpoint
# AIHubMix Configuration
# AIHUBMIX_API_KEY=your-aihubmix-api-key
# AIHUBMIX_BASE_URL=https://aihubmix.com/v1 # Optional: Custom endpoint
# DeepSeek Configuration # DeepSeek Configuration
# DEEPSEEK_API_KEY=sk-... # DEEPSEEK_API_KEY=sk-...
# DEEPSEEK_BASE_URL=https://api.deepseek.com/v1 # Optional: Custom endpoint # DEEPSEEK_BASE_URL=https://api.deepseek.com/v1 # Optional: Custom endpoint
@@ -124,14 +115,6 @@ AI_MODEL=global.anthropic.claude-sonnet-4-5-20250929-v1:0
# Access Control (Optional) # Access Control (Optional)
# ACCESS_CODE_LIST=your-secret-code,another-code # ACCESS_CODE_LIST=your-secret-code,another-code
# Admin Panel (Optional)
# Set a password to enable the web admin panel at /admin, where most of the
# settings in this file can be edited at runtime (stored in data/settings.json,
# which takes precedence over environment variables).
# Leave unset to disable the admin panel entirely.
# ADMIN_PASSWORD=your-admin-password
# SETTINGS_FILE=./data/settings.json # Optional: custom settings file location
# Draw.io Configuration (Optional) # Draw.io Configuration (Optional)
# NEXT_PUBLIC_DRAWIO_BASE_URL=https://embed.diagrams.net # Default: https://embed.diagrams.net # NEXT_PUBLIC_DRAWIO_BASE_URL=https://embed.diagrams.net # Default: https://embed.diagrams.net
# Use this to point to a self-hosted draw.io instance # Use this to point to a self-hosted draw.io instance

86
hooks/use-auto-update.ts Normal file
View File

@@ -0,0 +1,86 @@
import { createElement, useEffect, useRef } from "react"
import { toast } from "sonner"
import { UpdateToast } from "@/components/update-toast"
export function useAutoUpdate() {
const downloadToastId = useRef<string | number | null>(null)
useEffect(() => {
const api = (window as Window).electronAPI
if (!api?.onUpdateStatus) return
const cleanup = api.onUpdateStatus((data) => {
switch (data.status) {
case "available":
toast.custom(
(t) =>
createElement(UpdateToast, {
variant: "download",
version: data.version,
onDownload: () => {
toast.dismiss(t)
api.startDownload().catch(() => {
// Error will come through update-status channel
})
},
onDismiss: () => toast.dismiss(t),
}),
{ duration: 15000 },
)
break
case "available-manual":
toast.custom(
(t) =>
createElement(UpdateToast, {
variant: "manual",
version: data.version,
url: data.url,
onDismiss: () => toast.dismiss(t),
}),
{ duration: Number.POSITIVE_INFINITY },
)
break
case "downloading": {
const id =
downloadToastId.current ??
`download-progress-${Date.now()}`
downloadToastId.current = id
toast.custom(
(t) =>
createElement(UpdateToast, {
variant: "downloading",
percent: data.percent,
onDismiss: () => toast.dismiss(t),
}),
{ id, duration: Number.POSITIVE_INFINITY },
)
break
}
case "downloaded":
// Dismiss progress toast — native restart dialog handles the rest
if (downloadToastId.current) {
toast.dismiss(downloadToastId.current)
downloadToastId.current = null
}
break
case "error":
if (downloadToastId.current) {
// Error during active download — inform the user
toast.dismiss(downloadToastId.current)
downloadToastId.current = null
toast.error(
"Update download failed. Please try again later.",
)
}
// Otherwise: silent — background check failure, logged in main process
break
}
})
return cleanup
}, [])
}

View File

@@ -1,17 +1,7 @@
import { LangfuseSpanProcessor } from "@langfuse/otel" import { LangfuseSpanProcessor } from "@langfuse/otel"
import { NodeTracerProvider } from "@opentelemetry/sdk-trace-node" import { NodeTracerProvider } from "@opentelemetry/sdk-trace-node"
export async function register() { export function register() {
// Overlay admin settings file onto process.env before anything reads config
if (process.env.NEXT_RUNTIME === "nodejs") {
try {
const { applyToEnv } = await import("@/lib/admin/settings")
applyToEnv()
} catch (err) {
console.error("[admin-settings] Failed to apply settings:", err)
}
}
// Skip telemetry if Langfuse env vars are not configured // Skip telemetry if Langfuse env vars are not configured
if (!process.env.LANGFUSE_PUBLIC_KEY || !process.env.LANGFUSE_SECRET_KEY) { if (!process.env.LANGFUSE_PUBLIC_KEY || !process.env.LANGFUSE_SECRET_KEY) {
console.warn( console.warn(

View File

@@ -1,37 +0,0 @@
import { timingSafeEqual } from "crypto"
// Shared auth for admin API routes: compares x-admin-password header
// against the ADMIN_PASSWORD env var. Unset password = panel disabled.
export function checkAdminAuth(req: Request): Response | null {
const password = process.env.ADMIN_PASSWORD
if (!password) {
return Response.json(
{
error: "Admin panel is disabled. Set the ADMIN_PASSWORD environment variable to enable it.",
},
{ status: 403 },
)
}
const provided = req.headers.get("x-admin-password") || ""
const a = Buffer.from(provided)
const b = Buffer.from(password)
if (a.length !== b.length || !timingSafeEqual(a, b)) {
return Response.json(
{ error: "Invalid admin password" },
{ status: 401 },
)
}
return null
}
export interface MaskedSecret {
isSet: true
hint: string
}
export function maskSecret(value: string): MaskedSecret {
return {
isSet: true,
hint: value.length > 8 ? `${value.slice(-4)}` : "••••",
}
}

View File

@@ -1,303 +0,0 @@
import { z } from "zod"
import {
ProviderNameSchema,
type ServerModelsConfig,
} from "@/lib/server-model-config"
import {
FIXED_CRED_PROVIDERS,
PROVIDER_INFO,
type ProviderName,
} from "@/lib/types/model-config"
import { type MaskedSecret, maskSecret } from "./auth"
import { loadSettings } from "./settings"
// Admin-configured providers, mirroring the user ModelConfigDialog's data
// model but stored server-side (settings.json, ADMIN_PROVIDERS key).
//
// They COEXIST with an env-based AI_MODELS_CONFIG / ai-models.json:
// loadRawServerModelsConfig() merges the env baseline with the panel's
// providers at read time, so .env stays authoritative for its own entries.
// Panel credentials are written to ADMIN_-prefixed env vars (wired up via
// apiKeyEnv/baseUrlEnv) so they never shadow standard vars like
// OPENAI_API_KEY that env-based entries may rely on.
export const ADMIN_PROVIDERS_KEY = "ADMIN_PROVIDERS"
// A secret field in transit: plaintext string (new value) or an
// {isSet} marker meaning "keep the stored value".
const SecretInputSchema = z
.union([z.string(), z.object({ isSet: z.literal(true), hint: z.string() })])
.optional()
export const AdminProviderSchema = z.object({
id: z.string().min(1),
provider: ProviderNameSchema,
name: z.string().optional(),
apiKey: SecretInputSchema,
baseUrl: z.string().optional(),
awsAccessKeyId: SecretInputSchema,
awsSecretAccessKey: SecretInputSchema,
awsRegion: z.string().optional(),
vertexApiKey: SecretInputSchema,
models: z.array(z.string().min(1)),
isDefault: z.boolean().optional(),
})
export const AdminProvidersSchema = z.array(AdminProviderSchema)
// Stored shape: secrets are plain strings (never {isSet} markers, which
// only exist in transit). Used to validate ADMIN_PROVIDERS on load so a
// hand-edited/corrupted value can't slip a marker object past maskSecret.
const StoredAdminProviderSchema = AdminProviderSchema.extend({
apiKey: z.string().optional(),
awsAccessKeyId: z.string().optional(),
awsSecretAccessKey: z.string().optional(),
vertexApiKey: z.string().optional(),
})
export type AdminProviderInput = z.infer<typeof AdminProviderSchema>
// Stored form: secrets are plain strings
export interface StoredAdminProvider {
id: string
provider: ProviderName
name?: string
apiKey?: string
baseUrl?: string
awsAccessKeyId?: string
awsSecretAccessKey?: string
awsRegion?: string
vertexApiKey?: string
models: string[]
isDefault?: boolean
}
const SECRET_FIELDS = [
"apiKey",
"awsAccessKeyId",
"awsSecretAccessKey",
"vertexApiKey",
] as const
// ADMIN_-prefixed env var names for instance `index` (0-based) of a provider
function credEnvNames(
provider: ProviderName,
index: number,
): { key?: string; url?: string } {
if (FIXED_CRED_PROVIDERS.includes(provider) || provider === "edgeone") {
return {}
}
const prefix =
provider === "gateway" ? "AI_GATEWAY" : provider.toUpperCase()
const suffix = index === 0 ? "" : `_${index + 1}`
return {
key: `ADMIN_${prefix}_API_KEY${suffix}`,
url: `ADMIN_${prefix}_BASE_URL${suffix}`,
}
}
export function loadAdminProviders(): StoredAdminProvider[] {
const raw = loadSettings()[ADMIN_PROVIDERS_KEY]
if (!raw) return []
try {
const parsed = JSON.parse(raw)
if (!Array.isArray(parsed)) return []
// Validate each entry's shape — a malformed/hand-edited value must
// not reach runtime code that assumes provider/models exist.
return parsed.flatMap((entry) => {
const result = StoredAdminProviderSchema.safeParse(entry)
return result.success ? [result.data as StoredAdminProvider] : []
})
} catch {
console.error("[admin-providers] Failed to parse stored providers")
return []
}
}
export type MaskedAdminProvider = Omit<
StoredAdminProvider,
(typeof SECRET_FIELDS)[number]
> & {
apiKey?: MaskedSecret
awsAccessKeyId?: MaskedSecret
awsSecretAccessKey?: MaskedSecret
vertexApiKey?: MaskedSecret
}
export function maskAdminProviders(
list: StoredAdminProvider[],
): MaskedAdminProvider[] {
return list.map((p) => {
const masked: MaskedAdminProvider = { ...p } as MaskedAdminProvider
for (const field of SECRET_FIELDS) {
const value = p[field]
masked[field] = value ? maskSecret(value) : undefined
}
return masked
})
}
// Resolve {isSet} markers in incoming secrets against the stored list
export function mergeSecrets(
incoming: AdminProviderInput[],
stored: StoredAdminProvider[],
): StoredAdminProvider[] {
const storedById = new Map(stored.map((p) => [p.id, p]))
return incoming.map((p) => {
const prev = storedById.get(p.id)
const merged = { ...p } as StoredAdminProvider
for (const field of SECRET_FIELDS) {
const value = p[field]
if (typeof value === "string") {
merged[field] = value || undefined
} else if (value?.isSet) {
merged[field] = prev?.[field]
} else {
merged[field] = undefined
}
}
return merged
})
}
function displayName(p: StoredAdminProvider): string {
return p.name?.trim() || PROVIDER_INFO[p.provider].label
}
export function validateAdminProviders(
list: StoredAdminProvider[],
envConfig: ServerModelsConfig | null = null,
): string | null {
const envProviders = envConfig?.providers ?? []
for (const single of FIXED_CRED_PROVIDERS) {
if (list.filter((p) => p.provider === single).length > 1) {
return `Only one ${PROVIDER_INFO[single].label} provider is supported (its credentials use fixed environment variables).`
}
// Its credentials are global; a panel instance would silently
// override the credentials env-configured models rely on
if (
list.some((p) => p.provider === single) &&
envProviders.some((p) => p.provider === single)
) {
return `${PROVIDER_INFO[single].label} is already configured in AI_MODELS_CONFIG / ai-models.json and shares global credentials. Manage it via the environment configuration instead.`
}
}
const names = list.map((p) => displayName(p))
if (new Set(names).size !== names.length) {
return "Provider display names must be unique."
}
const envNames = new Set(envProviders.map((p) => p.name))
const clash = names.find((n) => envNames.has(n))
if (clash) {
return `"${clash}" is already defined in AI_MODELS_CONFIG / ai-models.json. Use a different display name.`
}
if (list.filter((p) => p.isDefault).length > 1) {
return "Only one provider can be the default."
}
return null
}
// The panel's contribution to the server models config, derived at read
// time and merged with the env baseline by loadRawServerModelsConfig().
export function adminProvidersToConfig(
list: StoredAdminProvider[],
): ServerModelsConfig {
const config: ServerModelsConfig = { providers: [] }
const indexByProvider = new Map<ProviderName, number>()
for (const p of list) {
const index = indexByProvider.get(p.provider) ?? 0
indexByProvider.set(p.provider, index + 1)
if (p.models.length === 0) continue
const env = credEnvNames(p.provider, index)
config.providers.push({
name: displayName(p),
provider: p.provider,
models: p.models,
...(env.key && p.apiKey ? { apiKeyEnv: env.key } : {}),
...(env.url && p.baseUrl ? { baseUrlEnv: env.url } : {}),
...(p.isDefault ? { default: true } : {}),
})
}
return config
}
// Settings updates derived from the provider list: credential env vars,
// the stored list itself, and AI_PROVIDER/AI_MODEL when a default is set.
// Keys derived from `previous` but absent now are set to null (removed,
// falling back to the environment).
export function deriveEnvUpdates(
list: StoredAdminProvider[],
previous: StoredAdminProvider[],
): Record<string, string | null> {
const updates: Record<string, string | null> = {}
// Clear everything the previous list owned, then overwrite below
for (const key of derivedEnvKeys(previous)) updates[key] = null
const indexByProvider = new Map<ProviderName, number>()
for (const p of list) {
const index = indexByProvider.get(p.provider) ?? 0
indexByProvider.set(p.provider, index + 1)
if (p.provider === "bedrock") {
if (p.awsAccessKeyId) updates.AWS_ACCESS_KEY_ID = p.awsAccessKeyId
if (p.awsSecretAccessKey)
updates.AWS_SECRET_ACCESS_KEY = p.awsSecretAccessKey
if (p.awsRegion) updates.AWS_REGION = p.awsRegion
} else if (p.provider === "vertexai") {
if (p.vertexApiKey) updates.GOOGLE_VERTEX_API_KEY = p.vertexApiKey
if (p.baseUrl) updates.GOOGLE_VERTEX_BASE_URL = p.baseUrl
} else if (p.provider === "ollama") {
if (p.apiKey) updates.OLLAMA_API_KEY = p.apiKey
if (p.baseUrl) updates.OLLAMA_BASE_URL = p.baseUrl
} else {
const env = credEnvNames(p.provider, index)
if (env.key && p.apiKey) updates[env.key] = p.apiKey
if (env.url && p.baseUrl) updates[env.url] = p.baseUrl
}
}
updates[ADMIN_PROVIDERS_KEY] = list.length > 0 ? JSON.stringify(list) : null
// The panel's default also becomes the server-wide default model;
// without one, the env-configured default applies.
const defaultEntry = list.find((p) => p.isDefault && p.models.length > 0)
if (defaultEntry) {
updates.AI_PROVIDER = defaultEntry.provider
updates.AI_MODEL = defaultEntry.models[0]
}
return updates
}
// Every settings key the panel may have written for a given list.
// AI_MODELS_CONFIG is included to clean up values written by older
// versions of the panel (it is no longer written).
function derivedEnvKeys(list: StoredAdminProvider[]): string[] {
const keys = new Set<string>([
"AI_MODELS_CONFIG",
"AI_PROVIDER",
"AI_MODEL",
])
const indexByProvider = new Map<ProviderName, number>()
for (const p of list) {
const index = indexByProvider.get(p.provider) ?? 0
indexByProvider.set(p.provider, index + 1)
if (p.provider === "bedrock") {
keys.add("AWS_ACCESS_KEY_ID")
keys.add("AWS_SECRET_ACCESS_KEY")
keys.add("AWS_REGION")
} else if (p.provider === "vertexai") {
keys.add("GOOGLE_VERTEX_API_KEY")
keys.add("GOOGLE_VERTEX_BASE_URL")
} else if (p.provider === "ollama") {
keys.add("OLLAMA_API_KEY")
keys.add("OLLAMA_BASE_URL")
} else {
const env = credEnvNames(p.provider, index)
if (env.key) keys.add(env.key)
if (env.url) keys.add(env.url)
}
}
return [...keys]
}

View File

@@ -1,229 +0,0 @@
// Declarative registry of the general env vars editable in the admin panel.
// Drives both server-side validation (app/api/admin/settings) and UI
// rendering (app/[lang]/admin). Keys are exactly the env var names.
//
// AI providers and models are managed separately in the panel's Models
// section (lib/admin/providers.ts), not here.
//
// Not listed here (and therefore rejected by the API):
// - NEXT_PUBLIC_* vars: baked into the client bundle at build time
// - ADMIN_PASSWORD / SETTINGS_FILE: bootstrap values, env-only to avoid lockout
// - Per-provider reasoning/thinking tuning vars: env-only (see env.example)
export type SettingType = "string" | "secret" | "number" | "boolean" | "enum"
export interface SettingDef {
key: string
group: string
type: SettingType
label: string
description?: string
options?: string[]
min?: number
max?: number
placeholder?: string
// Built-in default applied at runtime when the value is unset, so the UI
// can reflect actual behavior (e.g. ALLOW_PRIVATE_URLS defaults to "true").
default?: string
// Value is only picked up at process start (module-load readers)
restartRequired?: boolean
}
export interface SettingGroup {
id: string
title: string
description: string
// Optional sections gated by an on/off switch in the panel; fields are
// grayed out until enabled. Starts on when any field is already set.
toggleable?: boolean
}
export const SETTING_GROUPS: SettingGroup[] = [
{
id: "generation",
title: "Generation",
description: "Output parameters applied to all chat requests.",
},
{
id: "access",
title: "Access Control",
description: "Restrict who can use this deployment.",
},
{
id: "features",
title: "Features",
description: "Optional features and security toggles.",
},
{
id: "observability",
title: "Observability",
description: "Langfuse tracing for LLM calls.",
toggleable: true,
},
{
id: "quota",
title: "Quota & Rate Limits",
description:
"Per-IP usage limits. Enforcement requires a DynamoDB table.",
toggleable: true,
},
]
export const SETTINGS_REGISTRY: SettingDef[] = [
// ── Generation ───────────────────────────────────────────────────
{
key: "TEMPERATURE",
group: "generation",
type: "number",
label: "Temperature",
description:
"Leave unset for reasoning models that reject temperature.",
min: 0,
max: 2,
},
{
key: "MAX_OUTPUT_TOKENS",
group: "generation",
type: "number",
label: "Max Output Tokens",
min: 1,
},
// ── Access Control ───────────────────────────────────────────────
{
key: "ACCESS_CODE_LIST",
group: "access",
type: "string",
label: "Access Codes",
description:
"Comma-separated list. Users must enter one to chat. Empty = open access.",
placeholder: "code1,code2",
},
// ── Features ─────────────────────────────────────────────────────
{
key: "ENABLE_VLM_VALIDATION",
group: "features",
type: "boolean",
label: "VLM Diagram Validation",
description:
"Visually validate generated diagrams with a vision model.",
},
{
key: "VALIDATION_MODEL",
group: "features",
type: "string",
label: "Validation Model",
description: "Falls back to the default AI model when empty.",
},
{
key: "VALIDATION_TIMEOUT",
group: "features",
type: "number",
label: "Validation Timeout (ms)",
min: 1000,
},
{
key: "ENABLE_HISTORY_XML_REPLACE",
group: "features",
type: "boolean",
label: "History XML Compression",
description: "Replace old diagram XML in history with placeholders.",
},
{
key: "ALLOW_PRIVATE_URLS",
group: "features",
type: "boolean",
label: "Allow Private URLs",
description:
"Turn off to block requests to private IPs and internal hostnames (SSRF protection).",
// Unset means allowed at runtime (ssrf-protection: !== "false")
default: "true",
},
// ── Observability ────────────────────────────────────────────────
{
key: "LANGFUSE_PUBLIC_KEY",
group: "observability",
type: "string",
label: "Langfuse Public Key",
placeholder: "pk-lf-…",
restartRequired: true,
},
{
key: "LANGFUSE_SECRET_KEY",
group: "observability",
type: "secret",
label: "Langfuse Secret Key",
restartRequired: true,
},
{
key: "LANGFUSE_BASEURL",
group: "observability",
type: "string",
label: "Langfuse Base URL",
placeholder: "https://cloud.langfuse.com",
restartRequired: true,
},
// ── Quota ────────────────────────────────────────────────────────
{
key: "DAILY_REQUEST_LIMIT",
group: "quota",
type: "number",
label: "Daily Request Limit",
description: "Per IP per day.",
min: 1,
},
{
key: "DAILY_TOKEN_LIMIT",
group: "quota",
type: "number",
label: "Daily Token Limit",
description: "Per IP per day.",
min: 1,
},
{
key: "TPM_LIMIT",
group: "quota",
type: "number",
label: "Tokens Per Minute",
min: 1,
},
{
key: "DYNAMODB_QUOTA_TABLE",
group: "quota",
type: "string",
label: "DynamoDB Table",
description: "Quota enforcement is disabled when empty.",
restartRequired: true,
},
{
key: "DYNAMODB_REGION",
group: "quota",
type: "string",
label: "DynamoDB Region",
placeholder: "ap-northeast-1",
restartRequired: true,
},
{
key: "QUOTA_TIMEZONE",
group: "quota",
type: "string",
label: "Quota Timezone",
description: "Timezone for the daily reset boundary.",
placeholder: "UTC",
restartRequired: true,
},
]
export const SETTINGS_BY_KEY: Map<string, SettingDef> = new Map(
SETTINGS_REGISTRY.map((def) => [def.key, def]),
)
export const SETTINGS_BY_GROUP: Map<string, SettingDef[]> = new Map(
SETTING_GROUPS.map((g) => [
g.id,
SETTINGS_REGISTRY.filter((d) => d.group === g.id),
]),
)

View File

@@ -1,134 +0,0 @@
import fs from "fs"
import path from "path"
// File-based admin settings, overlaid onto process.env (dotenv-style).
// Precedence: settings file > env var > built-in default.
// Keys are exactly the env var names.
interface SettingsFile {
version: 1
values: Record<string, string>
}
// Original env values snapshotted before the first overlay, so removing a
// key from the settings file restores the env default. null = was unset.
const originalEnv: Record<string, string | null> = {}
// Keys currently overlaid, so we can restore ones removed from the file.
let overlaidKeys = new Set<string>()
let cachedSettings: Record<string, string> | null = null
export function getSettingsPath(): string {
const custom = process.env.SETTINGS_FILE
if (custom && custom.trim().length > 0) return custom
return path.join(process.cwd(), "data", "settings.json")
}
export function loadSettings(): Record<string, string> {
if (cachedSettings) return cachedSettings
try {
const raw = fs.readFileSync(getSettingsPath(), "utf8")
const parsed = JSON.parse(raw) as SettingsFile
// Keep only string values — a hand-edited or corrupted file could
// hold null/arrays/numbers that would otherwise be overlaid onto
// process.env and coerce to junk like "[object Object]".
const values: Record<string, string> = {}
const rawValues =
parsed &&
typeof parsed.values === "object" &&
parsed.values &&
!Array.isArray(parsed.values)
? parsed.values
: {}
for (const [key, value] of Object.entries(rawValues)) {
if (typeof value === "string") values[key] = value
}
cachedSettings = values
} catch (err: any) {
if (err?.code !== "ENOENT") {
console.error("[admin-settings] Failed to read settings file:", err)
}
cachedSettings = {}
}
return cachedSettings
}
export function applyToEnv(): void {
const values = loadSettings()
// Restore env for keys that were overlaid before but are now gone
for (const key of overlaidKeys) {
if (!(key in values)) {
const original = originalEnv[key]
if (original === null) delete process.env[key]
else process.env[key] = original
}
}
for (const [key, value] of Object.entries(values)) {
if (!(key in originalEnv)) {
originalEnv[key] = process.env[key] ?? null
}
process.env[key] = value
}
overlaidKeys = new Set(Object.keys(values))
}
// The effective env value if the file entry were removed (for fallback display)
export function getEnvFallback(key: string): string | null {
if (overlaidKeys.has(key)) return originalEnv[key] ?? null
return process.env[key] ?? null
}
// Whether a key's current value comes from the file, the environment, or is unset
export function getValueSource(key: string): "file" | "env" | "default" {
if (key in loadSettings()) return "file"
return getEnvFallback(key) !== null ? "env" : "default"
}
export function saveSettings(updates: Record<string, string | null>): void {
const current = { ...loadSettings() }
for (const [key, value] of Object.entries(updates)) {
if (value === null) delete current[key]
else current[key] = value
}
const filePath = getSettingsPath()
fs.mkdirSync(path.dirname(filePath), { recursive: true })
const tmpPath = `${filePath}.tmp`
const data: SettingsFile = { version: 1, values: current }
fs.writeFileSync(tmpPath, JSON.stringify(data, null, 2), { mode: 0o600 })
fs.renameSync(tmpPath, filePath)
cachedSettings = current
applyToEnv()
}
let writableCache: boolean | null = null
export function isSettingsWritable(): boolean {
if (writableCache !== null) return writableCache
try {
const dir = path.dirname(getSettingsPath())
fs.mkdirSync(dir, { recursive: true })
fs.accessSync(dir, fs.constants.W_OK)
writableCache = true
} catch {
writableCache = false
}
return writableCache
}
// Test-only: reset module state
export function _resetForTests(): void {
cachedSettings = null
writableCache = null
for (const key of overlaidKeys) {
const original = originalEnv[key]
if (original === null) delete process.env[key]
else if (original !== undefined) process.env[key] = original
}
overlaidKeys = new Set()
for (const key of Object.keys(originalEnv)) delete originalEnv[key]
}

View File

@@ -6,7 +6,6 @@ import { createGateway, gateway } from "@ai-sdk/gateway"
import { createGoogleGenerativeAI, google } from "@ai-sdk/google" import { createGoogleGenerativeAI, google } from "@ai-sdk/google"
import { createVertex } from "@ai-sdk/google-vertex" import { createVertex } from "@ai-sdk/google-vertex"
import { createOpenAI, openai } from "@ai-sdk/openai" import { createOpenAI, openai } from "@ai-sdk/openai"
import { aihubmix, createAihubmix } from "@aihubmix/ai-sdk-provider"
import { fromNodeProviderChain } from "@aws-sdk/credential-providers" import { fromNodeProviderChain } from "@aws-sdk/credential-providers"
import { createOpenRouter } from "@openrouter/ai-sdk-provider" import { createOpenRouter } from "@openrouter/ai-sdk-provider"
import { createOllama, ollama } from "ollama-ai-provider-v2" import { createOllama, ollama } from "ollama-ai-provider-v2"
@@ -14,8 +13,6 @@ import { PROVIDER_INFO, type ProviderName } from "@/lib/types/model-config"
export type { ProviderName } export type { ProviderName }
export const AIHUBMIX_APP_CODE = "MSBS9675"
interface ModelConfig { interface ModelConfig {
model: any model: any
providerOptions?: any providerOptions?: any
@@ -60,18 +57,6 @@ export function normalizeMiniMaxBaseURL(rawUrl: string): {
return { baseURL, isAnthropicCompatible } return { baseURL, isAnthropicCompatible }
} }
export function isAihubmixStandardBaseURL(
rawUrl: string | null | undefined,
): boolean {
if (!rawUrl) return true
const baseURL = rawUrl.replace(/\/+$/, "")
return (
baseURL === "https://aihubmix.com" ||
baseURL === "https://aihubmix.com/v1"
)
}
export interface ClientOverrides { export interface ClientOverrides {
provider?: string | null provider?: string | null
baseUrl?: string | null baseUrl?: string | null
@@ -101,7 +86,6 @@ const ALLOWED_CLIENT_PROVIDERS: ProviderName[] = [
"azure", "azure",
"bedrock", "bedrock",
"openrouter", "openrouter",
"aihubmix",
"deepseek", "deepseek",
"siliconflow", "siliconflow",
"sglang", "sglang",
@@ -529,7 +513,6 @@ function buildProviderOptions(
case "deepseek": case "deepseek":
case "openrouter": case "openrouter":
case "aihubmix":
case "siliconflow": case "siliconflow":
case "sglang": case "sglang":
case "gateway": case "gateway":
@@ -554,7 +537,7 @@ function buildProviderOptions(
} }
// Map of provider to required environment variable // Map of provider to required environment variable
export const PROVIDER_ENV_VARS: Record<ProviderName, string | null> = { const PROVIDER_ENV_VARS: Record<ProviderName, string | null> = {
bedrock: null, // AWS SDK auto-uses IAM role on AWS, or env vars locally bedrock: null, // AWS SDK auto-uses IAM role on AWS, or env vars locally
openai: "OPENAI_API_KEY", openai: "OPENAI_API_KEY",
anthropic: "ANTHROPIC_API_KEY", anthropic: "ANTHROPIC_API_KEY",
@@ -563,7 +546,6 @@ export const PROVIDER_ENV_VARS: Record<ProviderName, string | null> = {
azure: "AZURE_API_KEY", azure: "AZURE_API_KEY",
ollama: null, // No credentials needed for local Ollama ollama: null, // No credentials needed for local Ollama
openrouter: "OPENROUTER_API_KEY", openrouter: "OPENROUTER_API_KEY",
aihubmix: "AIHUBMIX_API_KEY",
deepseek: "DEEPSEEK_API_KEY", deepseek: "DEEPSEEK_API_KEY",
siliconflow: "SILICONFLOW_API_KEY", siliconflow: "SILICONFLOW_API_KEY",
sglang: "SGLANG_API_KEY", sglang: "SGLANG_API_KEY",
@@ -591,15 +573,7 @@ function detectProvider(): ProviderName | null {
// Skip ollama - it doesn't require credentials // Skip ollama - it doesn't require credentials
continue continue
} }
// Anthropic accepts ANTHROPIC_AUTH_TOKEN (Bearer auth) as alternative to ANTHROPIC_API_KEY if (process.env[envVar]) {
const hasCredential =
provider === "anthropic"
? !!(
process.env.ANTHROPIC_API_KEY ||
process.env.ANTHROPIC_AUTH_TOKEN
)
: !!process.env[envVar]
if (hasCredential) {
// Azure requires additional config (baseURL or resourceName) // Azure requires additional config (baseURL or resourceName)
if (provider === "azure") { if (provider === "azure") {
const hasBaseUrl = !!process.env.AZURE_BASE_URL const hasBaseUrl = !!process.env.AZURE_BASE_URL
@@ -641,26 +615,13 @@ function validateProviderCredentials(
return return
} }
// Anthropic accepts ANTHROPIC_AUTH_TOKEN (Bearer auth) as alternative to ANTHROPIC_API_KEY // Use custom env var name if provided, otherwise use default
if (provider === "anthropic" && !customApiKeyEnv) { const requiredVar = customApiKeyEnv || PROVIDER_ENV_VARS[provider]
const hasCredential = !!( if (requiredVar && !process.env[requiredVar]) {
process.env.ANTHROPIC_API_KEY || process.env.ANTHROPIC_AUTH_TOKEN throw new Error(
`${requiredVar} environment variable is required for ${provider} provider. ` +
`Please set it in your .env.local file.`,
) )
if (!hasCredential) {
throw new Error(
`Either ANTHROPIC_API_KEY or ANTHROPIC_AUTH_TOKEN environment variable is required for anthropic provider. ` +
`Please set one in your .env.local file.`,
)
}
} else {
// Use custom env var name if provided, otherwise use default
const requiredVar = customApiKeyEnv || PROVIDER_ENV_VARS[provider]
if (requiredVar && !process.env[requiredVar]) {
throw new Error(
`${requiredVar} environment variable is required for ${provider} provider. ` +
`Please set it in your .env.local file.`,
)
}
} }
// Azure requires either AZURE_BASE_URL or AZURE_RESOURCE_NAME in addition to API key // Azure requires either AZURE_BASE_URL or AZURE_RESOURCE_NAME in addition to API key
@@ -680,7 +641,7 @@ function validateProviderCredentials(
* Get the AI model based on environment variables * Get the AI model based on environment variables
* *
* Environment variables: * Environment variables:
* - AI_PROVIDER: The provider to use (bedrock, openai, anthropic, google, azure, ollama, openrouter, aihubmix, deepseek, siliconflow, sglang, gateway, modelscope) * - AI_PROVIDER: The provider to use (bedrock, openai, anthropic, google, azure, ollama, openrouter, deepseek, siliconflow, sglang, gateway, modelscope)
* - AI_MODEL: The model ID/name for the selected provider * - AI_MODEL: The model ID/name for the selected provider
* *
* Provider-specific env vars: * Provider-specific env vars:
@@ -692,7 +653,6 @@ function validateProviderCredentials(
* - AWS_REGION, AWS_ACCESS_KEY_ID, AWS_SECRET_ACCESS_KEY: AWS Bedrock credentials * - AWS_REGION, AWS_ACCESS_KEY_ID, AWS_SECRET_ACCESS_KEY: AWS Bedrock credentials
* - OLLAMA_BASE_URL: Ollama server URL (optional, defaults to https://ollama.com/api) * - OLLAMA_BASE_URL: Ollama server URL (optional, defaults to https://ollama.com/api)
* - OPENROUTER_API_KEY: OpenRouter API key * - OPENROUTER_API_KEY: OpenRouter API key
* - AIHUBMIX_API_KEY: AIHubMix API key
* - DEEPSEEK_API_KEY: DeepSeek API key * - DEEPSEEK_API_KEY: DeepSeek API key
* - DEEPSEEK_BASE_URL: DeepSeek endpoint (optional) * - DEEPSEEK_BASE_URL: DeepSeek endpoint (optional)
* - SILICONFLOW_API_KEY: SiliconFlow API key * - SILICONFLOW_API_KEY: SiliconFlow API key
@@ -729,10 +689,8 @@ export function getAIModel(overrides?: ClientOverrides): ModelConfig {
(overrides?.provider === "vertexai" && overrides?.vertexApiKey)) (overrides?.provider === "vertexai" && overrides?.vertexApiKey))
) )
// Use client override if provided, otherwise fall back to env vars. // Use client override if provided, otherwise fall back to env vars
// AI_MODEL may be comma-separated (multi-model fallback); pick the first. const modelId = overrides?.modelId || process.env.AI_MODEL
const envModel = process.env.AI_MODEL?.split(",")[0]?.trim() || undefined
const modelId = overrides?.modelId || envModel
if (!modelId) { if (!modelId) {
if (isClientOverride) { if (isClientOverride) {
@@ -782,7 +740,6 @@ export function getAIModel(overrides?: ClientOverrides): ModelConfig {
`- GOOGLE_GENERATIVE_AI_API_KEY for Google\n` + `- GOOGLE_GENERATIVE_AI_API_KEY for Google\n` +
`- AWS_ACCESS_KEY_ID for Bedrock\n` + `- AWS_ACCESS_KEY_ID for Bedrock\n` +
`- OPENROUTER_API_KEY for OpenRouter\n` + `- OPENROUTER_API_KEY for OpenRouter\n` +
`- AIHUBMIX_API_KEY for AIHubMix\n` +
`- AZURE_API_KEY for Azure\n` + `- AZURE_API_KEY for Azure\n` +
`- SILICONFLOW_API_KEY for SiliconFlow\n` + `- SILICONFLOW_API_KEY for SiliconFlow\n` +
`- SGLANG_API_KEY for SGLang\n` + `- SGLANG_API_KEY for SGLang\n` +
@@ -888,16 +845,8 @@ export function getAIModel(overrides?: ClientOverrides): ModelConfig {
serverBaseUrl, serverBaseUrl,
"https://api.anthropic.com/v1", "https://api.anthropic.com/v1",
) )
// Anthropic supports two auth methods (mutually exclusive):
// - apiKey: sends as `x-api-key` header
// - authToken: sends as `Authorization: Bearer <token>` header
// Prefer apiKey if present (including client overrides); fall back
// to ANTHROPIC_AUTH_TOKEN env var only when no apiKey is available.
const authToken = !apiKey
? process.env.ANTHROPIC_AUTH_TOKEN
: undefined
const customProvider = createAnthropic({ const customProvider = createAnthropic({
...(authToken ? { authToken } : { apiKey }), apiKey,
baseURL, baseURL,
headers: ANTHROPIC_BETA_HEADERS, headers: ANTHROPIC_BETA_HEADERS,
}) })
@@ -1025,42 +974,6 @@ export function getAIModel(overrides?: ClientOverrides): ModelConfig {
break break
} }
case "aihubmix": {
const apiKey = resolveApiKey(overrides, "AIHUBMIX_API_KEY")
const serverBaseUrl = resolveBaseUrlEnv(
overrides,
"AIHUBMIX_BASE_URL",
)
const baseURL = resolveBaseURL(
overrides?.apiKey,
overrides?.baseUrl,
serverBaseUrl,
PROVIDER_INFO.aihubmix.defaultBaseUrl,
)
const defaultBaseURL = PROVIDER_INFO.aihubmix.defaultBaseUrl
if (
isAihubmixStandardBaseURL(baseURL) ||
baseURL === defaultBaseURL
) {
const aihubmixProvider =
overrides?.apiKey || apiKey
? createAihubmix({
apiKey,
appCode: AIHUBMIX_APP_CODE,
})
: aihubmix
model = aihubmixProvider(modelId)
} else {
const aihubmixCompatibleProvider = createOpenAI({
apiKey,
baseURL,
})
model = aihubmixCompatibleProvider.chat(modelId)
}
break
}
case "deepseek": { case "deepseek": {
const apiKey = resolveApiKey(overrides, "DEEPSEEK_API_KEY") const apiKey = resolveApiKey(overrides, "DEEPSEEK_API_KEY")
const serverBaseUrl = resolveBaseUrlEnv( const serverBaseUrl = resolveBaseUrlEnv(
@@ -1349,6 +1262,7 @@ export function getAIModel(overrides?: ClientOverrides): ModelConfig {
case "glm": case "glm":
case "qwen": case "qwen":
case "qiniu": case "qiniu":
case "kimi":
case "novita": { case "novita": {
const envVar = PROVIDER_ENV_VARS[provider] const envVar = PROVIDER_ENV_VARS[provider]
if (!envVar) { if (!envVar) {
@@ -1374,26 +1288,9 @@ export function getAIModel(overrides?: ClientOverrides): ModelConfig {
break break
} }
case "kimi": {
const apiKey = resolveApiKey(overrides, "KIMI_API_KEY")
const baseURL = resolveBaseURL(
overrides?.apiKey,
overrides?.baseUrl,
resolveBaseUrlEnv(overrides, "KIMI_BASE_URL"),
PROVIDER_INFO.kimi?.defaultBaseUrl,
)
// Use createDeepSeek to properly handle reasoning_content for Kimi
// thinking models (e.g., kimi-k2.6). Kimi's API uses the same
// reasoning_content field as DeepSeek, so this provider correctly
// captures and replays reasoning in multi-turn conversations.
const customProvider = createDeepSeek({ apiKey, baseURL })
model = customProvider(modelId)
break
}
default: default:
throw new Error( throw new Error(
`Unknown AI provider: ${provider}. Supported providers: bedrock, openai, anthropic, google, azure, ollama, openrouter, aihubmix, deepseek, siliconflow, sglang, gateway, edgeone, doubao, modelscope, glm, qwen, qiniu, kimi, minimax, novita`, `Unknown AI provider: ${provider}. Supported providers: bedrock, openai, anthropic, google, azure, ollama, openrouter, deepseek, siliconflow, sglang, gateway, edgeone, doubao, modelscope, glm, qwen, qiniu, kimi, minimax, novita`,
) )
} }
@@ -1448,12 +1345,8 @@ export function supportsImageInput(modelId: string): boolean {
return false return false
} }
// MiniMax text models (MiniMax-M2.x series are text-only; M3 supports image input) // MiniMax text models (MiniMax-M2.x series are text-only)
if ( if (lowerModelId.includes("minimax") && !hasVisionIndicator) {
lowerModelId.includes("minimax") &&
!hasVisionIndicator &&
!lowerModelId.includes("m3")
) {
return false return false
} }
@@ -1463,13 +1356,12 @@ export function supportsImageInput(modelId: string): boolean {
} }
// Qwen text models (not vision variants like qwen-vl) // Qwen text models (not vision variants like qwen-vl)
// Qwen3.5 series (qwen3.5, qwen3.5-plus, qwen3.5-flash) natively support image input // qwen3.5-plus is a vision model
// QvQ (Qwen Visual QA) models are vision models — exclude them even when prefixed with "qwen/"
if ( if (
lowerModelId.includes("qwen") && lowerModelId.includes("qwen") &&
!hasVisionIndicator && !hasVisionIndicator &&
!lowerModelId.includes("qwen3.5") && !lowerModelId.includes("qwen3.5-plus") &&
!lowerModelId.includes("qvq") !lowerModelId.includes("qwen3.5-flash")
) { ) {
return false return false
} }
@@ -1492,9 +1384,7 @@ export function supportsImageInput(modelId: string): boolean {
* Throws if the model doesn't support image input. * Throws if the model doesn't support image input.
*/ */
export function getValidationModel(): ReturnType<typeof getAIModel>["model"] { export function getValidationModel(): ReturnType<typeof getAIModel>["model"] {
// AI_MODEL may be comma-separated (multi-model fallback); pick the first. const modelId = process.env.VALIDATION_MODEL || process.env.AI_MODEL
const envFallback = process.env.AI_MODEL?.split(",")[0]?.trim() || undefined
const modelId = process.env.VALIDATION_MODEL || envFallback
if (!modelId) { if (!modelId) {
throw new Error( throw new Error(

View File

@@ -1,79 +0,0 @@
export const AIHUBMIX_MODELS_ENDPOINT = "https://aihubmix.com/api/v1/models"
const NON_CHAT_MODEL_TYPES = new Set([
"embedding",
"image_generation",
"rerank",
"transcription",
"tts",
"video",
])
type AihubmixModelListPayload = {
data?: unknown
}
type AihubmixModelRecord = {
model_id?: unknown
types?: unknown
}
function getModelTypes(types: unknown): Set<string> {
if (typeof types !== "string") {
return new Set()
}
return new Set(
types
.split(",")
.map((type) => type.trim())
.filter(Boolean),
)
}
function isChatModel(record: AihubmixModelRecord): record is {
model_id: string
types: string
} {
if (typeof record.model_id !== "string" || !record.model_id.trim()) {
return false
}
const types = getModelTypes(record.types)
if (!types.has("llm")) {
return false
}
return !Array.from(NON_CHAT_MODEL_TYPES).some((type) => types.has(type))
}
export function extractAihubmixModelIds(payload: unknown): string[] {
const data = (payload as AihubmixModelListPayload)?.data
if (!Array.isArray(data)) {
return []
}
const seen = new Set<string>()
const modelIds: string[] = []
for (const item of data) {
if (!item || typeof item !== "object") {
continue
}
const record = item as AihubmixModelRecord
if (!isChatModel(record)) {
continue
}
const modelId = record.model_id.trim()
if (seen.has(modelId)) {
continue
}
seen.add(modelId)
modelIds.push(modelId)
}
return modelIds
}

View File

@@ -1,17 +0,0 @@
export const DRAWIO_THEMES = [
"kennedy",
"atlas",
"dark",
"min",
"sketch",
"simple",
] as const
export type DrawioTheme = (typeof DRAWIO_THEMES)[number]
export function isDrawioTheme(value: unknown): value is DrawioTheme {
return (
typeof value === "string" &&
(DRAWIO_THEMES as readonly string[]).includes(value)
)
}

View File

@@ -76,7 +76,8 @@
"creativeDescription": "Draw something fun and creative", "creativeDescription": "Draw something fun and creative",
"cachedNote": "Examples are cached for instant response", "cachedNote": "Examples are cached for instant response",
"mcpServer": "MCP Server", "mcpServer": "MCP Server",
"mcpDescription": "Use in Claude Desktop, VS Code & Cursor" "mcpDescription": "Use in Claude Desktop, VS Code & Cursor",
"preview": "PREVIEW"
}, },
"settings": { "settings": {
"title": "Settings", "title": "Settings",
@@ -102,12 +103,10 @@
"theme": "Theme", "theme": "Theme",
"themeDescription": "Dark/Light mode for interface and DrawIO canvas.", "themeDescription": "Dark/Light mode for interface and DrawIO canvas.",
"drawioStyle": "DrawIO Style", "drawioStyle": "DrawIO Style",
"drawioStyleDescription": "Canvas style", "drawioStyleDescription": "Canvas style:",
"themeDefault": "Default", "switchTo": "Switch to",
"themeDark": "Dark", "minimal": "Minimal",
"themeMinimal": "Minimal", "sketch": "Sketch",
"themeSketch": "Sketch",
"themeSimple": "Simple",
"diagramStyle": "Diagram Style", "diagramStyle": "Diagram Style",
"diagramStyleDescription": "Toggle between minimal and styled diagram output.", "diagramStyleDescription": "Toggle between minimal and styled diagram output.",
"sendShortcut": "Send Shortcut", "sendShortcut": "Send Shortcut",
@@ -402,152 +401,6 @@
"showUnvalidatedModels": "Show unvalidated models", "showUnvalidatedModels": "Show unvalidated models",
"allModelsShown": "All models are shown (including unvalidated)", "allModelsShown": "All models are shown (including unvalidated)",
"unvalidatedModelWarning": "This model has not been validated", "unvalidatedModelWarning": "This model has not been validated",
"serverDefaultModel": "Server default model", "serverDefaultModel": "Server default model"
"showValue": "Show value",
"hideValue": "Hide value"
},
"admin": {
"title": "Admin Settings",
"loginPrompt": "Enter the admin password (the ADMIN_PASSWORD environment variable) to manage server settings.",
"password": "Password",
"signIn": "Sign In",
"signingIn": "Signing In…",
"loginFailed": "Login failed",
"precedence": "File overrides env · env overrides defaults",
"notWritable": "The settings file is not writable on this deployment (serverless platforms have no persistent disk). Settings are shown read-only — configure via environment variables instead.",
"settingGroups": "Setting groups",
"enabled": "Enabled",
"disabled": "Disabled",
"enableGroup": "Enable {group}",
"unsavedChanges": "Unsaved changes",
"saved": "Settings saved. Changes apply immediately.",
"saveFailed": "Save failed. Check your connection and try again.",
"invalidSettings": "Some settings are invalid.",
"discard": "Discard",
"saveChanges": "Save Changes",
"saving": "Saving…",
"sourceSaved": "Saved",
"sourceEnv": "Env",
"sourceSavedTitle": "Set in the admin settings file",
"sourceEnvTitle": "Set by an environment variable",
"restartRequired": "Restart Required",
"modified": "Modified",
"notSet": "Not set",
"savedReplace": "Saved ({hint}) — type to replace",
"showValue": "Show value",
"hideValue": "Hide value",
"removeValue": "Remove value",
"removeValueTitle": "Remove the stored value",
"resetToDefault": "Reset to default",
"models": "Models",
"modelsDescription": "Server-side providers and models available to all users — no personal API key needed. The default provider's first model is used when users don't pick one.",
"addProviderHint": "Add a provider to offer server-side models to all users.",
"selectProviderHint": "Select or add a provider to configure its credentials and models.",
"addProviderToOfferModels": "Add at least one model to expose this provider to users.",
"managedViaEnv": "(managed via env)",
"envReadOnly": "Defined in AI_MODELS_CONFIG / ai-models.json — read-only here. Edit the environment configuration to change it.",
"defaultModel": "Default Model",
"noModelsConfigured": "No models configured",
"modelCount": "{count} model",
"modelCountPlural": "{count} models",
"default": "Default",
"setAsDefault": "Set as default provider",
"defaultProvider": "Default provider",
"modelIdPlaceholder": "Model ID…",
"addModel": "Add model",
"suggested": "Suggested",
"test": "Test",
"testOk": "OK ({ms}ms)",
"testFailed": "Failed",
"removeModel": "Remove {model}",
"deleteProviderTitle": "Delete {name}?",
"deleteProviderDesc": "Its credentials and models will be removed from the server after you save.",
"cancel": "Cancel",
"delete": "Delete",
"groups": {
"generation": {
"title": "Generation",
"description": "Output parameters applied to all chat requests."
},
"access": {
"title": "Access Control",
"description": "Restrict who can use this deployment."
},
"features": {
"title": "Features",
"description": "Optional features and security toggles."
},
"observability": {
"title": "Observability",
"description": "Langfuse tracing for LLM calls."
},
"quota": {
"title": "Quota & Rate Limits",
"description": "Per-IP usage limits. Enforcement requires a DynamoDB table."
}
},
"settings": {
"TEMPERATURE": {
"label": "Temperature",
"description": "Leave unset for reasoning models that reject temperature."
},
"MAX_OUTPUT_TOKENS": {
"label": "Max Output Tokens"
},
"ACCESS_CODE_LIST": {
"label": "Access Codes",
"description": "Comma-separated list. Users must enter one to chat. Empty = open access."
},
"ENABLE_VLM_VALIDATION": {
"label": "VLM Diagram Validation",
"description": "Visually validate generated diagrams with a vision model."
},
"VALIDATION_MODEL": {
"label": "Validation Model",
"description": "Falls back to the default AI model when empty."
},
"VALIDATION_TIMEOUT": {
"label": "Validation Timeout (ms)"
},
"ENABLE_HISTORY_XML_REPLACE": {
"label": "History XML Compression",
"description": "Replace old diagram XML in history with placeholders."
},
"ALLOW_PRIVATE_URLS": {
"label": "Allow Private URLs",
"description": "Turn off to block requests to private IPs and internal hostnames (SSRF protection)."
},
"LANGFUSE_PUBLIC_KEY": {
"label": "Langfuse Public Key"
},
"LANGFUSE_SECRET_KEY": {
"label": "Langfuse Secret Key"
},
"LANGFUSE_BASEURL": {
"label": "Langfuse Base URL"
},
"DAILY_REQUEST_LIMIT": {
"label": "Daily Request Limit",
"description": "Per IP per day."
},
"DAILY_TOKEN_LIMIT": {
"label": "Daily Token Limit",
"description": "Per IP per day."
},
"TPM_LIMIT": {
"label": "Tokens Per Minute"
},
"DYNAMODB_QUOTA_TABLE": {
"label": "DynamoDB Table",
"description": "Quota enforcement is disabled when empty."
},
"DYNAMODB_REGION": {
"label": "DynamoDB Region"
},
"QUOTA_TIMEZONE": {
"label": "Quota Timezone",
"description": "Timezone for the daily reset boundary."
}
}
} }
} }

View File

@@ -76,7 +76,8 @@
"creativeDescription": "楽しくてクリエイティブなものを描く", "creativeDescription": "楽しくてクリエイティブなものを描く",
"cachedNote": "例はキャッシュされ、即座に応答します", "cachedNote": "例はキャッシュされ、即座に応答します",
"mcpServer": "MCP サーバー", "mcpServer": "MCP サーバー",
"mcpDescription": "Claude Desktop、VS Code、Cursor で使用" "mcpDescription": "Claude Desktop、VS Code、Cursor で使用",
"preview": "プレビュー"
}, },
"settings": { "settings": {
"title": "設定", "title": "設定",
@@ -102,12 +103,10 @@
"theme": "テーマ", "theme": "テーマ",
"themeDescription": "インターフェースと DrawIO キャンバスのダーク/ライトモード。", "themeDescription": "インターフェースと DrawIO キャンバスのダーク/ライトモード。",
"drawioStyle": "DrawIO スタイル", "drawioStyle": "DrawIO スタイル",
"drawioStyleDescription": "キャンバススタイル", "drawioStyleDescription": "キャンバススタイル",
"themeDefault": "デフォルト", "switchTo": "切り替え",
"themeDark": "ダーク", "minimal": "ミニマル",
"themeMinimal": "ミニマル", "sketch": "スケッチ",
"themeSketch": "スケッチ",
"themeSimple": "シンプル",
"diagramStyle": "ダイアグラムスタイル", "diagramStyle": "ダイアグラムスタイル",
"diagramStyleDescription": "ミニマルとスタイル付きの出力を切り替えます。", "diagramStyleDescription": "ミニマルとスタイル付きの出力を切り替えます。",
"sendShortcut": "送信ショートカット", "sendShortcut": "送信ショートカット",
@@ -356,9 +355,7 @@
"showUnvalidatedModels": "未検証のモデルを表示", "showUnvalidatedModels": "未検証のモデルを表示",
"allModelsShown": "すべてのモデルを表示(未検証を含む)", "allModelsShown": "すべてのモデルを表示(未検証を含む)",
"unvalidatedModelWarning": "このモデルは検証されていません", "unvalidatedModelWarning": "このモデルは検証されていません",
"serverDefaultModel": "サーバーデフォルトモデル", "serverDefaultModel": "サーバーデフォルトモデル"
"showValue": "値を表示",
"hideValue": "値を非表示"
}, },
"templates": { "templates": {
"title": "マイテンプレート", "title": "マイテンプレート",
@@ -405,149 +402,5 @@
"importNoFile": "JSON ファイルを選択してください", "importNoFile": "JSON ファイルを選択してください",
"importFailed": "インポートに失敗しました:{error}", "importFailed": "インポートに失敗しました:{error}",
"importSuccess": "{imported} 件インポート、{skipped} 件の重複をスキップしました" "importSuccess": "{imported} 件インポート、{skipped} 件の重複をスキップしました"
},
"admin": {
"title": "管理者設定",
"loginPrompt": "サーバー設定を管理するには、管理者パスワードADMIN_PASSWORD 環境変数)を入力してください。",
"password": "パスワード",
"signIn": "ログイン",
"signingIn": "ログイン中…",
"loginFailed": "ログインに失敗しました",
"precedence": "ファイルが環境変数を上書き · 環境変数がデフォルトを上書き",
"notWritable": "このデプロイ環境では設定ファイルに書き込めません(サーバーレス環境には永続ディスクがありません)。設定は読み取り専用で表示されます——代わりに環境変数で構成してください。",
"settingGroups": "設定グループ",
"enabled": "有効",
"disabled": "無効",
"enableGroup": "{group} を有効化",
"unsavedChanges": "未保存の変更があります",
"saved": "設定を保存しました。変更は即座に反映されます。",
"saveFailed": "保存に失敗しました。接続を確認して再試行してください。",
"invalidSettings": "一部の設定が無効です。",
"discard": "破棄",
"saveChanges": "変更を保存",
"saving": "保存中…",
"sourceSaved": "保存済み",
"sourceEnv": "環境変数",
"sourceSavedTitle": "管理者設定ファイルで設定",
"sourceEnvTitle": "環境変数で設定",
"restartRequired": "再起動が必要",
"modified": "変更済み",
"notSet": "未設定",
"savedReplace": "保存済み({hint})——入力して置き換え",
"showValue": "値を表示",
"hideValue": "値を非表示",
"removeValue": "値を削除",
"removeValueTitle": "保存された値を削除",
"resetToDefault": "デフォルトに戻す",
"models": "モデル",
"modelsDescription": "全ユーザーが利用できるサーバー側のプロバイダーとモデル——個人の API キーは不要です。ユーザーがモデルを選択しない場合、デフォルトプロバイダーの最初のモデルが使用されます。",
"addProviderHint": "プロバイダーを追加して、全ユーザーにサーバー側モデルを提供します。",
"selectProviderHint": "プロバイダーを選択または追加して、その資格情報とモデルを構成します。",
"addProviderToOfferModels": "ユーザーにこのプロバイダーを公開するには、モデルを少なくとも 1 つ追加してください。",
"managedViaEnv": "(環境変数で管理)",
"envReadOnly": "AI_MODELS_CONFIG / ai-models.json で定義——ここでは読み取り専用です。変更するには環境構成を編集してください。",
"defaultModel": "デフォルトモデル",
"noModelsConfigured": "モデルが構成されていません",
"modelCount": "{count} 個のモデル",
"modelCountPlural": "{count} 個のモデル",
"default": "デフォルト",
"setAsDefault": "デフォルトプロバイダーに設定",
"defaultProvider": "デフォルトプロバイダー",
"modelIdPlaceholder": "モデル ID…",
"addModel": "モデルを追加",
"suggested": "おすすめ",
"test": "テスト",
"testOk": "正常({ms}ms",
"testFailed": "失敗",
"removeModel": "{model} を削除",
"deleteProviderTitle": "{name} を削除しますか?",
"deleteProviderDesc": "保存後、その資格情報とモデルはサーバーから削除されます。",
"cancel": "キャンセル",
"delete": "削除",
"groups": {
"generation": {
"title": "生成",
"description": "すべてのチャットリクエストに適用される出力パラメーター。"
},
"access": {
"title": "アクセス制御",
"description": "このデプロイを使用できるユーザーを制限します。"
},
"features": {
"title": "機能",
"description": "オプション機能とセキュリティの切り替え。"
},
"observability": {
"title": "オブザーバビリティ",
"description": "LLM 呼び出しの Langfuse トレース。"
},
"quota": {
"title": "クォータとレート制限",
"description": "IP ごとの使用制限。強制には DynamoDB テーブルが必要です。"
}
},
"settings": {
"TEMPERATURE": {
"label": "温度",
"description": "温度を受け付けない推論モデルの場合は未設定のままにしてください。"
},
"MAX_OUTPUT_TOKENS": {
"label": "最大出力トークン数"
},
"ACCESS_CODE_LIST": {
"label": "アクセスコード",
"description": "カンマ区切りのリスト。チャットにはいずれかの入力が必要です。空 = オープンアクセス。"
},
"ENABLE_VLM_VALIDATION": {
"label": "VLM 図検証",
"description": "ビジョンモデルで生成された図を視覚的に検証します。"
},
"VALIDATION_MODEL": {
"label": "検証モデル",
"description": "空の場合はデフォルトの AI モデルにフォールバックします。"
},
"VALIDATION_TIMEOUT": {
"label": "検証タイムアウトms"
},
"ENABLE_HISTORY_XML_REPLACE": {
"label": "履歴 XML 圧縮",
"description": "履歴内の古い図 XML をプレースホルダーで置き換えます。"
},
"ALLOW_PRIVATE_URLS": {
"label": "プライベート URL を許可",
"description": "オフにすると、プライベート IP や内部ホスト名へのリクエストをブロックしますSSRF 保護)。"
},
"LANGFUSE_PUBLIC_KEY": {
"label": "Langfuse Public Key"
},
"LANGFUSE_SECRET_KEY": {
"label": "Langfuse Secret Key"
},
"LANGFUSE_BASEURL": {
"label": "Langfuse Base URL"
},
"DAILY_REQUEST_LIMIT": {
"label": "1 日あたりのリクエスト上限",
"description": "IP ごと 1 日あたり。"
},
"DAILY_TOKEN_LIMIT": {
"label": "1 日あたりのトークン上限",
"description": "IP ごと 1 日あたり。"
},
"TPM_LIMIT": {
"label": "1 分あたりのトークン数"
},
"DYNAMODB_QUOTA_TABLE": {
"label": "DynamoDB テーブル",
"description": "空の場合、クォータの強制は無効になります。"
},
"DYNAMODB_REGION": {
"label": "DynamoDB リージョン"
},
"QUOTA_TIMEZONE": {
"label": "クォータタイムゾーン",
"description": "1 日のリセット境界に使用するタイムゾーン。"
}
}
} }
} }

View File

@@ -76,7 +76,8 @@
"creativeDescription": "繪製有趣且富有創意的內容", "creativeDescription": "繪製有趣且富有創意的內容",
"cachedNote": "範例已快取,可即時回應", "cachedNote": "範例已快取,可即時回應",
"mcpServer": "MCP 伺服器", "mcpServer": "MCP 伺服器",
"mcpDescription": "在 Claude Desktop、VS Code 和 Cursor 中使用" "mcpDescription": "在 Claude Desktop、VS Code 和 Cursor 中使用",
"preview": "預覽"
}, },
"settings": { "settings": {
"title": "設定", "title": "設定",
@@ -102,12 +103,10 @@
"theme": "主題", "theme": "主題",
"themeDescription": "介面和 DrawIO 畫布的深色/淺色模式。", "themeDescription": "介面和 DrawIO 畫布的深色/淺色模式。",
"drawioStyle": "DrawIO 樣式", "drawioStyle": "DrawIO 樣式",
"drawioStyleDescription": "畫布樣式", "drawioStyleDescription": "畫布樣式",
"themeDefault": "預設", "switchTo": "切換到",
"themeDark": "深色", "minimal": "簡約",
"themeMinimal": "簡約", "sketch": "草圖",
"themeSketch": "草圖",
"themeSimple": "簡單",
"diagramStyle": "圖表樣式", "diagramStyle": "圖表樣式",
"diagramStyleDescription": "切換簡約與精緻圖表輸出模式。", "diagramStyleDescription": "切換簡約與精緻圖表輸出模式。",
"sendShortcut": "傳送快捷鍵", "sendShortcut": "傳送快捷鍵",
@@ -402,152 +401,6 @@
"showUnvalidatedModels": "顯示未驗證的模型", "showUnvalidatedModels": "顯示未驗證的模型",
"allModelsShown": "顯示所有模型(包括未驗證的)", "allModelsShown": "顯示所有模型(包括未驗證的)",
"unvalidatedModelWarning": "此模型尚未驗證", "unvalidatedModelWarning": "此模型尚未驗證",
"serverDefaultModel": "伺服器預設模型", "serverDefaultModel": "伺服器預設模型"
"showValue": "顯示值",
"hideValue": "隱藏值"
},
"admin": {
"title": "管理員設定",
"loginPrompt": "輸入管理員密碼(即 ADMIN_PASSWORD 環境變數)以管理伺服器設定。",
"password": "密碼",
"signIn": "登入",
"signingIn": "正在登入…",
"loginFailed": "登入失敗",
"precedence": "檔案覆蓋環境變數 · 環境變數覆蓋預設值",
"notWritable": "此部署環境下設定檔不可寫入(無伺服器平台沒有持久化磁碟)。設定以唯讀方式顯示——請改用環境變數進行設定。",
"settingGroups": "設定分組",
"enabled": "已啟用",
"disabled": "已停用",
"enableGroup": "啟用 {group}",
"unsavedChanges": "有未儲存的變更",
"saved": "設定已儲存,變更立即生效。",
"saveFailed": "儲存失敗。請檢查網路連線後重試。",
"invalidSettings": "部分設定無效。",
"discard": "捨棄",
"saveChanges": "儲存變更",
"saving": "正在儲存…",
"sourceSaved": "已儲存",
"sourceEnv": "環境變數",
"sourceSavedTitle": "在管理員設定檔中設定",
"sourceEnvTitle": "透過環境變數設定",
"restartRequired": "需要重新啟動",
"modified": "已修改",
"notSet": "未設定",
"savedReplace": "已儲存({hint})——輸入以取代",
"showValue": "顯示值",
"hideValue": "隱藏值",
"removeValue": "移除值",
"removeValueTitle": "移除已儲存的值",
"resetToDefault": "重設為預設",
"models": "模型",
"modelsDescription": "面向所有使用者的伺服器端 provider 與模型——無需個人 API 金鑰。當使用者未選擇模型時,使用預設 provider 的第一個模型。",
"addProviderHint": "新增一個 provider為所有使用者提供伺服器端模型。",
"selectProviderHint": "選擇或新增一個 provider 以設定其憑證和模型。",
"addProviderToOfferModels": "至少新增一個模型,才能向使用者開放此 provider。",
"managedViaEnv": "(透過環境變數管理)",
"envReadOnly": "在 AI_MODELS_CONFIG / ai-models.json 中定義——此處唯讀。請編輯環境設定以變更。",
"defaultModel": "預設模型",
"noModelsConfigured": "未設定模型",
"modelCount": "{count} 個模型",
"modelCountPlural": "{count} 個模型",
"default": "預設",
"setAsDefault": "設為預設 provider",
"defaultProvider": "預設 provider",
"modelIdPlaceholder": "模型 ID…",
"addModel": "新增模型",
"suggested": "推薦",
"test": "測試",
"testOk": "正常({ms} 毫秒)",
"testFailed": "失敗",
"removeModel": "移除 {model}",
"deleteProviderTitle": "刪除 {name}",
"deleteProviderDesc": "儲存後,其憑證和模型將從伺服器上移除。",
"cancel": "取消",
"delete": "刪除",
"groups": {
"generation": {
"title": "生成",
"description": "套用於所有聊天請求的輸出參數。"
},
"access": {
"title": "存取控制",
"description": "限制誰可以使用此部署。"
},
"features": {
"title": "功能",
"description": "選用功能和安全開關。"
},
"observability": {
"title": "可觀測性",
"description": "對 LLM 呼叫進行 Langfuse 追蹤。"
},
"quota": {
"title": "配額與速率限制",
"description": "按 IP 的用量限制。強制執行需要 DynamoDB 表。"
}
},
"settings": {
"TEMPERATURE": {
"label": "溫度",
"description": "對於拒絕溫度參數的推理模型,請留空。"
},
"MAX_OUTPUT_TOKENS": {
"label": "最大輸出 token 數"
},
"ACCESS_CODE_LIST": {
"label": "存取碼",
"description": "以逗號分隔的清單。使用者需輸入其中之一才能聊天。留空 = 開放存取。"
},
"ENABLE_VLM_VALIDATION": {
"label": "VLM 圖表驗證",
"description": "使用視覺模型對產生的圖表進行視覺化驗證。"
},
"VALIDATION_MODEL": {
"label": "驗證模型",
"description": "留空時回退到預設 AI 模型。"
},
"VALIDATION_TIMEOUT": {
"label": "驗證逾時(毫秒)"
},
"ENABLE_HISTORY_XML_REPLACE": {
"label": "歷史 XML 壓縮",
"description": "用占位符取代歷史記錄中的舊圖表 XML。"
},
"ALLOW_PRIVATE_URLS": {
"label": "允許私有 URL",
"description": "關閉以阻擋對私有 IP 和內部主機名的請求SSRF 防護)。"
},
"LANGFUSE_PUBLIC_KEY": {
"label": "Langfuse Public Key"
},
"LANGFUSE_SECRET_KEY": {
"label": "Langfuse Secret Key"
},
"LANGFUSE_BASEURL": {
"label": "Langfuse Base URL"
},
"DAILY_REQUEST_LIMIT": {
"label": "每日請求上限",
"description": "每個 IP 每天。"
},
"DAILY_TOKEN_LIMIT": {
"label": "每日 token 上限",
"description": "每個 IP 每天。"
},
"TPM_LIMIT": {
"label": "每分鐘 token 數"
},
"DYNAMODB_QUOTA_TABLE": {
"label": "DynamoDB 表",
"description": "留空時配額強制執行被停用。"
},
"DYNAMODB_REGION": {
"label": "DynamoDB 區域"
},
"QUOTA_TIMEZONE": {
"label": "配額時區",
"description": "每日重置邊界所用的時區。"
}
}
} }
} }

View File

@@ -76,7 +76,8 @@
"creativeDescription": "绘制有趣且富有创意的内容", "creativeDescription": "绘制有趣且富有创意的内容",
"cachedNote": "示例已缓存,可即时响应", "cachedNote": "示例已缓存,可即时响应",
"mcpServer": "MCP 服务器", "mcpServer": "MCP 服务器",
"mcpDescription": "在 Claude Desktop、VS Code 和 Cursor 中使用" "mcpDescription": "在 Claude Desktop、VS Code 和 Cursor 中使用",
"preview": "预览"
}, },
"settings": { "settings": {
"title": "设置", "title": "设置",
@@ -102,12 +103,10 @@
"theme": "主题", "theme": "主题",
"themeDescription": "界面和 DrawIO 画布的深色/浅色模式。", "themeDescription": "界面和 DrawIO 画布的深色/浅色模式。",
"drawioStyle": "DrawIO 样式", "drawioStyle": "DrawIO 样式",
"drawioStyleDescription": "画布样式", "drawioStyleDescription": "画布样式",
"themeDefault": "默认", "switchTo": "切换到",
"themeDark": "深色", "minimal": "简约",
"themeMinimal": "简约", "sketch": "草图",
"themeSketch": "草图",
"themeSimple": "简单",
"diagramStyle": "图表样式", "diagramStyle": "图表样式",
"diagramStyleDescription": "切换简约与精致图表输出模式。", "diagramStyleDescription": "切换简约与精致图表输出模式。",
"sendShortcut": "发送快捷键", "sendShortcut": "发送快捷键",
@@ -402,152 +401,6 @@
"showUnvalidatedModels": "显示未验证的模型", "showUnvalidatedModels": "显示未验证的模型",
"allModelsShown": "显示所有模型(包括未验证的)", "allModelsShown": "显示所有模型(包括未验证的)",
"unvalidatedModelWarning": "此模型尚未验证", "unvalidatedModelWarning": "此模型尚未验证",
"serverDefaultModel": "服务器默认模型", "serverDefaultModel": "服务器默认模型"
"showValue": "显示值",
"hideValue": "隐藏值"
},
"admin": {
"title": "管理员设置",
"loginPrompt": "输入管理员密码(即 ADMIN_PASSWORD 环境变量)以管理服务器设置。",
"password": "密码",
"signIn": "登录",
"signingIn": "正在登录…",
"loginFailed": "登录失败",
"precedence": "文件覆盖环境变量 · 环境变量覆盖默认值",
"notWritable": "此部署环境下设置文件不可写(无服务器平台没有持久化磁盘)。设置以只读方式显示——请改用环境变量进行配置。",
"settingGroups": "设置分组",
"enabled": "已启用",
"disabled": "已禁用",
"enableGroup": "启用 {group}",
"unsavedChanges": "有未保存的更改",
"saved": "设置已保存,更改立即生效。",
"saveFailed": "保存失败。请检查网络连接后重试。",
"invalidSettings": "部分设置无效。",
"discard": "放弃",
"saveChanges": "保存更改",
"saving": "正在保存…",
"sourceSaved": "已保存",
"sourceEnv": "环境变量",
"sourceSavedTitle": "在管理员设置文件中设置",
"sourceEnvTitle": "通过环境变量设置",
"restartRequired": "需要重启",
"modified": "已修改",
"notSet": "未设置",
"savedReplace": "已保存({hint})——输入以替换",
"showValue": "显示值",
"hideValue": "隐藏值",
"removeValue": "移除值",
"removeValueTitle": "移除已保存的值",
"resetToDefault": "恢复默认",
"models": "模型",
"modelsDescription": "面向所有用户的服务端 provider 和模型——无需个人 API 密钥。当用户未选择模型时,使用默认 provider 的第一个模型。",
"addProviderHint": "添加一个 provider为所有用户提供服务端模型。",
"selectProviderHint": "选择或添加一个 provider 以配置其凭证和模型。",
"addProviderToOfferModels": "至少添加一个模型,才能向用户开放此 provider。",
"managedViaEnv": "(通过环境变量管理)",
"envReadOnly": "在 AI_MODELS_CONFIG / ai-models.json 中定义——此处只读。请编辑环境配置以更改。",
"defaultModel": "默认模型",
"noModelsConfigured": "未配置模型",
"modelCount": "{count} 个模型",
"modelCountPlural": "{count} 个模型",
"default": "默认",
"setAsDefault": "设为默认 provider",
"defaultProvider": "默认 provider",
"modelIdPlaceholder": "模型 ID…",
"addModel": "添加模型",
"suggested": "推荐",
"test": "测试",
"testOk": "正常({ms} 毫秒)",
"testFailed": "失败",
"removeModel": "移除 {model}",
"deleteProviderTitle": "删除 {name}",
"deleteProviderDesc": "保存后,其凭证和模型将从服务器上移除。",
"cancel": "取消",
"delete": "删除",
"groups": {
"generation": {
"title": "生成",
"description": "应用于所有聊天请求的输出参数。"
},
"access": {
"title": "访问控制",
"description": "限制谁可以使用此部署。"
},
"features": {
"title": "功能",
"description": "可选功能和安全开关。"
},
"observability": {
"title": "可观测性",
"description": "对 LLM 调用进行 Langfuse 追踪。"
},
"quota": {
"title": "配额与速率限制",
"description": "按 IP 的用量限制。强制执行需要 DynamoDB 表。"
}
},
"settings": {
"TEMPERATURE": {
"label": "温度",
"description": "对于拒绝温度参数的推理模型,请留空。"
},
"MAX_OUTPUT_TOKENS": {
"label": "最大输出 token 数"
},
"ACCESS_CODE_LIST": {
"label": "访问码",
"description": "以逗号分隔的列表。用户需输入其中之一才能聊天。留空 = 开放访问。"
},
"ENABLE_VLM_VALIDATION": {
"label": "VLM 图表验证",
"description": "使用视觉模型对生成的图表进行可视化验证。"
},
"VALIDATION_MODEL": {
"label": "验证模型",
"description": "留空时回退到默认 AI 模型。"
},
"VALIDATION_TIMEOUT": {
"label": "验证超时(毫秒)"
},
"ENABLE_HISTORY_XML_REPLACE": {
"label": "历史 XML 压缩",
"description": "用占位符替换历史记录中的旧图表 XML。"
},
"ALLOW_PRIVATE_URLS": {
"label": "允许私有 URL",
"description": "关闭以阻止对私有 IP 和内部主机名的请求SSRF 防护)。"
},
"LANGFUSE_PUBLIC_KEY": {
"label": "Langfuse Public Key"
},
"LANGFUSE_SECRET_KEY": {
"label": "Langfuse Secret Key"
},
"LANGFUSE_BASEURL": {
"label": "Langfuse Base URL"
},
"DAILY_REQUEST_LIMIT": {
"label": "每日请求上限",
"description": "每个 IP 每天。"
},
"DAILY_TOKEN_LIMIT": {
"label": "每日 token 上限",
"description": "每个 IP 每天。"
},
"TPM_LIMIT": {
"label": "每分钟 token 数"
},
"DYNAMODB_QUOTA_TABLE": {
"label": "DynamoDB 表",
"description": "留空时配额强制执行被禁用。"
},
"DYNAMODB_REGION": {
"label": "DynamoDB 区域"
},
"QUOTA_TIMEZONE": {
"label": "配额时区",
"description": "每日重置边界所用的时区。"
}
}
} }
} }

View File

@@ -62,54 +62,7 @@ function getConfigPath(): string {
return path.join(process.cwd(), "ai-models.json") return path.join(process.cwd(), "ai-models.json")
} }
/** export async function loadRawServerModelsConfig(): Promise<ServerModelsConfig | null> {
* Synthesize a config from a comma-separated AI_MODEL value (Priority 3 fallback).
* Lets users expose multiple models without authoring AI_MODELS_CONFIG / ai-models.json.
* Triggers only when AI_MODEL contains a comma AND AI_PROVIDER is set to a known provider.
*/
function configFromCommaSeparatedAiModel(): ServerModelsConfig | null {
const aiModel = process.env.AI_MODEL
if (!aiModel || !aiModel.includes(",")) return null
const aiProvider = process.env.AI_PROVIDER
if (!aiProvider) {
console.warn(
"[server-model-config] AI_MODEL contains commas but AI_PROVIDER is not set; " +
"skipping multi-model fallback. Set AI_PROVIDER, or use AI_MODELS_CONFIG / ai-models.json.",
)
return null
}
if (!(aiProvider in PROVIDER_INFO)) {
console.warn(
`[server-model-config] AI_PROVIDER="${aiProvider}" is not a known provider; skipping multi-model fallback.`,
)
return null
}
const models = Array.from(
new Set(
aiModel
.split(",")
.map((s) => s.trim())
.filter((s) => s.length > 0),
),
)
if (models.length === 0) return null
const providerName = aiProvider as ProviderName
return {
providers: [
{
name: PROVIDER_INFO[providerName]?.label || providerName,
provider: providerName,
models,
default: true,
},
],
}
}
export async function loadEnvServerModelsConfig(): Promise<ServerModelsConfig | null> {
// Priority 1: AI_MODELS_CONFIG env var (JSON string) - for cloud deployments // Priority 1: AI_MODELS_CONFIG env var (JSON string) - for cloud deployments
const envConfig = process.env.AI_MODELS_CONFIG const envConfig = process.env.AI_MODELS_CONFIG
if (envConfig && envConfig.trim().length > 0) { if (envConfig && envConfig.trim().length > 0) {
@@ -132,51 +85,15 @@ export async function loadEnvServerModelsConfig(): Promise<ServerModelsConfig |
const json = JSON.parse(jsonStr) const json = JSON.parse(jsonStr)
return ServerModelsConfigSchema.parse(json) return ServerModelsConfigSchema.parse(json)
} catch (err: any) { } catch (err: any) {
if (err?.code !== "ENOENT") { if (err?.code === "ENOENT") {
console.error(
"[server-model-config] Failed to load ai-models.json:",
err,
)
return null return null
} }
}
// Priority 3: AI_MODEL with comma-separated values + AI_PROVIDER
return configFromCommaSeparatedAiModel()
}
export async function loadRawServerModelsConfig(): Promise<ServerModelsConfig | null> {
const envConfig = await loadEnvServerModelsConfig()
// Merge in providers managed via the admin panel (settings.json).
// Dynamic import to avoid a module-init cycle with lib/admin/providers.
let adminConfig: ServerModelsConfig | null = null
try {
const { adminProvidersToConfig, loadAdminProviders } = await import(
"./admin/providers"
)
const adminProviders = loadAdminProviders()
if (adminProviders.length > 0) {
adminConfig = adminProvidersToConfig(adminProviders)
}
} catch (err) {
console.error( console.error(
"[server-model-config] Failed to load admin providers:", "[server-model-config] Failed to load ai-models.json:",
err, err,
) )
return null
} }
if (!adminConfig || adminConfig.providers.length === 0) return envConfig
if (!envConfig) return adminConfig
// A panel default overrides an env default
const adminHasDefault = adminConfig.providers.some((p) => p.default)
const envProviders = adminHasDefault
? envConfig.providers.map((p) =>
p.default ? { ...p, default: undefined } : p,
)
: envConfig.providers
return { providers: [...envProviders, ...adminConfig.providers] }
} }
export async function loadFlattenedServerModels(): Promise< export async function loadFlattenedServerModels(): Promise<

View File

@@ -58,6 +58,33 @@ interface ChatSessionDB extends DBSchema {
// Database singleton // Database singleton
let dbPromise: Promise<IDBPDatabase<ChatSessionDB>> | null = null let dbPromise: Promise<IDBPDatabase<ChatSessionDB>> | null = null
const resetDBPromise = () => {
dbPromise = null
}
const isClosingError = (error: unknown): boolean => {
return (
error instanceof DOMException &&
error.name === "InvalidStateError" &&
/closing/i.test(error.message)
)
}
const withDB = async <T>(
action: (db: IDBPDatabase<ChatSessionDB>) => Promise<T>,
): Promise<T> => {
try {
const db = await getDB()
return await action(db)
} catch (error) {
if (isClosingError(error)) {
resetDBPromise()
const db = await getDB()
return await action(db)
}
throw error
}
}
async function getDB(): Promise<IDBPDatabase<ChatSessionDB>> { async function getDB(): Promise<IDBPDatabase<ChatSessionDB>> {
if (!dbPromise) { if (!dbPromise) {
@@ -88,7 +115,23 @@ async function getDB(): Promise<IDBPDatabase<ChatSessionDB>> {
} }
} }
}, },
terminated() {
resetDBPromise()
},
}) })
dbPromise
.then((db) => {
db.onversionchange = () => {
db.close()
resetDBPromise()
}
db.onclose = () => {
resetDBPromise()
}
})
.catch(() => {
resetDBPromise()
})
} }
return dbPromise return dbPromise
} }
@@ -103,31 +146,46 @@ export function isIndexedDBAvailable(): boolean {
} }
} }
// Check if IndexedDB is actually usable (not just present).
// Note: Do NOT close the db here - getDB() returns a shared singleton connection
// that other code depends on.
export async function isIndexedDBUsable(): Promise<boolean> {
if (!isIndexedDBAvailable()) return false
try {
await getDB()
return true
} catch {
return false
}
}
// CRUD Operations // CRUD Operations
export async function getAllSessionMetadata(): Promise<SessionMetadata[]> { export async function getAllSessionMetadata(): Promise<SessionMetadata[]> {
if (!isIndexedDBAvailable()) return [] if (!isIndexedDBAvailable()) return []
try { try {
const db = await getDB() return await withDB(async (db) => {
const tx = db.transaction(STORE_NAME, "readonly") const tx = db.transaction(STORE_NAME, "readonly")
const index = tx.store.index("by-updated") const index = tx.store.index("by-updated")
const metadata: SessionMetadata[] = [] const metadata: SessionMetadata[] = []
// Use cursor to read only metadata fields (avoids loading full messages/XML) // Use cursor to read only metadata fields (avoids loading full messages/XML)
let cursor = await index.openCursor(null, "prev") // newest first let cursor = await index.openCursor(null, "prev") // newest first
while (cursor) { while (cursor) {
const s = cursor.value const s = cursor.value
metadata.push({ metadata.push({
id: s.id, id: s.id,
title: s.title, title: s.title,
createdAt: s.createdAt, createdAt: s.createdAt,
updatedAt: s.updatedAt, updatedAt: s.updatedAt,
messageCount: s.messages.length, messageCount: s.messages.length,
hasDiagram: !!s.diagramXml && s.diagramXml.trim().length > 0, hasDiagram:
thumbnailDataUrl: s.thumbnailDataUrl, !!s.diagramXml && s.diagramXml.trim().length > 0,
}) thumbnailDataUrl: s.thumbnailDataUrl,
cursor = await cursor.continue() })
} cursor = await cursor.continue()
return metadata }
return metadata
})
} catch (error) { } catch (error) {
console.error("Failed to get session metadata:", error) console.error("Failed to get session metadata:", error)
return [] return []
@@ -137,8 +195,9 @@ export async function getAllSessionMetadata(): Promise<SessionMetadata[]> {
export async function getSession(id: string): Promise<ChatSession | null> { export async function getSession(id: string): Promise<ChatSession | null> {
if (!isIndexedDBAvailable()) return null if (!isIndexedDBAvailable()) return null
try { try {
const db = await getDB() return await withDB(async (db) => {
return (await db.get(STORE_NAME, id)) || null return (await db.get(STORE_NAME, id)) || null
})
} catch (error) { } catch (error) {
console.error("Failed to get session:", error) console.error("Failed to get session:", error)
return null return null
@@ -148,8 +207,9 @@ export async function getSession(id: string): Promise<ChatSession | null> {
export async function saveSession(session: ChatSession): Promise<boolean> { export async function saveSession(session: ChatSession): Promise<boolean> {
if (!isIndexedDBAvailable()) return false if (!isIndexedDBAvailable()) return false
try { try {
const db = await getDB() await withDB(async (db) => {
await db.put(STORE_NAME, session) await db.put(STORE_NAME, session)
})
return true return true
} catch (error) { } catch (error) {
// Handle quota exceeded // Handle quota exceeded
@@ -161,8 +221,9 @@ export async function saveSession(session: ChatSession): Promise<boolean> {
await deleteOldestSession() await deleteOldestSession()
// Retry once // Retry once
try { try {
const db = await getDB() await withDB(async (db) => {
await db.put(STORE_NAME, session) await db.put(STORE_NAME, session)
})
return true return true
} catch (retryError) { } catch (retryError) {
console.error( console.error(
@@ -181,8 +242,9 @@ export async function saveSession(session: ChatSession): Promise<boolean> {
export async function deleteSession(id: string): Promise<void> { export async function deleteSession(id: string): Promise<void> {
if (!isIndexedDBAvailable()) return if (!isIndexedDBAvailable()) return
try { try {
const db = await getDB() await withDB(async (db) => {
await db.delete(STORE_NAME, id) await db.delete(STORE_NAME, id)
})
} catch (error) { } catch (error) {
console.error("Failed to delete session:", error) console.error("Failed to delete session:", error)
} }
@@ -191,8 +253,9 @@ export async function deleteSession(id: string): Promise<void> {
export async function getSessionCount(): Promise<number> { export async function getSessionCount(): Promise<number> {
if (!isIndexedDBAvailable()) return 0 if (!isIndexedDBAvailable()) return 0
try { try {
const db = await getDB() return await withDB(async (db) => {
return await db.count(STORE_NAME) return await db.count(STORE_NAME)
})
} catch (error) { } catch (error) {
console.error("Failed to get session count:", error) console.error("Failed to get session count:", error)
return 0 return 0
@@ -202,14 +265,15 @@ export async function getSessionCount(): Promise<number> {
export async function deleteOldestSession(): Promise<void> { export async function deleteOldestSession(): Promise<void> {
if (!isIndexedDBAvailable()) return if (!isIndexedDBAvailable()) return
try { try {
const db = await getDB() await withDB(async (db) => {
const tx = db.transaction(STORE_NAME, "readwrite") const tx = db.transaction(STORE_NAME, "readwrite")
const index = tx.store.index("by-updated") const index = tx.store.index("by-updated")
const cursor = await index.openCursor() const cursor = await index.openCursor()
if (cursor) { if (cursor) {
await cursor.delete() await cursor.delete()
} }
await tx.done await tx.done
})
} catch (error) { } catch (error) {
console.error("Failed to delete oldest session:", error) console.error("Failed to delete oldest session:", error)
} }

View File

@@ -2,116 +2,62 @@
* SSRF (Server-Side Request Forgery) protection utilities * SSRF (Server-Side Request Forgery) protection utilities
*/ */
import { lookup } from "node:dns/promises"
/** /**
* Check if an IP address (IPv4 or IPv6) belongs to a private/internal range. * Check if URL points to private/internal network
* Works for both user-supplied literal IPs and DNS-resolved addresses. * Blocks: localhost, private IPs, link-local, AWS metadata service
*/ */
function isPrivateIp(ip: string): boolean { export function isPrivateUrl(urlString: string): boolean {
const addr = ip.toLowerCase().replace(/^\[|\]$/g, "") try {
const url = new URL(urlString)
const hostname = url.hostname.toLowerCase()
// IPv6 // Block localhost
if (addr.includes(":")) {
if (addr === "::1" || addr === "::") return true
// unique-local (fc00::/7) and IPv4-mapped (::ffff:0:0/96)
if ( if (
addr.startsWith("fc") || hostname === "localhost" ||
addr.startsWith("fd") || hostname === "127.0.0.1" ||
addr.startsWith("::ffff:") hostname === "::1"
) { ) {
return true return true
} }
// link-local (fe80::/10)
const linkLocal = addr.match(/^fe([0-9a-f]{2}):/) // Block AWS/cloud metadata endpoints
if (linkLocal) { if (
const high = parseInt(linkLocal[1], 16) hostname === "169.254.169.254" ||
if (high >= 0x80 && high <= 0xbf) return true hostname === "metadata.google.internal"
) {
return true
} }
// Check for private IPv4 ranges
const ipv4Match = hostname.match(
/^(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})$/,
)
if (ipv4Match) {
const [, a, b] = ipv4Match.map(Number)
if (a === 10) return true // 10.0.0.0/8
if (a === 172 && b >= 16 && b <= 31) return true // 172.16.0.0/12
if (a === 192 && b === 168) return true // 192.168.0.0/16
if (a === 169 && b === 254) return true // 169.254.0.0/16 (link-local)
if (a === 127) return true // 127.0.0.0/8 (loopback)
}
// Block common internal hostnames
if (
hostname.endsWith(".local") ||
hostname.endsWith(".internal") ||
hostname.endsWith(".localhost")
) {
return true
}
return false return false
}
// IPv4
const ipv4Match = addr.match(/^(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})$/)
if (ipv4Match) {
const [, a, b] = ipv4Match.map(Number)
if (a === 10) return true // 10.0.0.0/8
if (a === 172 && b >= 16 && b <= 31) return true // 172.16.0.0/12
if (a === 192 && b === 168) return true // 192.168.0.0/16
if (a === 169 && b === 254) return true // 169.254.0.0/16 (link-local)
if (a === 127) return true // 127.0.0.0/8 (loopback)
if (a === 0) return true // 0.0.0.0/8
if (a === 100 && b >= 64 && b <= 127) return true // 100.64.0.0/10 (CGNAT, used by some cloud internal networks)
}
return false
}
/**
* String-only check against well-known private hostnames and literal IPs.
* Fast path that avoids a DNS lookup for obvious cases.
*/
function isPrivateHostname(hostname: string): boolean {
const host = hostname
.toLowerCase()
.replace(/^\[|\]$/g, "")
.replace(/\.$/, "")
if (
host === "localhost" ||
host === "127.0.0.1" ||
host === "::1" ||
host === "::"
) {
return true
}
if (host === "169.254.169.254" || host === "metadata.google.internal") {
return true
}
if (
host.endsWith(".local") ||
host.endsWith(".internal") ||
host.endsWith(".localhost")
) {
return true
}
// Literal IP supplied directly in the URL
return isPrivateIp(host)
}
/**
* Check if URL points to private/internal network.
* Blocks: localhost, private IPs, link-local, AWS metadata service.
*
* Resolves the hostname via DNS and validates every returned address, so
* public-looking names that map to internal IPs (e.g. "127-0-0-1.sslip.io")
* are caught even though they pass the string-only check.
*/
export async function isPrivateUrl(urlString: string): Promise<boolean> {
try {
const url = new URL(urlString)
const hostname = url.hostname
// Fast path: obvious string matches and literal IPs.
if (isPrivateHostname(hostname)) return true
// Resolve DNS and reject if any address is private.
const stripped = hostname.replace(/^\[|\]$/g, "").replace(/\.$/, "")
const addresses = await lookup(stripped, { all: true })
return addresses.some(({ address }) => isPrivateIp(address))
} catch { } catch {
return true // Invalid URL or DNS failure - block it return true // Invalid URL - block it
} }
} }
/** /**
* Whether private URLs are allowed (defaults to true) * Whether private URLs are allowed (defaults to true)
* Set ALLOW_PRIVATE_URLS=false to block private URLs * Set ALLOW_PRIVATE_URLS=false to block private URLs
* Read per call so admin-panel changes apply without restart
*/ */
export function allowPrivateUrls(): boolean { export const allowPrivateUrls = process.env.ALLOW_PRIVATE_URLS !== "false"
return process.env.ALLOW_PRIVATE_URLS !== "false"
}

View File

@@ -57,6 +57,33 @@ export function generateDefaultTitle(prompt: string): string {
// Database singleton // Database singleton
let dbPromise: Promise<IDBPDatabase<TemplateDB>> | null = null let dbPromise: Promise<IDBPDatabase<TemplateDB>> | null = null
const resetDBPromise = () => {
dbPromise = null
}
const isClosingError = (error: unknown): boolean => {
return (
error instanceof DOMException &&
error.name === "InvalidStateError" &&
/closing/i.test(error.message)
)
}
const withDB = async <T>(
action: (db: IDBPDatabase<TemplateDB>) => Promise<T>,
): Promise<T> => {
try {
const db = await getDB()
return await action(db)
} catch (error) {
if (isClosingError(error)) {
resetDBPromise()
const db = await getDB()
return await action(db)
}
throw error
}
}
async function getDB(): Promise<IDBPDatabase<TemplateDB>> { async function getDB(): Promise<IDBPDatabase<TemplateDB>> {
if (!dbPromise) { if (!dbPromise) {
@@ -74,7 +101,23 @@ async function getDB(): Promise<IDBPDatabase<TemplateDB>> {
} }
} }
}, },
terminated() {
resetDBPromise()
},
}) })
dbPromise
.then((db) => {
db.onversionchange = () => {
db.close()
resetDBPromise()
}
db.onclose = () => {
resetDBPromise()
}
})
.catch(() => {
resetDBPromise()
})
} }
return dbPromise return dbPromise
} }
@@ -94,9 +137,10 @@ export function isIndexedDBAvailable(): boolean {
export async function getAllTemplates(): Promise<Template[]> { export async function getAllTemplates(): Promise<Template[]> {
if (!isIndexedDBAvailable()) return [] if (!isIndexedDBAvailable()) return []
try { try {
const db = await getDB() return await withDB(async (db) => {
const templates = await db.getAll(STORE_NAME) const templates = await db.getAll(STORE_NAME)
return sortTemplates(templates) return sortTemplates(templates)
})
} catch (error) { } catch (error) {
console.error("Failed to get templates:", error) console.error("Failed to get templates:", error)
return [] return []
@@ -106,8 +150,9 @@ export async function getAllTemplates(): Promise<Template[]> {
export async function getTemplate(id: string): Promise<Template | null> { export async function getTemplate(id: string): Promise<Template | null> {
if (!isIndexedDBAvailable()) return null if (!isIndexedDBAvailable()) return null
try { try {
const db = await getDB() return await withDB(async (db) => {
return (await db.get(STORE_NAME, id)) || null return (await db.get(STORE_NAME, id)) || null
})
} catch (error) { } catch (error) {
console.error("Failed to get template:", error) console.error("Failed to get template:", error)
return null return null
@@ -137,8 +182,9 @@ export async function createTemplate(
} }
try { try {
const db = await getDB() await withDB(async (db) => {
await db.put(STORE_NAME, template) await db.put(STORE_NAME, template)
})
return template return template
} catch (error) { } catch (error) {
console.error("Failed to create template:", error) console.error("Failed to create template:", error)
@@ -152,19 +198,20 @@ export async function updateTemplate(
): Promise<Template | null> { ): Promise<Template | null> {
if (!isIndexedDBAvailable()) return null if (!isIndexedDBAvailable()) return null
try { try {
const db = await getDB() return await withDB(async (db) => {
const existing = await db.get(STORE_NAME, id) const existing = await db.get(STORE_NAME, id)
if (!existing) return null if (!existing) return null
const updated: Template = { const updated: Template = {
...existing, ...existing,
...updates, ...updates,
id: existing.id, id: existing.id,
createdAt: existing.createdAt, createdAt: existing.createdAt,
updatedAt: Date.now(), updatedAt: Date.now(),
} }
await db.put(STORE_NAME, updated) await db.put(STORE_NAME, updated)
return updated return updated
})
} catch (error) { } catch (error) {
console.error("Failed to update template:", error) console.error("Failed to update template:", error)
return null return null
@@ -174,8 +221,9 @@ export async function updateTemplate(
export async function deleteTemplate(id: string): Promise<boolean> { export async function deleteTemplate(id: string): Promise<boolean> {
if (!isIndexedDBAvailable()) return false if (!isIndexedDBAvailable()) return false
try { try {
const db = await getDB() await withDB(async (db) => {
await db.delete(STORE_NAME, id) await db.delete(STORE_NAME, id)
})
return true return true
} catch (error) { } catch (error) {
console.error("Failed to delete template:", error) console.error("Failed to delete template:", error)
@@ -189,24 +237,25 @@ export async function duplicateTemplate(
): Promise<Template | null> { ): Promise<Template | null> {
if (!isIndexedDBAvailable()) return null if (!isIndexedDBAvailable()) return null
try { try {
const db = await getDB() return await withDB(async (db) => {
const existing = await db.get(STORE_NAME, id) const existing = await db.get(STORE_NAME, id)
if (!existing) return null if (!existing) return null
const now = Date.now() const now = Date.now()
const duplicate: Template = { const duplicate: Template = {
...existing, ...existing,
id: nanoid(), id: nanoid(),
title: `${existing.title} ${copySuffix}`, title: `${existing.title} ${copySuffix}`,
createdAt: now, createdAt: now,
updatedAt: now, updatedAt: now,
clickCount: 0, clickCount: 0,
runCount: 0, runCount: 0,
lastUsedAt: 0, lastUsedAt: 0,
pinned: false, pinned: false,
} }
await db.put(STORE_NAME, duplicate) await db.put(STORE_NAME, duplicate)
return duplicate return duplicate
})
} catch (error) { } catch (error) {
console.error("Failed to duplicate template:", error) console.error("Failed to duplicate template:", error)
return null return null
@@ -218,12 +267,13 @@ export async function duplicateTemplate(
export async function incrementClickCount(id: string): Promise<void> { export async function incrementClickCount(id: string): Promise<void> {
if (!isIndexedDBAvailable()) return if (!isIndexedDBAvailable()) return
try { try {
const db = await getDB() await withDB(async (db) => {
const template = await db.get(STORE_NAME, id) const template = await db.get(STORE_NAME, id)
if (!template) return if (!template) return
template.clickCount += 1 template.clickCount += 1
template.updatedAt = Date.now() template.updatedAt = Date.now()
await db.put(STORE_NAME, template) await db.put(STORE_NAME, template)
})
} catch (error) { } catch (error) {
console.error("Failed to increment click count:", error) console.error("Failed to increment click count:", error)
} }
@@ -232,14 +282,15 @@ export async function incrementClickCount(id: string): Promise<void> {
export async function incrementRunCount(id: string): Promise<void> { export async function incrementRunCount(id: string): Promise<void> {
if (!isIndexedDBAvailable()) return if (!isIndexedDBAvailable()) return
try { try {
const db = await getDB() await withDB(async (db) => {
const template = await db.get(STORE_NAME, id) const template = await db.get(STORE_NAME, id)
if (!template) return if (!template) return
const now = Date.now() const now = Date.now()
template.runCount += 1 template.runCount += 1
template.lastUsedAt = now template.lastUsedAt = now
template.updatedAt = now template.updatedAt = now
await db.put(STORE_NAME, template) await db.put(STORE_NAME, template)
})
} catch (error) { } catch (error) {
console.error("Failed to increment run count:", error) console.error("Failed to increment run count:", error)
} }
@@ -372,8 +423,9 @@ export async function importTemplates(
pinned: typeof t.pinned === "boolean" ? t.pinned : false, pinned: typeof t.pinned === "boolean" ? t.pinned : false,
} }
try { try {
const db = await getDB() await withDB(async (db) => {
await db.put(STORE_NAME, newTemplate) await db.put(STORE_NAME, newTemplate)
})
existingKeys.add(key) existingKeys.add(key)
imported++ imported++
} catch (error) { } catch (error) {

View File

@@ -9,7 +9,6 @@ export type ProviderName =
| "bedrock" | "bedrock"
| "ollama" | "ollama"
| "openrouter" | "openrouter"
| "aihubmix"
| "deepseek" | "deepseek"
| "siliconflow" | "siliconflow"
| "sglang" | "sglang"
@@ -86,15 +85,6 @@ export interface FlattenedModel {
baseUrlEnv?: string baseUrlEnv?: string
} }
// Providers whose server credentials live in fixed env vars
// (AWS_ACCESS_KEY_ID, GOOGLE_VERTEX_API_KEY, OLLAMA_API_KEY) with no
// apiKeyEnv redirection support — their credentials are global
export const FIXED_CRED_PROVIDERS: ProviderName[] = [
"bedrock",
"vertexai",
"ollama",
]
// Map provider names to models.dev logo names // Map provider names to models.dev logo names
export const PROVIDER_LOGO_MAP: Record<string, string> = { export const PROVIDER_LOGO_MAP: Record<string, string> = {
openai: "openai", openai: "openai",
@@ -103,7 +93,6 @@ export const PROVIDER_LOGO_MAP: Record<string, string> = {
azure: "azure", azure: "azure",
bedrock: "amazon-bedrock", bedrock: "amazon-bedrock",
openrouter: "openrouter", openrouter: "openrouter",
aihubmix: "aihubmix",
deepseek: "deepseek", deepseek: "deepseek",
siliconflow: "siliconflow", siliconflow: "siliconflow",
sglang: "openai", // SGLang is OpenAI-compatible sglang: "openai", // SGLang is OpenAI-compatible
@@ -147,10 +136,6 @@ export const PROVIDER_INFO: Record<
label: "OpenRouter", label: "OpenRouter",
defaultBaseUrl: "https://openrouter.ai/api/v1", defaultBaseUrl: "https://openrouter.ai/api/v1",
}, },
aihubmix: {
label: "AIHubMix",
defaultBaseUrl: "https://aihubmix.com/v1",
},
deepseek: { deepseek: {
label: "DeepSeek", label: "DeepSeek",
defaultBaseUrl: "https://api.deepseek.com/v1", defaultBaseUrl: "https://api.deepseek.com/v1",
@@ -205,237 +190,177 @@ export const PROVIDER_INFO: Record<
// Suggested models per provider for quick add // Suggested models per provider for quick add
export const SUGGESTED_MODELS: Partial<Record<ProviderName, string[]>> = { export const SUGGESTED_MODELS: Partial<Record<ProviderName, string[]>> = {
openai: [ openai: [
"gpt-5.5-pro", "gpt-5.2-pro",
"gpt-5.5", "gpt-5.2-chat-latest",
"gpt-5.4-pro", "gpt-5.2",
"gpt-5.4", "gpt-5.1-codex-mini",
"gpt-5.4-mini", "gpt-5.1-codex",
"gpt-5.4-nano", "gpt-5.1-chat-latest",
"gpt-5-codex-mini", "gpt-5.1",
"gpt-5-pro",
"gpt-5",
"gpt-5-mini",
"gpt-5-nano",
"gpt-5-codex",
"gpt-5-chat-latest",
"gpt-4.1", "gpt-4.1",
"gpt-4.1-mini", "gpt-4.1-mini",
"gpt-4.1-nano",
"gpt-4o", "gpt-4o",
"gpt-4o-mini", "gpt-4o-mini",
], ],
anthropic: [ anthropic: [
// Claude 4.8 / 4.7 / 4.6 series (latest, dateless pinned IDs) // Claude 4.5 series (latest)
"claude-opus-4-8", "claude-opus-4-5-20250514",
"claude-sonnet-4-6", "claude-sonnet-4-5-20250514",
"claude-haiku-4-5", // Claude 4 series
"claude-opus-4-7", "claude-opus-4-20250514",
"claude-opus-4-6", "claude-sonnet-4-20250514",
// Claude 4.5 series
"claude-sonnet-4-5-20250929",
"claude-opus-4-5-20251101",
// Claude 3.7 series // Claude 3.7 series
"claude-3-7-sonnet-20250219", "claude-3-7-sonnet-20250219",
// Claude 3.5 series // Claude 3.5 series
"claude-3-5-sonnet-20241022", "claude-3-5-sonnet-20241022",
"claude-3-5-haiku-20241022", "claude-3-5-haiku-20241022",
// Claude 3 series
"claude-3-opus-20240229",
"claude-3-sonnet-20240229",
"claude-3-haiku-20240307",
], ],
google: [ google: [
// Gemini 3 series
"gemini-3.1-pro",
"gemini-3.5-flash",
"gemini-3-flash",
"gemini-3.1-flash-lite",
// Gemini 2.5 series // Gemini 2.5 series
"gemini-2.5-pro", "gemini-2.5-pro",
"gemini-2.5-flash", "gemini-2.5-flash",
"gemini-2.5-flash-lite", "gemini-2.5-flash-preview-05-20",
// Gemini 2.0 series
"gemini-2.0-flash",
"gemini-2.0-flash-exp",
"gemini-2.0-flash-lite",
// Gemini 1.5 series
"gemini-1.5-pro",
"gemini-1.5-flash",
// Legacy
"gemini-pro",
], ],
vertexai: [ vertexai: [
// Gemini 3 series
"gemini-3.1-pro-preview",
"gemini-3.5-flash",
"gemini-3-flash-preview",
"gemini-3.1-flash-lite",
// Gemini 2.5 series // Gemini 2.5 series
"gemini-2.5-pro", "gemini-2.5-pro",
"gemini-2.5-flash", "gemini-2.5-flash",
"gemini-2.5-flash-lite", // Gemini 2.0 series
], "gemini-2.0-flash",
azure: [ "gemini-2.0-flash-exp",
"gpt-5.5", // Gemini 1.5 series
"gpt-5.4", "gemini-1.5-pro",
"gpt-5.1", "gemini-1.5-flash",
"gpt-5",
"gpt-5-mini",
"gpt-4.1",
"gpt-4o",
"gpt-4o-mini",
"o3",
"o4-mini",
], ],
azure: ["gpt-4o", "gpt-4o-mini", "gpt-4-turbo", "gpt-4", "gpt-35-turbo"],
bedrock: [ bedrock: [
// Anthropic Claude // Anthropic Claude
"anthropic.claude-opus-4-8", "anthropic.claude-opus-4-5-20250514-v1:0",
"anthropic.claude-opus-4-7", "anthropic.claude-sonnet-4-5-20250514-v1:0",
"anthropic.claude-sonnet-4-6",
"anthropic.claude-opus-4-6-v1",
"anthropic.claude-opus-4-5-20251101-v1:0",
"anthropic.claude-sonnet-4-5-20250929-v1:0",
"anthropic.claude-haiku-4-5-20251001-v1:0",
"anthropic.claude-opus-4-1-20250805-v1:0",
"anthropic.claude-opus-4-20250514-v1:0", "anthropic.claude-opus-4-20250514-v1:0",
"anthropic.claude-sonnet-4-20250514-v1:0", "anthropic.claude-sonnet-4-20250514-v1:0",
"anthropic.claude-3-7-sonnet-20250219-v1:0",
"anthropic.claude-3-5-sonnet-20241022-v2:0",
"anthropic.claude-3-5-haiku-20241022-v1:0", "anthropic.claude-3-5-haiku-20241022-v1:0",
"anthropic.claude-3-opus-20240229-v1:0",
"anthropic.claude-3-sonnet-20240229-v1:0",
"anthropic.claude-3-haiku-20240307-v1:0",
// Amazon Nova // Amazon Nova
"amazon.nova-2-lite-v1:0",
"amazon.nova-premier-v1:0",
"amazon.nova-pro-v1:0", "amazon.nova-pro-v1:0",
"amazon.nova-lite-v1:0", "amazon.nova-lite-v1:0",
"amazon.nova-micro-v1:0", "amazon.nova-micro-v1:0",
// Meta Llama // Meta Llama
"meta.llama4-maverick-17b-instruct-v1:0",
"meta.llama4-scout-17b-instruct-v1:0",
"meta.llama3-3-70b-instruct-v1:0", "meta.llama3-3-70b-instruct-v1:0",
"meta.llama3-1-405b-instruct-v1:0",
"meta.llama3-1-70b-instruct-v1:0",
// Mistral // Mistral
"mistral.mistral-large-3-675b-instruct", "mistral.mistral-large-2411-v1:0",
"mistral.pixtral-large-2502-v1:0", "mistral.mistral-small-2503-v1:0",
], ],
openrouter: [ openrouter: [
// Anthropic // Anthropic
"anthropic/claude-opus-4.8", "anthropic/claude-sonnet-4",
"anthropic/claude-sonnet-4.6", "anthropic/claude-opus-4",
"anthropic/claude-haiku-4.5", "anthropic/claude-3.5-sonnet",
"anthropic/claude-3.5-haiku",
// OpenAI // OpenAI
"openai/gpt-5.5", "openai/gpt-4o",
"openai/gpt-5.4",
"openai/gpt-5.4-mini",
"openai/gpt-4o-mini", "openai/gpt-4o-mini",
"openai/o1",
"openai/o3-mini",
// Google // Google
"google/gemini-3.1-pro-preview", "google/gemini-2.5-pro",
"google/gemini-3.5-flash", "google/gemini-2.5-flash",
"google/gemini-2.5-flash-lite", "google/gemini-2.0-flash-exp:free",
// xAI
"x-ai/grok-4.3",
// Meta Llama // Meta Llama
"meta-llama/llama-4-maverick",
"meta-llama/llama-4-scout",
"meta-llama/llama-3.3-70b-instruct", "meta-llama/llama-3.3-70b-instruct",
"meta-llama/llama-3.1-405b-instruct",
"meta-llama/llama-3.1-70b-instruct",
// DeepSeek // DeepSeek
"deepseek/deepseek-v4-pro", "deepseek/deepseek-chat",
"deepseek/deepseek-v3.2", "deepseek/deepseek-r1",
// Qwen // Qwen
"qwen/qwen3.7-max", "qwen/qwen-2.5-72b-instruct",
"qwen/qwen3-coder",
// MiniMax
"minimax/minimax-m3",
],
aihubmix: [
// Fallback list. The settings UI loads the live model list from AIHubMix when available.
// Anthropic Claude
"claude-fable-5",
"claude-opus-4-8",
"claude-sonnet-4-6",
// OpenAI
"gpt-5.5",
"gpt-5.5-pro",
"gpt-5.4",
// Google Gemini
"gemini-3.5-flash",
"gemini-3.1-pro-preview",
"gemini-3-flash-preview",
// DeepSeek
"deepseek-v4-pro",
"deepseek-v4-flash",
// Qwen
"qwen3.7-max",
"qwen3-coder-next",
// Z.ai
"glm-5.1",
// Moonshot AI
"kimi-k2.6",
// MiniMax
"minimax-m3",
// xAI
"grok-4.3",
// Baidu
"ernie-5.1",
// Mistral
"mistral-large-3",
// Meta
"llama-4-maverick",
],
deepseek: [
"deepseek-v4-pro",
"deepseek-v4-flash",
"deepseek-chat",
"deepseek-reasoner",
], ],
deepseek: ["deepseek-chat", "deepseek-reasoner", "deepseek-coder"],
siliconflow: [ siliconflow: [
// DeepSeek // DeepSeek
"deepseek-ai/DeepSeek-V4-Pro", "deepseek-ai/DeepSeek-V3",
"deepseek-ai/DeepSeek-V4-Flash", "deepseek-ai/DeepSeek-R1",
"deepseek-ai/DeepSeek-V3.2", "deepseek-ai/DeepSeek-V2.5",
// MiniMax
"MiniMaxAI/MiniMax-M3",
// Moonshot
"moonshotai/Kimi-K2.6",
// Z.ai
"zai-org/GLM-5",
// Qwen // Qwen
"Qwen/Qwen3.6-35B-A3B", "Qwen/Qwen2.5-72B-Instruct",
"Qwen/Qwen3-Coder-480B-A35B-Instruct", "Qwen/Qwen2.5-32B-Instruct",
"Qwen/Qwen3-30B-A3B-Instruct-2507", "Qwen/Qwen2.5-Coder-32B-Instruct",
"Qwen/Qwen3-VL-32B-Instruct", "Qwen/Qwen2.5-7B-Instruct",
// OpenAI open-weights "Qwen/Qwen2-VL-72B-Instruct",
"openai/gpt-oss-120b", "qwen3.5-plus",
], ],
sglang: [ sglang: [
// SGLang is OpenAI-compatible, models depend on deployment // SGLang is OpenAI-compatible, models depend on deployment
"default", "default",
], ],
gateway: [ gateway: [
"openai/gpt-5.5", "openai/gpt-4o",
"anthropic/claude-opus-4.7", "openai/gpt-4o-mini",
"google/gemini-3.1-pro-preview", "anthropic/claude-sonnet-4-5",
"xai/grok-4.3", "anthropic/claude-3-5-sonnet",
"anthropic/claude-sonnet-4.6", "google/gemini-2.0-flash",
"anthropic/claude-haiku-4.5",
"openai/gpt-5.4-mini",
], ],
edgeone: ["@tx/deepseek-ai/deepseek-v32"], edgeone: ["@tx/deepseek-ai/deepseek-v32"],
doubao: [ doubao: [
// ByteDance Doubao models (Volcengine Ark IDs use dash form) // ByteDance Doubao models
"doubao-seed-2-0-pro-260215", "doubao-1.5-thinking-pro-250415",
"doubao-seed-2-0-lite-260428", "doubao-1.5-thinking-pro-m-250428",
"doubao-seed-2-0-mini-260428", "doubao-1.5-pro-32k-250115",
"doubao-seed-1-8-251228", "doubao-1.5-pro-256k-250115",
"doubao-seed-1-6-251015", "doubao-pro-32k-241215",
"doubao-seed-1-6-flash-250828", "doubao-pro-256k-241215",
"doubao-seed-1-6-vision-250815",
"doubao-1-5-pro-32k-250115",
"doubao-1-5-lite-32k-250115",
], ],
modelscope: [ modelscope: [
// DeepSeek
"deepseek-ai/DeepSeek-V4-Pro",
"deepseek-ai/DeepSeek-V3.2",
"deepseek-ai/DeepSeek-R1-0528",
"deepseek-ai/DeepSeek-R1",
// Qwen // Qwen
"Qwen/Qwen2.5-72B-Instruct",
"Qwen/Qwen2.5-32B-Instruct",
"Qwen/Qwen3-235B-A22B-Instruct-2507", "Qwen/Qwen3-235B-A22B-Instruct-2507",
"Qwen/Qwen3-VL-235B-A22B-Instruct", "Qwen/Qwen3-VL-235B-A22B-Instruct",
"Qwen/Qwen3-Coder-30B-A3B-Instruct",
"Qwen/Qwen3-32B", "Qwen/Qwen3-32B",
"Qwen/Qwen2.5-72B-Instruct", "qwen3.5-plus",
// DeepSeek
"deepseek-ai/DeepSeek-R1-0528",
"deepseek-ai/DeepSeek-V3.2",
], ],
minimax: [ minimax: [
// MiniMax models (Anthropic-compatible API) // MiniMax models (Anthropic-compatible API)
"MiniMax-M3",
"MiniMax-M2.7", "MiniMax-M2.7",
"MiniMax-M2.7-highspeed", "MiniMax-M2.7-highspeed",
"MiniMax-M2.5", "MiniMax-M2.5",
"MiniMax-M2.5-highspeed",
], ],
novita: [ novita: [
// Novita AI models (OpenAI-compatible API) // Novita AI models (OpenAI-compatible API)
"minimax/minimax-m3", "moonshotai/kimi-k2.5",
"deepseek/deepseek-v4-pro", "zai-org/glm-5",
"zai-org/glm-5.1", "minimax/minimax-m2.5",
"moonshotai/kimi-k2.6",
"deepseek/deepseek-v4-flash",
], ],
} }

2697
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -1,6 +1,6 @@
{ {
"name": "next-ai-draw-io", "name": "next-ai-draw-io",
"version": "0.4.16", "version": "0.4.14",
"license": "Apache-2.0", "license": "Apache-2.0",
"private": true, "private": true,
"main": "dist-electron/main/index.js", "main": "dist-electron/main/index.js",
@@ -40,7 +40,6 @@
"@ai-sdk/google-vertex": "^4.0.16", "@ai-sdk/google-vertex": "^4.0.16",
"@ai-sdk/openai": "^3.0.0", "@ai-sdk/openai": "^3.0.0",
"@ai-sdk/react": "^3.0.1", "@ai-sdk/react": "^3.0.1",
"@aihubmix/ai-sdk-provider": "^2.1.0",
"@aws-sdk/client-dynamodb": "^3.957.0", "@aws-sdk/client-dynamodb": "^3.957.0",
"@aws-sdk/credential-providers": "^3.943.0", "@aws-sdk/credential-providers": "^3.943.0",
"@extractus/article-extractor": "^8.0.18", "@extractus/article-extractor": "^8.0.18",
@@ -50,9 +49,9 @@
"@langfuse/tracing": "^4.4.9", "@langfuse/tracing": "^4.4.9",
"@next/third-parties": "^16.0.6", "@next/third-parties": "^16.0.6",
"@opennextjs/cloudflare": "^1.17.1", "@opennextjs/cloudflare": "^1.17.1",
"@openrouter/ai-sdk-provider": "^2.0.0", "@openrouter/ai-sdk-provider": "^1.5.4",
"@opentelemetry/api": "^1.9.0", "@opentelemetry/api": "^1.9.0",
"@opentelemetry/exporter-trace-otlp-http": "^0.216.0", "@opentelemetry/exporter-trace-otlp-http": "^0.214.0",
"@opentelemetry/sdk-trace-node": "^2.2.0", "@opentelemetry/sdk-trace-node": "^2.2.0",
"@radix-ui/react-alert-dialog": "^1.1.15", "@radix-ui/react-alert-dialog": "^1.1.15",
"@radix-ui/react-collapsible": "^1.1.12", "@radix-ui/react-collapsible": "^1.1.12",
@@ -71,6 +70,7 @@
"class-variance-authority": "^0.7.1", "class-variance-authority": "^0.7.1",
"clsx": "^2.1.1", "clsx": "^2.1.1",
"cmdk": "^1.1.1", "cmdk": "^1.1.1",
"electron-updater": "^6.8.3",
"idb": "^8.0.3", "idb": "^8.0.3",
"jsonrepair": "^3.13.1", "jsonrepair": "^3.13.1",
"lucide-react": "^0.577.0", "lucide-react": "^0.577.0",
@@ -78,7 +78,7 @@
"nanoid": "^5.0.0", "nanoid": "^5.0.0",
"negotiator": "^1.0.0", "negotiator": "^1.0.0",
"next": "^16.0.7", "next": "^16.0.7",
"ollama-ai-provider-v2": "^3.0.0", "ollama-ai-provider-v2": "^2.0.0",
"pako": "^2.1.0", "pako": "^2.1.0",
"prism-react-renderer": "^2.4.1", "prism-react-renderer": "^2.4.1",
"react": "^19.1.2", "react": "^19.1.2",
@@ -109,7 +109,7 @@
}, },
"devDependencies": { "devDependencies": {
"@anthropic-ai/tokenizer": "^0.0.4", "@anthropic-ai/tokenizer": "^0.0.4",
"@biomejs/biome": "2.4.13", "@biomejs/biome": "2.4.10",
"@playwright/test": "^1.57.0", "@playwright/test": "^1.57.0",
"@tailwindcss/postcss": "^4", "@tailwindcss/postcss": "^4",
"@tailwindcss/typography": "^0.5.19", "@tailwindcss/typography": "^0.5.19",
@@ -128,7 +128,7 @@
"cross-env": "^10.1.0", "cross-env": "^10.1.0",
"electron": "^39.2.7", "electron": "^39.2.7",
"electron-builder": "^26.0.12", "electron-builder": "^26.0.12",
"esbuild": "^0.28.0", "esbuild": "^0.27.2",
"eslint": "9.39.4", "eslint": "9.39.4",
"eslint-config-next": "16.1.6", "eslint-config-next": "16.1.6",
"husky": "^9.1.7", "husky": "^9.1.7",

File diff suppressed because it is too large Load Diff

View File

@@ -1,6 +1,6 @@
{ {
"name": "@next-ai-drawio/mcp-server", "name": "@next-ai-drawio/mcp-server",
"version": "0.2.1", "version": "0.1.17",
"description": "MCP server for Next AI Draw.io - AI-powered diagram generation with real-time browser preview", "description": "MCP server for Next AI Draw.io - AI-powered diagram generation with real-time browser preview",
"type": "module", "type": "module",
"main": "dist/index.js", "main": "dist/index.js",
@@ -11,8 +11,6 @@
"build": "tsc", "build": "tsc",
"dev": "tsx watch src/index.ts", "dev": "tsx watch src/index.ts",
"start": "node dist/index.js", "start": "node dist/index.js",
"test": "vitest run",
"test:watch": "vitest",
"prepublishOnly": "npm run build" "prepublishOnly": "npm run build"
}, },
"keywords": [ "keywords": [
@@ -46,8 +44,7 @@
"devDependencies": { "devDependencies": {
"@types/node": "^24.0.0", "@types/node": "^24.0.0",
"tsx": "^4.19.0", "tsx": "^4.19.0",
"typescript": "^5", "typescript": "^5"
"vitest": "^4.1.8"
}, },
"engines": { "engines": {
"node": ">=18" "node": ">=18"

View File

@@ -1,14 +1,8 @@
/** /**
* ID-based diagram operations * ID-based diagram operations
* * Copied from lib/utils.ts to avoid cross-package imports
* The xmlContent argument may be either a bare <mxGraphModel> (legacy) or a
* full <mxfile> with one or more <diagram> pages. For mxfile inputs, an
* optional pageSelector identifies which page to edit; when omitted, the
* first page is targeted (the "active page by convention" — see pages.ts).
*/ */
import { findPageElement, hasPageSelector, type PageSelector } from "./pages.js"
export interface DiagramOperation { export interface DiagramOperation {
operation: "update" | "add" | "delete" operation: "update" | "add" | "delete"
cell_id: string cell_id: string
@@ -28,18 +22,15 @@ export interface ApplyOperationsResult {
/** /**
* Apply diagram operations (update/add/delete) using ID-based lookup. * Apply diagram operations (update/add/delete) using ID-based lookup.
* This replaces the text-matching approach with direct DOM manipulation.
* *
* @param xmlContent - The diagram XML. May be either a bare <mxGraphModel> or * @param xmlContent - The full mxfile XML content
* a full <mxfile> with one or more <diagram> children. * @param operations - Array of operations to apply
* @param operations - Array of operations to apply. * @returns Object with result XML and any errors
* @param pageSelector - Optional page selector for multi-page docs. Defaults
* to the first page.
* @returns Object with result XML (same shape as input) and any per-op errors.
*/ */
export function applyDiagramOperations( export function applyDiagramOperations(
xmlContent: string, xmlContent: string,
operations: DiagramOperation[], operations: DiagramOperation[],
pageSelector?: PageSelector,
): ApplyOperationsResult { ): ApplyOperationsResult {
const errors: OperationError[] = [] const errors: OperationError[] = []
@@ -62,75 +53,22 @@ export function applyDiagramOperations(
} }
} }
// Locate the <root> element to operate on. // Find the root element (inside mxGraphModel)
// const root = doc.querySelector("root")
// - For <mxfile> input: resolve the page via pageSelector, then dive into if (!root) {
// its <root>. This scopes querySelectorAll calls below to one page so return {
// cells on other pages aren't accidentally matched. result: xmlContent,
// - For bare <mxGraphModel> input: use the document's only <root>. errors: [
let root: Element | null {
if (doc.documentElement?.tagName === "mxfile") { type: "update",
const found = findPageElement(doc as unknown as Document, pageSelector) cellId: "",
if (!found) { message: "Could not find <root> element in XML",
const selDesc = hasPageSelector(pageSelector) },
? ` matching selector ${JSON.stringify(pageSelector)}` ],
: ""
return {
result: xmlContent,
errors: [
{
type: "update",
cellId: "",
message: `Page${selDesc} not found in <mxfile>`,
},
],
}
}
root = found.element.querySelector("root")
if (!root) {
const pageId =
found.element.getAttribute("id") || `(index ${found.index})`
return {
result: xmlContent,
errors: [
{
type: "update",
cellId: "",
message: `Page "${pageId}" has no <root> element`,
},
],
}
}
} else {
if (hasPageSelector(pageSelector)) {
return {
result: xmlContent,
errors: [
{
type: "update",
cellId: "",
message:
"Page selector provided but document is not multi-page (no <mxfile> wrapper). Use create_new_diagram with a full <mxfile> first, or omit the page selector.",
},
],
}
}
root = doc.querySelector("root")
if (!root) {
return {
result: xmlContent,
errors: [
{
type: "update",
cellId: "",
message: "Could not find <root> element in XML",
},
],
}
} }
} }
// Build a map of cell IDs to elements (scoped to the resolved page). // Build a map of cell IDs to elements
const cellMap = new Map<string, Element>() const cellMap = new Map<string, Element>()
root.querySelectorAll("mxCell").forEach((cell) => { root.querySelectorAll("mxCell").forEach((cell) => {
const id = cell.getAttribute("id") const id = cell.getAttribute("id")
@@ -270,9 +208,7 @@ export function applyDiagramOperations(
cellsToDelete.add(cellId) cellsToDelete.add(cellId)
// Find children (cells where parent === cellId) // Find children (cells where parent === cellId)
// Scoped to `root` so other pages' cells with the same parent id const children = root.querySelectorAll(
// (notably "1") are never touched.
const children = root!.querySelectorAll(
`mxCell[parent="${cellId}"]`, `mxCell[parent="${cellId}"]`,
) )
children.forEach((child) => { children.forEach((child) => {

View File

@@ -4,29 +4,6 @@
*/ */
import http from "node:http" import http from "node:http"
const MAX_BODY_BYTES = 10 * 1024 * 1024 // 10 MiB
function readBody(
req: http.IncomingMessage,
res: http.ServerResponse,
cb: (body: string) => void,
): void {
let body = ""
let size = 0
req.on("data", (chunk: Buffer) => {
size += chunk.length
if (size > MAX_BODY_BYTES) {
res.writeHead(413, { "Content-Type": "application/json" })
res.end(JSON.stringify({ error: "Payload too large" }))
req.destroy()
return
}
body += chunk
})
req.on("end", () => cb(body))
}
import { import {
addHistory, addHistory,
clearHistory, clearHistory,
@@ -93,7 +70,6 @@ interface SessionState {
svg?: string // Cached SVG from last browser save svg?: string // Cached SVG from last browser save
syncRequested?: number // Timestamp when sync requested, cleared when browser responds syncRequested?: number // Timestamp when sync requested, cleared when browser responds
exportFormat?: "png" | "svg" // Set by MCP tool to request browser export exportFormat?: "png" | "svg" // Set by MCP tool to request browser export
exportXml?: string // Single-page projection to load before a page-targeted export
exportData?: string // Base64/SVG data returned by browser after export exportData?: string // Base64/SVG data returned by browser after export
} }
@@ -118,37 +94,12 @@ export function setState(sessionId: string, xml: string, svg?: string): number {
svg: svg || existing?.svg, // Preserve cached SVG if not provided svg: svg || existing?.svg, // Preserve cached SVG if not provided
syncRequested: undefined, // Clear sync request when browser pushes state syncRequested: undefined, // Clear sync request when browser pushes state
exportFormat: existing?.exportFormat, // Preserve pending export request exportFormat: existing?.exportFormat, // Preserve pending export request
exportXml: existing?.exportXml, // Preserve pending projection
exportData: existing?.exportData, // Preserve export result exportData: existing?.exportData, // Preserve export result
}) })
log.debug(`State updated: session=${sessionId}, version=${newVersion}`) log.debug(`State updated: session=${sessionId}, version=${newVersion}`)
return newVersion return newVersion
} }
/**
* Ask the browser bridge to export the current diagram as png/svg.
*
* When `projectionXml` is given (a single-page <mxfile>), the bridge loads it
* first, waits for draw.io's own load event, exports, then reloads the
* session's real document — so a page-targeted export never mutates the
* canonical session state and needs no fixed-delay guessing on the server.
*
* Returns false when the session is unknown. Callers should then poll
* `getState(sessionId)?.exportData` for the result.
*/
export function requestExport(
sessionId: string,
format: "png" | "svg",
projectionXml?: string,
): boolean {
const state = stateStore.get(sessionId)
if (!state) return false
state.exportData = undefined
state.exportXml = projectionXml
state.exportFormat = format
return true
}
export function requestSync(sessionId: string): boolean { export function requestSync(sessionId: string): boolean {
const state = stateStore.get(sessionId) const state = stateStore.get(sessionId)
if (state) { if (state) {
@@ -204,7 +155,7 @@ export function startHttpServer(port = 6002): Promise<number> {
} }
}) })
server.listen(port, "127.0.0.1", () => { server.listen(port, () => {
serverPort = port serverPort = port
log.info(`HTTP server running on http://localhost:${port}`) log.info(`HTTP server running on http://localhost:${port}`)
resolve(port) resolve(port)
@@ -312,11 +263,14 @@ function handleStateApi(
version: state?.version || 0, version: state?.version || 0,
syncRequested: !!state?.syncRequested, syncRequested: !!state?.syncRequested,
exportFormat: state?.exportFormat || null, exportFormat: state?.exportFormat || null,
exportXml: state?.exportXml || null,
}), }),
) )
} else if (req.method === "POST") { } else if (req.method === "POST") {
readBody(req, res, (body) => { let body = ""
req.on("data", (chunk) => {
body += chunk
})
req.on("end", () => {
try { try {
const data = JSON.parse(body) const data = JSON.parse(body)
const { sessionId } = data const { sessionId } = data
@@ -332,7 +286,6 @@ function handleStateApi(
if (state) { if (state) {
state.exportData = data.exportData state.exportData = data.exportData
state.exportFormat = undefined state.exportFormat = undefined
state.exportXml = undefined
log.debug( log.debug(
`Export data received for session=${sessionId}`, `Export data received for session=${sessionId}`,
) )
@@ -394,7 +347,11 @@ function handleRestoreApi(
return return
} }
readBody(req, res, (body) => { let body = ""
req.on("data", (chunk) => {
body += chunk
})
req.on("end", () => {
try { try {
const { sessionId, index } = JSON.parse(body) const { sessionId, index } = JSON.parse(body)
if (!sessionId || index === undefined) { if (!sessionId || index === undefined) {
@@ -436,7 +393,11 @@ function handleHistorySvgApi(
return return
} }
readBody(req, res, (body) => { let body = ""
req.on("data", (chunk) => {
body += chunk
})
req.on("end", () => {
try { try {
const { sessionId, svg } = JSON.parse(body) const { sessionId, svg } = JSON.parse(body)
if (!sessionId || !svg) { if (!sessionId || !svg) {
@@ -703,8 +664,6 @@ function getHtmlPage(sessionId: string): string {
let pendingSvgExport = null; let pendingSvgExport = null;
let pendingAiSvg = false; let pendingAiSvg = false;
let pendingMcpExport = null; // 'png' or 'svg' when MCP requested export let pendingMcpExport = null; // 'png' or 'svg' when MCP requested export
let projectionExportActive = false; // page-targeted export: showing a transient single-page projection
let projectionRestoreXml = null; // the real document to reload once a projection export finishes
window.addEventListener('message', (e) => { window.addEventListener('message', (e) => {
if (e.origin !== '${DRAWIO_ORIGIN}') return; if (e.origin !== '${DRAWIO_ORIGIN}') return;
@@ -714,10 +673,6 @@ function getHtmlPage(sessionId: string): string {
isReady = true; isReady = true;
if (pendingXml) { loadDiagram(pendingXml); pendingXml = null; } if (pendingXml) { loadDiagram(pendingXml); pendingXml = null; }
} else if ((msg.event === 'save' || msg.event === 'autosave') && msg.xml && msg.xml !== lastXml) { } else if ((msg.event === 'save' || msg.event === 'autosave') && msg.xml && msg.xml !== lastXml) {
// Ignore autosave while a single-page projection is on screen
// for a page-targeted export — otherwise we'd push the
// transient projection back as the canonical session state.
if (projectionExportActive) return;
// Request SVG export, then push state with SVG // Request SVG export, then push state with SVG
pendingSvgExport = msg.xml; pendingSvgExport = msg.xml;
iframe.contentWindow.postMessage(JSON.stringify({ action: 'export', format: 'svg' }), '*'); iframe.contentWindow.postMessage(JSON.stringify({ action: 'export', format: 'svg' }), '*');
@@ -738,9 +693,6 @@ function getHtmlPage(sessionId: string): string {
headers: { 'Content-Type': 'application/json' }, headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ sessionId, exportData: d }) body: JSON.stringify({ sessionId, exportData: d })
}).catch(() => {}); }).catch(() => {});
// Page-targeted export: restore the user's real
// multi-page document now that we have the image.
restoreFromProjection();
return; return;
} }
} }
@@ -798,22 +750,6 @@ function getHtmlPage(sessionId: string): string {
} }
} }
// Restore the user's real document after a page-targeted projection
// export. If we never captured one (lastXml was null at projection
// start), fall back to forcing a reload from the server on the next
// poll by rewinding currentVersion — never leave the iframe stuck on
// the transient projection.
function restoreFromProjection() {
if (!projectionExportActive) return;
projectionExportActive = false;
if (projectionRestoreXml) {
iframe.contentWindow.postMessage(JSON.stringify({ action: 'load', xml: projectionRestoreXml, autosave: 1 }), '*');
projectionRestoreXml = null;
} else {
currentVersion = -1; // force the next poll to reload from server
}
}
async function pushState(xml, svg = '') { async function pushState(xml, svg = '') {
if (!sessionId) return; if (!sessionId) return;
try { try {
@@ -839,54 +775,20 @@ function getHtmlPage(sessionId: string): string {
pendingSyncExport = true; pendingSyncExport = true;
iframe.contentWindow.postMessage(JSON.stringify({ action: 'export', format: 'xml' }), '*'); iframe.contentWindow.postMessage(JSON.stringify({ action: 'export', format: 'xml' }), '*');
} }
// Load new diagram from server (before export, so we export latest). // Load new diagram from server (before export, so we export latest)
// While a page-targeted projection is on screen, skip the reload if (s.version > currentVersion && s.xml) {
// so it doesn't fight the projection — and leave currentVersion
// unadvanced so this bump is re-detected and applied once the
// real document is restored.
if (s.version > currentVersion && s.xml && !projectionExportActive) {
currentVersion = s.version; currentVersion = s.version;
loadDiagram(s.xml, true); loadDiagram(s.xml, true);
} }
// Handle export request from MCP server (png/svg). // Handle export request from MCP server (png/svg) - after version update
//
// Plain export: capture whatever tab is currently displayed.
//
// Page-targeted export: the server sends a single-page <mxfile>
// projection in s.exportXml. We load it into the iframe, let
// draw.io render it, export, then reload the user's real
// document — all browser-side. The canonical session state is
// never mutated, so there is no server-side restore race and no
// dependence on poll timing. autosave is suppressed while the
// projection is showing (see projectionExportActive guard).
if (s.exportFormat && !pendingMcpExport && isReady) { if (s.exportFormat && !pendingMcpExport && isReady) {
pendingMcpExport = s.exportFormat; pendingMcpExport = s.exportFormat;
const fireExport = () => { const exportOpts = s.exportFormat === 'png'
const exportOpts = pendingMcpExport === 'png' ? { action: 'export', format: 'png', scale: 2 }
? { action: 'export', format: 'png', scale: 2 } : { action: 'export', format: 'svg' };
: { action: 'export', format: 'svg' }; iframe.contentWindow.postMessage(JSON.stringify(exportOpts), '*');
iframe.contentWindow.postMessage(JSON.stringify(exportOpts), '*'); // Timeout: reset if draw.io never responds
}; setTimeout(() => { if (pendingMcpExport) { pendingMcpExport = null; } }, 8000);
if (s.exportXml) {
// Stash the real document so we can restore after export.
projectionRestoreXml = lastXml;
projectionExportActive = true;
// Load the projection without touching lastXml/server state.
iframe.contentWindow.postMessage(JSON.stringify({ action: 'load', xml: s.exportXml, autosave: 0 }), '*');
// Let draw.io render the loaded page before exporting
// (same proven settle delay as the AI-preview path).
setTimeout(fireExport, 600);
} else {
fireExport();
}
// Timeout: reset if draw.io never responds, and restore the
// real document if a projection was left showing.
setTimeout(() => {
if (pendingMcpExport) {
pendingMcpExport = null;
restoreFromProjection();
}
}, 10000);
} }
} catch {} } catch {}
} }
@@ -926,11 +828,7 @@ function getHtmlPage(sessionId: string): string {
saveConfirmBtn.textContent = 'Exporting...'; saveConfirmBtn.textContent = 'Exporting...';
if (format === 'drawio') { if (format === 'drawio') {
// Use lastXml directly instead of requesting export (avoids race with SVG exports). // Use lastXml directly instead of requesting export (avoids race with SVG exports)
// session.xml is canonically <mxfile> after the multi-page refactor,
// so no wrapper injection is needed. The legacy fallback below
// remains only for documents that somehow slipped past
// normalisation (e.g. an older session loaded from external state).
let xmlData = lastXml || ''; let xmlData = lastXml || '';
if (xmlData && !xmlData.includes('<mxfile')) { if (xmlData && !xmlData.includes('<mxfile')) {
xmlData = '<mxfile host="mcp"><diagram name="Page-1">' + xmlData + '</diagram></mxfile>'; xmlData = '<mxfile host="mcp"><diagram name="Page-1">' + xmlData + '</diagram></mxfile>';

File diff suppressed because it is too large Load Diff

View File

@@ -1,316 +0,0 @@
/**
* Multi-page (mxfile) helpers for draw.io diagrams.
*
* The on-disk and embed-protocol shape of a draw.io document is:
*
* <mxfile host="...">
* <diagram id="..." name="...">
* <mxGraphModel><root><mxCell .../>...</root></mxGraphModel>
* </diagram>
* ...one or more <diagram> children...
* </mxfile>
*
* This module centralises page CRUD so that index.ts, xml-validation.ts,
* and diagram-operations.ts can all agree on:
* - what "the canonical in-memory shape" is (always mxfile),
* - how to find a page (id, name, or index),
* - how to add/rename/delete pages without re-parsing ad-hoc.
*/
import { DOMParser } from "linkedom"
export interface PageInfo {
id: string
name: string
index: number
cellCount: number
}
/** Selector used by all multi-page-aware tools. All fields optional. */
export interface PageSelector {
page_id?: string
page_name?: string
page_index?: number
}
/** True if the selector targets a specific page (any field set). */
export function hasPageSelector(s?: PageSelector | null): boolean {
if (!s) return false
return (
Boolean(s.page_id) || Boolean(s.page_name) || s.page_index !== undefined
)
}
/**
* Generate a short page id similar in shape to drawio's auto-assigned ids.
* Format: 12 chars alphanumeric with a single dash. Not a UUID — drawio itself
* uses short ids; collisions are still astronomically unlikely for one session.
*/
export function generatePageId(): string {
const a = Math.random().toString(36).substring(2, 10)
const b = Math.random().toString(36).substring(2, 6)
return `${a}-${b}`
}
/** Cheap regex check — does the XML start with an <mxfile> root? */
export function isMxFile(xml: string): boolean {
return /^\s*(<\?xml[^>]*\?>\s*)?<mxfile[\s>]/i.test(xml)
}
/** Cheap regex check — does the XML start with a bare <mxGraphModel>? */
export function isMxGraphModel(xml: string): boolean {
return /^\s*(<\?xml[^>]*\?>\s*)?<mxGraphModel[\s>]/i.test(xml)
}
function escapeAttr(s: string): string {
return s
.replace(/&/g, "&amp;")
.replace(/</g, "&lt;")
.replace(/>/g, "&gt;")
.replace(/"/g, "&quot;")
}
/**
* Strip a leading <?xml ... ?> declaration from an XML string. The XML spec
* only permits the declaration at the very start of a document, so embedding
* a declaration inside another element produces invalid XML. Callers must
* strip before splicing a fragment into a wrapper.
*/
function stripXmlDeclaration(xml: string): string {
return xml.replace(/^\s*<\?xml[^>]*\?>\s*/i, "")
}
/**
* Wrap a bare <mxGraphModel> XML string in <mxfile><diagram>...</diagram></mxfile>.
* If the input is already an mxfile, returns it unchanged.
* If the input is neither shape, returns null so the caller can surface a clear error.
*
* Strips any leading <?xml ?> declaration before embedding — a declaration is
* only valid at the very start of a document, never inside a <diagram>.
*/
export function normalizeToMxfile(
xml: string,
opts: { pageId?: string; pageName?: string; host?: string } = {},
): string | null {
const trimmed = xml.trim()
if (!trimmed) return null
if (isMxFile(trimmed)) return trimmed
if (!isMxGraphModel(trimmed)) return null
const pageId = opts.pageId || generatePageId()
const pageName = opts.pageName || "Page-1"
const host = opts.host || "app.diagrams.net"
const inner = stripXmlDeclaration(trimmed)
return `<mxfile host="${escapeAttr(host)}"><diagram id="${escapeAttr(pageId)}" name="${escapeAttr(pageName)}">${inner}</diagram></mxfile>`
}
/**
* Parse an mxfile XML string. Returns null on parse error or if the root
* isn't <mxfile> — callers are expected to have run normalizeToMxfile first.
*/
export function parseMxfile(xml: string): Document | null {
try {
const doc = new DOMParser().parseFromString(xml, "text/xml")
if (doc.querySelector("parsererror")) return null
if (doc.documentElement?.tagName !== "mxfile") return null
return doc as unknown as Document
} catch {
return null
}
}
/** Serialise an mxfile doc back to a string via the global XMLSerializer polyfill. */
export function serializeMxfile(doc: Document): string {
const serializer = new XMLSerializer()
return serializer.serializeToString(doc)
}
export type PageProjection =
| { ok: true; xml: string; index: number; name: string }
| { ok: false; reason: "parse" | "notfound" }
/**
* Project a single page out of an mxfile string into a standalone one-page
* <mxfile>. Used by get_diagram and export_diagram so the three call sites
* share one parse → find → serialise path.
*
* Returns { ok:false, reason:"parse" } if the xml isn't a parseable mxfile,
* or { ok:false, reason:"notfound" } if the selector matches no page.
*/
export function projectPage(
xml: string,
selector: PageSelector,
): PageProjection {
const doc = parseMxfile(xml)
if (!doc) return { ok: false, reason: "parse" }
const found = findPageElement(doc, selector)
if (!found) return { ok: false, reason: "notfound" }
const serializer = new XMLSerializer()
return {
ok: true,
xml: `<mxfile host="app.diagrams.net">${serializer.serializeToString(found.element)}</mxfile>`,
index: found.index,
name: found.element.getAttribute("name") || "",
}
}
/** Walk every <diagram> child of <mxfile> and return summary info. */
export function listPagesFromDoc(doc: Document): PageInfo[] {
const diagrams = doc.querySelectorAll("diagram")
const result: PageInfo[] = []
diagrams.forEach((d, idx) => {
const root = d.querySelector("root")
const cellCount = root ? root.querySelectorAll("mxCell").length : 0
result.push({
id: d.getAttribute("id") || "",
name: d.getAttribute("name") || `Page-${idx + 1}`,
index: idx,
cellCount,
})
})
return result
}
/**
* Resolve a page selector to its <diagram> element.
* Resolution order: page_id → page_name → page_index → default (first page).
*
* When no selector field is set we return the first page — the "active page
* by convention" mentioned in §3.4 of the design doc.
*/
export function findPageElement(
doc: Document,
selector?: PageSelector,
): { element: Element; index: number } | null {
const diagrams = Array.from(doc.querySelectorAll("diagram"))
if (diagrams.length === 0) return null
if (!hasPageSelector(selector)) {
return { element: diagrams[0], index: 0 }
}
if (selector?.page_id) {
for (let i = 0; i < diagrams.length; i++) {
if (diagrams[i].getAttribute("id") === selector.page_id) {
return { element: diagrams[i], index: i }
}
}
return null
}
if (selector?.page_name) {
for (let i = 0; i < diagrams.length; i++) {
if (diagrams[i].getAttribute("name") === selector.page_name) {
return { element: diagrams[i], index: i }
}
}
return null
}
if (selector && selector.page_index !== undefined) {
const idx = selector.page_index
if (Number.isInteger(idx) && idx >= 0 && idx < diagrams.length) {
return { element: diagrams[idx], index: idx }
}
return null
}
return null
}
/**
* Append a new <diagram> to the mxfile doc. The new page's model defaults to
* an empty <mxGraphModel><root><mxCell id="0"/><mxCell id="1" parent="0"/></root></mxGraphModel>.
*
* `opts.xml` must be a BARE <mxGraphModel> — passing a full <mxfile> would
* end up nested inside <diagram>, which is malformed. We reject the mxfile
* shape explicitly and strip any <?xml ?> declaration (only valid at
* document start, never inside <diagram>).
*
* Returns the new PageInfo. Throws if the requested id collides or the xml
* shape is wrong.
*/
export function addPageToDoc(
doc: Document,
opts: { id?: string; name?: string; xml?: string } = {},
): PageInfo {
const existing = listPagesFromDoc(doc)
const id = opts.id || generatePageId()
if (existing.some((p) => p.id === id)) {
throw new Error(`Page id "${id}" already exists`)
}
const name = opts.name || `Page-${existing.length + 1}`
let inner: string
if (opts.xml?.trim()) {
const trimmed = stripXmlDeclaration(opts.xml.trim())
if (isMxFile(trimmed)) {
throw new Error(
"addPageToDoc: opts.xml must be a bare <mxGraphModel>; received a full <mxfile>. Extract the target diagram's <mxGraphModel> first.",
)
}
if (!isMxGraphModel(trimmed)) {
throw new Error(
"addPageToDoc: opts.xml must be a bare <mxGraphModel>.",
)
}
inner = trimmed
} else {
inner = `<mxGraphModel><root><mxCell id="0"/><mxCell id="1" parent="0"/></root></mxGraphModel>`
}
const snippet = `<wrapper><diagram id="${escapeAttr(id)}" name="${escapeAttr(name)}">${inner}</diagram></wrapper>`
const tempDoc = new DOMParser().parseFromString(snippet, "text/xml")
if (tempDoc.querySelector("parsererror")) {
throw new Error(
"Failed to parse new page xml — make sure it is a valid <mxGraphModel>",
)
}
const newDiagram = tempDoc.querySelector("diagram")
if (!newDiagram) {
throw new Error("Failed to construct <diagram> element for new page")
}
const imported = doc.importNode(newDiagram, true) as Element
doc.documentElement.appendChild(imported)
return {
id,
name,
index: existing.length,
cellCount: imported.querySelectorAll("mxCell").length,
}
}
/** Rename the page matched by selector. Returns true on success. */
export function renamePageInDoc(
doc: Document,
selector: PageSelector,
newName: string,
): boolean {
const found = findPageElement(doc, selector)
if (!found) return false
found.element.setAttribute("name", newName)
return true
}
/**
* Delete a page. Refuses to delete the last remaining page — the embed needs
* at least one diagram to render anything, and silently recreating one would
* be surprising behaviour for an MCP caller.
*/
export function deletePageFromDoc(
doc: Document,
selector: PageSelector,
): { ok: boolean; reason?: string; deletedId?: string; deletedIndex?: number } {
const pages = listPagesFromDoc(doc)
if (pages.length <= 1) {
return { ok: false, reason: "Cannot delete the only remaining page" }
}
const found = findPageElement(doc, selector)
if (!found) {
return { ok: false, reason: "Page not found" }
}
const id = found.element.getAttribute("id") || ""
const index = found.index
found.element.parentNode?.removeChild(found.element)
return { ok: true, deletedId: id, deletedIndex: index }
}

View File

@@ -119,74 +119,8 @@ function checkDuplicateAttributes(xml: string): string | null {
return null return null
} }
/** /** Check for duplicate IDs in XML */
* Check for duplicate IDs in XML.
*
* For multi-page documents (<mxfile> with multiple <diagram> children), cell
* IDs are unique **within a page**, not across the whole document — drawio
* legitimately reuses "0" and "1" for the root cells of every page. So we
* scope the cell-ID uniqueness check per <diagram>, and additionally check
* that the <diagram> ids themselves are unique.
*
* The legacy regex-based check is kept as a fallback for non-mxfile inputs
* and for XML that won't DOM-parse.
*/
function checkDuplicateIds(xml: string): string | null { function checkDuplicateIds(xml: string): string | null {
// The DOM-aware path only matters for <mxfile> wrappers; for legacy
// bare <mxGraphModel> inputs (the overwhelming majority of historic
// traffic), the cheap regex fallback at the bottom is enough. A quick
// string check avoids paying the DOMParser cost on every call.
const mightBeMxFile = /<mxfile[\s>]/i.test(xml)
// Try DOM-aware, page-scoped check first when the input looks mxfile-ish.
if (mightBeMxFile)
try {
const doc = new DOMParser().parseFromString(xml, "text/xml")
if (!doc.querySelector("parsererror")) {
const rootEl = doc.documentElement
if (rootEl && rootEl.tagName === "mxfile") {
const diagrams = doc.querySelectorAll("diagram")
// 1) <diagram> ids must be unique across the file.
const diagramIds = new Map<string, number>()
diagrams.forEach((d) => {
const id = d.getAttribute("id")
if (id)
diagramIds.set(id, (diagramIds.get(id) || 0) + 1)
})
const dupDiagrams = Array.from(diagramIds.entries())
.filter(([, c]) => c > 1)
.map(([id]) => `'${id}'`)
if (dupDiagrams.length > 0) {
return `Invalid XML: Found duplicate <diagram> id(s): ${dupDiagrams.slice(0, 3).join(", ")}. Each page must have a unique id.`
}
// 2) Within each page, mxCell ids must be unique.
for (let i = 0; i < diagrams.length; i++) {
const diagram = diagrams[i]
const pageId =
diagram.getAttribute("id") || `(index ${i})`
const cells = diagram.querySelectorAll("mxCell")
const cellIds = new Map<string, number>()
cells.forEach((c) => {
const id = c.getAttribute("id")
if (id) cellIds.set(id, (cellIds.get(id) || 0) + 1)
})
const dups = Array.from(cellIds.entries())
.filter(([, c]) => c > 1)
.map(([id, count]) => `'${id}' (${count}x)`)
if (dups.length > 0) {
return `Invalid XML: Found duplicate cell ID(s) in page "${pageId}": ${dups.slice(0, 3).join(", ")}. All mxCell ids must be unique within a page.`
}
}
return null
}
}
} catch {
// fall through to regex
}
// Legacy regex-based check for bare <mxGraphModel> and parse-error cases.
const idPattern = /\bid\s*=\s*["']([^"']+)["']/gi const idPattern = /\bid\s*=\s*["']([^"']+)["']/gi
const ids = new Map<string, number>() const ids = new Map<string, number>()
let idMatch let idMatch
@@ -836,46 +770,35 @@ export function autoFixXml(xml: string): { fixed: string; fixes: string[] } {
fixes.push(`Fixed ${trueNestedFixed} true nested mxCell(s)`) fixes.push(`Fixed ${trueNestedFixed} true nested mxCell(s)`)
} }
// 22. Fix duplicate IDs by appending suffix. // 22. Fix duplicate IDs by appending suffix
// Skipped for multi-page <mxfile> documents — cell ids "0" and "1" repeat const seenIds = new Map<string, number>()
// across pages legitimately (every page has its own <root> with id="0"/"1" const duplicateIds: string[] = []
// sentinel cells). Renaming them would break drawio's parent references.
// For mxfile inputs, duplicate-id validation is page-scoped in
// checkDuplicateIds() and a true duplicate produces a hard error rather
// than a silent rename.
if (!/<mxfile[\s>]/i.test(fixed)) {
const seenIds = new Map<string, number>()
const duplicateIds: string[] = []
const idPattern = /\bid\s*=\s*["']([^"']+)["']/gi const idPattern = /\bid\s*=\s*["']([^"']+)["']/gi
let idMatch let idMatch
while ((idMatch = idPattern.exec(fixed)) !== null) { while ((idMatch = idPattern.exec(fixed)) !== null) {
const id = idMatch[1] const id = idMatch[1]
seenIds.set(id, (seenIds.get(id) || 0) + 1) seenIds.set(id, (seenIds.get(id) || 0) + 1)
} }
for (const [id, count] of seenIds) { for (const [id, count] of seenIds) {
if (count > 1) duplicateIds.push(id) if (count > 1) duplicateIds.push(id)
} }
if (duplicateIds.length > 0) { if (duplicateIds.length > 0) {
const idCounters = new Map<string, number>() const idCounters = new Map<string, number>()
fixed = fixed.replace( fixed = fixed.replace(/\bid\s*=\s*["']([^"']+)["']/gi, (match, id) => {
/\bid\s*=\s*["']([^"']+)["']/gi, if (!duplicateIds.includes(id)) return match
(match, id) => {
if (!duplicateIds.includes(id)) return match
const count = idCounters.get(id) || 0 const count = idCounters.get(id) || 0
idCounters.set(id, count + 1) idCounters.set(id, count + 1)
if (count === 0) return match if (count === 0) return match
const newId = `${id}_dup${count}` const newId = `${id}_dup${count}`
return match.replace(id, newId) return match.replace(id, newId)
}, })
) fixes.push(`Renamed ${duplicateIds.length} duplicate ID(s)`)
fixes.push(`Renamed ${duplicateIds.length} duplicate ID(s)`)
}
} }
// 23. Fix empty id attributes // 23. Fix empty id attributes

View File

@@ -1,545 +0,0 @@
/**
* Unit tests for multi-page (mxfile) support.
*
* Pinned to the user-visible contract described in
* multi-page-mcp-support-plan.md §5 (acceptance criteria):
*
* AC1. create_new_diagram accepts both bare <mxGraphModel> and full <mxfile>.
* AC2. get_diagram returns the full <mxfile> regardless of page count.
* AC3. edit_diagram accepts an optional page selector.
* AC6. Two tool calls reproduce the Transformer/CNN scenario.
* AC9. The wrapper-injection hack at http-server.ts:845 is unnecessary.
*
* These tests pin the helpers (pages.ts), the validator update
* (xml-validation.ts), and the page-targeted edit logic
* (diagram-operations.ts) — i.e. the layers underneath the MCP tool surface.
*/
import { DOMParser } from "linkedom"
import { beforeAll, describe, expect, it } from "vitest"
// Install the DOM polyfill exactly as index.ts does at runtime — the
// helpers under test rely on it.
beforeAll(() => {
;(globalThis as any).DOMParser = DOMParser
class XMLSerializerPolyfill {
serializeToString(node: any): string {
if (node.outerHTML !== undefined) return node.outerHTML
if (node.documentElement) return node.documentElement.outerHTML
return ""
}
}
;(globalThis as any).XMLSerializer = XMLSerializerPolyfill
})
import { applyDiagramOperations } from "../src/diagram-operations.js"
import {
addPageToDoc,
deletePageFromDoc,
findPageElement,
generatePageId,
hasPageSelector,
isMxFile,
isMxGraphModel,
listPagesFromDoc,
normalizeToMxfile,
parseMxfile,
projectPage,
renamePageInDoc,
serializeMxfile,
} from "../src/pages.js"
import { validateAndFixXml } from "../src/xml-validation.js"
const BARE_MODEL_ONE_CELL = `<mxGraphModel><root><mxCell id="0"/><mxCell id="1" parent="0"/><mxCell id="2" vertex="1" parent="1" value="Hello"><mxGeometry x="40" y="40" width="100" height="40" as="geometry"/></mxCell></root></mxGraphModel>`
const TWO_PAGE_MXFILE = `<mxfile host="app.diagrams.net"><diagram id="page-transformer" name="Transformer"><mxGraphModel><root><mxCell id="0"/><mxCell id="1" parent="0"/><mxCell id="2" vertex="1" parent="1" value="Encoder"><mxGeometry x="40" y="40" width="120" height="60" as="geometry"/></mxCell></root></mxGraphModel></diagram><diagram id="page-cnn" name="CNN"><mxGraphModel><root><mxCell id="0"/><mxCell id="1" parent="0"/><mxCell id="2" vertex="1" parent="1" value="Conv1"><mxGeometry x="40" y="40" width="120" height="60" as="geometry"/></mxCell></root></mxGraphModel></diagram></mxfile>`
describe("pages.ts — shape detection", () => {
it("isMxFile detects a multi-page mxfile", () => {
expect(isMxFile(TWO_PAGE_MXFILE)).toBe(true)
})
it("isMxFile rejects a bare mxGraphModel", () => {
expect(isMxFile(BARE_MODEL_ONE_CELL)).toBe(false)
})
it("isMxGraphModel detects a bare model", () => {
expect(isMxGraphModel(BARE_MODEL_ONE_CELL)).toBe(true)
expect(isMxGraphModel(TWO_PAGE_MXFILE)).toBe(false)
})
it("isMxFile tolerates an XML declaration prefix", () => {
expect(
isMxFile(
`<?xml version="1.0" encoding="UTF-8"?>${TWO_PAGE_MXFILE}`,
),
).toBe(true)
})
})
describe("pages.ts — normalizeToMxfile (backward compatibility, AC1)", () => {
it("wraps a bare mxGraphModel into a single-page mxfile", () => {
const out = normalizeToMxfile(BARE_MODEL_ONE_CELL, {
pageId: "p1",
pageName: "Page-1",
})
expect(out).not.toBeNull()
expect(out).toMatch(/^<mxfile/)
expect(out).toContain(`<diagram id="p1" name="Page-1">`)
expect(out).toContain("<mxGraphModel>")
})
it("returns mxfile inputs unchanged", () => {
const out = normalizeToMxfile(TWO_PAGE_MXFILE)
expect(out).toBe(TWO_PAGE_MXFILE)
})
it("returns null for neither shape", () => {
expect(normalizeToMxfile("<random/>")).toBeNull()
expect(normalizeToMxfile("")).toBeNull()
})
it("generated page ids look reasonable", () => {
for (let i = 0; i < 50; i++) {
const id = generatePageId()
expect(id).toMatch(/^[a-z0-9]+-[a-z0-9]+$/)
}
})
it("strips a leading <?xml ?> declaration when wrapping a bare model", () => {
// Regression for the bug Copilot caught: isMxGraphModel tolerates a
// declaration prefix, but the wrapper used to embed it inside
// <diagram>, producing invalid XML (<?xml ?> is only valid at the
// document start). The result must round-trip through parseMxfile
// and the declaration must be gone from inside <diagram>.
const withDecl = `<?xml version="1.0" encoding="UTF-8"?>${BARE_MODEL_ONE_CELL}`
const out = normalizeToMxfile(withDecl, {
pageId: "p1",
pageName: "Page-1",
})
expect(out).not.toBeNull()
expect(out).toMatch(/^<mxfile/)
// No <?xml inside the body of the wrapped document.
expect(out!.indexOf("<?xml")).toBe(-1)
// And it must still parse cleanly.
const doc = parseMxfile(out!)
expect(doc).not.toBeNull()
expect(listPagesFromDoc(doc!)).toHaveLength(1)
})
})
describe("pages.ts — addPageToDoc input validation", () => {
it("rejects opts.xml shaped as a full <mxfile>", () => {
// Regression for the Copilot-flagged bug: an mxfile passed as
// starting page xml would end up nested inside <diagram>, corrupting
// the document. Must throw with a clear message.
const doc = parseMxfile(TWO_PAGE_MXFILE)!
expect(() =>
addPageToDoc(doc, { name: "Bad", xml: TWO_PAGE_MXFILE }),
).toThrowError(/bare <mxGraphModel>/i)
})
it("rejects opts.xml that is neither mxGraphModel nor mxfile", () => {
const doc = parseMxfile(TWO_PAGE_MXFILE)!
expect(() =>
addPageToDoc(doc, { name: "Junk", xml: "<root><x/></root>" }),
).toThrowError(/bare <mxGraphModel>/i)
})
it("strips a <?xml ?> declaration prefix on opts.xml", () => {
const doc = parseMxfile(TWO_PAGE_MXFILE)!
const withDecl = `<?xml version="1.0"?>${BARE_MODEL_ONE_CELL}`
const info = addPageToDoc(doc, { name: "Sequence", xml: withDecl })
expect(info.cellCount).toBeGreaterThanOrEqual(3)
// Serialised document must not have <?xml ?> inside <diagram>.
const out = serializeMxfile(doc)
// The mxfile may have one <?xml ?> at the very start (the doc decl),
// but no further occurrence inside <diagram>.
const matches = out.match(/<\?xml/g) || []
expect(matches.length).toBeLessThanOrEqual(1)
})
})
describe("pages.ts — listPagesFromDoc / findPageElement", () => {
it("lists both pages in a two-page mxfile", () => {
const doc = parseMxfile(TWO_PAGE_MXFILE)!
const pages = listPagesFromDoc(doc)
expect(pages).toHaveLength(2)
expect(pages[0]).toMatchObject({
id: "page-transformer",
name: "Transformer",
index: 0,
})
expect(pages[1]).toMatchObject({
id: "page-cnn",
name: "CNN",
index: 1,
})
// Cell count is per-page (3 cells per page including the two root sentinels).
expect(pages[0].cellCount).toBe(3)
expect(pages[1].cellCount).toBe(3)
})
it("findPageElement defaults to the first page when selector is empty", () => {
const doc = parseMxfile(TWO_PAGE_MXFILE)!
const found = findPageElement(doc)
expect(found?.index).toBe(0)
expect(found?.element.getAttribute("id")).toBe("page-transformer")
})
it("findPageElement matches by id, name, and index — id wins when several are set", () => {
const doc = parseMxfile(TWO_PAGE_MXFILE)!
expect(findPageElement(doc, { page_id: "page-cnn" })?.index).toBe(1)
expect(findPageElement(doc, { page_name: "CNN" })?.index).toBe(1)
expect(findPageElement(doc, { page_index: 1 })?.index).toBe(1)
// id beats name beats index
const winner = findPageElement(doc, {
page_id: "page-cnn",
page_name: "Transformer",
page_index: 0,
})
expect(winner?.index).toBe(1)
})
it("findPageElement returns null for an unknown selector", () => {
const doc = parseMxfile(TWO_PAGE_MXFILE)!
expect(findPageElement(doc, { page_id: "ghost" })).toBeNull()
expect(findPageElement(doc, { page_name: "ghost" })).toBeNull()
expect(findPageElement(doc, { page_index: 99 })).toBeNull()
expect(findPageElement(doc, { page_index: -1 })).toBeNull()
})
it("hasPageSelector correctly detects empty vs populated selectors", () => {
expect(hasPageSelector()).toBe(false)
expect(hasPageSelector({})).toBe(false)
expect(hasPageSelector({ page_id: "x" })).toBe(true)
expect(hasPageSelector({ page_index: 0 })).toBe(true)
})
})
describe("pages.ts — addPageToDoc", () => {
it("appends a third page and returns its info", () => {
const doc = parseMxfile(TWO_PAGE_MXFILE)!
const info = addPageToDoc(doc, { name: "Sequence" })
expect(info.name).toBe("Sequence")
expect(info.index).toBe(2)
expect(info.id).toMatch(/.+/)
const pages = listPagesFromDoc(doc)
expect(pages).toHaveLength(3)
expect(pages[2].name).toBe("Sequence")
})
it("rejects a duplicate explicit id", () => {
const doc = parseMxfile(TWO_PAGE_MXFILE)!
expect(() =>
addPageToDoc(doc, { id: "page-transformer", name: "X" }),
).toThrowError(/already exists/)
})
it("uses a sensible default name when none is supplied", () => {
const doc = parseMxfile(TWO_PAGE_MXFILE)!
const info = addPageToDoc(doc, {})
expect(info.name).toBe("Page-3")
})
it("accepts an inline starting mxGraphModel", () => {
const doc = parseMxfile(TWO_PAGE_MXFILE)!
const inner = `<mxGraphModel><root><mxCell id="0"/><mxCell id="1" parent="0"/><mxCell id="2" vertex="1" parent="1" value="A"><mxGeometry x="10" y="10" width="20" height="20" as="geometry"/></mxCell></root></mxGraphModel>`
const info = addPageToDoc(doc, { name: "Custom", xml: inner })
expect(info.cellCount).toBeGreaterThanOrEqual(3)
})
})
describe("pages.ts — renamePageInDoc / deletePageFromDoc", () => {
it("renames an existing page by name", () => {
const doc = parseMxfile(TWO_PAGE_MXFILE)!
const ok = renamePageInDoc(doc, { page_name: "CNN" }, "CNN-v2")
expect(ok).toBe(true)
const pages = listPagesFromDoc(doc)
expect(pages[1].name).toBe("CNN-v2")
})
it("rename returns false when target page is missing", () => {
const doc = parseMxfile(TWO_PAGE_MXFILE)!
expect(renamePageInDoc(doc, { page_id: "ghost" }, "Z")).toBe(false)
})
it("deletes a page and removes the <diagram> element from the doc", () => {
const doc = parseMxfile(TWO_PAGE_MXFILE)!
const outcome = deletePageFromDoc(doc, { page_id: "page-cnn" })
expect(outcome.ok).toBe(true)
expect(outcome.deletedId).toBe("page-cnn")
expect(listPagesFromDoc(doc)).toHaveLength(1)
})
it("refuses to delete the only remaining page", () => {
// Build a single-page doc to test the guard.
const single = normalizeToMxfile(BARE_MODEL_ONE_CELL)!
const doc = parseMxfile(single)!
const outcome = deletePageFromDoc(doc, { page_index: 0 })
expect(outcome.ok).toBe(false)
expect(outcome.reason).toMatch(/only remaining page/)
})
})
describe("xml-validation.ts — multi-page support", () => {
it("accepts a valid two-page mxfile (the exact payload that used to fail)", () => {
const result = validateAndFixXml(TWO_PAGE_MXFILE)
expect(result.valid).toBe(true)
expect(result.error).toBeNull()
})
it("does NOT flag root sentinel ids 0 and 1 repeating across pages", () => {
// This is the regression the planning doc explicitly called out:
// before this work, the legacy regex-based duplicate-id check rejected
// any multi-page document because cells "0" and "1" appear in every page.
const result = validateAndFixXml(TWO_PAGE_MXFILE)
expect(result.valid).toBe(true)
})
it("rejects duplicate cell ids WITHIN a single page", () => {
const bad = `<mxfile host="app.diagrams.net"><diagram id="p1" name="P1"><mxGraphModel><root><mxCell id="0"/><mxCell id="1" parent="0"/><mxCell id="dup" vertex="1" parent="1"/><mxCell id="dup" vertex="1" parent="1"/></root></mxGraphModel></diagram></mxfile>`
const result = validateAndFixXml(bad)
expect(result.valid).toBe(false)
expect(result.error).toMatch(/duplicate cell ID/i)
})
it("rejects duplicate <diagram> ids across the file", () => {
const bad = `<mxfile host="app.diagrams.net"><diagram id="p1" name="A"><mxGraphModel><root><mxCell id="0"/><mxCell id="1" parent="0"/></root></mxGraphModel></diagram><diagram id="p1" name="B"><mxGraphModel><root><mxCell id="0"/><mxCell id="1" parent="0"/></root></mxGraphModel></diagram></mxfile>`
const result = validateAndFixXml(bad)
expect(result.valid).toBe(false)
expect(result.error).toMatch(/duplicate <diagram> id/i)
})
it("still validates a bare <mxGraphModel> (legacy callers)", () => {
const result = validateAndFixXml(BARE_MODEL_ONE_CELL)
expect(result.valid).toBe(true)
})
it("auto-fix does NOT rename mxfile root cells 0/1 (would break drawio refs)", () => {
// Build a doc that triggers some other auto-fix (so autoFixXml runs)
// but contains valid multi-page 0/1 cells that must NOT be renamed.
const malformedButMultiPage = `<mxfile host="app.diagrams.net"><diagram id="p1" name="A"><mxGraphModel><root><mxCell id="0"/><mxCell id="1" parent="0"/><mxCell id="2" vertex="1" parent="1" value="Q & A"><mxGeometry x="0" y="0" width="10" height="10" as="geometry"/></mxCell></root></mxGraphModel></diagram><diagram id="p2" name="B"><mxGraphModel><root><mxCell id="0"/><mxCell id="1" parent="0"/></root></mxGraphModel></diagram></mxfile>`
const result = validateAndFixXml(malformedButMultiPage)
// The doc has an unescaped & — autoFix will repair that. After repair
// it should be valid AND must not have renamed the 0/1 cells.
const finalXml = result.fixed || malformedButMultiPage
expect(finalXml).not.toMatch(/id="0_dup/)
expect(finalXml).not.toMatch(/id="1_dup/)
})
})
describe("diagram-operations.ts — page-targeted edits (AC3)", () => {
it("adds a cell to the targeted page by id, leaving the other page untouched", () => {
const { result, errors } = applyDiagramOperations(
TWO_PAGE_MXFILE,
[
{
operation: "add",
cell_id: "conv-2",
new_xml: `<mxCell id="conv-2" vertex="1" parent="1" value="Conv2"><mxGeometry x="200" y="40" width="120" height="60" as="geometry"/></mxCell>`,
},
],
{ page_id: "page-cnn" },
)
expect(errors).toHaveLength(0)
const doc = parseMxfile(result)!
const pages = listPagesFromDoc(doc)
// Transformer untouched (still 3 cells), CNN gained one cell.
expect(pages[0].cellCount).toBe(3)
expect(pages[1].cellCount).toBe(4)
expect(result).toContain(`id="conv-2"`)
})
it("defaults to the first page when no selector is given", () => {
const { result, errors } = applyDiagramOperations(TWO_PAGE_MXFILE, [
{
operation: "add",
cell_id: "shape-x",
new_xml: `<mxCell id="shape-x" vertex="1" parent="1"><mxGeometry x="0" y="0" width="10" height="10" as="geometry"/></mxCell>`,
},
])
expect(errors).toHaveLength(0)
const doc = parseMxfile(result)!
const pages = listPagesFromDoc(doc)
expect(pages[0].cellCount).toBe(4) // Transformer (first page) grew
expect(pages[1].cellCount).toBe(3) // CNN untouched
})
it("errors clearly when the page is not found", () => {
const { errors } = applyDiagramOperations(
TWO_PAGE_MXFILE,
[
{
operation: "delete",
cell_id: "2",
},
],
{ page_id: "does-not-exist" },
)
expect(errors).toHaveLength(1)
expect(errors[0].message).toMatch(/Page.*not found/i)
// Page-level errors carry an empty cellId — edit_diagram relies on
// this to distinguish "nothing applied" from per-cell warnings and
// return a hard error instead of a false success.
expect(errors[0].cellId).toBe("")
})
it("delete on page 2 does NOT touch page 1's mxCell with the same id", () => {
// Both pages have a cell with id="2". A delete on CNN's "2" must not
// remove Transformer's "2".
const { result, errors } = applyDiagramOperations(
TWO_PAGE_MXFILE,
[{ operation: "delete", cell_id: "2" }],
{ page_id: "page-cnn" },
)
expect(errors).toHaveLength(0)
const doc = parseMxfile(result)!
const pages = listPagesFromDoc(doc)
// CNN lost its only non-sentinel cell, Transformer keeps its three.
expect(pages[1].cellCount).toBe(2)
expect(pages[0].cellCount).toBe(3)
})
it("legacy bare-mxGraphModel input still works when no selector is given", () => {
const { result, errors } = applyDiagramOperations(BARE_MODEL_ONE_CELL, [
{
operation: "add",
cell_id: "new",
new_xml: `<mxCell id="new" vertex="1" parent="1"><mxGeometry x="100" y="100" width="50" height="50" as="geometry"/></mxCell>`,
},
])
expect(errors).toHaveLength(0)
expect(result).toContain(`id="new"`)
})
it("page selector on a bare mxGraphModel returns a clear error", () => {
const { errors } = applyDiagramOperations(
BARE_MODEL_ONE_CELL,
[{ operation: "delete", cell_id: "2" }],
{ page_id: "page-1" },
)
expect(errors).toHaveLength(1)
expect(errors[0].message).toMatch(/not multi-page/i)
})
})
describe("export_diagram — single-page projection (regression for selectPage bug)", () => {
// The previous implementation tried to drive drawio's iframe with an
// `action: 'selectPage'` postMessage, which the embed protocol silently
// ignores. The result was that PNG/SVG exports targeted the currently
// active tab regardless of the page selector — two visually different
// pages would yield byte-identical PNGs.
//
// The current implementation builds a single-page <mxfile> projection via
// the shared pages.ts:projectPage helper and hands it to the browser
// bridge to load BEFORE triggering export. These tests pin that helper so
// a future refactor can't silently re-introduce the multi-page drift.
function projectSinglePage(fullMxfile: string, sel: any): string {
const result = projectPage(fullMxfile, sel)
if (!result.ok) throw new Error(`projection failed: ${result.reason}`)
return result.xml
}
it("returns a parse error for a non-mxfile source", () => {
const result = projectPage(BARE_MODEL_ONE_CELL, { page_id: "x" })
expect(result.ok).toBe(false)
if (!result.ok) expect(result.reason).toBe("parse")
})
it("returns a notfound error for an unknown page", () => {
const result = projectPage(TWO_PAGE_MXFILE, { page_id: "ghost" })
expect(result.ok).toBe(false)
if (!result.ok) expect(result.reason).toBe("notfound")
})
it("projects only the requested page when targeted by id", () => {
const projected = projectSinglePage(TWO_PAGE_MXFILE, {
page_id: "page-cnn",
})
const pages = listPagesFromDoc(parseMxfile(projected)!)
expect(pages).toHaveLength(1)
expect(pages[0].id).toBe("page-cnn")
expect(pages[0].name).toBe("CNN")
// The projection must NOT contain the Transformer page anywhere.
expect(projected).not.toContain('id="page-transformer"')
expect(projected).not.toContain('name="Transformer"')
})
it("projects only the requested page when targeted by name", () => {
const projected = projectSinglePage(TWO_PAGE_MXFILE, {
page_name: "Transformer",
})
const pages = listPagesFromDoc(parseMxfile(projected)!)
expect(pages).toHaveLength(1)
expect(pages[0].name).toBe("Transformer")
expect(projected).not.toContain('id="page-cnn"')
})
it("projects only the requested page when targeted by index", () => {
const projected = projectSinglePage(TWO_PAGE_MXFILE, {
page_index: 1,
})
const pages = listPagesFromDoc(parseMxfile(projected)!)
expect(pages).toHaveLength(1)
expect(pages[0].index).toBe(0) // re-indexed: it's the only page in the projection
expect(pages[0].id).toBe("page-cnn")
})
it("two different page selectors produce visually distinct projections", () => {
// The regression: under the old selectPage bug, two exports would
// return the same active tab. With the projection approach, the
// payload that drawio renders is provably different.
const a = projectSinglePage(TWO_PAGE_MXFILE, {
page_id: "page-transformer",
})
const b = projectSinglePage(TWO_PAGE_MXFILE, { page_id: "page-cnn" })
expect(a).not.toBe(b)
expect(a).toContain('"Encoder"')
expect(a).not.toContain('"Conv1"')
expect(b).toContain('"Conv1"')
expect(b).not.toContain('"Encoder"')
})
it("the projection parses to a valid one-page mxfile", () => {
const projected = projectSinglePage(TWO_PAGE_MXFILE, {
page_id: "page-cnn",
})
// Validator accepts it.
expect(validateAndFixXml(projected).valid).toBe(true)
// And it has a real <root> with the cells from the source page.
const doc = parseMxfile(projected)!
const root = doc.querySelector("root")
expect(root).not.toBeNull()
const conv1 = doc.querySelector('mxCell[value="Conv1"]')
expect(conv1).not.toBeNull()
})
})
describe("end-to-end — Transformer + CNN scenario (AC6)", () => {
it("two tool-equivalent steps reproduce the motivating user scenario", () => {
// Step 1 — caller passes a single-page mxfile.
const step1 = normalizeToMxfile(BARE_MODEL_ONE_CELL, {
pageId: "page-transformer",
pageName: "Transformer",
})
expect(step1).not.toBeNull()
let xml = step1 as string
const validate1 = validateAndFixXml(xml)
expect(validate1.valid).toBe(true)
// Step 2 — equivalent of add_page("CNN") with a starting model.
const doc = parseMxfile(xml)!
addPageToDoc(doc, {
id: "page-cnn",
name: "CNN",
xml: `<mxGraphModel><root><mxCell id="0"/><mxCell id="1" parent="0"/><mxCell id="2" vertex="1" parent="1" value="Conv1"><mxGeometry x="40" y="40" width="120" height="60" as="geometry"/></mxCell></root></mxGraphModel>`,
})
xml = serializeMxfile(doc)
// Now: two pages, both valid, with the right names.
const pages = listPagesFromDoc(parseMxfile(xml)!)
expect(pages.map((p) => p.name)).toEqual(["Transformer", "CNN"])
expect(validateAndFixXml(xml).valid).toBe(true)
})
})

View File

@@ -1,141 +0,0 @@
/**
* Server-wiring test: boot the actual MCP stdio server (from source via tsx)
* and drive it the way a real MCP client does — initialize handshake,
* tools/list — to catch registration/schema regressions that the unit tests
* (which import helpers directly) can't see.
*
* This replaces the old standalone tests/smoke.mjs, which spawned the BUILT
* dist/index.js and was therefore never run in CI (CI doesn't build this
* package before testing). Running from source via tsx means it executes as
* part of the normal `vitest run`.
*
* We deliberately do NOT call start_session — it would open a real browser
* window via open(). The browser bridge is covered by the Playwright e2e suite.
*/
import { type ChildProcessWithoutNullStreams, spawn } from "node:child_process"
import path from "node:path"
import { fileURLToPath } from "node:url"
import { afterAll, beforeAll, describe, expect, it } from "vitest"
const __dirname = path.dirname(fileURLToPath(import.meta.url))
const entry = path.resolve(__dirname, "..", "src", "index.ts")
const tsxBin = path.resolve(
__dirname,
"..",
"node_modules",
".bin",
process.platform === "win32" ? "tsx.cmd" : "tsx",
)
const EXPECTED_TOOLS = [
"start_session",
"create_new_diagram",
"edit_diagram",
"get_diagram",
"export_diagram",
"list_pages",
"add_page",
"rename_page",
"delete_page",
]
let proc: ChildProcessWithoutNullStreams
let stdoutBuf = ""
const pending = new Map<
number,
{ resolve: (m: any) => void; reject: (e: Error) => void; timeout: any }
>()
let nextId = 1
function send(method: string, params: unknown, isNotification = false) {
const msg: Record<string, unknown> = { jsonrpc: "2.0", method, params }
if (!isNotification) msg.id = nextId++
proc.stdin.write(`${JSON.stringify(msg)}\n`)
if (isNotification) return Promise.resolve(undefined)
return new Promise<any>((resolve, reject) => {
const id = msg.id as number
const timeout = setTimeout(() => {
pending.delete(id)
reject(new Error(`Timed out waiting for response to ${method}`))
}, 15000)
pending.set(id, { resolve, reject, timeout })
})
}
beforeAll(async () => {
proc = spawn(tsxBin, [entry], {
stdio: ["pipe", "pipe", "pipe"],
}) as ChildProcessWithoutNullStreams
proc.stdout.on("data", (chunk: Buffer) => {
stdoutBuf += chunk.toString()
const lines = stdoutBuf.split("\n")
stdoutBuf = lines.pop() || ""
for (const line of lines) {
const trimmed = line.trim()
if (!trimmed) continue
let msg: any
try {
msg = JSON.parse(trimmed)
} catch {
// Non-JSON-RPC log line — ignore.
continue
}
const p = msg.id !== undefined ? pending.get(msg.id) : undefined
if (p) {
clearTimeout(p.timeout)
pending.delete(msg.id)
p.resolve(msg)
}
}
})
const initResp = await send("initialize", {
protocolVersion: "2024-11-05",
capabilities: {},
clientInfo: { name: "wiring-test", version: "0.0.0" },
})
expect(initResp.error, JSON.stringify(initResp.error)).toBeUndefined()
expect(initResp.result?.serverInfo?.name).toBeTruthy()
await send("notifications/initialized", {}, true)
}, 30000)
afterAll(() => {
proc?.kill("SIGTERM")
})
describe("MCP server wiring", () => {
it("registers all nine multi-page tools", async () => {
const resp = await send("tools/list", {})
expect(resp.error, JSON.stringify(resp.error)).toBeUndefined()
const names: string[] = (resp.result?.tools ?? []).map(
(t: { name: string }) => t.name,
)
for (const expected of EXPECTED_TOOLS) {
expect(names, `missing tool: ${expected}`).toContain(expected)
}
})
it("advertises page-selector params on edit_diagram", async () => {
const resp = await send("tools/list", {})
const edit = resp.result.tools.find(
(t: { name: string }) => t.name === "edit_diagram",
)
const props = edit?.inputSchema?.properties ?? {}
expect(props.page_id).toBeTruthy()
expect(props.page_name).toBeTruthy()
expect(props.page_index).toBeTruthy()
})
it("advertises name/id/xml on add_page", async () => {
const resp = await send("tools/list", {})
const addPage = resp.result.tools.find(
(t: { name: string }) => t.name === "add_page",
)
const props = addPage?.inputSchema?.properties ?? {}
expect(props.name).toBeTruthy()
expect(props.id).toBeTruthy()
expect(props.xml).toBeTruthy()
})
})

View File

@@ -12,8 +12,7 @@
"declaration": true, "declaration": true,
"declarationMap": true, "declarationMap": true,
"sourceMap": true, "sourceMap": true,
"resolveJsonModule": true, "resolveJsonModule": true
"types": ["node"]
}, },
"include": ["src/**/*"], "include": ["src/**/*"],
"exclude": ["node_modules", "dist"] "exclude": ["node_modules", "dist"]

View File

@@ -1,11 +0,0 @@
import { defineConfig } from "vitest/config"
export default defineConfig({
test: {
include: ["tests/**/*.test.ts"],
environment: "node",
// The package source uses Node16 module resolution with explicit .js
// extensions in imports. Vitest+esbuild handles the .ts→.js mapping
// transparently, so no extra alias config is needed.
},
})

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 30 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 42 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 27 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 35 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 39 KiB

134
scripts/fix-latest-yml.mjs Normal file
View File

@@ -0,0 +1,134 @@
/**
* Fix latest.yml metadata after Windows code signing.
*
* electron-builder generates latest.yml with hashes of unsigned executables.
* After SignPath signs them, the hashes change. This script reads each
* latest*.yml in release/, finds the matching signed exe in release-signed/,
* and rewrites the sha512 and size fields.
*
* Usage: node scripts/fix-latest-yml.mjs
*/
import { createHash } from "node:crypto"
import {
createReadStream,
existsSync,
readdirSync,
readFileSync,
statSync,
writeFileSync,
} from "node:fs"
import { join } from "node:path"
const RELEASE_DIR = "release"
const SIGNED_DIR = "release-signed"
// Verify directories exist
if (!existsSync(RELEASE_DIR)) {
console.error(`Error: ${RELEASE_DIR}/ directory does not exist`)
process.exit(1)
}
if (!existsSync(SIGNED_DIR)) {
console.error(`Error: ${SIGNED_DIR}/ directory does not exist`)
process.exit(1)
}
// Find all latest*.yml files
const ymlFiles = readdirSync(RELEASE_DIR).filter(
(f) => f.startsWith("latest") && f.endsWith(".yml"),
)
if (ymlFiles.length === 0) {
console.log("No latest*.yml files found in release/")
process.exit(0)
}
/**
* Compute SHA-512 hash of a file using streaming (avoids loading large exe into memory)
*/
function hashFile(filePath) {
return new Promise((resolve, reject) => {
const hash = createHash("sha512")
const stream = createReadStream(filePath)
stream.on("data", (chunk) => hash.update(chunk))
stream.on("end", () => resolve(hash.digest("base64")))
stream.on("error", reject)
})
}
// Build a map of signed exe filenames to their hash and size
const signedFiles = new Map()
for (const f of readdirSync(SIGNED_DIR)) {
if (!f.endsWith(".exe")) continue
const filePath = join(SIGNED_DIR, f)
const sha512 = await hashFile(filePath)
const size = statSync(filePath).size
signedFiles.set(f, { sha512, size })
}
if (signedFiles.size === 0) {
console.error("No signed .exe files found in release-signed/")
process.exit(1)
}
console.log(
`Found ${signedFiles.size} signed exe(s):`,
[...signedFiles.keys()].join(", "),
)
for (const ymlFile of ymlFiles) {
const ymlPath = join(RELEASE_DIR, ymlFile)
const content = readFileSync(ymlPath, "utf-8")
const lines = content.split("\n")
const outputLines = []
// Track the current file entry being processed (by url field)
let currentExeName = null
for (const line of lines) {
// Match " url: SomeFile.exe" inside the files array
const urlMatch = line.match(/^\s+url:\s+(.+\.exe)\s*$/)
if (urlMatch) {
currentExeName = urlMatch[1]
outputLines.push(line)
continue
}
// Match top-level "path: SomeFile.exe"
const pathMatch = line.match(/^path:\s+(.+\.exe)\s*$/)
if (pathMatch) {
currentExeName = pathMatch[1]
outputLines.push(line)
continue
}
// Replace sha512 lines
const sha512Match = line.match(/^(\s*)sha512:\s+/)
if (sha512Match && currentExeName && signedFiles.has(currentExeName)) {
const indent = sha512Match[1]
outputLines.push(
`${indent}sha512: ${signedFiles.get(currentExeName).sha512}`,
)
continue
}
// Replace size lines
const sizeMatch = line.match(/^(\s*)size:\s+\d+/)
if (sizeMatch && currentExeName && signedFiles.has(currentExeName)) {
const indent = sizeMatch[1]
outputLines.push(
`${indent}size: ${signedFiles.get(currentExeName).size}`,
)
// Reset current exe after processing both sha512 and size
currentExeName = null
continue
}
outputLines.push(line)
}
writeFileSync(ymlPath, outputLines.join("\n"))
console.log(`Updated ${ymlFile}`)
}
console.log("Done!")

View File

@@ -35,10 +35,8 @@ test.describe("Iframe Interaction", () => {
await expect( await expect(
frame frame
.locator('text="Diagram"') .locator('text="Diagram"')
.or(frame.locator('[title*="Diagram"]')) .or(frame.locator('[title*="Diagram"]')),
.filter({ visible: true }) ).toBeVisible({ timeout: 10000 })
.first(),
).toBeVisible({ timeout: 30000 })
}) })
test("diagram XML is rendered in iframe after generation", async ({ test("diagram XML is rendered in iframe after generation", async ({

View File

@@ -1,398 +0,0 @@
import fs from "fs"
import os from "os"
import path from "path"
import { afterEach, beforeEach, describe, expect, it } from "vitest"
import {
ADMIN_PROVIDERS_KEY,
adminProvidersToConfig,
deriveEnvUpdates,
loadAdminProviders,
maskAdminProviders,
mergeSecrets,
type StoredAdminProvider,
validateAdminProviders,
} from "@/lib/admin/providers"
import { _resetForTests, saveSettings } from "@/lib/admin/settings"
import { loadRawServerModelsConfig } from "@/lib/server-model-config"
let tmpDir: string
beforeEach(() => {
tmpDir = fs.mkdtempSync(path.join(os.tmpdir(), "admin-providers-"))
process.env.SETTINGS_FILE = path.join(tmpDir, "settings.json")
_resetForTests()
})
afterEach(() => {
_resetForTests()
delete process.env.SETTINGS_FILE
delete process.env.AI_MODELS_CONFIG
fs.rmSync(tmpDir, { recursive: true, force: true })
})
function provider(
overrides: Partial<StoredAdminProvider> = {},
): StoredAdminProvider {
return {
id: "p1",
provider: "openai",
apiKey: "sk-test",
models: ["gpt-5.2"],
...overrides,
}
}
describe("deriveEnvUpdates", () => {
it("writes credentials to ADMIN_-prefixed env vars (never shadows standard vars)", () => {
const updates = deriveEnvUpdates([provider()], [])
expect(updates.ADMIN_OPENAI_API_KEY).toBe("sk-test")
expect(updates.OPENAI_API_KEY).toBeUndefined()
expect(JSON.parse(updates.ADMIN_PROVIDERS as string)).toHaveLength(1)
// AI_MODELS_CONFIG is no longer written (merged at read time)
expect(updates.AI_MODELS_CONFIG).toBeNull()
})
it("suffixes env vars for a second instance of the same provider", () => {
const updates = deriveEnvUpdates(
[
provider({ id: "p1", name: "First" }),
provider({
id: "p2",
name: "Second",
apiKey: "sk-second",
models: ["gpt-5-mini"],
}),
],
[],
)
expect(updates.ADMIN_OPENAI_API_KEY).toBe("sk-test")
expect(updates.ADMIN_OPENAI_API_KEY_2).toBe("sk-second")
})
it("maps bedrock credentials to AWS env vars", () => {
const updates = deriveEnvUpdates(
[
provider({
provider: "bedrock",
apiKey: undefined,
awsAccessKeyId: "AKIA123",
awsSecretAccessKey: "secret",
awsRegion: "us-west-2",
models: ["claude-x"],
}),
],
[],
)
expect(updates.AWS_ACCESS_KEY_ID).toBe("AKIA123")
expect(updates.AWS_SECRET_ACCESS_KEY).toBe("secret")
expect(updates.AWS_REGION).toBe("us-west-2")
})
it("clears keys owned by the previous list when providers are removed", () => {
const prev = [provider()]
const updates = deriveEnvUpdates([], prev)
expect(updates.ADMIN_OPENAI_API_KEY).toBeNull()
expect(updates.AI_MODELS_CONFIG).toBeNull()
expect(updates.ADMIN_PROVIDERS).toBeNull()
})
it("sets AI_PROVIDER/AI_MODEL only when a default is flagged", () => {
const noDefault = deriveEnvUpdates([provider()], [])
expect(noDefault.AI_PROVIDER).toBeNull()
expect(noDefault.AI_MODEL).toBeNull()
const updates = deriveEnvUpdates(
[
provider({ id: "p1" }),
provider({
id: "p2",
provider: "deepseek",
models: ["deepseek-chat"],
isDefault: true,
}),
],
[],
)
expect(updates.AI_PROVIDER).toBe("deepseek")
expect(updates.AI_MODEL).toBe("deepseek-chat")
})
})
describe("adminProvidersToConfig", () => {
it("builds a config with ADMIN_-prefixed apiKeyEnv wiring", () => {
const config = adminProvidersToConfig([provider()])
expect(config.providers).toHaveLength(1)
expect(config.providers[0].models).toEqual(["gpt-5.2"])
expect(config.providers[0].apiKeyEnv).toBe("ADMIN_OPENAI_API_KEY")
})
it("wires suffixed env vars for a second instance", () => {
const config = adminProvidersToConfig([
provider({ id: "p1", name: "First" }),
provider({
id: "p2",
name: "Second",
apiKey: "sk-second",
models: ["gpt-5-mini"],
}),
])
expect(config.providers[1].apiKeyEnv).toBe("ADMIN_OPENAI_API_KEY_2")
})
it("skips providers without models and carries the default flag", () => {
const config = adminProvidersToConfig([
provider({ id: "p1", models: [] }),
provider({ id: "p2", name: "D", isDefault: true }),
])
expect(config.providers).toHaveLength(1)
expect(config.providers[0].default).toBe(true)
})
})
describe("mergeSecrets", () => {
it("keeps stored secret when client sends an isSet marker", () => {
const stored = [provider({ apiKey: "sk-original" })]
const merged = mergeSecrets(
[
{
...provider(),
apiKey: { isSet: true, hint: "…test" },
},
],
stored,
)
expect(merged[0].apiKey).toBe("sk-original")
})
it("replaces secret when client sends a plaintext string", () => {
const stored = [provider({ apiKey: "sk-original" })]
const merged = mergeSecrets(
[{ ...provider(), apiKey: "sk-new" }],
stored,
)
expect(merged[0].apiKey).toBe("sk-new")
})
it("clears secret when client sends undefined", () => {
const stored = [provider({ apiKey: "sk-original" })]
const merged = mergeSecrets(
[{ ...provider(), apiKey: undefined }],
stored,
)
expect(merged[0].apiKey).toBeUndefined()
})
})
describe("loadRawServerModelsConfig merge", () => {
it("combines env AI_MODELS_CONFIG with panel providers", async () => {
process.env.AI_MODELS_CONFIG = JSON.stringify({
providers: [
{
name: "Env OpenAI",
provider: "openai",
models: ["gpt-from-env"],
default: true,
},
],
})
saveSettings(deriveEnvUpdates([provider({ name: "Panel" })], []))
const merged = await loadRawServerModelsConfig()
expect(merged?.providers.map((p) => p.name)).toEqual([
"Env OpenAI",
"Panel",
])
// Env default kept because panel set none
expect(merged?.providers[0].default).toBe(true)
})
it("panel default overrides the env default", async () => {
process.env.AI_MODELS_CONFIG = JSON.stringify({
providers: [
{
name: "Env OpenAI",
provider: "openai",
models: ["gpt-from-env"],
default: true,
},
],
})
saveSettings(
deriveEnvUpdates(
[provider({ name: "Panel", isDefault: true })],
[],
),
)
const merged = await loadRawServerModelsConfig()
expect(merged?.providers[0].default).toBeFalsy()
expect(merged?.providers[1].default).toBe(true)
})
it("returns only env config when the panel has no providers", async () => {
process.env.AI_MODELS_CONFIG = JSON.stringify({
providers: [
{
name: "Env Only",
provider: "openai",
models: ["gpt-from-env"],
},
],
})
const merged = await loadRawServerModelsConfig()
expect(merged?.providers.map((p) => p.name)).toEqual(["Env Only"])
})
})
describe("validateAdminProviders", () => {
it("rejects names clashing with env-configured providers", () => {
expect(
validateAdminProviders([provider({ name: "Env OpenAI" })], {
providers: [
{
name: "Env OpenAI",
provider: "openai",
models: ["gpt-x"],
},
],
}),
).toMatch(/already defined/)
})
it("rejects a global-credential provider already in the env config", () => {
expect(
validateAdminProviders(
[
provider({
provider: "bedrock",
apiKey: undefined,
awsAccessKeyId: "AKIA-panel",
awsSecretAccessKey: "panel-secret",
awsRegion: "us-east-1",
models: ["claude-x"],
}),
],
{
providers: [
{
name: "Env Bedrock",
provider: "bedrock",
models: ["claude-env"],
},
],
},
),
).toMatch(/shares global credentials/)
})
it("allows a normal provider type alongside the same env type", () => {
expect(
validateAdminProviders([provider({ name: "Panel OpenAI" })], {
providers: [
{
name: "Env OpenAI",
provider: "openai",
models: ["gpt-x"],
},
],
}),
).toBeNull()
})
it("rejects two bedrock instances", () => {
const list = [
provider({ id: "p1", provider: "bedrock" }),
provider({ id: "p2", provider: "bedrock" }),
]
expect(validateAdminProviders(list)).toMatch(/Only one/)
})
it("rejects duplicate display names", () => {
const list = [
provider({ id: "p1", name: "Same" }),
provider({ id: "p2", name: "Same" }),
]
expect(validateAdminProviders(list)).toMatch(/unique/)
})
it("rejects multiple defaults", () => {
const list = [
provider({ id: "p1", isDefault: true }),
provider({ id: "p2", name: "Other", isDefault: true }),
]
expect(validateAdminProviders(list)).toMatch(/default/)
})
it("accepts a valid list", () => {
const list = [
provider({ id: "p1", isDefault: true }),
provider({ id: "p2", name: "Backup" }),
]
expect(validateAdminProviders(list)).toBeNull()
})
})
describe("loadAdminProviders", () => {
it("returns [] when nothing is stored", () => {
expect(loadAdminProviders()).toEqual([])
})
it("loads valid stored providers", () => {
saveSettings({ [ADMIN_PROVIDERS_KEY]: JSON.stringify([provider()]) })
expect(loadAdminProviders()).toHaveLength(1)
})
it("round-trips a bedrock provider with multiple string secrets", () => {
const bedrock = provider({
provider: "bedrock",
apiKey: undefined,
awsAccessKeyId: "AKIA123",
awsSecretAccessKey: "secret",
awsRegion: "us-west-2",
models: ["claude-x"],
})
saveSettings({ [ADMIN_PROVIDERS_KEY]: JSON.stringify([bedrock]) })
const loaded = loadAdminProviders()
expect(loaded).toHaveLength(1)
expect(loaded[0].awsAccessKeyId).toBe("AKIA123")
expect(loaded[0].awsSecretAccessKey).toBe("secret")
})
it("drops malformed entries and keeps valid ones", () => {
saveSettings({
[ADMIN_PROVIDERS_KEY]: JSON.stringify([
provider({ id: "good" }),
{ id: "missing-fields" }, // no provider/models
{ provider: "openai", models: ["x"] }, // no id
"not-an-object",
]),
})
const loaded = loadAdminProviders()
expect(loaded).toHaveLength(1)
expect(loaded[0].id).toBe("good")
})
it("returns [] when the stored value is not an array", () => {
saveSettings({ [ADMIN_PROVIDERS_KEY]: JSON.stringify({ nope: true }) })
expect(loadAdminProviders()).toEqual([])
})
it("returns [] on invalid JSON", () => {
saveSettings({ [ADMIN_PROVIDERS_KEY]: "{ broken" })
expect(loadAdminProviders()).toEqual([])
})
it("drops entries whose secret is an {isSet} marker, not a string", () => {
// A hand-edited file could hold a transit-only marker object; if it
// slipped through, maskSecret() would throw on a non-string value.
saveSettings({
[ADMIN_PROVIDERS_KEY]: JSON.stringify([
{ ...provider(), apiKey: { isSet: true, hint: "…1234" } },
]),
})
const loaded = loadAdminProviders()
expect(loaded).toEqual([])
// Masking the loaded list must not throw
expect(() => maskAdminProviders(loaded)).not.toThrow()
})
})

View File

@@ -1,158 +0,0 @@
import fs from "fs"
import os from "os"
import path from "path"
import { afterEach, beforeEach, describe, expect, it } from "vitest"
import {
_resetForTests,
applyToEnv,
getEnvFallback,
getValueSource,
isSettingsWritable,
loadSettings,
saveSettings,
} from "@/lib/admin/settings"
let tmpDir: string
beforeEach(() => {
tmpDir = fs.mkdtempSync(path.join(os.tmpdir(), "admin-settings-"))
process.env.SETTINGS_FILE = path.join(tmpDir, "settings.json")
_resetForTests()
})
afterEach(() => {
_resetForTests()
delete process.env.SETTINGS_FILE
fs.rmSync(tmpDir, { recursive: true, force: true })
delete process.env.TEST_ADMIN_VAR
})
describe("loadSettings", () => {
it("returns empty object when file does not exist", () => {
expect(loadSettings()).toEqual({})
})
it("reads values from the settings file", () => {
fs.writeFileSync(
process.env.SETTINGS_FILE!,
JSON.stringify({ version: 1, values: { TEST_ADMIN_VAR: "abc" } }),
)
expect(loadSettings()).toEqual({ TEST_ADMIN_VAR: "abc" })
})
it("drops non-string values from a corrupted file", () => {
fs.writeFileSync(
process.env.SETTINGS_FILE!,
JSON.stringify({
version: 1,
values: {
GOOD: "ok",
NUM: 5,
OBJ: { nested: true },
ARR: [1, 2],
NULL: null,
},
}),
)
expect(loadSettings()).toEqual({ GOOD: "ok" })
})
it("returns empty object when values is null", () => {
fs.writeFileSync(
process.env.SETTINGS_FILE!,
JSON.stringify({ version: 1, values: null }),
)
expect(loadSettings()).toEqual({})
})
it("returns empty object when values is an array (no numeric keys)", () => {
fs.writeFileSync(
process.env.SETTINGS_FILE!,
JSON.stringify({ version: 1, values: ["a", "b"] }),
)
// Without the Array.isArray guard this would yield { "0": "a", ... }
expect(loadSettings()).toEqual({})
})
})
describe("applyToEnv / saveSettings", () => {
it("overlays file values onto process.env", () => {
saveSettings({ TEST_ADMIN_VAR: "from-file" })
expect(process.env.TEST_ADMIN_VAR).toBe("from-file")
})
it("file value wins over pre-existing env value", () => {
process.env.TEST_ADMIN_VAR = "from-env"
saveSettings({ TEST_ADMIN_VAR: "from-file" })
expect(process.env.TEST_ADMIN_VAR).toBe("from-file")
})
it("deleting a key restores the original env value", () => {
process.env.TEST_ADMIN_VAR = "from-env"
saveSettings({ TEST_ADMIN_VAR: "from-file" })
saveSettings({ TEST_ADMIN_VAR: null })
expect(process.env.TEST_ADMIN_VAR).toBe("from-env")
})
it("deleting a key unsets env when there was no original value", () => {
saveSettings({ TEST_ADMIN_VAR: "from-file" })
saveSettings({ TEST_ADMIN_VAR: null })
expect(process.env.TEST_ADMIN_VAR).toBeUndefined()
})
it("persists across cache reset (file round-trip)", () => {
saveSettings({ TEST_ADMIN_VAR: "persisted" })
_resetForTests()
applyToEnv()
expect(process.env.TEST_ADMIN_VAR).toBe("persisted")
})
})
describe("getValueSource / getEnvFallback", () => {
it("reports file source when key is in settings", () => {
saveSettings({ TEST_ADMIN_VAR: "x" })
expect(getValueSource("TEST_ADMIN_VAR")).toBe("file")
})
it("reports env source when only env is set", () => {
process.env.TEST_ADMIN_VAR = "from-env"
applyToEnv()
expect(getValueSource("TEST_ADMIN_VAR")).toBe("env")
})
it("reports default when neither is set", () => {
expect(getValueSource("TEST_ADMIN_VAR")).toBe("default")
})
it("returns the shadowed env value as fallback", () => {
process.env.TEST_ADMIN_VAR = "from-env"
saveSettings({ TEST_ADMIN_VAR: "from-file" })
expect(getEnvFallback("TEST_ADMIN_VAR")).toBe("from-env")
})
})
describe("isSettingsWritable", () => {
it("returns true for a writable temp dir", () => {
expect(isSettingsWritable()).toBe(true)
})
it("returns false for an unwritable path", () => {
_resetForTests()
process.env.SETTINGS_FILE = "/nonexistent-root-dir/settings.json"
expect(isSettingsWritable()).toBe(false)
})
})
describe("settings file on disk", () => {
it("writes valid JSON with restrictive permissions", () => {
saveSettings({ TEST_ADMIN_VAR: "secret" })
const filePath = process.env.SETTINGS_FILE!
const parsed = JSON.parse(fs.readFileSync(filePath, "utf8"))
expect(parsed).toEqual({
version: 1,
values: { TEST_ADMIN_VAR: "secret" },
})
const mode = fs.statSync(filePath).mode & 0o777
expect(mode).toBe(0o600)
})
})

View File

@@ -1,36 +1,10 @@
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest" import { afterEach, beforeEach, describe, expect, it, vi } from "vitest"
import { import {
getAIModel, getAIModel,
isAihubmixStandardBaseURL,
resolveBaseURL, resolveBaseURL,
supportsImageInput, supportsImageInput,
supportsPromptCaching, supportsPromptCaching,
} from "@/lib/ai-providers" } from "@/lib/ai-providers"
import { extractAihubmixModelIds } from "@/lib/aihubmix-models"
describe("extractAihubmixModelIds", () => {
it("extracts unique chat model IDs from the AIHubMix model list payload", () => {
const models = extractAihubmixModelIds({
data: [
{ model_id: "claude-sonnet-4-5-20250929", types: "llm" },
{ model_id: "gpt-5.1", types: "llm" },
{ model_id: "gpt-5.1", types: "llm" },
{ model_id: "gpt-image-2", types: "image_generation,llm" },
{ model_id: "cohere-rerank-v4.0", types: "rerank" },
{ model_id: "", types: "llm" },
{ types: "llm" },
],
})
expect(models).toEqual(["claude-sonnet-4-5-20250929", "gpt-5.1"])
})
it("returns an empty list for malformed payloads", () => {
expect(extractAihubmixModelIds({ data: null })).toEqual([])
expect(extractAihubmixModelIds({})).toEqual([])
expect(extractAihubmixModelIds(null)).toEqual([])
})
})
describe("resolveBaseURL", () => { describe("resolveBaseURL", () => {
const SERVER_BASE_URL = "https://server-proxy.example.com" const SERVER_BASE_URL = "https://server-proxy.example.com"
@@ -206,14 +180,11 @@ describe("supportsImageInput", () => {
expect(supportsImageInput("moonshot-v1-128k")).toBe(false) expect(supportsImageInput("moonshot-v1-128k")).toBe(false)
}) })
it("returns false for MiniMax M2 text models", () => { it("returns false for MiniMax text models", () => {
expect(supportsImageInput("MiniMax-M2.7")).toBe(false) expect(supportsImageInput("MiniMax-M2.7")).toBe(false)
expect(supportsImageInput("MiniMax-M2.7-highspeed")).toBe(false) expect(supportsImageInput("MiniMax-M2.5")).toBe(false)
expect(supportsImageInput("MiniMax-M2")).toBe(false) expect(supportsImageInput("MiniMax-M2")).toBe(false)
}) expect(supportsImageInput("MiniMax-M2.5-highspeed")).toBe(false)
it("returns true for MiniMax M3 (supports image input)", () => {
expect(supportsImageInput("MiniMax-M3")).toBe(true)
}) })
it("returns false for DeepSeek text models", () => { it("returns false for DeepSeek text models", () => {
@@ -229,21 +200,12 @@ describe("supportsImageInput", () => {
it("returns true for Qwen vision models", () => { it("returns true for Qwen vision models", () => {
expect(supportsImageInput("qwen-vl")).toBe(true) expect(supportsImageInput("qwen-vl")).toBe(true)
expect(supportsImageInput("Qwen3.5")).toBe(true)
expect(supportsImageInput("qwen3.5")).toBe(true)
expect(supportsImageInput("qwen3.5-plus")).toBe(true) expect(supportsImageInput("qwen3.5-plus")).toBe(true)
expect(supportsImageInput("qwen3.5-flash")).toBe(true) expect(supportsImageInput("qwen3.5-flash")).toBe(true)
expect(supportsImageInput("qwen3-vl-plus")).toBe(true) expect(supportsImageInput("qwen3-vl-plus")).toBe(true)
expect(supportsImageInput("qwen3-vl-flash")).toBe(true) expect(supportsImageInput("qwen3-vl-flash")).toBe(true)
}) })
it("returns true for QvQ (Qwen Visual QA) models including OpenRouter-prefixed names", () => {
expect(supportsImageInput("qvq-72b-preview")).toBe(true)
expect(supportsImageInput("qvq-max")).toBe(true)
expect(supportsImageInput("qwen/qvq-72b-preview")).toBe(true)
expect(supportsImageInput("qwen/qvq-max")).toBe(true)
})
it("returns false for GLM text models", () => { it("returns false for GLM text models", () => {
expect(supportsImageInput("glm-4")).toBe(false) expect(supportsImageInput("glm-4")).toBe(false)
expect(supportsImageInput("glm-4-plus")).toBe(false) expect(supportsImageInput("glm-4-plus")).toBe(false)
@@ -274,131 +236,6 @@ vi.mock("ollama-ai-provider-v2", () => {
return { createOllama: mockCreateOllama, ollama: mockOllama } return { createOllama: mockCreateOllama, ollama: mockOllama }
}) })
vi.mock("@ai-sdk/deepseek", () => {
const mockModel = { modelId: "test-model" }
const mockProviderFn = vi.fn(() => mockModel)
const mockCreateDeepSeek = vi.fn(() => mockProviderFn)
const mockDeepseek = vi.fn(() => mockModel)
return { createDeepSeek: mockCreateDeepSeek, deepseek: mockDeepseek }
})
vi.mock("@aihubmix/ai-sdk-provider", () => {
const mockModel = { modelId: "test-model" }
const mockProviderFn = vi.fn(() => mockModel)
const mockCreateAihubmix = vi.fn(() => mockProviderFn)
const mockAihubmix = vi.fn(() => mockModel)
return { aihubmix: mockAihubmix, createAihubmix: mockCreateAihubmix }
})
describe("AIHubMix provider", () => {
let createAihubmixMock: ReturnType<typeof vi.fn>
const savedEnv: Record<string, string | undefined> = {}
beforeEach(async () => {
savedEnv.AIHUBMIX_API_KEY = process.env.AIHUBMIX_API_KEY
savedEnv.AIHUBMIX_BASE_URL = process.env.AIHUBMIX_BASE_URL
delete process.env.AIHUBMIX_BASE_URL
const mod = await import("@aihubmix/ai-sdk-provider")
createAihubmixMock = mod.createAihubmix as ReturnType<typeof vi.fn>
createAihubmixMock.mockClear()
})
afterEach(() => {
process.env.AIHUBMIX_API_KEY = savedEnv.AIHUBMIX_API_KEY
process.env.AIHUBMIX_BASE_URL = savedEnv.AIHUBMIX_BASE_URL
})
it("uses AIHUBMIX_API_KEY for server configured AIHubMix", () => {
process.env.AIHUBMIX_API_KEY = "server-aihubmix-key"
getAIModel({
provider: "aihubmix",
modelId: "claude-sonnet-4-5-20250929",
})
expect(createAihubmixMock).toHaveBeenCalledWith({
apiKey: "server-aihubmix-key",
appCode: "MSBS9675",
})
})
it("uses client BYOK API key for AIHubMix", () => {
getAIModel({
provider: "aihubmix",
apiKey: "client-aihubmix-key",
modelId: "gpt-5.1",
})
expect(createAihubmixMock).toHaveBeenCalledWith({
apiKey: "client-aihubmix-key",
appCode: "MSBS9675",
})
})
it("recognizes AIHubMix standard endpoints", () => {
expect(isAihubmixStandardBaseURL(undefined)).toBe(true)
expect(isAihubmixStandardBaseURL("https://aihubmix.com")).toBe(true)
expect(isAihubmixStandardBaseURL("https://aihubmix.com/v1/")).toBe(true)
expect(isAihubmixStandardBaseURL("https://proxy.example.com/v1")).toBe(
false,
)
})
})
describe("Kimi provider uses createDeepSeek for reasoning_content support", () => {
let createDeepSeekMock: ReturnType<typeof vi.fn>
const savedEnv: Record<string, string | undefined> = {}
beforeEach(async () => {
savedEnv.KIMI_API_KEY = process.env.KIMI_API_KEY
savedEnv.KIMI_BASE_URL = process.env.KIMI_BASE_URL
delete process.env.KIMI_BASE_URL
const mod = await import("@ai-sdk/deepseek")
createDeepSeekMock = mod.createDeepSeek as ReturnType<typeof vi.fn>
createDeepSeekMock.mockClear()
})
afterEach(() => {
process.env.KIMI_API_KEY = savedEnv.KIMI_API_KEY
process.env.KIMI_BASE_URL = savedEnv.KIMI_BASE_URL
})
it("uses createDeepSeek with Kimi default base URL for reasoning_content support", () => {
process.env.KIMI_API_KEY = "test-kimi-key"
getAIModel({
provider: "kimi",
apiKey: "test-kimi-key",
modelId: "moonshot-v1-8k",
})
expect(createDeepSeekMock).toHaveBeenCalledWith(
expect.objectContaining({
baseURL: "https://api.moonshot.cn/v1",
}),
)
})
it("uses custom base URL when provided for kimi provider", () => {
process.env.KIMI_API_KEY = "test-kimi-key"
getAIModel({
provider: "kimi",
apiKey: "test-kimi-key",
baseUrl: "https://custom-kimi-endpoint.com/v1",
modelId: "kimi-k2.6",
})
expect(createDeepSeekMock).toHaveBeenCalledWith(
expect.objectContaining({
baseURL: "https://custom-kimi-endpoint.com/v1",
}),
)
})
})
describe("Ollama API key security", () => { describe("Ollama API key security", () => {
let createOllamaMock: ReturnType<typeof vi.fn> let createOllamaMock: ReturnType<typeof vi.fn>
const savedEnv: Record<string, string | undefined> = {} const savedEnv: Record<string, string | undefined> = {}

View File

@@ -1,5 +1,4 @@
import { afterEach, beforeEach, describe, expect, it } from "vitest" import { afterEach, describe, expect, it } from "vitest"
import { _resetForTests } from "@/lib/admin/settings"
import { import {
loadFlattenedServerModels, loadFlattenedServerModels,
type ServerModelsConfig, type ServerModelsConfig,
@@ -8,20 +7,11 @@ import {
const ORIGINAL_ENV = { ...process.env } const ORIGINAL_ENV = { ...process.env }
beforeEach(() => {
// Isolate from any local data/settings.json (admin panel providers
// are merged into the server models config)
process.env.SETTINGS_FILE = "/nonexistent/settings.json"
_resetForTests()
})
afterEach(() => { afterEach(() => {
_resetForTests()
process.env.AI_PROVIDER = ORIGINAL_ENV.AI_PROVIDER process.env.AI_PROVIDER = ORIGINAL_ENV.AI_PROVIDER
process.env.AI_MODEL = ORIGINAL_ENV.AI_MODEL process.env.AI_MODEL = ORIGINAL_ENV.AI_MODEL
process.env.AI_MODELS_CONFIG_PATH = ORIGINAL_ENV.AI_MODELS_CONFIG_PATH process.env.AI_MODELS_CONFIG_PATH = ORIGINAL_ENV.AI_MODELS_CONFIG_PATH
process.env.AI_MODELS_CONFIG = ORIGINAL_ENV.AI_MODELS_CONFIG process.env.AI_MODELS_CONFIG = ORIGINAL_ENV.AI_MODELS_CONFIG
delete process.env.SETTINGS_FILE
}) })
describe("ServerModelsConfigSchema", () => { describe("ServerModelsConfigSchema", () => {
@@ -159,44 +149,6 @@ describe("loadFlattenedServerModels", () => {
expect(defaultModel.modelId).toBe("gpt-4o") // First model of default provider expect(defaultModel.modelId).toBe("gpt-4o") // First model of default provider
}) })
it("falls back to comma-separated AI_MODEL when no other config is set", async () => {
process.env.AI_MODELS_CONFIG = ""
process.env.AI_MODELS_CONFIG_PATH = `non-existent-config-${Date.now()}.json`
process.env.AI_PROVIDER = "openai"
process.env.AI_MODEL = "gpt-4o, gpt-4o-mini, gpt-4o"
const models = await loadFlattenedServerModels()
// Trims, deduplicates, and preserves order
expect(models.map((m) => m.modelId)).toEqual(["gpt-4o", "gpt-4o-mini"])
expect(models.every((m) => m.provider === "openai")).toBe(true)
// First model is marked default (provider has default: true)
const defaults = models.filter((m) => m.isDefault)
expect(defaults.length).toBe(1)
expect(defaults[0].modelId).toBe("gpt-4o")
})
it("does not synthesize when AI_MODEL has no comma", async () => {
process.env.AI_MODELS_CONFIG = ""
process.env.AI_MODELS_CONFIG_PATH = `non-existent-config-${Date.now()}.json`
process.env.AI_PROVIDER = "openai"
process.env.AI_MODEL = "gpt-4o"
const models = await loadFlattenedServerModels()
expect(models).toEqual([])
})
it("does not synthesize when AI_PROVIDER is unset", async () => {
process.env.AI_MODELS_CONFIG = ""
process.env.AI_MODELS_CONFIG_PATH = `non-existent-config-${Date.now()}.json`
delete process.env.AI_PROVIDER
process.env.AI_MODEL = "gpt-4o, gpt-4o-mini"
const models = await loadFlattenedServerModels()
expect(models).toEqual([])
})
it("preserves apiKeyEnv array in flattened models for load balancing", async () => { it("preserves apiKeyEnv array in flattened models for load balancing", async () => {
const config: ServerModelsConfig = { const config: ServerModelsConfig = {
providers: [ providers: [

View File

@@ -1,79 +0,0 @@
import { beforeEach, describe, expect, it, vi } from "vitest"
import { isPrivateUrl } from "@/lib/ssrf-protection"
// Mock DNS so tests are deterministic and never hit the network.
const lookupMock = vi.hoisted(() => vi.fn())
vi.mock("node:dns/promises", () => ({
default: { lookup: lookupMock },
lookup: lookupMock,
}))
describe("isPrivateUrl", () => {
beforeEach(() => {
lookupMock.mockReset()
})
it("blocks private IPv6 URLs (string-only fast path, no DNS)", async () => {
expect(await isPrivateUrl("http://[::1]/")).toBe(true)
expect(await isPrivateUrl("http://[0:0:0:0:0:0:0:1]/")).toBe(true)
expect(await isPrivateUrl("http://[::]/")).toBe(true)
expect(await isPrivateUrl("http://[::ffff:127.0.0.1]/")).toBe(true)
expect(await isPrivateUrl("http://[fc00::1]/")).toBe(true)
expect(await isPrivateUrl("http://[fd12:3456:789a::1]/")).toBe(true)
expect(await isPrivateUrl("http://[fe80::1]/")).toBe(true)
expect(await isPrivateUrl("http://[fe9f::1]/")).toBe(true)
expect(await isPrivateUrl("http://[febf::1]/")).toBe(true)
expect(lookupMock).not.toHaveBeenCalled()
})
it("blocks literal private IPv4 without DNS", async () => {
expect(await isPrivateUrl("http://127.0.0.1/")).toBe(true)
expect(await isPrivateUrl("http://10.0.0.5/")).toBe(true)
expect(await isPrivateUrl("http://192.168.1.1/")).toBe(true)
expect(await isPrivateUrl("http://169.254.169.254/")).toBe(true)
expect(await isPrivateUrl("http://0.0.0.0/")).toBe(true)
// 100.64.0.0/10 CGNAT (RFC 6598), routable in some cloud internal nets
expect(await isPrivateUrl("http://100.64.0.1/")).toBe(true)
expect(await isPrivateUrl("http://100.127.255.255/")).toBe(true)
expect(lookupMock).not.toHaveBeenCalled()
})
it("treats CGNAT boundaries correctly", async () => {
// 100.63.x and 100.128.x are outside 100.64.0.0/10 → public
lookupMock.mockResolvedValue([{ address: "100.63.255.255", family: 4 }])
expect(await isPrivateUrl("http://just-below.example/")).toBe(false)
lookupMock.mockResolvedValue([{ address: "100.128.0.1", family: 4 }])
expect(await isPrivateUrl("http://just-above.example/")).toBe(false)
})
it("blocks a hostname that resolves to a private IPv6 address", async () => {
lookupMock.mockResolvedValue([{ address: "fd00::1", family: 6 }])
expect(await isPrivateUrl("http://v6.example.com/")).toBe(true)
})
it("allows public URLs that resolve to public IPs", async () => {
lookupMock.mockResolvedValue([{ address: "93.184.216.34", family: 4 }])
expect(await isPrivateUrl("https://example.com/article")).toBe(false)
})
it("blocks public-looking hostnames that resolve to a private IP (DNS-rebinding-style bypass)", async () => {
// e.g. 127-0-0-1.sslip.io resolves to 127.0.0.1
lookupMock.mockResolvedValue([{ address: "127.0.0.1", family: 4 }])
expect(await isPrivateUrl("http://127-0-0-1.sslip.io/")).toBe(true)
})
it("blocks when any resolved address is private", async () => {
lookupMock.mockResolvedValue([
{ address: "93.184.216.34", family: 4 },
{ address: "10.1.2.3", family: 4 },
])
expect(await isPrivateUrl("http://mixed.example.com/")).toBe(true)
})
it("blocks when DNS resolution fails", async () => {
lookupMock.mockRejectedValue(new Error("ENOTFOUND"))
expect(await isPrivateUrl("http://does-not-resolve.example/")).toBe(
true,
)
})
})

View File

@@ -35,7 +35,6 @@
"packages", "packages",
"electron", "electron",
"electron-standalone", "electron-standalone",
"dist-electron", "dist-electron"
"release"
] ]
} }