react-nativereact-native-videoamazon-fire-tvamazon-appstorereact-native-tvos

TV App Amazon functionality validation fail due to video play in background in sleep mode in FireTV stick #520


I have submitted my react-native-tvos app to the Amazon store but they give below a functionality validation error.

I have used below version of tvos and React native video.

"react-native": "npm:react-native-tvos@0.69.8-1",
"react-native-video": "^5.2.1"

here is my code for video component.

      <Video
        ref={setPlayer}
        subtitle={true}
        source={{
          uri: configuration.url,
        }}
        title={title}
        subTitleText={subtitle}
        style={[styles.playerLoaded]}
        paused={pausedRef.current}
        onLoad={handleLoad}
        resizeMode={'contain'}
        rate={playerRate}
        onProgress={handleProgress}
        onError={onError}
        onLoadStart={onLoadStart}
        onSeek={handleSeek}
        onReadyForDisplay={onReadyForDisplay}
        onEnd={onEndVideo}
        playInBackground={false}
        playWhenInactive={false}
      />

here i attached screenshot of error given by amazon.

please help me to fix this issue. Thank you in advance.


Solution

  • It could be a bug in that specific version of the component. Anyway you can use the AppState to perform an action every time the app goes in background

    Example:

    
        import React, { useRef, useState, useEffect } from "react";
        import { AppState, Text, View } from "react-native";
            
        const AppInactiveHandleExample = () => {
            const appState = useRef(AppState.currentState);
            const [appStateVisible, setAppStateVisible] = useState(appState.current);
        
            useEffect(() => {
                AppState.addEventListener("change", handleAppStateChange);
                // Return for clear the cache of action
                return () => {
                    AppState.removeEventListener("change", handleAppStateChange);
                };
            }, []);
        
            const handleAppStateChange = nextAppState => {
            if (
                appState.current.match(/inactive|background/) &&
                nextAppState === "active"
            ) {
                // Resume the Video/Audio
                onAppInactive()
            }
                appState.current = nextAppState;
                setAppStateVisible(appState.current);
            };
        
            // Action executed when app was inactive or background
            const onAppInactive = () => {
                // Pause the Video/Audio
            }
        
            return (
            <View>
                <Text>Current state is: {appStateVisible}</Text>
            </View>
            );
        };
        
        export default AppInactiveHandleExample;