{% extends "base.html" %}
{% block content %}
<nav class="darkbg">
  <h1 class="thread-title">All topics</h1>
  {% if active_user and active_user.is_mod() %}
    <a class="linkbutton" href={{ url_for("topics.create") }}>Create new topic</a>
  {% endif %}
</nav>
{% if topic_list | length == 0 %}
  <p>There are no topics.</p>
{% else %}
  {% for topic in topic_list %}
    <div class="topic">
      <div class="topic-info-container">
        <a class="thread-title" href="{{ url_for("topics.topic", slug=topic['slug']) }}">{{ topic['name'] }}</a>
        {{ topic['description'] }}
        {% if topic['latest_thread_username'] %}
          <span>
            Latest thread: <a href="{{ url_for("threads.thread", slug=topic['latest_thread_slug'])}}">{{topic['latest_thread_title']}}</a> by <a href="{{url_for("users.page", username=topic['latest_thread_username'])}}">{{topic['latest_thread_username']}}</a> on ...
          </span>
          {% if topic['id'] in active_threads %}
            {% with thread=active_threads[topic['id']] %}
              <span>
                Latest post in: <a href="{{ url_for("threads.thread", slug=thread['thread_slug'])}}">{{ thread['thread_title'] }}</a> by <a href="{{ url_for("users.page", username=thread['username'])}}">{{ thread['username'] }}</a> on ...
              </span>
            {% endwith %}
          {% endif %}
        {% else %}
          <i>No threads yet.</i>
        {% endif %}
        </div>
        <div class="topic-locked-container contain-svg">
          {% if topic['is_locked'] %}
            <img src="/static/misc/lock.svg"></img>
            <i>Locked</i>
          {% endif %}
        </div>
    </div>
  {% endfor %}
{% endif %}
{% endblock %}