Paginator Raw Logic

pagination.js

const offsetLeft = 2
const offsetRight = 2
const maxPageCount = 5

const getPages = (totalRecords, pageSize, currentPage) => {
  const totalPages = Math.ceil(totalRecords / pageSize)

  if (totalPages <= maxPageCount) {
    return [...Array(totalPages).keys()]
  }

  const firstPage = 0
  const lastPage = totalPages - 1

  const rawPages = []

  for (const page of [...Array(offsetLeft).keys()]) {
    const leftPageToAdd = currentPage - offsetLeft + page
    if (leftPageToAdd > 0 && leftPageToAdd < lastPage && leftPageToAdd < currentPage) {
      rawPages.push(currentPage - offsetLeft + page)
    }
  }

  if (currentPage !== firstPage && currentPage !== lastPage) {
    rawPages.push(currentPage)
  }

  for (const page of [...Array(offsetRight).keys()].reverse()) {
    const rightPageToAdd = currentPage + offsetRight - page
    if (rightPageToAdd > currentPage && rightPageToAdd < lastPage) {
      rawPages.push(currentPage + offsetRight - page)
    }
  }

  const pages = rawPages.filter(page => page >= 0 && page < totalPages)

  if (pages[0] > (firstPage + 1)) {
    pages.unshift('...')
  }

  if (pages[pages.length - 1] < (lastPage - 1)) {
    pages.push('...')
  }

  const processedPages = [firstPage, ...pages, lastPage]

  return processedPages
}

console.log(getPages(1, 1, 0)) // [0]
console.log(getPages(2, 1, 0)) // [0, 1]
console.log(getPages(3, 1, 0)) // [0, 1, 2]
console.log(getPages(6, 1, 0)) // [0, 1, 2, '...', 5]
console.log(getPages(10, 1, 0)) // [0, 1, 2, '...', 9]
console.log(getPages(10, 1, 1)) // [0, 1, 2, 3, '...', 9]
console.log(getPages(10, 1, 2)) // [0, 1, 2, 3, 4, '...', 9]
console.log(getPages(10, 1, 5)) // [0, '...', 3, 4, 5, 6, 7, '...', 9]
console.log(getPages(10, 1, 7)) // [0, '...', 5, 6, 7, 8, 9]
console.log(getPages(10, 1, 8)) // [0, '...', 6, 7, 8, 9]
console.log(getPages(10, 1, 9)) // [0, '...', 7, 8, 9]

pagination_v2.js

const leftOffset = 2;
const rightOffset = 2;
const minPageCount = 5;

function getPages(totalRecords, pageSize, currentPage) {
  const totalPages = Math.ceil(totalRecords / pageSize);
  const pages = [];

  if (totalPages <= minPageCount) {
    for (let i = 0; i < totalPages; i++) pages.push(i);
    return pages;
  }

  pages.push(0);

  let start = Math.max(1, currentPage - leftOffset);
  let end = Math.min(totalPages - 2, currentPage + rightOffset);

  if (start > 1) pages.push("...");

  for (let i = start; i <= end; i++) pages.push(i);

  if (end < totalPages - 2) pages.push("...");

  if (totalPages > 1) pages.push(totalPages - 1);

  return pages;
}

console.log(getPages(1, 1, 0)); // [0]
console.log(getPages(2, 1, 0)); // [0, 1]
console.log(getPages(3, 1, 0)); // [0, 1, 2]
console.log(getPages(6, 1, 0)); // [0, 1, 2, '...', 5]
console.log(getPages(10, 1, 0)); // [0, 1, 2, '...', 9]
console.log(getPages(10, 1, 1)); // [0, 1, 2, 3, '...', 9]
console.log(getPages(10, 1, 2)); // [0, 1, 2, 3, 4, '...', 9]
console.log(getPages(10, 1, 5)); // [0, '...', 3, 4, 5, 6, 7, '...', 9]
console.log(getPages(10, 1, 7)); // [0, '...', 5, 6, 7, 8, 9]
console.log(getPages(10, 1, 8)); // [0, '...', 6, 7, 8, 9]
console.log(getPages(10, 1, 9)); // [0, '...', 7, 8, 9]