feat: server monitoring charts, package limits, WHMCS bridge, server options (#19-22)

#19 Server monitoring charts:
- server_stats table (migration 007) + collect-stats.php cron script
- serverStatus() page rebuilt with Chart.js line charts (CPU/RAM/disk)
- Chart.js lazy-loaded from CDN; history shown for last 24h

#20 Cron job manager: already complete in prior session

#21 Package limits enforcement:
- email.php: checks max_email before creating email account
- databases.php: checks max_databases before creating database
- ftp.php: checks max_ftp before creating FTP account
- stats.php: fixed column names (max_email/max_ftp/max_databases vs old aliases)

#22b WHMCS billing bridge:
- whmcs.php endpoint: create/suspend/unsuspend/terminate/changepackage/info
- Auth via X-WHMCS-Key header; enabled/key stored in settings table

#22a/c/d/e Server options admin page:
- Web/mail/FTP/DNS server selection with settings persistence
- Server switch triggers /opt/novacpx/bin/switch-*.sh scripts (if present)
- NS health checker: live dig lookup of all zones vs configured NS1/NS2
- system.php: server-options + save-option actions
- dns.php: ns-health action

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

db/migrations/007_stats_settings.sql

@@ -0,0 +1,22 @@
+-- Migration 007: server_stats table + server type settings + WHMCS key
+CREATE TABLE IF NOT EXISTS server_stats (
+    id          INT UNSIGNED AUTO_INCREMENT PRIMARY KEY,
+    cpu_usage   DECIMAL(5,2)  DEFAULT 0,
+    ram_usage   DECIMAL(5,2)  DEFAULT 0,
+    disk_usage  DECIMAL(5,2)  DEFAULT 0,
+    load_avg    DECIMAL(8,2)  DEFAULT 0,
+    net_in_kb   BIGINT        DEFAULT 0,
+    net_out_kb  BIGINT        DEFAULT 0,
+    recorded_at TIMESTAMP     DEFAULT CURRENT_TIMESTAMP,
+    INDEX (recorded_at)
+) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
+
+INSERT IGNORE INTO settings (`key`, `value`) VALUES
+    ('web_server',   'apache'),
+    ('mail_server',  'postfix-dovecot'),
+    ('ftp_server',   'proftpd'),
+    ('dns_server',   'bind9'),
+    ('whmcs_api_key', ''),
+    ('whmcs_enabled', '0'),
+    ('ns1_hostname', ''),
+    ('ns2_hostname', '');

panel/api/endpoints/databases.php

@@ -19,6 +19,12 @@ match ($action) {
 
     'create' => (function() use ($db, $body, $accountId) {
         if (!$accountId) Response::error("account_id required");
+        // Package limit check
+        $acctPkg = $db->fetchOne("SELECT p.max_databases FROM accounts a LEFT JOIN packages p ON p.id=a.package_id WHERE a.id=?", [$accountId]);
+        if ($acctPkg && $acctPkg['max_databases'] > 0) {
+            $count = (int)$db->fetchOne("SELECT COUNT(*) c FROM databases WHERE account_id=?", [$accountId])['c'];
+            if ($count >= (int)$acctPkg['max_databases']) Response::error("Database limit ({$acctPkg['max_databases']}) reached for this package", 403);
+        }
         $type   = $body['type'] ?? 'mysql';
         $dbName = trim($body['db_name'] ?? '');
         $dbUser = trim($body['db_user'] ?? $dbName . '_user');

panel/api/endpoints/dns.php

@@ -97,5 +97,29 @@ match ($action) {
         Response::success(['domain' => $domain, 'results' => $results]);
     })(),
 
+    // ── NS Health Checker (#22e) ─────────────────────────────────────────────
+    'ns-health' => (function() use ($db) {
+        Auth::getInstance()->require('admin');
+        $ns1 = $db->fetchOne("SELECT value FROM settings WHERE `key`='ns1_hostname'")['value'] ?? '';
+        $ns2 = $db->fetchOne("SELECT value FROM settings WHERE `key`='ns2_hostname'")['value'] ?? '';
+        $zones = $db->fetchAll("SELECT domain FROM dns_zones ORDER BY domain LIMIT 200");
+        $results = [];
+        foreach ($zones as $z) {
+            $domain = $z['domain'];
+            $raw = shell_exec("dig +short NS " . escapeshellarg($domain) . " 2>/dev/null") ?? '';
+            $nsRecords = array_filter(array_map('trim', explode("\n", $raw)));
+            $foundNs1 = $ns1 ? in_array(rtrim($ns1,'.').'.', array_map(fn($n)=>rtrim($n,'.').'.', $nsRecords)) : null;
+            $foundNs2 = $ns2 ? in_array(rtrim($ns2,'.').'.', array_map(fn($n)=>rtrim($n,'.').'.', $nsRecords)) : null;
+            $results[] = [
+                'domain' => $domain,
+                'ns1'    => $nsRecords[0] ?? null,
+                'ns2'    => $nsRecords[1] ?? null,
+                'ok'     => ($ns1 ? $foundNs1 : true) && ($ns2 ? $foundNs2 : true),
+                'ns_raw' => $nsRecords,
+            ];
+        }
+        Response::success(['results' => $results, 'expected_ns1' => $ns1, 'expected_ns2' => $ns2]);
+    })(),
+
     default => Response::error("Unknown dns action: $action", 404),
 };

panel/api/endpoints/email.php

@@ -30,6 +30,12 @@ match ($action) {
         if (!filter_var($email, FILTER_VALIDATE_EMAIL)) Response::error("Invalid email address");
         if (strlen($password) < 6) Response::error("Password must be at least 6 characters");
         if (!$accountId) Response::error("account_id required");
+        // Package limit check
+        $acctPkg = $db->fetchOne("SELECT p.max_email FROM accounts a LEFT JOIN packages p ON p.id=a.package_id WHERE a.id=?", [$accountId]);
+        if ($acctPkg && $acctPkg['max_email'] > 0) {
+            $count = (int)$db->fetchOne("SELECT COUNT(*) c FROM email_accounts WHERE account_id=?", [$accountId])['c'];
+            if ($count >= (int)$acctPkg['max_email']) Response::error("Email account limit ({$acctPkg['max_email']}) reached for this package", 403);
+        }
         $id = EmailManager::createAccount($accountId, $email, $password, $quota);
         audit('email.create', $email);
         Response::success(['id' => $id], "Email account created: $email");

panel/api/endpoints/ftp.php

@@ -15,6 +15,12 @@ match ($action) {
 
     'create' => (function() use ($db, $body, $accountId) {
         if (!$accountId) Response::error("account_id required");
+        // Package limit check
+        $acctPkg = $db->fetchOne("SELECT p.max_ftp FROM accounts a LEFT JOIN packages p ON p.id=a.package_id WHERE a.id=?", [$accountId]);
+        if ($acctPkg && $acctPkg['max_ftp'] > 0) {
+            $count = (int)$db->fetchOne("SELECT COUNT(*) c FROM ftp_accounts WHERE account_id=?", [$accountId])['c'];
+            if ($count >= (int)$acctPkg['max_ftp']) Response::error("FTP account limit ({$acctPkg['max_ftp']}) reached for this package", 403);
+        }
         $username = trim($body['username'] ?? '');
         $password = $body['password'] ?? bin2hex(random_bytes(6));
         $acct     = $db->fetchOne("SELECT home_dir FROM accounts WHERE id = ?", [$accountId]);

panel/api/endpoints/stats.php

@@ -76,17 +76,17 @@ match ($action) {
         $pkg = $db->fetchOne("SELECT * FROM packages WHERE id = ?", [$acct['package_id'] ?? 0]);
 
         Response::success([
-            'disk_mb'     => $diskMB,
+            'disk_mb'         => $diskMB,
-            'disk_limit'  => $pkg['disk_mb'] ?? 0,
+            'disk_limit'      => $pkg['disk_mb']         ?? 0,
-            'inodes'      => $inodes,
+            'inodes'          => $inodes,
-            'databases'   => $dbCount,
+            'databases'       => $dbCount,
-            'db_limit'    => $pkg['databases'] ?? 0,
+            'db_limit'        => $pkg['max_databases']   ?? 0,
-            'emails'      => $emailCount,
+            'emails'          => $emailCount,
-            'email_limit' => $pkg['email_accounts'] ?? 0,
+            'email_limit'     => $pkg['max_email']       ?? 0,
-            'ftp'         => $ftpCount,
+            'ftp'             => $ftpCount,
-            'ftp_limit'   => $pkg['ftp_accounts'] ?? 0,
+            'ftp_limit'       => $pkg['max_ftp']         ?? 0,
-            'domains'     => $domCount,
+            'domains'         => $domCount,
-            'subdomain_limit' => $pkg['subdomains'] ?? 0,
+            'subdomain_limit' => $pkg['max_subdomains']  ?? 0,
         ]);
     })(),
 

panel/api/endpoints/system.php

@@ -349,5 +349,43 @@ match ($action) {
         Response::paginate($rows, (int)$total, $page, $perPage);
     })(),
 
+    // ── Server Options (#22a-e) ───────────────────────────────────────────────
+    'server-options' => (function() use ($db) {
+        Auth::getInstance()->require('admin');
+        $keys = ['web_server','mail_server','ftp_server','dns_server','whmcs_api_key','whmcs_enabled','ns1_hostname','ns2_hostname'];
+        $opts = [];
+        foreach ($db->fetchAll("SELECT `key`,`value` FROM settings WHERE `key` IN ('" . implode("','", $keys) . "')") as $r) {
+            $opts[$r['key']] = $r['value'];
+        }
+        // Detect actually-running services
+        $opts['apache_active']   = !empty(trim(shell_exec('systemctl is-active apache2 2>/dev/null') ?: '')) && trim(shell_exec('systemctl is-active apache2 2>/dev/null')) === 'active';
+        $opts['nginx_active']    = trim(shell_exec('systemctl is-active nginx 2>/dev/null') ?: '') === 'active';
+        $opts['proftpd_active']  = trim(shell_exec('systemctl is-active proftpd 2>/dev/null') ?: '') === 'active';
+        $opts['vsftpd_active']   = trim(shell_exec('systemctl is-active vsftpd 2>/dev/null') ?: '') === 'active';
+        $opts['pureftpd_active'] = trim(shell_exec('systemctl is-active pure-ftpd 2>/dev/null') ?: '') === 'active';
+        $opts['bind9_active']    = trim(shell_exec('systemctl is-active named 2>/dev/null || systemctl is-active bind9 2>/dev/null') ?: '') === 'active';
+        $opts['powerdns_active'] = trim(shell_exec('systemctl is-active pdns 2>/dev/null') ?: '') === 'active';
+        Response::success($opts);
+    })(),
+
+    'save-option' => (function() use ($db, $body) {
+        Auth::getInstance()->require('admin');
+        $key   = $body['key']   ?? '';
+        $value = $body['value'] ?? '';
+        $allowed = ['web_server','mail_server','ftp_server','dns_server','whmcs_api_key','whmcs_enabled','ns1_hostname','ns2_hostname'];
+        if (!in_array($key, $allowed)) Response::error("Invalid setting key: $key");
+        $db->execute("INSERT INTO settings (`key`,`value`) VALUES (?,?) ON DUPLICATE KEY UPDATE `value`=VALUES(`value`)", [$key, $value]);
+
+        // For server switches, run install/reload scripts
+        if (in_array($key, ['web_server','ftp_server','dns_server','mail_server'])) {
+            $script = "/opt/novacpx/bin/switch-{$key}.sh";
+            if (is_executable($script)) {
+                shell_exec("sudo {$script} " . escapeshellarg($value) . " > /var/log/novacpx/switch-{$key}.log 2>&1 &");
+            }
+        }
+        audit("settings.{$key}", $value);
+        Response::success(null, "Setting saved: {$key} = {$value}");
+    })(),
+
     default => Response::error("Unknown system action: $action", 404),
 };

panel/api/endpoints/whmcs.php

@@ -0,0 +1,125 @@
+<?php
+/**
+ * WHMCS provisioning bridge (#22b)
+ * Auth: X-WHMCS-Key header or whmcs_key GET param
+ * Actions: create, suspend, unsuspend, terminate, info
+ */
+require_once NOVACPX_LIB . '/AccountManager.php';
+
+$db = DB::getInstance();
+
+// WHMCS API key auth (bypasses session auth)
+$storedKey = $db->fetchOne("SELECT value FROM settings WHERE `key`='whmcs_api_key'")['value'] ?? '';
+$enabled   = (bool)($db->fetchOne("SELECT value FROM settings WHERE `key`='whmcs_enabled'")['value'] ?? '0');
+
+if (!$enabled || !$storedKey) Response::error('WHMCS integration is disabled', 403);
+
+$receivedKey = $_SERVER['HTTP_X_WHMCS_KEY'] ?? $_GET['whmcs_key'] ?? '';
+if (!hash_equals($storedKey, $receivedKey)) Response::error('Invalid API key', 401);
+
+$body = json_decode(file_get_contents('php://input'), true) ?? [];
+
+match ($action) {
+
+    'create' => (function() use ($db, $body) {
+        $username = strtolower(preg_replace('/[^a-z0-9_]/', '', $body['username'] ?? ''));
+        $domain   = strtolower(trim($body['domain'] ?? ''));
+        $email    = trim($body['email'] ?? '');
+        $pkgName  = trim($body['package'] ?? 'Default');
+        $password = $body['password'] ?? bin2hex(random_bytes(8));
+
+        if (!$username || !$domain) Response::error('username and domain required');
+
+        // Find or use default package
+        $pkg = $db->fetchOne("SELECT id FROM packages WHERE name = ? LIMIT 1", [$pkgName])
+            ?? $db->fetchOne("SELECT id FROM packages WHERE is_default = 1 LIMIT 1")
+            ?? $db->fetchOne("SELECT id FROM packages LIMIT 1");
+        if (!$pkg) Response::error('No packages configured');
+
+        // Create panel user
+        $existing = $db->fetchOne("SELECT id FROM users WHERE email = ?", [$email]);
+        if ($existing) {
+            $userId = (int)$existing['id'];
+        } else {
+            $db->execute(
+                "INSERT INTO users (username, email, password, role) VALUES (?,?,?,'user')",
+                [$username, $email ?: "{$username}@{$domain}", password_hash($password, PASSWORD_BCRYPT)]
+            );
+            $userId = (int)$db->fetchOne("SELECT LAST_INSERT_ID() as id")['id'];
+        }
+
+        $result = AccountManager::create([
+            'username'   => $username,
+            'domain'     => $domain,
+            'user_id'    => $userId,
+            'package_id' => $pkg['id'],
+            'password'   => $password,
+        ]);
+
+        audit('whmcs.create', "account:{$username}");
+        Response::success([
+            'account_id' => $result['account_id'] ?? null,
+            'username'   => $username,
+            'domain'     => $domain,
+            'password'   => $password,
+        ], 'Account created');
+    })(),
+
+    'suspend' => (function() use ($db, $body) {
+        $username = $body['username'] ?? '';
+        $reason   = $body['reason'] ?? 'WHMCS suspend';
+        $acct = $db->fetchOne("SELECT id FROM accounts WHERE username = ?", [$username]);
+        if (!$acct) Response::error("Account not found: $username", 404);
+        AccountManager::suspend((int)$acct['id'], $reason);
+        audit('whmcs.suspend', "account:{$username}");
+        Response::success(null, 'Account suspended');
+    })(),
+
+    'unsuspend' => (function() use ($db, $body) {
+        $username = $body['username'] ?? '';
+        $acct = $db->fetchOne("SELECT id FROM accounts WHERE username = ?", [$username]);
+        if (!$acct) Response::error("Account not found: $username", 404);
+        AccountManager::unsuspend((int)$acct['id']);
+        audit('whmcs.unsuspend', "account:{$username}");
+        Response::success(null, 'Account unsuspended');
+    })(),
+
+    'terminate' => (function() use ($db, $body) {
+        $username = $body['username'] ?? '';
+        $acct = $db->fetchOne("SELECT id FROM accounts WHERE username = ?", [$username]);
+        if (!$acct) Response::error("Account not found: $username", 404);
+        AccountManager::terminate((int)$acct['id']);
+        audit('whmcs.terminate', "account:{$username}");
+        Response::success(null, 'Account terminated');
+    })(),
+
+    'changepackage' => (function() use ($db, $body) {
+        $username = $body['username'] ?? '';
+        $pkgName  = $body['package'] ?? '';
+        $acct = $db->fetchOne("SELECT id FROM accounts WHERE username = ?", [$username]);
+        if (!$acct) Response::error("Account not found: $username", 404);
+        $pkg = $db->fetchOne("SELECT id FROM packages WHERE name = ?", [$pkgName]);
+        if (!$pkg) Response::error("Package not found: $pkgName", 404);
+        $db->execute("UPDATE accounts SET package_id = ? WHERE id = ?", [(int)$pkg['id'], (int)$acct['id']]);
+        audit('whmcs.changepackage', "account:{$username} pkg:{$pkgName}");
+        Response::success(null, 'Package changed');
+    })(),
+
+    'info' => (function() use ($db, $body) {
+        $username = $body['username'] ?? $_GET['username'] ?? '';
+        $acct = $db->fetchOne(
+            "SELECT a.*, p.name as package_name FROM accounts a LEFT JOIN packages p ON p.id=a.package_id WHERE a.username = ?",
+            [$username]
+        );
+        if (!$acct) Response::error("Account not found: $username", 404);
+        Response::success([
+            'username' => $acct['username'],
+            'domain'   => $acct['domain'] ?? '',
+            'status'   => $acct['status'],
+            'package'  => $acct['package_name'] ?? '',
+            'created'  => $acct['created_at'] ?? '',
+        ]);
+    })(),
+
+    default => Response::error("Unknown whmcs action: $action", 404),
+};

panel/bin/collect-stats.php

@@ -0,0 +1,65 @@
+#!/usr/bin/env php
+<?php
+/**
+ * NovaCPX stats collector — runs every 5 minutes via cron
+ * Cron: *\/5 * * * * root /usr/bin/php /opt/novacpx/bin/collect-stats.php
+ */
+define('NOVACPX_ROOT', '/srv/novacpx/public');
+define('NOVACPX_LIB',  NOVACPX_ROOT . '/lib');
+require NOVACPX_ROOT . '/lib/Core.php';
+require NOVACPX_ROOT . '/lib/DB.php';
+
+// CPU usage (idle from /proc/stat)
+$stat1 = file_get_contents('/proc/stat');
+usleep(200000); // 200ms sample
+$stat2 = file_get_contents('/proc/stat');
+
+$line1 = explode(' ', trim(explode("\n", $stat1)[0]));
+$line2 = explode(' ', trim(explode("\n", $stat2)[0]));
+array_shift($line1); array_shift($line2);
+$line1 = array_filter($line1, 'strlen'); $line2 = array_filter($line2, 'strlen');
+$line1 = array_values($line1); $line2 = array_values($line2);
+$total1 = array_sum($line1); $total2 = array_sum($line2);
+$idle1 = (int)($line1[3] ?? 0); $idle2 = (int)($line2[3] ?? 0);
+$cpuPct = $total1 === $total2 ? 0 : round((1 - ($idle2 - $idle1) / ($total2 - $total1)) * 100, 2);
+
+// RAM
+$meminfo = [];
+foreach (file('/proc/meminfo') as $line) {
+    if (preg_match('/^(\w+):\s+(\d+)/', $line, $m)) $meminfo[$m[1]] = (int)$m[2];
+}
+$ramPct = isset($meminfo['MemTotal'], $meminfo['MemAvailable'])
+    ? round((1 - $meminfo['MemAvailable'] / $meminfo['MemTotal']) * 100, 2)
+    : 0;
+
+// Disk
+$dfLine  = trim(shell_exec("df / | tail -1") ?: '');
+$dfParts = preg_split('/\s+/', $dfLine);
+$diskPct = isset($dfParts[4]) ? (float) rtrim($dfParts[4], '%') : 0;
+
+// Load
+$load = sys_getloadavg();
+
+// Network I/O (eth0 or first interface)
+$netIn = 0; $netOut = 0;
+$netData = @file_get_contents('/proc/net/dev');
+if ($netData) {
+    foreach (explode("\n", $netData) as $line) {
+        if (preg_match('/^\s*(eth0|ens\w+|enp\w+|eno\w+):\s*(\d+)(?:\s+\d+){7}\s+(\d+)/', $line, $m)) {
+            $netIn  = (int)($m[2] / 1024);
+            $netOut = (int)($m[3] / 1024);
+            break;
+        }
+    }
+}
+
+// Insert
+$db = DB::getInstance();
+$db->execute(
+    "INSERT INTO server_stats (cpu_usage, ram_usage, disk_usage, load_avg, net_in_kb, net_out_kb)
+     VALUES (?,?,?,?,?,?)",
+    [$cpuPct, $ramPct, $diskPct, $load[0], $netIn, $netOut]
+);
+
+// Prune rows older than 30 days
+$db->execute("DELETE FROM server_stats WHERE recorded_at < DATE_SUB(NOW(), INTERVAL 30 DAY)");

panel/public/admin/index.php

@@ -150,6 +150,10 @@ $_v = fn($f) => '?v=' . @filemtime(dirname(__DIR__) . $f);
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M17.5 19H9a7 7 0 1 1 6.71-9h1.79a4.5 4.5 0 1 1 0 9z"/></svg>
           Cloudflare
         </a>
+        <a href="#" class="sidebar-link" data-page="server-options">
+          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="2" width="20" height="8" rx="2"/><rect x="2" y="14" width="20" height="8" rx="2"/><line x1="6" y1="6" x2="6.01" y2="6"/><line x1="6" y1="18" x2="6.01" y2="18"/></svg>
+          Server Options
+        </a>
         <a href="#" class="sidebar-link" data-page="settings">
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg>
           Settings

panel/public/assets/js/admin.js

@@ -98,6 +98,7 @@
     updates,
     backups,
     cloudflare,
+    'server-options': serverOptions,
     settings,
   };
 
@@ -182,29 +183,81 @@
 
   // ── Server Status ──────────────────────────────────────────────────────────
   async function serverStatus() {
-    const res = await Nova.api('system', 'stats');
+    const [liveRes, histRes] = await Promise.all([
-    const s = res?.data || {};
+      Nova.api('system', 'stats'),
-    return `
+      Nova.api('stats', 'server'),
+    ]);
+    const s    = liveRes?.data || {};
+    const hist = histRes?.data?.history || [];
+
+    const html = `
+<div class="page-header"><h2 class="page-title">Server Status</h2>
+  <button class="btn btn-ghost btn-sm" onclick="adminPage('server-status')">↻ Refresh</button>
+</div>
+<div class="stats-grid" style="margin-bottom:1.5rem">
+  <div class="stat-card"><div class="stat-label">CPU</div><div class="stat-value ${(s.cpu?.pct||0)>80?'stat-red':'stat-green'}">${s.cpu?.pct??0}%</div><div class="mt-1">${Nova.progressBar(s.cpu?.pct||0)}</div></div>
+  <div class="stat-card"><div class="stat-label">RAM</div><div class="stat-value ${(s.ram?.pct||0)>80?'stat-red':'stat-blue'}">${s.ram?.pct??0}%</div><div class="mt-1">${Nova.progressBar(s.ram?.pct||0)}</div></div>
+  <div class="stat-card"><div class="stat-label">Disk</div><div class="stat-value ${(s.disk?.pct||0)>85?'stat-red':'stat-yellow'}">${s.disk?.pct??0}%</div><div class="mt-1">${Nova.progressBar(s.disk?.pct||0)}</div></div>
+  <div class="stat-card"><div class="stat-label">Load Avg</div><div class="stat-value" style="font-size:1rem;padding-top:.4rem">${(s.cpu?.load||[0]).map(v=>v.toFixed(2)).join(' / ')}</div><div class="stat-sub">Uptime: ${s.uptime||'—'}</div></div>
+</div>
 <div class="card">
-  <div class="card-header"><span class="card-title">Real-Time Server Status</span>
+  <div class="card-header"><span class="card-title">24-Hour History</span><span class="text-muted" style="font-size:.8rem">${hist.length} samples</span></div>
-    <button class="btn btn-ghost btn-sm" onclick="adminPage('server-status')">&#x21bb; Refresh</button>
-  </div>
   <div class="card-body">
-    <div class="grid-3">
+    ${hist.length === 0
-      <div><p class="text-muted text-sm mb-1">CPU</p><h2>${s.cpu?.pct}%</h2>${Nova.progressBar(s.cpu?.pct||0)}</div>
+      ? '<p class="text-muted" style="text-align:center;padding:2rem">No history yet — stats are collected every 5 minutes.<br>Check that the collector cron is running: <code>*/5 * * * * root /usr/bin/php /opt/novacpx/bin/collect-stats.php</code></p>'
-      <div><p class="text-muted text-sm mb-1">RAM</p><h2>${s.ram?.pct}%</h2>${Nova.progressBar(s.ram?.pct||0)}</div>
+      : '<canvas id="stats-chart" height="80"></canvas>'}
-      <div><p class="text-muted text-sm mb-1">Disk</p><h2>${s.disk?.pct}%</h2>${Nova.progressBar(s.disk?.pct||0)}</div>
-    </div>
-    <div class="mt-3">
-      <p class="text-muted text-sm mb-1">Load Average</p>
-      <p>${(s.cpu?.load||[]).join(' / ')}</p>
-    </div>
-    <div class="mt-3">
-      <p class="text-muted text-sm mb-1">Uptime</p>
-      <p>${s.uptime}</p>
-    </div>
   </div>
 </div>`;
+
+    // Can't return html and async render chart — use a trick: render then init chart
+    setTimeout(() => {
+      const canvas = document.getElementById('stats-chart');
+      if (!canvas || !hist.length) return;
+      if (!window.Chart) {
+        const s = document.createElement('script');
+        s.src = 'https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js';
+        s.onload = () => initStatsChart(canvas, hist);
+        document.head.appendChild(s);
+      } else {
+        initStatsChart(canvas, hist);
+      }
+    }, 100);
+
+    return html;
+  }
+
+  function initStatsChart(canvas, hist) {
+    const labels = hist.map(r => {
+      const d = new Date(r.recorded_at);
+      return d.getHours().toString().padStart(2,'0') + ':' + d.getMinutes().toString().padStart(2,'0');
+    });
+    const step = Math.max(1, Math.floor(labels.length / 24));
+    const sparse = labels.map((l,i) => i % step === 0 ? l : '');
+
+    new Chart(canvas, {
+      type: 'line',
+      data: {
+        labels: sparse,
+        datasets: [
+          { label: 'CPU %',  data: hist.map(r=>parseFloat(r.cpu_usage||0)),  borderColor:'#6366f1', backgroundColor:'rgba(99,102,241,.1)', tension:.3, pointRadius:0, fill:true },
+          { label: 'RAM %',  data: hist.map(r=>parseFloat(r.ram_usage||0)),  borderColor:'#0ea5e9', backgroundColor:'rgba(14,165,233,.1)',  tension:.3, pointRadius:0, fill:true },
+          { label: 'Disk %', data: hist.map(r=>parseFloat(r.disk_usage||0)), borderColor:'#f59e0b', backgroundColor:'rgba(245,158,11,.08)', tension:.3, pointRadius:0, fill:true },
+        ],
+      },
+      options: {
+        responsive: true,
+        animation: false,
+        interaction: { mode:'index', intersect:false },
+        scales: {
+          x: { grid:{ color:'rgba(255,255,255,.05)' }, ticks:{ color:'#8b92a5', maxRotation:0 } },
+          y: { min:0, max:100, grid:{ color:'rgba(255,255,255,.05)' }, ticks:{ color:'#8b92a5', callback: v=>v+'%' } },
+        },
+        plugins: {
+          legend: { labels:{ color:'#e2e4f0', font:{ size:12 } } },
+          tooltip: { callbacks:{ label: ctx => `${ctx.dataset.label}: ${ctx.parsed.y.toFixed(1)}%` } },
+        },
+      },
+    });
   }
 
   // ── Updates ────────────────────────────────────────────────────────────────
@@ -2527,3 +2580,182 @@ window.dockerQuotaModal = (userId, username) => {
     Nova.toast(r?.success ? 'Quota saved' : (r?.message||'Failed'), r?.success?'success':'error');
   };
 };
+
+// ── #22a-e Server Options ──────────────────────────────────────────────────
+async function serverOptions() {
+  const r = await Nova.api('system', 'server-options');
+  const opts = r?.data || {};
+
+  return `
+<div class="page-header"><h2 class="page-title">Server Options</h2></div>
+
+<div class="grid-2 gap-2" style="margin-bottom:1.5rem">
+
+  <!-- Web Server (#22d) -->
+  <div class="card">
+    <div class="card-header"><span class="card-title">Web Server</span>${Nova.badge(opts.web_server||'apache','green')}</div>
+    <div class="card-body">
+      <p class="text-muted" style="font-size:.85rem;margin-bottom:1rem">Current web server for hosting accounts. Changing requires migration of all vhosts.</p>
+      <div class="form-group">
+        <label>Active Web Server</label>
+        <select id="so-web" class="form-control">
+          ${['apache','nginx','openlitespeed','caddy'].map(s=>`<option value="${s}" ${s===(opts.web_server||'apache')?'selected':''}>${s.charAt(0).toUpperCase()+s.slice(1)}</option>`).join('')}
+        </select>
+      </div>
+      <button class="btn btn-primary btn-sm" onclick="soSave('web_server','so-web','Web server')">Save & Switch</button>
+    </div>
+  </div>
+
+  <!-- Mail Server (#22c) -->
+  <div class="card">
+    <div class="card-header"><span class="card-title">Mail Server</span>${Nova.badge(opts.mail_server||'postfix-dovecot','green')}</div>
+    <div class="card-body">
+      <p class="text-muted" style="font-size:.85rem;margin-bottom:1rem">Mail stack for all hosted domains.</p>
+      <div class="form-group">
+        <label>Mail Stack</label>
+        <select id="so-mail" class="form-control">
+          <option value="postfix-dovecot" ${opts.mail_server==='postfix-dovecot'?'selected':''}>Postfix + Dovecot</option>
+          <option value="postfix-dovecot-rspamd" ${opts.mail_server==='postfix-dovecot-rspamd'?'selected':''}>Postfix + Dovecot + Rspamd (spam filter)</option>
+        </select>
+      </div>
+      <button class="btn btn-primary btn-sm" onclick="soSave('mail_server','so-mail','Mail server')">Save & Switch</button>
+    </div>
+  </div>
+
+  <!-- FTP Server (#22a) -->
+  <div class="card">
+    <div class="card-header"><span class="card-title">FTP Server</span>${Nova.badge(opts.ftp_server||'proftpd','green')}</div>
+    <div class="card-body">
+      <p class="text-muted" style="font-size:.85rem;margin-bottom:1rem">FTP server for hosting account file transfers.</p>
+      <div class="form-group">
+        <label>FTP Server</label>
+        <select id="so-ftp" class="form-control">
+          <option value="proftpd"  ${opts.ftp_server==='proftpd'?'selected':''}>ProFTPD (default)</option>
+          <option value="vsftpd"   ${opts.ftp_server==='vsftpd'?'selected':''}>vsftpd</option>
+          <option value="pureftpd" ${opts.ftp_server==='pureftpd'?'selected':''}>Pure-FTPd</option>
+        </select>
+      </div>
+      <button class="btn btn-primary btn-sm" onclick="soSave('ftp_server','so-ftp','FTP server')">Save & Switch</button>
+    </div>
+  </div>
+
+  <!-- DNS Server (#22e) -->
+  <div class="card">
+    <div class="card-header"><span class="card-title">DNS Server</span>${Nova.badge(opts.dns_server||'bind9','green')}</div>
+    <div class="card-body">
+      <p class="text-muted" style="font-size:.85rem;margin-bottom:1rem">DNS server for authoritative name service.</p>
+      <div class="form-group">
+        <label>DNS Server</label>
+        <select id="so-dns" class="form-control">
+          <option value="bind9"    ${opts.dns_server==='bind9'?'selected':''}>BIND9 (default)</option>
+          <option value="powerdns" ${opts.dns_server==='powerdns'?'selected':''}>PowerDNS</option>
+          <option value="nsd"      ${opts.dns_server==='nsd'?'selected':''}>NSD</option>
+          <option value="none"     ${opts.dns_server==='none'?'selected':''}>No local DNS (external API)</option>
+        </select>
+      </div>
+      <button class="btn btn-primary btn-sm" onclick="soSave('dns_server','so-dns','DNS server')">Save & Switch</button>
+    </div>
+  </div>
+
+</div>
+
+<!-- WHMCS Bridge (#22b) -->
+<div class="card" style="margin-bottom:1.5rem">
+  <div class="card-header">
+    <span class="card-title">WHMCS Billing Bridge</span>
+    ${opts.whmcs_enabled==='1' ? Nova.badge('Enabled','green') : Nova.badge('Disabled','red')}
+  </div>
+  <div class="card-body">
+    <p class="text-muted" style="font-size:.85rem;margin-bottom:1rem">
+      Enable the WHMCS provisioning API so WHMCS can create, suspend, unsuspend, and terminate accounts automatically.
+      Use the API URL below in your WHMCS server module configuration.
+    </p>
+    <div class="grid-2">
+      <div class="form-group">
+        <label>WHMCS API Key</label>
+        <div style="display:flex;gap:.5rem">
+          <input id="so-whmcs-key" type="text" class="form-control" value="${Nova.escHtml(opts.whmcs_api_key||'')}" placeholder="Generate a random key">
+          <button class="btn btn-ghost btn-sm" onclick="document.getElementById('so-whmcs-key').value=Array.from(crypto.getRandomValues(new Uint8Array(24)),b=>b.toString(16).padStart(2,'0')).join('')">Generate</button>
+        </div>
+      </div>
+      <div class="form-group">
+        <label>WHMCS Enabled</label>
+        <select id="so-whmcs-enabled" class="form-control">
+          <option value="0" ${opts.whmcs_enabled!=='1'?'selected':''}>Disabled</option>
+          <option value="1" ${opts.whmcs_enabled==='1'?'selected':''}>Enabled</option>
+        </select>
+      </div>
+    </div>
+    <div class="form-group">
+      <label>Provisioning API URL (set this in WHMCS server module)</label>
+      <input type="text" class="form-control" readonly value="${location.protocol}//${location.hostname}:${location.port}/api/whmcs/create" onclick="this.select()">
+    </div>
+    <button class="btn btn-primary btn-sm" onclick="soSaveWhmcs()">Save WHMCS Settings</button>
+  </div>
+</div>
+
+<!-- NS Health Checker (#22e) -->
+<div class="card">
+  <div class="card-header">
+    <span class="card-title">Nameserver Health</span>
+    <button class="btn btn-sm btn-ghost" onclick="soCheckNS()">Check All</button>
+  </div>
+  <div class="card-body">
+    <div class="grid-2" style="margin-bottom:1rem">
+      <div class="form-group">
+        <label>NS1 Hostname</label>
+        <input id="so-ns1" class="form-control" value="${Nova.escHtml(opts.ns1_hostname||'')}" placeholder="ns1.yourdomain.com">
+      </div>
+      <div class="form-group">
+        <label>NS2 Hostname</label>
+        <input id="so-ns2" class="form-control" value="${Nova.escHtml(opts.ns2_hostname||'')}" placeholder="ns2.yourdomain.com">
+      </div>
+    </div>
+    <button class="btn btn-primary btn-sm" onclick="soSaveNS()">Save Nameservers</button>
+    <div id="so-ns-results" style="margin-top:1rem"></div>
+  </div>
+</div>`;
+}
+
+window.soSave = async (key, inputId, label) => {
+  const val = document.getElementById(inputId)?.value;
+  if (!val) return;
+  Nova.confirm(`Switch ${label} to "${val}"? This will run install/migration scripts on the server.`, async () => {
+    const r = await Nova.api('system', 'save-option', { method:'POST', body:{ key, value: val } });
+    Nova.toast(r?.success ? `${label} updated` : (r?.message||'Failed'), r?.success?'success':'error');
+    if (r?.success) Nova.loadPage('server-options', window._novaPages);
+  }, true);
+};
+
+window.soSaveWhmcs = async () => {
+  const key     = document.getElementById('so-whmcs-key')?.value?.trim();
+  const enabled = document.getElementById('so-whmcs-enabled')?.value;
+  const r1 = await Nova.api('system', 'save-option', { method:'POST', body:{ key:'whmcs_api_key', value:key } });
+  const r2 = await Nova.api('system', 'save-option', { method:'POST', body:{ key:'whmcs_enabled', value:enabled } });
+  Nova.toast((r1?.success && r2?.success) ? 'WHMCS settings saved' : 'Save failed', (r1?.success && r2?.success)?'success':'error');
+};
+
+window.soSaveNS = async () => {
+  const ns1 = document.getElementById('so-ns1')?.value?.trim();
+  const ns2 = document.getElementById('so-ns2')?.value?.trim();
+  await Nova.api('system', 'save-option', { method:'POST', body:{ key:'ns1_hostname', value:ns1 } });
+  await Nova.api('system', 'save-option', { method:'POST', body:{ key:'ns2_hostname', value:ns2 } });
+  Nova.toast('Nameservers saved', 'success');
+};
+
+window.soCheckNS = async () => {
+  const tc = document.getElementById('so-ns-results');
+  if (!tc) return;
+  tc.innerHTML = '<div class="loading">Checking NS records…</div>';
+  const r = await Nova.api('dns', 'ns-health');
+  const results = r?.data?.results || [];
+  if (!results.length) { tc.innerHTML = '<p class="text-muted">No zones to check, or DNS manager not configured.</p>'; return; }
+  tc.innerHTML = `<div style="overflow-x:auto"><table class="table"><thead><tr><th>Domain</th><th>NS1</th><th>NS2</th><th>Status</th></tr></thead><tbody>
+${results.map(z=>`<tr>
+  <td>${Nova.escHtml(z.domain)}</td>
+  <td style="font-family:monospace;font-size:.82rem">${Nova.escHtml(z.ns1||'—')}</td>
+  <td style="font-family:monospace;font-size:.82rem">${Nova.escHtml(z.ns2||'—')}</td>
+  <td>${z.ok ? Nova.badge('OK','green') : Nova.badge('Mismatch','red')}</td>
+</tr>`).join('')}
+</tbody></table></div>`;
+};