pyre-cli 6.1.0 → 7.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pyre-cli",
-  "version": "6.1.0",
+  "version": "7.0.0",
   "description": "CLI Mac monitoring tool: temps, system stats, live dashboard, packet monitor, battery predictor, export",
   "main": "dist/index.js",
   "type": "module",

package/src/anomalies.ts

@@ -13,6 +13,7 @@ export interface AnomalyAlert {
   value: number;
   zScore: number;
   severity: 'warning' | 'critical';
+  timestamp?: Date;
 }
 
 const ZSCORE_THRESHOLD = 2.5;

package/src/fleet.ts

@@ -0,0 +1,31 @@
+import { execSync } from 'node:child_process';
+import chalk from 'chalk';
+import { formatTable } from './formatters/render.js';
+import type { StatsData } from './monitors/types.js';
+
+export function runFleetCommand(hosts: string[]) {
+  console.log(chalk.cyan(`Fetching data from ${hosts.length} hosts...`));
+  const results: { host: string; data?: StatsData; error?: string }[] = [];
+
+  for (const host of hosts) {
+    try {
+      // Connect to each host via ssh and run pyre
+      const out = execSync(`ssh ${host} "pyre --once --json"`, { encoding: 'utf8', stdio: ['pipe', 'pipe', 'ignore'] });
+      const data = JSON.parse(out) as StatsData;
+      results.push({ host, data });
+    } catch (e: any) {
+      results.push({ host, error: e.message });
+    }
+  }
+
+  // Very basic grid layout for fleet
+  for (const result of results) {
+    console.log(chalk.bold.blue(`\n=== ${result.host} ===\n`));
+    if (result.error) {
+      console.log(chalk.red(`Error connecting to host: ${result.error}`));
+    } else if (result.data) {
+      // Print a compact table for each host
+      console.log(formatTable(result.data, { width: process.stdout.columns || 80, activePanel: 'grid' }));
+    }
+  }
+}

package/src/formatters/output.ts

@@ -159,21 +159,118 @@ export function formatHtml(data: StatsData): string {
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>pyre — ${data.header.hostname}</title>
 <style>
-  body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #1e1e2e; color: #cdd6f4; margin: 0; padding: 24px; }
-  h1 { color: #ff6a39; margin-bottom: 4px; }
-  .meta { color: #a6adc8; margin-bottom: 24px; }
-  h2 { color: #89b4fa; margin-top: 28px; border-bottom: 1px solid #313244; padding-bottom: 6px; }
-  table { width: 100%; border-collapse: collapse; margin-bottom: 16px; }
-  td { padding: 6px 10px; border-bottom: 1px solid #313244; vertical-align: top; }
-  td.label { color: #a6adc8; width: 22%; font-weight: 500; }
-  td.value { color: #cdd6f4; }
+  body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #0a0908; color: #efe9dc; margin: 0; padding: 24px; }
+  h1 { color: #ff6a39; margin-bottom: 4px; font-weight: 800; letter-spacing: -0.02em; }
+  .meta { color: #9c9384; margin-bottom: 24px; font-size: 0.9rem; }
+  h2 { color: #ffb130; margin-top: 28px; border-bottom: 1px solid #211d18; padding-bottom: 6px; font-size: 1.1rem; }
+  table { width: 100%; border-collapse: collapse; margin-bottom: 16px; font-family: monospace; }
+  td { padding: 8px 12px; border-bottom: 1px solid #1a1712; vertical-align: top; font-size: 0.9rem; }
+  td.label { color: #9c9384; width: 22%; font-weight: 600; }
+  td.value { color: #efe9dc; }
   tr:last-child td { border-bottom: none; }
 </style>
 </head>
 <body>
-  <h1>PYRE</h1>
-  <div class="meta">${escapeHtml(data.header.hostname)} · ${escapeHtml(data.header.os)} · up ${escapeHtml(data.header.uptime)} · ${escapeHtml(data.timestamp)}</div>
+  <h1>PYRE <span style="font-size:0.5em; color:#82c774; font-weight:normal;">● LIVE PORTAL</span></h1>
+  <div class="meta" id="header-meta">${escapeHtml(data.header.hostname)} · ${escapeHtml(data.header.os)} · up ${escapeHtml(data.header.uptime)} · <span id="timestamp-val">${escapeHtml(data.timestamp)}</span></div>
+  <div id="portal-content">
   ${sections.join('\n  ')}
+  </div>
+
+  <script>
+    function renderStats(data) {
+      if (!data) return;
+      const tsEl = document.getElementById('timestamp-val');
+      if (tsEl && data.timestamp) tsEl.textContent = data.timestamp;
+
+      function formatBytes(bytes) {
+        if (!bytes || bytes < 0) return '0 B';
+        if (bytes < 1024) return bytes + ' B';
+        if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + ' KB';
+        if (bytes < 1024 * 1024 * 1024) return (bytes / (1024 * 1024)).toFixed(1) + ' MB';
+        return (bytes / (1024 * 1024 * 1024)).toFixed(2) + ' GB';
+      }
+
+      function row(label, val) {
+        return '<tr><td class="label">' + label + '</td><td class="value">' + val + '</td></tr>';
+      }
+
+      let html = '';
+
+      // CPU & Memory
+      html += '<h2>CPU & Memory</h2><table>';
+      if (data.cpu) {
+        html += row('Brand', data.cpu.brand || 'Unknown');
+        html += row('Cores', (data.cpu.physicalCores || '') + '/' + (data.cpu.cores || '') + ' (phys/log)');
+        html += row('Usage', (data.cpu.usage || 0) + '%');
+        if (data.cpu.loadAvg) html += row('Load Avg', data.cpu.loadAvg.map(l => l.toFixed(2)).join(' '));
+        if (data.cpu.temperature) html += row('Temperature', data.cpu.temperature.toFixed(1) + '°C');
+      }
+      if (data.memory) {
+        html += row('Memory Usage', data.memory.usagePercent + '% (' + formatBytes(data.memory.used) + ' / ' + formatBytes(data.memory.total) + ')');
+        html += row('Swap Used', formatBytes(data.memory.swapUsed) + ' / ' + formatBytes(data.memory.swapTotal));
+      }
+      html += '</table>';
+
+      // GPU
+      if (data.gpu) {
+        html += '<h2>GPU</h2><table>';
+        html += row('Model', data.gpu.model || '');
+        html += row('Utilization', (data.gpu.utilization || 0) + '%');
+        html += row('Memory', formatBytes(data.gpu.memory));
+        if (data.gpu.temperature) html += row('Temperature', data.gpu.temperature.toFixed(1) + '°C');
+        html += '</table>';
+      }
+
+      // Network
+      if (data.network) {
+        html += '<h2>Network</h2><table>';
+        html += row('Interface', (data.network.interface || '') + ' (' + (data.network.ip || '') + ')');
+        html += row('RX', formatBytes(data.network.rxBytes) + ' / ' + (data.network.rxPackets || 0) + ' pkt');
+        html += row('TX', formatBytes(data.network.txBytes) + ' / ' + (data.network.txPackets || 0) + ' pkt');
+        html += '</table>';
+      }
+
+      // Disk
+      if (data.disk && data.disk.length) {
+        html += '<h2>Disk</h2><table>';
+        data.disk.forEach(d => {
+          let io = '';
+          if (d.readBytesSec !== undefined || d.writeBytesSec !== undefined) {
+            io = ' | R: ' + formatBytes(d.readBytesSec || 0) + '/s W: ' + formatBytes(d.writeBytesSec || 0) + '/s';
+          }
+          html += row(d.mountpoint, d.used + ' / ' + d.size + ' (' + d.capacity + ')' + io);
+        });
+        html += '</table>';
+      }
+
+      // Processes
+      if (data.processes && data.processes.length) {
+        html += '<h2>Processes (Top ' + Math.min(50, data.processes.length) + ')</h2><table>';
+        data.processes.slice(0, 50).forEach(p => {
+          html += row(String(p.pid), p.user + ' &nbsp; CPU: ' + p.cpu.toFixed(1) + '% &nbsp; MEM: ' + p.mem.toFixed(1) + '% &nbsp; ' + p.command);
+        });
+        html += '</table>';
+      }
+
+      const contentEl = document.getElementById('portal-content');
+      if (contentEl) contentEl.innerHTML = html;
+    }
+
+    if (window.EventSource) {
+      const evtSource = new EventSource('/api/stream');
+      evtSource.onmessage = function(event) {
+        try {
+          const data = JSON.parse(event.data);
+          renderStats(data);
+        } catch(e) {}
+      };
+    } else {
+      setInterval(function() {
+        fetch('/api').then(r => r.json()).then(renderStats).catch(function(){});
+      }, 2000);
+    }
+  </script>
 </body>
 </html>`;
 }

package/src/formatters/render.ts

@@ -10,7 +10,7 @@
  * all layout-related code is co-located.
  */
 import chalk from 'chalk';
-import { sparkline, multiRowSparkline } from '../sparkline.js';
+import { sparkline, multiRowSparkline, brailleGraph } from '../sparkline.js';
 import type { History } from '../history.js';
 import type { StatsData, VisibleItems, TableOptions, AnomalyAlert } from './types.js';
 import { THEMES, type ThemeName, type ThemeColors } from './themes.js';
@@ -90,8 +90,8 @@ export function panel(
   } else if (visLen(topInner) < innerW) {
     topInner = topInner + '─'.repeat(innerW - visLen(topInner));
   }
-  const top = borderAccent('┌' + topInner + '┐');
-  const bottom = borderAccent('└' + '─'.repeat(innerW) + '┘');
+  const top = borderAccent('╭' + topInner + '╮');
+  const bottom = borderAccent('╰' + '─'.repeat(innerW) + '╯');
   const body: string[] = [];
   for (let i = 0; i < h; i++) {
     const line = lines[i] ?? '';
@@ -103,12 +103,19 @@ export function panel(
 export function gaugeBar(percent: number, width = 12): string {
   const w = Math.max(1, width);
   const pct = Math.min(100, Math.max(0, percent));
-  const filled = Math.round((pct / 100) * w);
-  const empty = w - filled;
-  const filledStr = '█'.repeat(filled);
-  const emptyStr = '░'.repeat(empty);
+  const totalEighths = Math.round((pct / 100) * w * 8);
+  const fullBlocks = Math.floor(totalEighths / 8);
+  const remainder = totalEighths % 8;
+  const blocks = [' ', '▏', '▎', '▍', '▌', '▋', '▊', '▉', '█'];
+  
+  let str = '█'.repeat(fullBlocks);
+  if (fullBlocks < w && remainder > 0) {
+    str += blocks[remainder];
+  }
+  const empty = Math.max(0, w - visLen(str));
+  
   const color = pct > 85 ? chalk.red : pct > 65 ? chalk.yellow : chalk.cyan;
-  return color(filledStr) + chalk.dim(emptyStr);
+  return color(str) + chalk.dim('─'.repeat(empty));
 }
 
 /** Join equal-or-uneven-height panel blocks side by side with a gap. */
@@ -141,23 +148,40 @@ function statRow(label: string, value: string, width = 9): string {
 }
 
 function bar(percent: number, width = 20): string {
-  const filled = Math.round((Math.min(100, Math.max(0, percent)) / 100) * width);
-  const empty = width - filled;
-  const filledStr = '█'.repeat(Math.max(0, filled));
-  const emptyStr = '░'.repeat(Math.max(0, empty));
+  const w = Math.max(1, width);
+  const pct = Math.min(100, Math.max(0, percent));
+  const totalEighths = Math.round((pct / 100) * w * 8);
+  const fullBlocks = Math.floor(totalEighths / 8);
+  const remainder = totalEighths % 8;
+  const blocks = [' ', '▏', '▎', '▍', '▌', '▋', '▊', '▉', '█'];
+  
+  let str = '█'.repeat(fullBlocks);
+  if (fullBlocks < w && remainder > 0) {
+    str += blocks[remainder];
+  }
+  const empty = Math.max(0, w - visLen(str));
   const color = percent > 90 ? chalk.red : percent > 70 ? chalk.yellow : chalk.green;
-  return color(filledStr + emptyStr);
+  return color(str) + chalk.dim('─'.repeat(empty));
 }
 
 function gaugeRow(label: string, percent: number, contentWidth: number): string {
   const labelW = 9;
   const pctText = `${Math.round(percent)}%`;
   const barW = Math.max(6, contentWidth - labelW - pctText.length - 1);
-  const filled = Math.round((Math.min(100, Math.max(0, percent)) / 100) * barW);
-  const empty = barW - filled;
-  const barStr = '█'.repeat(Math.max(0, filled)) + '░'.repeat(Math.max(0, empty));
-  const color = percent > 90 ? chalk.red : percent > 70 ? chalk.yellow : chalk.green;
-  return `${chalk.dim(label.padEnd(labelW))}${color(barStr)} ${pctText}`;
+  const pct = Math.min(100, Math.max(0, percent));
+  
+  const totalEighths = Math.round((pct / 100) * barW * 8);
+  const fullBlocks = Math.floor(totalEighths / 8);
+  const remainder = totalEighths % 8;
+  const blocks = [' ', '▏', '▎', '▍', '▌', '▋', '▊', '▉', '█'];
+  
+  let str = '█'.repeat(fullBlocks);
+  if (fullBlocks < barW && remainder > 0) {
+    str += blocks[remainder];
+  }
+  const empty = Math.max(0, barW - visLen(str));
+  const color = pct > 90 ? chalk.red : pct > 70 ? chalk.yellow : chalk.green;
+  return `${chalk.dim(label.padEnd(labelW))}${color(str)}${chalk.dim('─'.repeat(empty))} ${pctText}`;
 }
 
 export function thermalColor(pressureLevel: number) {
@@ -360,6 +384,7 @@ export const TAB_DEFS: { id: string; label: string; key: string }[] = [
   { id: 'disk', label: 'Disk', key: '0' },
   { id: 'process', label: 'Process', key: 'P' },
   { id: 'p2p', label: 'P2P', key: 'R' },
+  { id: 'anomalies', label: 'Anomalies', key: 'A' },
 ];
 
 /** The number of leading columns of indent before the tab bar's first character (see `tabBar`). */
@@ -662,6 +687,20 @@ function activeDetailLines(data: StatsData, activePanel: string, width: number,
       }
       return processTableLines(limited, width - 4, theme.border);
     }
+    case 'anomalies': {
+      if (!opts.anomalyHistory || opts.anomalyHistory.length === 0) return ['No anomalies detected yet.'];
+      const lines: string[] = [];
+      // Sort by timestamp descending
+      const sorted = [...opts.anomalyHistory].sort((a, b) => (b.timestamp?.getTime() || 0) - (a.timestamp?.getTime() || 0));
+      for (const a of sorted) {
+        const color = a.severity === 'critical' ? chalk.red.bold : chalk.yellow;
+        const direction = a.zScore > 0 ? '↑ spike' : '↓ drop';
+        const valStr = a.metric.toLowerCase().includes('net') ? `${formatBytes(a.value)}/s` : `${a.value.toFixed(1)}%`;
+        const timeStr = a.timestamp ? a.timestamp.toLocaleTimeString() : '';
+        lines.push(color(` ${timeStr.padEnd(10)} ⚠ ${a.metric.padEnd(8)}: ${valStr.padEnd(12)} (${direction}, σ=${a.zScore.toFixed(1)})`));
+      }
+      return lines;
+    }
     default:
       return null;
   }
@@ -735,7 +774,9 @@ function btopCpuBox(data: StatsData, width: number, theme: ThemeColors, opts: Ta
     lines.push(chalk.bold(truncatePlain(data.cpu.brand, contentWidth)));
     lines.push(`CPU ${gaugeBar(data.cpu.usage, Math.max(4, contentWidth - 12))} ${data.cpu.usage.toFixed(0)}%`);
     if (opts.history?.cpuUsage.length) {
-      lines.push(theme.cpu(sparkline(opts.history.cpuUsage, { min: 0, max: 100 })));
+      const gMode = opts.graphMode || 'spark';
+      const gStr = gMode === 'bar' ? sparkline(opts.history.cpuUsage, { min: 0, max: 100 }) : brailleGraph(opts.history.cpuUsage, { min: 0, max: 100 });
+      lines.push(theme.cpu(gStr));
     }
     lines.push(`Load: ${data.cpu.loadAvg.map(l => l.toFixed(2)).join(' ')}`);
     return panel('1 cpu', lines, width, theme.cpu, theme.border, lines.length, rightTitle);
@@ -745,55 +786,62 @@ function btopCpuBox(data: StatsData, width: number, theme: ThemeColors, opts: Ta
 function btopLeftColumn(data: StatsData, width: number, theme: ThemeColors, opts: TableOptions): string[] {
   const contentWidth = width - 4;
   const out: string[] = [];
-
-  // --- Box 1: 2 mem ---
-  const memLines: string[] = [];
-  memLines.push(`RAM [${gaugeBar(data.memory.usagePercent, Math.max(4, contentWidth - 12))}] ${data.memory.usagePercent}%`);
-  memLines.push(`Used: ${formatBytes(data.memory.used)} / ${formatBytes(data.memory.total)}`);
-  memLines.push(`Free: ${formatBytes(data.memory.free)} · Cache: ${formatBytes(data.memory.total - data.memory.free - data.memory.used)}`);
-  if (data.memory.swapTotal > 0) {
-    const swapPct = Math.round((data.memory.swapUsed / data.memory.swapTotal) * 100);
-    memLines.push(`Swap [${gaugeBar(swapPct, Math.max(4, contentWidth - 12))}] ${swapPct}%`);
-  }
-  out.push(...panel('2 mem', memLines, width, theme.mem, theme.border, memLines.length, `${formatBytes(data.memory.used)}`));
-
-  // --- Box 2: 0 disk ---
-  if (data.disk.length) {
-    const diskLines: string[] = [];
-    for (const d of data.disk.slice(0, 2)) {
-      const capNum = parseInt(d.capacity, 10) || 0;
-      const mountShort = truncatePlain(d.mountpoint, 8);
-      let ioStr = '';
-      if (d.readBytesSec !== undefined || d.writeBytesSec !== undefined) {
-        const rStr = formatBytes(d.readBytesSec || 0);
-        const wStr = formatBytes(d.writeBytesSec || 0);
-        ioStr = ` R:${rStr}/s W:${wStr}/s`;
+  const layout = opts.panelLayout || ['mem', 'disk', 'net'];
+
+  for (const panelName of layout) {
+    if (panelName === 'mem') {
+      // --- Box 1: 2 mem ---
+      const memLines: string[] = [];
+      memLines.push(`RAM [${gaugeBar(data.memory.usagePercent, Math.max(4, contentWidth - 12))}] ${data.memory.usagePercent}%`);
+      memLines.push(`Used: ${formatBytes(data.memory.used)} / ${formatBytes(data.memory.total)}`);
+      memLines.push(`Free: ${formatBytes(data.memory.free)} · Cache: ${formatBytes(data.memory.total - data.memory.free - data.memory.used)}`);
+      if (data.memory.swapTotal > 0) {
+        const swapPct = Math.round((data.memory.swapUsed / data.memory.swapTotal) * 100);
+        memLines.push(`Swap [${gaugeBar(swapPct, Math.max(4, contentWidth - 12))}] ${swapPct}%`);
+      }
+      out.push(...panel('2 mem', memLines, width, theme.mem, theme.border, memLines.length, `${formatBytes(data.memory.used)}`));
+    } else if (panelName === 'disk' && data.disk.length) {
+      // --- Box 2: 0 disk ---
+      const diskLines: string[] = [];
+      for (const d of data.disk.slice(0, 2)) {
+        const capNum = parseInt(d.capacity, 10) || 0;
+        const mountShort = truncatePlain(d.mountpoint, 8);
+        let ioStr = '';
+        if (d.readBytesSec !== undefined || d.writeBytesSec !== undefined) {
+          const rStr = formatBytes(d.readBytesSec || 0);
+          const wStr = formatBytes(d.writeBytesSec || 0);
+          ioStr = ` R:${rStr}/s W:${wStr}/s`;
+        }
+        diskLines.push(`${mountShort} ${d.used}/${d.size} [${gaugeBar(capNum, Math.max(3, contentWidth - 18 - ioStr.length))}] ${d.capacity}${ioStr}`);
+      }
+      const totalRead = data.disk.reduce((acc, d) => acc + (d.readBytesSec || 0), 0);
+      const totalWrite = data.disk.reduce((acc, d) => acc + (d.writeBytesSec || 0), 0);
+      const diskHeaderRight = `R:${formatBytes(totalRead)}/s W:${formatBytes(totalWrite)}/s`;
+      out.push(...panel('0 disk io', diskLines, width, theme.disk, theme.border, diskLines.length, diskHeaderRight));
+    } else if (panelName === 'net') {
+      // --- Box 3: 7 net ---
+      const netLines: string[] = [];
+      const rxRate = opts.history?.netRxRate.length ? opts.history.netRxRate[opts.history.netRxRate.length - 1] : 0;
+      const txRate = opts.history?.netTxRate.length ? opts.history.netTxRate[opts.history.netTxRate.length - 1] : 0;
+
+      netLines.push(`down ▼ ${formatBytes(rxRate)}/s (${formatBytes(data.network.rxBytes)})`);
+      if (opts.history?.netRxRate.length) {
+        const gMode = opts.graphMode || 'spark';
+        const gStr = gMode === 'bar' ? sparkline(opts.history.netRxRate, {}) : brailleGraph(opts.history.netRxRate, {});
+        netLines.push(chalk.cyan(fitVisible(gStr, contentWidth)));
       }
-      diskLines.push(`${mountShort} ${d.used}/${d.size} [${gaugeBar(capNum, Math.max(3, contentWidth - 18 - ioStr.length))}] ${d.capacity}${ioStr}`);
-    }
-    const totalRead = data.disk.reduce((acc, d) => acc + (d.readBytesSec || 0), 0);
-    const totalWrite = data.disk.reduce((acc, d) => acc + (d.writeBytesSec || 0), 0);
-    const diskHeaderRight = `R:${formatBytes(totalRead)}/s W:${formatBytes(totalWrite)}/s`;
-    out.push(...panel('0 disk io', diskLines, width, theme.disk, theme.border, diskLines.length, diskHeaderRight));
-  }
-
-  // --- Box 3: 7 net ---
-  const netLines: string[] = [];
-  const rxRate = opts.history?.netRxRate.length ? opts.history.netRxRate[opts.history.netRxRate.length - 1] : 0;
-  const txRate = opts.history?.netTxRate.length ? opts.history.netTxRate[opts.history.netTxRate.length - 1] : 0;
 
-  netLines.push(`down ▼ ${formatBytes(rxRate)}/s (${formatBytes(data.network.rxBytes)})`);
-  if (opts.history?.netRxRate.length) {
-    netLines.push(chalk.cyan(fitVisible(sparkline(opts.history.netRxRate, {}), contentWidth)));
-  }
+      netLines.push(`up   ▲ ${formatBytes(txRate)}/s (${formatBytes(data.network.txBytes)})`);
+      if (opts.history?.netTxRate.length) {
+        const gMode = opts.graphMode || 'spark';
+        const gStr = gMode === 'bar' ? sparkline(opts.history.netTxRate, {}) : brailleGraph(opts.history.netTxRate, {});
+        netLines.push(theme.network(fitVisible(gStr, contentWidth)));
+      }
 
-  netLines.push(`up   ▲ ${formatBytes(txRate)}/s (${formatBytes(data.network.txBytes)})`);
-  if (opts.history?.netTxRate.length) {
-    netLines.push(theme.network(fitVisible(sparkline(opts.history.netTxRate, {}), contentWidth)));
+      out.push(...panel('7 net', netLines, width, theme.network, theme.border, netLines.length, `${data.network.interface}`));
+    }
   }
 
-  out.push(...panel('7 net', netLines, width, theme.network, theme.border, netLines.length, `${data.network.interface}`));
-
   return out;
 }
 

package/src/formatters/types.ts

@@ -48,6 +48,7 @@ export interface AnomalyAlert {
   value: number;
   zScore: number;
   severity: 'warning' | 'critical';
+  timestamp?: Date;
 }
 
 export interface TableOptions {
@@ -66,13 +67,17 @@ export interface TableOptions {
     /** Show process tree view instead of flat list. */
     treeView?: boolean;
     /** Active panel for detail/focus view. 'grid' means show all panels. */
-    activePanel?: 'grid' | 'cpu' | 'mem' | 'gpu' | 'power' | 'battery' | 'thermal' | 'network' | 'packets' | 'tasks' | 'disk' | 'process' | 'p2p';
+    activePanel?: 'grid' | 'cpu' | 'mem' | 'gpu' | 'power' | 'battery' | 'thermal' | 'network' | 'packets' | 'tasks' | 'disk' | 'process' | 'p2p' | 'anomalies';
     /** Active anomaly alerts from the statistical detector. */
     anomalies?: AnomalyAlert[];
+    /** Historical anomaly alerts for the anomalies tab. */
+    anomalyHistory?: AnomalyAlert[];
     /** Temperature display unit: 'c' or 'f'. */
     tempUnit?: 'c' | 'f';
     /** Rolling history instance for live graphs. */
     history?: History;
     /** Graph mode: 'spark' or 'bar'. */
     graphMode?: 'spark' | 'bar';
+    /** Panel layout order. */
+    panelLayout?: string[];
 }

package/src/index.ts

@@ -22,6 +22,8 @@ import { generateZshCompletions, generateBashCompletions, generateFishCompletion
 import { runHistoryCommand } from './historyCmd.js';
 import { runDiffCommand } from './diffCmd.js';
 import { readConfig, CONFIG_FILE } from './state/config.js';
+import { generateXbarPlugin } from './xbar.js';
+import { runFleetCommand } from './fleet.js';
 
 const config = readConfig();
 
@@ -65,10 +67,9 @@ program
     .option('--p2p-deny <ips>', 'Comma-separated list of denied IPs')
     .option('--p2p-audit-log <dir>', 'Directory for P2P audit logs')
     .option('--p2p-hmac-key <key>', 'HMAC key for message signing (default: derived from password)')
-    .option('--port <port>', 'Port number for web server mode', '3000')
-    .option('--web-auth', 'Enable Basic Authentication for web server')
-    .option('--web-user <user>', 'Username for web server authentication', 'admin')
-    .option('--web-pass <pass>', 'Password for web server authentication', 'pyre');
+    .option('--webhook-url <url>', 'URL to POST to on alert')
+    .option('--alert-cmd <cmd>', 'Command to execute on alert')
+    .option('--port <port>', 'Port number for web server mode', '3000');
 
 program.parse(process.argv);
 
@@ -89,6 +90,21 @@ function sanitizeHost(host: string): string {
 
 function detectLocalIP(): string | null {
   const ifaces = os.networkInterfaces();
+  const prioritizedNames = ['en0', 'en1', 'wlan0', 'eth0'];
+  
+  // 1. Try prioritized active interfaces
+  for (const name of prioritizedNames) {
+    const addrs = ifaces[name];
+    if (addrs) {
+      for (const addr of addrs) {
+        if (addr.family === 'IPv4' && !addr.internal) {
+          return addr.address;
+        }
+      }
+    }
+  }
+
+  // 2. Fallback to any non-internal IPv4
   for (const [, addrs] of Object.entries(ifaces)) {
     if (!addrs) continue;
     for (const addr of addrs) {
@@ -191,8 +207,26 @@ async function main() {
     return;
   }
 
-  const alertCpu = opts.alertCpu ? parseInt(opts.alertCpu, 10) : undefined;
-  const alertTemp = opts.alertTemp ? parseInt(opts.alertTemp, 10) : undefined;
+  if (cmd === 'xbar') {
+    generateXbarPlugin();
+    return;
+  }
+
+  if (cmd === 'fleet') {
+    const hosts = program.args.slice(1);
+    if (hosts.length === 0) {
+      console.error(chalk.red('Usage: pyre fleet <host1> [host2] ...'));
+      process.exit(1);
+    }
+    runFleetCommand(hosts);
+    return;
+  }
+
+  if (opts.alertCpu) config.cpuAlertPct = Number(opts.alertCpu);
+  if (opts.alertTemp) config.tempAlertC = Number(opts.alertTemp);
+  if (opts.webhookUrl) config.webhookUrl = opts.webhookUrl;
+  if (opts.alertCmd) config.alertCmd = opts.alertCmd;
+  if (opts.exportDir) config.exportDir = opts.exportDir;
   const tempUnit = opts.tempUnit === 'f' ? 'f' : 'c';
 
   if (cmd === 'live' || (!isExportMode() && !opts.once && cmd !== 'p2p')) {
@@ -215,8 +249,8 @@ async function main() {
       theme: opts.theme || config.theme,
       exportDir: opts.exportDir || config.exportDir,
       autoLog: opts.log || config.autoLog,
-      alertCpu,
-      alertTemp,
+      alertCpu: config.cpuAlertPct,
+      alertTemp: config.tempAlertC,
       tempUnit,
     }, splashPromise);
     return;
@@ -510,37 +544,11 @@ async function runSshCommand(host: string): Promise<void> {
 async function runWebCommand(): Promise<void> {
   const http = await import('node:http');
   const port = parseInt(opts.port || process.env.PORT || '3000', 10) || 3000;
-  const authEnabled = !!opts.webAuth;
-  const authUser = opts.webUser || 'admin';
-  const authPass = opts.webPass || 'pyre';
 
   const server = http.createServer(async (req, res) => {
-    // 1. Basic Authentication Check
-    if (authEnabled) {
-      const authHeader = req.headers.authorization;
-      if (!authHeader || !authHeader.startsWith('Basic ')) {
-        res.writeHead(401, {
-          'WWW-Authenticate': 'Basic realm="pyre Web Dashboard"',
-          'Content-Type': 'text/plain',
-        });
-        res.end('401 Unauthorized');
-        return;
-      }
-      const credentials = Buffer.from(authHeader.split(' ')[1], 'base64').toString('utf-8');
-      const [user, pass] = credentials.split(':');
-      if (user !== authUser || pass !== authPass) {
-        res.writeHead(401, {
-          'WWW-Authenticate': 'Basic realm="pyre Web Dashboard"',
-          'Content-Type': 'text/plain',
-        });
-        res.end('401 Unauthorized');
-        return;
-      }
-    }
-
     const url = req.url || '/';
 
-    // 2. Health check endpoint
+    // 1. Health check endpoint
     if (url === '/health' || url === '/api/health') {
       res.writeHead(200, { 'Content-Type': 'application/json' });
       res.end(JSON.stringify({ status: 'ok', uptime: process.uptime(), timestamp: new Date().toISOString() }));
@@ -574,18 +582,21 @@ async function runWebCommand(): Promise<void> {
       return;
     }
 
-    // 4. Static HTML dashboard & API snapshot endpoints
+    // 4. Static/Dynamic HTML live dashboard & API snapshot endpoints
     if (url === '/' || url === '/index.html') {
+      res.writeHead(200, { 'Content-Type': 'text/html' });
+      const data = await collectAll({ detailed: true });
+      const htmlContent = formatHtml(data);
+      res.end(htmlContent);
+    } else if (url === '/setup') {
       res.writeHead(200, { 'Content-Type': 'text/html' });
       const indexPath = path.join(process.cwd(), 'index.html');
-      let htmlContent = '';
       if (fs.existsSync(indexPath)) {
-        htmlContent = fs.readFileSync(indexPath, 'utf-8');
+        res.end(fs.readFileSync(indexPath, 'utf-8'));
       } else {
         const data = await collectAll({ detailed: true });
-        htmlContent = formatHtml(data);
+        res.end(formatHtml(data));
       }
-      res.end(htmlContent);
     } else if (url === '/api' || url === '/api/stats' || url === '/data') {
       const data = await collectAll({ detailed: true });
       res.writeHead(200, {
@@ -600,15 +611,30 @@ async function runWebCommand(): Promise<void> {
     }
   });
 
+  server.on('error', (err: any) => {
+    if (err.code === 'EADDRINUSE') {
+      console.log(chalk.red(`\nError: Port ${port} is already in use.`));
+      console.log(chalk.yellow(`  Try specifying a different port using --port <port>, e.g.:`));
+      console.log(chalk.dim(`  npx tsx src/index.ts web --port ${port + 1}\n`));
+      process.exit(1);
+    } else {
+      console.log(chalk.red(`Server error: ${err.message}`));
+      process.exit(1);
+    }
+  });
+
+  const ip = detectLocalIP() || 'localhost';
+
   server.listen(port, '0.0.0.0', () => {
     console.log(chalk.bold(`\n  pyre web server running on port ${port}`));
-    console.log(chalk.dim(`  Dashboard: http://0.0.0.0:${port}/`));
-    console.log(chalk.dim(`  API:       http://0.0.0.0:${port}/api`));
-    console.log(chalk.dim(`  SSE Stream: http://0.0.0.0:${port}/api/stream`));
-    if (authEnabled) {
-      console.log(chalk.yellow(`  Authentication: Enabled (${authUser}:${authPass})`));
-    }
-    console.log(chalk.dim('  Press Ctrl+C to stop\n'));
+    console.log(chalk.dim(`  Local URL:   http://localhost:${port}/`));
+    console.log(chalk.hex('#ff6a39').bold(`  Network URL: http://${ip}:${port}/  (Accessible on same Wi-Fi / LAN)`));
+    console.log(chalk.dim(`  API:         http://${ip}:${port}/api`));
+    console.log(chalk.dim(`  SSE Stream:  http://${ip}:${port}/api/stream`));
+    console.log(chalk.yellow(`\n  Troubleshooting connection from phone/other devices:`));
+    console.log(chalk.dim(`  1. macOS Firewall: System Settings -> Network -> Firewall -> Allow incoming node/pyre connections`));
+    console.log(chalk.dim(`  2. Wi-Fi Router: Ensure "AP Isolation" / "Guest Mode" is OFF on your Wi-Fi router`));
+    console.log(chalk.dim(`  3. Verify phone is connected to the exact same Wi-Fi network\n`));
   });
 
   process.once('SIGINT', () => {