How to create login persistence on React Native app

Help
1

Hi all,

I am attempting to incorporate ChatKitty functionalities into my mobile app. I am using Firebase together with ChatKitty.

Currently, I am facing the problem of:

NoActiveSessionError {
  "error": "NoActiveSessionError",
  "message": "You're not connected to ChatKitty.",
}

which i suspect the user is logged out of ChatKitty after the app is closed. I am using firebase and user is logged out only if the app’s cache is cleared or triggered by the user.

  useEffect(() => {
		firebase.auth().onAuthStateChanged(async (user) => {
			if(!user) {
				/** if  user is not logged in*/
        setIsLoading(false)
				setIsLoggedIn(false)
			} else {
				/** if  user is logged in*/
				setIsLoading(false)
				setIsLoggedIn(true)
			};
		});
	}, []);

I would like to maintain this as I do not want to cause inconvenience to the users by always signing them out.

Is it possible to maintain connection to ChatKitty? Understand that a workaround is to store credentials for ChatKitty in AsyncStorage but also understand that it is not secured. Perhaps is there some session token that I can store to re-connect with ChatKitty and fetch chat info?

Any help is appreciated. Thanks in advance!

2

Hey @queries.eesee ! Welcome to ChatKitty community.

If you’re using Firebase, you can use pass the user’s firebase access token into startSession({ authParams: ... }) and check that in the User Attempted Start Session chat function

Like this

const googleCredential = firebase.auth.GoogleAuthProvider.credential(idToken, accessToken);

await firebase.auth().signInWithCredential(googleCredential);
3

Hello there, I need to log into a home screen but I can’t log into it according to the code you provided me, what is the probable reason? I am newbie and I need your support.

here is the code

import React, { createContext, useState } from “react”;
import {
createUserWithEmailAndPassword,
updateProfile,
signInWithEmailAndPassword,
} from “firebase/auth/react-native”;
import { auth } from “…/firebase”;
import { chatkitty } from “…/chatkitty”;

export const AuthContext = createContext({});

export const AuthProvider = ({ children }) => {
const [user, setUser] = useState(null);
const [loading, setLoading] = useState(false);

return (
<AuthContext.Provider
value={{
user,
setUser,
loading,
setLoading,
login: async (email, password) => {
setLoading(true);

      try {
        const userCredential = await signInWithEmailAndPassword(
          auth,
          email,
          password
        );

        // Signed-in Firebase user

        const currentUser = userCredential.user;

        const result = await chatkitty.startSession({
          username: currentUser.uid,
          authParams: {
            idToken: await currentUser.getIdToken(),
          },
        });

        if (result.failed) {
          console.log("could not login");
        }
      } catch (error) {
        console.error(error);
      } finally {
        setLoading(false);
      }
    },

    register: async (displayName, email, password) => {
      setLoading(true);

      try {
        const userCredential = await createUserWithEmailAndPassword(
          auth,
          email,
          password
        );

        await updateProfile(auth.currentUser, {
          displayName: displayName,
        });

        // Signed-in Firebase user
        const currentUser = userCredential.user;

        const startSessionResult = await chatkitty.startSession({
          username: currentUser.uid,
          authParams: {
            idToken: await currentUser.getIdToken(),
          },
        });

        if (startSessionResult.failed) {
          console.log("Could not sign up");
        }
      } catch (error) {
        console.error(error);
      } finally {
        setLoading(false);
      }
    },
    logout: async () => {
      try {
        await chatkitty.endSession();
      } catch (error) {
        console.error(error);
      }
    },
  }}
>
  {children}
</AuthContext.Provider>

);
};