@danieltmn/tamnora 0.9.5 → 0.9.6

package/CHANGELOG.md

@@ -5,6 +5,14 @@ Todos los cambios relevantes de este proyecto se documentan en este archivo.
 El formato sigue [Keep a Changelog](https://keepachangelog.com/es-ES/1.1.0/)
 y el proyecto usa [Versionado Semantico](https://semver.org/lang/es/).
 
+## [0.9.6] - 2026-10-08
+
+### Cambios
+
+- fix(consola): borde inferior y padding inferior en la barra de pestañas
+- feat(consola): iconos/logo (favicon, PWA, topbar) y composer estilo codex
+- docs(website): voz, asesor y actualizacion con un click
+
 ## [0.9.5] - 2026-10-08
 
 ### Agregado

package/harness/packages/cli/src/commands/autostart.js

@@ -1,10 +1,13 @@
 import { spawnSync } from 'node:child_process';
-import { mkdirSync, unlinkSync, writeFileSync } from 'node:fs';
+import { existsSync, mkdirSync, unlinkSync, writeFileSync } from 'node:fs';
 import os from 'node:os';
 import path from 'node:path';
+import { fileURLToPath } from 'node:url';
 import { homeDir } from '../../../core/src/index.js';
 import { parse } from '../lib/util.js';
 
+const ICON_PATH = fileURLToPath(new URL('../../../server/public/icons/tamnora.ico', import.meta.url));
+
 const OPTIONS = { home: { type: 'string' }, help: { type: 'boolean', short: 'h' } };
 
 function autostartPath() {
@@ -76,6 +79,7 @@ export async function autostartCommand(argv) {
       `$sc.TargetPath = ${psQuote(wscript)};`,
       `$sc.Arguments = ${psQuote(`"${vbsPath}"`)};`,
       `$sc.WorkingDirectory = ${psQuote(workdir)};`,
+      existsSync(ICON_PATH) ? `$sc.IconLocation = ${psQuote(ICON_PATH)};` : '',
       '$sc.WindowStyle = 1;',
       '$sc.Save();',
     ].join(' ');

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

@@ -39,6 +39,7 @@ function setCwd(value) {
   if (!value) return;
   state.cwd = value;
   $('#rail-cwd').textContent = value;
+  renderCwdPill();
   if (state.explorerOpen) refreshExplorerMode();
 }
 
@@ -478,11 +479,6 @@ async function loadModes() {
   updateStatus();
 }
 
-function modeLabel(id) {
-  const option = [...modeSelect.options].find((o) => o.value === id);
-  return option ? option.textContent : id;
-}
-
 async function setMode(id, { persist = true } = {}) {
   if (![...modeSelect.options].some((o) => o.value === id)) return;
   modeSelect.value = id;
@@ -504,11 +500,82 @@ document.addEventListener('keydown', (event) => {
   }
 });
 
+/* --- pills del composer (carpeta, permisos, modelo) ----------------------- */
+
+const cwdPill = $('#cwd-pill');
+const cwdPillLabel = $('#cwd-pill-label');
+const modePill = $('#mode-pill');
+const modePillLabel = $('#mode-pill-label');
+const modeMenu = $('#mode-menu');
+const modelPill = $('#model-pill');
+const modelPillLabel = $('#model-pill-label');
+
+function renderCwdPill() {
+  if (!cwdPillLabel) return;
+  cwdPillLabel.textContent = state.cwd ? basename(state.cwd) : 'sin carpeta';
+  if (cwdPill) cwdPill.title = state.cwd || 'sin carpeta de trabajo';
+}
+
+// El pill de permisos resume modo + auto-aprobación en uno de tres niveles
+// estilo Codex: Read Only, Workspace Write y Full access.
+function renderModePill() {
+  const plan = modeSelect.value === 'plan';
+  const full = !plan && Boolean(yesInput?.checked);
+  if (modePillLabel) modePillLabel.textContent = plan ? 'Read Only' : full ? 'Full access' : 'Workspace Write';
+  if (!modeMenu) return;
+  for (const item of modeMenu.querySelectorAll('.ctrl-menu-item')) {
+    const kind = item.dataset.kind;
+    const active = kind === 'read' ? plan : kind === 'full' ? full : !plan && !full;
+    item.classList.toggle('active', active);
+    item.setAttribute('aria-checked', active ? 'true' : 'false');
+  }
+}
+
+function renderModelPill() {
+  if (!modelPillLabel) return;
+  modelPillLabel.textContent = state.active.model || 'elegí un modelo';
+  if (modelPill) modelPill.title = `${state.active.provider || '—'} / ${state.active.model || '—'}`;
+}
+
+function closeModeMenu() {
+  if (!modeMenu || modeMenu.hidden) return;
+  modeMenu.hidden = true;
+  modePill?.setAttribute('aria-expanded', 'false');
+}
+
+cwdPill?.addEventListener('click', () => openFolderPicker('session'));
+modePill?.addEventListener('click', (event) => {
+  event.stopPropagation();
+  if (!modeMenu) return;
+  modeMenu.hidden = !modeMenu.hidden;
+  modePill.setAttribute('aria-expanded', modeMenu.hidden ? 'false' : 'true');
+});
+modeMenu?.addEventListener('click', async (event) => {
+  const item = event.target.closest('.ctrl-menu-item');
+  if (!item) return;
+  const kind = item.dataset.kind;
+  closeModeMenu();
+  if (kind === 'full') {
+    await setMode('agent');
+    if (yesInput) yesInput.checked = true;
+  } else {
+    if (yesInput) yesInput.checked = false;
+    await setMode(kind === 'read' ? 'plan' : 'agent');
+  }
+  renderModePill();
+});
+document.addEventListener('click', (event) => {
+  if (modeMenu && !modeMenu.hidden && !event.target.closest('.ctrl-wrap')) closeModeMenu();
+});
+document.addEventListener('keydown', (event) => {
+  if (event.key === 'Escape') closeModeMenu();
+});
+modelPill?.addEventListener('click', () => openSettingsModal());
+yesInput?.addEventListener('change', renderModePill);
+
 function updateStatus(extra = {}) {
-  const p = state.providers.find((x) => x.id === state.active.provider);
-  $('#sb-mode').textContent = modeLabel(modeSelect.value) || 'Build';
-  $('#sb-provider').textContent = p ? `${p.id}` : state.active.provider || '—';
-  $('#sb-model').textContent = state.active.model || '—';
+  renderModePill();
+  renderModelPill();
   if (extra.rounds !== undefined) $('#sb-rounds').textContent = `${extra.rounds} rondas`;
   if (extra.stopReason) $('#sb-rounds').textContent = extra.stopReason;
   if (extra.running) $('#sb-rounds').textContent = 'pensando…';
@@ -1814,8 +1881,9 @@ function activateSession(id) {
 
 function updateSubmitLabel(working) {
   if (!submitBtn) return;
-  submitBtn.textContent = working ? 'encolar' : 'enviar';
-  submitBtn.title = working ? 'El agente está trabajando: se envía al terminar' : '';
+  submitBtn.dataset.working = working ? '1' : '0';
+  submitBtn.setAttribute('aria-label', working ? 'encolar' : 'enviar');
+  submitBtn.title = working ? 'El agente está trabajando: se envía al terminar' : 'enviar';
 }
 
 function auditStatus(record) {
@@ -5419,10 +5487,45 @@ function applyState(diff) {
 
 /* --- señales de alerta: que se note aun mirando otra cosa ----------------- */
 
-const FAVICON_IDLE =
-  "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='7' fill='%23231a17'/%3E%3Ctext x='16' y='23' font-family='Georgia,serif' font-size='18' font-weight='700' fill='%23e8dfd6' text-anchor='middle'%3ET%3C/text%3E%3C/svg%3E";
-const FAVICON_ALERT =
-  "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='7' fill='%23231a17'/%3E%3Ctext x='16' y='23' font-family='Georgia,serif' font-size='18' font-weight='700' fill='%23e8dfd6' text-anchor='middle'%3ET%3C/text%3E%3Ccircle cx='24' cy='9' r='5' fill='%23d9704a'/%3E%3C/svg%3E";
+const FAVICON_IDLE = '/favicon.ico';
+const FAVICON_SOURCE = '/icons/icon-192x192.png';
+let faviconAlert = '';
+let faviconAlertPending = null;
+
+/**
+ * El favicon de alerta se dibuja sobre una copia del logo (mismo origen), para
+ * que el punto rojo combine con el icono real y no con un SVG desincronizado.
+ */
+function alertFavicon() {
+  if (faviconAlert) return Promise.resolve(faviconAlert);
+  if (faviconAlertPending) return faviconAlertPending;
+  faviconAlertPending = new Promise((resolve) => {
+    const img = new Image();
+    img.onload = () => {
+      try {
+        const canvas = document.createElement('canvas');
+        canvas.width = 64;
+        canvas.height = 64;
+        const ctx = canvas.getContext('2d');
+        ctx.drawImage(img, 0, 0, 64, 64);
+        ctx.beginPath();
+        ctx.arc(64 - 16, 16, 13, 0, Math.PI * 2);
+        ctx.fillStyle = '#d9704a';
+        ctx.fill();
+        ctx.lineWidth = 3;
+        ctx.strokeStyle = 'rgba(35,26,23,0.9)';
+        ctx.stroke();
+        faviconAlert = canvas.toDataURL('image/png');
+        resolve(faviconAlert);
+      } catch {
+        resolve(FAVICON_IDLE);
+      }
+    };
+    img.onerror = () => resolve(FAVICON_IDLE);
+    img.src = FAVICON_SOURCE;
+  });
+  return faviconAlertPending;
+}
 
 let baseTitle = '';
 
@@ -5437,7 +5540,10 @@ function renderAlertSignals() {
   const clean = baseTitle.replace(/^\(⚠ \d+\) /, '');
   document.title = pending > 0 ? `(⚠ ${pending}) ${clean}` : clean;
   const link = document.querySelector('link[rel="icon"]');
-  if (link) link.href = pending > 0 ? FAVICON_ALERT : FAVICON_IDLE;
+  if (link) {
+    if (pending > 0) alertFavicon().then((href) => { link.href = href; });
+    else link.href = FAVICON_IDLE;
+  }
 }
 
 /* --- canal global: solo latencia ------------------------------------------ */

package/harness/packages/server/public/index.html

@@ -4,7 +4,10 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <title>Tamnora Console</title>
-    <link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='7' fill='%23231a17'/%3E%3Ctext x='16' y='23' font-family='Georgia,serif' font-size='18' font-weight='700' fill='%23e8dfd6' text-anchor='middle'%3ET%3C/text%3E%3C/svg%3E" />
+    <link rel="icon" href="/favicon.ico" sizes="any" />
+    <link rel="apple-touch-icon" href="/icons/icon-192x192.png" />
+    <link rel="manifest" href="/manifest.webmanifest" />
+    <meta name="theme-color" content="#231a17" />
     <script>
       (function () {
         var theme = null;
@@ -34,7 +37,7 @@
   </head>
   <body>
     <header class="topbar">
-      <div class="brand"><span class="logo"><span class="logo-t">T</span><span class="logo-h">H</span></span> <span class="ver">v0.9.5</span></div>
+      <div class="brand"><span class="logo"><img src="/icons/logo.png" alt="Tamnora" /></span> <span class="ver">v0.9.6</span></div>
       <nav class="tabs">
         <button class="tab active" data-tab="chat">chat</button>
         <button class="tab" data-tab="providers">proveedores</button>
@@ -151,16 +154,45 @@
         <div id="attach-preview" class="attach-preview" hidden></div>
             <div id="chat-queue" class="chat-queue" hidden></div>
             <div id="audio-player" class="audio-player" hidden></div>
-            <div class="composer-row">
-              <span class="prompt-mark">❯</span>
-              <button type="button" id="attach-image" class="btn icon" title="Adjuntar imagen (o pegala / arrastrala)" aria-label="adjuntar imagen">
+            <div class="composer-top">
+              <button type="button" id="cwd-pill" class="ctrl-pill" title="carpeta de trabajo de la sesión">
                 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
-                  <rect width="18" height="18" x="3" y="3" rx="2" ry="2" />
-                  <circle cx="9" cy="9" r="2" />
-                  <path d="m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" />
+                  <path d="M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z" />
                 </svg>
+                <span id="cwd-pill-label">sin carpeta</span>
+                <svg class="chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6" /></svg>
+              </button>
+              <div class="ctrl-wrap">
+                <button type="button" id="mode-pill" class="ctrl-pill" aria-haspopup="menu" aria-expanded="false" title="permisos del agente">
+                  <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z" /></svg>
+                  <span id="mode-pill-label">Workspace Write</span>
+                  <svg class="chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6" /></svg>
+                </button>
+                <div id="mode-menu" class="ctrl-menu" role="menu" hidden>
+                  <button type="button" class="ctrl-menu-item" data-kind="read" role="menuitemradio" aria-checked="false">
+                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7Z" /><circle cx="12" cy="12" r="3" /></svg>
+                    <span>Read Only</span>
+                    <svg class="ctrl-check" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6 9 17l-5-5" /></svg>
+                  </button>
+                  <button type="button" class="ctrl-menu-item" data-kind="write" role="menuitemradio" aria-checked="false">
+                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z" /><path d="m15 5 4 4" /></svg>
+                    <span>Workspace Write</span>
+                    <svg class="ctrl-check" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6 9 17l-5-5" /></svg>
+                  </button>
+                  <button type="button" class="ctrl-menu-item" data-kind="full" role="menuitemradio" aria-checked="false">
+                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z" /><path d="m9 12 2 2 4-4" /></svg>
+                    <span>Full access</span>
+                    <svg class="ctrl-check" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6 9 17l-5-5" /></svg>
+                  </button>
+                </div>
+              </div>
+            </div>
+
+            <div class="composer-row">
+              <button type="button" id="attach-image" class="add-btn" title="Adjuntar imagen (o pegala / arrastrala)" aria-label="adjuntar imagen">
+                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14" /><path d="M12 5v14" /></svg>
               </button>
-              <button type="button" id="mic-btn" class="btn icon" title="Dictar por voz (tocá para grabar y parar)" aria-label="dictar por voz">
+              <button type="button" id="mic-btn" class="add-btn" title="Dictar por voz (tocá para grabar y parar)" aria-label="dictar por voz">
                 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
                   <path d="M12 19v3" />
                   <path d="M19 10v2a7 7 0 0 1-14 0v-2" />
@@ -170,27 +202,30 @@
               </button>
               <input id="image-input" type="file" accept="image/*" multiple hidden />
               <textarea id="chat-input" rows="1" placeholder="escribí un mensaje…" title="Enter envía · Shift+Enter salto" spellcheck="false"></textarea>
-              <button class="btn primary" type="submit">enviar</button>
-              <button class="btn" type="button" id="stop-btn" title="Detener la respuesta" hidden>parar</button>
+              <button type="button" id="model-pill" class="ctrl-pill model-pill" title="proveedor y modelo activos">
+                <span id="model-pill-label">—</span>
+                <svg class="chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6" /></svg>
+              </button>
+              <button class="send-btn" type="submit" aria-label="enviar" title="enviar">
+                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m5 12 7-7 7 7" /><path d="M12 19V5" /></svg>
+              </button>
+              <button class="add-btn" type="button" id="stop-btn" title="Detener la respuesta" aria-label="detener" hidden>
+                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="6" y="6" width="12" height="12" rx="2" /></svg>
+              </button>
+            </div>
+
+            <div id="statusbar" class="composer-status" title="estado del run" role="button" tabindex="0">
+              <span id="sb-activity" class="sb-activity" hidden></span>
+              <span id="sb-sync" class="sb-channel retrying" hidden title="sin sincronía con el server"></span>
+              <span id="sb-channel" class="sb-channel" hidden title="canal de eventos entre dispositivos"></span>
+              <span id="sb-rounds">listo</span>
+              <span class="spacer"></span>
+              <span id="sb-context" class="ctx muted" title="uso del contexto del modelo">
+                <span id="sb-tokens">tokens —</span>
+                <span class="ctx-bar" aria-hidden="true"><span id="sb-context-fill" class="ctx-fill"></span></span>
+              </span>
             </div>
           </form>
-          <div id="statusbar" class="statusbar" title="cambiar modo, proveedor y modelo" role="button" tabindex="0">
-            <span id="sb-mode">agent</span>
-            <span class="dot">·</span>
-            <span id="sb-provider">—</span>
-            <span class="dot">·</span>
-            <span id="sb-model">—</span>
-            <span class="dot">·</span>
-            <span id="sb-activity" class="sb-activity" hidden></span>
-            <span id="sb-sync" class="sb-channel retrying" hidden title="sin sincronía con el server"></span>
-            <span id="sb-channel" class="sb-channel" hidden title="canal de eventos entre dispositivos"></span>
-            <span id="sb-rounds">listo</span>
-            <span class="spacer"></span>
-            <span id="sb-context" class="ctx muted" title="uso del contexto del modelo">
-              <span id="sb-tokens">tokens —</span>
-              <span class="ctx-bar" aria-hidden="true"><span id="sb-context-fill" class="ctx-fill"></span></span>
-            </span>
-          </div>
         </div>
 
         <div id="resizer-explorer" class="resizer" title="ajustar" role="separator" aria-orientation="vertical"></div>

package/harness/packages/server/public/landing/index.html

@@ -4,6 +4,10 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <title>Tamnora Harness</title>
+    <link rel="icon" href="/favicon.ico" sizes="any" />
+    <link rel="apple-touch-icon" href="/icons/icon-192x192.png" />
+    <link rel="manifest" href="/manifest.webmanifest" />
+    <meta name="theme-color" content="#231a17" />
     <script>
       (function () {
         var theme = null;
@@ -129,13 +133,13 @@
         border-radius: 11px;
         display: grid;
         place-items: center;
+        overflow: hidden;
         background: var(--surface);
         backdrop-filter: blur(10px);
-        font-family: Georgia, serif;
-        font-weight: 700;
-        font-size: 19px;
       }
 
+      .logo-mark img { width: 100%; height: 100%; display: block; object-fit: cover; }
+
       .logo-text strong {
         display: block;
         font-family: var(--serif);
@@ -420,7 +424,7 @@
     <div class="page">
       <header>
         <a href="/landing" class="logo">
-          <div class="logo-mark">T</div>
+          <div class="logo-mark"><img src="/icons/logo.png" alt="Tamnora" /></div>
           <div class="logo-text">
             <strong>Tamnora Harness</strong>
             <small>Harness de agentes IA</small>

package/harness/packages/server/public/manifest.webmanifest

@@ -0,0 +1,20 @@
+{
+  "name": "Tamnora Harness",
+  "short_name": "Tamnora",
+  "description": "Consola web del harness local de agentes IA.",
+  "start_url": "/",
+  "scope": "/",
+  "display": "standalone",
+  "background_color": "#f5efe2",
+  "theme_color": "#231a17",
+  "icons": [
+    { "src": "/icons/icon-72x72.png", "sizes": "72x72", "type": "image/png" },
+    { "src": "/icons/icon-96x96.png", "sizes": "96x96", "type": "image/png" },
+    { "src": "/icons/icon-128x128.png", "sizes": "128x128", "type": "image/png" },
+    { "src": "/icons/icon-144x144.png", "sizes": "144x144", "type": "image/png" },
+    { "src": "/icons/icon-152x152.png", "sizes": "152x152", "type": "image/png" },
+    { "src": "/icons/icon-192x192.png", "sizes": "192x192", "type": "image/png", "purpose": "any maskable" },
+    { "src": "/icons/icon-384x384.png", "sizes": "384x384", "type": "image/png" },
+    { "src": "/icons/icon-512x512.png", "sizes": "512x512", "type": "image/png", "purpose": "any" }
+  ]
+}