<div class="infoItem" *ngIf="transaction">
  <img src="assets/img/coins/ico_check.png" alt="coinAvatar" *ngIf="transaction.detail.includes('Recarga')">
  <img src="assets/img/coins/ico_cancelled.png" alt="coinAvatar" *ngIf="transaction.detail.includes('Descuento')">
  <img src="assets/img/coins/ico_credit.png" alt="coinAvatar" *ngIf="transaction.detail.includes('cupo')">
  <img src="assets/img/coins/ico_ticket.png" alt="coinAvatar" *ngIf="transaction.detail.includes('boleta')">
  <img src="assets/img/coins/ico_store.png" alt="coinAvatar" *ngIf="transaction.detail.includes('producto')">
  <div class="infoContainer">
    <p class="infoTitle">{{ transaction.created_at | date : 'MMMM d, yyyy, h:mm a' }}</p>
    <p class="infoSubTitle">REF: {{ transaction.reference }}</p>
    <p class="infoSubTitle">DETALLE: {{ transaction.detail }}</p>
  </div>
  <div>
    <app-coin-info [coins]="transaction.coins" [sign]="transaction.sign"></app-coin-info>
  </div>
</div>