Why View within Switch-Case not working with functional component in react-native

const LoadingView = ({
    viewKey,
    style,
}: LoadingViewInterface) => {

Added below code to return View through switch-case condition,

    const SwitchCase = () => {
        if(viewKey === ViewKey.HOME_WORKSPACE) {
            <Card style={style}>
                <SkeletonBar width={'100%'} height={16} />
                <View style= {styles.space}/>
                <SkeletonBar width={'50%'} height={16} />
                <View style= {styles.space}/>
                <SkeletonBar width={'50%'} height={16} />
                <View style= {styles.space}/>
                <SkeletonBar width={'100%'} height={16} />
            </Card>
        } else if (viewKey === ViewKey.HOME_BOOKING) {
            return undefined;
        } else if (viewKey === ViewKey.HOME_MEETING) {
            return undefined;
        } else if (viewKey === ViewKey.HOME_TOOLS) {
            return undefined;
        }
    }
    return (
        SwitchCase
    );
};

const styles = StyleSheet.create({
    space: {
        height: 8,
    },
});

export default LoadingView;

If running the above code without switch-case then it works fine

const LoadingView = ({
viewKey,
style,

}: LoadingViewInterface) => { return ( <SkeletonBar width={'100%'} height={16} /> <SkeletonBar width={'50%'} height={16} /> <SkeletonBar width={'50%'} height={16} /> ); };

const styles = StyleSheet.create({ space: { height: 8, }, });

export default LoadingView;