llm-tuner 0.1.0 → 0.3.0

package/src/core/updater.js

@@ -0,0 +1,99 @@
+import fs from 'node:fs/promises';
+import path from 'node:path';
+import { configDir, readJson, fetchJson } from './util.js';
+
+const pkgUrl = new URL('../../package.json', import.meta.url);
+const pkgContent = await fs.readFile(pkgUrl, 'utf8');
+export const CURRENT_VERSION = JSON.parse(pkgContent).version;
+
+export const DEFAULT_REGISTRY_URL = 'https://registry.npmjs.org/llm-tuner/latest';
+export const DEFAULT_CACHE_TTL_MS = 24 * 60 * 60 * 1000; // 24 hours
+
+export const updateCachePath = () => path.join(configDir(), 'update-check.json');
+
+/**
+ * Parse a semver string into [major, minor, patch] numbers.
+ * Strips any leading 'v' and ignores pre-release/build identifiers.
+ */
+export function parseSemver(v) {
+  if (typeof v !== 'string') return null;
+  const clean = v.trim().replace(/^v/, '');
+  const [core] = clean.split('-');
+  const parts = core.split('.').map((p) => Number(p));
+  if (parts.length < 3 || parts.some((n) => Number.isNaN(n) || n < 0)) return null;
+  return parts.slice(0, 3);
+}
+
+/**
+ * Returns true if `latest` is strictly newer than `current`.
+ */
+export function isNewerVersion(latest, current) {
+  const l = parseSemver(latest);
+  const c = parseSemver(current);
+  if (!l || !c) return false;
+  for (let i = 0; i < 3; i++) {
+    if (l[i] > c[i]) return true;
+    if (l[i] < c[i]) return false;
+  }
+  return false;
+}
+
+/**
+ * Checks npm registry for updates with a 24h cache.
+ * Never throws; returns safe fallback on network or file errors.
+ */
+export async function checkUpdate({
+  force = false,
+  timeout = 2000,
+  cacheTtlMs = DEFAULT_CACHE_TTL_MS,
+  registryUrl = DEFAULT_REGISTRY_URL,
+  currentVersion = CURRENT_VERSION,
+} = {}) {
+  try {
+    const cacheFile = updateCachePath();
+    if (!force) {
+      const cached = await readJson(cacheFile, null);
+      if (cached && typeof cached === 'object' && cached.lastChecked && cached.latestVersion) {
+        if (Date.now() - cached.lastChecked < cacheTtlMs) {
+          return {
+            updateAvailable: isNewerVersion(cached.latestVersion, currentVersion),
+            currentVersion,
+            latestVersion: cached.latestVersion,
+            cached: true,
+          };
+        }
+      }
+    }
+
+    const res = await fetchJson(registryUrl, { timeout });
+    if (res?.ok && res?.json?.version) {
+      const latest = res.json.version;
+      try {
+        await fs.mkdir(configDir(), { recursive: true });
+        await fs.writeFile(cacheFile, JSON.stringify({ lastChecked: Date.now(), latestVersion: latest }, null, 2));
+      } catch {
+        // Ignore cache write errors
+      }
+      return {
+        updateAvailable: isNewerVersion(latest, currentVersion),
+        currentVersion,
+        latestVersion: latest,
+        cached: false,
+      };
+    }
+
+    return {
+      updateAvailable: false,
+      currentVersion,
+      latestVersion: null,
+      cached: false,
+    };
+  } catch {
+    return {
+      updateAvailable: false,
+      currentVersion,
+      latestVersion: null,
+      cached: false,
+    };
+  }
+}

package/src/i18n/en.js

@@ -92,7 +92,7 @@ export default {
   // Shared by CLI and web
   'common.error': 'Error: {message}',
   'common.na': 'n/a',
-  'common.longPrompt': 'long prompt (~{tokens} tokens)…',
+  'common.longPrompt': 'long prompt (~{tokens} tokens, 50% context)…',
   'common.presetSaved': 'Preset saved: {file}',
   'common.backups': 'Backups: {list}',
 
@@ -154,7 +154,8 @@ Presets are saved in {presetsDir}`,
   'cli.confirmApply': 'Apply and load the model?',
   'cli.dryRun': '--dry-run: nothing was applied and no preset was saved.',
   'cli.pending': 'To finish, run (asks for the administrator password):',
-  'cli.loaded': 'Model loaded in {engine}: {tps}',
+  'cli.tuningModel': 'Tuning {model} with {ctx} context ({profile})…',
+  'cli.loaded': 'Model loaded in {engine} with {ctx} context: {tps}',
   'cli.usesModel': ' (uses the model {model})',
   'cli.loadFailed': 'Could not load: {error}',
   'cli.installMethod': 'Install method:',
@@ -239,5 +240,14 @@ Presets are saved in {presetsDir}`,
   'web.themeDark': 'Dark',
   'web.settings': 'Settings',
   'web.close': 'Close',
+  'web.telemetryCpu': 'CPU',
+  'web.telemetryRam': 'RAM',
+  'web.telemetryVram': 'VRAM',
+  'web.telemetryGpu': 'GPU {index}',
+  'cli.updateAvailable': 'Update available: {current} → {latest}',
+  'cli.updateCommand': 'Run {cmd} to update',
+  'web.updateAvailable': 'Update available: v{latest}',
+  'web.updateLink': 'View release notes on GitHub',
+  'web.version': 'Version {version}',
 };
 

package/src/i18n/es.js

@@ -92,7 +92,7 @@ export default {
   // Shared by CLI and web
   'common.error': 'Error: {message}',
   'common.na': 'n/d',
-  'common.longPrompt': 'prompt largo (~{tokens} tokens)…',
+  'common.longPrompt': 'prompt largo (~{tokens} tokens, 50% del contexto)…',
   'common.presetSaved': 'Preset guardado: {file}',
   'common.backups': 'Copias de seguridad: {list}',
 
@@ -154,7 +154,8 @@ Los presets se guardan en {presetsDir}`,
   'cli.confirmApply': '¿Aplicar y cargar el modelo?',
   'cli.dryRun': '--dry-run: no se aplicó nada ni se guardó preset.',
   'cli.pending': 'Para terminar ejecuta (pide contraseña de administrador):',
-  'cli.loaded': 'Modelo cargado en {engine}: {tps}',
+  'cli.tuningModel': 'Ajustando {model} con {ctx} de contexto ({profile})…',
+  'cli.loaded': 'Modelo cargado en {engine} con {ctx} de contexto: {tps}',
   'cli.usesModel': ' (usa el modelo {model})',
   'cli.loadFailed': 'No se pudo cargar: {error}',
   'cli.installMethod': 'Método de instalación:',
@@ -239,5 +240,14 @@ Los presets se guardan en {presetsDir}`,
   'web.themeDark': 'Oscuro',
   'web.settings': 'Configuración',
   'web.close': 'Cerrar',
+  'web.telemetryCpu': 'CPU',
+  'web.telemetryRam': 'RAM',
+  'web.telemetryVram': 'VRAM',
+  'web.telemetryGpu': 'GPU {index}',
+  'cli.updateAvailable': 'Actualización disponible: {current} → {latest}',
+  'cli.updateCommand': 'Ejecutá {cmd} para actualizar',
+  'web.updateAvailable': 'Actualización disponible: v{latest}',
+  'web.updateLink': 'Ver notas de la versión en GitHub',
+  'web.version': 'Versión {version}',
 };
 

package/src/web/public/app.js

@@ -136,6 +136,22 @@ async function boot() {
   document.documentElement.lang = s.lang;
   applyStatic();
   setupDrawer();
+  api('/api/update').then((up) => {
+    if (up?.currentVersion) {
+      const vDisp = $('#version-display');
+      if (vDisp) vDisp.textContent = t('web.version', { version: up.currentVersion });
+    }
+    if (up?.updateAvailable) {
+      const dot = $('#update-dot');
+      if (dot) dot.hidden = false;
+      const badge = $('#update-badge');
+      const link = $('#update-link');
+      if (badge && link) {
+        link.textContent = t('web.updateAvailable', { latest: up.latestVersion });
+        badge.hidden = false;
+      }
+    }
+  }).catch(() => {});
   state.storedProfile = s.profile ?? null;
   state.profileIds = s.profiles;
   renderProfile();
@@ -202,6 +218,7 @@ async function chooseEngine(e) {
   step('model');
   $('#model').innerHTML = `<option>${esc(t('web.readingModels'))}</option>`;
   const { models } = await api(`/api/models?engine=${e.id}`);
+  models.sort((a, b) => (a.sizeBytes ?? 0) - (b.sizeBytes ?? 0) || (a.name || '').localeCompare(b.name || ''));
   $('#model').innerHTML = models.length
     ? models.map((m) => `<option value="${esc(m.key)}">${esc(m.name)} · ${gb(m.sizeBytes)}${m.quant ? ' · ' + esc(m.quant) : ''}</option>`).join('')
     : `<option value="">${esc(t('web.noModels'))}</option>`;
@@ -386,6 +403,59 @@ function onCtxChange() {
 }
 $('#ctx').oninput = onCtxChange;
 
+function updateTelemetry(e) {
+  const panel = $('#telemetry-panel');
+  if (!panel || !e) return;
+  panel.hidden = false;
+
+  if (e.cpu) {
+    const cpuVal = $('#telemetry-cpu-val');
+    const cpuFill = $('#telemetry-cpu-fill');
+    if (cpuVal) cpuVal.textContent = `${e.cpu.percent}%`;
+    if (cpuFill) cpuFill.style.width = `${Math.min(100, Math.max(0, e.cpu.percent))}%`;
+  }
+
+  if (e.ram) {
+    const ramVal = $('#telemetry-ram-val');
+    const ramFill = $('#telemetry-ram-fill');
+    if (ramVal) ramVal.textContent = `${gb(e.ram.usedBytes)} / ${gb(e.ram.totalBytes)} (${e.ram.percent}%)`;
+    if (ramFill) ramFill.style.width = `${Math.min(100, Math.max(0, e.ram.percent))}%`;
+  }
+
+  if (e.gpus) {
+    const box = $('#telemetry-gpus');
+    if (box) {
+      box.innerHTML = e.gpus.map((g) => {
+        const name = g.name.replace(/^NVIDIA GeForce /, '');
+        return `<div class="telemetry-card">
+          <div class="telemetry-header"><span>GPU ${g.index} (${esc(name)})</span> <strong>${gb(g.usedBytes)} / ${gb(g.totalBytes)} (${g.percent}%)</strong></div>
+          <div class="meter-bar"><div class="meter-fill" style="width: ${Math.min(100, Math.max(0, g.percent))}%"></div></div>
+        </div>`;
+      }).join('');
+    }
+  }
+}
+
+function updateProgress(p, label) {
+  const wrap = $('#load-progress-wrap');
+  if (!wrap || !p) return;
+  wrap.hidden = false;
+
+  const bar = $('#load-progress-bar');
+  const pct = $('#load-progress-pct');
+  const lbl = $('#load-progress-label');
+
+  if (pct) pct.textContent = `${p.pct}%`;
+  if (bar) bar.style.width = `${p.pct}%`;
+  if (lbl && label !== undefined) {
+    let text = label || '';
+    if (p.phase === 'bench' && p.current && p.total) {
+      text = `[${p.current}/${p.total}] ${text}`.trim();
+    }
+    lbl.textContent = text;
+  }
+}
+
 // ---------- Load ----------
 $('#load-btn').onclick = async () => {
   const model = $('#model').value;
@@ -407,6 +477,17 @@ $('#load-btn').onclick = async () => {
   $('#load-result').innerHTML = '';
   const log = $('#load-log');
   log.textContent = '';
+  // Reset progress and telemetry
+  $('#load-progress-wrap').hidden = false;
+  $('#load-progress-bar').style.width = '0%';
+  $('#load-progress-pct').textContent = '0%';
+  $('#load-progress-label').textContent = '';
+  $('#telemetry-panel').hidden = false;
+  $('#telemetry-cpu-val').textContent = '0%';
+  $('#telemetry-cpu-fill').style.width = '0%';
+  $('#telemetry-ram-val').textContent = '0 / 0 GB (0%)';
+  $('#telemetry-ram-fill').style.width = '0%';
+  $('#telemetry-gpus').innerHTML = '';
   // One element per line, so a warning can be styled on its own.
   const addLog = (s, level = 'note') => {
     const line = document.createElement('span');
@@ -424,6 +505,17 @@ $('#load-btn').onclick = async () => {
     // Progress event before the current one: a fallback that repeats its reason is not logged twice.
     let previous = null;
     const done = await follow(jobId, (e) => {
+      if (e.type === 'telemetry') {
+        updateTelemetry(e);
+        return;
+      }
+      if (e.progress) {
+        let label = '';
+        if (e.type === 'status' && e.code) label = t(e.code, e.params);
+        else if (e.type === 'candidate-start') label = describe(e.candidate);
+        else if (e.type === 'bench-progress' && e.phase) label = e.phase === 'deep' ? t('common.longPrompt', { tokens: e.promptTokens }) : '';
+        updateProgress(e.progress, label);
+      }
       if (e.type === 'variant-picked' || e.type === 'profile-fallback') {
         for (const line of profileEventLines(e, t, { engineName: state.engine.name, previous })) addLog(line.text, line.level);
       }
@@ -456,6 +548,8 @@ $('#load-btn').onclick = async () => {
       const loaded = done.result?.loaded;
       throw new Error(done.code || done.error ? errText(done) : loaded && !loaded.ok ? benchErr(loaded) : t('bench.loadFailed'));
     }
+    updateProgress({ pct: 100, phase: 'done' });
+
     const r = done.result;
     if (r.report?.best) {
       const idx = r.report.results.findIndex((x) => x.candidate.id === r.report.best.candidate.id);

package/src/web/public/index.html

@@ -22,6 +22,7 @@
     <button id="settings-open" class="settings-trigger" type="button" aria-haspopup="dialog" aria-expanded="false">
       <span class="settings-trigger-icon">⚙</span>
       <span data-i18n="web.settings">Settings</span>
+      <span id="update-dot" class="update-dot" hidden></span>
     </button>
     <ol class="steps" id="steps">
       <li data-step="engine" class="active" data-i18n="web.stepEngine">Engine</li>
@@ -75,6 +76,26 @@
 
     <section id="sec-load" class="panel" hidden>
       <header><h2 id="load-title" data-i18n="web.loading">Loading</h2><span class="pill" id="load-status" data-i18n="web.inProgress">in progress</span></header>
+      <div id="load-progress-wrap" class="progress-wrap" hidden>
+        <div class="progress-bar-track">
+          <div id="load-progress-bar" class="progress-bar-fill" style="width: 0%"></div>
+        </div>
+        <div class="progress-meta">
+          <span id="load-progress-label"></span>
+          <span id="load-progress-pct">0%</span>
+        </div>
+      </div>
+      <div id="telemetry-panel" class="telemetry-panel" hidden>
+        <div class="telemetry-card">
+          <div class="telemetry-header"><span data-i18n="web.telemetryCpu">CPU</span> <strong id="telemetry-cpu-val">0%</strong></div>
+          <div class="meter-bar"><div id="telemetry-cpu-fill" class="meter-fill" style="width: 0%"></div></div>
+        </div>
+        <div class="telemetry-card">
+          <div class="telemetry-header"><span data-i18n="web.telemetryRam">RAM</span> <strong id="telemetry-ram-val">0 / 0 GB (0%)</strong></div>
+          <div class="meter-bar"><div id="telemetry-ram-fill" class="meter-fill" style="width: 0%"></div></div>
+        </div>
+        <div id="telemetry-gpus" class="telemetry-gpus"></div>
+      </div>
       <div id="bench" hidden>
         <p class="muted small" data-i18n="web.benchIntro">There is no preset for this context and profile: several configurations are tested on your hardware. It takes a few minutes and only happens once.</p>
         <div class="table-wrap">
@@ -124,6 +145,12 @@
         <option value="dark" data-i18n="web.themeDark">Dark</option>
       </select>
     </div>
+    <div class="drawer-field version-info">
+      <span class="muted" id="version-display"></span>
+      <div id="update-badge" hidden>
+        <a href="https://github.com/ronald32acunadev/llmtuner/releases" target="_blank" rel="noopener noreferrer" class="tag prio" id="update-link"></a>
+      </div>
+    </div>
   </div>
 </aside>
 <script src="app.js" type="module"></script>

package/src/web/public/style.css

@@ -4,13 +4,14 @@
   --ink: #0f172a;
   --muted: #475569;
   --line: #cbd5e1;
-  --accent: #0284c7;
+  --accent: #007c99; /* accessible electric cyan for light theme */
   --accent-ink: #ffffff;
-  --gpu: #0891b2;
+  --gpu: #007c99;
+  --purple: #7800c7; /* accessible electric purple */
   --cpu: #94a3b8;
-  --ok: #16a34a;
+  --ok: #288a00; /* accessible neon lime */
   --warn: #d97706;
-  --bad: #dc2626;
+  --bad: #d61500; /* accessible electric red */
   --code-bg: #f8fafc;
   --font: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
   --mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
@@ -23,13 +24,14 @@
     --ink: #e2e8f0;
     --muted: #8b9bb0;
     --line: #1e2c3d;
-    --accent: #00e5ff; /* electric cyan from logo */
+    --accent: #00e5ff; /* electric cyan from brand */
     --accent-ink: #05131d;
     --gpu: #00e5ff;
+    --purple: #9a00ff; /* electric purple from brand */
     --cpu: #3d4f63;
-    --ok: #34d399;
+    --ok: #65ff00; /* neon lime from brand */
     --warn: #fbbf24;
-    --bad: #f87171;
+    --bad: #ff1a00; /* electric red from brand */
     --code-bg: #0b121b;
     color-scheme: dark;
   }
@@ -40,13 +42,14 @@
   --ink: #e2e8f0;
   --muted: #8b9bb0;
   --line: #1e2c3d;
-  --accent: #00e5ff; /* electric cyan from logo */
+  --accent: #00e5ff; /* electric cyan from brand */
   --accent-ink: #05131d;
   --gpu: #00e5ff;
+  --purple: #9a00ff; /* electric purple from brand */
   --cpu: #3d4f63;
-  --ok: #34d399;
+  --ok: #65ff00; /* neon lime from brand */
   --warn: #fbbf24;
-  --bad: #f87171;
+  --bad: #ff1a00; /* electric red from brand */
   --code-bg: #0b121b;
   color-scheme: dark;
 }
@@ -56,13 +59,14 @@
   --ink: #0f172a;
   --muted: #475569;
   --line: #cbd5e1;
-  --accent: #0284c7;
+  --accent: #007c99; /* accessible electric cyan for light theme */
   --accent-ink: #ffffff;
-  --gpu: #0891b2;
+  --gpu: #007c99;
+  --purple: #7800c7; /* accessible electric purple */
   --cpu: #94a3b8;
-  --ok: #16a34a;
+  --ok: #288a00; /* accessible neon lime */
   --warn: #d97706;
-  --bad: #dc2626;
+  --bad: #d61500; /* accessible electric red */
   --code-bg: #f8fafc;
   color-scheme: light;
 }
@@ -328,3 +332,41 @@ td .err { color: var(--bad); white-space: normal; }
 .chat-form input { flex: 1; min-width: 0; }
 .chat-form button { flex-shrink: 0; }
 
+/* Progress bar and real-time telemetry */
+.progress-wrap { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
+.progress-bar-track { width: 100%; height: 8px; background: var(--code-bg); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; }
+.progress-bar-fill { height: 100%; background: linear-gradient(90deg, var(--accent), var(--ok)); transition: width .2s ease; }
+.progress-meta { display: flex; justify-content: space-between; align-items: center; font: 500 .8rem var(--mono); color: var(--muted); }
+.progress-meta strong { color: var(--ink); }
+
+.telemetry-panel { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin-top: 10px; }
+.telemetry-card { background: var(--bg); border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; display: grid; gap: 6px; }
+.telemetry-header { display: flex; justify-content: space-between; align-items: center; font: 500 .8rem var(--mono); color: var(--muted); }
+.telemetry-header strong { color: var(--ink); }
+.telemetry-gpus { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
+.meter-bar { width: 100%; height: 8px; background: var(--code-bg); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; }
+.meter-fill { height: 100%; background: var(--gpu); transition: width .2s ease; }
+#telemetry-cpu-fill { background: var(--purple); }
+
+/* Update notifications */
+.update-dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background: var(--warn, #f59e0b);
+  display: inline-block;
+  margin-left: auto;
+}
+.version-info {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-top: 1rem;
+  border-top: 1px solid var(--line);
+  font-size: .85rem;
+}
+.version-info #update-link {
+  text-decoration: none;
+  font-size: .75rem;
+}
+

package/src/web/server.js

@@ -3,7 +3,7 @@ import fs from 'node:fs/promises';
 import path from 'node:path';
 import { fileURLToPath, pathToFileURL } from 'node:url';
 import { randomUUID } from 'node:crypto';
-import { detectHardware, detectEngines, Tuner, ENGINES, installPlans, runInstall, slim, listPresets, readSettings, writeSettings, TunerError, PROFILES } from '../core/index.js';
+import { detectHardware, detectEngines, Tuner, ENGINES, installPlans, runInstall, slim, listPresets, readSettings, writeSettings, TunerError, PROFILES, checkUpdate } from '../core/index.js';
 import { THEMES } from '../core/settings.js';
 import { LOCALES, messagesFor } from '../i18n/index.js';
 import { openUrl } from '../core/installer.js';
@@ -52,6 +52,8 @@ function send(res, status, obj) {
 const routes = {
   'GET /api/settings': async () => ({ ...(await readSettings()), locales: LOCALES, themes: THEMES, profiles: PROFILES }),
 
+  'GET /api/update': async () => checkUpdate(),
+
   'POST /api/settings': async (req) => {
     const payload = await body(req);
     if (payload?.lang === undefined && payload?.theme === undefined && payload?.profile === undefined) throw new TunerError('errors.unknownLocale', { lang: '', list: LOCALES.join(', ') });