{% if !workflow_types.is_empty() %}
<div class="table-responsive">
  <table class="table table-hover pynmon-table mb-0">
    <thead>
      <tr>
        <th>Workflow Type</th>
        <th>Runs</th>
        <th>Actions</th>
      </tr>
    </thead>
    <tbody>
      {% for wt in workflow_types %}
      <tr>
        <td>
          <a
            href="/workflows/{{ wt.workflow_type }}"
            class="text-decoration-none"
          >
            <strong>{{ wt.workflow_type }}</strong>
          </a>
        </td>
        <td><span class="badge bg-primary">{{ wt.run_count }}</span></td>
        <td>
          <a
            href="/workflows/{{ wt.workflow_type }}"
            class="btn btn-sm btn-outline-primary"
            >View Details</a
          >
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
</div>
{% else %}
<div class="alert alert-info mb-0">
  <h6>No workflows found</h6>
  <p class="mb-0">No workflow executions have been registered yet.</p>
</div>
{% endif %}

<!-- Workflow Runs Section -->
<div class="mt-4">
  <h6 class="section-title">
    All Workflow Runs
    <span class="badge bg-primary ms-2">{{ total_workflow_runs }}</span>
  </h6>
  {% if !workflow_runs.is_empty() %}
  <div class="table-responsive">
    <table class="table table-hover pynmon-table mb-0">
      <thead>
        <tr>
          <th>Invocation ID</th>
          <th>Task</th>
          <th>Status</th>
          <th>Members</th>
          <th>Actions</th>
        </tr>
      </thead>
      <tbody>
        {% for run in workflow_runs %}
        <tr>
          <td>
            <a
              href="/invocations/{{ run.invocation_id }}"
              class="text-decoration-none"
            >
              <code class="text-primary" title="{{ run.invocation_id }}"
                >{{ run.invocation_id }}</code
              >
            </a>
          </td>
          <td>
            <a href="/tasks/{{ run.task_id }}" class="text-decoration-none"
              >{{ run.task_id }}</a
            >
          </td>
          <td>
            <span class="badge {{ run.status_class }}">{{ run.status }}</span>
          </td>
          <td>
            {{ run.member_count }}
          </td>
          <td>
            <a
              href="/workflows/{{ run.task_id }}/{{ run.invocation_id }}"
              class="btn btn-sm btn-outline-primary"
              >View</a
            >
            <a
              href="{{ run.invocations_url }}"
              class="btn btn-sm btn-outline-info"
              >Invocations</a
            >
            <a href="{{ run.timeline_url }}" class="btn btn-sm btn-outline-success" title="Workflow timeline" aria-label="Workflow timeline"><span class="material-icons" style="font-size:16px">timeline</span></a>
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
  {% include "components/pagination.html" %}
  {% else %}
  <p class="text-muted small mb-0">
    No workflow runs recorded.
  </p>
  {% endif %}
</div>