{% extends "base.html" %}
{% block title %}Lists{% endblock %}

{% block extra_head %}
<style>
  .list-table td, .list-table th { font-size: .875rem; vertical-align: middle; }
  .value-cell  { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .reason-cell { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
</style>
{% endblock %}

{% block content %}

{% set is_bl      = (tab == 'blacklist') %}
{% set color      = 'danger'  if is_bl else 'success' %}
{% set icon       = 'shield-fill-x' if is_bl else 'shield-fill-check' %}
{% set pagination = bl_page   if is_bl else wl_page %}
{% set entries    = pagination.items if pagination else [] %}
{% set tab_total  = bl_total  if is_bl else wl_total %}

<div class="d-flex align-items-center justify-content-between mb-3">
  <h4 class="fw-bold mb-0"><i class="bi bi-list-check me-2 text-primary"></i>Allow / Block Lists</h4>
</div>

<!-- Tab headers (link-based - switching tabs navigates to the correct URL) -->
<ul class="nav nav-tabs mb-0">
  <li class="nav-item">
    <a class="nav-link fw-semibold {% if tab == 'blacklist' %}active{% endif %}"
       href="{{ url_for('lists.index', tab='blacklist') }}">
      <i class="bi bi-shield-fill-x me-1 text-danger"></i>Blacklist
      <span class="badge bg-danger ms-1">{{ bl_total }}</span>
    </a>
  </li>
  <li class="nav-item">
    <a class="nav-link fw-semibold {% if tab == 'whitelist' %}active{% endif %}"
       href="{{ url_for('lists.index', tab='whitelist') }}">
      <i class="bi bi-shield-fill-check me-1 text-success"></i>Whitelist
      <span class="badge bg-success ms-1">{{ wl_total }}</span>
    </a>
  </li>
</ul>

<div class="border border-top-0 rounded-bottom shadow-sm bg-white p-3">

  <!-- Add entry + Bulk import -->
  <div class="row g-3 mb-3">

    <div class="col-lg-6">
      <div class="card border border-{{ color }} border-opacity-25 bg-light h-100">
        <div class="card-header bg-{{ color }} bg-opacity-10 border-bottom border-{{ color }} border-opacity-25 py-2">
          <h6 class="mb-0 fw-bold text-{{ color }}">
            <i class="bi bi-plus-circle me-2"></i>Add {{ 'Blacklist' if is_bl else 'Whitelist' }} Entry
          </h6>
        </div>
        <div class="card-body">
          <form method="POST" action="{{ url_for('lists.add_entry') }}" novalidate>
            <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
            <input type="hidden" name="list_type" value="{{ tab }}">
            <div class="row g-2">
              <div class="col-sm-4">
                <label class="form-label form-label-sm fw-semibold mb-1">Type</label>
                <select name="entry_type" class="form-select form-select-sm">
                  <option value="email">Email</option>
                  <option value="domain">Domain</option>
                  <option value="ip">IP Address</option>
                  <option value="cidr">CIDR Range</option>
                </select>
              </div>
              <div class="col-sm-8">
                <label class="form-label form-label-sm fw-semibold mb-1">Value</label>
                <input type="text" name="value" class="form-control form-control-sm"
                       placeholder="{{ 'spam@example.com' if is_bl else 'trusted@partner.com' }}" required>
                <div class="form-text small mt-1">
                  For domain entries, prefix with <code>.</code> to also match subdomains
                  (e.g. <code>.aweber.com</code> matches <code>aweber.com</code> and
                  <code>smtp-soi-g30-187.aweber.com</code>).
                </div>
              </div>
              {% if current_user.is_superadmin %}
              <div class="col-12">
                <label class="form-label form-label-sm fw-semibold mb-1">Scope</label>
                <select name="scope" class="form-select form-select-sm">
                  <option value="global" selected>Global (all domains)</option>
                  {% for d in domains %}
                  <option value="{{ d.id }}">{{ d.domain }}</option>
                  {% endfor %}
                </select>
              </div>
              {% endif %}
              <div class="col-12">
                <label class="form-label form-label-sm fw-semibold mb-1">Reason (optional)</label>
                <div class="input-group input-group-sm">
                  <input type="text" name="reason" class="form-control"
                         placeholder="{{ 'Why is this being blocked?' if is_bl else 'Why is this trusted?' }}">
                  <button type="submit" class="btn btn-{{ color }}">
                    <i class="bi bi-{{ icon }} me-1"></i>Add
                  </button>
                </div>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>

    <div class="col-lg-6">
      <div class="card border border-{{ color }} border-opacity-25 bg-light h-100">
        <div class="card-header bg-{{ color }} bg-opacity-10 border-bottom border-{{ color }} border-opacity-25 py-2">
          <h6 class="mb-0 fw-bold text-{{ color }}">
            <i class="bi bi-upload me-2"></i>Bulk Import
          </h6>
        </div>
        <div class="card-body">
          <form method="POST" action="{{ url_for('lists.bulk_import') }}" novalidate>
            <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
            <input type="hidden" name="list_type" value="{{ tab }}">
            <div class="mb-2">
              <label class="form-label form-label-sm fw-semibold mb-1">Entry Type</label>
              <select name="entry_type" class="form-select form-select-sm">
                <option value="email">Email</option>
                <option value="domain">Domain</option>
                <option value="ip">IP Address</option>
                <option value="cidr">CIDR Range</option>
              </select>
            </div>
            {% if current_user.is_superadmin %}
            <div class="mb-2">
              <label class="form-label form-label-sm fw-semibold mb-1">Scope</label>
              <select name="scope" class="form-select form-select-sm">
                <option value="global" selected>Global (all domains)</option>
                {% for d in domains %}
                <option value="{{ d.id }}">{{ d.domain }}</option>
                {% endfor %}
              </select>
            </div>
            {% endif %}
            <div class="mb-2">
              <label class="form-label form-label-sm fw-semibold mb-1">Entries (one per line)</label>
              <textarea name="bulk_values" class="form-control form-control-sm" rows="4"
                        placeholder="{{ 'spam@example.com' if is_bl else 'trusted@partner.com' }}&#10;{{ 'badactor.net' if is_bl else 'partner.net' }}&#10;10.0.0.1"></textarea>
              <div class="form-text small mt-1">
                For domain entries, prefix with <code>.</code> to also match subdomains
                (e.g. <code>.aweber.com</code> matches <code>aweber.com</code> and
                <code>smtp-soi-g30-187.aweber.com</code>).
              </div>
            </div>
            <button type="submit" class="btn btn-sm btn-outline-{{ color }} w-100">
              <i class="bi bi-cloud-upload me-1"></i>Import All
            </button>
          </form>
        </div>
      </div>
    </div>

  </div><!-- /row -->

  <!-- Search / filter (GET form - no JS required) -->
  <form method="GET" action="{{ url_for('lists.index') }}" class="row g-2 mb-2 align-items-center">
    <input type="hidden" name="tab" value="{{ tab }}">
    <div class="col-sm-6 col-md-5">
      <div class="input-group input-group-sm">
        <span class="input-group-text"><i class="bi bi-search"></i></span>
        <input type="search" name="q" value="{{ q }}" class="form-control"
               placeholder="Search value or reason..." autocomplete="off">
      </div>
    </div>
    <div class="col-sm-3 col-md-2">
      <select name="type" class="form-select form-select-sm">
        <option value="">All types</option>
        <option value="email"  {% if type_ == 'email'  %}selected{% endif %}>Email</option>
        <option value="domain" {% if type_ == 'domain' %}selected{% endif %}>Domain</option>
        <option value="ip"     {% if type_ == 'ip'     %}selected{% endif %}>IP</option>
        <option value="cidr"   {% if type_ == 'cidr'   %}selected{% endif %}>CIDR</option>
      </select>
    </div>
    <div class="col-auto">
      <button type="submit" class="btn btn-sm btn-primary">Search</button>
      {% if q or type_ %}
      <a href="{{ url_for('lists.index', tab=tab) }}" class="btn btn-sm btn-outline-secondary ms-1">Clear</a>
      {% endif %}
    </div>
    <div class="col text-muted small text-end">
      {% if pagination %}
        {% if q or type_ %}{{ pagination.total }} of {{ tab_total }} shown
        {% else %}{{ tab_total }} entries{% endif %}
        {% if pagination.pages > 1 %}, page {{ pagination.page }} of {{ pagination.pages }}{% endif %}
      {% endif %}
    </div>
  </form>

  <!-- Table -->
  <div class="table-responsive">
    <table class="table table-hover list-table mb-0" style="table-layout:fixed;">
      <thead class="table-dark">
        <tr>
          <th class="ps-3" style="width:7rem;">Type</th>
          <th>Value</th>
          {% if current_user.is_superadmin %}
          <th style="width:9rem;">Scope</th>
          {% endif %}
          <th>Reason</th>
          <th style="width:8rem;">Added By</th>
          <th style="width:6rem;" class="text-center">Active</th>
          <th style="width:9rem;">Created</th>
          <th style="width:7rem;" class="text-center">Actions</th>
        </tr>
      </thead>
      <tbody>
        {% if entries %}
          {% for entry in entries %}
          {% if is_bl %}
            {% set toggle_url = url_for('lists.toggle_blacklist', entry_id=entry.id) %}
            {% set delete_url = url_for('lists.delete_blacklist', entry_id=entry.id) %}
          {% else %}
            {% set toggle_url = url_for('lists.toggle_whitelist', entry_id=entry.id) %}
            {% set delete_url = url_for('lists.delete_whitelist', entry_id=entry.id) %}
          {% endif %}
          <tr class="{% if not entry.is_active %}table-secondary opacity-60{% endif %}">
            <td class="ps-3">
              {% if entry.entry_type == 'email' %}
                <span class="badge bg-primary">Email</span>
              {% elif entry.entry_type == 'domain' %}
                <span class="badge bg-info text-dark">Domain</span>
              {% elif entry.entry_type == 'ip' %}
                <span class="badge bg-warning text-dark">IP</span>
              {% elif entry.entry_type == 'cidr' %}
                <span class="badge bg-secondary">CIDR</span>
              {% else %}
                <span class="badge bg-light text-dark">{{ entry.entry_type }}</span>
              {% endif %}
            </td>
            <td class="value-cell font-monospace" title="{{ entry.value }}">{{ entry.value }}</td>
            {% if current_user.is_superadmin %}
            <td class="small">
              {% if entry.domain_id %}
                <span class="badge bg-info text-dark" title="Per-domain entry">
                  <i class="bi bi-diagram-3 me-1"></i>{{ entry.domain.domain if entry.domain else entry.domain_id }}
                </span>
              {% else %}
                <span class="badge bg-dark" title="Applies to all domains">
                  <i class="bi bi-globe me-1"></i>Global
                </span>
              {% endif %}
            </td>
            {% endif %}
            <td class="reason-cell text-muted" title="{{ entry.reason or '' }}">{{ entry.reason or '-' }}</td>
            <td class="small text-muted">
              {{ entry.added_by_user.username if entry.added_by_user else 'system' }}
            </td>
            <td class="text-center">
              {% if entry.is_active %}
                <span class="badge bg-success">Yes</span>
              {% else %}
                <span class="badge bg-secondary">No</span>
              {% endif %}
            </td>
            <td class="small text-muted text-nowrap">
              {{ entry.created_at.strftime('%Y-%m-%d') if entry.created_at else '-' }}
            </td>
            <td class="text-center">
              {% set can_act = current_user.is_superadmin
                            or (current_user.is_domain_admin and entry.domain_id == current_user.domain_id)
                            or (current_user.is_mailbox_user and entry.domain_id == current_user.domain_id and entry.added_by == current_user.id) %}
              {% if can_act %}
              <div class="d-flex justify-content-center gap-1">
                <form method="POST" action="{{ toggle_url }}" style="display:inline;">
                  <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                  <button type="submit" class="btn btn-sm py-0 px-2
                    {% if entry.is_active %}btn-outline-warning{% else %}btn-outline-success{% endif %}"
                    title="{% if entry.is_active %}Disable{% else %}Enable{% endif %}">
                    <i class="bi {% if entry.is_active %}bi-toggle-on{% else %}bi-toggle-off{% endif %}"></i>
                  </button>
                </form>
                <form method="POST" action="{{ delete_url }}" style="display:inline;"
                      data-confirm-msg="Remove {{ entry.value }} from {{ 'blacklist' if is_bl else 'whitelist' }}?"
                      onsubmit="return confirm(this.dataset.confirmMsg)">
                  <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                  <button type="submit" class="btn btn-outline-danger btn-sm py-0 px-2" title="Delete">
                    <i class="bi bi-trash3-fill"></i>
                  </button>
                </form>
              </div>
              {% else %}
              <span class="text-muted small" title="Added by another user">-</span>
              {% endif %}
            </td>
          </tr>
          {% endfor %}
        {% else %}
          <tr>
            <td colspan="{{ 8 if current_user.is_superadmin else 7 }}" class="text-center text-muted py-4">
              {% if q or type_ %}
                <i class="bi bi-search fs-2 d-block mb-2 text-secondary"></i>
                No entries match your search.
              {% else %}
                <i class="bi bi-{{ icon }} fs-2 d-block mb-2 text-secondary"></i>
                No {{ 'blacklist' if is_bl else 'whitelist' }} entries yet.
              {% endif %}
            </td>
          </tr>
        {% endif %}
      </tbody>
    </table>
  </div>

  <!-- Pagination -->
  {% if pagination and pagination.pages > 1 %}
  <nav class="mt-2">
    <ul class="pagination pagination-sm justify-content-center flex-wrap mb-0">
      <li class="page-item {% if not pagination.has_prev %}disabled{% endif %}">
        {% if pagination.has_prev %}
          <a class="page-link" href="{{ url_for('lists.index', tab=tab, page=pagination.prev_num, q=q, type=type_) }}">&laquo;</a>
        {% else %}
          <span class="page-link">&laquo;</span>
        {% endif %}
      </li>
      {% for p in pagination.iter_pages() %}
        {% if p %}
          <li class="page-item {% if p == pagination.page %}active{% endif %}">
            <a class="page-link" href="{{ url_for('lists.index', tab=tab, page=p, q=q, type=type_) }}">{{ p }}</a>
          </li>
        {% else %}
          <li class="page-item disabled"><span class="page-link">...</span></li>
        {% endif %}
      {% endfor %}
      <li class="page-item {% if not pagination.has_next %}disabled{% endif %}">
        {% if pagination.has_next %}
          <a class="page-link" href="{{ url_for('lists.index', tab=tab, page=pagination.next_num, q=q, type=type_) }}">&raquo;</a>
        {% else %}
          <span class="page-link">&raquo;</span>
        {% endif %}
      </li>
    </ul>
  </nav>
  {% endif %}

</div><!-- /panel -->

{% endblock %}

{% block extra_scripts %}{% endblock %}