{% if workflow_runs %}
<div class="mb-3">
  <span class="badge bg-primary">{{ workflow_runs|length }} Total Runs</span>
</div>

<div class="table-responsive">
  <table class="table table-hover">
    <thead>
      <tr>
        <th>Workflow Type</th>
        <th>Workflow ID</th>
        <th>Invocation ID</th>
        <th>Parent Workflow</th>
        <th>Actions</th>
      </tr>
    </thead>
    <tbody>
      {% for run in workflow_runs %}
      <tr>
        <td>
          <a
            href="/workflows/{{ run.workflow_type.key }}"
            class="text-decoration-none"
          >
            <strong>{{ run.workflow_type }}</strong>
          </a>
        </td>
        <td>
          <span class="font-monospace">{{ run.workflow_id }}</span>
        </td>
        <td>
          <span class="font-monospace text-muted">{{ run.workflow_id }}</span>
        </td>
        <td>
          {% if run.parent_workflow_id %}
          <div class="d-flex flex-column gap-1">
            {% if run.parent_workflow %}
            <a
              href="/workflows/{{ run.parent_workflow.workflow_type.key }}"
              class="text-decoration-none"
            >
              {{ run.parent_workflow.workflow_type }}
            </a>
            {% else %}
            <span class="text-muted">Parent workflow</span>
            {% endif %}
            <a
              href="/invocations/{{ run.parent_workflow_id }}"
              class="font-monospace text-decoration-none text-break"
            >
              {{ run.parent_workflow_id }}
            </a>
          </div>
          {% else %}
          <span class="text-muted">-</span>
          {% endif %}
        </td>
        <td>
          <a
            href="/invocations?workflow_id={{ run.workflow_id }}"
            class="btn btn-sm btn-outline-primary"
          >
            View Invocations
          </a>
          {% if run.parent_workflow %}
          <a
            href="/workflows/{{ run.parent_workflow.workflow_type.key }}"
            class="btn btn-sm btn-outline-secondary ms-1"
          >
            Parent Workflow Details
          </a>
          {% endif %}
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
</div>
{% else %}
<div class="alert alert-info">
  <h6>No workflow runs found</h6>
  <p class="mb-0">
    No workflow executions have been registered yet. Workflow runs will appear
    here after workflows are executed at least once.
  </p>
</div>
{% endif %}