React Native: How do you implement navigation guards in React Native?

1import { NavigationContainer } from "@react-navigation/native";
2
3function AuthStack() {
4  const { user } = useAuth();
5
6  return (
7    <Stack.Navigator>
8      {user ? (
9        <>
10          <Stack.Screen name="Home" component={HomeScreen} />
11          <Stack.Screen name="Profile" component={ProfileScreen} />
12        </>
13      ) : (
14        <>
15          <Stack.Screen name="Login" component={LoginScreen} />
16          <Stack.Screen name="Register" component={RegisterScreen} />
17        </>
18      )}
19    </Stack.Navigator>
20  );
21}

1useBeforeRemoveEvent((e) => {
2  if (!canGoBack) {
3    e.preventDefault();
4    showAlert();
5  }
6});