Pagination calculation

Question

I have written a function to get the actual page range to display that page range in pagination.

My function is working properly. But I think that I have written bad code. Can someone review my code and give me some feedback to improve my code?

Here is the code:

const pageRange = (() => {
  let startPage = activePage < pageNeighbours + 1 ? 1 : activePage - pageNeighbours;
  const endPage = totalPages < (pageNeighbours * 2) + startPage
    ? totalPages : (pageNeighbours * 2) + startPage;
  const diff = (startPage - endPage) + (pageNeighbours * 2);
  startPage -= (startPage - diff > 0 ? diff : 0);
  let actualPageRange = new Array((endPage - startPage) + 1)
    .fill().map((_, i) => i + startPage);
  if (actualPageRange[0] !== 1) actualPageRange = [1, ...actualPageRange];
  if (actualPageRange[1] !== 2) actualPageRange = [1, '...', ...actualPageRange.slice(1)];
  if (actualPageRange[actualPageRange.length - 1] !== totalPages) {
    actualPageRange = [...actualPageRange, totalPages];
  }
  if (actualPageRange[actualPageRange.length - 2] !== totalPages - 1) {
    actualPageRange = [...actualPageRange.slice(0, actualPageRange.length - 1), '...', totalPages];
  }
  return actualPageRange;
})();

In the above code:

activePage refers to the current page number.

pageNeighbours refers to the number of pages that should be shown besides active page

totalPages is self-explanatory

Update

After this function execution, I will use pageRange to create output like:

Answer 1

From a short review;

• You use globals instead of parameters for activePage and pageNeighbours
• You need at least one comment stating what pageNeighbours stands for, without knowing this the code looks meaningless to me
• You need at least one comment on the top explaining what the range is supposed to contain
• On the whole I think this could use more comments
• Why actualPageRange instead of simply pageRange, or even range since it would be clear from context what range we're reading about

Okay, so since the code does not work, expect this question to be closed. That doesn't mean that functionally this isn't a great question.

This is my approach to what I believe you are looking for:

const pageRange = ((activePage, pageNeighbours, totalPages) => {

  let range = [];
  //Add active page and neighbouring pages
  for(let page = activePage - pageNeighbours; page <= activePage + pageNeighbours; page++)
    range.push(page);
  //Make sure we dont show pages that dont exist
  range = range.filter(page=> page > 0 && page <= totalPages);
  //Allow user to go to the first page if need be
  //The second entry should be either 2 or ellipsis(...)
  if(range[0]!=1){
    if(range[1]!=2){
      range.unshift('...');
    }
    range.unshift(1);
  }
  //Allow user to go the last page, second last entry should be second last page or ellipsis
  if(range[range.length-1] != totalPages){
    if(range[range.length-2]!= totalPages-1){
      range.push('...');
    }  
    range.push(totalPages);
  }

  return range;
})(activePage, pageNeighbours, totalPages);

Note that this avoids accessing activePage etc. as a global.