Функция выполняется лишь один раз

Хочу поменять изображение стрелки для слайдера когда он дойдет для конца, однако функции (leftArrow , rigtArrow) выполняются лишь раз. Как исправить ?

let [position, setPosition] = useState(-((noveltiesList.length / 2 - 1) * 350))

    const styleFromTrack = {
        transform: `translateX(${-((noveltiesList.length / 2 - 1) * 350)}px)`,
    };
    
    // прокрутка вправо
    const prevHandler = () => {
        if (position != 0) {
            position += 350;
            slider.current.childNodes.forEach((element) => {
                element.style = `transform: translateX(${position + 'px'})`
            })
        }
    };
     
    // прокрутка влево
    const nextHandler = () => {
        if (position != -(noveltiesList.length - 3) * 350) {
            position += -350;
            slider.current.childNodes.forEach((element) => {
                element.style = `transform: translateX(${position + 'px'})`
            })
        }
    };

    function leftArrow (){
        if (position == 0){
            return "../../../../img/arrows/arrowdisabled.svg" ;
        }else{
            return "../../../../img/arrows/arrow-2px-70.svg" ;
        }
    }

    function rigtArrow (){
        if (position == -(noveltiesList.length - 3) * 350){
            return "../../../../img/arrows/arrowdisabled.svg" ;
        }else{
            return "../../../../img/arrows/arrow-2px-70.svg" ;
        }
    }

    return (
        <>
            <div className="content">
                <div className={style.body}>
                    <h2 className={style.title}>
                        <span className="orange-letter">Н</span>овинки
                    </h2>

                    <div className={style.slider}>
                        <div className={style.slider__arrow}>
                            <button onClick={prevHandler} > 
                                // стрелка
                                <img src={leftArrow()}  alt="" />
                            </button>
                        </div>
                        <div className={style.slider__track} ref={slider} >
                            // блоки
                        </div>
                        <div className={style.slider__arrow}>
                            <button onClick={nextHandler}>
                                // стрелка
                                <img src={rigtArrow()}  alt="" />
                            </button>
                        </div>
                    </div>

                    <div className={style.button}>
                        <ButtonGoToCacalog />
                    </div>
                </div>
            </div>
        </>

Ответы (0 шт):