React native portrait landscape view

import { useEffect, useState } from "react";
import { StyleSheet, View } from "react-native";
import Orientation from "react-native-orientation-locker";
import LandscapeMobileView from "./LandscapeMobileView";
import PortraitMobileView from "./PortraitMobileView";
const Video=()=>{

    const [status, setStatus]=useState({
        layout: "portrait",        
    });

   
    useEffect(()=>{
        Orientation.addOrientationListener(handleOrientation);
        return ()=>{
            Orientation.removeOrientationListener(handleOrientation);
        }
    },[]);

    function handleOrientation(orientation) {  
        console.log(orientation);     
        orientation === 'LANDSCAPE-LEFT'
        || orientation === 'LANDSCAPE-RIGHT'
        || orientation === 'UNKNOWN'
          ?  
            setStatus( prevStatus=>({
                ...prevStatus,                
                layout:"landscape"
            }) )
          :
          setStatus( prevStatus=>({
            ...prevStatus,            
            layout:"portrait"
        }) 
          )
      }

    const handleFullScreen=()=>{
        status.layout === "portrait"
        ? ( Orientation.lockToLandscapeLeft(),
        setStatus( prevStatus=>({
            ...prevStatus,
            layout:'landscape'
        }) )
        )
        :
        ( Orientation.lockToPortrait(), 
        setStatus( prevStatus=>({
            ...prevStatus,
            layout:'portrait'
        }) )
        )
    }

    return(

        <>
            <View>
                {
                status.layout == "portrait"
                ?
                <PortraitMobileView
                handleFullScreen={handleFullScreen}
                layout={status.layout}
                />
                :
                <LandscapeMobileView
                handleFullScreen={handleFullScreen}
                layout={status.layout}
                />
                }
            </View>
        </>
    )
}
export default Video;

import { Button, Text, View } from "react-native";
const LandscapeMobileView=({ handleFullScreen, layout })=>{
    return(
        <>
            <View>
                <Text>This is LandscapeMobileView</Text>
                <Button
                title={layout==="portrait" ? 'FullScreeb' : 'Reduce'}
                onPress={ handleFullScreen }
                />
            </View>
        </>
    )
}
export default LandscapeMobileView;

import { Button, Text, View } from "react-native";
let PortraitMobileView=({ handleFullScreen, layout })=>{
    return(
        <>
            <View>
                <Text>This is PortraitMobileView</Text>
                <Button
                title={layout==="portrait" ? 'FullScreeb' : 'Reduce'}
                onPress={ handleFullScreen }
                />
            </View>        
        </>
    )
}
export default PortraitMobileView;