{% extends 'base.html' %}
{% block title %}User Accounts{% endblock %}

{% block content %}
<div class="space-y-4">
  <div class="flex flex-wrap items-center justify-between gap-2">
    <h1 class="text-2xl font-bold">User Accounts</h1>
    <a href="{% url 'accounts:user_create' %}" class="btn btn-primary btn-sm">Create User</a>
  </div>

  <form method="get" class="grid grid-cols-1 gap-3 rounded-box border border-base-300 bg-base-100 p-4 md:grid-cols-4">
    <label class="form-control">
      <span class="label-text">Search</span>
      <input type="text" name="q" value="{{ query }}" class="input input-bordered" placeholder="Username, name, email, contact" />
    </label>
    <label class="form-control">
      <span class="label-text">Role</span>
      <select name="role" class="select select-bordered">
        <option value="">All roles</option>
        {% for code, label in role_choices %}
          <option value="{{ code }}" {% if current_role == code %}selected{% endif %}>{{ label }}</option>
        {% endfor %}
      </select>
    </label>
    <label class="form-control">
      <span class="label-text">Status</span>
      <select name="status" class="select select-bordered">
        <option value="">All statuses</option>
        <option value="active" {% if current_status == "active" %}selected{% endif %}>Active</option>
        <option value="inactive" {% if current_status == "inactive" %}selected{% endif %}>Inactive</option>
      </select>
    </label>
    <div class="flex items-end gap-2">
      <button class="btn btn-primary">Apply</button>
      {% if query or current_role or current_status %}
        <a href="{% url 'accounts:user_list' %}" class="btn btn-ghost">Clear</a>
      {% endif %}
    </div>
  </form>

  <div class="card border border-base-300 bg-base-100">
    <div class="overflow-x-auto">
      <table class="table table-zebra">
        <thead>
          <tr>
            <th>Username</th>
            <th>Name</th>
            <th>Role</th>
            <th>Groups</th>
            <th>Last Login</th>
            <th>Status</th>
            <th>Security</th>
            <th></th>
          </tr>
        </thead>
        <tbody>
          {% for u in users %}
          <tr>
            <td class="font-medium">{{ u.username }}</td>
            <td>{{ u.get_full_name|default:"—" }}</td>
            <td><span class="badge badge-outline">{{ u.get_role_display }}</span></td>
            <td>
              {% with custom_groups=u.groups.all %}
                {% if custom_groups %}
                  {% for g in custom_groups %}
                    {% if not g.name|slice:":5" == "role:" %}
                      <span class="badge badge-ghost badge-sm mr-1">{{ g.name }}</span>
                    {% endif %}
                  {% endfor %}
                {% else %}
                  —
                {% endif %}
              {% endwith %}
            </td>
            <td>{{ u.last_login|date:"Y-m-d H:i"|default:"Never" }}</td>
            <td>
              {% if u.is_active %}
                <span class="badge badge-success badge-sm">Active</span>
              {% else %}
                <span class="badge badge-error badge-sm">Inactive</span>
              {% endif %}
            </td>
            <td>
              {% if u.is_locked %}
                <span class="badge badge-warning badge-sm">Locked</span>
              {% elif u.must_change_password %}
                <span class="badge badge-info badge-sm">Force Password Change</span>
              {% else %}
                <span class="text-base-content/60">OK</span>
              {% endif %}
            </td>
            <td class="flex flex-wrap gap-1">
              <a href="{% url 'accounts:user_edit' u.pk %}" class="btn btn-ghost btn-xs">Edit</a>
              <a href="{% url 'accounts:user_credentials' u.pk %}" class="btn btn-ghost btn-xs">Credentials</a>
              <a href="{% url 'accounts:user_reset_password' u.pk %}" class="btn btn-ghost btn-xs">Reset Password</a>
              {% if u != request.user %}
                <form method="post" action="{% url 'accounts:user_toggle' u.pk %}" onsubmit="return confirm('{% if u.is_active %}Deactivate{% else %}Activate{% endif %} {{ u.username }}?')">
                  {% csrf_token %}
                  <button
                    type="submit"
                    class="btn btn-ghost btn-xs {% if u.is_active %}text-error{% else %}text-success{% endif %}"
                  >
                    {% if u.is_active %}Deactivate{% else %}Activate{% endif %}
                  </button>
                </form>
              {% endif %}
            </td>
          </tr>
          {% empty %}
          <tr><td colspan="8" class="text-center opacity-70">No users found.</td></tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>
  {% include "partials/pagination.html" with page_obj=users %}
</div>
{% endblock %}