<div
  class="wrapper"
  *ngIf="!message.isDebug() && !isMessageEmpty()"
>
  <div
    class="avatar"
    [style.background-image]="avatarStyle"
  ></div>

  <div class="message">
    <div class="message-text">
      <p
        class="sender"
        *ngIf="sender || date"
      >
        {{ sender }}

        <time>{{ date | date: 'HH:mm:ss y/MM/dd' }}</time>

        <span
          *ngIf="applicationId"
          nbTooltip="Configuration"
        >
          [{{ getApplicationConfigurationName(applicationId) }}]</span
        >

        <button
          *ngIf="!reply"
          nbButton
          ghost
          size="tiny"
          class="ml-2"
          nbTooltip="Test this sentence in a dialog"
          (click)="testDialogSentence(message, applicationId, $event)"
        >
          <nb-icon icon="terminal-plus"></nb-icon>
        </button>
      </p>

      <div class="text">
        <tock-chat-ui-message-sentence
          *ngIf="message.isSentence()"
          [sentence]="$any(message)"
          [replay]="replay"
          [reply]="reply"
          (sendMessage)="replyMessage($event)"
        ></tock-chat-ui-message-sentence>

        <tock-chat-ui-message-sentence-footnotes
          *ngIf="message.isSentenceWithFootnotes()"
          [sentence]="$any(message)"
          [reply]="reply"
        ></tock-chat-ui-message-sentence-footnotes>

        <tock-chat-ui-message-choice
          *ngIf="message.isChoice()"
          [choice]="$any(message)"
          [replay]="true"
          [reply]="reply"
        ></tock-chat-ui-message-choice>

        <tock-chat-ui-message-attachment
          *ngIf="message.isAttachment()"
          [attachment]="$any(message)"
        ></tock-chat-ui-message-attachment>

        <tock-chat-ui-message-location
          *ngIf="message.isLocation()"
          [location]="$any(message)"
        ></tock-chat-ui-message-location>
      </div>
    </div>
  </div>
</div>

<tock-chat-ui-message-debug
  *ngIf="message.isDebug()"
  [message]="$any(message)"
></tock-chat-ui-message-debug>

<ng-content></ng-content>
