// ════════════════════════════════════════════════════════════════
// /admin/audit — журнал событий
// ════════════════════════════════════════════════════════════════

function AuditLog({ currentUser }) {
  const A = window.SDH_ADMIN;
  const isSuperAdmin = currentUser.role === 'super_admin';
  // Admin видит только свои действия
  const baseEvents = isSuperAdmin
    ? A.auditLog
    : A.auditLog.filter(e => e.user === currentUser.email.split('@')[0] || e.user.includes(currentUser.name.split(' ')[0].toLowerCase()));

  const [actionFilter, setActionFilter] = React.useState('all');
  const [userFilter, setUserFilter] = React.useState('all');
  const [range, setRange] = React.useState('7d');

  const allActions = [...new Set(baseEvents.map(e => e.kind))].sort();
  const allUsers = [...new Set(baseEvents.map(e => e.user))].sort();

  let events = baseEvents;
  if (actionFilter !== 'all') events = events.filter(e => e.kind === actionFilter);
  if (userFilter !== 'all') events = events.filter(e => e.user === userFilter);

  return (
    <div className="sdh-fade">
      <PageHeader
        section="управление"
        title="Журнал событий"
        accent="событий"
        subtitle={isSuperAdmin
          ? `${baseEvents.length} записей за последние 7 дней. Каждое мутирующее действие сохраняется навсегда и не может быть удалено через UI.`
          : 'Здесь видны только ваши собственные действия. Полный журнал доступен super-admin.'}
        right={
          <button className="sdh-btn">
            <svg width="12" height="12" viewBox="0 0 12 12" fill="none" stroke="currentColor" strokeWidth="1.4">
              <path d="M5 1v6m0 0L2.5 4.5M5 7l2.5-2.5M2 9v1a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V9" strokeLinecap="round" strokeLinejoin="round" />
            </svg>
            Экспорт CSV
          </button>
        }
      />

      <CommandBar sticky={false}
        left={
          <>
            <span className="sdh-mono-label" style={{ marginRight: 6 }}>период</span>
            {['24h', '7d', '30d', 'all'].map(r => (
              <button key={r} className={`sdh-chip ${range === r ? 'is-active' : ''}`} onClick={() => setRange(r)}>
                {r === '24h' ? 'сутки' : r === '7d' ? '7 дней' : r === '30d' ? '30 дней' : 'всё время'}
              </button>
            ))}
          </>
        }
        right={
          <>
            <select value={actionFilter} onChange={e => setActionFilter(e.target.value)} style={window.selectStyle}>
              <option value="all">все действия</option>
              {allActions.map(a => <option key={a} value={a}>{a}</option>)}
            </select>
            {isSuperAdmin && (
              <select value={userFilter} onChange={e => setUserFilter(e.target.value)} style={window.selectStyle}>
                <option value="all">все пользователи</option>
                {allUsers.map(u => <option key={u} value={u}>{u}</option>)}
              </select>
            )}
          </>
        }
      />

      <section className="sdh-container" style={{ paddingTop: 'var(--space-6)', paddingBottom: 'var(--space-16)' }}>
        <div className="sdh-mono-label" style={{ marginBottom: 'var(--space-3)' }}>
          <span className="sdh-num" style={{ color: 'var(--text-primary)', fontSize: 13 }}>{events.length}</span> событий в выборке
        </div>

        <div style={{
          background: 'var(--surface-elevated)',
          border: '1px solid var(--border-subtle)',
          borderRadius: 'var(--radius-xl)',
          padding: 'var(--space-4) var(--space-6)',
        }}>
          {/* head */}
          <div style={{
            display: 'grid',
            gridTemplateColumns: '70px 110px 130px 1fr 110px',
            gap: 12, padding: '6px 0',
            borderBottom: '1px solid var(--border-default)',
            marginBottom: 4,
          }}>
            <div className="sdh-mono-label">время</div>
            <div className="sdh-mono-label">кто</div>
            <div className="sdh-mono-label">действие</div>
            <div className="sdh-mono-label">детали</div>
            <div className="sdh-mono-label" style={{ textAlign: 'right' }}>ip</div>
          </div>

          {events.length === 0 ? (
            <EmptyState title="Событий не найдено" hint="Сбросьте фильтры или расширьте период." />
          ) : (
            events.slice(0, 80).map(ev => <AuditRow key={ev.id} event={ev} />)
          )}

          {events.length > 80 && (
            <div style={{ textAlign: 'center', padding: 'var(--space-4) 0', color: 'var(--text-tertiary)', fontSize: 12 }}>
              показаны первые 80 · ещё {events.length - 80}
            </div>
          )}
        </div>
      </section>
    </div>
  );
}

window.AuditLog = AuditLog;