import { api } from '../../services/api.js';
import { showToast } from '../../ui/toast.js';

export async function renderAutomations(guildId: string) {
  const container = document.getElementById('tickets-automations');
  if (!container) return;
  container.innerHTML = '<p class="muted">Lade Automationen...</p>';
  try {
    const data: any = await api.automations(guildId);
    const rules = data?.rules || data || [];
    if (!rules.length) {
      container.innerHTML = '<div class="empty-state">Keine Regeln angelegt.</div>';
      return;
    }
    const list = document.createElement('div');
    list.className = 'ticket-list';
    rules.forEach((r: any) => {
      const item = document.createElement('div');
      item.className = 'ticket-item';
      item.innerHTML = `
        <div class="row" style="justify-content:space-between;">
          <div>
            <div style="font-weight:750;">${r.name || 'Regel'}</div>
            <div class="muted">${r.condition?.type || r.condition?.status || ''}</div>
          </div>
          <span class="pill">${r.active ? 'aktiv' : 'inaktiv'}</span>
        </div>
      `;
      list.appendChild(item);
    });
    container.innerHTML = '<h3 class="label">Automationen</h3>';
    container.appendChild(list);
  } catch (err) {
    console.error(err);
    container.innerHTML = '<div class="empty-state">Automationen konnten nicht geladen werden.</div>';
    showToast('Fehler beim Laden der Automationen', true);
  }
}