@if (loading()) {
  <p class="event-list__message">Cargando eventos...</p>
} @else if (error()) {
  <p class="event-list__message" role="alert">No pudimos cargar los eventos.</p>
} @else if (results(); as page) {
  @if (page.data.length) {
    <div class="event-list__grid">
      @for (event of page.data; track event.id) {
        <app-event-card [event]="event" />
      }
    </div>
    @if (page.meta.last_page > 1) {
      <div class="event-list__pagination">
        <app-paginator [page]="page.meta.current_page" [totalPages]="page.meta.last_page" (pageChange)="changePage($event)" />
      </div>
    }
  } @else {
    <p class="event-list__message">{{ search() ? 'No encontramos eventos para tu búsqueda.' : 'No hay eventos disponibles en este momento.' }}</p>
  }
}