I creating this automatic infinite slider in React Js but it is not infinite. I am thinking that the best way to make it infinite is to move the first element to the end and make that in the setInterval in that way my array is always exchanging positions.

export const Slider = ({ images }) => {
    const [position, setPosition] = useState(0);

    useEffect(() => {
        const interval = setInterval(() => {
            setPosition(prev => prev + 0.1);
        }, 1000);
    }, []);

    const containerVar = {
        hidden: {
            x: 0,
        },
        show: {
            x: -250 * position,
            transition: { repeat: Infinity, duration: 2, ease: 'linear' },
        },
    };
    return (
        <Container
            as={motion.div}
            variants={containerVar}
            initial='hidden'
            animate='show'
        >
            {images.map(({ name, ...imagesData }) => (
                <CardClients key={name} name={name} {...imagesData} />
            ))}
        </Container>
    );
};