@geminilight/mindos 0.6.56 → 0.6.58

package/_standalone/.next/types/routes.d.ts

@@ -2,7 +2,7 @@
 // Do not edit this file manually
 
 type AppRoutes = "/" | "/agents" | "/agents/[agentKey]" | "/changes" | "/echo" | "/echo/[segment]" | "/explore" | "/help" | "/inbox/history" | "/login" | "/setup" | "/trash" | "/view/[...path]" | "/wiki"
-type AppRouteHandlerRoutes = "/.well-known/agent-card.json" | "/api/a2a" | "/api/a2a/agents" | "/api/a2a/delegations" | "/api/a2a/discover" | "/api/acp/config" | "/api/acp/detect" | "/api/acp/install" | "/api/acp/registry" | "/api/acp/session" | "/api/agent-activity" | "/api/ask" | "/api/ask-sessions" | "/api/auth" | "/api/backlinks" | "/api/bootstrap" | "/api/changes" | "/api/export" | "/api/extract-pdf" | "/api/file" | "/api/file/import" | "/api/file/raw" | "/api/files" | "/api/git" | "/api/graph" | "/api/health" | "/api/inbox" | "/api/init" | "/api/mcp/agents" | "/api/mcp/install" | "/api/mcp/install-skill" | "/api/mcp/restart" | "/api/mcp/status" | "/api/mcp/uninstall" | "/api/monitoring" | "/api/recent-files" | "/api/restart" | "/api/search" | "/api/settings" | "/api/settings/list-models" | "/api/settings/reset-token" | "/api/settings/test-key" | "/api/setup" | "/api/setup/check-path" | "/api/setup/check-port" | "/api/setup/generate-token" | "/api/setup/ls" | "/api/skills" | "/api/sync" | "/api/tree-version" | "/api/uninstall" | "/api/update" | "/api/update-check" | "/api/update-status" | "/api/workflows"
+type AppRouteHandlerRoutes = "/.well-known/agent-card.json" | "/api/a2a" | "/api/a2a/agents" | "/api/a2a/delegations" | "/api/a2a/discover" | "/api/acp/config" | "/api/acp/detect" | "/api/acp/install" | "/api/acp/registry" | "/api/acp/session" | "/api/agent-activity" | "/api/agents/custom" | "/api/agents/custom/detect" | "/api/ask" | "/api/ask-sessions" | "/api/auth" | "/api/backlinks" | "/api/bootstrap" | "/api/changes" | "/api/export" | "/api/extract-pdf" | "/api/file" | "/api/file/import" | "/api/file/raw" | "/api/files" | "/api/git" | "/api/graph" | "/api/health" | "/api/inbox" | "/api/init" | "/api/mcp/agents" | "/api/mcp/install" | "/api/mcp/install-skill" | "/api/mcp/restart" | "/api/mcp/status" | "/api/mcp/uninstall" | "/api/monitoring" | "/api/recent-files" | "/api/restart" | "/api/search" | "/api/settings" | "/api/settings/list-models" | "/api/settings/reset-token" | "/api/settings/test-key" | "/api/setup" | "/api/setup/check-path" | "/api/setup/check-port" | "/api/setup/generate-token" | "/api/setup/ls" | "/api/skills" | "/api/sync" | "/api/tree-version" | "/api/uninstall" | "/api/update" | "/api/update-check" | "/api/update-status" | "/api/workflows"
 type PageRoutes = never
 type LayoutRoutes = "/"
 type RedirectRoutes = never
@@ -25,6 +25,8 @@ interface ParamMap {
   "/api/acp/registry": {}
   "/api/acp/session": {}
   "/api/agent-activity": {}
+  "/api/agents/custom": {}
+  "/api/agents/custom/detect": {}
   "/api/ask": {}
   "/api/ask-sessions": {}
   "/api/auth": {}

package/_standalone/.next/types/validator.ts

@@ -272,6 +272,24 @@ type RouteHandlerConfig<Route extends AppRouteHandlerRoutes = AppRouteHandlerRou
   type __Unused = __Check
 }
 
+// Validate ../../app/api/agents/custom/detect/route.ts
+{
+  type __IsExpected<Specific extends RouteHandlerConfig<"/api/agents/custom/detect">> = Specific
+  const handler = {} as typeof import("../../app/api/agents/custom/detect/route.js")
+  type __Check = __IsExpected<typeof handler>
+  // @ts-ignore
+  type __Unused = __Check
+}
+
+// Validate ../../app/api/agents/custom/route.ts
+{
+  type __IsExpected<Specific extends RouteHandlerConfig<"/api/agents/custom">> = Specific
+  const handler = {} as typeof import("../../app/api/agents/custom/route.js")
+  type __Check = __IsExpected<typeof handler>
+  // @ts-ignore
+  type __Unused = __Check
+}
+
 // Validate ../../app/api/ask-sessions/route.ts
 {
   type __IsExpected<Specific extends RouteHandlerConfig<"/api/ask-sessions">> = Specific

package/_standalone/__tests__/api/mcp-install.test.ts

@@ -254,11 +254,11 @@ describe('POST /api/mcp/install', () => {
 });
 
 describe('GET /api/mcp/agents', () => {
-  it('returns all 20 agents (1 builtin + 19 registry)', async () => {
+  it('returns all 21 agents (1 builtin + 20 registry)', async () => {
     const { GET } = await importAgentsRoute();
     const res = await GET();
     const body = await res.json();
-    expect(body.agents).toHaveLength(20);
+    expect(body.agents).toHaveLength(21);
     const keys = body.agents.map((a: { key: string }) => a.key);
     expect(keys).toContain('mindos');
     expect(keys).toContain('claude-code');
@@ -275,6 +275,7 @@ describe('GET /api/mcp/agents', () => {
     expect(keys).toContain('roo');
     expect(keys).toContain('github-copilot');
     expect(keys).toContain('codex');
+    expect(keys).toContain('antigravity');
   });
 
   it('detects installed agent from config file', async () => {

package/_standalone/__tests__/ask/non-streaming-api.test.ts

@@ -0,0 +1,281 @@
+import { describe, it, expect } from 'vitest';
+
+/**
+ * Tests for non-streaming API fallback.
+ * Verifies:
+ * 1. pi-ai → OpenAI message format conversion
+ * 2. SSE response reassembly (for proxies that ignore stream:false)
+ */
+
+// ─────────────────────────────────────────────────
+// Replicate helper functions from route.ts for unit testing
+// ─────────────────────────────────────────────────
+
+function piMessagesToOpenAI(piMessages: any[]): any[] {
+  return piMessages.map(msg => {
+    const role = msg.role;
+    if (role === 'system') return null;
+    if (role === 'user') {
+      return { role: 'user', content: typeof msg.content === 'string' ? msg.content : msg.content };
+    }
+    if (role === 'assistant') {
+      const content = msg.content;
+      let textContent = '';
+      const toolCalls: any[] = [];
+      if (Array.isArray(content)) {
+        for (const part of content) {
+          if (part.type === 'text' && part.text) {
+            textContent += part.text;
+          } else if (part.type === 'toolCall') {
+            toolCalls.push({
+              id: part.id ?? `call_fallback`,
+              type: 'function',
+              function: { name: part.name ?? 'unknown', arguments: JSON.stringify(part.arguments ?? {}) },
+            });
+          }
+        }
+      }
+      const result: any = { role: 'assistant' };
+      result.content = textContent || '';
+      if (toolCalls.length > 0) result.tool_calls = toolCalls;
+      return result;
+    }
+    if (role === 'toolResult') {
+      const contentText = Array.isArray(msg.content)
+        ? msg.content.filter((c: any) => c.type === 'text').map((c: any) => c.text ?? '').join('\n')
+        : String(msg.content ?? '');
+      return { role: 'tool', tool_call_id: msg.toolCallId ?? 'unknown', content: contentText };
+    }
+    return null;
+  }).filter(Boolean);
+}
+
+function reassembleSSE(sseText: string): any {
+  const lines = sseText.split('\n');
+  let content = '';
+  let role = 'assistant';
+  let finishReason = 'stop';
+  const toolCalls: Map<number, { id: string; type: string; function: { name: string; arguments: string } }> = new Map();
+
+  for (const line of lines) {
+    const trimmed = line.trim();
+    if (!trimmed.startsWith('data:')) continue;
+    const payload = trimmed.slice(5).trim();
+    if (payload === '[DONE]') break;
+    let chunk: any;
+    try { chunk = JSON.parse(payload); } catch { continue; }
+    const delta = chunk?.choices?.[0]?.delta;
+    if (!delta) continue;
+    if (delta.role) role = delta.role;
+    if (delta.content) content += delta.content;
+    if (chunk.choices[0].finish_reason) finishReason = chunk.choices[0].finish_reason;
+    if (delta.tool_calls) {
+      for (const tc of delta.tool_calls) {
+        const idx = tc.index ?? 0;
+        const existing = toolCalls.get(idx);
+        if (!existing) {
+          toolCalls.set(idx, {
+            id: tc.id ?? '',
+            type: tc.type ?? 'function',
+            function: { name: tc.function?.name ?? '', arguments: tc.function?.arguments ?? '' },
+          });
+        } else {
+          if (tc.id) existing.id = tc.id;
+          if (tc.function?.name) existing.function.name += tc.function.name;
+          if (tc.function?.arguments) existing.function.arguments += tc.function.arguments;
+        }
+      }
+    }
+  }
+
+  const message: any = { role, content: content || null };
+  if (toolCalls.size > 0) {
+    message.tool_calls = Array.from(toolCalls.values());
+  }
+  return { choices: [{ message, finish_reason: finishReason }] };
+}
+
+// ─────────────────────────────────────────────────
+// piMessagesToOpenAI tests
+// ─────────────────────────────────────────────────
+
+describe('piMessagesToOpenAI', () => {
+  it('converts plain user message', () => {
+    expect(piMessagesToOpenAI([{ role: 'user', content: 'Hello!' }]))
+      .toEqual([{ role: 'user', content: 'Hello!' }]);
+  });
+
+  it('converts assistant text-only message', () => {
+    const result = piMessagesToOpenAI([{
+      role: 'assistant',
+      content: [{ type: 'text', text: 'Response' }],
+    }]);
+    expect(result).toEqual([{ role: 'assistant', content: 'Response' }]);
+  });
+
+  it('converts assistant message with tool calls', () => {
+    const result = piMessagesToOpenAI([{
+      role: 'assistant',
+      content: [
+        { type: 'text', text: 'Calling tool' },
+        { type: 'toolCall', id: 'call_1', name: 'read_file', arguments: { path: '/tmp' } },
+      ],
+    }]);
+    expect(result[0].content).toBe('Calling tool');
+    expect(result[0].tool_calls[0]).toMatchObject({
+      id: 'call_1', type: 'function',
+      function: { name: 'read_file', arguments: '{"path":"/tmp"}' },
+    });
+  });
+
+  it('converts tool result message', () => {
+    expect(piMessagesToOpenAI([{
+      role: 'toolResult', toolCallId: 'call_1',
+      content: [{ type: 'text', text: 'result data' }],
+    }])).toEqual([{ role: 'tool', tool_call_id: 'call_1', content: 'result data' }]);
+  });
+
+  it('skips system messages', () => {
+    const result = piMessagesToOpenAI([
+      { role: 'system', content: 'sys' },
+      { role: 'user', content: 'hi' },
+    ]);
+    expect(result).toHaveLength(1);
+    expect(result[0].role).toBe('user');
+  });
+
+  it('handles empty assistant content', () => {
+    const result = piMessagesToOpenAI([{ role: 'assistant', content: [] }]);
+    expect(result[0]).toEqual({ role: 'assistant', content: '' });
+  });
+
+  it('handles complex conversation history', () => {
+    const result = piMessagesToOpenAI([
+      { role: 'user', content: 'list files' },
+      { role: 'assistant', content: [
+        { type: 'text', text: 'checking' },
+        { type: 'toolCall', id: 'c1', name: 'ls', arguments: {} },
+      ]},
+      { role: 'toolResult', toolCallId: 'c1', content: [{ type: 'text', text: 'a.txt' }] },
+      { role: 'assistant', content: [{ type: 'text', text: 'Found a.txt' }] },
+    ]);
+    expect(result).toHaveLength(4);
+    expect(result[0].role).toBe('user');
+    expect(result[1].role).toBe('assistant');
+    expect(result[1].tool_calls).toHaveLength(1);
+    expect(result[2].role).toBe('tool');
+    expect(result[3]).toMatchObject({ role: 'assistant', content: 'Found a.txt' });
+  });
+});
+
+// ─────────────────────────────────────────────────
+// reassembleSSE tests
+// ─────────────────────────────────────────────────
+
+describe('reassembleSSE', () => {
+  it('reassembles simple text SSE response', () => {
+    const sse = [
+      'data: {"choices":[{"index":0,"delta":{"role":"assistant"},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"content":"Hello"},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"content":"!"},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"content":""},"finish_reason":"stop"}]}',
+      'data: [DONE]',
+    ].join('\n');
+
+    const result = reassembleSSE(sse);
+    expect(result.choices[0].message.content).toBe('Hello!');
+    expect(result.choices[0].message.role).toBe('assistant');
+    expect(result.choices[0].finish_reason).toBe('stop');
+  });
+
+  it('handles ikuncode-style empty response (proxy returns SSE with no content)', () => {
+    // This is the actual response from ikuncode when stream:false is sent
+    const sse = [
+      'data: {"id":"","object":"chat.completion.chunk","created":0,"model":"gpt-5.4","choices":[],"usage":{"prompt_tokens":28,"completion_tokens":0,"total_tokens":28}}',
+      '',
+      'data: [DONE]',
+    ].join('\n');
+
+    const result = reassembleSSE(sse);
+    // Should return empty content (no choices with delta)
+    expect(result.choices[0].message.content).toBeNull();
+    expect(result.choices[0].message.role).toBe('assistant');
+  });
+
+  it('reassembles SSE with tool calls', () => {
+    const sse = [
+      'data: {"choices":[{"index":0,"delta":{"role":"assistant"},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"tool_calls":[{"index":0,"id":"call_abc","type":"function","function":{"name":"read_","arguments":""}}]},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"tool_calls":[{"index":0,"function":{"name":"file","arguments":"{\\"pa"}}]},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"tool_calls":[{"index":0,"function":{"arguments":"th\\":\\"/tmp\\"}"}}]},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"content":""},"finish_reason":"tool_calls"}]}',
+      'data: [DONE]',
+    ].join('\n');
+
+    const result = reassembleSSE(sse);
+    const msg = result.choices[0].message;
+    expect(msg.tool_calls).toHaveLength(1);
+    expect(msg.tool_calls[0].id).toBe('call_abc');
+    expect(msg.tool_calls[0].function.name).toBe('read_file');
+    expect(msg.tool_calls[0].function.arguments).toBe('{"path":"/tmp"}');
+    expect(result.choices[0].finish_reason).toBe('tool_calls');
+  });
+
+  it('handles SSE with multiple tool calls', () => {
+    const sse = [
+      'data: {"choices":[{"index":0,"delta":{"role":"assistant"},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"tool_calls":[{"index":0,"id":"c1","type":"function","function":{"name":"tool_a","arguments":"{}"}}]},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"tool_calls":[{"index":1,"id":"c2","type":"function","function":{"name":"tool_b","arguments":"{}"}}]},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"content":""},"finish_reason":"tool_calls"}]}',
+      'data: [DONE]',
+    ].join('\n');
+
+    const result = reassembleSSE(sse);
+    expect(result.choices[0].message.tool_calls).toHaveLength(2);
+    expect(result.choices[0].message.tool_calls[0].id).toBe('c1');
+    expect(result.choices[0].message.tool_calls[1].id).toBe('c2');
+  });
+
+  it('handles SSE with text + tool calls mixed', () => {
+    const sse = [
+      'data: {"choices":[{"index":0,"delta":{"role":"assistant"},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"content":"Let me "},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"content":"check."},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"tool_calls":[{"index":0,"id":"c1","type":"function","function":{"name":"search","arguments":"{\\"q\\":\\"test\\"}"}}]},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"content":""},"finish_reason":"tool_calls"}]}',
+      'data: [DONE]',
+    ].join('\n');
+
+    const result = reassembleSSE(sse);
+    expect(result.choices[0].message.content).toBe('Let me check.');
+    expect(result.choices[0].message.tool_calls).toHaveLength(1);
+  });
+
+  it('skips invalid SSE lines gracefully', () => {
+    const sse = [
+      'data: {"choices":[{"index":0,"delta":{"content":"OK"},"finish_reason":null}]}',
+      'data: INVALID_JSON',
+      '',
+      ':comment line',
+      'data: {"choices":[{"index":0,"delta":{"content":""},"finish_reason":"stop"}]}',
+      'data: [DONE]',
+    ].join('\n');
+
+    const result = reassembleSSE(sse);
+    expect(result.choices[0].message.content).toBe('OK');
+  });
+
+  it('handles SSE with usage chunk at end (no delta)', () => {
+    const sse = [
+      'data: {"choices":[{"index":0,"delta":{"role":"assistant"},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"content":"Hi"},"finish_reason":null}]}',
+      'data: {"choices":[{"index":0,"delta":{"content":""},"finish_reason":"stop"}]}',
+      'data: {"choices":[],"usage":{"prompt_tokens":10,"completion_tokens":5,"total_tokens":15}}',
+      'data: [DONE]',
+    ].join('\n');
+
+    const result = reassembleSSE(sse);
+    expect(result.choices[0].message.content).toBe('Hi');
+    expect(result.choices[0].finish_reason).toBe('stop');
+  });
+});

package/_standalone/__tests__/core/skill-install-logic.test.ts

@@ -35,6 +35,7 @@ const SKILL_AGENT_REGISTRY: Record<string, { mode: 'universal' | 'additional' |
   'roo': { mode: 'additional', skillAgentName: 'roo' },
   'github-copilot': { mode: 'universal' },
   'codex': { mode: 'universal' },
+  'antigravity': { mode: 'additional', skillAgentName: 'antigravity' },
 };
 
 /* ── Replicated logic from scripts/setup.js ──────────────────────── */

package/_standalone/components/Editor.tsx

@@ -1,10 +1,13 @@
 'use client';
 
-import { useEffect, useRef, useCallback } from 'react';
+import { useEffect, useRef, useCallback, useState } from 'react';
 import { EditorView, basicSetup } from 'codemirror';
 import { markdown } from '@codemirror/lang-markdown';
 import { oneDark } from '@codemirror/theme-one-dark';
 import { EditorState } from '@codemirror/state';
+import { Image as ImageIcon } from 'lucide-react';
+import { useEditorImageUpload } from '@/hooks/useEditorImageUpload';
+import { toast } from '@/lib/toast';
 
 interface EditorProps {
   value: string;
@@ -65,6 +68,54 @@ export default function Editor({ value, onChange, language = 'markdown' }: Edito
   // Track whether update is from external value change
   const isExternalUpdate = useRef(false);
 
+  const { uploadToMedia, isUploading } = useEditorImageUpload();
+  const uploadRef = useRef(uploadToMedia);
+  uploadRef.current = uploadToMedia;
+  const [isMarkdown] = useState(language === 'markdown');
+
+  // Stable image insertion function via ref
+  const insertImagesRef = useRef(async (files: File[]) => {});
+  insertImagesRef.current = async (files: File[]) => {
+    const view = viewRef.current;
+    if (!view) return;
+
+    try {
+      const uploadedPaths = await uploadRef.current(files);
+
+      for (const p of uploadedPaths) {
+        const md = `![image](${p})\n`;
+        view.dispatch({
+          changes: {
+            from: view.state.selection.main.head,
+            insert: md,
+          },
+        });
+      }
+
+      toast.success('Images inserted');
+    } catch (err) {
+      toast.error('Failed to insert images');
+      console.error(err);
+    }
+  };
+
+  // Handle file picker (image button click)
+  const handlePickImages = useCallback(() => {
+    if (!isMarkdown) return;
+
+    const input = document.createElement('input');
+    input.type = 'file';
+    input.multiple = true;
+    input.accept = 'image/*';
+    input.onchange = (e) => {
+      const files = Array.from((e.target as HTMLInputElement).files ?? []);
+      if (files.length > 0) {
+        insertImagesRef.current(files);
+      }
+    };
+    input.click();
+  }, [isMarkdown]);
+
   useEffect(() => {
     if (!containerRef.current) return;
 
@@ -100,6 +151,52 @@ export default function Editor({ value, onChange, language = 'markdown' }: Edito
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
+  // Set up paste and drag/drop handlers
+  useEffect(() => {
+    if (!isMarkdown) return;
+
+    const container = containerRef.current;
+    if (!container) return;
+
+    const handlePaste = (e: ClipboardEvent) => {
+      const items = e.clipboardData?.items;
+      if (!items) return;
+
+      const files: File[] = [];
+      for (let i = 0; i < items.length; i++) {
+        const item = items[i];
+        if (item.kind === 'file' && item.type.startsWith('image/')) {
+          const file = item.getAsFile();
+          if (file) files.push(file);
+        }
+      }
+
+      if (files.length > 0) {
+        e.preventDefault();
+        insertImagesRef.current(files);
+      }
+    };
+
+    const handleDrop = (e: DragEvent) => {
+      const files = Array.from(e.dataTransfer?.files ?? []).filter((f) =>
+        f.type.startsWith('image/'),
+      );
+      if (files.length > 0) {
+        e.preventDefault();
+        e.stopPropagation();
+        insertImagesRef.current(files);
+      }
+    };
+
+    container.addEventListener('paste', handlePaste as EventListener);
+    container.addEventListener('drop', handleDrop as EventListener);
+
+    return () => {
+      container.removeEventListener('paste', handlePaste as EventListener);
+      container.removeEventListener('drop', handleDrop as EventListener);
+    };
+  }, [isMarkdown]);
+
   // Sync external value changes to editor
   useEffect(() => {
     const view = viewRef.current;
@@ -115,10 +212,31 @@ export default function Editor({ value, onChange, language = 'markdown' }: Edito
   }, [value]);
 
   return (
-    <div
-      ref={containerRef}
-      className="h-full w-full overflow-hidden rounded-lg border border-zinc-800"
-      style={{ minHeight: '400px' }}
-    />
+    <div className="relative h-full w-full flex flex-col">
+      {/* Image insert button for markdown mode */}
+      {isMarkdown && (
+        <div className="px-2 py-1.5 border-b border-zinc-800 bg-zinc-900/50 flex items-center gap-1">
+          <button
+            onClick={handlePickImages}
+            disabled={isUploading}
+            className="p-1.5 rounded hover:bg-zinc-800 disabled:opacity-50 disabled:cursor-not-allowed transition-colors flex items-center gap-1 text-xs text-muted-foreground hover:text-foreground"
+            title="Insert images (Ctrl+V or drag & drop)"
+          >
+            <ImageIcon size={14} />
+            <span>Images</span>
+          </button>
+          {isUploading && (
+            <span className="text-xs text-muted-foreground ml-2">Uploading...</span>
+          )}
+        </div>
+      )}
+
+      {/* Editor container */}
+      <div
+        ref={containerRef}
+        className="h-full w-full overflow-hidden rounded-lg border border-zinc-800"
+        style={{ minHeight: '400px' }}
+      />
+    </div>
   );
 }

package/_standalone/components/MarkdownView.tsx

@@ -9,6 +9,7 @@ import { useState, useCallback } from 'react';
 import { Copy, Check, X } from 'lucide-react';
 import { copyToClipboard } from '@/lib/clipboard';
 import { toast } from '@/lib/toast';
+import { resolveImagePath } from '@/lib/image';
 import type { Components } from 'react-markdown';
 
 interface MarkdownViewProps {
@@ -118,8 +119,9 @@ const components: Components = {
   img({ src, alt, node, ...rest }) {
     void node;
     if (!src) return null;
+    const resolvedSrc = typeof src === 'string' ? resolveImagePath(src) : src;
     // eslint-disable-next-line @next/next/no-img-element
-    return <img src={src} alt={alt ?? ''} {...stripNonDom(rest)} />;
+    return <img src={resolvedSrc} alt={alt ?? ''} {...stripNonDom(rest)} />;
   },
 };
 

package/_standalone/components/WysiwygEditor.tsx

@@ -7,11 +7,27 @@ import Placeholder from '@tiptap/extension-placeholder';
 import TaskList from '@tiptap/extension-task-list';
 import TaskItem from '@tiptap/extension-task-item';
 import Link from '@tiptap/extension-link';
+import Image from '@tiptap/extension-image';
 import { Table } from '@tiptap/extension-table';
 import { TableRow } from '@tiptap/extension-table';
 import { TableCell } from '@tiptap/extension-table';
 import { TableHeader } from '@tiptap/extension-table';
 import { Markdown } from 'tiptap-markdown';
+import { useEditorImageUpload } from '@/hooks/useEditorImageUpload';
+import { resolveImagePath } from '@/lib/image';
+import { toast } from '@/lib/toast';
+
+/**
+ * Custom Image extension that resolves `/.media/` paths to API URLs in the DOM,
+ * while keeping the raw path in the markdown serialization.
+ */
+const ResolvedImage = Image.extend({
+  renderHTML({ HTMLAttributes }) {
+    const src = HTMLAttributes.src;
+    const resolvedSrc = typeof src === 'string' ? resolveImagePath(src) : src;
+    return ['img', { ...HTMLAttributes, src: resolvedSrc }];
+  },
+});
 
 interface WysiwygEditorProps {
   value: string;
@@ -22,6 +38,10 @@ export default function WysiwygEditor({ value, onChange }: WysiwygEditorProps) {
   const onChangeRef = useRef(onChange);
   onChangeRef.current = onChange;
 
+  const { uploadToMedia, isUploading } = useEditorImageUpload();
+  const uploadRef = useRef(uploadToMedia);
+  uploadRef.current = uploadToMedia;
+
   const editor = useEditor({
     extensions: [
       StarterKit.configure({
@@ -36,6 +56,9 @@ export default function WysiwygEditor({ value, onChange }: WysiwygEditorProps) {
       TaskList,
       TaskItem.configure({ nested: true }),
       Link.configure({ openOnClick: false, autolink: true }),
+      ResolvedImage.configure({
+        HTMLAttributes: { class: 'rounded-md max-w-full' },
+      }),
       Table.configure({ resizable: false }),
       TableRow,
       TableHeader,
@@ -55,6 +78,65 @@ export default function WysiwygEditor({ value, onChange }: WysiwygEditorProps) {
     immediatelyRender: false,
   });
 
+  // Set up drag/drop and paste handlers on editor mount
+  useEffect(() => {
+    if (!editor) return;
+
+    const editorDom = editor.view.dom;
+
+    const handleImageInsert = async (files: File[]) => {
+      if (!editor) return;
+      try {
+        const uploadedPaths = await uploadRef.current(files);
+        for (const p of uploadedPaths) {
+          editor.chain().focus().setImage({ src: p }).run();
+        }
+        toast.success('Images inserted');
+      } catch (err) {
+        toast.error('Failed to insert images');
+        console.error(err);
+      }
+    };
+
+    const handleDrop = (e: DragEvent) => {
+      const files = Array.from(e.dataTransfer?.files ?? []).filter((f) =>
+        f.type.startsWith('image/'),
+      );
+      if (files.length > 0) {
+        e.preventDefault();
+        e.stopPropagation();
+        handleImageInsert(files);
+      }
+    };
+
+    const handlePaste = (e: ClipboardEvent) => {
+      const items = e.clipboardData?.items;
+      if (!items) return;
+
+      const files: File[] = [];
+      for (let i = 0; i < items.length; i++) {
+        const item = items[i];
+        if (item.kind === 'file' && item.type.startsWith('image/')) {
+          const file = item.getAsFile();
+          if (file) files.push(file);
+        }
+      }
+
+      if (files.length > 0) {
+        e.preventDefault();
+        handleImageInsert(files);
+      }
+    };
+
+    editorDom.addEventListener('drop', handleDrop as EventListener);
+    editorDom.addEventListener('paste', handlePaste as EventListener);
+
+    return () => {
+      editorDom.removeEventListener('drop', handleDrop as EventListener);
+      editorDom.removeEventListener('paste', handlePaste as EventListener);
+    };
+  }, [editor]);
+
   // Sync external value changes (e.g. cancel → revert) without full re-mount
   const lastMd = useRef(value);
   useEffect(() => {
@@ -69,6 +151,14 @@ export default function WysiwygEditor({ value, onChange }: WysiwygEditorProps) {
 
   return (
     <div className="wysiwyg-wrapper h-full overflow-y-auto px-8 py-6">
+      {isUploading && (
+        <div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50">
+          <div className="bg-card border border-border rounded-lg px-6 py-4 text-center shadow-lg">
+            <div className="animate-spin inline-block w-5 h-5 border-2 border-primary border-t-transparent rounded-full" />
+            <p className="mt-2 text-sm text-muted-foreground">Uploading images...</p>
+          </div>
+        </div>
+      )}
       <EditorContent editor={editor} />
     </div>
   );