{% extends 'users/base.html' %}
{% load helpers %}
{% load form_helpers %}

{% block title %}User Preferences{% endblock %}

{% block content %}
  <form method="post" action="" id="preferences-update">
    {% csrf_token %}

    {# Built-in preferences #}
    {% for group, fields in form.fieldsets %}
      <div class="field-group my-5">
        <div class="row mb-2">
          <h5 class="offset-sm-3">{{ group }}</h5>
        </div>
        {% for name in fields %}
          {% render_field form|getfield:name %}
        {% endfor %}
      </div>
    {% endfor %}

    {# Plugin preferences #}
    {% with plugin_fields=form.plugin_fields %}
      {% if plugin_fields %}
        <div class="field-group my-5">
          <div class="row mb-2">
            <h5 class="offset-sm-3">Plugins</h5>
          </div>
          {% for name in plugin_fields %}
            {% render_field form|getfield:name %}
          {% endfor %}
        </div>
      {% endif %}
    {% endwith %}

    {# Table configurations #}
    <div class="field-group my-5">
      <div class="row mb-2">
        <h5 class="offset-sm-3">Table Configurations</h5>
      </div>
      <div class="row">
        {% if request.user.config.data.tables %}
          <label class="col-sm-3 col-form-label text-lg-end">
            Clear table preferences
          </label>
          <div class="col-sm-9">
            <table class="table table-hover object-list">
              <thead>
                <tr>
                  <th>
                    <input type="checkbox" class="toggle form-check-input" title="Toggle All">
                  </th>
                  <th>Table</th>
                  <th>Ordering</th>
                  <th>Columns</th>
                </tr>
              </thead>
              <tbody>
                {% for table, prefs in request.user.config.data.tables.items %}
                  <tr>
                    <td>
                      <input type="checkbox" name="pk" value="tables.{{ table }}" class="form-check-input" />
                    </td>
                    <td>{{ table }}</td>
                    <td>{{ prefs.ordering|join:", "|placeholder }}</td>
                    <td>{{ prefs.columns|join:", "|placeholder }}</td>
                  </tr>
                {% endfor %}
              </tbody>
            </table>
          </div>
        {% else %}
          <div class="offset-sm-3">
            <p class="text-muted">None found</p>
          </div>
        {% endif %}
      </div>
    </div>

    <div class="text-end my-3">
      <a class="btn btn-outline-secondary" href="{% url 'users:preferences' %}">Cancel</a>
      <button type="submit" name="_update" class="btn btn-primary">Save </button>
    </div>
  </form>
{% endblock %}