Переключение между функциями в одном файле

Есть файл в котором 2 функции function News({ navigation }) {} function NewsDetail() {} как правильно сделать отображение второй функции по нажатию кнопки, а то нажимаю кнопку которая в 1 функции и ничего не происходит. На экране как был перечень новостей так и остается.

function News({ navigation })  {
    const [feed, setFeed] = React.useState(null)
    React.useEffect(()=> { 
        const getFeed = async() => {
            fetch('https://kbgau.ru/rss.php') //Запрос rss новостей с сайта
                .then((response)=>response.text())
                .then((responseData)=>rssParser.parse(responseData))
                .then((rss) => setFeed(rss))
        }
        getFeed(); 
    }, [])

    const customMenuIcon = ()=>{
        return(
            <TouchableOpacity onPress={()=>{navigation.toggleDrawer()}}>
                <Image style={{width:30,height:30}} source={require('./icon/menu.png')}/>        
            </TouchableOpacity>
        )
        };
    
    const customHomeIcon = ()=>{
        return(
            <TouchableOpacity onPress={()=>navigation.navigate(News)}>
                <Image style={{width:30,height:30}} source={require('./icon/home.png')}/>        
            </TouchableOpacity>
        )
        };

    return(
        <React.Fragment>
            <Header
            placement="left"
            leftComponent={()=>customMenuIcon()}
  centerComponent={{ text: 'Новости', style: { color: '#fff', fontSize:23 } }}
  rightComponent={()=>customHomeIcon()}
/>
            <View style={{flex: 1, alignItems: 'center'}}>
                <ScrollView>
                    {
                        feed ? feed.items.map((item, index) => (
                                <Card>
                                    <Card.Image key={item.enclosures[0].url} source={{uri:item.enclosures[0].url}}></Card.Image>
                                    <Card.Title key={item.title}>{item.title}</Card.Title>
                                    <Button onPress={()=>NewsDetail()} title="Подробнее"></Button>
                                </Card>
                        )) : <Text>Загрузка новостей...</Text>
                        }
                </ScrollView>
            </View>
        </React.Fragment>
    )
}

function NewsDetail(){
    
        return (
          <View><Text>Текст</Text></View>        
    )
    
}