Why the goBack function doesn't work? React Native

I am new in React Native, I am working on an app where I had to add a prefabricated header, which brings a button to which I want to set the option to go back with the function goBack of Navigation, however the button does not Nothing, also I tried with Navigation.navigate ('route'), but the issue continues. I would really appreciate it if you can help with this.

The code:

import { NavigationContainer, useNavigationState} from '@react-navigation/native';import { NavigationActions } from 'react-navigation';import { createStackNavigator } from '@react-navigation/stack';import { Toolbar } from 'react-native-material-ui';import * as React from 'react';import { Platform, StatusBar, StyleSheet, View, Text } from 'react-native';import BottomTabNavigator from '../../navigation/BottomTabNavigator';import LinkingConfiguration from '../../navigation/LinkingConfiguration';import CatHome from '../../screens/subScreens/CatHome';const Stack = createStackNavigator();export default function Navigator({navigation}) {  const SearchBar= ()=>{    //const { navigate } = this.props.navigation;    return(<Toolbar        leftElement= {backOption()}        onLeftElementPress= {()=>navigation.goBack()}        //isSearchActive= {true}        style={{          container: styles.searchBar,        }}        centerElement="DIRECTAPP"        searchable={{          autoFocus: true,          placeholder: 'Buscar',        }}        rightElement={{            menu: {                icon: "more-vert",                iconProps : {                  size: 30,                  color: 'gray',                },                labels: ["Locación", "Contáctanos"]            }                }}        onRightElementPress={ (label) => { console.log(label) }}      />    );  }  return (<View style={styles.container}>      {Platform.OS === 'ios'&& <StatusBar barStyle="dark-content" />}<NavigationContainer linking={LinkingConfiguration}><Stack.Navigator screenOptions={{          headerLeft: null,          headerTitle: props => <SearchBar {...props} />,          headerStyle: {            backgroundColor: '#9acd32',          }        }}><Stack.Screen name="Root" component={BottomTabNavigator} /><Stack.Screen name="CatHome" component={CatHome} /></Stack.Navigator></NavigationContainer></View>  );}function backOption (){  //const Route=useRoute();  const state = useNavigationState(state => state);  const routeName = (state.routeNames[state.index]);  //console.log(routeName);  if (routeName=='Root') {    return ''  }  else {    return 'arrow-back'  };}const styles = StyleSheet.create({    container: {      flex: 1,      backgroundColor: '#fff',    },    searchBar: {      backgroundColor: '#9acd32',      width: '100%',      shadowOffset:  { width: 1, height: 13},      shadowOpacity: 0.1,    }  });