mirror of
https://github.com/DayuanJiang/next-ai-draw-io.git
synced 2026-01-03 23:02:31 +08:00
Compare commits
1 Commits
493ee168b1
...
fix/deepse
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
834359cff3 |
@@ -28,8 +28,6 @@ export default function Home() {
|
|||||||
} = useDiagram()
|
} = useDiagram()
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const pathname = usePathname()
|
const pathname = usePathname()
|
||||||
// Extract current language from pathname (e.g., "/zh/about" → "zh")
|
|
||||||
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<"min" | "sketch">("min")
|
const [drawioUi, setDrawioUi] = useState<"min" | "sketch">("min")
|
||||||
@@ -209,7 +207,7 @@ export default function Home() {
|
|||||||
<div className="h-full rounded-xl overflow-hidden shadow-soft-lg border border-border/30">
|
<div className="h-full rounded-xl overflow-hidden shadow-soft-lg border border-border/30">
|
||||||
{isLoaded ? (
|
{isLoaded ? (
|
||||||
<DrawIoEmbed
|
<DrawIoEmbed
|
||||||
key={`${drawioUi}-${darkMode}-${currentLang}`}
|
key={`${drawioUi}-${darkMode}`}
|
||||||
ref={drawioRef}
|
ref={drawioRef}
|
||||||
onExport={handleDiagramExport}
|
onExport={handleDiagramExport}
|
||||||
onLoad={onDrawioLoad}
|
onLoad={onDrawioLoad}
|
||||||
@@ -222,7 +220,6 @@ export default function Home() {
|
|||||||
saveAndExit: false,
|
saveAndExit: false,
|
||||||
noExitBtn: true,
|
noExitBtn: true,
|
||||||
dark: darkMode,
|
dark: darkMode,
|
||||||
lang: currentLang,
|
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
|
|||||||
@@ -12,11 +12,7 @@ import fs from "fs/promises"
|
|||||||
import { jsonrepair } from "jsonrepair"
|
import { jsonrepair } from "jsonrepair"
|
||||||
import path from "path"
|
import path from "path"
|
||||||
import { z } from "zod"
|
import { z } from "zod"
|
||||||
import {
|
import { getAIModel, supportsPromptCaching } from "@/lib/ai-providers"
|
||||||
getAIModel,
|
|
||||||
supportsImageInput,
|
|
||||||
supportsPromptCaching,
|
|
||||||
} from "@/lib/ai-providers"
|
|
||||||
import { findCachedResponse } from "@/lib/cached-responses"
|
import { findCachedResponse } from "@/lib/cached-responses"
|
||||||
import {
|
import {
|
||||||
checkAndIncrementRequest,
|
checkAndIncrementRequest,
|
||||||
@@ -299,17 +295,6 @@ async function handleChatRequest(req: Request): Promise<Response> {
|
|||||||
lastUserMessage?.parts?.filter((part: any) => part.type === "file") ||
|
lastUserMessage?.parts?.filter((part: any) => part.type === "file") ||
|
||||||
[]
|
[]
|
||||||
|
|
||||||
// Check if user is sending images to a model that doesn't support them
|
|
||||||
// AI SDK silently drops unsupported parts, so we need to catch this early
|
|
||||||
if (fileParts.length > 0 && !supportsImageInput(modelId)) {
|
|
||||||
return Response.json(
|
|
||||||
{
|
|
||||||
error: `The model "${modelId}" does not support image input. Please use a vision-capable model (e.g., GPT-4o, Claude, Gemini) or remove the image.`,
|
|
||||||
},
|
|
||||||
{ status: 400 },
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
// User input only - XML is now in a separate cached system message
|
// User input only - XML is now in a separate cached system message
|
||||||
const formattedUserInput = `User input:
|
const formattedUserInput = `User input:
|
||||||
"""md
|
"""md
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
{
|
{
|
||||||
"$schema": "https://biomejs.dev/schemas/2.3.10/schema.json",
|
"$schema": "https://biomejs.dev/schemas/2.3.8/schema.json",
|
||||||
"vcs": {
|
"vcs": {
|
||||||
"enabled": true,
|
"enabled": true,
|
||||||
"clientKind": "git",
|
"clientKind": "git",
|
||||||
|
|||||||
@@ -283,7 +283,7 @@ export function ChatMessageDisplay({
|
|||||||
try {
|
try {
|
||||||
await navigator.clipboard.writeText(text)
|
await navigator.clipboard.writeText(text)
|
||||||
setCopyState(messageId, isToolCall, true)
|
setCopyState(messageId, isToolCall, true)
|
||||||
} catch (_err) {
|
} catch (err) {
|
||||||
// Fallback for non-secure contexts (HTTP) or permission denied
|
// Fallback for non-secure contexts (HTTP) or permission denied
|
||||||
const textarea = document.createElement("textarea")
|
const textarea = document.createElement("textarea")
|
||||||
textarea.value = text
|
textarea.value = text
|
||||||
|
|||||||
@@ -905,6 +905,7 @@ export default function ChatPanel({
|
|||||||
className="text-sm font-medium text-muted-foreground mt-8 tracking-wide"
|
className="text-sm font-medium text-muted-foreground mt-8 tracking-wide"
|
||||||
style={{
|
style={{
|
||||||
writingMode: "vertical-rl",
|
writingMode: "vertical-rl",
|
||||||
|
transform: "rotate(180deg)",
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{dict.nav.aiChat}
|
{dict.nav.aiChat}
|
||||||
|
|||||||
@@ -21,6 +21,7 @@ import {
|
|||||||
Zap,
|
Zap,
|
||||||
} from "lucide-react"
|
} from "lucide-react"
|
||||||
import { useCallback, useEffect, useRef, useState } from "react"
|
import { useCallback, useEffect, useRef, useState } from "react"
|
||||||
|
import { toast } from "sonner"
|
||||||
import {
|
import {
|
||||||
AlertDialog,
|
AlertDialog,
|
||||||
AlertDialogAction,
|
AlertDialogAction,
|
||||||
@@ -516,6 +517,7 @@ export function ModelConfigDialog({
|
|||||||
{/* Provider Details (Right Panel) */}
|
{/* Provider Details (Right Panel) */}
|
||||||
<div className="flex-1 min-w-0 flex flex-col overflow-auto [&::-webkit-scrollbar]:hidden ">
|
<div className="flex-1 min-w-0 flex flex-col overflow-auto [&::-webkit-scrollbar]:hidden ">
|
||||||
{selectedProvider ? (
|
{selectedProvider ? (
|
||||||
|
<>
|
||||||
<ScrollArea className="flex-1" ref={scrollRef}>
|
<ScrollArea className="flex-1" ref={scrollRef}>
|
||||||
<div className="p-6 space-y-8">
|
<div className="p-6 space-y-8">
|
||||||
{/* Provider Header */}
|
{/* Provider Header */}
|
||||||
@@ -557,7 +559,10 @@ export function ModelConfigDialog({
|
|||||||
<div className="flex items-center gap-1.5 px-3 py-1.5 rounded-full bg-success-muted text-success">
|
<div className="flex items-center gap-1.5 px-3 py-1.5 rounded-full bg-success-muted text-success">
|
||||||
<Check className="h-3.5 w-3.5 animate-check-pop" />
|
<Check className="h-3.5 w-3.5 animate-check-pop" />
|
||||||
<span className="text-xs font-medium">
|
<span className="text-xs font-medium">
|
||||||
{dict.modelConfig.verified}
|
{
|
||||||
|
dict.modelConfig
|
||||||
|
.verified
|
||||||
|
}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
@@ -570,13 +575,18 @@ export function ModelConfigDialog({
|
|||||||
className="text-destructive hover:text-destructive hover:bg-destructive/10"
|
className="text-destructive hover:text-destructive hover:bg-destructive/10"
|
||||||
>
|
>
|
||||||
<Trash2 className="h-4 w-4 mr-1.5" />
|
<Trash2 className="h-4 w-4 mr-1.5" />
|
||||||
{dict.modelConfig.deleteProvider}
|
{
|
||||||
|
dict.modelConfig
|
||||||
|
.deleteProvider
|
||||||
|
}
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Configuration Section */}
|
{/* Configuration Section */}
|
||||||
<ConfigSection
|
<ConfigSection
|
||||||
title={dict.modelConfig.configuration}
|
title={
|
||||||
|
dict.modelConfig.configuration
|
||||||
|
}
|
||||||
icon={Settings2}
|
icon={Settings2}
|
||||||
>
|
>
|
||||||
<ConfigCard>
|
<ConfigCard>
|
||||||
@@ -626,7 +636,8 @@ export function ModelConfigDialog({
|
|||||||
>
|
>
|
||||||
<Key className="h-3.5 w-3.5 text-muted-foreground" />
|
<Key className="h-3.5 w-3.5 text-muted-foreground" />
|
||||||
{
|
{
|
||||||
dict.modelConfig
|
dict
|
||||||
|
.modelConfig
|
||||||
.awsAccessKeyId
|
.awsAccessKeyId
|
||||||
}
|
}
|
||||||
</Label>
|
</Label>
|
||||||
@@ -661,7 +672,8 @@ export function ModelConfigDialog({
|
|||||||
>
|
>
|
||||||
<Key className="h-3.5 w-3.5 text-muted-foreground" />
|
<Key className="h-3.5 w-3.5 text-muted-foreground" />
|
||||||
{
|
{
|
||||||
dict.modelConfig
|
dict
|
||||||
|
.modelConfig
|
||||||
.awsSecretAccessKey
|
.awsSecretAccessKey
|
||||||
}
|
}
|
||||||
</Label>
|
</Label>
|
||||||
@@ -677,10 +689,13 @@ export function ModelConfigDialog({
|
|||||||
selectedProvider.awsSecretAccessKey ||
|
selectedProvider.awsSecretAccessKey ||
|
||||||
""
|
""
|
||||||
}
|
}
|
||||||
onChange={(e) =>
|
onChange={(
|
||||||
|
e,
|
||||||
|
) =>
|
||||||
handleProviderUpdate(
|
handleProviderUpdate(
|
||||||
"awsSecretAccessKey",
|
"awsSecretAccessKey",
|
||||||
e.target
|
e
|
||||||
|
.target
|
||||||
.value,
|
.value,
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
@@ -722,7 +737,8 @@ export function ModelConfigDialog({
|
|||||||
>
|
>
|
||||||
<Link2 className="h-3.5 w-3.5 text-muted-foreground" />
|
<Link2 className="h-3.5 w-3.5 text-muted-foreground" />
|
||||||
{
|
{
|
||||||
dict.modelConfig
|
dict
|
||||||
|
.modelConfig
|
||||||
.awsRegion
|
.awsRegion
|
||||||
}
|
}
|
||||||
</Label>
|
</Label>
|
||||||
@@ -801,7 +817,8 @@ export function ModelConfigDialog({
|
|||||||
</SelectItem>
|
</SelectItem>
|
||||||
<SelectItem value="sa-east-1">
|
<SelectItem value="sa-east-1">
|
||||||
sa-east-1
|
sa-east-1
|
||||||
(São Paulo)
|
(São
|
||||||
|
Paulo)
|
||||||
</SelectItem>
|
</SelectItem>
|
||||||
</SelectContent>
|
</SelectContent>
|
||||||
</Select>
|
</Select>
|
||||||
@@ -848,7 +865,8 @@ export function ModelConfigDialog({
|
|||||||
}
|
}
|
||||||
</>
|
</>
|
||||||
) : (
|
) : (
|
||||||
dict.modelConfig
|
dict
|
||||||
|
.modelConfig
|
||||||
.test
|
.test
|
||||||
)}
|
)}
|
||||||
</Button>
|
</Button>
|
||||||
@@ -904,7 +922,8 @@ export function ModelConfigDialog({
|
|||||||
}
|
}
|
||||||
</>
|
</>
|
||||||
) : (
|
) : (
|
||||||
dict.modelConfig
|
dict
|
||||||
|
.modelConfig
|
||||||
.test
|
.test
|
||||||
)}
|
)}
|
||||||
</Button>
|
</Button>
|
||||||
@@ -930,7 +949,8 @@ export function ModelConfigDialog({
|
|||||||
>
|
>
|
||||||
<Key className="h-3.5 w-3.5 text-muted-foreground" />
|
<Key className="h-3.5 w-3.5 text-muted-foreground" />
|
||||||
{
|
{
|
||||||
dict.modelConfig
|
dict
|
||||||
|
.modelConfig
|
||||||
.apiKey
|
.apiKey
|
||||||
}
|
}
|
||||||
</Label>
|
</Label>
|
||||||
@@ -1047,7 +1067,8 @@ export function ModelConfigDialog({
|
|||||||
>
|
>
|
||||||
<Link2 className="h-3.5 w-3.5 text-muted-foreground" />
|
<Link2 className="h-3.5 w-3.5 text-muted-foreground" />
|
||||||
{
|
{
|
||||||
dict.modelConfig
|
dict
|
||||||
|
.modelConfig
|
||||||
.baseUrl
|
.baseUrl
|
||||||
}
|
}
|
||||||
<span className="text-muted-foreground font-normal">
|
<span className="text-muted-foreground font-normal">
|
||||||
@@ -1077,7 +1098,8 @@ export function ModelConfigDialog({
|
|||||||
.provider
|
.provider
|
||||||
]
|
]
|
||||||
.defaultBaseUrl ||
|
.defaultBaseUrl ||
|
||||||
dict.modelConfig
|
dict
|
||||||
|
.modelConfig
|
||||||
.customEndpoint
|
.customEndpoint
|
||||||
}
|
}
|
||||||
className="h-9 rounded-xl font-mono text-xs"
|
className="h-9 rounded-xl font-mono text-xs"
|
||||||
@@ -1100,10 +1122,13 @@ export function ModelConfigDialog({
|
|||||||
dict.modelConfig
|
dict.modelConfig
|
||||||
.customModelId
|
.customModelId
|
||||||
}
|
}
|
||||||
value={customModelInput}
|
value={
|
||||||
|
customModelInput
|
||||||
|
}
|
||||||
onChange={(e) => {
|
onChange={(e) => {
|
||||||
setCustomModelInput(
|
setCustomModelInput(
|
||||||
e.target.value,
|
e.target
|
||||||
|
.value,
|
||||||
)
|
)
|
||||||
if (
|
if (
|
||||||
duplicateError
|
duplicateError
|
||||||
@@ -1123,7 +1148,9 @@ export function ModelConfigDialog({
|
|||||||
handleAddModel(
|
handleAddModel(
|
||||||
customModelInput.trim(),
|
customModelInput.trim(),
|
||||||
)
|
)
|
||||||
if (success) {
|
if (
|
||||||
|
success
|
||||||
|
) {
|
||||||
setCustomModelInput(
|
setCustomModelInput(
|
||||||
"",
|
"",
|
||||||
)
|
)
|
||||||
@@ -1168,7 +1195,9 @@ export function ModelConfigDialog({
|
|||||||
<Plus className="h-3.5 w-3.5" />
|
<Plus className="h-3.5 w-3.5" />
|
||||||
</Button>
|
</Button>
|
||||||
<Select
|
<Select
|
||||||
onValueChange={(value) => {
|
onValueChange={(
|
||||||
|
value,
|
||||||
|
) => {
|
||||||
if (value) {
|
if (value) {
|
||||||
handleAddModel(
|
handleAddModel(
|
||||||
value,
|
value,
|
||||||
@@ -1204,7 +1233,9 @@ export function ModelConfigDialog({
|
|||||||
}
|
}
|
||||||
className="font-mono text-xs"
|
className="font-mono text-xs"
|
||||||
>
|
>
|
||||||
{modelId}
|
{
|
||||||
|
modelId
|
||||||
|
}
|
||||||
</SelectItem>
|
</SelectItem>
|
||||||
),
|
),
|
||||||
)}
|
)}
|
||||||
@@ -1215,8 +1246,8 @@ export function ModelConfigDialog({
|
|||||||
>
|
>
|
||||||
{/* Model List */}
|
{/* Model List */}
|
||||||
<div className="rounded-2xl border border-border-subtle bg-surface-2/30 overflow-hidden min-h-[120px]">
|
<div className="rounded-2xl border border-border-subtle bg-surface-2/30 overflow-hidden min-h-[120px]">
|
||||||
{selectedProvider.models.length ===
|
{selectedProvider.models
|
||||||
0 ? (
|
.length === 0 ? (
|
||||||
<div className="p-6 text-center h-full flex flex-col items-center justify-center">
|
<div className="p-6 text-center h-full flex flex-col items-center justify-center">
|
||||||
<div className="inline-flex items-center justify-center w-10 h-10 rounded-full bg-surface-2 mb-3">
|
<div className="inline-flex items-center justify-center w-10 h-10 rounded-full bg-surface-2 mb-3">
|
||||||
<Sparkles className="h-5 w-5 text-muted-foreground" />
|
<Sparkles className="h-5 w-5 text-muted-foreground" />
|
||||||
@@ -1233,7 +1264,9 @@ export function ModelConfigDialog({
|
|||||||
{selectedProvider.models.map(
|
{selectedProvider.models.map(
|
||||||
(model, index) => (
|
(model, index) => (
|
||||||
<div
|
<div
|
||||||
key={model.id}
|
key={
|
||||||
|
model.id
|
||||||
|
}
|
||||||
className={cn(
|
className={cn(
|
||||||
"transition-colors duration-150 hover:bg-interactive-hover/50",
|
"transition-colors duration-150 hover:bg-interactive-hover/50",
|
||||||
)}
|
)}
|
||||||
@@ -1467,6 +1500,7 @@ export function ModelConfigDialog({
|
|||||||
</ConfigSection>
|
</ConfigSection>
|
||||||
</div>
|
</div>
|
||||||
</ScrollArea>
|
</ScrollArea>
|
||||||
|
</>
|
||||||
) : (
|
) : (
|
||||||
<div className="h-full flex flex-col items-center justify-center p-8 text-center">
|
<div className="h-full flex flex-col items-center justify-center p-8 text-center">
|
||||||
<div className="inline-flex items-center justify-center w-16 h-16 rounded-2xl bg-surface-2 mb-4">
|
<div className="inline-flex items-center justify-center w-16 h-16 rounded-2xl bg-surface-2 mb-4">
|
||||||
|
|||||||
@@ -11,6 +11,7 @@ import {
|
|||||||
flattenModels,
|
flattenModels,
|
||||||
type ModelConfig,
|
type ModelConfig,
|
||||||
type MultiModelConfig,
|
type MultiModelConfig,
|
||||||
|
PROVIDER_INFO,
|
||||||
type ProviderConfig,
|
type ProviderConfig,
|
||||||
type ProviderName,
|
type ProviderName,
|
||||||
} from "@/lib/types/model-config"
|
} from "@/lib/types/model-config"
|
||||||
|
|||||||
@@ -786,7 +786,7 @@ export function getAIModel(overrides?: ClientOverrides): ModelConfig {
|
|||||||
`data: ${JSON.stringify(data)}\n\n`,
|
`data: ${JSON.stringify(data)}\n\n`,
|
||||||
),
|
),
|
||||||
)
|
)
|
||||||
} catch (_e) {
|
} catch (e) {
|
||||||
// If parsing fails, forward the original message to avoid breaking the stream.
|
// If parsing fails, forward the original message to avoid breaking the stream.
|
||||||
controller.enqueue(
|
controller.enqueue(
|
||||||
new TextEncoder().encode(
|
new TextEncoder().encode(
|
||||||
@@ -906,34 +906,3 @@ export function supportsPromptCaching(modelId: string): boolean {
|
|||||||
modelId.startsWith("eu.anthropic")
|
modelId.startsWith("eu.anthropic")
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Check if a model supports image/vision input.
|
|
||||||
* Some models silently drop image parts without error (AI SDK warning only).
|
|
||||||
*/
|
|
||||||
export function supportsImageInput(modelId: string): boolean {
|
|
||||||
const lowerModelId = modelId.toLowerCase()
|
|
||||||
|
|
||||||
// Helper to check if model has vision capability indicator
|
|
||||||
const hasVisionIndicator =
|
|
||||||
lowerModelId.includes("vision") || lowerModelId.includes("vl")
|
|
||||||
|
|
||||||
// Models that DON'T support image/vision input (unless vision variant)
|
|
||||||
// Kimi K2 models don't support images
|
|
||||||
if (lowerModelId.includes("kimi") && !hasVisionIndicator) {
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
|
|
||||||
// DeepSeek text models (not vision variants)
|
|
||||||
if (lowerModelId.includes("deepseek") && !hasVisionIndicator) {
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
|
|
||||||
// Qwen text models (not vision variants like qwen-vl)
|
|
||||||
if (lowerModelId.includes("qwen") && !hasVisionIndicator) {
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
|
|
||||||
// Default: assume model supports images
|
|
||||||
return true
|
|
||||||
}
|
|
||||||
|
|||||||
50
package-lock.json
generated
50
package-lock.json
generated
@@ -93,11 +93,6 @@
|
|||||||
"typescript": "^5",
|
"typescript": "^5",
|
||||||
"wait-on": "^9.0.3",
|
"wait-on": "^9.0.3",
|
||||||
"wrangler": "4.54.0"
|
"wrangler": "4.54.0"
|
||||||
},
|
|
||||||
"optionalDependencies": {
|
|
||||||
"@tailwindcss/oxide-linux-x64-gnu": "^4.1.18",
|
|
||||||
"lightningcss": "^1.30.2",
|
|
||||||
"lightningcss-linux-x64-gnu": "^1.30.2"
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@acemir/cssom": {
|
"node_modules/@acemir/cssom": {
|
||||||
@@ -8719,22 +8714,6 @@
|
|||||||
"node": ">= 10"
|
"node": ">= 10"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@tailwindcss/oxide-linux-x64-gnu": {
|
|
||||||
"version": "4.1.18",
|
|
||||||
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-gnu/-/oxide-linux-x64-gnu-4.1.18.tgz",
|
|
||||||
"integrity": "sha512-v3gyT0ivkfBLoZGF9LyHmts0Isc8jHZyVcbzio6Wpzifg/+5ZJpDiRiUhDLkcr7f/r38SWNe7ucxmGW3j3Kb/g==",
|
|
||||||
"cpu": [
|
|
||||||
"x64"
|
|
||||||
],
|
|
||||||
"license": "MIT",
|
|
||||||
"optional": true,
|
|
||||||
"os": [
|
|
||||||
"linux"
|
|
||||||
],
|
|
||||||
"engines": {
|
|
||||||
"node": ">= 10"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/@tailwindcss/postcss": {
|
"node_modules/@tailwindcss/postcss": {
|
||||||
"version": "4.1.18",
|
"version": "4.1.18",
|
||||||
"resolved": "https://registry.npmjs.org/@tailwindcss/postcss/-/postcss-4.1.18.tgz",
|
"resolved": "https://registry.npmjs.org/@tailwindcss/postcss/-/postcss-4.1.18.tgz",
|
||||||
@@ -15143,7 +15122,7 @@
|
|||||||
"version": "1.30.2",
|
"version": "1.30.2",
|
||||||
"resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.30.2.tgz",
|
"resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.30.2.tgz",
|
||||||
"integrity": "sha512-utfs7Pr5uJyyvDETitgsaqSyjCb2qNRAtuqUeWIAKztsOYdcACf2KtARYXg2pSvhkt+9NfoaNY7fxjl6nuMjIQ==",
|
"integrity": "sha512-utfs7Pr5uJyyvDETitgsaqSyjCb2qNRAtuqUeWIAKztsOYdcACf2KtARYXg2pSvhkt+9NfoaNY7fxjl6nuMjIQ==",
|
||||||
"devOptional": true,
|
"dev": true,
|
||||||
"license": "MPL-2.0",
|
"license": "MPL-2.0",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"detect-libc": "^2.0.3"
|
"detect-libc": "^2.0.3"
|
||||||
@@ -15176,6 +15155,7 @@
|
|||||||
"cpu": [
|
"cpu": [
|
||||||
"arm64"
|
"arm64"
|
||||||
],
|
],
|
||||||
|
"dev": true,
|
||||||
"license": "MPL-2.0",
|
"license": "MPL-2.0",
|
||||||
"optional": true,
|
"optional": true,
|
||||||
"os": [
|
"os": [
|
||||||
@@ -15189,26 +15169,6 @@
|
|||||||
"url": "https://opencollective.com/parcel"
|
"url": "https://opencollective.com/parcel"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/lightningcss-linux-x64-gnu": {
|
|
||||||
"version": "1.30.2",
|
|
||||||
"resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.30.2.tgz",
|
|
||||||
"integrity": "sha512-Cfd46gdmj1vQ+lR6VRTTadNHu6ALuw2pKR9lYq4FnhvgBc4zWY1EtZcAc6EffShbb1MFrIPfLDXD6Xprbnni4w==",
|
|
||||||
"cpu": [
|
|
||||||
"x64"
|
|
||||||
],
|
|
||||||
"license": "MPL-2.0",
|
|
||||||
"optional": true,
|
|
||||||
"os": [
|
|
||||||
"linux"
|
|
||||||
],
|
|
||||||
"engines": {
|
|
||||||
"node": ">= 12.0.0"
|
|
||||||
},
|
|
||||||
"funding": {
|
|
||||||
"type": "opencollective",
|
|
||||||
"url": "https://opencollective.com/parcel"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/lint-staged": {
|
"node_modules/lint-staged": {
|
||||||
"version": "16.2.7",
|
"version": "16.2.7",
|
||||||
"resolved": "https://registry.npmjs.org/lint-staged/-/lint-staged-16.2.7.tgz",
|
"resolved": "https://registry.npmjs.org/lint-staged/-/lint-staged-16.2.7.tgz",
|
||||||
@@ -18012,9 +17972,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/qs": {
|
"node_modules/qs": {
|
||||||
"version": "6.14.1",
|
"version": "6.14.0",
|
||||||
"resolved": "https://registry.npmjs.org/qs/-/qs-6.14.1.tgz",
|
"resolved": "https://registry.npmjs.org/qs/-/qs-6.14.0.tgz",
|
||||||
"integrity": "sha512-4EK3+xJl8Ts67nLYNwqw/dsFVnCf+qR7RgXSK9jEEm9unao3njwMDdmsdvoKBKHzxd7tCYz5e5M+SnMjdtXGQQ==",
|
"integrity": "sha512-YWWTjgABSKcvs/nWBi9PycY/JiPJqOD4JA6o9Sej2AtvSGarXxKC3OQSk4pAarbdQlKAh5D4FCQkJNkW+GAn3w==",
|
||||||
"license": "BSD-3-Clause",
|
"license": "BSD-3-Clause",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"side-channel": "^1.1.0"
|
"side-channel": "^1.1.0"
|
||||||
|
|||||||
@@ -90,7 +90,7 @@ Use the standard MCP configuration with:
|
|||||||
- **Natural Language**: Describe diagrams in plain text - flowcharts, architecture diagrams, etc.
|
- **Natural Language**: Describe diagrams in plain text - flowcharts, architecture diagrams, etc.
|
||||||
- **Edit Support**: Modify existing diagrams with natural language instructions
|
- **Edit Support**: Modify existing diagrams with natural language instructions
|
||||||
- **Export**: Save diagrams as `.drawio` files
|
- **Export**: Save diagrams as `.drawio` files
|
||||||
- **Self-contained**: Embedded server, works offline (except draw.io UI which loads from `embed.diagrams.net` by default, configurable via `DRAWIO_BASE_URL`)
|
- **Self-contained**: Embedded server, works offline (except draw.io UI which loads from embed.diagrams.net)
|
||||||
|
|
||||||
## Available Tools
|
## Available Tools
|
||||||
|
|
||||||
@@ -130,33 +130,6 @@ Use the standard MCP configuration with:
|
|||||||
| Variable | Default | Description |
|
| Variable | Default | Description |
|
||||||
|----------|---------|-------------|
|
|----------|---------|-------------|
|
||||||
| `PORT` | `6002` | Port for the embedded HTTP server |
|
| `PORT` | `6002` | Port for the embedded HTTP server |
|
||||||
| `DRAWIO_BASE_URL` | `https://embed.diagrams.net` | Base URL for the draw.io embed. Set this to use a self-hosted draw.io instance for private deployments. |
|
|
||||||
|
|
||||||
### Private Deployment (Self-hosted draw.io)
|
|
||||||
|
|
||||||
For security-sensitive environments that require private deployment of draw.io:
|
|
||||||
|
|
||||||
```json
|
|
||||||
{
|
|
||||||
"mcpServers": {
|
|
||||||
"drawio": {
|
|
||||||
"command": "npx",
|
|
||||||
"args": ["@next-ai-drawio/mcp-server@latest"],
|
|
||||||
"env": {
|
|
||||||
"DRAWIO_BASE_URL": "https://drawio.your-company.com"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
You can deploy your own draw.io instance using the official Docker image:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
docker run -d -p 8080:8080 jgraph/drawio
|
|
||||||
```
|
|
||||||
|
|
||||||
Then set `DRAWIO_BASE_URL=http://localhost:8080` (or your server's URL).
|
|
||||||
|
|
||||||
## Troubleshooting
|
## Troubleshooting
|
||||||
|
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@next-ai-drawio/mcp-server",
|
"name": "@next-ai-drawio/mcp-server",
|
||||||
"version": "0.1.11",
|
"version": "0.1.10",
|
||||||
"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",
|
||||||
|
|||||||
@@ -13,28 +13,6 @@ import {
|
|||||||
} from "./history.js"
|
} from "./history.js"
|
||||||
import { log } from "./logger.js"
|
import { log } from "./logger.js"
|
||||||
|
|
||||||
// Configurable draw.io embed URL for private deployments
|
|
||||||
const DRAWIO_BASE_URL =
|
|
||||||
process.env.DRAWIO_BASE_URL || "https://embed.diagrams.net"
|
|
||||||
|
|
||||||
// Extract origin (scheme + host + port) from URL for postMessage security check
|
|
||||||
function getOrigin(url: string): string {
|
|
||||||
try {
|
|
||||||
const parsed = new URL(url)
|
|
||||||
return `${parsed.protocol}//${parsed.host}`
|
|
||||||
} catch {
|
|
||||||
return url // Fallback if parsing fails
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const DRAWIO_ORIGIN = getOrigin(DRAWIO_BASE_URL)
|
|
||||||
|
|
||||||
// Normalize URL for iframe src - ensure no double slashes
|
|
||||||
function normalizeUrl(url: string): string {
|
|
||||||
// Remove trailing slash to avoid double slashes
|
|
||||||
return url.replace(/\/$/, '')
|
|
||||||
}
|
|
||||||
|
|
||||||
interface SessionState {
|
interface SessionState {
|
||||||
xml: string
|
xml: string
|
||||||
version: number
|
version: number
|
||||||
@@ -149,12 +127,7 @@ function cleanupExpiredSessions(): void {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const cleanupIntervalId = setInterval(cleanupExpiredSessions, 5 * 60 * 1000)
|
setInterval(cleanupExpiredSessions, 5 * 60 * 1000)
|
||||||
|
|
||||||
export function shutdown(): void {
|
|
||||||
clearInterval(cleanupIntervalId)
|
|
||||||
stopHttpServer()
|
|
||||||
}
|
|
||||||
|
|
||||||
export function getServerPort(): number {
|
export function getServerPort(): number {
|
||||||
return serverPort
|
return serverPort
|
||||||
@@ -425,7 +398,7 @@ function getHtmlPage(sessionId: string): string {
|
|||||||
</div>
|
</div>
|
||||||
<div id="status" class="status disconnected">Connecting...</div>
|
<div id="status" class="status disconnected">Connecting...</div>
|
||||||
</div>
|
</div>
|
||||||
<iframe id="drawio" src="${normalizeUrl(DRAWIO_BASE_URL)}/?embed=1&proto=json&spin=1&libraries=1"></iframe>
|
<iframe id="drawio" src="https://embed.diagrams.net/?embed=1&proto=json&spin=1&libraries=1"></iframe>
|
||||||
</div>
|
</div>
|
||||||
<button id="history-btn" title="History" ${sessionId ? "" : "disabled"}>
|
<button id="history-btn" title="History" ${sessionId ? "" : "disabled"}>
|
||||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||||
@@ -455,7 +428,7 @@ function getHtmlPage(sessionId: string): string {
|
|||||||
let pendingAiSvg = false;
|
let pendingAiSvg = false;
|
||||||
|
|
||||||
window.addEventListener('message', (e) => {
|
window.addEventListener('message', (e) => {
|
||||||
if (e.origin !== '${DRAWIO_ORIGIN}') return;
|
if (e.origin !== 'https://embed.diagrams.net') return;
|
||||||
try {
|
try {
|
||||||
const msg = JSON.parse(e.data);
|
const msg = JSON.parse(e.data);
|
||||||
if (msg.event === 'init') {
|
if (msg.event === 'init') {
|
||||||
|
|||||||
@@ -39,7 +39,6 @@ import {
|
|||||||
getState,
|
getState,
|
||||||
requestSync,
|
requestSync,
|
||||||
setState,
|
setState,
|
||||||
shutdown,
|
|
||||||
startHttpServer,
|
startHttpServer,
|
||||||
waitForSync,
|
waitForSync,
|
||||||
} from "./http-server.js"
|
} from "./http-server.js"
|
||||||
@@ -48,7 +47,7 @@ import { validateAndFixXml } from "./xml-validation.js"
|
|||||||
|
|
||||||
// Server configuration
|
// Server configuration
|
||||||
const config = {
|
const config = {
|
||||||
port: parseInt(process.env.PORT || "6002", 10),
|
port: parseInt(process.env.PORT || "6002"),
|
||||||
}
|
}
|
||||||
|
|
||||||
// Session state (single session for simplicity)
|
// Session state (single session for simplicity)
|
||||||
@@ -619,31 +618,6 @@ server.registerTool(
|
|||||||
},
|
},
|
||||||
)
|
)
|
||||||
|
|
||||||
// Graceful shutdown handler
|
|
||||||
let isShuttingDown = false
|
|
||||||
function gracefulShutdown(reason: string) {
|
|
||||||
if (isShuttingDown) return
|
|
||||||
isShuttingDown = true
|
|
||||||
log.info(`Shutting down: ${reason}`)
|
|
||||||
shutdown()
|
|
||||||
process.exit(0)
|
|
||||||
}
|
|
||||||
|
|
||||||
// Handle stdin close (primary method - works on all platforms including Windows)
|
|
||||||
process.stdin.on("close", () => gracefulShutdown("stdin closed"))
|
|
||||||
process.stdin.on("end", () => gracefulShutdown("stdin ended"))
|
|
||||||
|
|
||||||
// Handle signals (may not work reliably on Windows)
|
|
||||||
process.on("SIGINT", () => gracefulShutdown("SIGINT"))
|
|
||||||
process.on("SIGTERM", () => gracefulShutdown("SIGTERM"))
|
|
||||||
|
|
||||||
// Handle broken pipe (writing to closed stdout)
|
|
||||||
process.stdout.on("error", (err) => {
|
|
||||||
if (err.code === "EPIPE" || err.code === "ERR_STREAM_DESTROYED") {
|
|
||||||
gracefulShutdown("stdout error")
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
// Start the MCP server
|
// Start the MCP server
|
||||||
async function main() {
|
async function main() {
|
||||||
log.info("Starting MCP server for Next AI Draw.io (embedded mode)...")
|
log.info("Starting MCP server for Next AI Draw.io (embedded mode)...")
|
||||||
|
|||||||
@@ -253,7 +253,7 @@ async function main() {
|
|||||||
},
|
},
|
||||||
)
|
)
|
||||||
console.log("👀 Watching for preset configuration changes...")
|
console.log("👀 Watching for preset configuration changes...")
|
||||||
} catch (_err) {
|
} catch (err) {
|
||||||
// File might not exist yet, that's ok
|
// File might not exist yet, that's ok
|
||||||
setTimeout(setupConfigWatcher, 5000)
|
setTimeout(setupConfigWatcher, 5000)
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user