I am using @react-navigation/native in my application and I am trying to reset the stack when logging out.

Here is the code I call to reset

    navigation.dispatch(
        CommonActions.reset(
          {
            index: 0,
            routes: [{name: 'LoginStack'}]
          }
        )
      )

Here is my navigator

     <NavigationContainer ref={navigationRef}>
      <AppStack.Navigator initialRouteName="LoginStack">
        <AppStack.Screen
          name="LoginStack"
          component={LoginStackNavigation}
          options={{ headerShown: false, gestureEnabled: false }}
        />
        <AppStack.Screen
          name="MainStack"
          component={MainStack}
          options={{ headerShown: false, gestureEnabled: false }}
        />
      </AppStack.Navigator>
    </NavigationContainer>

And a sample of my LoginStack

    export function LoginStackNavigation() {
    return (
      <LoginStack.Navigator initialRouteName="Main">
        <Stack.Screen name="Main" component={MainScreen} options={{headerShown: false}}/>
        <Stack.Screen name="Register" component={RegisterScreen} options={{headerShown: false}}/>
    ...

When I click to log out it doesn’t reset the stack. Any thoughts on what would cause this?