Using DrawerNavigator alongside stack navigation on react native

i'm currently using a stack Navigation on my app, but i want to add a Drawer menu to it.When i try to add i get a conflict issue with the current Navigation Container on my app.

Where shoud i put the Drawer? On my App.tsx, in my routes.ts? or use it like a component?

Here is my app.tsx:

export default function App() {    const [fontsLoaded] = useFonts({        Comfortaa_300Light,        Comfortaa_400Regular,        Comfortaa_500Medium,        Comfortaa_600SemiBold,        Comfortaa_700Bold,    });    if (!fontsLoaded) {        return null;    }    return (<Routes/>    );}

I inserted the Drawer like this:

export default function App() {    const [fontsLoaded] = useFonts({        Comfortaa_300Light,        Comfortaa_400Regular,        Comfortaa_500Medium,        Comfortaa_600SemiBold,        Comfortaa_700Bold,    });    if (!fontsLoaded) {        return null;    }    const Drawer = createDrawerNavigator();    function CustomDrawerContent(props) {        return (<DrawerContentScrollView {...props}><DrawerItemList {...props} /><DrawerItem                    label="Close drawer"                    onPress={() => props.navigation.closeDrawer()}                /><DrawerItem                    label="Toggle drawer"                    onPress={() => props.navigation.toggleDrawer()}                /></DrawerContentScrollView>        );    }    function MyDrawer() {        const Drawer = createDrawerNavigator();        return (<Drawer.Navigator drawerContent={props => <CustomDrawerContent {...props} />}><Drawer.Screen name="Home" component={Welcome}/><Drawer.Screen name="Map" component={IncidentsMap}/><Drawer.Screen name="CreateIncident" component={SelectIncidentLocation}/></Drawer.Navigator>        );    }    return (        /*<Routes/>*/<NavigationContainer><MyDrawer/></NavigationContainer>    );}

Here is my Routes file:

export default function Routes() {    return(<NavigationContainer><Navigator screenOptions={{headerShown: false}}>                {/*<Screen name="GetLocationTest" component={GetLocationTest}/>*/}<Screen name="WelcomePage" component={WelcomePage}/><Screen name="WelcomePageStep2" component={WelcomePageStep2}/><Screen name="IncidentsMap" component={IncidentsMap}/><Screen name="IncidentDetails"                        component={IncidentDetails}                        options={{                            headerShown: true,                            header: () => <Header showCancel={false} title="Incidente"/>                        }}                /><Screen name="SelectIncidentLocation" component={SelectIncidentLocation}                        options={{                            headerShown: true,                            header: () => <Header title="Selecione no Mapa" showCancel={false}/>                        }}                /><Screen name="IncidentData" component={IncidentData}/></Navigator></NavigationContainer>    )}

I managed to insert the Drawer in my App.tsx but i have some conflicts when i try to use the navigation in a button, i recieve The action 'NAVIGATE' with payload was not handled by any navigator. .Is there a way that i can insert the drawer menu and still be able to use my current navigation system?