Change ad banner for react native application

Question

I have an advertising banner at the bottom of the main page of the application! I want to change it on a timer to another banner!

Some Screen:

function SomeScreen() {

    return (
        <View>
            ...

            <MyBanner></MyBanner>
        </View>
    )
}

Banner Component:

const adUnitIds = ['ca-app-pub-eeeeeeee/rrrrrrrr', 'ca-app-pub-ffffff/ggggggggg', 'ca-app-pub-yyyyyyyyy/xxxxxxxxx']


let activeNum = 0

function MyBanner({}) {

    const [activeAdUnitId, setActiveAdUnitId] = useState(adUnitIds[0])

    useEffect( () => {

        const interval = setInterval( () => {
            activeNum = activeNum === adUnitIds.length - 1 ? 0 : activeNum + 1
            setActiveAdUnitId(adUnitIds[activeNum])
        }, 20000)

        return () => {
            clearInterval(interval)
        }

    }, [])

    return (
        <View>
            <BannerAd 
                unitId={activeAdUnitId}
                size={BannerAdSize.ANCHORED_ADAPTIVE_BANNER }
                requestOptions={{
                    requestNonPersonalizedAdsOnly: true
                }}

            />
        </View>
    )
}

It works, but would like to know about best practices! How good is this solution?