{#
/**
 * @file
 * Theme override for comments.
 *
 * Available variables:
 * - author: (optional) Comment author. Can be a link or plain text.
 * - content: The content-related items for the comment display. Use
 *   {{ content }} to print them all, or print a subset such as
 *   {{ content.field_example }}. Use the following code to temporarily suppress
 *   the printing of a given child element:
 *   @code
 *   {{ content|without('field_example') }}
 *   @endcode
 * - created: (optional) Formatted date and time for when the comment was
 *   created. Preprocess functions can reformat it by calling
 *   DateFormatter::format() with the desired parameters on the
 *   'comment.created' variable.
 * - changed: (optional) Formatted date and time for when the comment was last
 *   changed. Preprocess functions can reformat it by calling
 *   DateFormatter::format() with the desired parameters on the
 *   'comment.changed' variable.
 * - permalink: Comment permalink.
 * - submitted: (optional) Submission information created from author and
 *   created during template_preprocess_comment().
 * - user_picture: (optional) The comment author's profile picture.
 * - status: Comment status. Possible values are:
 *   unpublished, published, or preview.
 * - title: (optional) Comment title, linked to the comment.
 * - attributes: HTML attributes for the containing element.
 *   The attributes.class may contain one or more of the following classes:
 *   - comment: The current template type; e.g., 'theming hook'.
 *   - by-anonymous: Comment by an unregistered user.
 *   - by-{entity-type}-author: Comment by the author of the parent entity,
 *     eg. by-node-author.
 *   - preview: When previewing a new or edited comment.
 *   The following applies only to viewers who are registered users:
 *   - unpublished: An unpublished comment visible only to administrators.
 * - 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 output populated by modules, intended to be
 *   displayed after the main title tag that appears in the template.
 * - content_attributes: List of classes for the styling of the comment content.
 * - title_attributes: Same as attributes, except applied to the main title
 *   tag that appears in the template.
 * - threaded: A flag indicating whether the comments are threaded or not.
 * - new: A text string indicating if the comment is new (only for logged-in users).
 * - new_indicator_timestamp: Unix timestamp of when the comment was created,
 *   only present for new comments.
 *
 * These variables are provided to give context about the parent comment (if
 * any, optional):
 * - parent_comment: Full parent comment entity (if any).
 * - parent_author: Equivalent to author for the parent comment.
 * - parent_created: Equivalent to created for the parent comment.
 * - parent_changed: Equivalent to changed for the parent comment.
 * - parent_title: Equivalent to title for the parent comment.
 * - parent_permalink: Equivalent to permalink for the parent comment.
 * - parent: A text string of parent comment submission information created from
 *   'parent_author' and 'parent_created' during template_preprocess_comment().
 *   This information is presented to help screen readers follow lengthy
 *   discussion threads. You can hide this from sighted users using the class
 *   visually-hidden.
 *
 * These two variables are provided for context:
 * - comment: Full comment object.
 * - commented_entity: Entity the comments are attached to.
 *
 * Solo theme additions:
 * - heading_first: Whether to display heading before author info.
 * - show_permalink: Whether to show the permalink.
 * - show_author: Whether to show the author name.
 * - show_date: Whether to show the comment date.
 * - show_picture: Whether to show the user picture.
 * - show_new_indicator: Whether to show the new comment indicator.
 * - formatted_date: The date formatted per theme settings.
 * - datetime: ISO 8601 formatted date for <time> element.
 * - title_id: Unique ID for the title for aria-labelledby.
 * - title_tag: The heading tag to use (h2-h6).
 *
 * @see template_preprocess_comment()
 * @see solo_preprocess_comment()
 */
#}

{% set classes = [
    'solo-clear',
    'comment',
    'js-comment',
    status != 'published' ? status,
    comment.owner.anonymous ? 'by-anonymous',
    author_id and author_id == commented_entity.getOwnerId() ? 'by-' ~ commented_entity.getEntityTypeId() ~ '-author',
    threaded ? 'comment--threaded',
    parent_comment ? 'comment--has-parent',
    heading_first ? 'comment--heading-first' : 'comment--heading-after',
  ]
%}

{# Set the title tag, default to h3 #}
{% set heading_tag = title_tag|default('h3') %}

{# Set base attributes #}
{% set comment_attributes = attributes
  .addClass(classes)
  .setAttribute('data-threaded', threaded ? 'true' : 'false')
  .setAttribute('data-changed', changed)
  .setAttribute('data-comment-id', comment.id())
  .setAttribute('data-drupal-selector', 'comment')
%}
{# Add parent ID only if exists #}
{% if parent_comment %}
  {% set comment_attributes = comment_attributes.setAttribute('data-parent-comment-id', parent_comment.id()) %}
{% endif %}
{# Add aria-labelledby if title exists #}
{% if title %}
  {% set comment_attributes = comment_attributes.setAttribute('aria-labelledby', title_id|default('comment-' ~ comment.id() ~ '-title')) %}
{% endif %}

<article{{ comment_attributes }}>

  {% if heading_first and title %}
    {# Accessible order: Heading first for screen reader navigation #}
    <div{{ content_attributes.addClass('comment__body') }}>
      {{ title_prefix }}
      <{{ heading_tag }} id="{{ title_id|default('comment-' ~ comment.id() ~ '-title') }}"{{ title_attributes.addClass('comment__title') }}>{{ title }}</{{ heading_tag }}>
      {{ title_suffix }}
    </div>
  {% endif %}

  {# Comment Header - Who said it and when #}
  <header class="comment__header">
    {% if show_picture|default(true) and user_picture %}
      <div class="comment__picture">
        {{ user_picture }}
      </div>
    {% endif %}

    <div class="comment__header-info">
      {% if show_author|default(true) %}
        <p class="comment__author">{{ author }}</p>
      {% endif %}

      {% if show_date|default(true) %}
        <time class="comment__time" datetime="{{ datetime|default(comment.created.value|date('c')) }}">
          {{- formatted_date|default(created) -}}
        </time>
      {% endif %}
    </div>

    {% if show_permalink|default(true) %}
      <div class="comment__permalink">
        {{ permalink }}
        {% include '@solo/partials/svg/_svg-link.html.twig' %}
      </div>
    {% endif %}

    {# New indicator - only rendered if comment is actually new and setting enabled #}
    {% if show_new_indicator|default(true) %}
      <mark class="new-comment hidden" data-comment-timestamp="{{ new_indicator_timestamp }}">
        <span class="new-comment__dot" aria-hidden="true"></span>
        <span class="new-comment__text">{{ 'New'|t }}</span>
      </mark>
    {% endif %}
  </header>

  {# Comment Body - What they said (content only) #}
  {% if not heading_first or not title %}
    {# Original order OR no title: show body section with optional title #}
    <div{{ content_attributes.addClass('comment__body') }}>
      {% if title and not heading_first %}
        {{ title_prefix }}
        <{{ heading_tag }} id="{{ title_id|default('comment-' ~ comment.id() ~ '-title') }}"{{ title_attributes.addClass('comment__title') }}>{{ title }}</{{ heading_tag }}>
        {{ title_suffix }}
      {% endif %}
      {{ content|without('links') }}
    </div>
  {% else %}
    {# Heading first mode with title: body content only (title already rendered) #}
    <div class="comment__content">
      {{ content|without('links') }}
    </div>
  {% endif %}

  {# Comment Footer - Actions and controls #}
  <footer class="comment__footer">
    <div class="comment__links">
      {{ content.links }}
    </div>
    {# Parent relationship for accessibility #}
    {% if parent %}
      <p class="parent visually-hidden">{{ parent }}</p>
    {% endif %}
  </footer>
</article>
