<ion-header>
  <ion-toolbar>
    <ion-buttons left>
      <button ion-button icon-only (tap)="closeChat($event)">
        <ion-icon name="arrow-back"></ion-icon>
      </button>
    </ion-buttons>
    <ion-title
      ><img
        class="title-profile-avatar"
        [src]="'/assets/' + this.profile.details.pic.thumb"
        height="24"
        width="24"
      />
      {{this.profile.details.name}}</ion-title
    >
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-list>
    <ion-item
      class="message-bubble"
      *ngFor="let message of this.profile.messages"
      [ngClass]="{ 'is-user': (message.isUser == true) }"
    >
      <img
        *ngIf="message.image"
        [src]="'/assets/' + message.image"
        (press)="showLightbox($event, message.image)"
      />
      <p *ngIf="message.text != ''">{{message.text}}</p>
    </ion-item>
  </ion-list>
</ion-content>

<ion-footer>
  <ion-toolbar> </ion-toolbar>
</ion-footer>
