{% load wagtailsettings_tags wagtailcore_tags mptt_tags molo_commenting_tags core_tags wagtailimages_tags comments gem_tags %}
{% get_settings %}
{% if article.is_commenting_enabled %}
<div class="comments">
  {# <!-- COMMENTS FORM MODULE --> #}
  <div class="comments-posting">
    {% if article.allow_commenting %}
      {% if request.user.is_authenticated %}
        <div class="heading heading--secondary">
          <h4 class="heading__subheading">{% trans "Comment" %}</h4>
        </div>
        {% render_comment_form for article %}
      {% else %}
      <div class="heading heading--secondary">
        <h4 class="heading__subheading">{% trans "Comment" %}</h4>
      </div>
      <h5 class="heading__subtitle">{% trans "Commenting requires you to be logged in." %}</h5>
      <a href="{{ LOGIN_URL }}" class="call-to-action__button call-to-action__button--primary">
          {% trans "Log in to comment" %}
        </a>
      {% endif %}
    {% else %}
      <div class="heading heading--secondary">
        <h4 class="heading__subheading">{% trans "Comment" %}</h4>
      </div>
      <h5 class="heading__subtitle">{% trans "Commenting on this article is currently disabled." %}</h5>
      <div class="comments__form-disabled">
        {% render_comment_form for article %}
      </div>
    {% endif %}
  </div>

  {% if settings.gem.GemSettings.enable_comment_threads %}
    {# <!-- COMMENTS THREAD MODULE --> #}
    {% get_comment_count for article as comment_count %}
    {% get_molo_comments for article as comment_list limit 2 child_limit 2 %}
    {% if comment_list %}
      <div id="comments-list" class="comments-list_wrapper">
        <div class="heading heading--hero">
          <h2 class="heading__component">{% if comment_count > 1 %}{% trans "The Comments" %}{% else %}{% trans "The Comment" %}{% endif %}</h2>
        </div>
        <div class="comments-list">
          {% for node in comment_list %}
            {% recursetree node %}
              <div class="comments-list__item{% if node.parent == None %} comments-list__item--parent-comment{% endif %}{% if node.parent %} comments-list__item--reply{% endif %}">
                <h5 class="comments__alias comments__alias-author">
                  {% if node.user.is_staff %}
                    {% if settings.gem.GemSettings.moderator_name %}
                      {{settings.gem.GemSettings.moderator_name}}
                    {% else %}
                      {% trans "Big Sister" %}
                    {% endif %}
                    <span class="comments__staff"> - {% trans "Moderator" %}</span>
                  {% elif node.user_name.lower == 'anonymous' %}
                    {% trans "Anonymous" %}
                  {% else %}
                    {% if not node.user.profile.alias %}
                      {% trans "Anonymous" %}
                    {% else %}
                      {{node.user.profile.alias}}
                    {% endif %}
                  {% endif %}
                </h5>
                {% if node.is_removed %}
                  <h6 class="comments__description">
                    {% trans "This comment has been removed by the community. Please read our platform rules." %}
                  </h6>
                {% else %}
                  <p class="comments__body-small">{{ node.comment|smarttruncatechars:100 }}</p>
                  {% if node.comment.200 %}
                    <a href="{% url 'molo.commenting:more-comments' article.pk %}" class="call-to-action__nav-item-text call-to-action__nav-item-text--readmore">
                    {% trans "Read More"%}</a>
                  {% endif %}

                  <span class="comments__publish-date">
                    {{node.submit_date|timesince}} {% trans "ago" %}
                  </span>

                  <div class="comments__reply-meta">
                    {% if not node.user|is_in_admin_group %}
                      <a href="{% url 'report_comment' node.pk %}" class="call-to-action__nav-item-text call-to-action__nav-item-text--report {% if not article.allow_commenting %}call-to-action__nav-item-text--disabled{% endif %}">
                        {% trans "Report" %}
                      </a>
                    {% endif %}

                    {% if node.parent == None %}
                      <a href="{% url 'molo.commenting:molo-comments-reply' node.pk %}#comment-block" class="call-to-action__nav-item-text call-to-action__nav-item-text--response {% if not article.allow_commenting %}call-to-action__nav-item-text--disabled{% endif %}">
                        {% trans "Reply"%}</a>
                      {% if do_not_link_replies or node.get_children.count == 0 %}
                        <p class="call-to-action__nav-item-text call-to-action__nav-item--replies-counter {% if not article.allow_commenting %}call-to-action__nav-item-text--disabled{% endif %}">
                          {{ node.get_children.count }}
                          {% if node.get_children.count == 0 or node.get_children.count == 1 %}
                            {% trans "Reply" %}
                          {% else %}
                            {% trans "Replies" %}
                          {% endif %}
                        </p>
                      {% else %}
                        <a href="{% url 'molo.commenting:molo-comments-reply' node.pk %}#comment_reply" class="call-to-action__nav-item-text call-to-action__nav-item--replies-counter {% if not article.allow_commenting %}call-to-action__nav-item-text--disabled{% endif %}">
                          {{ node.get_children.count }}
                          {% if node.get_children.count == 0 or node.get_children.count == 1 %}
                            {% trans "Reply" %}
                          {% else %}
                            {% trans "Replies" %}
                          {% endif %}
                        </a>
                      {% endif %}
                    {% endif %}
                  </div>
                {% endif %}
              {% if node.parent == None and node.get_children.count != 0 %}
                <h3 class="comment__replies-title">{% trans "Recent Replies"%}</h3>
              {% endif %}
              </div>
              {{ children }}
            {% endrecursetree %}
          {% endfor %}
        </div>
        {% if comment_count > 2 %}
          <a href="{% url 'molo.commenting:more-comments' article.pk %}" class="call-to-action__nav-item--more" {{attribute}}>
            {% trans "Read more comments" %}
          </a>
        {% endif %}
      </div>
    {% endif %}
  {% endif %}
</div>
{% endif %}
