{% load helpers %}
<div class="list-group-item" data-task-id="{{ task.pk }}" data-log-length="{{ task.log|length }}">
  <div class="d-flex justify-content-between align-items-center mb-2">
    <div>
      <strong>{{ task.sequence|add:1 }}. {{ task.name }}</strong>
      {% if task.step_key %}<code class="text-muted ms-2">{{ task.step_key }}</code>{% endif %}
    </div>
    <div>{% badge task.get_status_display %}</div>
  </div>
  {% if task.log %}
    <pre class="terminal-output mb-0">{{ task.log }}</pre>
  {% endif %}
  {% if task.error %}
    <pre class="text-danger mt-2 mb-0">{{ task.error }}</pre>
  {% endif %}
</div>