{# v0.4 task row with hover tooltip.
   Row shows dot + name + time. Hover reveals a floating tooltip with details.
   Click loads the phase view. #}
{% set phase_idx = task._phases.index(task.current_phase) if task.current_phase in task._phases else -1 %}
{% set is_active = task.status not in ('done', 'failed') %}
<div class="task-row {{ task.status }}"
     id="task-{{ task.id }}"
     data-task-id="{{ task.id }}"
     data-phase="{{ task.current_phase or 'queued' }}"
     data-tt-name="{{ task.name }}"
     data-tt-status="{{ task.status }}"
     data-tt-goal="{{ task.goal }}"
     data-tt-phases="{{ task._phases|join(',') }}"
     data-tt-current="{{ task.current_phase or 'queued' }}"
     data-tt-iter="{{ task.current_iter|default(0) }}/{{ task.max_iter }}"
     hx-get="/tasks/{{ task.id }}"
     hx-target="#phase-content"
     hx-swap="innerHTML"
     onmouseenter="showTooltip(event, this)"
     onmouseleave="hideTooltip()"
     style="cursor: pointer;">

  <span id="task-{{ task.id }}-dot" class="task-row-dot {{ task.status }}"></span>
  <span class="task-row-name">{{ task.name }}</span>
  <span class="task-row-time" id="task-{{ task.id }}-ago">
    {{ task.last_event_at|ago if task.last_event_at else "" }}
  </span>

  <!-- ··· Delete menu -->
  <div class="task-menu" x-data="{ open: false, confirming: false }"
       @click.outside="open = false; confirming = false"
       onclick="event.stopPropagation(); event.preventDefault();">
    <button class="task-menu-btn" @click.stop="open = !open; confirming = false"
            title="Actions">⋯</button>
    <div class="task-menu-dropdown" x-show="open" x-cloak @click.stop>
      <button class="task-menu-item"
              x-show="!confirming"
              @click="confirming = true">
        Delete
      </button>
      <button class="task-menu-item confirm"
              x-show="confirming"
              hx-delete="/tasks/{{ task.id }}"
              hx-target="#task-{{ task.id }}"
              hx-swap="delete"
              hx-trigger="click consume"
              @click="open = false; confirming = false">
        Confirm delete?
      </button>
    </div>
  </div>

  {% if is_active %}
  <div id="task-{{ task.id }}-sse" hx-sse="connect:/events/{{ task.id }}"
       style="display:none">
    <div id="task-{{ task.id }}-sse-trigger"
         hx-trigger="sse:iter, sse:verdict, sse:complete, sse:exit, sse:error"
         hx-post="/tasks/{{ task.id }}/advance"
         hx-target="#advance-noop"
         hx-swap="innerHTML"></div>
  </div>
  {% endif %}
</div>