<div class="chat-messages">
  <!-- MESSAGE -->
  <div
    *ngFor="let message of messages; let i = index"
    class="message-row"
    [ngClass]="{
      me: message.who === user.id,
      contact: message.who !== user.id,
      'first-of-group': isFirstMessageOfGroup(message, i),
      'last-of-group': isLastMessageOfGroup(message, i)
    }"
  >
    <img *ngIf="" src="" class="avatar" />

    <div class="bubble">
      <div class="message">{{ message.message }}</div>
      <div class="time secondary-text">{{ message.time | date: 'short' }}</div>
    </div>
  </div>
</div>
