@geminilight/mindos 0.5.26 → 0.5.27

package/app/app/api/mcp/status/route.ts

@@ -1,20 +1,37 @@
 export const dynamic = 'force-dynamic';
-import { NextResponse } from 'next/server';
+import { NextRequest, NextResponse } from 'next/server';
 import { readSettings } from '@/lib/settings';
+import { maskToken } from '@/lib/format';
 
-export async function GET() {
+/** Parse hostname from Host header, handling IPv6 brackets */
+function parseHostname(host: string): string {
+  // IPv6: [::1]:3003 → [::1]
+  if (host.includes(']')) {
+    return host.slice(0, host.lastIndexOf(']') + 1);
+  }
+  // IPv4/hostname: 192.168.1.1:3003 → 192.168.1.1
+  const colonIdx = host.lastIndexOf(':');
+  return colonIdx > 0 ? host.slice(0, colonIdx) : host;
+}
+
+export async function GET(req: NextRequest) {
   try {
     const settings = readSettings();
     const port = settings.mcpPort ?? 8781;
-    const baseUrl = `http://127.0.0.1:${port}`;
-    const endpoint = `${baseUrl}/mcp`;
-    const authConfigured = !!settings.authToken;
+    const token = settings.authToken ?? '';
+    const authConfigured = !!token;
+
+    // Derive endpoint from the request's host so remote users see the correct IP/hostname
+    const reqHost = req.headers.get('host') ?? `127.0.0.1:${port}`;
+    const hostname = parseHostname(reqHost);
+    const endpoint = `http://${hostname}:${port}/mcp`;
+
+    // Health check always goes to localhost (server-to-self)
+    const healthUrl = `http://127.0.0.1:${port}/api/health`;
 
     let running = false;
 
     try {
-      // Use the health endpoint — avoids MCP handshake complexity
-      const healthUrl = `${baseUrl}/api/health`;
       const controller = new AbortController();
       const timeout = setTimeout(() => controller.abort(), 2000);
       const res = await fetch(healthUrl, { signal: controller.signal, cache: 'no-store' });
@@ -35,6 +52,12 @@ export async function GET() {
       port,
       toolCount: running ? 20 : 0,
       authConfigured,
+      // Masked for display; full token only used server-side in snippet generation
+      maskedToken: authConfigured ? maskToken(token) : undefined,
+      // Full token for config snippet copy — this API is protected by proxy.ts middleware
+      // (same-origin or bearer token required). Consistent with /api/settings which also
+      // exposes the token to authenticated users.
+      authToken: authConfigured ? token : undefined,
     });
   } catch (err) {
     return NextResponse.json({ error: String(err) }, { status: 500 });

package/app/components/MarkdownView.tsx

@@ -7,6 +7,7 @@ import rehypeRaw from 'rehype-raw';
 import rehypeSlug from 'rehype-slug';
 import { useState, useCallback } from 'react';
 import { Copy, Check } from 'lucide-react';
+import { copyToClipboard } from '@/lib/clipboard';
 import type { Components } from 'react-markdown';
 
 interface MarkdownViewProps {
@@ -16,9 +17,11 @@ interface MarkdownViewProps {
 function CopyButton({ code }: { code: string }) {
   const [copied, setCopied] = useState(false);
   const handleCopy = useCallback(() => {
-    navigator.clipboard.writeText(code).then(() => {
-      setCopied(true);
-      setTimeout(() => setCopied(false), 2000);
+    copyToClipboard(code).then((ok) => {
+      if (ok) {
+        setCopied(true);
+        setTimeout(() => setCopied(false), 2000);
+      }
     });
   }, [code]);
 

package/app/components/settings/KnowledgeTab.tsx

@@ -5,6 +5,7 @@ import { Copy, Check, RefreshCw, Trash2, Sparkles, ChevronDown, ChevronRight, Lo
 import type { KnowledgeTabProps } from './types';
 import { Field, Input, EnvBadge, SectionLabel, Toggle } from './Primitives';
 import { apiFetch } from '@/lib/api';
+import { copyToClipboard } from '@/lib/clipboard';
 import { formatBytes, formatUptime } from '@/lib/format';
 
 export function KnowledgeTab({ data, setData, t }: KnowledgeTabProps) {
@@ -85,9 +86,11 @@ export function KnowledgeTab({ data, setData, t }: KnowledgeTabProps) {
   function handleCopy() {
     const text = revealedToken ?? data.authToken ?? '';
     if (!text) return;
-    navigator.clipboard.writeText(text).then(() => {
-      setCopied(true);
-      setTimeout(() => setCopied(false), 2000);
+    copyToClipboard(text).then((ok) => {
+      if (ok) {
+        setCopied(true);
+        setTimeout(() => setCopied(false), 2000);
+      }
     });
   }
 

package/app/components/settings/McpServerStatus.tsx

@@ -1,24 +1,26 @@
 'use client';
 
-import { useState, useEffect, useMemo } from 'react';
-import { Plug, Copy, Check, ChevronDown } from 'lucide-react';
+import { useState, useEffect, useMemo, useCallback } from 'react';
+import { Plug, Copy, Check, ChevronDown, Monitor, Globe, Code } from 'lucide-react';
+import { copyToClipboard } from '@/lib/clipboard';
 import type { McpStatus, AgentInfo, McpServerStatusProps } from './types';
 
 /* ── Helpers ───────────────────────────────────────────────────── */
 
 function CopyButton({ text, label, copiedLabel }: { text: string; label: string; copiedLabel?: string }) {
   const [copied, setCopied] = useState(false);
-  const handleCopy = async () => {
-    try {
-      await navigator.clipboard.writeText(text);
+  const handleCopy = useCallback(async () => {
+    const ok = await copyToClipboard(text);
+    if (ok) {
       setCopied(true);
       setTimeout(() => setCopied(false), 2000);
-    } catch { /* clipboard unavailable */ }
-  };
+    }
+  }, [text]);
   return (
     <button
+      type="button"
       onClick={handleCopy}
-      className="flex items-center gap-1 px-2.5 py-1 text-xs rounded-md border border-border text-muted-foreground hover:text-foreground hover:bg-muted transition-colors"
+      className="inline-flex items-center gap-1 px-2.5 py-1 text-xs rounded-md border border-border text-muted-foreground hover:text-foreground hover:bg-muted transition-colors cursor-pointer shrink-0 relative z-10"
     >
       {copied ? <Check size={11} /> : <Copy size={11} />}
       {copied ? (copiedLabel ?? 'Copied!') : label}
@@ -28,60 +30,91 @@ function CopyButton({ text, label, copiedLabel }: { text: string; label: string;
 
 /* ── Config Snippet Generator ─────────────────────────────────── */
 
-function generateConfigSnippet(
-  agent: AgentInfo,
-  status: McpStatus,
-  token?: string,
-): { snippet: string; path: string } {
-  const isRunning = status.running;
+interface ConfigSnippet {
+  /** Snippet with full token — for clipboard copy */
+  snippet: string;
+  /** Snippet with masked token — for display in UI */
+  displaySnippet: string;
+  path: string;
+}
 
-  // Determine entry (stdio vs http)
+function generateStdioSnippet(agent: AgentInfo): ConfigSnippet {
   const stdioEntry: Record<string, unknown> = { type: 'stdio', command: 'mindos', args: ['mcp'] };
-  const httpEntry: Record<string, unknown> = { url: status.endpoint };
-  if (token) httpEntry.headers = { Authorization: `Bearer ${token}` };
-  const entry = isRunning ? httpEntry : stdioEntry;
 
-  // TOML format (Codex)
   if (agent.format === 'toml') {
-    const lines: string[] = [`[${agent.configKey}.mindos]`];
-    if (isRunning) {
-      lines.push(`type = "http"`);
-      lines.push(`url = "${status.endpoint}"`);
-      if (token) {
+    const lines = [
+      `[${agent.configKey}.mindos]`,
+      `command = "mindos"`,
+      `args = ["mcp"]`,
+      '',
+      `[${agent.configKey}.mindos.env]`,
+      `MCP_TRANSPORT = "stdio"`,
+    ];
+    const s = lines.join('\n');
+    return { snippet: s, displaySnippet: s, path: agent.globalPath };
+  }
+
+  if (agent.globalNestedKey) {
+    const s = JSON.stringify({ [agent.configKey]: { mindos: stdioEntry } }, null, 2);
+    return { snippet: s, displaySnippet: s, path: agent.projectPath ?? agent.globalPath };
+  }
+
+  const s = JSON.stringify({ [agent.configKey]: { mindos: stdioEntry } }, null, 2);
+  return { snippet: s, displaySnippet: s, path: agent.globalPath };
+}
+
+function generateHttpSnippet(
+  agent: AgentInfo,
+  endpoint: string,
+  token?: string,
+  maskedToken?: string,
+): ConfigSnippet {
+  // Full token for copy
+  const httpEntry: Record<string, unknown> = { url: endpoint };
+  if (token) httpEntry.headers = { Authorization: `Bearer ${token}` };
+
+  // Masked token for display
+  const displayEntry: Record<string, unknown> = { url: endpoint };
+  if (maskedToken) displayEntry.headers = { Authorization: `Bearer ${maskedToken}` };
+
+  const buildSnippet = (entry: Record<string, unknown>) => {
+    if (agent.format === 'toml') {
+      const lines = [
+        `[${agent.configKey}.mindos]`,
+        `type = "http"`,
+        `url = "${endpoint}"`,
+      ];
+      const authVal = (entry.headers as Record<string, string>)?.Authorization;
+      if (authVal) {
         lines.push('');
         lines.push(`[${agent.configKey}.mindos.headers]`);
-        lines.push(`Authorization = "Bearer ${token}"`);
+        lines.push(`Authorization = "${authVal}"`);
       }
-    } else {
-      lines.push(`command = "mindos"`);
-      lines.push(`args = ["mcp"]`);
-      lines.push('');
-      lines.push(`[${agent.configKey}.mindos.env]`);
-      lines.push(`MCP_TRANSPORT = "stdio"`);
+      return lines.join('\n');
     }
-    return { snippet: lines.join('\n'), path: agent.globalPath };
-  }
 
-  // JSON with globalNestedKey (VS Code project-level uses flat key)
-  if (agent.globalNestedKey) {
-    // project-level: flat key structure
-    const projectSnippet = JSON.stringify({ [agent.configKey]: { mindos: entry } }, null, 2);
-    return { snippet: projectSnippet, path: agent.projectPath ?? agent.globalPath };
-  }
+    if (agent.globalNestedKey) {
+      return JSON.stringify({ [agent.configKey]: { mindos: entry } }, null, 2);
+    }
 
-  // Standard JSON
-  const snippet = JSON.stringify({ [agent.configKey]: { mindos: entry } }, null, 2);
-  return { snippet, path: agent.globalPath };
+    return JSON.stringify({ [agent.configKey]: { mindos: entry } }, null, 2);
+  };
+
+  return {
+    snippet: buildSnippet(httpEntry),
+    displaySnippet: buildSnippet(token ? displayEntry : httpEntry),
+    path: agent.format === 'toml' ? agent.globalPath : (agent.globalNestedKey ? (agent.projectPath ?? agent.globalPath) : agent.globalPath),
+  };
 }
 
 /* ── MCP Server Status ─────────────────────────────────────────── */
 
 export default function ServerStatus({ status, agents, t }: McpServerStatusProps) {
   const m = t.settings?.mcp;
-  const [expanded, setExpanded] = useState(false);
   const [selectedAgent, setSelectedAgent] = useState<string>('');
+  const [mode, setMode] = useState<'stdio' | 'http'>('stdio');
+  const [showSnippet, setShowSnippet] = useState(false);
 
-  // Auto-select first installed or first detected agent
   useEffect(() => {
     if (agents.length > 0 && !selectedAgent) {
       const first = agents.find(a => a.installed) ?? agents.find(a => a.present) ?? agents[0];
@@ -89,84 +122,147 @@ export default function ServerStatus({ status, agents, t }: McpServerStatusProps
     }
   }, [agents, selectedAgent]);
 
+  useEffect(() => {
+    if (status?.endpoint && !status.endpoint.includes('127.0.0.1') && !status.endpoint.includes('localhost')) {
+      setMode('http');
+    }
+  }, [status?.endpoint]);
+
   if (!status) return null;
 
   const currentAgent = agents.find(a => a.key === selectedAgent);
-  // 🟡 MINOR #9: Memoize snippet generation to avoid recomputing on every render
-  const snippetResult = useMemo(() => currentAgent ? generateConfigSnippet(currentAgent, status) : null, [currentAgent, status]);
+
+  const snippetResult = useMemo(() => {
+    if (!currentAgent) return null;
+    if (mode === 'stdio') return generateStdioSnippet(currentAgent);
+    return generateHttpSnippet(currentAgent, status.endpoint, status.authToken, status.maskedToken);
+  }, [currentAgent, status, mode]);
+
+  const isRemote = status.endpoint && !status.endpoint.includes('127.0.0.1') && !status.endpoint.includes('localhost');
 
   return (
     <div>
-      {/* Summary line — always visible */}
-      <button
-        type="button"
-        onClick={() => setExpanded(!expanded)}
-        className="w-full flex items-center gap-2.5 text-xs"
-      >
-        <Plug size={14} className="text-muted-foreground shrink-0" />
-        <span className={`inline-block w-1.5 h-1.5 rounded-full shrink-0 ${status.running ? 'bg-success' : 'bg-muted-foreground'}`} />
-        <span className="text-foreground font-medium">
-          {status.running ? (m?.running ?? 'Running') : (m?.stopped ?? 'Stopped')}
-        </span>
-        {status.running && (
-          <>
-            <span className="text-muted-foreground">·</span>
-            <span className="font-mono text-muted-foreground">{status.transport.toUpperCase()}</span>
-            <span className="text-muted-foreground">·</span>
-            <span className="text-muted-foreground">{m?.toolsRegistered ? m.toolsRegistered(status.toolCount) : `${status.toolCount} tools`}</span>
-            <span className="text-muted-foreground">·</span>
-            <span className={status.authConfigured ? 'text-success' : 'text-muted-foreground'}>
-              {status.authConfigured ? (m?.authSet ?? 'Token set') : (m?.authNotSet ?? 'No token')}
-            </span>
-          </>
-        )}
-        <ChevronDown size={12} className={`ml-auto text-muted-foreground transition-transform shrink-0 ${expanded ? 'rotate-180' : ''}`} />
-      </button>
-
-      {/* Expanded details */}
-      {expanded && (
-        <div className="pt-3 mt-3 border-t border-border space-y-3">
-          {/* Endpoint + copy */}
-          <div className="flex items-center gap-2 text-xs">
-            <span className="text-muted-foreground shrink-0">{m?.endpoint ?? 'Endpoint'}</span>
-            <span className="font-mono text-foreground truncate">{status.endpoint}</span>
-            <CopyButton text={status.endpoint} label={m?.copyEndpoint ?? 'Copy'} copiedLabel={m?.copied} />
-          </div>
+      <h3 className="text-sm font-medium text-foreground mb-3">{m?.serverTitle ?? 'MCP Server'}</h3>
+
+      <div className="rounded-xl border p-4 space-y-3" style={{ borderColor: 'var(--border)', background: 'var(--card)' }}>
+        {/* Status line */}
+        <div className="flex items-center gap-2.5 text-xs">
+          <Plug size={14} className="text-muted-foreground shrink-0" />
+          <span className={`inline-block w-1.5 h-1.5 rounded-full shrink-0 ${status.running ? 'bg-success' : 'bg-muted-foreground'}`} />
+          <span className="text-foreground font-medium">
+            {status.running ? (m?.running ?? 'Running') : (m?.stopped ?? 'Stopped')}
+          </span>
+          {status.running && (
+            <>
+              <span className="text-muted-foreground">·</span>
+              <span className="font-mono text-muted-foreground">{status.transport.toUpperCase()}</span>
+              <span className="text-muted-foreground">·</span>
+              <span className="text-muted-foreground">{m?.toolsRegistered ? m.toolsRegistered(status.toolCount) : `${status.toolCount} tools`}</span>
+              <span className="text-muted-foreground">·</span>
+              <span className={status.authConfigured ? 'text-success' : 'text-muted-foreground'}>
+                {status.authConfigured ? (m?.authSet ?? 'Token set') : (m?.authNotSet ?? 'No token')}
+              </span>
+            </>
+          )}
+        </div>
+
+        {/* Endpoint + copy */}
+        <div className="flex items-center gap-2 text-xs">
+          <span className="text-muted-foreground shrink-0">{m?.endpoint ?? 'Endpoint'}</span>
+          <span className="font-mono text-foreground truncate">{status.endpoint}</span>
+          <CopyButton text={status.endpoint} label={m?.copyEndpoint ?? 'Copy'} copiedLabel={m?.copied} />
+        </div>
+
+        {/* Quick Setup */}
+        {agents.length > 0 && (
+          <div className="pt-2 border-t border-border space-y-2.5">
+            {/* Agent selector + transport mode toggle */}
+            <div className="flex items-center gap-2 text-xs flex-wrap">
+              <span className="text-muted-foreground shrink-0">{m?.configureFor ?? 'Configure for'}</span>
+              <select
+                value={selectedAgent}
+                onChange={e => setSelectedAgent(e.target.value)}
+                className="text-xs px-2 py-1 rounded-md border border-border bg-background text-foreground outline-none focus-visible:ring-1 focus-visible:ring-ring"
+              >
+                {agents.map(a => (
+                  <option key={a.key} value={a.key}>
+                    {a.name}{a.installed ? ' ✓' : a.present ? ' ·' : ''}
+                  </option>
+                ))}
+              </select>
 
-          {/* Quick Setup */}
-          {agents.length > 0 && (
-            <div className="space-y-2.5">
-              <div className="flex items-center gap-2 text-xs">
-                <span className="text-muted-foreground shrink-0">{m?.configureFor ?? 'Configure for'}</span>
-                <select
-                  value={selectedAgent}
-                  onChange={e => setSelectedAgent(e.target.value)}
-                  className="text-xs px-2 py-1 rounded-md border border-border bg-background text-foreground outline-none focus-visible:ring-1 focus-visible:ring-ring"
+              <div className="flex items-center rounded-md border border-border overflow-hidden ml-auto">
+                <button
+                  type="button"
+                  onClick={() => setMode('stdio')}
+                  className={`flex items-center gap-1 px-2 py-1 text-xs transition-colors ${
+                    mode === 'stdio'
+                      ? 'bg-muted text-foreground font-medium'
+                      : 'text-muted-foreground hover:text-foreground'
+                  }`}
+                  title={m?.transportLocalHint ?? 'Local — same machine as MindOS server'}
                 >
-                  {agents.map(a => (
-                    <option key={a.key} value={a.key}>
-                      {a.name}{a.installed ? ' ✓' : a.present ? ' ·' : ''}
-                    </option>
-                  ))}
-                </select>
+                  <Monitor size={11} />
+                  {m?.transportLocal ?? 'Local'}
+                </button>
+                <button
+                  type="button"
+                  onClick={() => setMode('http')}
+                  className={`flex items-center gap-1 px-2 py-1 text-xs transition-colors ${
+                    mode === 'http'
+                      ? 'bg-muted text-foreground font-medium'
+                      : 'text-muted-foreground hover:text-foreground'
+                  }`}
+                  title={m?.transportRemoteHint ?? 'Remote — connect from another device via HTTP'}
+                >
+                  <Globe size={11} />
+                  {m?.transportRemote ?? 'Remote'}
+                </button>
               </div>
+            </div>
 
-              {snippetResult && (
-                <>
-                  <div className="flex items-center gap-2 text-xs">
-                    <span className="text-muted-foreground shrink-0">{m?.configPath ?? 'Config path'}</span>
-                    <span className="font-mono text-foreground text-2xs">{snippetResult.path}</span>
-                  </div>
-                  <pre className="text-xs font-mono bg-muted/50 border border-border rounded-lg p-3 overflow-x-auto whitespace-pre">
-                    {snippetResult.snippet}
-                  </pre>
+            {/* Hint for remote mode */}
+            {mode === 'http' && (
+              <p className="text-[11px] text-muted-foreground leading-relaxed">
+                {isRemote
+                  ? (m?.remoteDetectedHint ?? 'Uses your current remote IP. Ensure the MCP port is accessible from the target device.')
+                  : (m?.remoteManualHint ?? 'Tip: access MindOS from a remote device to auto-detect the correct IP, or replace 127.0.0.1 with your server\'s LAN IP.')}
+                {!status.authConfigured && (
+                  <span className="text-amber-500 ml-1">{m?.noAuthWarning ?? '⚠ No auth token set — configure one in Settings → General for secure remote access.'}</span>
+                )}
+              </p>
+            )}
+
+            {/* Copy config + show JSON toggle */}
+            {snippetResult && (
+              <div className="space-y-2">
+                <div className="flex items-center gap-2 text-xs flex-wrap">
+                  {/* Copy button uses full token (snippetResult.snippet) */}
                   <CopyButton text={snippetResult.snippet} label={m?.copyConfig ?? 'Copy Config'} copiedLabel={m?.copied} />
-                </>
-              )}
-            </div>
-          )}
-        </div>
-      )}
+                  <span className="text-muted-foreground">→</span>
+                  <span className="font-mono text-muted-foreground text-[11px] truncate">{snippetResult.path}</span>
+                  <button
+                    type="button"
+                    onClick={() => setShowSnippet(!showSnippet)}
+                    className="inline-flex items-center gap-1 px-1.5 py-0.5 text-[11px] text-muted-foreground hover:text-foreground transition-colors ml-auto"
+                  >
+                    <Code size={10} />
+                    {showSnippet ? (m?.hideJson ?? 'Hide JSON') : (m?.showJson ?? 'Show JSON')}
+                    <ChevronDown size={10} className={`transition-transform ${showSnippet ? 'rotate-180' : ''}`} />
+                  </button>
+                </div>
+
+                {/* Display snippet uses masked token */}
+                {showSnippet && (
+                  <pre className="text-xs font-mono bg-muted/50 border border-border rounded-lg p-3 overflow-x-auto whitespace-pre select-all">
+                    {snippetResult.displaySnippet}
+                  </pre>
+                )}
+              </div>
+            )}
+          </div>
+        )}
+      </div>
     </div>
   );
 }

package/app/components/settings/McpTab.tsx

@@ -42,10 +42,8 @@ export function McpTab({ t }: McpTabProps) {
 
   return (
     <div className="space-y-6">
-      {/* MCP Server Status — compact card */}
-      <div className="rounded-xl border p-4" style={{ borderColor: 'var(--border)', background: 'var(--card)' }}>
-        <ServerStatus status={mcpStatus} agents={agents} t={t} />
-      </div>
+      {/* MCP Server Status */}
+      <ServerStatus status={mcpStatus} agents={agents} t={t} />
 
       {/* Skills */}
       <div>

package/app/components/settings/types.ts

@@ -58,6 +58,8 @@ export interface McpStatus {
   port: number;
   toolCount: number;
   authConfigured: boolean;
+  maskedToken?: string;
+  authToken?: string;
 }
 
 export interface AgentInfo {

package/app/components/setup/index.tsx

@@ -3,6 +3,7 @@
 import { useState, useEffect, useCallback } from 'react';
 import { Sparkles, Loader2, ChevronLeft, ChevronRight } from 'lucide-react';
 import { useLocale } from '@/lib/LocaleContext';
+import { copyToClipboard } from '@/lib/clipboard';
 import type { SetupState, PortStatus, AgentEntry, AgentInstallStatus } from './types';
 import { TOTAL_STEPS, STEP_KB, STEP_PORTS, STEP_AGENTS } from './constants';
 import StepKB from './StepKB';
@@ -229,7 +230,7 @@ export default function SetupWizard() {
   }, []);
 
   const copyToken = useCallback(() => {
-    navigator.clipboard.writeText(state.authToken).catch(() => { /* clipboard unavailable in insecure context */ });
+    copyToClipboard(state.authToken).catch(() => {});
     setTokenCopied(true);
     setTimeout(() => setTokenCopied(false), 2000);
   }, [state.authToken]);

package/app/lib/clipboard.ts

@@ -0,0 +1,29 @@
+/**
+ * Copy text to clipboard with fallback for non-HTTPS environments.
+ * Returns true if successful.
+ */
+export async function copyToClipboard(text: string): Promise<boolean> {
+  // Modern Clipboard API (requires HTTPS or localhost)
+  if (navigator.clipboard?.writeText) {
+    try {
+      await navigator.clipboard.writeText(text);
+      return true;
+    } catch { /* falls through to fallback */ }
+  }
+  // Fallback: textarea + execCommand (works over HTTP).
+  // execCommand('copy') is deprecated but remains the only option for
+  // non-secure contexts. No replacement exists yet — monitor browser support.
+  try {
+    const textarea = document.createElement('textarea');
+    textarea.value = text;
+    textarea.style.position = 'fixed';
+    textarea.style.opacity = '0';
+    document.body.appendChild(textarea);
+    textarea.select();
+    const ok = document.execCommand('copy');
+    document.body.removeChild(textarea);
+    return ok;
+  } catch {
+    return false;
+  }
+}

package/app/lib/format.ts

@@ -17,3 +17,9 @@ export function formatUptime(ms: number): string {
   const d = Math.floor(h / 24);
   return `${d}d ${h % 24}h`;
 }
+
+/** Mask a token for display: show first 4 and last 4 chars, middle replaced with bullets */
+export function maskToken(token: string): string {
+  if (token.length <= 12) return '••••';
+  return `${token.slice(0, 4)}••••${token.slice(-4)}`;
+}

package/app/lib/i18n-en.ts

@@ -261,6 +261,15 @@ export const en = {
       quickSetup: 'Quick Setup',
       configureFor: 'Configure for',
       configPath: 'Config path',
+      transportLocal: 'Local',
+      transportRemote: 'Remote',
+      transportLocalHint: 'Local — same machine as MindOS server',
+      transportRemoteHint: 'Remote — connect from another device via HTTP',
+      remoteDetectedHint: 'Uses your current remote IP. Ensure the MCP port is accessible from the target device.',
+      remoteManualHint: 'Tip: access MindOS from a remote device to auto-detect the correct IP, or replace 127.0.0.1 with your server\'s LAN IP.',
+      noAuthWarning: '⚠ No auth token set — configure one in Settings → General for secure remote access.',
+      showJson: 'Show JSON',
+      hideJson: 'Hide JSON',
     },
     monitoring: {
       system: 'System',

package/app/lib/i18n-zh.ts

@@ -286,6 +286,15 @@ export const zh = {
       quickSetup: '快速配置',
       configureFor: '配置目标',
       configPath: '配置路径',
+      transportLocal: '本地',
+      transportRemote: '远程',
+      transportLocalHint: '本地 — 与 MindOS 服务在同一台机器上',
+      transportRemoteHint: '远程 — 从其他设备通过 HTTP 连接',
+      remoteDetectedHint: '使用当前远程 IP。请确保目标设备可以访问 MCP 端口。',
+      remoteManualHint: '提示：从远程设备访问 MindOS 可自动检测正确 IP，或手动将 127.0.0.1 替换为服务器的局域网 IP。',
+      noAuthWarning: '⚠ 未设置认证令牌 — 请在 设置 → 通用 中配置，以确保远程访问安全。',
+      showJson: '显示 JSON',
+      hideJson: '隐藏 JSON',
     },
     monitoring: {
       system: '系统',

package/app/next-env.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-import "./.next/types/routes.d.ts";
+import "./.next/dev/types/routes.d.ts";
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@geminilight/mindos",
-  "version": "0.5.26",
+  "version": "0.5.27",
   "description": "MindOS — Human-Agent Collaborative Mind System. Local-first knowledge base that syncs your mind to all AI Agents via MCP.",
   "keywords": [
     "mindos",

package/scripts/release.sh

@@ -18,6 +18,67 @@ echo "🧪 Running tests..."
 npm test
 echo ""
 
+# 3. Smoke test: pack → install in temp dir → verify CLI works
+echo "🔍 Smoke testing package..."
+SMOKE_DIR=$(mktemp -d)
+TARBALL=$(npm pack --pack-destination "$SMOKE_DIR" 2>/dev/null | tail -1)
+TARBALL_PATH="$SMOKE_DIR/$TARBALL"
+
+if [ ! -f "$TARBALL_PATH" ]; then
+  echo "❌ npm pack failed — tarball not found"
+  rm -rf "$SMOKE_DIR"
+  exit 1
+fi
+
+TARBALL_SIZE=$(du -sh "$TARBALL_PATH" | cut -f1)
+echo "   📦 Tarball: $TARBALL ($TARBALL_SIZE)"
+
+# Install from tarball in isolation (production deps only)
+cd "$SMOKE_DIR"
+npm init -y --silent >/dev/null 2>&1
+npm install "$TARBALL_PATH" --ignore-scripts >/dev/null 2>&1
+
+# Verify bin entry exists and is executable
+if [ ! -f "$SMOKE_DIR/node_modules/.bin/mindos" ]; then
+  echo "❌ 'mindos' binary not found after install"
+  rm -rf "$SMOKE_DIR"
+  exit 1
+fi
+
+# Verify --version works
+INSTALLED_VERSION=$("$SMOKE_DIR/node_modules/.bin/mindos" --version 2>&1 || true)
+if [ -z "$INSTALLED_VERSION" ]; then
+  echo "❌ 'mindos --version' returned empty"
+  rm -rf "$SMOKE_DIR"
+  exit 1
+fi
+echo "   ✅ mindos --version → $INSTALLED_VERSION"
+
+# Verify --help works (exits 0, produces output)
+HELP_OUTPUT=$("$SMOKE_DIR/node_modules/.bin/mindos" --help 2>&1 || true)
+if ! echo "$HELP_OUTPUT" | grep -qi "mindos"; then
+  echo "❌ 'mindos --help' did not produce expected output"
+  rm -rf "$SMOKE_DIR"
+  exit 1
+fi
+echo "   ✅ mindos --help works"
+
+# Verify key files are present in the installed package
+for f in bin/cli.js app/package.json app/next.config.ts skills/mindos/SKILL.md; do
+  if [ ! -f "$SMOKE_DIR/node_modules/@geminilight/mindos/$f" ]; then
+    echo "❌ Missing file in package: $f"
+    rm -rf "$SMOKE_DIR"
+    exit 1
+  fi
+done
+echo "   ✅ Key files present"
+
+# Cleanup
+rm -rf "$SMOKE_DIR"
+cd - >/dev/null
+echo "   🟢 Smoke test passed"
+echo ""
+
 # 3. Bump version (creates commit + tag automatically)
 echo "📦 Bumping version ($BUMP)..."
 npm version "$BUMP" -m "%s"