tina4ruby 3.13.149 → 3.13.150

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: '08653f37ab3b3baf01b6103f97ec3893f910fbaf5a50b4b34a5521c872e9a225'
-  data.tar.gz: 2df60c055ca63a7957f79da033add45a12e3418f1e5890a3a986c254a8f4f6ec
+  metadata.gz: e63d80b48d2821411c3174e3307176cdf996bfc722c2c228be2b829df8a898c3
+  data.tar.gz: 4323b78fdba05283005597a4c8489d29a8b74cb02754bc9ec7b4c88f361d0cbc
 SHA512:
-  metadata.gz: dafb902ac5f0b385862acf78fbc1ded074233082a98d7dac462f095fb82fc4043a0ff5369eb9a7dbcd0c4662daab0c00b34a1c1647bcb6f29332a7d4882bbc30
-  data.tar.gz: 2408c4a0f724372a555efb9a39d3dd30b4334476109e257e4eb301d38db666f27f932bcd6b278c0087e3080f109042924236b550c6fafb6d8763b0db9e9c505d
+  metadata.gz: 68483df7f4ae92df44d121678397b0c6a4884277e88c7321fc0ed57ba36e34ae26bb8bca3f148eed1904127907d2a0c20369ca729341131ebea409a3e47b799b
+  data.tar.gz: aa95f3c686a89537e480bdc2d49de82a1d8cec58dfe0e1c24398f8f19ea3552ba9ec2eac8a351ef859971400ed0756afe2e8421bcd4461ee4c02ffce21e6f715

data/CHANGELOG.md

@@ -6,6 +6,16 @@ number means the same thing everywhere.
 **The authoritative release notes for every shipped version live in the documentation:**
 https://tina4.com/ruby/36-releases
 
+## 3.13.150 — 2026-10-11
+
+### Dev admin
+- The dashboard AI talks to the `tina4 ai serve` gateway on :11435, not a model
+  directly; `/__dev/split` serves the shared split-preview asset; the scaffold
+  panel is data-driven from the CLI generators; and the Code Landscape metrics
+  bubbles are free to spread (zoom-out + Fit frame the layout, was crammed into
+  the viewport). The dashboard metrics scan passes `--no-history` so it stops
+  self-reloading. Shipped in the shared SPA bundle.
+
 ## 3.13.149 — 2026-10-10
 
 ### CRUD

data/lib/tina4/dev_admin.rb

@@ -439,6 +439,8 @@ module Tina4
           serve_dashboard
         when ["GET", "/__dev/js/tina4-dev-admin.min.js"]
           serve_dev_js
+        when ["GET", "/__dev/split"], ["GET", "/__dev/split/"]
+          serve_split
         when ["GET", "/__dev/toolbar.css"]
           # tina4stack #115: the injected toolbar's stylesheet, served as an
           # external asset so the toolbar carries no inline style= and renders
@@ -934,6 +936,18 @@ module Tina4
         end
       end
 
+      # Detached split view — dashboard/editor LEFT, live app preview RIGHT.
+      # Served from the SHARED asset (the same tina4-dev-admin-split.html the
+      # python/php/node frameworks serve); a plain shell, no toolbar injected.
+      def serve_split
+        path = File.join(File.dirname(__FILE__), "public", "js", "tina4-dev-admin-split.html")
+        if File.file?(path)
+          [200, { "content-type" => "text/html; charset=utf-8" }, [File.read(path)]]
+        else
+          [404, { "content-type" => "text/plain" }, ["tina4-dev-admin-split.html not found"]]
+        end
+      end
+
       def status_payload
         db_table_count = 0
         begin

data/lib/tina4/metrics.rb

@@ -50,7 +50,11 @@ module Tina4
       binary = engine_path
       raise MetricsEngineError, "tina4 not found on PATH - #{INSTALL_HINT}" unless binary
 
-      stdout, stderr, status = Open3.capture3(binary, 'metrics', '--path', path.to_s, '--json')
+      # --no-history: a dashboard READ must never write .tina4-metrics.json.
+      # Without it every scan records history, the file watcher sees the write
+      # and reloads the page, which re-scans - a self-inflicted ~2-second reload
+      # loop that makes the dashboard unusable.
+      stdout, stderr, status = Open3.capture3(binary, 'metrics', '--path', path.to_s, '--json', '--no-history')
       unless status.success?
         detail = (stderr.empty? ? stdout : stderr).strip.lines.first || "exit code #{status.exitstatus}"
         raise MetricsEngineError, "tina4 metrics failed on #{path}: #{detail.strip}"

data/lib/tina4/plan.rb

@@ -407,7 +407,7 @@ module Tina4
         user_parts << "Extra context from caller: #{prompt}" unless prompt.to_s.empty?
         user_parts << "Reply with ONLY the JSON array — no explanation, no markdown fences."
 
-        ai_url = ENV.fetch("TINA4_AI_URL", "http://localhost:11437/api/chat")
+        ai_url = ENV.fetch("TINA4_AI_URL", "http://localhost:11435/api/chat")
         ai_model = ENV.fetch("TINA4_AI_MODEL", "qwen2.5-coder:14b")
 
         reply = begin

data/lib/tina4/public/bundled-component-provenance.json

@@ -41,8 +41,8 @@
     },
     {
       "path": "js/tina4-dev-admin.min.js",
-      "component": "tina4-dev-admin-21700e0",
-      "sha256": "0ca84246c26afb6a3243aafd1c65fa9486c076039e5d721b6f44661b3a59d7c2"
+      "component": "tina4-dev-admin-8c4617d",
+      "sha256": "6b05be06b5d76ee4126a11f019d104d3920c1e3234250cfe1966a33f34c1a234"
     }
   ]
 }

data/lib/tina4/public/js/tina4-dev-admin-split.html

@@ -0,0 +1,202 @@
+<!DOCTYPE html>
+<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1.0"><title>Tina4 Dev - Split</title>
+<style>
+  html,body{margin:0;height:100%;background:#0f172a;font-family:system-ui,-apple-system,sans-serif;overflow:hidden}
+  /* One top toolbar controls both panels and the preview device. */
+  .t4-topbar{height:40px;box-sizing:border-box;display:flex;align-items:center;gap:6px;padding:0 10px;background:#0b1220;border-bottom:1px solid #1f2937}
+  .t4-brand{color:#e2e8f0;font:600 12px system-ui;margin-right:6px}
+  .t4-spacer{flex:1 1 auto}
+  .t4-devbtn{background:#1e293b;color:#cbd5e1;border:1px solid #334155;border-radius:6px;padding:3px 9px;font:12px system-ui;cursor:pointer}
+  .t4-devbtn.active{background:#2563eb;border-color:#2563eb;color:#fff}
+  /* Icon toggle buttons: full opacity + highlight when the panel is shown,
+     dimmed when hidden. */
+  .t4-tg{display:inline-flex;align-items:center;justify-content:center;width:28px;height:26px;background:#1e293b;color:#94a3b8;border:1px solid #334155;border-radius:6px;cursor:pointer;opacity:.5}
+  .t4-tg svg{width:15px;height:15px}
+  .t4-tg.active{background:#334155;color:#fff;opacity:1}
+  .t4-dim{color:#64748b;font:11px/1 ui-monospace,monospace;margin:0 6px}
+  .t4-popout{background:#0f766e;color:#fff;border:1px solid #0f766e;border-radius:6px;padding:3px 10px;font:12px system-ui;cursor:pointer;margin-left:6px}
+  .t4-split{display:flex;height:calc(100vh - 41px);width:100vw}
+  .t4-left{flex:0 0 auto;width:58%;min-width:0;height:100%;overflow:hidden}
+  .t4-left iframe{width:100%;height:100%;border:0;display:block}
+  .t4-gutter{flex:0 0 6px;cursor:col-resize;background:#1f2937}
+  .t4-gutter:hover,.t4-gutter.drag{background:#2563eb}
+  .t4-right{flex:1 1 auto;min-width:0;height:100%;overflow:hidden;display:flex;flex-direction:column}
+  /* A LIGHT backdrop so the dark device frame stands out. */
+  .t4-stage{flex:1 1 auto;min-width:0;min-height:0;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 32%,#f8fafc,#c3ccd9)}
+  /* The device frame - a phone/tablet bezel around the live app. overflow:hidden
+     + border-radius CLIP the app to the rounded frame, so content is contained.
+     No width/height transition: fit() measures right after a toggle, and an
+     animated size would be read mid-transition (the "clicking does nothing" bug). */
+  .t4-device{position:relative;background:#111;box-shadow:0 16px 50px rgba(15,23,42,.45);transform-origin:center center;overflow:hidden}
+  .t4-device iframe{width:100%;height:100%;border:0;display:block;background:#fff}
+  .t4-device.mobile{border:14px solid #111;border-radius:46px}
+  .t4-device.tablet{border:16px solid #111;border-radius:26px}
+  /* Desktop fills the whole preview block - no bezel, no scaling. */
+  .t4-device.desktop{border:0;border-radius:0;box-shadow:none;width:100%;height:100%}
+  .t4-hidden{display:none !important}
+  /* While dragging the gutter, let mouse events pass over the iframes. */
+  body.t4-dragging iframe{pointer-events:none}
+</style></head>
+<body>
+  <div class="t4-topbar">
+    <span class="t4-brand">Tina4 Dev</span>
+    <button class="t4-tg active" id="t4-tg-files" title="Show/hide the file navigator"><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.4"><rect x="1.5" y="2.5" width="13" height="11" rx="1.5"/><line x1="6" y1="2.5" x2="6" y2="13.5"/></svg></button>
+    <button class="t4-tg active" id="t4-tg-editor" title="Show/hide the code editor"><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><polyline points="5.5,4.5 2,8 5.5,11.5"/><polyline points="10.5,4.5 14,8 10.5,11.5"/></svg></button>
+    <button class="t4-tg active" id="t4-tg-preview" title="Show/hide the preview"><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"><rect x="1.5" y="2.5" width="13" height="9" rx="1.5"/><line x1="5.5" y1="14" x2="10.5" y2="14"/><line x1="8" y1="11.5" x2="8" y2="14"/></svg></button>
+    <span class="t4-spacer"></span>
+    <span class="t4-dim" id="t4-dim">1440 x 900</span>
+    <button class="t4-devbtn" data-mode="mobile">Mobile</button>
+    <button class="t4-devbtn" data-mode="tablet">Tablet</button>
+    <button class="t4-devbtn active" data-mode="desktop">Desktop</button>
+    <button class="t4-popout" id="t4-popout" title="Open this view in its own window - drag it to another screen">&#8689; Pop out</button>
+  </div>
+  <div class="t4-split" id="t4-split">
+    <div class="t4-left" id="t4-left"><iframe src="/__dev" title="Tina4 Dev Admin"></iframe></div>
+    <div class="t4-gutter" id="t4-gutter"></div>
+    <div class="t4-right" id="t4-right">
+      <div class="t4-stage" id="t4-stage">
+        <div class="t4-device desktop" id="t4-device">
+          <iframe id="t4-preview" src="/" title="Live preview"></iframe>
+        </div>
+      </div>
+    </div>
+  </div>
+  <script>
+  (function () {
+    var SIZES = { mobile: {w:390,h:844}, tablet: {w:820,h:1180}, desktop: {w:1440,h:900} };
+    var KEY = 'tina4_split_device';
+    var device = document.getElementById('t4-device');
+    var stage = document.getElementById('t4-stage');
+    var dim = document.getElementById('t4-dim');
+    var left = document.getElementById('t4-left');
+    var right = document.getElementById('t4-right');
+    var gutter = document.getElementById('t4-gutter');
+    var split = document.getElementById('t4-split');
+    var mode = 'desktop';
+    try { var saved = localStorage.getItem(KEY); if (saved && SIZES[saved]) mode = saved; } catch (_) {}
+    var leftWidth = '58%';
+
+    // ── device preview ──
+    function fit() {
+      if (right.classList.contains('t4-hidden')) return;
+      if (mode === 'desktop') {
+        // Desktop just fills the preview block - responsive, no frame, no scale.
+        device.style.transform = 'none';
+        device.style.width = '100%';
+        device.style.height = '100%';
+        var r0 = stage.getBoundingClientRect();
+        if (dim) dim.textContent = Math.round(r0.width) + ' x ' + Math.round(r0.height);
+        return;
+      }
+      var s = SIZES[mode];
+      device.style.transform = 'none';
+      device.style.width = s.w + 'px';
+      device.style.height = s.h + 'px';
+      var rect = stage.getBoundingClientRect();
+      var pad = 28;
+      var ow = device.offsetWidth, oh = device.offsetHeight;
+      var scale = Math.min((rect.width - pad) / ow, (rect.height - pad) / oh, 1);
+      if (!isFinite(scale) || scale <= 0) scale = 1;
+      device.style.transform = 'scale(' + scale + ')';
+    }
+    function setMode(m) {
+      if (!SIZES[m]) return;
+      mode = m;
+      device.className = 't4-device ' + m;
+      if (dim) dim.textContent = SIZES[m].w + ' x ' + SIZES[m].h;
+      document.querySelectorAll('.t4-devbtn').forEach(function (b) {
+        b.classList.toggle('active', b.getAttribute('data-mode') === m);
+      });
+      try { localStorage.setItem(KEY, m); } catch (_) {}
+      fit();
+    }
+    document.querySelectorAll('.t4-devbtn').forEach(function (b) {
+      b.addEventListener('click', function () { setMode(b.getAttribute('data-mode')); });
+    });
+    var pop = document.getElementById('t4-popout');
+    if (pop) pop.addEventListener('click', function () {
+      var s = SIZES[mode];
+      var w = Math.min(s.w, (screen.availWidth || 1920) - 40);
+      var h = Math.min(s.h, (screen.availHeight || 1080) - 120);
+      window.open('/', 'tina4preview_' + mode, 'width=' + w + ',height=' + h + ',menubar=no,toolbar=no,location=no');
+    });
+
+    // ── show / hide each panel (Files, Editor, Preview) ──
+    // Files (the nav) and Editor (the code area) are SEPARATE sections living
+    // inside the left /__dev SPA iframe, so hiding the editor must not take the
+    // file nav with it. They are same-origin, so we reach into the iframe and
+    // toggle its own `#editor-sidebar` (nav) and `.editor-main` (editor). The
+    // Preview is the right pane of this page.
+    var vis = { files: true, editor: true, preview: true };
+    function frameDoc() {
+      try { return document.querySelector('#t4-left iframe').contentDocument; } catch (_) { return null; }
+    }
+    function setFrameEl(sel, show) {
+      var d = frameDoc(); if (!d) return;
+      var el = d.querySelector(sel); if (el) el.style.display = show ? '' : 'none';
+    }
+    function applyPanels() {
+      setFrameEl('#editor-sidebar', vis.files);
+      setFrameEl('#editor-splitter-left', vis.files && vis.editor);
+      setFrameEl('.editor-main', vis.editor);
+      var leftEmpty = !vis.files && !vis.editor;
+      left.classList.toggle('t4-hidden', leftEmpty);
+      right.classList.toggle('t4-hidden', !vis.preview);
+      gutter.classList.toggle('t4-hidden', leftEmpty || !vis.preview);
+      if (!vis.preview) {
+        // Preview hidden: the editor/nav fills the whole width.
+        left.style.flex = '1 1 auto'; left.style.width = 'auto';
+      } else if (vis.files && !vis.editor) {
+        // Only the file nav is shown: shrink the left pane to the nav width so
+        // there is no empty gap where the editor used to be.
+        left.style.flex = '0 0 auto'; left.style.width = '250px';
+      } else {
+        left.style.flex = '0 0 auto'; left.style.width = leftWidth;
+      }
+      document.getElementById('t4-tg-files').classList.toggle('active', vis.files);
+      document.getElementById('t4-tg-editor').classList.toggle('active', vis.editor);
+      document.getElementById('t4-tg-preview').classList.toggle('active', vis.preview);
+      fit();
+    }
+    function toggle(name) {
+      // Never hide all three - at least one stays visible.
+      var n = { files: vis.files, editor: vis.editor, preview: vis.preview };
+      n[name] = !n[name];
+      if (!n.files && !n.editor && !n.preview) return;
+      vis[name] = !vis[name];
+      applyPanels();
+    }
+    document.getElementById('t4-tg-files').addEventListener('click', function () { toggle('files'); });
+    document.getElementById('t4-tg-editor').addEventListener('click', function () { toggle('editor'); });
+    document.getElementById('t4-tg-preview').addEventListener('click', function () { toggle('preview'); });
+
+    // ── drag the gutter to resize ──
+    var dragging = false;
+    gutter.addEventListener('mousedown', function (e) {
+      dragging = true;
+      document.body.classList.add('t4-dragging');
+      gutter.classList.add('drag');
+      e.preventDefault();
+    });
+    window.addEventListener('mousemove', function (e) {
+      if (!dragging) return;
+      var r = split.getBoundingClientRect();
+      var w = e.clientX - r.left;
+      w = Math.max(220, Math.min(w, r.width - 260));
+      leftWidth = w + 'px';
+      left.style.width = leftWidth;
+      fit();
+    });
+    window.addEventListener('mouseup', function () {
+      if (!dragging) return;
+      dragging = false;
+      document.body.classList.remove('t4-dragging');
+      gutter.classList.remove('drag');
+    });
+
+    window.addEventListener('resize', fit);
+    setMode(mode);
+    applyPanels();
+  })();
+  </script>
+</body></html>