{% load falco %}

<table class="min-w-full">
  <thead class="border text-gray-700 uppercase bg-gray-100 text-sm">
  {% with th_class="text-sm font-medium text-gray-900 border-r px-6 py-4 text-left" %}
    <tr>
      {% for header in objects|field_verbose_names:fields %}
        <th scope="col" class="{{ th_class }}">{{ header }}</th>
      {% endfor %}
      <th scope="col">Actions</th>
    </tr>
  {% endwith %}
  </thead>
  <tbody>
  {% with td_class="px-6 py-4 whitespace-nowrap text-sm font-medium border-r text-gray-900" %}
    {% for object in objects %}
      <tr class="border hover:bg-neutral-100">
        {% for field in fields %}
          {% if forloop.first %}
            <td class="{{ td_class }}">
              {% if detail_view %}
                <a class="font-bold hover:underline"
                   href="{% url detail_view object|lookup %}">{{ object|getattr:field }}</a>
              {% else %}
                {{ object|getattr:field }}
              {% endif %}
            </td>
          {% elif object|field_class_name:field == "ImageField" or object|field_class_name:field == "FileField" %}
            <td class="{{ td_class }}">
              {% if object|getattr:field %}
                <a class="hover:underline"
                   href="{{ object|getattr:field|getattr:"url" }}">{{ object|getattr:field|getattr:"name" }}</a>
              {% endif %}
            </td>
          {% elif object|field_class_name:field == "BooleanField" %}
            <td class="{{ td_class }}">
              {% if object|getattr:field %}
                {% heroicon_solid "check-circle" size="19" class="text-green-500 mx-auto" %}
              {% else %}
                {% heroicon_solid "x-circle" size="19" class="text-red-500 mx-auto" %}
              {% endif %}
            </td>
          {% else %}
            <td class="{{ td_class }}">{{ object|getattr:field }}</td>
          {% endif %}
        {% endfor %}
        <td class="{{ td_class }} flex gap-8">
          {% if detail_view %}
            <a class="hover:text-blue-500"
               href="{% url detail_view object|lookup %}">{% heroicon_outline "eye" size="18" %}</a>
          {% endif %}
          {% if update_view %}
            <a class="hover:text-blue-500"
               href="{% url update_view object|lookup %}">{% heroicon_outline "pencil-square" size="18" %}</a>
          {% endif %}
          {% if delete_view %}
            <form
              hx-boost="true"
              hx-target="closest tr"
              hx-push-url="false"
              action="{% url delete_view object|lookup %}"
              class="cursor-pointer text-red-600 hover:text-red-500"
              method="post"
              onsubmit="return confirm('Do you really want to delete this element?');">
              {% csrf_token %}
              <button type="submit">{% heroicon_outline "trash" size="18" %}</button>
            </form>
          {% endif %}
      </tr>
    {% endfor %}
  {% endwith %}
  </tbody>
</table>
