v1.4.1: barra de pestanas al estilo Chrome

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Barra de pestanas al estilo Chrome
2026-07-25 07:18:19 -05:00 · 2026-07-25 07:17:06 -05:00 · 2026-07-24 07:11:37 -05:00 · 2026-07-18 20:02:30 -05:00
--- a/dist/index.html
+++ b/dist/index.html
@@ -11,26 +11,31 @@
        emite   ls-ready, ls-new-tab, ls-activate, ls-close-tab, ls-reload, ls-zoom, ls-cycle, ls-activate-n
    -->
    <style>
+      /* Paleta estilo Chrome: la barra es una FRANJA más oscura y la pestaña activa es una
+         tarjeta del color del contenido que se funde con él (sin línea debajo). */
      :root {
-        --bg: #f4f4f5;          /* zinc-100 */
-        --fg: #3f3f46;          /* zinc-700 */
-        --muted: #a1a1aa;       /* zinc-400 */
-        --tab-bg: transparent;
+        --bg: #dee1e6;          /* franja de pestañas (Chrome claro) */
+        --fg: #45474a;
+        --muted: #5f6368;
        --tab-active-bg: #ffffff;
-        --tab-active-fg: #18181b;
+        --tab-active-fg: #202124;
        --accent: #6366f1;      /* indigo-500, color de Labstream */
-        --border: #e4e4e7;      /* zinc-200 */
-        --hover: rgba(0, 0, 0, 0.05);
+        --border: #c9ccd1;      /* línea bajo la barra (la tapa la pestaña activa) */
+        --hover: rgba(255, 255, 255, 0.55);  /* píldora de hover en pestañas inactivas */
+        --btn-hover: rgba(0, 0, 0, 0.08);
+        --sep: rgba(0, 0, 0, 0.22);          /* separador fino entre pestañas inactivas */
      }
      @media (prefers-color-scheme: dark) {
        :root {
-          --bg: #18181b;
-          --fg: #d4d4d8;
-          --muted: #71717a;
-          --tab-active-bg: #27272a;
-          --tab-active-fg: #fafafa;
-          --border: #27272a;
-          --hover: rgba(255, 255, 255, 0.07);
+          --bg: #202124;        /* franja (Chrome oscuro) */
+          --fg: #bdc1c6;
+          --muted: #80868b;
+          --tab-active-bg: #18181b;  /* mismo fondo que la app → pestaña fundida con el contenido */
+          --tab-active-fg: #e8eaed;
+          --border: #101013;
+          --hover: rgba(255, 255, 255, 0.08);
+          --btn-hover: rgba(255, 255, 255, 0.1);
+          --sep: rgba(255, 255, 255, 0.25);
        }
      }
      * { box-sizing: border-box; }
@@ -48,18 +53,22 @@
      }
      #bar {
        display: flex;
-        align-items: stretch;
-        gap: 4px;
+        align-items: center;
+        gap: 2px;
        height: 40px;
-        padding: 5px 8px 0;
+        padding: 0 6px 0 8px;
        border-bottom: 1px solid var(--border);
      }
      #tabs {
        display: flex;
-        align-items: stretch;
-        gap: 2px;
+        align-items: flex-end;
        flex: 1 1 auto;
        min-width: 0;
+        /* Se extiende 1px sobre el borde inferior de la barra para que la pestaña ACTIVA
+           lo tape con su propio fondo y quede FUNDIDA con el contenido (look Chrome). */
+        align-self: stretch;
+        margin-bottom: -1px;
+        padding: 0 4px;
        overflow-x: auto;
        scrollbar-width: none;
      }
@@ -67,28 +76,64 @@
      .tab {
        display: flex;
        align-items: center;
-        gap: 6px;
-        flex: 0 1 200px;
-        min-width: 96px;
-        padding: 0 6px 0 12px;
-        border-radius: 8px 8px 0 0;
-        background: var(--tab-bg);
+        gap: 7px;
+        flex: 0 1 220px;
+        min-width: 100px;
+        height: 30px;
+        margin-bottom: 5px;
+        padding: 0 6px 0 10px;
+        border-radius: 9px;         /* inactiva: píldora redondeada (hover) */
        position: relative;
-        overflow: hidden;
+        overflow: visible;          /* deja asomar las curvas de la base de la activa */
      }
-      .tab:hover { background: var(--hover); }
+      .tab:not(.active):hover { background: var(--hover); }
+      /* Separador fino a la IZQUIERDA de cada inactiva; se oculta pegado a la activa,
+         al hover y en la primera (igual que Chrome). */
+      .tab:not(.active)::before {
+        content: "";
+        position: absolute;
+        left: -1px;
+        top: 50%;
+        transform: translateY(-50%);
+        width: 1px;
+        height: 16px;
+        background: var(--sep);
+      }
+      .tab:first-child::before,
+      .tab:hover::before,
+      .tab.active + .tab::before,
+      .tab:hover + .tab::before { display: none; }
      .tab.active {
        background: var(--tab-active-bg);
        color: var(--tab-active-fg);
-        box-shadow: 0 -1px 0 var(--border), 1px 0 0 var(--border), -1px 0 0 var(--border);
+        height: 35px;
+        margin-bottom: 0;           /* su base cae 1px SOBRE el borde de la barra y lo tapa */
+        border-radius: 10px 10px 0 0;
+        z-index: 1;
      }
-      .tab.active::before {
+      /* Curvas cóncavas de Chrome en la base de la pestaña activa: dos piezas de 8px con
+         un cuarto de círculo transparente que "derrama" el fondo hacia los lados. */
+      .tab.active::before,
+      .tab.active::after {
        content: "";
        position: absolute;
-        top: 0; left: 0; right: 0;
-        height: 2px;
-        background: var(--accent);
-        border-radius: 2px 2px 0 0;
+        bottom: 0;
+        width: 8px;
+        height: 8px;
+      }
+      .tab.active::before {
+        left: -8px;
+        background: radial-gradient(circle at 0 0, transparent 8px, var(--tab-active-bg) 8.5px);
+      }
+      .tab.active::after {
+        right: -8px;
+        background: radial-gradient(circle at 8px 0, transparent 8px, var(--tab-active-bg) 8.5px);
+      }
+      .tab .favicon {
+        flex: 0 0 auto;
+        width: 14px;
+        height: 14px;
+        border-radius: 3px;
      }
      .tab .titulo {
        flex: 1 1 auto;
@@ -103,26 +148,26 @@
        height: 18px;
        display: grid;
        place-items: center;
-        border-radius: 5px;
+        border-radius: 50%;         /* circulito, como el × de Chrome */
        color: var(--muted);
        font-size: 13px;
        line-height: 1;
        visibility: hidden;
      }
      .tab:hover .cerrar, .tab.active .cerrar { visibility: visible; }
-      .tab .cerrar:hover { background: var(--hover); color: var(--tab-active-fg); }
+      .tab .cerrar:hover { background: var(--btn-hover); color: var(--tab-active-fg); }
      button {
        appearance: none;
        border: 0;
        background: transparent;
        color: var(--fg);
        font: inherit;
-        border-radius: 7px;
+        border-radius: 50%;
        cursor: default;
        display: grid;
        place-items: center;
      }
-      button:hover { background: var(--hover); }
+      button:hover { background: var(--btn-hover); }
      .icono {
        flex: 0 0 auto;
        width: 30px;
@@ -146,10 +191,22 @@
        font-size: 11.5px;
      }
      #z-pct.activo { color: var(--accent); font-weight: 600; }
+      #version {
+        flex: 0 0 auto;
+        margin: 2px 0 7px;
+        padding: 0 7px;
+        color: var(--muted);
+        font-size: 11px;
+        font-variant-numeric: tabular-nums;
+        white-space: nowrap;
+      }
+      #version:hover { color: var(--accent); }
    </style>
  </head>
  <body>
    <div id="bar">
+      <button class="icono" id="atras" title="Atrás (⌘/Ctrl+[)">←</button>
+      <button class="icono" id="adelante" title="Adelante (⌘/Ctrl+])">→</button>
      <div id="tabs" title=""></div>
      <button class="icono" id="nueva" title="Nueva pestaña (⌘/Ctrl+T)">+</button>
      <button class="icono" id="recargar" title="Recargar (⌘/Ctrl+R)">⟳</button>
@@ -158,6 +215,7 @@
        <button id="z-pct" title="Restablecer zoom (⌘/Ctrl+0)">100%</button>
        <button id="z-mas" title="Acercar (⌘/Ctrl++)">+</button>
      </div>
+      <button id="version" title="Versión de la app · clic: buscar actualización"></button>
      <button class="icono" id="menu" title="Opciones de la app">⋮</button>
    </div>
    <script>
@@ -171,6 +229,16 @@

      const $tabs = document.getElementById("tabs");
      const $pct = document.getElementById("z-pct");
+      const $ver = document.getElementById("version");
+
+      // Favicon de las pestañas (look Chrome): mini logo Labstream en SVG inline —
+      // cuadrado indigo con la "L" — para no depender de archivos ni de la red.
+      const FAVICON = "data:image/svg+xml," + encodeURIComponent(
+        "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'>" +
+        "<rect width='16' height='16' rx='4' fill='#6366f1'/>" +
+        "<path d='M5.2 3.8v7h5.6' stroke='#fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' fill='none'/>" +
+        "</svg>",
+      );

      function render() {
        $tabs.textContent = "";
@@ -179,6 +247,12 @@
          el.className = "tab" + (t.active ? " active" : "");
          el.title = t.title;

+          const fav = document.createElement("img");
+          fav.className = "favicon";
+          fav.src = FAVICON;
+          fav.alt = "";
+          el.appendChild(fav);
+
          const titulo = document.createElement("span");
          titulo.className = "titulo";
          titulo.textContent = t.title || "Labstream OS";
@@ -206,6 +280,7 @@

        $pct.textContent = estado.zoom + "%";
        $pct.classList.toggle("activo", estado.zoom !== 100);
+        $ver.textContent = estado.version ? "v" + estado.version : "";
      }

      if (E) {
@@ -215,10 +290,13 @@
        });
      }

+      document.getElementById("atras").addEventListener("click", () => emitir("ls-nav", { dir: -1 }));
+      document.getElementById("adelante").addEventListener("click", () => emitir("ls-nav", { dir: 1 }));
      document.getElementById("nueva").addEventListener("click", () => emitir("ls-new-tab", {}));
      document.getElementById("recargar").addEventListener("click", () => emitir("ls-reload", {}));
      // Menú de OPCIONES de la app (nativo, lo pinta Rust): botón ⋮ o clic derecho en la barra.
      document.getElementById("menu").addEventListener("click", () => emitir("ls-menu", {}));
+      $ver.addEventListener("click", () => emitir("ls-check-update", {}));
      document.getElementById("bar").addEventListener("contextmenu", (e) => {
        e.preventDefault();
        emitir("ls-menu", {});
@@ -236,9 +314,11 @@
        const mod = e.metaKey || e.ctrlKey;
        if (!mod) return;
        const k = e.key;
-        if (k === "t" || k === "T") { e.preventDefault(); emitir("ls-new-tab", {}); }
+        if (k === "t" || k === "T") { e.preventDefault(); emitir(e.shiftKey ? "ls-reopen" : "ls-new-tab", {}); }
        else if (k === "w" || k === "W") { e.preventDefault(); emitir("ls-close-tab", {}); }
        else if ((k === "r" || k === "R") && !e.shiftKey) { e.preventDefault(); emitir("ls-reload", {}); }
+        else if (k === "[") { e.preventDefault(); emitir("ls-nav", { dir: -1 }); }
+        else if (k === "]") { e.preventDefault(); emitir("ls-nav", { dir: 1 }); }
        else if (k === "=" || k === "+") { e.preventDefault(); emitir("ls-zoom", { dir: 1 }); }
        else if (k === "-") { e.preventDefault(); emitir("ls-zoom", { dir: -1 }); }
        else if (k === "0") { e.preventDefault(); emitir("ls-zoom", { dir: 0 }); }
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
  "name": "labstream-desktop",
-  "version": "1.0.0",
+  "version": "1.4.0",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "labstream-desktop",
-      "version": "1.0.0",
+      "version": "1.4.0",
      "devDependencies": {
        "@tauri-apps/cli": "^2"
      }
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "labstream-desktop",
-  "version": "1.2.0",
+  "version": "1.4.0",
  "private": true,
  "description": "App de escritorio (Windows) que envuelve Labstream OS — cliente del servidor del NAS.",
  "scripts": {
--- a/src-tauri/Cargo.lock
+++ b/src-tauri/Cargo.lock
@@ -1946,7 +1946,7 @@ dependencies = [

 [[package]]
 name = "labstream-desktop"
-version = "1.2.0"
+version = "1.4.1"
 dependencies = [
 "serde",
 "serde_json",
--- a/src-tauri/Cargo.toml
+++ b/src-tauri/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "labstream-desktop"
-version = "1.2.0"
+version = "1.4.1"
 description = "Cliente de escritorio de Labstream OS"
 authors = ["Labstream SAS"]
 edition = "2021"
--- a/src-tauri/src/lib.rs
+++ b/src-tauri/src/lib.rs
@@ -17,6 +17,11 @@
 //   - plugin `updater`: busca versión nueva en los Releases de GitHub y se actualiza sola.
 //   - bandeja (tray) + "cerrar = ocultar": sigue corriendo y notificando en segundo plano.
 // Y lo nuevo:
+//   - ATRÁS/ADELANTE: botones ← → en la barra, ⌘[ / ⌘] (Alt+←/→ en Windows) y menú
+//     Historial (macOS). Antes una página sin menú propio era un callejón sin salida.
+//   - «Reabrir pestaña cerrada» (⌘/Ctrl+Shift+T), como en el navegador.
+//   - Globo de NO-LEÍDOS en el icono (evento `ls-badge` desde la web app): número en el
+//     Dock (macOS), punto rojo en la barra de tareas (Windows) y tooltip de la bandeja.
 //   - ZOOM de interfaz (Cmd/Ctrl +/−/0 y Ctrl+rueda) con persistencia entre sesiones.
 //   - Sesión restaurada: al reabrir vuelve con las mismas pestañas y tamaño de ventana.
 //   - single-instance (solo release): abrir la app de nuevo enfoca la ventana existente.
@@ -66,11 +71,12 @@ struct Shell {
    next_id: u64,
    win: Option<WinRect>,
    autostart: Option<bool>, // elección del usuario en el menú ⋮ (None = por defecto, activado)
+    closed: Vec<String>,     // URLs de pestañas cerradas (para «Reabrir pestaña cerrada», ⌘⇧T)
 }

 impl Default for Shell {
    fn default() -> Self {
-        Self { tabs: Vec::new(), active: 0, zoom_idx: ZOOM_100, next_id: 1, win: None, autostart: None }
+        Self { tabs: Vec::new(), active: 0, zoom_idx: ZOOM_100, next_id: 1, win: None, autostart: None, closed: Vec::new() }
    }
 }

@@ -216,9 +222,14 @@ const INIT_JS_TPL: &str = r#"
    var mod = e.metaKey || e.ctrlKey;
    if (!mod) return;
    var k = e.key;
-    if (k === 't' || k === 'T') { e.preventDefault(); newTab(null); }
+    if (k === 't' || k === 'T') {
+      e.preventDefault();
+      if (e.shiftKey) emit('ls-reopen', {}); else newTab(null);
+    }
    else if (k === 'w' || k === 'W') { e.preventDefault(); emit('ls-close-tab', { label: LABEL }); }
    else if ((k === 'r' || k === 'R') && !e.shiftKey) { e.preventDefault(); location.reload(); }
+    else if (k === '[') { e.preventDefault(); history.back(); }
+    else if (k === ']') { e.preventDefault(); history.forward(); }
    else if (k === '=' || k === '+') { e.preventDefault(); emit('ls-zoom', { dir: 1 }); }
    else if (k === '-') { e.preventDefault(); emit('ls-zoom', { dir: -1 }); }
    else if (k === '0') { e.preventDefault(); emit('ls-zoom', { dir: 0 }); }
@@ -226,6 +237,18 @@ const INIT_JS_TPL: &str = r#"
    else if (k >= '1' && k <= '9') { e.preventDefault(); emit('ls-activate-n', { n: +k }); }
  }, true);

+  // Alt+←/→ = atrás/adelante (convención de Windows/Linux; en Mac es ⌘[ / ⌘] y Alt+flecha
+  // se respeta para saltar palabras al escribir). Fuera de campos de texto solamente.
+  var MAC = /Mac/i.test(navigator.platform || '');
+  function editable(el) {
+    return !!el && (el.isContentEditable || /^(INPUT|TEXTAREA|SELECT)$/.test(el.tagName || ''));
+  }
+  addEventListener('keydown', function (e) {
+    if (MAC || !e.altKey || e.metaKey || e.ctrlKey || e.shiftKey || editable(e.target)) return;
+    if (e.key === 'ArrowLeft') { e.preventDefault(); history.back(); }
+    else if (e.key === 'ArrowRight') { e.preventDefault(); history.forward(); }
+  }, true);
+
  // Ctrl+rueda = zoom (convención de navegador; en Mac también con Ctrl).
  addEventListener('wheel', function (e) {
    if (!e.ctrlKey) return;
@@ -269,7 +292,7 @@ fn current_zoom<R: Runtime>(app: &AppHandle<R>) -> f64 {
    ZOOM_STEPS[s.zoom_idx.min(ZOOM_STEPS.len() - 1)]
 }

-// Manda el estado de pestañas + zoom a la barra (webview "chrome").
+// Manda el estado de pestañas + zoom + versión a la barra (webview "chrome").
 fn broadcast<R: Runtime>(app: &AppHandle<R>) {
    let payload = {
        let shell = app.state::<ShellState>();
@@ -280,7 +303,11 @@ fn broadcast<R: Runtime>(app: &AppHandle<R>) {
            .enumerate()
            .map(|(i, t)| json!({ "label": t.label, "title": t.title, "active": i == s.active }))
            .collect();
-        json!({ "tabs": tabs, "zoom": (ZOOM_STEPS[s.zoom_idx.min(ZOOM_STEPS.len()-1)] * 100.0).round() as u32 })
+        json!({
+            "tabs": tabs,
+            "zoom": (ZOOM_STEPS[s.zoom_idx.min(ZOOM_STEPS.len()-1)] * 100.0).round() as u32,
+            "version": app.package_info().version.to_string(),
+        })
    };
    let _ = app.emit_to(EventTarget::webview(CHROME), "ls-tabs", payload);
 }
@@ -379,6 +406,12 @@ fn close_tab<R: Runtime>(app: &AppHandle<R>, label: &str) {
        let mut s = shell.lock().unwrap();
        let Some(i) = s.tabs.iter().position(|t| t.label == label) else { return };
        let was_active = i == s.active;
+        // Recuerda la URL para «Reabrir pestaña cerrada» (tope de 20, las más recientes).
+        let url = s.tabs[i].url.clone();
+        s.closed.push(url);
+        if s.closed.len() > 20 {
+            s.closed.remove(0);
+        }
        s.tabs.remove(i);
        if s.tabs.is_empty() {
            s.active = 0;
@@ -485,6 +518,67 @@ fn active_url<R: Runtime>(app: &AppHandle<R>) -> Option<String> {
    s.tabs.get(s.active).map(|t| t.url.clone())
 }

+// Atrás/adelante en el HISTORIAL de la pestaña activa. Antes no existía por ningún lado y
+// una página sin menú propio (p. ej. el portal de revisión) era un callejón sin salida.
+fn nav_tab<R: Runtime>(app: &AppHandle<R>, dir: i32) {
+    if let Some(l) = active_label(app) {
+        if let Some(wv) = get_webview(app, &l) {
+            let _ = wv.eval(if dir < 0 { "history.back()" } else { "history.forward()" });
+        }
+    }
+}
+
+// «Reabrir pestaña cerrada» (⌘/Ctrl+Shift+T): la más reciente primero, como en el navegador.
+fn reopen_tab<R: Runtime>(app: &AppHandle<R>) {
+    let url = {
+        let shell = app.state::<ShellState>();
+        let mut s = shell.lock().unwrap();
+        s.closed.pop()
+    };
+    if let Some(u) = url {
+        create_tab(app, Some(u), true);
+    }
+}
+
+// Punto rojo para el icono de la barra de tareas de Windows (dibujado a mano: sin assets).
+#[cfg(target_os = "windows")]
+fn red_dot() -> tauri::image::Image<'static> {
+    const S: usize = 16;
+    let mut px = vec![0u8; S * S * 4];
+    let c = (S as f64 - 1.0) / 2.0;
+    for y in 0..S {
+        for x in 0..S {
+            let (dx, dy) = (x as f64 - c, y as f64 - c);
+            if (dx * dx + dy * dy).sqrt() <= c {
+                let i = (y * S + x) * 4;
+                px[i] = 225;
+                px[i + 1] = 29;
+                px[i + 2] = 72;
+                px[i + 3] = 255;
+            }
+        }
+    }
+    tauri::image::Image::new_owned(px, S as u32, S as u32)
+}
+
+// Globo de NO-LEÍDOS en el icono, alimentado por la web app (evento `ls-badge {count}`):
+// macOS = número en el icono del Dock; Windows = punto rojo sobre el icono de la barra de
+// tareas; y en ambos, el tooltip de la bandeja dice cuántos hay.
+fn set_badge<R: Runtime>(app: &AppHandle<R>, count: i64) {
+    if let Some(win) = main_window(app) {
+        #[cfg(target_os = "macos")]
+        let _ = win.set_badge_count(if count > 0 { Some(count) } else { None });
+        #[cfg(target_os = "windows")]
+        let _ = win.set_overlay_icon(if count > 0 { Some(red_dot()) } else { None });
+        #[cfg(not(any(target_os = "macos", target_os = "windows")))]
+        let _ = &win;
+    }
+    if let Some(tray) = app.tray_by_id("main-tray") {
+        let tip = if count > 0 { format!("Labstream OS — {count} sin leer") } else { "Labstream OS".to_string() };
+        let _ = tray.set_tooltip(Some(tip));
+    }
+}
+
 // Menú de OPCIONES de la app (botón ⋮ / clic derecho en la barra): un popup NATIVO del sistema,
 // igual en Windows y macOS. Se construye fresco en cada apertura para que el check de
 // "Iniciar con el sistema" y la versión estén siempre al día. Solo opciones del SHELL — la web
@@ -497,8 +591,12 @@ fn show_app_menu<R: Runtime>(app: &AppHandle<R>) {
        Ok(Menu::with_items(
            app,
            &[
+                &MenuItem::with_id(app, "nav-back", "Atrás", true, Some("CmdOrCtrl+["))?,
+                &MenuItem::with_id(app, "nav-forward", "Adelante", true, Some("CmdOrCtrl+]"))?,
+                &PredefinedMenuItem::separator(app)?,
                &MenuItem::with_id(app, "new-tab", "Nueva pestaña", true, Some("CmdOrCtrl+T"))?,
                &MenuItem::with_id(app, "close-tab", "Cerrar pestaña", true, Some("CmdOrCtrl+W"))?,
+                &MenuItem::with_id(app, "reopen-tab", "Reabrir pestaña cerrada", true, Some("CmdOrCtrl+Shift+T"))?,
                &MenuItem::with_id(app, "reload", "Recargar", true, Some("CmdOrCtrl+R"))?,
                &PredefinedMenuItem::separator(app)?,
                &MenuItem::with_id(app, "zoom-in", "Acercar", true, Some("CmdOrCtrl+="))?,
@@ -702,6 +800,7 @@ pub fn run() {
                    &[
                        &MenuItem::with_id(h, "new-tab", "Nueva pestaña", true, Some("CmdOrCtrl+T"))?,
                        &MenuItem::with_id(h, "close-tab", "Cerrar pestaña", true, Some("CmdOrCtrl+W"))?,
+                        &MenuItem::with_id(h, "reopen-tab", "Reabrir pestaña cerrada", true, Some("CmdOrCtrl+Shift+T"))?,
                        &PredefinedMenuItem::separator(h)?,
                        &MenuItem::with_id(h, "open-browser", "Abrir esta página en el navegador", true, None::<&str>)?,
                    ],
@@ -734,6 +833,15 @@ pub fn run() {
                        &PredefinedMenuItem::fullscreen(h, Some("Pantalla completa"))?,
                    ],
                )?;
+                let historial = Submenu::with_items(
+                    h,
+                    "Historial",
+                    true,
+                    &[
+                        &MenuItem::with_id(h, "nav-back", "Atrás", true, Some("CmdOrCtrl+["))?,
+                        &MenuItem::with_id(h, "nav-forward", "Adelante", true, Some("CmdOrCtrl+]"))?,
+                    ],
+                )?;
                let ventana = Submenu::with_items(
                    h,
                    "Ventana",
@@ -743,18 +851,21 @@ pub fn run() {
                        &PredefinedMenuItem::maximize(h, Some("Zoom"))?,
                    ],
                )?;
-                let menu = Menu::with_items(h, &[&app_menu, &archivo, &edicion, &vista, &ventana])?;
+                let menu = Menu::with_items(h, &[&app_menu, &archivo, &edicion, &vista, &historial, &ventana])?;
                app.set_menu(menu)?;
            }

            // Manejador de TODOS los menús (el de macOS y el popup ⋮ de ambas plataformas).
            app.on_menu_event(|app, event| match event.id().as_ref() {
+                "nav-back" => nav_tab(app, -1),
+                "nav-forward" => nav_tab(app, 1),
                "new-tab" => create_tab(app, None, true),
                "close-tab" => {
                    if let Some(l) = active_label(app) {
                        close_tab(app, &l);
                    }
                }
+                "reopen-tab" => reopen_tab(app),
                "reload" => reload_tab(app, None),
                "zoom-in" => zoom_step(app, 1),
                "zoom-out" => zoom_step(app, -1),
@@ -858,9 +969,30 @@ pub fn run() {
                }
            });
            let h = handle.clone();
+            handle.listen_any("ls-nav", move |e| {
+                let dir = field_i64(e.payload(), "dir").unwrap_or(-1) as i32;
+                nav_tab(&h, dir);
+            });
+            let h = handle.clone();
+            handle.listen_any("ls-reopen", move |_| {
+                reopen_tab(&h);
+            });
+            // Globo de no-leídos: lo emite la web app cuando cambia el conteo del chat.
+            let h = handle.clone();
+            handle.listen_any("ls-badge", move |e| {
+                let n = field_i64(e.payload(), "count").unwrap_or(0);
+                set_badge(&h, n);
+            });
+            let h = handle.clone();
            handle.listen_any("ls-menu", move |_| {
                show_app_menu(&h);
            });
+            // Clic en la etiqueta de versión de la barra → buscar actualización (con aviso).
+            let h = handle.clone();
+            handle.listen_any("ls-check-update", move |_| {
+                #[cfg(desktop)]
+                tauri::async_runtime::spawn(check_update_manual(h.clone()));
+            });
            let h = handle.clone();
            handle.listen_any("ls-title", move |e| {
                let (label, title, url) = (
--- a/src-tauri/tauri.conf.json
+++ b/src-tauri/tauri.conf.json
@@ -1,7 +1,7 @@
 {
  "$schema": "https://schema.tauri.app/config/2",
  "productName": "Labstream OS",
-  "version": "1.2.0",
+  "version": "1.4.1",
  "identifier": "co.labstream.os",
  "build": {
    "frontendDist": "../dist"
Autor	SHA1	Mensaje	Fecha
Jonathan David Florez Salomón	5108b06ae1	v1.4.1: barra de pestanas al estilo Chrome Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>	2026-07-25 07:18:19 -05:00
Jonathan David Florez Salomón	c56d4cb97d	Barra de pestanas al estilo Chrome La barra del shell ahora se ve como las pestanas de un navegador de verdad: - La barra es una FRANJA mas oscura (claro #dee1e6 / oscuro #202124) y la pestana ACTIVA es una tarjeta del color del contenido con esquinas superiores redondeadas y las curvas concavas de Chrome en la base (dos piezas radial-gradient de 8px que "derraman" el fondo hacia los lados). El contenedor de pestanas se extiende 1px sobre el borde inferior para que la activa lo tape y quede FUNDIDA con la pagina; en oscuro su fondo es #18181b (el mismo de la app) para que no haya costura. - Favicon por pestana: mini logo Labstream (SVG inline data-URI, sin red). - Pestanas inactivas: pildora redondeada al hover y separador fino vertical entre ellas, oculto junto a la activa, al hover y en la primera (CSS puro con .active + .tab, sin :has). - El boton de cerrar es un circulito y los botones de la barra pasan a hover circular, como en Chrome. Sin cambios en Rust: TAB_BAR_H sigue en 40 y los eventos ls-* intactos. Verificado con arnes local (stub de __TAURI__ + 4 pestanas de prueba) en claro y oscuro: curvas, fusion con el contenido, separadores y favicon OK. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>	2026-07-25 07:17:06 -05:00
Jonathan David Florez Salomón	d8a35f5bae	Atrás/adelante en la barra + reabrir pestaña + globo de no-leídos en el icono - ATRÁS/ADELANTE por fin: botones ← → en la barra de pestañas, ⌘[ / ⌘] en ambas plataformas, Alt+←/→ en Windows (fuera de campos de texto) y menú «Historial» en macOS. Cierra el callejón sin salida: una página sin menú propio (p. ej. el portal de revisión) dejaba al usuario atrapado sin forma de volver. - «Reabrir pestaña cerrada» (⌘/Ctrl+Shift+T, tope de 20): en la barra ⌘⇧T antes caía en «nueva pestaña» por no mirar el Shift. - Globo de NO-LEÍDOS en el icono: la web app emite `ls-badge {count}` (mismo conteo del «(N)» del título) y el shell pinta el número en el Dock (macOS), un punto rojo dibujado a mano sobre el icono de la barra de tareas (Windows, sin assets) y el tooltip de la bandeja («— N sin leer»). Verificado: cargo check limpio (macOS) y firmas de las APIs solo-Windows (set_overlay_icon, set_badge_count, Image::new_owned) cotejadas contra el código fuente de tauri 2.11.3. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>	2026-07-24 07:11:37 -05:00
Jonathan David Florez Salomón	d682b06ab9	Versión visible en la barra de la app (clic = buscar actualización) La barra muestra la versión real del paquete (viene de Rust en el payload ls-tabs, no quemada en el HTML) junto al menú ⋮. Clic en la etiqueta → "Buscar actualización…" con aviso del resultado (evento ls-check-update). Versión 1.3.0. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>	2026-07-18 20:02:30 -05:00