Почему не работает функция JS?

Question

[Evtera]

.then((value) => {
      const arrSlides = document.getElementsByClassName("slider__slide");

      // It count's index of arrSlides("slider__slide") per click ( we work with the array don't forget)
      let wrapperIndex = -1;

      // It count's index of div.img(value.length) per click  ( we work with the array don't forget)
      let valueIndex = -1;

      // click function. It's like a slider with lazy download because It's only change img src=URL and doesnt change the DOM
      const clickArrow = () => {
        // count + 1 per index of arrSlides erevery click
        wrapperIndex = wrapperIndex + 1;
        // count + 1 index of div.img per erevery click
        valueIndex = valueIndex + 1;


        // We have only 4 div.style.backgroundIMG = "URL"
        const checkDivLength = () => {
          if (wrapperIndex > slidesQuantity - 1) {
            return (wrapperIndex = 0);
          }
        };
        checkDivLength();

        // U can click more times than value.length. This function exclude this issue with empty slide and makes our slider infinity
        const checkValueLength = () => {
          if (valueIndex >= value.length) {
            return (valueIndex = 0);
          }
        };
        checkValueLength();

        const event = () => {
          arrSlides[wrapperIndex].style.backgroundImage =
            `url` +
            `${`(http://api.dev.cakeiteasy.no/api/store/images/${value[valueIndex]}/?size=small_url&compress_type=web)`}`;
        };
        event();
      };

      // It show's slides when user open web-page
      for (let index = 0; index < slidesQuantity; index++) {
        clickArrow();
      }

      const next = document
        .querySelector(".slider__arrow_next")
        .addEventListener("click", clickArrow);

      const arrowPrev = document
        .querySelector(".slider__arrow_prev")
        .addEventListener("click", clickArrow);
    });

Была идея создать слайдер. Он вроде работает, но не до конца. Картинки подгружаются через API к ним сразу создаётся DIV-оболочка. При клике на любую стрелку в следующий по индексу DIV подгружается картинки. Если DIV больше 4, но идёт сброс на ноль и цикл начинается снова. Здесь вопросы в следующем,
Как сделать так, чтобы вместе с кликом на стрелку передававалась функция, принимающая переменную ( - 1 ). Это бы решило проблему обратной перемотки. Потому что в данный момент у меня всё идет только вперед, а потом сбрасывается.