{% extends "base.html" %} {% block content %}
<div class="pynmon-container">
  <div class="row pynmon-row-compact">
    <div class="col-12">
      <div class="card pynmon-card">
        <div
          class="card-header pynmon-card-header d-flex justify-content-between align-items-center"
        >
          <span class="compact-header">Workflows</span>
          <button
            class="btn btn-sm btn-outline-primary"
            hx-get="/workflows/refresh"
            hx-target="#workflows-content"
            hx-swap="innerHTML"
          >
            <svg
              xmlns="http://www.w3.org/2000/svg"
              width="16"
              height="16"
              fill="currentColor"
              class="bi bi-arrow-clockwise"
              viewBox="0 0 16 16"
            >
              <path
                fill-rule="evenodd"
                d="M8 3a5 5 0 1 0 4.546 2.914.5.5 0 0 1 .908-.417A6 6 0 1 1 8 2v1z"
              />
              <path
                d="M8 4.466V.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384L8.41 4.658A.25.25 0 0 1 8 4.466z"
              />
            </svg>
            Refresh
          </button>
        </div>
        <div class="card-body pynmon-card-body">
          <div id="workflows-content">
            {% if workflows %}
            <div class="table-responsive">
              <table class="table table-hover pynmon-table">
                <thead>
                  <tr>
                    <th>Workflow Task ID</th>
                    <th>Total Runs</th>
                    <th>Latest Run</th>
                    <th>Actions</th>
                  </tr>
                </thead>
                <tbody>
                  {% for workflow in workflows %}
                  <tr>
                    <td>
                      <a
                        href="/workflows/{{ workflow.workflow_task_id.key }}"
                        class="text-decoration-none"
                      >
                        <strong>{{ workflow.workflow_task_id }}</strong>
                      </a>
                    </td>
                    <td>
                      <span class="badge bg-primary"
                        >{{ workflow.run_count }}</span
                      >
                    </td>
                    <td>
                      {% if workflow.latest_run %}
                      <small class="text-muted">
                        {{ workflow.latest_run.workflow_id[:8] }}...
                      </small>
                      {% else %}
                      <small class="text-muted">No runs</small>
                      {% endif %}
                    </td>
                    <td>
                      <a
                        href="/workflows/{{ workflow.workflow_task_id.key }}"
                        class="btn btn-sm btn-outline-primary"
                      >
                        View Details
                      </a>
                    </td>
                  </tr>
                  {% endfor %}
                </tbody>
              </table>
            </div>

            <div class="mt-3">
              <a href="/workflows/runs" class="btn btn-outline-secondary">
                View All Workflow Runs
              </a>
            </div>
            {% else %}
            <div class="alert alert-info">
              <h6>No workflows found</h6>
              <p class="mb-0">
                No workflow executions have been registered yet. Workflows will
                appear here after they are executed at least once.
              </p>
            </div>
            {% endif %}
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
{% endblock %}