FloatingRadioBanner.tsx

FloatingRadioBanner.tsx

function FloatingRadioBanner() {
    const radioMediaType = useState(MediaType.None);
    const isLoading = useState(true) // Idk if None really matters

    useEffect(() => {
        // Setup mixhalo
        //
        // Set radioMediaType inside ths listeners
        //
        // Set isLoading to false once you've determined the radioMediaType
        //
        // Return cleanup function:
        // return () => listeners.remove()
    }, [])

    useEffect(() => {
       if (mediaControls.isRadioBannerVisible) {
            mediaConrols.setMediaType(radioMediaType)
       } 
    }, [mediaControls.isRadioBannerVisible, radioMediaType])

    if (!mediaControls.isRadioBannerVisible) {
        return null;
    } else if (isLoading) {
        return // version of radio banner with activity indicators
    } else if (radioMediaType === MediaType.LowLatency) {
        return <LowLatencyRadioBanner/>
    } else {
        return <HighLatencyRadioBanner/>
    }
}