Skip to content
This repository has been archived by the owner on Mar 31, 2023. It is now read-only.

Login button loop #3

Open
Slayug opened this issue Nov 4, 2021 · 1 comment
Open

Login button loop #3

Slayug opened this issue Nov 4, 2021 · 1 comment
Labels
is checking Currently checking issue

Comments

@Slayug
Copy link

Slayug commented Nov 4, 2021

Hi,

I am trying to use the library so I implemented the code as following:

import React from "react";
import { ActivityIndicator } from "react-native-paper";
import TextInput from "../../components/core/TextInput";
import { View, Text } from "../../components/Themed";
import Button from "../../components/core/Button";

const keycloak = require("expo-keycloak-auth");

export const Auth = () => {
    const {
      ready, // If the discovery is already fetched and ready to prompt authentication flow
      login, // The login function - opens the browser
      isLoggedIn, // Helper boolean to use e.g. in your components down the tree
      token, // Access token, if available
      logout, // The logout function - Logs the user out
    } = keycloak.useKeycloak();
    if (!ready) return <ActivityIndicator />;

    if (!isLoggedIn)
      return (
        <View style={{ margin: 24 }}>
          <Button onPress={() => login()} title="Login" />
        </View>
      );
  
    return (
      <View style={{ margin: 24 }}>
        <Text style={{ fontSize: 17, marginBottom: 24 }}>Logged in!</Text>
        <Text>Your Access Token</Text>
        <TextInput value={token}></TextInput>
        <Button onPress={logout} title={"Logout"} style={{ marginTop: 24 }} />
      </View>
    );
  };

App.tsx


import AppConfig from "./app.json";
import { Auth } from "./screens/LoginScreen/Auth";
import { View } from "./components/Themed";
const keycloak = require("expo-keycloak-auth");
const queryClient = new QueryClient();
const keycloakConfiguration = {
  clientId: "myapp",
  realm: "myrealname", // your realm name
  url: "https://keycloak.*.com/auth", // This is usually a url ending with /auth
  scheme: AppConfig.expo.scheme,
};
const KeycloakProvider = keycloak.KeycloakProvider;

export default function App() {
  const isLoadingComplete = useCachedResources();

  const Stack = createStackNavigator();

  return (
    <NotifierWrapper>
      <ActionSheetProvider>
        <QueryClientProvider client={queryClient}>

    <KeycloakProvider {...keycloakConfiguration}>
      <View style={styles.container}>
        <Auth />
      </View>
    </KeycloakProvider>
        
        </QueryClientProvider>
      </ActionSheetProvider>
    </NotifierWrapper>
  );
}

But when I click on Login I have a new popup with a Login button, then when I click on the new Login button it continues to open me a popup with a Login button.
I do not have any error on the Javascript console.
realm, url are correct.

@rubhiauliatirta rubhiauliatirta added the is checking Currently checking issue label Nov 10, 2021
@MrCox007
Copy link

I think #4 should fix it :)

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
is checking Currently checking issue
Projects
None yet
Development

No branches or pull requests

3 participants