Cannot redirect to a specific screen after a successful login.
Hey. I am trying to redirect to the home screen after a successful login attempt. I have implemented deep linking as well. But as soon as the login request completes, the in-app browser closes and I return back to the login screen. The expected behavior here should be to redirect to the home screen. Take a look at the code:
import { ReactNativeKeycloakProvider } from "@react-keycloak/native";
import { SafeAreaView } from "react-native";
import Navigation from "./core/navigation";
import { NavigationContainer } from "@react-navigation/native";
import keycloak from "./keycloak";
import "./utility/i18n";
export default function App() {
const linking = {
prefixes: ["mynexi://"],
config: {
screens: {
HomeScreen: "home",
},
},
};
return (
<ReactNativeKeycloakProvider
authClient={keycloak}
initOptions={{
redirectUri: "mynexi://home",
inAppBrowserOptions: {
modalPresentationStyle: "fullScreen",
enableBarCollapsing: false,
modalEnabled: true,
ephemeralWebSession: true,
dismissButtonStyle: "ok",
},
}}
isLoadingCheck={(keycloak) => !keycloak.authenticated}
onEvent={(event, error) => {
console.log("onKeycloakEvent", event, error);
}}
onTokens={(tokens) => console.log(tokens)}
>
<NavigationContainer linking={linking}>
<SafeAreaView style={{ flex: 1 }}>
<Navigation />
</SafeAreaView>
</NavigationContainer>
</ReactNativeKeycloakProvider>
);
}
The Navigation component is like this:
<Stack.Navigator initialRouteName="SplashScreen">
<Stack.Screen
name="Login"
component={Login}
options={{ headerShown: false }}
/>
<Stack.Screen
name="HomeScreen"
component={MyTabs}
options={{ headerShown: false }}
/>
</Stack.Navigator
Here's how I call the login function:
const { keycloak, initialized } = useKeycloak();
const navigation = useNavigation();
const handleLogin = async () => {
try {
await keycloak.login();
} catch (error) {
console.log(error);
}
};
useEffect(() => {
// console.log(keycloak);
if (keycloak?.token || keycloak?.authenticated) {
navigation.navigate("HomeScreen");
}
}, [keycloak]);
In my case, after successful login in-app-browser is just closed and I am on the same screen I was before, although I specified different screen in redirectUri. Deeplinking is working, i tested it through console and browser.
Have you found a solution @HammadAhm3d ?