@danieltmn/tamnora 0.24.1 → 0.25.0

package/harness/packages/server/public/commands.js

@@ -1,403 +1,448 @@
-import {
-  INIT_PROMPT,
-  activePane,
-  addCompactCard,
-  addMessage,
-  basename,
-  chatInput,
-  finishCompactCard,
-  refreshSessions,
-  scrollMessages,
-  sendMessage,
-} from './chat.js';
-import {
-  activateTab,
-  createSessionIn,
-  cycleTheme,
-  openAppearance,
-  openFolderPicker,
-  openSettingsModal,
-  setSidebarOpen,
-  toggleMode,
-} from './chrome.js';
-import { $, api, clear, el, state } from './core.js';
-import { setExplorerOpen } from './explorer.js';
-import { renderMarkdown } from './markdown.js';
-import { openTab, syncInterruptBtn } from './sessions.js';
-import { reproducirVoz } from './voice.js';
-
-/* --- command palette (Ctrl/Cmd+K) ----------------------------------------- */
-
-export const PALETTE_COMMANDS = [
-  { id: 'new', label: 'Nueva sesión en otra carpeta', hint: '/new', run: () => openFolderPicker() },
-  { id: 'init', label: 'Analizar el proyecto y crear AGENTS.md', hint: '/init', run: () => runSlash('init') },
-  { id: 'resumen', label: 'Resumir la conversación', hint: '/resumen', run: () => runSlash('resumen') },
-  { id: 'audioresumen', label: 'Resumen como audio', hint: '/audioresumen', run: () => runSlash('audioresumen') },
-  { id: 'compact', label: 'Compactar la conversación', hint: '/compact', run: () => runSlash('compact') },
-  { id: 'clear', label: 'Limpiar la conversación', hint: '/clear', run: () => runSlash('clear') },
-  { id: 'mode', label: 'Cambiar Plan / Build', hint: 'Ctrl+.', run: () => toggleMode() },
-  { id: 'settings', label: 'Ajustes del agente (modelo, modo, auto)', run: () => openSettingsModal() },
-  { id: 'providers', label: 'Gestionar proveedores', run: () => activateTab('providers') },
-  { id: 'ajustes', label: 'MCP y Skills (ajustes)', run: () => activateTab('ajustes') },
-  { id: 'explorer', label: 'Mostrar u ocultar archivos', run: () => setExplorerOpen(!state.explorerOpen) },
-  { id: 'sidebar', label: 'Mostrar u ocultar sesiones', run: () => setSidebarOpen(!state.sidebarOpen) },
-  { id: 'theme', label: 'Cambiar tema', run: () => cycleTheme() },
-  { id: 'apariencia', label: 'Apariencia (tema, tipografía, tamaño)', run: () => openAppearance() },
-];
-
-export const palette = {
-  modal: $('#palette-modal'),
-  input: $('#palette-input'),
-  list: $('#palette-list'),
-  items: [],
-  index: 0,
-  timer: null,
-  results: { sessions: [], messages: [] },
-};
-
-export function runSlash(name) {
-  chatInput.value = `/${name}`;
-  sendMessage();
-}
-
-export function paletteItems(query) {
-  const q = query.trim().toLowerCase();
-  const items = PALETTE_COMMANDS.filter(
-    (c) => !q || c.label.toLowerCase().includes(q) || c.id.includes(q) || (c.hint ?? '').toLowerCase().includes(q)
-  ).map((c) => ({ label: c.label, hint: c.hint || 'comando', run: c.run }));
-
-  for (const session of palette.results.sessions) {
-    items.push({
-      label: session.title || '(sin título)',
-      hint: session.cwd ? basename(session.cwd) : 'sesión',
-      run: () => openTab(session.id),
-    });
-  }
-  for (const message of palette.results.messages) {
-    items.push({
-      label: message.snippet || '(mensaje)',
-      hint: `${message.role} · ${message.title || ''}`,
-      run: () => {
-        openTab(message.sessionId);
-        setTimeout(() => document.getElementById(message.id)?.scrollIntoView({ block: 'center' }), 450);
-      },
-    });
-  }
-  return items;
-}
-
-export function setPaletteIndex(index) {
-  const count = palette.items.length;
-  if (!count) {
-    palette.index = 0;
-    return;
-  }
-  palette.index = ((index % count) + count) % count;
-  [...palette.list.children].forEach((child, i) => child.classList.toggle('active', i === palette.index));
-  palette.list.children[palette.index]?.scrollIntoView({ block: 'nearest' });
-}
-
-export function renderPalette(query) {
-  palette.items = paletteItems(query);
-  palette.list.replaceChildren();
-  if (!palette.items.length) {
-    palette.list.appendChild(el('li', 'palette-empty', 'sin resultados'));
-    return;
-  }
-  palette.items.forEach((item, i) => {
-    const li = el('li', 'palette-item');
-    const main = el('div', 'palette-item-main');
-    main.appendChild(el('span', 'palette-item-label', item.label));
-    if (item.hint) main.appendChild(el('span', 'palette-item-hint', item.hint));
-    li.appendChild(main);
-    li.addEventListener('mousemove', () => setPaletteIndex(i));
-    li.addEventListener('click', () => runPaletteItem(item));
-    palette.list.appendChild(li);
-  });
-  setPaletteIndex(0);
-}
-
-export function runPaletteItem(item) {
-  palette.modal?.close();
-  setTimeout(() => item.run(), 0);
-}
-
-export function openPalette() {
-  if (!palette.modal) return;
-  palette.input.value = '';
-  palette.results = { sessions: [], messages: [] };
-  renderPalette('');
-  palette.modal.showModal();
-  palette.input.focus();
-}
-
-/* --- slash commands ------------------------------------------------------- */
-
-export const COMMANDS = [
-  ['/new', 'nueva sesión (elegís carpeta)'],
-  ['/init', 'analizar el proyecto y crear/actualizar AGENTS.md'],
-  ['/goal <texto>', 'fijar el objetivo de la sesión'],
-  ['/resumen', 'resumir la conversación (sin borrarla)'],
-  ['/audioresumen', 'el resumen como audio'],
-  ['/compact', 'resumir la conversación y liberar contexto'],
-  ['/clear', 'borrar los mensajes de esta sesión'],
-  ['/cwd', 'mostrar la carpeta de trabajo'],
-  ['/port <puerto>', 'ver si un puerto está activo (y qué PID lo usa)'],
-  ['/portkill <puerto>', 'matar el proceso que escucha en un puerto'],
-  ['/help', 'mostrar esta ayuda'],
-];
-
-export function notify(markdown, kind = 'notice') {
-  const message = addMessage('assistant', '');
-  // `kind` puede traer varias clases ("notice err"): classList.add no acepta
-  // espacios, asi que se agregan una por una.
-  for (const cls of String(kind).split(/\s+/).filter(Boolean)) message.textEl.classList.add(cls);
-  message.textEl.innerHTML = renderMarkdown(markdown);
-  scrollMessages();
-  return message;
-}
-
-/**
- * Aviso flotante para eventos de fondo (un permiso en otra pestana, un run que
- * arranco desde el celular).
- *
- * NO usar `notify` para esto: esa escribe un mensaje en la conversacion del pane
- * activo, asi que un permiso caido en otra pestana terminaba-chatrandeando en
- * el chat que estabas leyendo.
- */
-export function toast(text) {
-  const host = $('#toasts');
-  if (!host) return;
-  const item = el('div', 'toast', text);
-  host.appendChild(item);
-  const timer = setTimeout(() => item.remove(), 6000);
-  item.addEventListener('click', () => {
-    clearTimeout(timer);
-    item.remove();
-  });
-}
-
-export function needSession() {
-  notify('Abrí o creá una sesión primero (`/new`).', 'notice err');
-  return { handled: true };
-}
-
-export async function runCommand(name, arg) {
-  switch (name) {
-    case 'help':
-    case 'ayuda':
-      notify(`### Comandos\n${COMMANDS.map(([cmd, desc]) => `- \`${cmd}\` — ${desc}`).join('\n')}`);
-      return { handled: true };
-    case 'new':
-    case 'nueva': {
-      const cwd = state.sessionId ? state.cwd : '';
-      if (cwd) {
-        const created = await createSessionIn(cwd);
-        if (created?.error) notify(`No se pudo crear la sesión: ${created.error}`, 'notice err');
-      } else {
-        openFolderPicker();
-      }
-      return { handled: true };
-    }
-    case 'init':
-      return { handled: false, input: INIT_PROMPT };
-    case 'cwd': {
-      const cwd = $('#rail-cwd').textContent;
-      notify(`Carpeta de trabajo: \`${cwd}\``);
-      return { handled: true };
-    }
-    case 'portkill':
-    case 'kill': {
-      const port = Number(arg);
-      if (!Number.isInteger(port) || port < 1 || port > 65535) {
-        notify('Uso: `/portkill <puerto>`, por ejemplo `/portkill 3000`.', 'notice err');
-        return { handled: true };
-      }
-      const out = await api('/api/ports/kill', { method: 'POST', body: { port } }).catch((error) => ({
-        error: error.message,
-      }));
-      if (out.error) notify(`No se pudo matar el puerto ${port}: ${out.error}`, 'notice err');
-      else if (!out.pids.length) notify(`No hay ningún proceso escuchando en el puerto ${port}.`);
-      else if (out.killed.length) notify(`Puerto ${port}: maté el PID ${out.killed.join(', ')}.`);
-      else notify(`Puerto ${port}: no se pudo matar (PID ${out.errors.join(', ')}).`, 'notice err');
-      return { handled: true };
-    }
-    case 'port': {
-      const port = Number(arg);
-      if (!Number.isInteger(port) || port < 1 || port > 65535) {
-        notify('Uso: `/port <puerto>`, por ejemplo `/port 3000`.', 'notice err');
-        return { handled: true };
-      }
-      const out = await api(`/api/ports/${port}`).catch((error) => ({ error: error.message }));
-      if (out.error) notify(`No se pudo consultar el puerto ${port}: ${out.error}`, 'notice err');
-      else if (out.listening) notify(`Puerto ${port}: **activo** (PID ${out.pids.join(', ')}).`);
-      else notify(`Puerto ${port}: nada escuchando.`);
-      return { handled: true };
-    }
-    case 'clear':
-    case 'limpiar': {
-      if (!state.sessionId) return needSession();
-      await api(`/api/sessions/${state.sessionId}/messages`, { method: 'DELETE' }).catch(() => null);
-      clear(activePane);
-      activePane.appendChild(el('div', 'empty', 'Sesión vacía.'));
-      return { handled: true };
-    }
-    case 'goal': {
-      if (!state.sessionId) return needSession();
-      if (!arg) {
-        const data = await api(`/api/sessions/${state.sessionId}`).catch(() => null);
-        notify(data?.session?.goal ? `Objetivo actual: **${data.session.goal}**` : 'No hay objetivo fijado.');
-        return { handled: true };
-      }
-      await api(`/api/sessions/${state.sessionId}`, { method: 'PUT', body: { goal: arg } }).catch(() => null);
-      notify(`Objetivo de la sesión: **${arg}**`);
-      return { handled: true };
-    }
-    case 'resumen':
-    case 'resume': {
-      if (!state.sessionId) return needSession();
-      notify('Resumiendo la conversación…');
-      const out = await api(`/api/sessions/${state.sessionId}/summary`, { method: 'POST' }).catch((error) => ({
-        error: error.message,
-      }));
-      if (out.error) notify(`No se pudo resumir: ${out.error}`, 'notice err');
-      else notify(`**Resumen**\n\n${out.summary}`);
-      return { handled: true };
-    }
-    case 'audioresumen':
-    case 'audio-resumen': {
-      if (!state.sessionId) return needSession();
-      notify('Preparando el resumen…');
-      const out = await api(`/api/sessions/${state.sessionId}/summary`, { method: 'POST' }).catch((error) => ({
-        error: error.message,
-      }));
-      if (out.error) {
-        notify(`No se pudo resumir: ${out.error}`, 'notice err');
-        return { handled: true };
-      }
-      notify(`**Resumen**\n\n${out.summary}`);
-      reproducirVoz(out.summary, { label: 'resumen' }).catch((error) => notify(`No se pudo reproducir el audio: ${error.message}`, 'notice err'));
-      return { handled: true };
-    }
-    case 'compact': {
-      if (!state.sessionId) return needSession();
-      // Animación en el pane: el corte queda a la vista con un loader mientras
-      // el modelo resume (puede tardar), y se completa con el resumen.
-      const card = addCompactCard(activePane, { running: true });
-      scrollMessages();
-      const out = await api(`/api/sessions/${state.sessionId}/compact`, { method: 'POST' }).catch((error) => ({
-        error: error.message,
-      }));
-      if (out.error) {
-        card?.remove();
-        notify(`No se pudo compactar: ${out.error}`, 'notice err');
-        return { handled: true };
-      }
-      // No borramos el pane: el historial queda a la vista y marcamos el corte
-      // con la línea + el resumen que ahora ve el modelo.
-      finishCompactCard(card, out.summary);
-      scrollMessages();
-      refreshSessions();
-      return { handled: true };
-    }
-    default:
-      notify(`Comando desconocido: \`/${name}\`. Probá \`/help\`.`, 'notice err');
-      return { handled: true };
-  }
-}
-
-/* --- menú de comandos "/" ------------------------------------------------- */
-
-export const slashMenuEl = $('#slash-menu');
-export let slashMatches = [];
-export let slashIndex = 0;
-
-export function slashCommandEntries() {
-  return COMMANDS.map(([cmd, desc]) => {
-    const name = cmd.split(' ')[0];
-    const takesArgs = cmd.includes(' ');
-    return { name, desc, insert: takesArgs ? `${name} ` : name, takesArgs };
-  });
-}
-
-export function hideSlashMenu() {
-  if (!slashMenuEl) return;
-  slashMenuEl.hidden = true;
-  slashMenuEl.replaceChildren();
-  slashMatches = [];
-  slashIndex = 0;
-}
-
-export function renderSlashMenu() {
-  if (!slashMenuEl) return;
-  slashMenuEl.replaceChildren();
-  slashMatches.forEach((entry, index) => {
-    const item = el('button', `slash-item${index === slashIndex ? ' active' : ''}`);
-    item.type = 'button';
-    item.append(el('span', 'slash-cmd', entry.name), el('span', 'slash-desc', entry.desc));
-    // mousedown (no click) para no perder el foco del textarea antes de elegir.
-    item.addEventListener('mousedown', (event) => {
-      event.preventDefault();
-      chooseSlash(index);
-    });
-    slashMenuEl.appendChild(item);
-  });
-  slashMenuEl.hidden = false;
-}
-
-export function updateSlashMenu() {
-  if (!slashMenuEl) return;
-  const value = chatInput.value;
-  if (!value.startsWith('/') || /\s/.test(value)) return hideSlashMenu();
-  const query = value.slice(1).toLowerCase();
-  slashMatches = slashCommandEntries().filter(
-    (entry) =>
-      entry.name.slice(1).toLowerCase().startsWith(query) || entry.desc.toLowerCase().includes(query)
-  );
-  if (!slashMatches.length) return hideSlashMenu();
-  if (slashIndex >= slashMatches.length) slashIndex = 0;
-  renderSlashMenu();
-}
-
-export function chooseSlash(index) {
-  const entry = slashMatches[index];
-  if (!entry) return;
-  chatInput.value = entry.insert;
-  chatInput.focus();
-  hideSlashMenu();
-  if (!entry.takesArgs) sendMessage();
-}
-
-export function handleSlashKey(event) {
-  if (!slashMenuEl || slashMenuEl.hidden || !slashMatches.length) return false;
-  if (event.key === 'ArrowDown') {
-    event.preventDefault();
-    slashIndex = (slashIndex + 1) % slashMatches.length;
-    renderSlashMenu();
-    return true;
-  }
-  if (event.key === 'ArrowUp') {
-    event.preventDefault();
-    slashIndex = (slashIndex - 1 + slashMatches.length) % slashMatches.length;
-    renderSlashMenu();
-    return true;
-  }
-  if (event.key === 'Escape') {
-    event.preventDefault();
-    hideSlashMenu();
-    return true;
-  }
-  if (event.key === 'Enter' || event.key === 'Tab') {
-    event.preventDefault();
-    chooseSlash(slashIndex);
-    return true;
-  }
-  return false;
-}
-
-export function onChatInputChanged() {
-  slashIndex = 0;
-  updateSlashMenu();
-  syncInterruptBtn();
-}
-
+import {
+  INIT_PROMPT,
+  activePane,
+  addCompactCard,
+  addMessage,
+  autoGrowChatInput,
+  basename,
+  chatInput,
+  finishCompactCard,
+  refreshSessions,
+  scrollMessages,
+  sendMessage,
+} from './chat.js';
+import {
+  activateTab,
+  createSessionIn,
+  cycleTheme,
+  openFolderPicker,
+  openSettingsModal,
+  openSettingsPanel,
+  setSidebarOpen,
+  toggleMode,
+} from './chrome.js';
+import { $, api, clear, el, showConfirm, state } from './core.js';
+import { setExplorerOpen } from './explorer.js';
+import { renderMarkdown } from './markdown.js';
+import { openTab, syncInterruptBtn } from './sessions.js';
+import { filterSettings } from './settingsNav.js';
+import { waitServerVersion } from './system.js';
+import { reproducirVoz } from './voice.js';
+
+/* --- command palette (Ctrl/Cmd+K) ----------------------------------------- */
+
+export const PALETTE_COMMANDS = [
+  { id: 'new', label: 'Nueva sesión en otra carpeta', hint: '/new', run: () => openFolderPicker() },
+  { id: 'init', label: 'Analizar el proyecto y crear AGENTS.md', hint: '/init', run: () => runSlash('init') },
+  { id: 'resumen', label: 'Resumir la conversación', hint: '/resumen', run: () => runSlash('resumen') },
+  { id: 'audioresumen', label: 'Resumen como audio', hint: '/audioresumen', run: () => runSlash('audioresumen') },
+  { id: 'compact', label: 'Compactar la conversación', hint: '/compact', run: () => runSlash('compact') },
+  { id: 'clear', label: 'Limpiar la conversación', hint: '/clear', run: () => runSlash('clear') },
+  { id: 'mode', label: 'Cambiar Plan / Build', hint: 'Ctrl+.', run: () => toggleMode() },
+  { id: 'settings', label: 'Modelo, modo y auto (ventana rápida)', run: () => openSettingsModal() },
+  { id: 'providers', label: 'Gestionar proveedores', run: () => activateTab('providers') },
+  { id: 'ajustes', label: 'Abrir ajustes', run: () => activateTab('ajustes') },
+  { id: 'explorer', label: 'Mostrar u ocultar archivos', run: () => setExplorerOpen(!state.explorerOpen) },
+  { id: 'sidebar', label: 'Mostrar u ocultar sesiones', run: () => setSidebarOpen(!state.sidebarOpen) },
+  { id: 'theme', label: 'Cambiar tema', run: () => cycleTheme() },
+  { id: 'serverreload', label: 'Reiniciar el servidor', hint: '/serverreload', run: () => runSlash('serverreload') },
+  { id: 'bridgereload', label: 'Abrir el puente remoto', hint: '/bridgereload', run: () => runSlash('bridgereload') },
+];
+
+export const palette = {
+  modal: $('#palette-modal'),
+  input: $('#palette-input'),
+  list: $('#palette-list'),
+  items: [],
+  index: 0,
+  timer: null,
+  results: { sessions: [], messages: [] },
+};
+
+export function runSlash(name) {
+  chatInput.value = `/${name}`;
+  sendMessage();
+}
+
+export function paletteItems(query) {
+  const q = query.trim().toLowerCase();
+  const items = PALETTE_COMMANDS.filter(
+    (c) => !q || c.label.toLowerCase().includes(q) || c.id.includes(q) || (c.hint ?? '').toLowerCase().includes(q)
+  ).map((c) => ({ label: c.label, hint: c.hint || 'comando', run: c.run }));
+
+  if (q) {
+    for (const section of filterSettings(q).slice(0, 6)) {
+      items.push({ label: `Ajustes · ${section.label}`, hint: section.groupLabel, run: () => openSettingsPanel(section.id) });
+    }
+  }
+
+  for (const session of palette.results.sessions) {
+    items.push({
+      label: session.title || '(sin título)',
+      hint: session.cwd ? basename(session.cwd) : 'sesión',
+      run: () => openTab(session.id),
+    });
+  }
+  for (const message of palette.results.messages) {
+    items.push({
+      label: message.snippet || '(mensaje)',
+      hint: `${message.role} · ${message.title || ''}`,
+      run: () => {
+        openTab(message.sessionId);
+        setTimeout(() => document.getElementById(message.id)?.scrollIntoView({ block: 'center' }), 450);
+      },
+    });
+  }
+  return items;
+}
+
+export function setPaletteIndex(index) {
+  const count = palette.items.length;
+  if (!count) {
+    palette.index = 0;
+    return;
+  }
+  palette.index = ((index % count) + count) % count;
+  [...palette.list.children].forEach((child, i) => child.classList.toggle('active', i === palette.index));
+  palette.list.children[palette.index]?.scrollIntoView({ block: 'nearest' });
+}
+
+export function renderPalette(query) {
+  palette.items = paletteItems(query);
+  palette.list.replaceChildren();
+  if (!palette.items.length) {
+    palette.list.appendChild(el('li', 'palette-empty', 'sin resultados'));
+    return;
+  }
+  palette.items.forEach((item, i) => {
+    const li = el('li', 'palette-item');
+    const main = el('div', 'palette-item-main');
+    main.appendChild(el('span', 'palette-item-label', item.label));
+    if (item.hint) main.appendChild(el('span', 'palette-item-hint', item.hint));
+    li.appendChild(main);
+    li.addEventListener('mousemove', () => setPaletteIndex(i));
+    li.addEventListener('click', () => runPaletteItem(item));
+    palette.list.appendChild(li);
+  });
+  setPaletteIndex(0);
+}
+
+export function runPaletteItem(item) {
+  palette.modal?.close();
+  setTimeout(() => item.run(), 0);
+}
+
+export function openPalette() {
+  if (!palette.modal) return;
+  palette.input.value = '';
+  palette.results = { sessions: [], messages: [] };
+  renderPalette('');
+  palette.modal.showModal();
+  palette.input.focus();
+}
+
+/* --- slash commands ------------------------------------------------------- */
+
+export const COMMANDS = [
+  ['/new', 'nueva sesión (elegís carpeta)'],
+  ['/init', 'analizar el proyecto y crear/actualizar AGENTS.md'],
+  ['/goal <texto>', 'fijar el objetivo de la sesión'],
+  ['/resumen', 'resumir la conversación (sin borrarla)'],
+  ['/audioresumen', 'el resumen como audio'],
+  ['/compact', 'resumir la conversación y liberar contexto'],
+  ['/clear', 'borrar los mensajes de esta sesión'],
+  ['/cwd', 'mostrar la carpeta de trabajo'],
+  ['/port <puerto>', 'ver si un puerto está activo (y qué PID lo usa)'],
+  ['/portkill <puerto>', 'matar el proceso que escucha en un puerto'],
+  ['/serverreload', 'reiniciar el servidor (la consola se reconecta sola)'],
+  ['/bridgereload', 'abrir o reiniciar el puente remoto (tailscale)'],
+  ['/help', 'mostrar esta ayuda'],
+];
+
+export function notify(markdown, kind = 'notice') {
+  const message = addMessage('assistant', '');
+  // `kind` puede traer varias clases ("notice err"): classList.add no acepta
+  // espacios, asi que se agregan una por una.
+  for (const cls of String(kind).split(/\s+/).filter(Boolean)) message.textEl.classList.add(cls);
+  message.textEl.innerHTML = renderMarkdown(markdown);
+  scrollMessages();
+  return message;
+}
+
+/**
+ * Aviso flotante para eventos de fondo (un permiso en otra pestana, un run que
+ * arranco desde el celular).
+ *
+ * NO usar `notify` para esto: esa escribe un mensaje en la conversacion del pane
+ * activo, asi que un permiso caido en otra pestana terminaba-chatrandeando en
+ * el chat que estabas leyendo.
+ */
+export function toast(text) {
+  const host = $('#toasts');
+  if (!host) return;
+  const item = el('div', 'toast', text);
+  host.appendChild(item);
+  const timer = setTimeout(() => item.remove(), 6000);
+  item.addEventListener('click', () => {
+    clearTimeout(timer);
+    item.remove();
+  });
+}
+
+export function needSession() {
+  notify('Abrí o creá una sesión primero (`/new`).', 'notice err');
+  return { handled: true };
+}
+
+export async function runCommand(name, arg) {
+  switch (name) {
+    case 'help':
+    case 'ayuda':
+      notify(`### Comandos\n${COMMANDS.map(([cmd, desc]) => `- \`${cmd}\` — ${desc}`).join('\n')}`);
+      return { handled: true };
+    case 'new':
+    case 'nueva': {
+      const cwd = state.sessionId ? state.cwd : '';
+      if (cwd) {
+        const created = await createSessionIn(cwd);
+        if (created?.error) notify(`No se pudo crear la sesión: ${created.error}`, 'notice err');
+      } else {
+        openFolderPicker();
+      }
+      return { handled: true };
+    }
+    case 'init':
+      return { handled: false, input: INIT_PROMPT };
+    case 'cwd': {
+      const cwd = $('#rail-cwd').textContent;
+      notify(`Carpeta de trabajo: \`${cwd}\``);
+      return { handled: true };
+    }
+    case 'portkill':
+    case 'kill': {
+      const port = Number(arg);
+      if (!Number.isInteger(port) || port < 1 || port > 65535) {
+        notify('Uso: `/portkill <puerto>`, por ejemplo `/portkill 3000`.', 'notice err');
+        return { handled: true };
+      }
+      const out = await api('/api/ports/kill', { method: 'POST', body: { port } }).catch((error) => ({
+        error: error.message,
+      }));
+      if (out.error) notify(`No se pudo matar el puerto ${port}: ${out.error}`, 'notice err');
+      else if (!out.pids.length) notify(`No hay ningún proceso escuchando en el puerto ${port}.`);
+      else if (out.killed.length) notify(`Puerto ${port}: maté el PID ${out.killed.join(', ')}.`);
+      else notify(`Puerto ${port}: no se pudo matar (PID ${out.errors.join(', ')}).`, 'notice err');
+      return { handled: true };
+    }
+    case 'port': {
+      const port = Number(arg);
+      if (!Number.isInteger(port) || port < 1 || port > 65535) {
+        notify('Uso: `/port <puerto>`, por ejemplo `/port 3000`.', 'notice err');
+        return { handled: true };
+      }
+      const out = await api(`/api/ports/${port}`).catch((error) => ({ error: error.message }));
+      if (out.error) notify(`No se pudo consultar el puerto ${port}: ${out.error}`, 'notice err');
+      else if (out.listening) notify(`Puerto ${port}: **activo** (PID ${out.pids.join(', ')}).`);
+      else notify(`Puerto ${port}: nada escuchando.`);
+      return { handled: true };
+    }
+    case 'clear':
+    case 'limpiar': {
+      if (!state.sessionId) return needSession();
+      await api(`/api/sessions/${state.sessionId}/messages`, { method: 'DELETE' }).catch(() => null);
+      clear(activePane);
+      activePane.appendChild(el('div', 'empty', 'Sesión vacía.'));
+      return { handled: true };
+    }
+    case 'goal': {
+      if (!state.sessionId) return needSession();
+      if (!arg) {
+        const data = await api(`/api/sessions/${state.sessionId}`).catch(() => null);
+        notify(data?.session?.goal ? `Objetivo actual: **${data.session.goal}**` : 'No hay objetivo fijado.');
+        return { handled: true };
+      }
+      await api(`/api/sessions/${state.sessionId}`, { method: 'PUT', body: { goal: arg } }).catch(() => null);
+      notify(`Objetivo de la sesión: **${arg}**`);
+      return { handled: true };
+    }
+    case 'resumen':
+    case 'resume': {
+      if (!state.sessionId) return needSession();
+      notify('Resumiendo la conversación…');
+      const out = await api(`/api/sessions/${state.sessionId}/summary`, { method: 'POST' }).catch((error) => ({
+        error: error.message,
+      }));
+      if (out.error) notify(`No se pudo resumir: ${out.error}`, 'notice err');
+      else notify(`**Resumen**\n\n${out.summary}`);
+      return { handled: true };
+    }
+    case 'audioresumen':
+    case 'audio-resumen': {
+      if (!state.sessionId) return needSession();
+      notify('Preparando el resumen…');
+      const out = await api(`/api/sessions/${state.sessionId}/summary`, { method: 'POST' }).catch((error) => ({
+        error: error.message,
+      }));
+      if (out.error) {
+        notify(`No se pudo resumir: ${out.error}`, 'notice err');
+        return { handled: true };
+      }
+      notify(`**Resumen**\n\n${out.summary}`);
+      reproducirVoz(out.summary, { label: 'resumen' }).catch((error) => notify(`No se pudo reproducir el audio: ${error.message}`, 'notice err'));
+      return { handled: true };
+    }
+    case 'compact': {
+      if (!state.sessionId) return needSession();
+      // Animación en el pane: el corte queda a la vista con un loader mientras
+      // el modelo resume (puede tardar), y se completa con el resumen.
+      const card = addCompactCard(activePane, { running: true });
+      scrollMessages();
+      const out = await api(`/api/sessions/${state.sessionId}/compact`, { method: 'POST' }).catch((error) => ({
+        error: error.message,
+      }));
+      if (out.error) {
+        card?.remove();
+        notify(`No se pudo compactar: ${out.error}`, 'notice err');
+        return { handled: true };
+      }
+      // No borramos el pane: el historial queda a la vista y marcamos el corte
+      // con la línea + el resumen que ahora ve el modelo.
+      finishCompactCard(card, out.summary);
+      scrollMessages();
+      refreshSessions();
+      return { handled: true };
+    }
+    case 'serverreload':
+    case 'servereload':
+    case 'restart':
+    case 'reiniciar': {
+      if (
+        !(await showConfirm('¿Reiniciar el servidor? La consola se reconecta sola en unos segundos.', {
+          title: 'Reiniciar servidor',
+          confirmLabel: 'reiniciar',
+          danger: true,
+        }))
+      ) {
+        return { handled: true };
+      }
+      notify('Reiniciando el servidor…');
+      const out = await api('/api/server/restart', { method: 'POST' }).catch((error) => ({ error: error.message }));
+      if (out.error) {
+        notify(`No se pudo reiniciar: ${out.error}`, 'notice err');
+        return { handled: true };
+      }
+      const version = await waitServerVersion();
+      if (version) location.reload();
+      else notify('No pude confirmar el reinicio. Recargá la página en unos segundos.', 'notice err');
+      return { handled: true };
+    }
+    case 'bridgereload':
+    case 'bridge': {
+      notify('Abriendo el puente remoto (tailscale)…');
+      const out = await api('/api/bridge/reload', { method: 'POST' }).catch((error) => ({ error: error.message }));
+      if (out.error) notify(`No pude abrir el puente: ${out.error}`, 'notice err');
+      else notify(`Puente activo: **${out.url}**`);
+      return { handled: true };
+    }
+    default:
+      notify(`Comando desconocido: \`/${name}\`. Probá \`/help\`.`, 'notice err');
+      return { handled: true };
+  }
+}
+
+/* --- menú de comandos "/" ------------------------------------------------- */
+
+export const slashMenuEl = $('#slash-menu');
+export let slashMatches = [];
+export let slashIndex = 0;
+
+export function slashCommandEntries() {
+  return COMMANDS.map(([cmd, desc]) => {
+    const name = cmd.split(' ')[0];
+    const takesArgs = cmd.includes(' ');
+    return { name, desc, insert: takesArgs ? `${name} ` : name, takesArgs };
+  });
+}
+
+export function hideSlashMenu() {
+  if (!slashMenuEl) return;
+  slashMenuEl.hidden = true;
+  slashMenuEl.replaceChildren();
+  slashMatches = [];
+  slashIndex = 0;
+}
+
+export function renderSlashMenu() {
+  if (!slashMenuEl) return;
+  slashMenuEl.replaceChildren();
+  slashMatches.forEach((entry, index) => {
+    const item = el('button', `slash-item${index === slashIndex ? ' active' : ''}`);
+    item.type = 'button';
+    item.append(el('span', 'slash-cmd', entry.name), el('span', 'slash-desc', entry.desc));
+    // mousedown (no click) para no perder el foco del textarea antes de elegir.
+    item.addEventListener('mousedown', (event) => {
+      event.preventDefault();
+      chooseSlash(index);
+    });
+    slashMenuEl.appendChild(item);
+  });
+  slashMenuEl.hidden = false;
+}
+
+export function updateSlashMenu() {
+  if (!slashMenuEl) return;
+  const value = chatInput.value;
+  if (!value.startsWith('/') || /\s/.test(value)) return hideSlashMenu();
+  const query = value.slice(1).toLowerCase();
+  slashMatches = slashCommandEntries().filter(
+    (entry) =>
+      entry.name.slice(1).toLowerCase().startsWith(query) || entry.desc.toLowerCase().includes(query)
+  );
+  if (!slashMatches.length) return hideSlashMenu();
+  if (slashIndex >= slashMatches.length) slashIndex = 0;
+  renderSlashMenu();
+}
+
+export function chooseSlash(index) {
+  const entry = slashMatches[index];
+  if (!entry) return;
+  chatInput.value = entry.insert;
+  chatInput.focus();
+  hideSlashMenu();
+  if (!entry.takesArgs) sendMessage();
+}
+
+export function handleSlashKey(event) {
+  if (!slashMenuEl || slashMenuEl.hidden || !slashMatches.length) return false;
+  if (event.key === 'ArrowDown') {
+    event.preventDefault();
+    slashIndex = (slashIndex + 1) % slashMatches.length;
+    renderSlashMenu();
+    return true;
+  }
+  if (event.key === 'ArrowUp') {
+    event.preventDefault();
+    slashIndex = (slashIndex - 1 + slashMatches.length) % slashMatches.length;
+    renderSlashMenu();
+    return true;
+  }
+  if (event.key === 'Escape') {
+    event.preventDefault();
+    hideSlashMenu();
+    return true;
+  }
+  if (event.key === 'Enter' || event.key === 'Tab') {
+    event.preventDefault();
+    chooseSlash(slashIndex);
+    return true;
+  }
+  return false;
+}
+
+export function onChatInputChanged() {
+  slashIndex = 0;
+  updateSlashMenu();
+  autoGrowChatInput();
+  syncInterruptBtn();
+}
+