@if (totalPages > 1) {
  <div class="flex items-center justify-center gap-3 p-4">
    <button
      pButton
      icon="pi pi-angle-right"
      size="small"
      severity="secondary"
      outlined
      [disabled]="loading || currentPage === 1"
      (click)="prevPage()"></button>
    @for (page of pagesToShow(); track page) {
      <p-button
        [label]="page.toString()"
        size="small"
        [severity]="page === currentPage ? 'primary' : 'secondary'"
        [outlined]="page !== currentPage"
        [disabled]="loading || page === currentPage"
        (click)="onPageChange(page)"></p-button>
    }
    <button
      pButton
      icon="pi pi-angle-left"
      size="small"
      severity="secondary"
      outlined
      [disabled]="loading || currentPage >= totalPages"
      (click)="nextPage()"></button>
  </div>
}