Reset Button and Pagination showing incorrect results

[studio22b]

Hi Patrick! Hoping to get some help for this. I have used MixItUp Multi Filtering and Pagination in a Webflow site. Everything else works great, but the reset button does not show all target elements. This link has 100 elements, but after clicking "Clear Filters", only 99 are displayed. Also, when I go to another page in the pagination, the total number goes down from 100 to 99. This is the custom code I have used for the site:

// Creating dynamic elements classes from its categories:
var catArray = document.querySelectorAll('.w-dyn-item .categ');
catArray.forEach( function(elem) {
    var text = elem.innerText || elem.innerContent;
    if (!text) { 
        var text = 'empty';
       }
    var conv = text.replace(/[!\"#$%&'\(\)\*\+,\.\/:;<=>\?\@\[\\\]\^`\{\|\}~]/g, '');
    var className = conv.toLowerCase()
                        .trim()
                        .replace (/ /g, "-");
    if (!isNaN(parseInt(className.charAt(0), 10))) {
              className = ("_" + className);
            }
    elem.parentElement.parentElement.classList.add(className);
    });
// Creating data attributes from People Affected and Land Area Affected:
var peopleArray = document.querySelectorAll('.w-dyn-item .people');
peopleArray.forEach( function(elem) {
    var peopleValue = elem.innerText || elem.innerContent;
     if (!peopleValue) { 
        var peopleValue = '0';
       }
    elem.parentElement.parentElement.setAttribute('data-people', peopleValue);
  });

var areaArray = document.querySelectorAll('.w-dyn-item .land');
areaArray.forEach( function(elem) {
    var areaValue = elem.innerText || elem.innerContent;
    if (!areaValue) { 
        var areaValue = '0';
       }
    elem.parentElement.parentElement.setAttribute('data-area', areaValue);
  });

// Creating data attributes from its categories:
var filterGroups = document.querySelectorAll('.filter-group');
filterGroups.forEach( function(group) {
        group.setAttribute('data-filter-group','');
  });

var minPeopleRangeInput = document.querySelector('[name="minPeople"]');
var maxPeopleRangeInput = document.querySelector('[name="maxPeople"]'); 
var minAreaRangeInput = document.querySelector('[name="minArea"]');
var maxAreaRangeInput = document.querySelector('[name="maxArea"]'); 
var containerEl = document.querySelector('.container');
var selectFilter = document.querySelector('.filter-select');
var mixer = mixitup(containerEl, {
    multifilter: {
         enable: true                 
    },
      pagination: {
      limit: 30
   },
   controls: {
        toggleDefault: 'all'
    }
});
selectFilter.addEventListener('change', function() {
    var selector = selectFilter.value;
    mixer.filter(selector);
});
function getRange() {
    var pMin = Number(minPeopleRangeInput.value);
    var pMax = Number(maxPeopleRangeInput.value);
    var aMin = Number(minAreaRangeInput.value);
    var aMax = Number(maxAreaRangeInput.value);
    return {
        pMin: pMin,
        pMax: pMax,
        aMin: aMin,
        aMax: aMax
    };
  }
 function handleRangeInputChange() {
    mixer.filter(mixer.getState().activeFilter);
  }

function filterTestResult(testResult, target) {
    var pople = Number(target.dom.el.getAttribute('data-people'));
        var area = Number(target.dom.el.getAttribute('data-area'));
    var range = getRange();
   if (pople < range.pMin || pople > range.pMax || area < range.aMin || area > range.aMax) 
       {
        testResult = false;
       }
      return testResult;
   }

minPeopleRangeInput.addEventListener('change', handleRangeInputChange);
maxPeopleRangeInput.addEventListener('change', handleRangeInputChange);
minAreaRangeInput.addEventListener('change', handleRangeInputChange);
maxAreaRangeInput.addEventListener('change', handleRangeInputChange);

Thank you! Aashna