---
import Admin from '../../../layouts/Admin.astro';
import { umamiStats, umamiInfo } from '../../../lib/umami.js';
const info = umamiInfo();
const stats = await umamiStats();
---
<Admin title="Analytics" active="analytics" crumbs={[{label:'Analytics'}]}>
  <a slot="actions" href={info.base} target="_blank" class="s-btn s-btn-primary">Umami öffnen ↗</a>

  {stats.configured ? (
    <div class="s-kpis" style="margin-bottom:16px">
      <div class="s-kpi"><div class="s-kpi-label">Seitenaufrufe</div><div class="s-kpi-val">{stats.pageviews}</div><div class="s-kpi-sub">letzte 7 Tage</div></div>
      <div class="s-kpi"><div class="s-kpi-label">Besucher</div><div class="s-kpi-val">{stats.visitors}</div><div class="s-kpi-sub">eindeutig</div></div>
      <div class="s-kpi"><div class="s-kpi-label">Sitzungen</div><div class="s-kpi-val">{stats.visits}</div><div class="s-kpi-sub">letzte 7 Tage</div></div>
      <div class="s-kpi"><div class="s-kpi-label">Absprünge</div><div class="s-kpi-val">{stats.bounces}</div><div class="s-kpi-sub">Bounces</div></div>
    </div>
  ) : (
    <div class="s-card s-card-pad" style="margin-bottom:16px">
      <p class="s-section-title">Umami-Tracking {info.websiteId ? 'aktiv' : 'vorbereitet'}</p>
      <p class="s-muted" style="margin-top:8px;max-width:62ch">
        {info.websiteId
          ? 'Das Tracking-Script ist auf allen Shop-Seiten eingebunden — Besuche laufen live in dein Umami. Für die Live-Kacheln hier im Backend hinterlege zusätzlich UMAMI_USER und UMAMI_PASS (Umami-Login) als Environment-Variablen; dann werden Besucherzahlen direkt hier gezogen.'
          : 'Setze die Environment-Variable UMAMI_WEBSITE_ID (aus deinem Umami-Projekt), damit das Tracking-Script eingebunden wird. Für die Live-Kacheln zusätzlich UMAMI_USER / UMAMI_PASS.'}
      </p>
      <div style="margin-top:14px"><a href={info.base} target="_blank" class="s-btn">Zum Umami-Dashboard ↗</a></div>
    </div>
  )}

  {info.shareUrl && (
    <div class="s-card">
      <div class="s-card-head">Live-Dashboard</div>
      <iframe src={info.shareUrl} style="width:100%;height:680px;border:0;border-radius:0 0 10px 10px" title="Umami"></iframe>
    </div>
  )}
  <div class="s-card s-card-pad">
    <p class="s-section-title">Datenschutz</p>
    <p class="s-muted" style="margin-top:8px;max-width:62ch">Umami ist cookielos und DSGVO-freundlich, self-hosted in Deutschland (analytics.heidrich-digital.de). Es werden keine personenbezogenen Profile gebildet.</p>
  </div>
</Admin>
