React loop component

loop.jsx

import react, {useEffect, useState} from 'react';

function Looper() {

    const [number, setNumber] = useState(0);
    
    useEffect(() => {
        let newNumber = 0;
        const interval = setInterval(() => {

            if(newNumber == 3) {
                newNumber = 0;
            } else {
                newNumber += 1;
            }
            setNumber(newNumber);
        }, 1000);

        return () => {
            clearInterval(interval);
        }
    }, []);

    return (<>
        <DisplayThingies number={number}/>
    </>);
}

export default Looper

const DisplayThingies = ({number}) => {

    return (<>
        {number}
        {number == 3 ? 'true' : 'false'}
    </>)
}