{% extends "base.html" %}
{% import "macros/ui.html" as m %}
{% block title %}Jobs{% endblock %}
{% block nav_jobs %}btn-active{% endblock %}

{% block content %}
<div class="flex items-center justify-between mb-6">
  <h1 class="text-2xl font-bold font-mono">Orchestrator Jobs</h1>
  <a href="/ui/jobs" class="btn btn-ghost btn-xs">Refresh</a>
</div>

{% if jobs %}
  {% if jobs.items %}
  <div class="overflow-x-auto">
    <table class="table table-sm">
      <thead>
        <tr>
          <th>ID</th>
          <th>Name</th>
          <th>Status</th>
          <th>Created</th>
          <th>Duration</th>
        </tr>
      </thead>
      <tbody>
        {% for job in jobs.items %}
        <tr class="hover cursor-pointer" onclick="location.href='/ui/jobs/{{ job.id }}'">
          <td class="font-mono text-xs">
            <a href="/ui/jobs/{{ job.id }}" class="text-primary/70 hover:text-primary hover:underline" onclick="event.stopPropagation()">
              {{ job.id | truncate(length=12, end="") }}
            </a>
          </td>
          <td class="font-mono text-xs">
            <a href="/ui/jobs/{{ job.id }}" class="hover:text-primary hover:underline" onclick="event.stopPropagation()">
              {{ job.name | default(value="—") }}
            </a>
          </td>
          <td>
            {% set s = job.status | default(value="unknown") %}
            {% if s == "Running" or s == "running" %}
              <span class="badge badge-info badge-xs">running</span>
            {% elif s == "Completed" or s == "completed" or s == "Success" %}
              <span class="badge badge-success badge-xs">done</span>
            {% elif s == "Failed" or s == "failed" or s == "Error" %}
              <span class="badge badge-error badge-xs">failed</span>
            {% elif s == "Pending" or s == "pending" %}
              <span class="badge badge-warning badge-xs">pending</span>
            {% else %}
              <span class="badge badge-ghost badge-xs">{{ s }}</span>
            {% endif %}
          </td>
          <td class="text-xs text-base-content/50">{{ job.created_at | default(value="—") }}</td>
          <td class="font-mono text-xs">{{ job.duration_ms | default(value="—") }}</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
  {% elif jobs.error %}
  <div class="alert alert-warning">
    <span class="font-mono text-sm">{{ jobs.error }}</span>
  </div>
  {% else %}
  <div class="alert"><span>No jobs found.</span></div>
  {% endif %}
{% else %}
<div class="alert alert-warning">
  <span class="text-sm">orchestrator_jobs tool unavailable — is the orchestrator running at port 9011?</span>
</div>
{% endif %}
{% endblock %}