How to hide bottomTabNavigator in nested stack screen

I am attempting to hide my bottomStackNavigator on my UsersScreen and then from there show it onScroll.

  function BottomTabNavigator() {   //Some code//    return (<Tab.Navigator            initialRouteName="Users"            screenOptions={{                headerShown: false,                tabBarShowLabel: false,                tabBarStyle: {borderColor: '#DBDBDB', height: 88, paddingTop: 16},            }}>            {                bottomTabs.map((bottomTab) => {                        return (<Tab.Screen                                key={`screen-${bottomTab.title}`}                                name={bottomTab.title}                                component={bottomTab.componentName}                                options={{                                    unmountOnBlur: true,                                    tabBarIcon: (({focused}) => {                                        return !focused ?<Icon name={bottomTab.icon} size={32}/> :<View style={buttonShell}><Text style={buttonText}>{bottomTab.title}</Text></View>                                    })                                }}                            />                        )                    }                )            }</Tab.Navigator>    )}

I am mapping my screens and their corrosponding icon to my tabNavigator. Here is my users screen too for further context:

function Users() {const {headerText, interestText, interestShell, interestsLayout, aboutText, userImage} = styles;return (<View><ScrollView><View style={{flex: 1}}><ProfileButton/><Image style={userImage} source={mockUsers[0].pictures[0]}/><UserProfileInfo/></View><View><Text style={headerText}>About</Text><View style={{marginLeft: 32}}><Text style={aboutText}>                        {mockUsers[0].about}</Text></View><Text style={headerText}>Interests</Text><View style={interestsLayout}>                    {mockUsers[0].userInterests?.map((interest, index) => {                        return (<View style={interestShell}><Text key={`interest-${index}`} style={interestText}>{interest}</Text></View>                        )                    })}</View><Text style={headerText}>Questions and answers</Text><AnsweredQuestionInput/><AnsweredQuestionInput/><AnsweredQuestionInput/><Text style={headerText}>Pictures</Text><Pictures userPictures={mockUsers[0].pictures} blur={true}/></View></ScrollView><LikeAndDislike/></View>);

}

Please let me know if there is a way to say if scrollPositionY is 0 && route.name === 'Users' hide tabNavigator. So far I have tried to pass in the route and navigation to the screenOptions to access a tabBarVisible property however this has not worked. Any help to point me in the right direction would be great!