React Navigation: Hide tabbar from a nested stack navigator

I want to know how can I hide the tabbar from a nested stack. I have tried the following solution:

const getTabBarVisibility = (route) => {
    console.log(route);
    const routeName = getFocusedRouteNameFromRoute(route) ?? "";
    if (routeName === routes.CHAT || routeName === routes.COMMENTS)
        return false;
    return true;
};

and also this one :

    React.useLayoutEffect(() => {
    const routeName =
        getFocusedRouteNameFromRoute(route) ?? routes.POST_DETAILS;
    if (routeName === routes.COMMENTS || routeName === routes.CHAT) {
        navigation.setOptions({ tabBarVisible: false });
    } else {
        navigation.setOptions({ tabBarVisible: true });
    }
}, [navigation, route]);

but they did not work when I have a stack navigator inside another one inside a TabNavigator. I have also checked the documentation and read that I should reorganize navigation. but I couldn't figure out how.

Here is how I organized my navigation

Drawer 

     TabBar :

         FeedNav

             PostsNav

                 PostDetailsScreen

                 commentScreen (Problem here)

                 MessagesScreen (Problem here)

            commentScreen
   
        InboxNav

            MessagesScreen (I can already hide it with the function above)

        and 3 other stack navs

So basically I would like to hide the tabbar from MessagesScreen and commentScreen