{% extends "base.html" %}

{% block title %}{{ task.id }} — Tacks{% endblock %}

{% block content %}
<h1 data-editable data-field="title" data-task-id="{{ task.id }}">{{ task.title }}</h1>

<div class="task-meta-row">
  <span class="meta-item"><span class="meta-label">ID</span> {{ task.id }}</span>
  <span class="meta-sep">·</span>
  <span class="meta-item" data-editable data-field="status" data-task-id="{{ task.id }}">
    <span class="badge status-{{ task.status }}">
      {%- if task.status == crate::models::Status::Open -%}○ Open
      {%- else if task.status == crate::models::Status::InProgress -%}◐ In Progress
      {%- else if task.status == crate::models::Status::Done -%}✓ Done
      {%- else -%}⊘ Blocked{%- endif -%}
    </span>
  </span>
  <span class="meta-sep">·</span>
  <span class="meta-item" data-editable data-field="priority" data-task-id="{{ task.id }}"><span class="badge priority-{{ task.priority }}">
    {%- if task.priority == 1 -%}▲ P1{%- else if task.priority == 2 -%}▬ P2{%- else if task.priority == 3 -%}▽ P3{%- else -%}· P4{%- endif -%}
  </span></span>
  {% if let Some(p) = parent.as_ref() %}
  <span class="meta-sep">·</span>
  <span class="meta-item"><span class="meta-label">Epic</span> <a href="/epics/{{ p.id }}" class="epic-badge">{{ p.id }}: {{ p.title }}</a></span>
  {% endif %}
  <span class="meta-sep">·</span>
  <span class="meta-item" data-editable data-field="tags" data-task-id="{{ task.id }}">
    {% for tag in &task.tags %}<span class="tag-pill">{{ tag }}</span>{% endfor %}
    {% if task.tags.is_empty() %}<span class="meta-label">Tags</span> —{% endif %}
  </span>
  <span class="meta-sep">·</span>
  <span class="meta-item"><span class="meta-label">Created</span> {{ task.created_at.format("%b %d, %Y %H:%M") }}</span>
  <span class="meta-sep">·</span>
  <span class="meta-item"><span class="meta-label">Updated</span> {{ task.updated_at.format("%b %d, %Y %H:%M") }}</span>
</div>

<p class="task-description" data-editable data-field="description" data-task-id="{{ task.id }}">{{ task.description.as_deref().unwrap_or("—") }}</p>

{% if !blockers.is_empty() %}
<section>
  <h2>Blocked by</h2>
  <ul>
    {% for blocker in blockers %}
    <li><a href="/tasks/{{ blocker.id }}">{{ blocker.id }}: {{ blocker.title }}</a></li>
    {% endfor %}
  </ul>
</section>
{% endif %}

{% if !dependents.is_empty() %}
<section>
  <h2>Blocking</h2>
  <ul>
    {% for dep in dependents %}
    <li><a href="/tasks/{{ dep.id }}">{{ dep.id }}: {{ dep.title }}</a></li>
    {% endfor %}
  </ul>
</section>
{% endif %}

{% if !comments.is_empty() %}
<section>
  <h2>Comments</h2>
  {% for comment in comments %}
  <article>
    <small>{{ comment.created_at.format("%b %d, %Y %H:%M") }}</small>
    <p>{{ comment.body }}</p>
  </article>
  {% endfor %}
</section>
{% endif %}

<p><a href="/tasks">Back to task list</a></p>
{% endblock %}