{% set admin_page = "feedback" %}
{% extends "admin/base_admin.html" %}

{% block title %}Feedback - {{ config.APP_NAME }} Admin{% endblock %}
{% block topbar_title %}Feedback{% endblock %}

{% block admin_content %}
  <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;">
    <div>
      <h2 class="text-xl" style="margin:0;">User Feedback</h2>
      <p class="text-sm text-stone" style="margin:4px 0 0;">
        {{ feedback_items | length }} messages
        {% if unread_count > 0 %}
        &middot; <span style="color:#D97706;font-weight:600;">{{ unread_count }} unread</span>
        {% endif %}
      </p>
    </div>
  </div>

  <div class="card" style="padding:0;overflow:hidden;">
    {% if feedback_items %}
    <table class="table">
      <thead>
        <tr>
          <th>Message</th>
          <th>Page</th>
          <th>User</th>
          <th>Date</th>
          <th>Status</th>
        </tr>
      </thead>
      <tbody>
        {% for item in feedback_items %}
        <tr{% if not item.is_read %} style="background:#FFFBF5;"{% endif %}>
          <td style="max-width:320px;">
            <p style="margin:0;font-size:13px;color:#2C1810;white-space:pre-wrap;word-break:break-word;">{{ item.message }}</p>
          </td>
          <td>
            {% if item.page_url %}
            <a href="{{ item.page_url }}" target="_blank" class="mono text-sm" style="max-width:180px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;" title="{{ item.page_url }}">
              {{ item.page_url | replace(config.BASE_URL, '') or '/' }}
            </a>
            {% else %}
            <span class="text-stone text-sm">&mdash;</span>
            {% endif %}
          </td>
          <td>
            {% if item.user_email %}
            <a href="{{ url_for('admin.user_detail', user_id=item.user_id) }}" class="text-sm">{{ item.user_email }}</a>
            {% else %}
            <span class="text-stone text-sm">Anonymous</span>
            {% endif %}
          </td>
          <td class="mono text-sm">{{ item.created_at[:16] }}</td>
          <td>
            {% if item.is_read %}
            <span class="badge-success">read</span>
            {% else %}
            <form method="post" action="{{ url_for('admin.feedback_mark_read', feedback_id=item.id) }}" class="m-0">
              <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
              <button type="submit" class="btn-outline btn-sm">Mark read</button>
            </form>
            {% endif %}
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
    {% else %}
    <div style="padding:40px;text-align:center;">
      <p class="text-stone text-sm">No feedback yet.</p>
    </div>
    {% endif %}
  </div>
{% endblock %}
