//- TODO 1. remove placeholders, 2. consider solving it with mixin?

mixin pager(currentPage = 1, id="pagination")
  .pager(id=id)
    button.first-page.me-3.no-bg-and-borders(disabled=currentPage === 1)
      img(src="/images/chevron-double-left.svg" alt="")
    button.previous-page.me-3.no-bg-and-borders(disabled=currentPage === 1)
      img(src="/images/chevron-left.svg" alt="")
    form.me-3.no-bg-and-border
      input.pager-input.me-1.text-gray-1(
        name="page"
        value=currentPage
        disabled=!numberOfAllPages || numberOfAllPages <= 1
      )
      span.me-1.text-gray-1= ' / '
      span.pages-total.text-gray-1= numberOfAllPages > 0 ? numberOfAllPages : 1
    button.next-page.me-3.no-bg-and-borders(
      disabled=!numberOfAllPages || currentPage >= numberOfAllPages
    )
      img(src="/images/chevron-right-2.svg" alt="")
    button.last-page.no-bg-and-borders(
      disabled=!numberOfAllPages || currentPage >= numberOfAllPages
    )
      img(src="/images/chevron-double-right.svg" alt="")