<article class="review-card card">
  <header class="review-header">
    <app-stars [rating]="review.rating" size="sm" />
    <strong class="author">{{ review.author }}</strong>
    <span class="pill">{{ 'productDetails.verifiedPurchase' | translate }}</span>
    <time>{{ review.createdAt | date:'mediumDate' }}</time>
  </header>

  @if (review.title) {
    <h4>{{ review.title }}</h4>
  }

  <p>{{ review.text }}</p>

  <footer class="review-actions">
    <button type="button" disabled>{{ 'productDetails.like' | translate }} ({{ review.likes }})</button>
    <button type="button" disabled>{{ 'productDetails.dislike' | translate }} ({{ review.dislikes }})</button>
  </footer>
</article>
