{% load i18n %}
{% load forum_conversation_tags %}
{% load forum_member_tags %}
{% load forum_tracking_tags %}

{% if topics or not hide_if_empty %}
<div class="mb-3 row">
  <div class="col-12">
    <div class="card topiclist">
      <div class="p-0 card-header">
        <div class="row m-0 px-3 py-2">
          <div class="pl-0 col-md-8 col-sm-9 col-12 topic-name-col"><h3 class="m-0 card-title h5 text-dark"><i class="fas fa-comment"></i> {% trans topic_list_title %}</h3></div>
          <div class="col-md-1 d-none d-md-block text-center text-nowrap topic-count-col">{% trans "Replies" %}</div>
          <div class="col-md-1 d-none d-md-block text-center text-nowrap topic-count-col">{% trans "Views" %}</div>
          <div class="pr-0 col-md-2 col-sm-3 d-none d-sm-block text-nowrap topic-last-post-col">{% trans "Last post" %}</div>
        </div>
      </div>
      <div class="p-0 card-body">{% if not force_all_unread and unread_topics == None %}{% get_unread_topics topics request.user as unread_topics %}{% endif %}
      {% for topic in topics %}
      <div class="row m-0 px-3 py-2 border-bottom">
        <div class="pl-0 col-md-8 col-sm-9 col-xs-11 topic-name">
          <div class="topic-inline-pagination float-right d-none d-sm-block">{% topic_pages_inline_list topic %}</div>
          <table class="topic-data-table">
            <tr>
              <td class="pt-1 pr-3 align-top topic-icon {% if topic in unread_topics or force_all_unread %}unread{% endif %}">
                <i class="fas {% if topic.is_sticky %}fa-lightbulb{% elif topic.is_announce %}fa-info{% else %}fa-dot-circle{% endif %} fa-2x"></i>
              </td>
              <td class="align-top topic-name">
                <a href="{% url 'forum_conversation:topic' topic.forum.slug topic.forum.pk topic.slug topic.pk %}" class="topic-name-link">{{ topic.subject }}</a>{% if topic.is_locked %}&nbsp;<i class="fas fa-times-circle locked-indicator" title="{% trans 'This topic is locked' %}"></i>{% endif %}
                <div>
                  <div class="topic-created">
                  {% if topic.poster %}
                    {% url 'forum_member:profile' topic.poster_id as poster_url %}
                    {% blocktrans trimmed with poster_url=poster_url username=topic.poster|forum_member_display_name creation_date=topic.created %}
                      By: <a href="{{ poster_url }}">{{ username }}</a> on {{ creation_date }}
                    {% endblocktrans %}
                  {% else %}
                    {% blocktrans trimmed with poster_username=topic.first_post.username creation_date=topic.created %}
                      By: {{ poster_username }} on {{ creation_date }}
                    {% endblocktrans %}
                  {% endif %}
                  </div>
                </div>
              </td>
            </tr>
          </table>
        </div>
        <div class="py-2 col-md-1 d-none d-md-block text-center topic-count">{{ topic.posts_count|add:"-1" }}</div>
        <div class="py-2 col-md-1 d-none d-md-block text-center topic-count">{{ topic.views_count }}</div>
        <div class="py-2 col-md-2 col-sm-3 d-none d-sm-block topic-last-post">
        {% with last_post=topic.last_post %}
          {% if last_post.poster %}
            {% url 'forum_member:profile' last_post.poster_id as poster_url %}
            {% blocktrans trimmed with poster_url=poster_url username=last_post.poster|forum_member_display_name %}
              By: <a href="{{ poster_url }}">{{ username }}</a>
            {% endblocktrans %}
          {% else %}
            {% blocktrans trimmed with poster_username=last_post.username %}
              By: {{ poster_username }}
            {% endblocktrans %}
          {% endif %}
          &nbsp;<a href="{% url 'forum_conversation:topic' topic.forum.slug topic.forum.pk topic.slug topic.pk %}?post={{ last_post.pk }}#{{ last_post.pk }}"><i class="fas fa-arrow-circle-right "></i></a>
          <br />
          <small>{{ last_post.created }}</small>
        {% endwith %}
        </div>
      </div>
      {% empty %}
      <div class="row m-0 px-3 py-2">
        <div class="p-0 col-12">
        {% if empty_message %}
          {{ empty_message }}
        {% else %}
          {% trans "There are no topics in this forum." %}
        {% endif %}
        </div>
      </div>
      {% endfor %}
      </div>
    </div>
  </div>
</div>
{% endif %}
