email_alerts_v2/templates/thread_detail.html

{% extends "base.html" %}
{% block content %}
  <div class="row mb-2">
    <div class="col">
      <h2>Thread #{{ thread.id }}</h2>
      <p class="muted">Subject: <strong>{{ thread.subject }}</strong></p>
      <p class="muted">Account: <span class="badge">{{ thread.account_email }}</span></p>
      <p>
        {% if thread.requires_reply %}
          <span class="badge warn">Needs reply</span>
        {% else %}
          <span class="badge success">Up to date</span>
        {% endif %}
      </p>
    </div>
  </div>

  <div class="row">
    <div class="col">
      <div class="card">
        <h3>AI Analysis</h3>
        <p>
          <strong>Actionable:</strong>
          {% if ai.actionable %}<span class="badge warn">Yes</span>{% else %}<span class="badge success">No</span>{% endif %}
        </p>
  <p><strong>Summary:</strong> {{ ai.summary or thread.ai_summary }}</p>
        <p class="muted">Confidence: {{ ai.confidence }} • Model: {{ ai.model }}</p>
  <p class="muted">Last stored: {{ thread.last_analyzed_at }}</p>
  <p class="muted">Last alert level sent: {{ thread.last_alert_level_sent }} at {{ thread.last_alert_sent_at }}</p>
      </div>
    </div>
  </div>

  <div class="row mt-2">
    <div class="col">
      <h3>Messages</h3>
      <div class="messages">
        {% for m in messages %}
          <div class="msg-item {% if m.is_incoming %}incoming{% else %}outgoing{% endif %}">
            <div class="msg-bubble">
              <div class="msg-meta">{{ m.date_sent }} • {% if m.is_incoming %}Incoming{% else %}Outgoing{% endif %} • {{ m.folder }}</div>
              <div class="msg-meta">From: <span class="pill">{{ m.from_email }}</span> → To: <span class="pill">{{ m.to_email }}</span></div>
              <div class="msg-subject">{{ m.subject }}</div>
              <div class="msg-body"><pre>{{ m.body }}</pre></div>
            </div>
          </div>
        {% else %}
          <p class="muted">No messages.</p>
        {% endfor %}
      </div>
    </div>
  </div>
{% endblock %}