{% extends "_base.html" %}
{% import 'tables/_macros.html' as table_macros %}

{% block body %}
{% if error %}
<div class="alert alert-danger" role="alert">
  {{ error.message }}
</div>
{% else %}
{{ table_macros.table_nav(table_id, 'view') }}

<div class="row">
  <div class="col">
    <div class="table-responsive">
      <table class="table table-sm table-bordered table-striped table-hover">
        <thead>
          <tr>
            {% for column in table_results.column_names %}
            <th>
              {{ column }}
              {% if column == request.query_params.sort_asc %}
              <a href="{{ request | current_path_with_args([('sort_asc', None), ('sort_desc', column)]) }}" style="text-decoration: none;">
                <i class="bi-sort-up" aria-hidden="true"></i>
              </a>
              {% elif column == request.query_params.sort_desc %}
              <a href="{{ request | current_path_with_args([('sort_asc', column), ('sort_desc', None)]) }}" style="text-decoration: none;">
                <i class="bi-sort-down" aria-hidden="true"></i>
              </a>
              {% else %}
              <a href="{{ request | current_path_with_args([('sort_asc', column), ('sort_desc', None)]) }}" class="text-decoration-none">
                <i class="bi-arrow-down-up" aria-hidden="true"></i>
              </a>
              {% endif %}
              {% set other_cols = table_results.column_names | list | reject('equalto', column) | list %}
              {% set cols_args = [] %}
              {% for col in other_cols %}
                {% set tmp = cols_args.append(('cols', col)) %}
              {% endfor %}
              <a href='{{ request | current_path_with_args(cols_args) }}' class='text-decoration-none'>
                <i class='bi-eye-slash' aria-hidden='true'></i>
              </a>
            </th>
            {% endfor %}
          </tr>
        </thead>
        <tbody class="table-group-divider">
          {% for row in table_results.to_pylist() %}
          <tr>
            {% for column in table_results.column_names %}
            <td>{{ row[column] }}</td>
            {% endfor %}
          </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>

    <div class="d-flex justify-content-between">
      <div class="row">
        <form class="col" action="{{ request.url.path }}" method="get">
          {% for param_name, param_val in request.query_params.multi_items() %}
          {% if param_name != 'limit' %}
          <input type="hidden" name="{{ param_name }}" value="{{ param_val }}">
          {% endif %}
          {% endfor %}

          <div class="input-group">
            <input id="limit-input" name="limit" type="number" class="form-control" min="1" max="10000" value="{{ request.query_params.limit or default_limit }}">
            <button type="submit" class="btn btn-primary">Limit</button>
          </div>
        </form>

        <form class="col" ="{{ request.url.path }}" method="get">
          {% for param_name, param_val in request.query_params.multi_items() %}
          {% if param_name != 'version' %}
          <input type="hidden" name="{{ param_name }}" value="{{ param_val }}">
          {% endif %}
          {% endfor %}

          <div class="input-group">
            <input
              id="version-input"
              name="version"
              type="number"
              class="form-control"
              min="0"
              max="{{ table_metadata.version }}"
              value="{{ request.query_params.version or table_metadata.version }}"
            >
            <button type="submit" class="btn btn-primary">Version</button>
          </div>
        </form>
      </div>

      <a href="/tables/query?sql={{ sql_query | urlencode }}" class="btn btn-primary" role="button">
        <i class="bi-code" aria-hidden="true"></i> SQL Query
      </a>
    </div>
  </div>
</div>
{% endif %}
{% endblock %}