{% extends "botapp/base.html" %}

{% block title %}{{ project.path }} | CI{% endblock %}

{% block content %}
<div class="space-y-6">

  <div class="flex items-end justify-between flex-wrap gap-4">
    <div>
      <h1 class="text-xl sm:text-2xl font-bold tracking-tight text-slate-100">
        <i class="bi bi-folder2-open text-sky-400"></i> {{ project.path }}
      </h1>
      <p class="text-slate-400 mt-1 text-sm">
        {% if project.bot %}vinculado ao bot <strong class="text-slate-200">{{ project.bot.name }}</strong>
        {% else %}<span class="text-amber-400">sem vínculo com bot</span> — a visão unificada depende dele{% endif %}
      </p>
    </div>
    <div class="flex gap-2 flex-wrap">
      {% if project.web_url %}<a href="{{ project.web_url }}" target="_blank" rel="noopener" class="btn-ghost"><i class="bi bi-box-arrow-up-right"></i> Abrir no CI</a>{% endif %}
      <a href="{% url 'ci_projects' %}" class="btn-ghost"><i class="bi bi-arrow-left"></i> Projetos</a>
    </div>
  </div>

  {% if project.last_sync_error %}
  <div class="fx-header rounded-xl p-4 border-l-4 border-amber-500">
    <div class="text-sm text-amber-300"><i class="bi bi-exclamation-triangle"></i> Último erro de sincronização</div>
    <pre class="text-xs text-slate-300 mt-2 whitespace-pre-wrap">{{ project.last_sync_error }}</pre>
  </div>
  {% endif %}

  {% if pode_editar %}
  <div class="fx-header rounded-xl p-4 flex flex-wrap items-end gap-4">
    <form method="post" action="{% url 'ci_project_link_bot' project.id %}" class="flex items-end gap-2">
      {% csrf_token %}
      <div>
        <label class="fx-label">Vincular a um bot</label>
        <select name="bot_id" class="fx-select">
          <option value="">— nenhum —</option>
          {% for b in bots %}<option value="{{ b.id }}" {% if project.bot_id == b.id %}selected{% endif %}>{{ b.name }}</option>{% endfor %}
        </select>
      </div>
      <button class="btn-ghost"><i class="bi bi-link-45deg"></i> Salvar</button>
    </form>
    <p class="text-xs text-slate-500 max-w-md">
      O vínculo é manual de propósito: casar por semelhança de nome e errar
      atribuiria telemetria ao bot errado, o que é pior do que não casar.
    </p>
  </div>
  {% endif %}

  <div class="fx-header rounded-xl overflow-hidden">
    <div class="px-4 py-3 border-b border-slate-700">
      <h2 class="font-semibold text-slate-100"><i class="bi bi-clock-history"></i> Agendamentos</h2>
    </div>
    <div class="overflow-x-auto">
      <table class="fx-table w-full text-sm">
        <thead><tr>
          <th class="text-left">Descrição</th><th class="text-left">Cron</th>
          <th class="text-left">Timezone</th><th class="text-center">Ativo</th>
          <th class="text-left">Próxima execução</th>
        </tr></thead>
        <tbody>
          {% for s in schedules %}
          <tr>
            <td>{{ s.description|default:"—" }}</td>
            <td><code class="text-slate-300">{{ s.cron }}</code></td>
            <td class="text-slate-400">{{ s.cron_timezone|default:"—" }}</td>
            <td class="text-center">{% if s.active %}<i class="bi bi-check-circle-fill text-emerald-400"></i>{% else %}<i class="bi bi-dash-circle text-slate-600"></i>{% endif %}</td>
            <td class="text-slate-400">{{ s.next_run_at|date:"d/m/Y H:i"|default:"—" }}</td>
          </tr>
          {% empty %}
          <tr><td colspan="5" class="text-slate-400 py-4 text-center">Nenhum agendamento.</td></tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>

  <div class="fx-header rounded-xl overflow-hidden">
    <div class="px-4 py-3 border-b border-slate-700">
      <h2 class="font-semibold text-slate-100"><i class="bi bi-play-circle"></i> Pipelines recentes</h2>
    </div>
    <div class="overflow-x-auto">
      <table class="fx-table w-full text-sm">
        <thead><tr>
          <th class="text-left">#</th><th class="text-left">Status</th>
          <th class="text-left">Origem</th><th class="text-left">Ref</th>
          <th class="text-left">Quando</th><th class="text-left">Duração</th>
          <th class="text-left">Disparado por</th>
        </tr></thead>
        <tbody>
          {% for p in pipelines %}
          <tr>
            <td><a class="text-sky-400 hover:underline" href="{% url 'ci_pipeline_detail' p.id %}">{{ p.external_id }}</a></td>
            <td>
              {% if p.status == 'success' and p.has_masked_error %}
                <span class="text-amber-400" title="verde com erro no log">success ⚠</span>
              {% elif p.status == 'success' %}<span class="text-emerald-400">success</span>
              {% else %}<span class="text-red-400">{{ p.status }}</span>{% endif %}
            </td>
            <td class="text-slate-400">{{ p.source|default:"—" }}</td>
            <td class="text-slate-400">{{ p.ref|default:"—" }}</td>
            <td>{{ p.created_at|date:"d/m H:i"|default:"—" }}</td>
            <td class="text-slate-400">{{ p.duration|default:"—" }}</td>
            <td class="text-slate-400">{{ p.triggered_by|default:"—" }}</td>
          </tr>
          {% empty %}
          <tr><td colspan="7" class="text-slate-400 py-4 text-center">Nenhum pipeline sincronizado.</td></tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>

</div>
{% endblock %}