react native auth provider effect not triggering for is authenticated check using firebase

Question

I'm creating a register screen for my app, and to do that, I created a OnAuth hook, to register the login/register and logout functionality, and also manage the is authenticated state as wel as the user.

interface authProperties {
  user: {user: any};
  isAuthenticated: boolean;
  register: (
    email: string,
    password: string,
    firstname: string,
    lastname: string,
  ) => Promise<any>;
  login: (email: string, password: string) => Promise<any>;
  logout: () => Promise<any>;
}

export const authContext = createContext<authProperties>({} as authProperties);

export const AuthProvider = ({children}: any) => {
  const [user, setUser] = useState<{user: any}>({user: null});
  const [isAuthenticated, setIsAuthenticated] = useState(false);

  useEffect(() => {
    const unsubscribe = onAuthStateChanged(auth, user => {
      console.log('AuthProvider effect triggered', user);
      if (user) {
        setIsAuthenticated(true);
        setUser({user});
      } else {
        setIsAuthenticated(false);
        setUser({user: null});
      }
    });

    return unsubscribe;
  }, []);

const login = async (email: string, password: string) => {
    // login logic
  };
  const register = async (
    email: string,
    password: string,
    firstname: string,
    lastname: string,
  ) => {
    // register logic
  };

  const logout = async () => {
    // logout logic
  }; 

  const value = {
    user,
    isAuthenticated,
    register,
    login,
    logout,
  };

  return <authContext.Provider value={value}>{children}</authContext.Provider>;
};

export const useAuth = () => {
  const value = useContext(authContext);

  if (!value) {
    throw new Error('useAuth must be used within an AuthProvider');
  }

  return value;
};

then in my App.tsx I'm setting a useEffect to trigger when isAuthenticated is changed.

const App = () => {
  // new auth state
  const {isAuthenticated} = useAuth();

  useEffect(() => {
    console.log('App useEffect triggered');
    if (isAuthenticated) {
      console.log('User is authenticated');
    } else {
      console.log('User is not authenticated');
    }
  }, [isAuthenticated]);

  return (
    <AuthProvider>
      {isAuthenticated ? (
        <TabNavigator />
      ) : (
        <SafeAreaProvider>
          <NavigationContainer>
            <Routes />
          </NavigationContainer>
        </SafeAreaProvider>
      )}
    </AuthProvider>
  );
};

export default App;

When I register a new user, the effect inside my authprovider is triggered correctly. I get logs, when entering, and when registering, I get the correct firebase user, token, etcetera.

however, I expected that the useEffect on isAuthenticated would be triggered too. Since here I want to have the logic to go to either a tabnavigator(when authenticated), or to the signing/signup (when not authenticated)

I'm relatively new to react native, and not sure why this effect is not triggered.

If anyone knows, it would be much appreciated!