{% extends "base.html" %}
{% block content %}
<section class="section"><div class="container">
  <h1 class="title is-4">Task #{{ task.reference_code }}: {{ task.title }}</h1>
  <p class="subtitle is-6">{{ task.project.name }}{% if task.epic %} / {{ task.epic.name }}{% endif %} · {{ task.status_snapshot }}</p>
  <div class="buttons"><a class="button is-small is-light" href="{% url 'tasks_hub' %}">Back</a></div>
  <article class="box">
    <h2 class="title is-6">Events</h2>
    <table class="table is-fullwidth is-size-7">
      <thead><tr><th>When</th><th>Type</th><th>Actor</th><th>Payload</th></tr></thead>
      <tbody>
        {% for row in events %}
          <tr><td>{{ row.created_at }}</td><td>{{ row.event_type }}</td><td>{{ row.actor_identifier }}</td><td><code>{{ row.payload }}</code></td></tr>
        {% empty %}
          <tr><td colspan="4">No events.</td></tr>
        {% endfor %}
      </tbody>
    </table>
  </article>
  <article class="box">
    <h2 class="title is-6">External Sync</h2>
    <table class="table is-fullwidth is-size-7">
      <thead><tr><th>When</th><th>Provider</th><th>Status</th><th>Error</th></tr></thead>
      <tbody>
        {% for row in sync_events %}
          <tr><td>{{ row.updated_at }}</td><td>{{ row.provider }}</td><td>{{ row.status }}</td><td>{{ row.error }}</td></tr>
        {% empty %}
          <tr><td colspan="4">No sync events.</td></tr>
        {% endfor %}
      </tbody>
    </table>
  </article>
</div></section>
{% endblock %}