{#
/**
 * @file
 * Default theme override for comment fields.
 *
 * Available variables:
 * - attributes: HTML attributes for the containing element.
 * - label_hidden: Whether to show the field label or not.
 * - title_attributes: HTML attributes for the title.
 * - label: The label for the field.
 * - title_prefix: Additional output populated by modules, intended to be
 *   displayed in front of the main title tag that appears in the template.
 * - title_suffix: Additional title output populated by modules, intended to
 *   be displayed after the main title tag that appears in the template.
 * - comments: List of comments rendered through comment.html.twig.
 * - content_attributes: HTML attributes for the form title.
 * - comment_form: The 'Add new comment' form.
 * - comment_display_mode: Is the comments are threaded.
 * - comment_type: The comment type bundle ID for the comment field.
 * - entity_type: The entity type to which the field belongs.
 * - field_name: The name of the field.
 * - field_type: The type of the field.
 * - label_display: The display settings for the label.
 *
 * @see comment_preprocess_field()
 */
#}
{{ attach_library('socialbase/comment')}}
{{ attach_library('socialbase/pagination') }}

{# extra condition to make sure the card is not shown when there are no comments and comments are closed #}
{% if (comment_count > 0) or (comment_form and comment_open) %}

  <a id="section-comments"></a>
  <section{{ attributes }}>

    {% if not label_hidden %}
      {{ title_prefix }}
      {# extra condition to add the count when Ajax is used see src/Plugin/Preprocess/Field.php #}
      {% if comment_count is not empty and comment_count > 0 %}
        <h4{{ title_attributes.addClass('section-title') }}>{{ label }} ({{ comment_count }})</h4>
      {% else %}
        <h4{{ title_attributes.addClass('section-title') }}>{{ label }}</h4>
      {% endif %}
      {{ title_suffix }}
    {% endif %}

    <div class="card">
      <div class="card__block card__comment_section">

        {{ comments }}

        {% if comment_form %}
          {{ comment_form }}
        {% endif %}

      </div>
    </div>

  </section>

{% endif %}
