{% macro avatar(user) %}
  {% if user is empty %}
    <img src="{{ appScheme ~ '://' ~ appHost ~ asset('images/avatar.png') }}" class="avatar-image width="32" height="32" alt="Avatar"" />
  {% elseif user is not object %}
    <img src="{{ asset(user) }}" class="avatar-image" width="32" height="32" alt="Avatar" />
  {% else %}
    {% if user|default({photo: null}).photo %}
      <img src="{{ asset(user.photo) }}" class="avatar-image" width="32" height="32" alt="Avatar" />
    {% elseif user and user|trim != 'Unknown User' %}
      {% set initials = [] %}
      {% for word in user|trim|split(' ') %}
        {% set initials = initials|merge([word[:1]|upper]) %}
      {% endfor %}
      <table class="inline-table">
        <tr>
          <td class="avatar-initials"
            {% if user|default({color: null}).color is not empty %}
              style="background-color: {{ user.color }}"
            {% endif %}
          >
            {{ initials|slice(0, 2)|join('') }}
          </td>
        </tr>
      </table>
    {% else %}
      <img src="{{ appScheme ~ '://' ~ appHost ~ asset('images/avatar.png') }}" class="avatar-image" width="32" height="32" alt="Avatar" />
    {% endif %}
  {% endif %}
{% endmacro %}

{% macro displayAvatarText(user, text) %}
  <table class="inline-table avatar-text">
    <tr>
      <td class="avatar-wrapper">
        {{ _self.avatar(user) }}
      </td>
      <td>{{ text|raw }}</td>
    </tr>
  </table>
{% endmacro %}

{% macro displayCard(icon, creator, title, body, time = null) %}
  <table class="inline-table card">
    <tr>
      <td>
        <table class="inline-table avatar-text card-avatar-text">
          <tr>
            <td class="avatar-wrapper">
              {% if icon %}
                <div class="avatar-icon">{{ icon }}</div>
              {% else %}
                {{ _self.avatar(creator) }}
              {% endif %}
            </td>
            <td>
              {% if time is not empty %}
                <span class="card-time">{{ time }}</span>
              {% endif %}
              {{ title|raw }}
            </td>
          </tr>
        </table>
      </td>
    </tr>
    <tr>
      <td class="card-body">
        {% if body is not empty %}
          {{ body|render_html|raw }}
        {% else %}
          <span class="card-body-empty">&lt;no body&gt;</span>
        {% endif %}
      </td>
    </tr>
  </table>
{% endmacro %}

{% macro displayFile(file) %}
  <table class="inline-table file">
    <tr>
      <td>
        <table class="inline-table">
          <tr>
            <td class="file-image">
              <a href="{{ appScheme ~ '://' ~ appHost ~ '/download/file/' ~ file.id }}" target="_blank">
                {% if file.mimeType in ['image/png', 'image/gif', 'image/jpeg', 'image/jpg', 'image/heic'] %}
                  <img src="{{ file.url }}" width="170" height="170" alt="{{ file }}" />
                {% else %}
                  <div class="file-placeholder">
                    <img src="{{ appScheme ~ '://' ~ appHost ~ asset('images/file.png') }}" width="90" height="auto" alt="{{ file }}" />
                  </div>
                {% endif %}
              </a>
            </td>
          </tr>
          <tr>
            <td class="file-details">
              <a href="{{ appScheme ~ '://' ~ appHost ~ '/download/file/' ~ file.id }}" target="_blank">
                <div class="file-name">{{ file.name }}</div>
                <div class="file-size">{{ file.fileSize|filesize }}</div>
              </a>
            </td>
          </tr>
        </table>
      </td>
    </tr>
  </table>
{% endmacro %}

{% macro displayFiles(files) %}
  {% if files|length %}
    <table class="inline-table files">
      {% for file in files %}
        {% if loop.index0 is divisible by(3) %}
          <tr>
        {% endif %}

        <td class="file-column">
          {{ _self.displayFile(file) }}
        </td>

        {% if (loop.index0 + 1) is divisible by(3) or loop.last %}
          {# Close row and pad with empty cells if needed #}
          {% set remaining = 3 - ((loop.index0 + 1) % 3) %}
          {% if loop.last and remaining < 3 %}
            {% for i in 1..remaining %}
              <td style="width: 33.33%;"></td>
            {% endfor %}
          {% endif %}
          </tr>
        {% endif %}
      {% endfor %}
    </table>
  {% endif %}
{% endmacro %}

{% macro displayCommentBody(comment, includeFiles = false) %}
  <div class="comment">{{ comment.body|render_html|raw }}</div>

  {% if comment.poll|default(null) %}
    <table class="inline-table poll">
      <tr>
        <td>
          <p class="poll-question">{{ comment.poll }}</p>

          {% for option in comment.poll.options %}
            <div class="poll-option">
              <div>{{ option }}</div>
            </div>
          {% endfor %}
        </td>
      </tr>
    </table>
  {% endif %}

  {% if includeFiles and comment.files|default(null) %}
    {{ _self.displayFiles(comment.files) }}
  {% endif %}
{% endmacro %}

{% macro displayComment(comment) %}
  {{ _self.displayCard(
    null,
    comment.creator,
    comment.creator|default({name: 'Unknown User'}).name ~ ' added a comment',
    _self.displayCommentBody(comment, true)|trim,
    comment.createdAt|date(receiver.timeFormat|default('h:i A'))
  ) }}
{% endmacro %}