thinkncollab-shell 2.0.0-beta.2 → 2.0.0-beta.3

package/dist/src/dock/ui/page.js

@@ -68,6 +68,23 @@ dl { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 4px 10px; m
 #toast { position: fixed; right: 16px; bottom: 16px; max-width: 420px; display: grid; gap: 8px; z-index: 5; }
 #toast div { background: var(--panel); border: 1px solid var(--bad); color: var(--text); padding: 10px 12px; border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,.15); }
 #locked { padding: 60px 20px; text-align: center; color: var(--muted); }
+#toast div.ok { border-color: var(--ok); }
+input.search, .form input[type=text], .form input[type=number], .form textarea, .form select { font: inherit; font-size: 13px; color: var(--text); background: var(--bg); border: 1px solid var(--line); border-radius: 7px; padding: 5px 8px; }
+input.search { min-width: 220px; }
+tr.group td { background: var(--chip); font-weight: 600; cursor: default; }
+.form { display: grid; gap: 18px; max-width: 760px; }
+.form fieldset { border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; margin: 0; display: grid; gap: 10px; }
+.form legend { font-weight: 600; padding: 0 6px; }
+.form .field { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 10px; align-items: center; }
+.form .field > span { color: var(--muted); font-size: 13px; }
+.form textarea { min-height: 54px; resize: vertical; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; }
+.form .hint { color: var(--muted); font-size: 12px; grid-column: 2; margin-top: -6px; }
+@media (max-width: 640px) { .form .field { grid-template-columns: 1fr; } .form .hint { grid-column: 1; } }
+pre.term { background: var(--code); color: var(--codetext); margin: 0; padding: 12px; border-radius: 8px; height: 360px; overflow: auto; white-space: pre-wrap; word-break: break-all; font: 12.5px/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; outline: none; }
+pre.term:focus { box-shadow: 0 0 0 2px var(--accent); }
+.seg { display: inline-flex; border: 1px solid var(--line); border-radius: 7px; overflow: hidden; }
+.seg button { border: 0; background: var(--panel); color: var(--muted); font: inherit; font-size: 12.5px; padding: 4px 10px; cursor: pointer; }
+.seg button.on { background: var(--chip); color: var(--text); }
 </style>
 </head>
 <body>
@@ -86,6 +103,7 @@ dl { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 4px 10px; m
 (function () {
   'use strict';
   var token = (location.hash.match(/t=([0-9a-f]+)/) || [])[1] || sessionStorage.getItem('tnc-ui-token');
+  var startTab = (location.hash.match(/tab=([a-z]+)/) || [])[1];
   if (token) { sessionStorage.setItem('tnc-ui-token', token); history.replaceState(null, '', location.pathname); }
 
   var root = document.documentElement;
@@ -108,13 +126,15 @@ dl { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 4px 10px; m
     (kids || []).forEach(function (c) { if (c != null) n.appendChild(typeof c === 'string' ? document.createTextNode(c) : c); });
     return n;
   }
-  function toast(msg) {
-    var box = el('div', { text: msg });
+  function toast(msg, ok) {
+    var box = el('div', { text: msg, class: ok ? 'ok' : '' });
     document.getElementById('toast').appendChild(box);
     setTimeout(function () { box.remove(); }, 6000);
   }
-  function api(method, path) {
-    return fetch('/api' + path, { method: method, headers: { 'x-tnc-ui': token || '' } }).then(function (r) {
+  function api(method, path, body, prefix) {
+    var headers = { 'x-tnc-ui': token || '' };
+    if (body !== undefined) headers['Content-Type'] = 'application/json';
+    return fetch((prefix || '/api') + path, { method: method, headers: headers, body: body === undefined ? undefined : JSON.stringify(body) }).then(function (r) {
       if (r.status === 204 || r.status === 304) return null;
       return r.text().then(function (t) {
         var body; try { body = t ? JSON.parse(t) : null; } catch (e) { body = t; }
@@ -132,8 +152,11 @@ dl { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 4px 10px; m
   var ago = function (s) { var d = Date.now() / 1000 - s; if (d < 60) return 'just now'; if (d < 3600) return Math.floor(d / 60) + ' min ago'; if (d < 86400) return Math.floor(d / 3600) + ' h ago'; return Math.floor(d / 86400) + ' d ago'; };
   var short = function (id) { return String(id || '').replace(/^sha256:/, '').slice(0, 12); };
 
-  var TABS = ['Containers', 'Images', 'Volumes', 'Networks', 'System'];
-  var state = { tab: 'Containers', all: true, selected: null };
+  var TABS = ['Containers', 'Images', 'Volumes', 'Networks', 'System', 'Settings', 'Troubleshoot'];
+  var state = { tab: 'Containers', all: true, selected: null, filter: '', pane: 'logs' };
+  TABS.forEach(function (t) { if (startTab && t.toLowerCase() === startTab) state.tab = t; });
+  var ui = function (method, path, body) { return api(method, path, body, '/ui'); };
+  var PROJECT = 'tnc.compose.project';
   var view = document.getElementById('view');
 
   function renderTabs() {
@@ -153,12 +176,39 @@ dl { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 4px 10px; m
   /* ── containers ── */
   function containers() {
     return api('GET', '/containers/json' + (state.all ? '?all=1' : '')).then(function (list) {
+      var q = state.filter.toLowerCase();
+      if (q) list = list.filter(function (c) { return ((c.Names || []).join(' ') + ' ' + c.Image + ' ' + ((c.Labels || {})[PROJECT] || '')).toLowerCase().indexOf(q) !== -1; });
+      var search = el('input', { class: 'search', type: 'search', placeholder: 'Search name, image or app', value: state.filter, oninput: function (e) { state.filter = e.target.value; refresh(); } });
       var bar = el('div', { class: 'toolbar' }, [
+        search,
         el('label', null, [el('input', { type: 'checkbox', checked: state.all, onchange: function (e) { state.all = e.target.checked; refresh(); } }), 'show stopped']),
         el('span', { class: 'spacer' }),
         btn('Remove stopped', function () { act('POST', '/containers/prune', 'Remove every stopped container?'); }),
       ]);
-      var rows = list.map(function (c) {
+      // compose apps first (grouped by project), then single containers
+      list.sort(function (a, b) {
+        var pa = (a.Labels || {})[PROJECT] || '\uffff', pb = (b.Labels || {})[PROJECT] || '\uffff';
+        return pa < pb ? -1 : pa > pb ? 1 : (a.Names[0] < b.Names[0] ? -1 : 1);
+      });
+      var rows = [];
+      var lastGroup = null;
+      list.forEach(function (c) {
+        var project = (c.Labels || {})[PROJECT] || null;
+        if (project !== lastGroup) {
+          lastGroup = project;
+          var members = list.filter(function (x) { return ((x.Labels || {})[PROJECT] || null) === project; });
+          var up = members.filter(function (x) { return x.State === 'running'; });
+          rows.push(el('tr', { class: 'group' }, [
+            el('td', { colspan: '5', text: project ? project + '  ·  ' + up.length + '/' + members.length + ' running' : 'Other containers' }),
+            el('td', null, [project ? el('div', { class: 'actions' }, [
+              btn('Start all', function () { Promise.all(members.filter(function (x) { return x.State !== 'running'; }).map(function (x) { return api('POST', '/containers/' + x.Id + '/start'); })).then(refresh).catch(function (e) { toast(e.message); }); }, { disabled: up.length === members.length }),
+              btn('Stop all', function () { Promise.all(up.map(function (x) { return api('POST', '/containers/' + x.Id + '/stop'); })).then(refresh).catch(function (e) { toast(e.message); }); }, { disabled: !up.length }),
+            ]) : null]),
+          ]));
+        }
+        rows.push(containerRow(c));
+      });
+      function containerRow(c) {
         var name = (c.Names && c.Names[0] || '').replace(/^\//, '');
         var st = c.State;
         var ports = (c.Ports || []).filter(function (p) { return p.PublicPort; }).map(function (p) { return p.PublicPort + '→' + p.PrivatePort + (p.Type === 'udp' ? '/udp' : ''); }).join(', ');
@@ -177,20 +227,23 @@ dl { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 4px 10px; m
           el('td', { class: 'muted', text: ago(c.Created) }),
           el('td', null, [acts]),
         ]);
-      });
+      }
+      var focused = document.activeElement && document.activeElement.classList.contains('search');
       view.textContent = '';
       view.appendChild(bar);
+      if (focused) { search.focus(); search.setSelectionRange(search.value.length, search.value.length); }
       view.appendChild(table(['Name', 'Image', 'Status', 'Ports', 'Created', ''], rows, 'No containers yet. Start one with: thinknsh run -d nginx:alpine'));
       var sel = list.filter(function (c) { return c.Id === state.selected; })[0];
       if (sel) detail(sel); else stopDetail();
     });
   }
 
-  var live = { id: null, logs: null, stats: null };
+  var live = { id: null, logs: null, stats: null, term: null };
   function stopDetail() {
     if (live.logs) live.logs.abort();
     if (live.stats) clearInterval(live.stats);
-    live = { id: null, logs: null, stats: null };
+    if (live.term) live.term.close();
+    live = { id: null, logs: null, stats: null, term: null };
   }
 
   function detail(c) {
@@ -200,10 +253,21 @@ dl { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 4px 10px; m
     stopDetail();
     live.id = key;
     var logs = el('pre', { class: 'logs', text: '' });
+    var term = el('pre', { class: 'term', tabindex: '0', hidden: true });
+    var logFilter = el('input', { class: 'search', type: 'search', placeholder: 'Filter log lines', oninput: function () { logs.applyFilter(logFilter.value); } });
+    var seg = el('div', { class: 'seg' });
+    var showPane = function (pane) {
+      state.pane = pane;
+      logs.hidden = pane !== 'logs'; logFilter.hidden = pane !== 'logs'; term.hidden = pane !== 'terminal';
+      Array.prototype.forEach.call(seg.children, function (b) { b.className = b.getAttribute('data-pane') === pane ? 'on' : ''; });
+      if (pane === 'terminal') { if (!live.term) live.term = openTerminal(c.Id, term); term.focus(); }
+    };
+    seg.appendChild(el('button', { text: 'Logs', 'data-pane': 'logs', onclick: function () { showPane('logs'); } }));
+    if (running) seg.appendChild(el('button', { text: 'Terminal', 'data-pane': 'terminal', onclick: function () { showPane('terminal'); } }));
     var cpu = el('div', { class: 'v', text: '–' }), cpuBar = el('i'), mem = el('div', { class: 'v', text: '–' }), memBar = el('i'), net = el('div', { class: 'v', text: '–' }), pids = el('div', { class: 'v', text: '–' });
     var info = el('dl');
     var box = el('div', { class: 'detail', id: 'detail' }, [
-      el('div', null, [el('div', { class: 'toolbar' }, [el('strong', { text: 'Logs' }), el('span', { class: 'muted', text: running ? 'following' : 'last 500 lines' })]), logs]),
+      el('div', null, [el('div', { class: 'toolbar' }, [seg, logFilter, el('span', { class: 'muted', text: running ? 'following' : 'last 500 lines' })]), logs, term]),
       el('div', { class: 'stats' }, [
         el('div', { class: 'stat' }, [el('div', { class: 'k', text: 'CPU' }), cpu, el('div', { class: 'bar' }, [cpuBar])]),
         el('div', { class: 'stat' }, [el('div', { class: 'k', text: 'Memory' }), mem, el('div', { class: 'bar' }, [memBar])]),
@@ -213,6 +277,7 @@ dl { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 4px 10px; m
       ]),
     ]);
     view.appendChild(box);
+    showPane(running && state.pane === 'terminal' ? 'terminal' : 'logs');
 
     api('GET', '/containers/' + c.Id + '/json').then(function (d) {
       var add = function (k, v) { if (v) { info.appendChild(el('dt', { text: k })); info.appendChild(el('dd', { class: 'mono', text: v })); } };
@@ -250,12 +315,26 @@ dl { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 4px 10px; m
   function streamLogs(id, tty, follow, pre) {
     var ctl = new AbortController();
     live.logs = ctl;
+    // every line is kept (up to 20000) so the filter can search all of them
+    var all = [''], filter = '';
+    var render = function () {
+      var q = filter.toLowerCase();
+      pre.textContent = all.filter(function (l) { return l.toLowerCase().indexOf(q) !== -1; }).join('\n');
+    };
+    pre.applyFilter = function (q) { filter = q; if (q) render(); else pre.textContent = all.join('\n'); pre.scrollTop = pre.scrollHeight; };
     fetch('/api/containers/' + id + '/logs?stdout=1&stderr=1&tail=500' + (follow ? '&follow=1' : ''), { headers: { 'x-tnc-ui': token }, signal: ctl.signal }).then(function (r) {
       if (!r.ok || !r.body) return;
       var reader = r.body.getReader(), dec = new TextDecoder(), buf = new Uint8Array(0);
+      var pendingRender = null;
       var push = function (bytes) {
         var atEnd = pre.scrollTop + pre.clientHeight >= pre.scrollHeight - 20;
-        pre.appendChild(document.createTextNode(dec.decode(bytes, { stream: true })));
+        var text = dec.decode(bytes, { stream: true });
+        var parts = text.split('\n');
+        all[all.length - 1] += parts[0];
+        for (var i = 1; i < parts.length; i++) all.push(parts[i]);
+        if (all.length > 20000) all.splice(0, all.length - 20000);
+        if (filter) { if (!pendingRender) pendingRender = setTimeout(function () { pendingRender = null; render(); }, 200); return; }
+        pre.appendChild(document.createTextNode(text));
         if (pre.childNodes.length > 4000) pre.removeChild(pre.firstChild);
         if (atEnd) pre.scrollTop = pre.scrollHeight;
       };
@@ -277,6 +356,138 @@ dl { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 4px 10px; m
     }).catch(function () {});
   }
 
+  /*
+    Terminal: a shell (TTY exec) over a WebSocket. A small line renderer:
+    escape sequences are dropped, \r and backspace edit the current line.
+    Enough for shells and command output; full-screen programs need ssh/exec.
+  */
+  function openTerminal(id, pre) {
+    var sock = new WebSocket((location.protocol === 'https:' ? 'wss://' : 'ws://') + location.host + '/ui/terminal?id=' + encodeURIComponent(id), ['tnc-ui.' + token]);
+    sock.binaryType = 'arraybuffer';
+    var dec = new TextDecoder(), lines = [''], col = 0;
+    var draw = function () {
+      pre.textContent = lines.join('\n');
+      pre.scrollTop = pre.scrollHeight;
+    };
+    var feed = function (text) {
+      text = text.replace(/\x1b\[[0-9;?]*[ -\/]*[@-~]|\x1b\][^\x07\x1b]*(\x07|\x1b\\)|\x1b[()][0-9A-Za-z]|\x1b[=>78]/g, '');
+      for (var i = 0; i < text.length; i++) {
+        var ch = text[i], cur = lines[lines.length - 1];
+        if (ch === '\n') { lines.push(''); col = 0; }
+        else if (ch === '\r') { col = 0; }
+        else if (ch === '\b') { if (col > 0) col--; }
+        else if (ch === '\x07') { }
+        else { lines[lines.length - 1] = cur.slice(0, col) + ch + cur.slice(col + 1); col++; }
+      }
+      if (lines.length > 5000) lines.splice(0, lines.length - 5000);
+      draw();
+    };
+    var resize = function () {
+      var w = Math.max(20, Math.floor(pre.clientWidth / 7.6)), h = Math.max(5, Math.floor(pre.clientHeight / 18));
+      if (sock.readyState === 1) sock.send(JSON.stringify({ resize: [h, w] }));
+    };
+    sock.onopen = function () { resize(); };
+    sock.onmessage = function (e) { feed(typeof e.data === 'string' ? e.data : dec.decode(new Uint8Array(e.data), { stream: true })); };
+    sock.onclose = function () { feed('\r\n[session ended]'); };
+    sock.onerror = function () { toast('terminal: cannot connect'); };
+    var KEYS = { Enter: '\r', Backspace: '\x7f', Tab: '\t', Escape: '\x1b', ArrowUp: '\x1b[A', ArrowDown: '\x1b[B', ArrowRight: '\x1b[C', ArrowLeft: '\x1b[D', Home: '\x1b[H', End: '\x1b[F', Delete: '\x1b[3~' };
+    pre.onkeydown = function (e) {
+      if (sock.readyState !== 1) return;
+      var data = null;
+      if (e.ctrlKey && !e.metaKey && e.key.length === 1) {
+        var code = e.key.toUpperCase().charCodeAt(0);
+        if (code >= 64 && code <= 95) data = String.fromCharCode(code - 64);
+      } else if (KEYS[e.key]) data = KEYS[e.key];
+      else if (e.key.length === 1 && !e.metaKey) data = e.key;
+      if (data !== null) { e.preventDefault(); sock.send(data); }
+    };
+    pre.onpaste = function (e) { e.preventDefault(); var t = (e.clipboardData || window.clipboardData).getData('text'); if (t && sock.readyState === 1) sock.send(t); };
+    return { close: function () { try { sock.close(); } catch (e) {} } };
+  }
+
+  /* ── settings ── */
+  function settings() {
+    return ui('GET', '/settings').then(function (d) {
+      var s = d.settings, saved = d.saved || {}, p = s.proxy || {};
+      var lines = function (a) { return (a || []).join('\n'); };
+      var split = function (t) { return t.split(/[\n,]/).map(function (x) { return x.trim(); }).filter(Boolean); };
+      var field = function (label, input, hint) {
+        return el('label', { class: 'field' }, [el('span', { text: label }), input, hint ? el('div', { class: 'hint', text: hint }) : null]);
+      };
+      var input = function (value, type, attrs) { var a = attrs || {}; a.type = type || 'text'; a.value = value == null ? '' : String(value); return el('input', a); };
+      var area = function (value, placeholder) { var t = el('textarea', { placeholder: placeholder }); t.value = value; return t; };
+      var f = {
+        autostart: el('input', { type: 'checkbox', checked: d.autostart.enabled }),
+        cpus: input(s.cpus, 'number', { min: '1' }), memoryGB: input((s.memoryMB / 1024).toFixed(1).replace(/\.0$/, ''), 'number', { min: '0.5', step: '0.5' }),
+        diskGB: input(s.diskGB, 'number', { min: '8' }), shares: area(lines(saved.shares), '/Users/me/projects'),
+        http: input(p.http, 'text', { placeholder: 'http://proxy.corp:3128' }), https: input(p.https, 'text', { placeholder: 'http://proxy.corp:3128' }),
+        noProxy: input(p.noProxy, 'text', { placeholder: '.corp, 10.0.0.0/8' }), proxyContainers: el('input', { type: 'checkbox', checked: p.containers !== false }),
+        caCerts: area(lines(saved.caCerts), '/Users/me/corp-root-ca.pem'),
+        mirrors: area(lines(saved.registryMirrors), 'https://mirror.gcr.io'), insecure: area(lines(saved.insecureRegistries), 'registry.lan:5000'),
+        credentialStore: el('select', null, [el('option', { value: 'auto', text: 'System keychain (' + d.credentials + ')' }), el('option', { value: 'file', text: 'auth.json file (mode 0600)' })]),
+      };
+      f.credentialStore.value = s.credentialStore || 'auto';
+      var save = function () {
+        var patch = {
+          autostart: f.autostart.checked,
+          cpus: Number(f.cpus.value), memoryMB: Math.round(Number(f.memoryGB.value) * 1024), diskGB: Number(f.diskGB.value),
+          shares: split(f.shares.value),
+          proxy: { http: f.http.value.trim() || undefined, https: f.https.value.trim() || undefined, noProxy: f.noProxy.value.trim() || undefined, containers: f.proxyContainers.checked ? undefined : false },
+          caCerts: split(f.caCerts.value), registryMirrors: split(f.mirrors.value), insecureRegistries: split(f.insecure.value),
+          credentialStore: f.credentialStore.value,
+        };
+        ui('PUT', '/settings', patch).then(function () { toast('Saved. VM settings apply after "Restart Linux VM"; proxy and CA after "Restart dock".', true); refresh(); }).catch(function (e) { toast(e.message); });
+      };
+      var form = el('div', { class: 'form' }, [
+        el('fieldset', null, [el('legend', { text: 'General' }),
+          field('Start at login', f.autostart, 'Starts the engine (and the menu-bar app, if installed) when you log in.'),
+          field('Logins stored in', f.credentialStore)]),
+        d.platform === 'darwin' ? el('fieldset', null, [el('legend', { text: 'Linux VM' }),
+          field('CPUs', f.cpus), field('Memory (GB)', f.memoryGB, 'A ceiling: macOS backs only the memory containers use.'),
+          field('Disk size (GB)', f.diskGB, 'Used when the data disk is created.'),
+          field('Shared folders', f.shares, 'Extra folders for bind mounts, besides your home, /tmp and /Volumes. One per line.')]) : null,
+        el('fieldset', null, [el('legend', { text: 'Proxy' }),
+          field('HTTP proxy', f.http), field('HTTPS proxy', f.https), field('Bypass for', f.noProxy, 'Comma-separated hosts or domains.'),
+          field('Pass to containers', f.proxyContainers, 'Builds and new containers get the proxy variables (localhost becomes host.tnc.internal).'),
+          d.nodeProxy ? null : el('div', { class: 'hint', text: 'This Node version ignores proxy settings: install Node 22.21+ or 24.5+.' })]),
+        el('fieldset', null, [el('legend', { text: 'Registries' }),
+          field('Mirrors', f.mirrors, 'Tried first for images from the public default registry. One URL per line.'),
+          field('Insecure (plain HTTP)', f.insecure, 'host or host:port, one per line. localhost needs no entry.'),
+          field('Extra CA certificates', f.caCerts, 'PEM files your company signs registry certificates with. One path per line.')]),
+        el('div', { class: 'actions' }, [
+          btn('Save', save),
+          btn('Restart dock', function () { if (confirm('Restart dock? Containers keep running in the Linux VM.')) ui('POST', '/engine/restart').then(function (r) { toast(r.message, true); }).catch(function (e) { toast(e.message); }); }),
+          d.platform !== 'linux' ? btn('Restart Linux VM', function () { if (confirm('Restart the Linux VM? Running containers stop.')) ui('POST', '/vm/restart').then(function (r) { toast(r.message, true); }).catch(function (e) { toast(e.message); }); }) : null,
+        ]),
+      ]);
+      view.textContent = '';
+      view.appendChild(form);
+    });
+  }
+
+  /* ── troubleshoot ── */
+  function troubleshoot() {
+    return ui('GET', '/log').then(function (d) {
+      var pre = el('pre', { class: 'logs', text: d.log || '(empty)' });
+      var confirmBox = el('input', { class: 'search', type: 'text', placeholder: 'type reset to confirm' });
+      view.textContent = '';
+      view.appendChild(el('div', { class: 'grid' }, [
+        el('div', { class: 'stat' }, [el('div', { class: 'k', text: 'Diagnostics' }), el('p', { class: 'muted', text: 'A .tar.gz with versions, settings, the container list and recent logs, for a bug report. No logins or secrets.' }),
+          btn('Create bundle', function () { ui('POST', '/diagnose').then(function (r) { toast('Saved: ' + r.file, true); }).catch(function (e) { toast(e.message); }); })]),
+        el('div', { class: 'stat' }, [el('div', { class: 'k', text: 'Clean up' }), el('p', { class: 'muted', text: 'Stopped containers, unused networks, untagged images. Volumes are kept.' }),
+          btn('Clean up', function () {
+            if (!confirm('Remove stopped containers, unused networks and untagged images?')) return;
+            Promise.all([api('POST', '/containers/prune'), api('POST', '/networks/prune'), api('POST', '/images/prune')]).then(function () { toast('Cleaned up', true); }).catch(function (e) { toast(e.message); });
+          })]),
+        el('div', { class: 'stat' }, [el('div', { class: 'k', text: 'Reset to factory defaults' }), el('p', { class: 'muted', text: 'Deletes ALL containers, images, volumes and the VM disk. Settings and logins are kept.' }),
+          el('div', { class: 'actions' }, [confirmBox, btn('Reset', function () { ui('POST', '/reset', { confirm: confirmBox.value.trim() }).then(function (r) { toast(r.message, true); }).catch(function (e) { toast(e.message); }); }, { danger: true })])]),
+      ]));
+      view.appendChild(el('div', { class: 'toolbar', style: 'margin-top:14px' }, [el('strong', { text: 'Engine log' }), el('span', { class: 'muted', text: 'last 400 lines' })]));
+      view.appendChild(pre);
+      pre.scrollTop = pre.scrollHeight;
+    });
+  }
+
   /* ── images, volumes, networks, system ── */
   function images() {
     return api('GET', '/images/json').then(function (list) {
@@ -353,9 +564,11 @@ dl { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 4px 10px; m
     });
   }
 
-  var VIEWS = { Containers: containers, Images: images, Volumes: volumes, Networks: networks, System: system };
+  var VIEWS = { Containers: containers, Images: images, Volumes: volumes, Networks: networks, System: system, Settings: settings, Troubleshoot: troubleshoot };
   var pending = null;
-  function refresh() {
+  function refresh(fromEvent) {
+    // forms are not redrawn by engine events (that would drop what is being typed)
+    if (fromEvent === true && (state.tab === 'Settings' || state.tab === 'Troubleshoot')) return;
     clearTimeout(pending);
     pending = setTimeout(function () { VIEWS[state.tab]().catch(function (e) { toast(e.message); }); }, 60);
   }
@@ -365,7 +578,7 @@ dl { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 4px 10px; m
     fetch('/api/events', { headers: { 'x-tnc-ui': token } }).then(function (r) {
       if (!r.ok || !r.body) throw new Error('events');
       var reader = r.body.getReader();
-      var pump = function () { return reader.read().then(function (res) { if (res.done) throw new Error('ended'); refresh(); return pump(); }); };
+      var pump = function () { return reader.read().then(function (res) { if (res.done) throw new Error('ended'); refresh(true); return pump(); }); };
       return pump();
     }).catch(function () { setTimeout(events, 3000); });
   }

package/dist/src/dock/ui/server.js

@@ -4,4 +4,4 @@
  * PROPRIETARY INTELLECTUAL PROPERTY & TRADE SECRETS.
  * UNAUTHORIZED REVERSE ENGINEERING, DECOMPILATION, OR RE-DISTRIBUTION IS STRICTLY PROHIBITED.
  */
-"use strict";const http=require("http"),crypto=require("crypto"),{PAGE}=require("./page"),ID="[^/]+",ALLOWED=[["GET",/^\/.*$/],["POST",new RegExp(`^/containers/${ID}/(start|stop|restart|kill|pause|unpause)$`)],["POST",/^\/(containers|images|volumes|networks)\/prune$/],["DELETE",new RegExp(`^/(containers|volumes|networks)/${ID}$`)],["DELETE",/^\/images\/.+$/]],BLOCKED=/\/(archive|export|attach|exec)$|^\/exec\/|^\/images\/(.+\/)?get$|^\/(session|grpc)$/;function allowed(e,t){return!BLOCKED.test(t)&&ALLOWED.some(([n,o])=>n===e&&o.test(t))}function sameToken(e,t){const n=Buffer.from(String(e||"")),o=Buffer.from(String(t||""));return n.length===o.length&&crypto.timingSafeEqual(n,o)}function startUi({socketPath:e,port:t=0,token:n=crypto.randomBytes(24).toString("hex")}={}){let o=null;const r=http.createServer((t,r)=>{const s=new URL(t.url,"http://ui"),a=(e,t)=>{r.writeHead(e,{"Content-Type":"application/json","Cache-Control":"no-store"}),r.end(JSON.stringify({message:t}))};if(i=t.headers.host,null===o||i!==`127.0.0.1:${o}`&&i!==`localhost:${o}`)return a(421,"wrong Host");var i;const c={"Cache-Control":"no-store","X-Content-Type-Options":"nosniff","X-Frame-Options":"DENY","Referrer-Policy":"no-referrer"};if("GET"===t.method&&("/"===s.pathname||"/index.html"===s.pathname))return r.writeHead(200,{...c,"Content-Type":"text/html; charset=utf-8","Content-Security-Policy":"default-src 'none'; script-src 'unsafe-inline'; style-src 'unsafe-inline'; connect-src 'self'; img-src data:; base-uri 'none'; form-action 'none'; frame-ancestors 'none'"}),r.end(PAGE);if(!s.pathname.startsWith("/api/"))return a(404,"not found");if(!sameToken(t.headers["x-tnc-ui"],n))return a(403,"missing or wrong session token");const l=s.pathname.slice(4);if(!allowed(t.method,l))return a(403,`${t.method} ${l} is not available from the dashboard`);const p=http.request({socketPath:e,method:t.method,path:l+s.search,headers:{"Content-Type":t.headers["content-type"]||"application/json",...t.headers["content-length"]?{"Content-Length":t.headers["content-length"]}:{}}},e=>{r.writeHead(e.statusCode,{...c,"Content-Type":e.headers["content-type"]||"application/octet-stream"}),e.pipe(r),r.on("close",()=>e.destroy())});p.on("error",e=>{r.headersSent?r.end():a(502,`dock is not reachable: ${e.message}`)}),t.pipe(p)});return new Promise((e,s)=>{r.once("error",s),r.listen(t,"127.0.0.1",()=>{o=r.address().port,e({port:o,token:n,url:`http://127.0.0.1:${o}/#t=${n}`,close:()=>new Promise(e=>{r.closeAllConnections?.(),r.close(()=>e())})})})})}module.exports={startUi,allowed};
+"use strict";const fs=require("fs"),path=require("path"),http=require("http"),crypto=require("crypto"),{spawn}=require("child_process"),{PAGE}=require("./page"),ws=require("../api/websocket"),CLI=path.join(__dirname,"..","..","..","bin","thinknsh.js"),ID="[^/]+",ALLOWED=[["GET",/^\/.*$/],["POST",new RegExp(`^/containers/${ID}/(start|stop|restart|kill|pause|unpause)$`)],["POST",/^\/(containers|images|volumes|networks)\/prune$/],["DELETE",new RegExp(`^/(containers|volumes|networks)/${ID}$`)],["DELETE",/^\/images\/.+$/]],BLOCKED=/\/(archive|export|attach|exec)$|^\/exec\/|^\/images\/(.+\/)?get$|^\/(session|grpc)$/;function allowed(e,t){return!BLOCKED.test(t)&&ALLOWED.some(([n,r])=>n===e&&r.test(t))}function sameToken(e,t){const n=Buffer.from(String(e||"")),r=Buffer.from(String(t||""));return n.length===r.length&&crypto.timingSafeEqual(n,r)}function readJson(e,t=1<<20){return new Promise((n,r)=>{let o=0;const s=[];e.on("data",n=>{o+=n.length,o>t?(r(new Error("body too large")),e.destroy()):s.push(n)}),e.on("end",()=>{try{n(s.length?JSON.parse(Buffer.concat(s).toString("utf8")):{})}catch(e){r(new Error("invalid JSON"))}}),e.on("error",r)})}function engine(e,t,n,r){return new Promise((o,s)=>{const a=void 0===r?null:Buffer.from(JSON.stringify(r)),i=http.request({socketPath:e,method:t,path:n,headers:a?{"Content-Type":"application/json","Content-Length":a.length}:{}},e=>{const t=[];e.on("data",e=>t.push(e)),e.on("end",()=>{const n=Buffer.concat(t).toString("utf8");let r=n;try{r=n?JSON.parse(n):null}catch(e){}o({status:e.statusCode,body:r})})});i.on("error",s),a&&i.write(a),i.end()})}function settingsView(){const e=require("../config");return{settings:e.effective(),saved:e.readConfig(),defaults:e.defaults(),autostart:require("../setup/autostart").status(),credentials:require("../image/keychain").describe(),nodeProxy:e.nodeHasEnvProxy(),platform:process.platform}}function cli(e){const t=spawn(process.execPath,[CLI,...e],{stdio:"ignore",detached:!0,windowsHide:!0,env:{...process.env,FORCE_COLOR:"0"}});t.on("error",()=>{}),t.unref()}async function uiRoute(e,t,n,{socketPath:r,send:o}){const s=n.pathname.slice(3),a=e.method;if("GET"===a&&"/settings"===s)return o(200,settingsView());if("PUT"===a&&"/settings"===s){const t=require("../config"),n=await readJson(e);if(void 0!==n.autostart){const e=require("../setup/autostart");n.autostart?e.enable():e.disable()}const{autostart:r,...s}=n;return Object.keys(s).length&&t.writeConfig(t.applyPatch(t.readConfig(),s)),o(200,settingsView())}if("POST"===a&&"/engine/restart"===s)return cli(["dock","stop"]),setTimeout(()=>cli(["dock","start"]),1500),o(202,{message:"restarting dock"});if("POST"===a&&"/vm/restart"===s)return cli(["dock","vm-restart","--force"]),o(202,{message:"restarting the Linux VM"});if("POST"===a&&"/diagnose"===s)return o(200,{file:await require("../setup/diagnose").diagnose()});if("POST"===a&&"/reset"===s)return"reset"!==(await readJson(e)).confirm?o(400,{message:"type reset to confirm"}):(cli(["dock","reset","--yes"]),o(202,{message:"resetting dock"}));if("GET"===a&&"/log"===s){const{dockPaths:e}=require("../paths"),{redact:t}=require("../setup/diagnose");let n="";try{n=fs.readFileSync(e().logFile,"utf8").split("\n").slice(-400).join("\n")}catch(e){}return o(200,{log:t(n)})}return o(404,{message:"not found"})}async function terminal(e,t,n,{socketPath:r,id:o}){const s=await engine(r,"POST",`/containers/${encodeURIComponent(o)}/exec`,{AttachStdin:!0,AttachStdout:!0,AttachStderr:!0,Tty:!0,Env:["TERM=xterm-256color"],Cmd:["sh","-c","command -v bash >/dev/null 2>&1 && exec bash -l || exec sh -l"]});if(201!==s.status||!s.body?.Id)throw new Error(s.body?.message||`exec failed: HTTP ${s.status}`);const a=s.body.Id,i=ws.accept(e,t,n,{protocol:e.headers["sec-websocket-protocol"].split(",")[0].trim()}),c=Buffer.from(JSON.stringify({Detach:!1,Tty:!0})),d=http.request({socketPath:r,method:"POST",path:`/exec/${a}/start`,headers:{"Content-Type":"application/json","Content-Length":c.length,Connection:"Upgrade",Upgrade:"tcp"}});d.on("upgrade",(e,t,n)=>{n?.length&&i.send(n,!0),t.on("data",e=>i.send(e,!0)),t.on("close",()=>i.close()),t.on("error",()=>i.close()),i.on("message",(e,n)=>{if(!n&&123===e[0])try{const t=JSON.parse(e.toString("utf8")).resize;return void(Array.isArray(t)&&engine(r,"POST",`/exec/${a}/resize?h=${0|Number(t[0])}&w=${0|Number(t[1])}`).catch(()=>{}))}catch(e){}t.write(e)}),i.on("close",()=>t.destroy())}),d.on("error",e=>{i.send(`\r\n[dock: ${e.message}]\r\n`),i.close()}),d.end(c)}function startUi({socketPath:e,port:t=0,token:n=crypto.randomBytes(24).toString("hex")}={}){let r=null;const o=e=>null!==r&&(e===`127.0.0.1:${r}`||e===`localhost:${r}`),s=http.createServer((t,r)=>{const s=new URL(t.url,"http://ui"),a=(e,t)=>{r.writeHead(e,{"Content-Type":"application/json","Cache-Control":"no-store"}),r.end(JSON.stringify({message:t}))};if(!o(t.headers.host))return a(421,"wrong Host");const i={"Cache-Control":"no-store","X-Content-Type-Options":"nosniff","X-Frame-Options":"DENY","Referrer-Policy":"no-referrer"};if("GET"===t.method&&("/"===s.pathname||"/index.html"===s.pathname))return r.writeHead(200,{...i,"Content-Type":"text/html; charset=utf-8","Content-Security-Policy":"default-src 'none'; script-src 'unsafe-inline'; style-src 'unsafe-inline'; connect-src 'self'; img-src data:; base-uri 'none'; form-action 'none'; frame-ancestors 'none'"}),r.end(PAGE);if(s.pathname.startsWith("/ui/")){if(!sameToken(t.headers["x-tnc-ui"],n))return a(403,"missing or wrong session token");const o=(e,t)=>(r.writeHead(e,{...i,"Content-Type":"application/json"}),r.end(JSON.stringify(t)),!0);return void uiRoute(t,r,s,{socketPath:e,send:o}).catch(e=>{r.headersSent?r.end():o(e.statusCode||500,{message:e.message})})}if(!s.pathname.startsWith("/api/"))return a(404,"not found");if(!sameToken(t.headers["x-tnc-ui"],n))return a(403,"missing or wrong session token");const c=s.pathname.slice(4);if(!allowed(t.method,c))return a(403,`${t.method} ${c} is not available from the dashboard`);const d=http.request({socketPath:e,method:t.method,path:c+s.search,headers:{"Content-Type":t.headers["content-type"]||"application/json",...t.headers["content-length"]?{"Content-Length":t.headers["content-length"]}:{}}},e=>{r.writeHead(e.statusCode,{...i,"Content-Type":e.headers["content-type"]||"application/octet-stream"}),e.pipe(r),r.on("close",()=>e.destroy())});d.on("error",e=>{r.headersSent?r.end():a(502,`dock is not reachable: ${e.message}`)}),t.pipe(d)});return s.on("upgrade",(t,s,a)=>{s.on("error",()=>{});const i=(e,t)=>{s.end(`HTTP/1.1 ${e} ${t}\r\nContent-Length: 0\r\nConnection: close\r\n\r\n`)},c=new URL(t.url,"http://ui");if(!o(t.headers.host)||(d=t.headers.origin,null===r||d!==`http://127.0.0.1:${r}`&&d!==`http://localhost:${r}`))return i(403,"Forbidden");var d;if("/ui/terminal"!==c.pathname||!ws.isUpgrade(t))return i(404,"Not Found");if(!String(t.headers["sec-websocket-protocol"]||"").split(",").map(e=>e.trim()).some(e=>e.startsWith("tnc-ui.")&&sameToken(e.slice(7),n)))return i(403,"Forbidden");const u=c.searchParams.get("id")||"";if(!/^[A-Za-z0-9][A-Za-z0-9_.-]*$/.test(u))return i(400,"Bad Request");terminal(t,s,a,{socketPath:e,id:u}).catch(e=>i(502,String(e.message).replace(/[\r\n]/g," ").slice(0,200)))}),new Promise((e,o)=>{s.once("error",o),s.listen(t,"127.0.0.1",()=>{r=s.address().port,e({port:r,token:n,url:`http://127.0.0.1:${r}/#t=${n}`,close:()=>new Promise(e=>{s.closeAllConnections?.(),s.close(()=>e())})})})})}module.exports={startUi,allowed};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "thinkncollab-shell",
-  "version": "2.0.0-beta.2",
+  "version": "2.0.0-beta.3",
   "description": "Lightweight MicroVM Sandbox & Zero-Daemon Dev Runner: Fast MicroVM Containers, Native Microservices, Live Database Snapshots, and End-to-End Encrypted State Sync",
   "main": "dist/src/core/shell.js",
   "bin": {

package/dist/src/dock/setup/app.js

@@ -1,7 +0,0 @@
-/**
- * @license ThinkNCollab Enterprise & Open Core Ecosystem
- * Copyright (c) 2024-2026 ThinkNCollab Systems Inc. All rights reserved.
- * PROPRIETARY INTELLECTUAL PROPERTY & TRADE SECRETS.
- * UNAUTHORIZED REVERSE ENGINEERING, DECOMPILATION, OR RE-DISTRIBUTION IS STRICTLY PROHIBITED.
- */
-"use strict";const fs=require("fs"),os=require("os"),path=require("path"),{spawnSync}=require("child_process"),APP=path.join(os.homedir(),"Applications","TNC Dock.app"),BUNDLE_ID="com.thinkncollab.dock.menubar",LOGIN_AGENT=path.join(os.homedir(),"Library","LaunchAgents",`${BUNDLE_ID}.plist`),EXE="tnc-menubar",SOURCE=path.join(__dirname,"..","..","..","native","tnc-menubar","main.swift");function infoPlist(n){return`<?xml version="1.0" encoding="UTF-8"?>\n<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">\n<plist version="1.0">\n<dict>\n  <key>CFBundleIdentifier</key><string>${BUNDLE_ID}</string>\n  <key>CFBundleName</key><string>TNC Dock</string>\n  <key>CFBundleDisplayName</key><string>TNC Dock</string>\n  <key>CFBundleExecutable</key><string>${EXE}</string>\n  <key>CFBundlePackageType</key><string>APPL</string>\n  <key>CFBundleShortVersionString</key><string>${n}</string>\n  <key>CFBundleVersion</key><string>${n}</string>\n  <key>LSMinimumSystemVersion</key><string>13.0</string>\n  <key>LSUIElement</key><true/>\n  <key>NSHighResolutionCapable</key><true/>\n</dict>\n</plist>\n`}function binary(n,e){const i=path.join(path.dirname(n),"bin",EXE);if(fs.existsSync(i))return i;if(fs.existsSync(SOURCE)&&0===spawnSync("swiftc",["--version"],{stdio:"ignore"}).status){const i=path.join(n,"build",EXE);fs.mkdirSync(path.dirname(i),{recursive:!0}),e("compiling the menu bar app (swiftc)…");const s=spawnSync("swiftc",["-swift-version","5","-O","-framework","AppKit","-o",i,SOURCE],{encoding:"utf8"});if(0!==s.status)throw new Error(`swiftc failed:\n${(s.stderr||s.stdout).trim().slice(-2e3)}`);return i}throw new Error("the menu bar app is not installed; run thinknsh dock setup (a newer runtime bundle has it)")}function quitApp(){spawnSync("pkill",["-f",`${APP}/Contents/MacOS/${EXE}`],{stdio:"ignore"})}function app({off:n=!1,home:e,socket:i,cli:s,version:t="0",log:r=()=>{}}){if("darwin"!==process.platform)throw new Error("the menu bar app is for macOS; on other systems use thinknsh dock ui");if(n){quitApp();const n=fs.existsSync(APP);return fs.rmSync(APP,{recursive:!0,force:!0}),fs.rmSync(LOGIN_AGENT,{force:!0}),[n?`removed ${APP}`:"TNC Dock was not installed"]}const o=binary(e,r);quitApp();const c=path.join(APP,"Contents");fs.rmSync(APP,{recursive:!0,force:!0}),fs.mkdirSync(path.join(c,"MacOS"),{recursive:!0}),fs.mkdirSync(path.join(c,"Resources"),{recursive:!0}),fs.writeFileSync(path.join(c,"Info.plist"),infoPlist(t)),fs.copyFileSync(o,path.join(c,"MacOS",EXE)),fs.chmodSync(path.join(c,"MacOS",EXE),493),fs.writeFileSync(path.join(c,"Resources","config.json"),JSON.stringify({node:process.execPath,cli:fs.realpathSync(s),socket:i},null,2)+"\n");const a=spawnSync("codesign",["-s","-","--force","--deep",APP],{encoding:"utf8"});return 0!==a.status&&r(`codesign: ${(a.stderr||"").trim()}`),spawnSync("open",[APP]),[`TNC Dock is in the menu bar (${APP})`,'its menu: containers, ports, logs, dock start/stop, the dashboard, and "Open TNC Dock at login"',`uses node ${process.execPath}; run this again if you move or upgrade node`]}module.exports={app,APP};