{% from "macros.html" import icon, empty_state %}
<h2 class="label mb-3 flex items-center gap-1.5">
  {{ icon('clock', 'w-3.5 h-3.5') }} Schedulers</h2>
<div class="card">
  {% if not schedulers %}
  {{ empty_state('clock', 'No schedulers') }}
  {% else %}
  <table class="w-full text-sm">
    <thead class="bg-panel2/40">
      <tr><th scope="col" class="th">name</th><th scope="col" class="th">schedule</th><th scope="col" class="th">next run</th><th scope="col" class="th"><span class="sr-only">actions</span></th></tr>
    </thead>
    <tbody>
    {% for s in schedulers %}
      <tr class="border-t border-line hover:bg-panel2/20 transition-colors">
        <td class="td font-medium">{{ s.name }}</td>
        <td class="td font-mono text-muted">{{ s|schedule }}</td>
        <td class="td font-mono text-muted">{{ s.next|clock }}</td>
        <td class="td text-right whitespace-nowrap">
          <div class="inline-flex gap-1.5">
            <button class="btn btn-sm btn-info" hx-post="{{ url_for('trigger', name=name, scheduler_id=s.id).path }}"
                    hx-target="#schedulers" data-loading-disable data-loading-aria-busy>{{ icon('bolt', 'w-3.5 h-3.5') }} run now</button>
            <button class="btn btn-sm btn-danger tip" data-tip="Remove scheduler"
                    hx-delete="{{ url_for('remove_scheduler', name=name, scheduler_id=s.id).path }}"
                    hx-target="#schedulers" hx-confirm="Remove scheduler {{ s.id }}?"
                    data-loading-disable data-loading-aria-busy>
              {{ icon('trash', 'w-3.5 h-3.5') }}<span class="sr-only">Remove scheduler</span></button>
          </div>
        </td>
      </tr>
    {% endfor %}
    </tbody>
  </table>
  {% endif %}
</div>