`views/admin/index.ejs`

56 lines
<%- include('../partials/head', { title, meta_desc }) %>
<%- include('../partials/header') %>

<main class="container" style="max-width: 1100px; padding: 24px;">

  <h1 style="margin: 0 0 6px;">Butlr Admin</h1>
  <p class="muted" style="margin: 0 0 24px;">Signed in as <strong><%= req.user?.email || req.user?.name || 'admin' %></strong> · role: <%= req.user?.role || 'owner' %></p>

  <div style="display:grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px;">

    <a href="/admin/users" class="admin-card">
      <div class="admin-card-icon">👥</div>
      <h3>Users</h3>
      <p class="muted">Add, remove, set roles · <strong><%= users_count %></strong> total</p>
    </a>

    <a href="/admin/contacts" class="admin-card">
      <div class="admin-card-icon">📇</div>
      <h3>Contacts</h3>
      <p class="muted">Search your Mac contacts · click-to-call · <span id="contacts-status" class="muted">checking...</span></p>
    </a>

    <a href="/admin/calls" class="admin-card">
      <div class="admin-card-icon">📞</div>
      <h3>Call history</h3>
      <p class="muted">All calls · <strong><%= calls_count %></strong> total · play + transcript</p>
    </a>

    <a href="/admin/live" class="admin-card" style="border-color: <%= live_count > 0 ? '#dc2626' : 'var(--line)' %>;">
      <div class="admin-card-icon"><%= live_count > 0 ? '🔴' : '⚪' %></div>
      <h3>Live calls</h3>
      <p class="muted"><strong><%= live_count %></strong> active right now · takeover panel</p>
    </a>

  </div>

  <style>
    .admin-card { display: block; padding: 24px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); text-decoration: none; color: var(--ink); transition: transform 0.15s, border-color 0.15s; }
    .admin-card:hover { transform: translateY(-2px); border-color: var(--ink-dim); }
    .admin-card-icon { font-size: 32px; margin-bottom: 8px; }
    .admin-card h3 { margin: 0 0 6px; font-size: 18px; }
    .admin-card p { margin: 0; font-size: 13px; }
  </style>

  <script>
  // Probe Mac2 contacts service via Butlr proxy. If unreachable, show offline label.
  fetch('/admin/api/contacts-health').then(r => r.json()).then(j => {
    const el = document.getElementById('contacts-status');
    if (el) el.textContent = j.ok ? (j.count + ' available') : 'service offline';
  }).catch(() => { document.getElementById('contacts-status').textContent = 'service offline'; });
  </script>

</main>

<%- include('../partials/footer') %>