How to nest only one stack page within a drawer component?

Question

I'm new to react-native and I'm trying to add a feature to my navigation. Basically I would like it when you click on a drawer item it would stack a new page accompanied by a back button. I've searched everywhere to try and figure it out but couldn't find an answer.

The feature is used in an app in the images below.

The arrow next to 'Dublin Bikes' is used for closing drawer menu (not a stack arrow).

After the drawer is opened and you pick either "Settings" or "My Account" a single page is stacked.

It's pretty much using the drawer item as a button to call a stack.

Is there a good way to do this? All I have found is to rebuild the drawer and add them as buttons. That didn't seem right.

Any help would be great. Thanks a lot.

Answer 1

when you click on a drawer item it would stack a new page accompanied by a back button,

what i understood is when you click on drawer button on home screen it should navigate to new screen with back button and not the one currently showing,

i feel for this feature, instead for drawer you can have a custom drawer open button on the header and when you click on that it will navigate ( navigation.navigate("newpage") ) to you new page accompanied by a back button