<h1>Alerting &amp; Escalation</h1>

<% if (forbidden) { %>
  <div class="alert alert-danger">Your role does not have permission to manage alerting.</div>
<% } else { %>

<% if (error) { %><div class="alert alert-danger"><%= error %></div><% } %>
<% if (testResult) { %><div class="alert alert-ok"><%= testResult %></div><% } %>

<div class="card">
  <h2 style="font-size:15px;margin-top:0">Channels</h2>
  <table>
    <thead><tr><th>Channel</th><th>Provider</th><th>From</th><th>Status</th><th>Updated</th></tr></thead>
    <tbody>
      <% for (const c of channels) { %>
      <tr>
        <td><%= c.channel %></td>
        <td><%= c.provider %></td>
        <td><%= c.from_identifier || '—' %></td>
        <td><span class="badge <%= c.is_active ? 'badge-ok' : 'badge-danger' %>"><%= c.is_active ? 'Active' : 'Inactive' %></span></td>
        <td style="color:var(--muted);font-size:12px"><%= c.updated_at ? new Date(c.updated_at).toLocaleString() : '—' %></td>
      </tr>
      <% } %>
      <% if (!channels.length) { %><tr><td colspan="5" style="color:var(--muted)">No channels configured yet — no live SMS/email provider is required to use the rest of this console.</td></tr><% } %>
    </tbody>
  </table>
</div>

<div style="display:grid;grid-template-columns:1fr 1fr;gap:20px">
  <div class="card">
    <h2 style="font-size:15px;margin-top:0">Configure Email (SMTP)</h2>
    <form method="post" action="/alerting/channels">
      <input type="hidden" name="channel" value="email">
      <input type="hidden" name="provider" value="smtp">
      <label>From Address</label>
      <input type="text" name="fromIdentifier" placeholder="alerts@yourdomain.com">
      <label>SMTP Host</label>
      <input type="hidden" name="configKeys" value="host"><input type="text" name="configValues" placeholder="smtp.example.com">
      <div style="display:flex;gap:12px">
        <div style="flex:1"><label>Port</label><input type="hidden" name="configKeys" value="port"><input type="text" name="configValues" placeholder="587"></div>
        <div style="flex:1"><label>Secure (TLS)</label><input type="hidden" name="configKeys" value="secure"><input type="text" name="configValues" placeholder="true or false"></div>
      </div>
      <label>SMTP User</label>
      <input type="hidden" name="configKeys" value="user"><input type="text" name="configValues" placeholder="user@example.com">
      <label>SMTP Password</label>
      <input type="hidden" name="configKeys" value="pass"><input type="password" name="configValues" placeholder="never redisplayed once saved">
      <button class="btn" type="submit" style="width:100%;margin-top:16px">Save Email Config</button>
    </form>
    <form method="post" action="/alerting/test-send" style="margin-top:12px;display:flex;gap:6px">
      <input type="hidden" name="channel" value="email">
      <input type="email" name="recipient" placeholder="Send a test to…" required style="flex:1">
      <button class="btn" type="submit">Send Test</button>
    </form>
  </div>

  <div class="card">
    <h2 style="font-size:15px;margin-top:0">Configure SMS (generic HTTP gateway)</h2>
    <p style="color:var(--muted);font-size:12px;margin:0 0 8px">Works with any REST-based SMS gateway (e.g. Hubtel, mNotify) that accepts a JSON POST with an API-key bearer token.</p>
    <form method="post" action="/alerting/channels">
      <input type="hidden" name="channel" value="sms">
      <input type="hidden" name="provider" value="generic_http_sms_gateway">
      <label>Sender ID</label>
      <input type="text" name="fromIdentifier" placeholder="e.g. LPMSAdmin">
      <label>Gateway API URL</label>
      <input type="hidden" name="configKeys" value="apiUrl"><input type="text" name="configValues" placeholder="https://api.your-sms-gateway.com/send">
      <label>API Key</label>
      <input type="hidden" name="configKeys" value="apiKey"><input type="password" name="configValues" placeholder="never redisplayed once saved">
      <button class="btn" type="submit" style="width:100%;margin-top:16px">Save SMS Config</button>
    </form>
    <form method="post" action="/alerting/test-send" style="margin-top:12px;display:flex;gap:6px">
      <input type="hidden" name="channel" value="sms">
      <input type="text" name="recipient" placeholder="Send a test to… (phone number)" required style="flex:1">
      <button class="btn" type="submit">Send Test</button>
    </form>
  </div>
</div>

<div class="card">
  <h2 style="font-size:15px;margin-top:0">Escalation Rules — severity → channels</h2>
  <table>
    <thead><tr><th>Severity</th><th>In-app</th><th>Email</th><th>SMS</th><th></th></tr></thead>
    <tbody>
      <% for (const r of rules) { %>
      <tr>
        <form method="post" action="/alerting/rules/<%= r.severity %>">
        <td><span class="badge <%= { info: 'badge-ok', warning: 'badge-warn', critical: 'badge-danger' }[r.severity] %>"><%= r.severity %></span></td>
        <td><input type="checkbox" name="channels" value="in_app" <%= r.channels.includes('in_app') ? 'checked' : '' %> disabled title="in-app is always on"></td>
        <td><input type="checkbox" name="channels" value="email" <%= r.channels.includes('email') ? 'checked' : '' %>></td>
        <td><input type="checkbox" name="channels" value="sms" <%= r.channels.includes('sms') ? 'checked' : '' %>></td>
        <td><input type="hidden" name="channels" value="in_app"><button class="link-btn" type="submit">Save</button></td>
        </form>
      </tr>
      <% } %>
    </tbody>
  </table>
</div>

<div class="card">
  <h2 style="font-size:15px;margin-top:0">Escalation Chain — critical, unacknowledged alerts only</h2>
  <p style="color:var(--muted);font-size:12px;margin:0 0 12px">If a critical alert is still unread after the step's window, the next role in this chain is notified too. Empty by default — nothing escalates until a real chain is defined here.</p>
  <table>
    <thead><tr><th>Step</th><th>Escalate To Role</th><th>After (minutes)</th><th></th></tr></thead>
    <tbody>
      <% for (const c of chain) { %>
      <tr>
        <td><%= c.step_order %></td>
        <td><%= c.admin_role %></td>
        <td><%= c.escalate_after_minutes %></td>
        <td><form method="post" action="/alerting/chain/<%= c.id %>/delete"><button class="link-btn" type="submit">Remove</button></form></td>
      </tr>
      <% } %>
      <% if (!chain.length) { %><tr><td colspan="4" style="color:var(--muted)">No escalation chain defined.</td></tr><% } %>
    </tbody>
  </table>
  <form method="post" action="/alerting/chain" style="display:flex;gap:6px;margin-top:12px;flex-wrap:wrap">
    <input type="number" name="stepOrder" placeholder="Step # (1, 2, …)" style="flex:1" required min="1">
    <select name="adminRole" style="flex:1" required>
      <option value="super_admin">super_admin</option>
      <option value="support_tier">support_tier</option>
      <option value="billing_tier">billing_tier</option>
      <option value="read_only_auditor">read_only_auditor</option>
    </select>
    <input type="number" name="escalateAfterMinutes" placeholder="Minutes" style="flex:1" required min="1">
    <button class="btn" type="submit">Add Step</button>
  </form>
</div>

<div class="card">
  <h2 style="font-size:15px;margin-top:0">Delivery Log</h2>
  <table>
    <thead><tr><th>Channel</th><th>Recipient</th><th>Status</th><th>Error</th><th>When</th></tr></thead>
    <tbody>
      <% for (const d of deliveries) { %>
      <tr>
        <td><%= d.channel %></td>
        <td><%= d.recipient %></td>
        <td><span class="badge <%= { sent: 'badge-ok', failed: 'badge-danger', not_configured: 'badge-warn' }[d.status] %>"><%= d.status %></span></td>
        <td style="color:var(--danger);font-size:12px"><%= d.error_message || '' %></td>
        <td style="color:var(--muted);font-size:12px"><%= new Date(d.sent_at).toLocaleString() %></td>
      </tr>
      <% } %>
      <% if (!deliveries.length) { %><tr><td colspan="5" style="color:var(--muted)">No delivery attempts logged yet.</td></tr><% } %>
    </tbody>
  </table>
</div>

<% } %>
