Как отследить событие скролла для поэкранной прокрутки?

Question

[Undefined User]

<div class="block home__block active">...</div>
<div class="block works__block">...</div>
<div class="block about__block">...</div>
<div class="block contact__block">...</div>
<div class="block hire__block">...</div>

<nav class="side__nav">

          <div class="side__nav__line"></div>

          <ul class="side__nav__items" id="side__nav">
            <li class="item active" id="item1">01 Home</li>
            <li class="item" id="item2">02 Works</li>
            <li class="item" id="item3">03 About</li>
            <li class="item" id="item4">04 Contact</li>
            <li class="item" id="item5">05 <span class="no__spacing">Hire us</span></li>
          </ul>

        </nav>

Есть вот такие блоки и навбар. переключение блоков осуществляется через навбар и скролл, это я уже сделал

const blocks = document.querySelectorAll('.block');
const items = document.querySelectorAll('.item');

let step = 0;

function scrollTo(delta) {
  for (let i = 0; i < blocks.length; i++) {
    const elem = blocks[i];
    const item = items[i];
    setTimeout(function() {
      elem.classList.remove('active');
    item.classList.remove('active');
    }, 150);
    if (i == delta) {
      setTimeout(function() {
        elem.classList.add('active');
      item.classList.add('active');
      }, 175);
    }
  }
};

document.addEventListener('wheel', (e) => {
  if (e.deltaY < 0) {
    step -= 1;
    if (step <= 0) { step = 0}
  }
  if (e.deltaY > 0) {
    step += 1;
    if (step >= 5) { step = 4 }

  }

  setTimeout(scrollTo(step), 175);
});

Он работает, да, но не учитываются нажатия по навбару, то есть если я сначала нажму на 3 item и захочу прокрутить страницу, то скролл начнется именно с первого блока. Пытался переделать сам и это даже работало, но скролл работал только вниз. Помогите переделать этот код, чтобы нажатия по навбару также учитывались