{% extends "base.html" %}
{% block content %}
<h1>Tweet Kuyruğu</h1>
<p class="sub">
  Mod:
  {% if s.automation_mode=='approval' %}<b style="color:var(--warning)">Onaylı</b> — tweetler senin onayınla gider
  {% else %}<b style="color:var(--brand)">Tam otomatik</b> — kuyruk kendiliğinden gönderilir{% endif %}
  · <a href="/settings" style="color:var(--s1)">değiştir</a>
  {% if not account %} · <span style="color:var(--critical)">doğrulanmış hesap yok</span>{% endif %}
</p>

{% if request.query_params.get('err')=='empty' %}
<div class="card pad" style="margin-bottom:14px;border-color:#4a3a10">
  <span class="tag t-warn">⚠</span> <span class="xs">X boş yanıt döndürdü (sessiz ret).
  Tweet kuyrukta bırakıldı, tekrar deneyebilirsin.</span>
</div>
{% endif %}
{% if request.query_params.get('err')=='noacc' %}
<div class="card pad" style="margin-bottom:14px;border-color:#4a2020">
  <span class="tag t-bad">✕</span> <span class="xs">Gönderilemedi: doğrulanmış aktif X hesabı yok.
  <a href="/accounts" style="color:var(--s1)">Hesaplar →</a></span>
</div>
{% endif %}

<div class="pill-row" style="margin-bottom:16px">
  <a href="/queue?f=pending" class="pill {% if f!='history' %}on{% endif %}">Bekleyen ({{ counts.pending }})</a>
  <a href="/queue?f=history" class="pill {% if f=='history' %}on{% endif %}">Geçmiş ({{ counts.history }})</a>
</div>

<!-- Elle tweet -->
<div class="card" style="margin-bottom:14px">
  <div class="card-h"><h2>Elle tweet oluştur</h2></div>
  <div class="card-b">
    <form method="post" action="/queue/manual">
      <textarea name="content" rows="3" maxlength="280" placeholder="Tweet metni…" required
                oninput="document.getElementById('cc').textContent = this.value.length"></textarea>
      <div style="display:flex;align-items:center;gap:12px;margin-top:10px">
        <button class="btn btn-p">Kuyruğa ekle</button>
        <span class="xs muted"><span id="cc">0</span> / 280</span>
        <span class="xs muted">Elle eklenen tweetler bayatlamaz, onaylı olarak kuyruğa girer.</span>
      </div>
    </form>
  </div>
</div>

{% if f == 'history' %}
<div class="card">
  <div class="card-h"><h2>Geçmiş</h2><span class="xs muted">son 80</span></div>
  <div class="card-b" style="padding:6px 18px 14px">
    {% if rows %}
    <table>
      <thead><tr><th>Zaman</th><th>Durum</th><th>Tip</th><th>İçerik</th><th class="num"></th></tr></thead>
      <tbody>
      {% for p in rows %}
      <tr>
        <td class="muted xs" style="white-space:nowrap">{{ (p.posted_at or p.created_at)|tr }}</td>
        <td>
          {% if p.status=='posted' %}<span class="tag t-good">gönderildi</span>
          {% elif p.status=='failed' %}<span class="tag t-bad">hata</span>
          {% else %}<span class="tag t-idle">iptal</span>{% endif %}
        </td>
        <td class="xs muted">{{ p.kind }}{% if p.is_reply %}<div>↳ yanıt</div>{% endif %}</td>
        <td style="font-size:12.5px">{{ p.content[:130] }}{% if p.content|length > 130 %}…{% endif %}
          {% if p.error %}<div class="xs" style="color:#fca5a5">{{ p.error }}</div>{% endif %}</td>
        <td class="num">
          {% if p.tweet_id and p.tweet_id != 'unknown' %}
          <a href="https://x.com/i/status/{{ p.tweet_id }}" target="_blank" class="xs" style="color:var(--s1)">X'te ↗</a>
          {% endif %}
        </td>
      </tr>
      {% endfor %}
      </tbody>
    </table>
    {% else %}<p class="empty">Henüz gönderim yok.</p>{% endif %}
  </div>
</div>

{% else %}
<div class="card">
  <div class="card-h"><h2>Bekleyenler</h2><span class="xs muted">{{ rows|length }}</span></div>
  <div class="card-b">
    {% if rows %}
      {% for p in rows %}
      <div style="border:1px solid var(--line);border-radius:9px;padding:13px;margin-bottom:10px">
        <div style="display:flex;align-items:center;gap:8px;margin-bottom:9px;flex-wrap:wrap">
          <span class="tag t-idle">{{ p.kind }}</span>
          {% if p.is_reply %}<span class="tag t-info">↳ thread yanıtı</span>{% endif %}
          {% if p.status=='approved' %}<span class="tag t-good">onaylı</span>{% endif %}
          {% if p.match_id %}<a href="/match/{{ p.match_id }}" class="xs" style="color:var(--s1)">maçı gör →</a>{% endif %}
          <span class="xs muted" style="margin-left:auto">{{ p.created_at|tr('%H:%M:%S') }}</span>
        </div>
        <form method="post" action="/queue/{{ p.id }}/edit" style="margin-bottom:9px">
          <textarea name="content" rows="3" maxlength="280">{{ p.content }}</textarea>
          <button class="btn btn-g btn-xs" style="margin-top:7px">Metni kaydet</button>
        </form>
        <div style="display:flex;gap:7px;flex-wrap:wrap">
          <form method="post" action="/queue/{{ p.id }}/approve"><button class="btn btn-g btn-xs">Onayla</button></form>
          <form method="post" action="/queue/{{ p.id }}/send"><button class="btn btn-p btn-xs">Şimdi gönder</button></form>
          <form method="post" action="/queue/{{ p.id }}/cancel"><button class="btn btn-d btn-xs">İptal</button></form>
        </div>
      </div>
      {% endfor %}
    {% else %}
    <p class="empty">Kuyruk boş. Canlı maç olayı veya yeni haber geldiğinde buraya düşer.</p>
    {% endif %}
  </div>
</div>
{% endif %}
{% endblock %}