basic log in mechanism
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
import { Credentials } from 'google-auth-library/build/src/auth/credentials';
|
import { Credentials } from 'google-auth-library/build/src/auth/credentials';
|
||||||
import { Button, Container } from '@mui/material';
|
import { Button, Container } from '@mui/material';
|
||||||
import React, { useContext, useEffect, useCallback } from 'react';
|
import React, { useContext, useEffect, useCallback, useState } from 'react';
|
||||||
|
|
||||||
import { FcGoogle } from 'react-icons/fc';
|
import { FcGoogle } from 'react-icons/fc';
|
||||||
import { blueGrey } from '@mui/material/colors';
|
import { blueGrey } from '@mui/material/colors';
|
||||||
@@ -11,6 +11,7 @@ import {
|
|||||||
signInWithCredential,
|
signInWithCredential,
|
||||||
setPersistence,
|
setPersistence,
|
||||||
browserLocalPersistence,
|
browserLocalPersistence,
|
||||||
|
User as FirebaseUser,
|
||||||
} from 'firebase/auth';
|
} from 'firebase/auth';
|
||||||
import { useSnackbar } from 'notistack';
|
import { useSnackbar } from 'notistack';
|
||||||
|
|
||||||
@@ -19,7 +20,7 @@ const provider = new GoogleAuthProvider();
|
|||||||
provider.addScope('https://www.googleapis.com/auth/contacts.readonly');
|
provider.addScope('https://www.googleapis.com/auth/contacts.readonly');
|
||||||
|
|
||||||
interface IAuthContext {
|
interface IAuthContext {
|
||||||
user?: any;
|
user?: FirebaseUser;
|
||||||
}
|
}
|
||||||
|
|
||||||
const AuthContext = React.createContext<IAuthContext>({});
|
const AuthContext = React.createContext<IAuthContext>({});
|
||||||
@@ -38,30 +39,17 @@ export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
|
|||||||
setPersistence(firebaseAuth, browserLocalPersistence)
|
setPersistence(firebaseAuth, browserLocalPersistence)
|
||||||
.then(() => {
|
.then(() => {
|
||||||
// Sign in with credential from the Google user.
|
// Sign in with credential from the Google user.
|
||||||
return signInWithCredential(firebaseAuth, credential)
|
return signInWithCredential(firebaseAuth, credential).then((result) => {
|
||||||
.then((result) => {
|
// This gives you a Google Access Token. You can use it to access Google APIs.
|
||||||
// This gives you a Google Access Token. You can use it to access Google APIs.
|
const credential = GoogleAuthProvider.credentialFromResult(result);
|
||||||
const credential = GoogleAuthProvider.credentialFromResult(result);
|
const token = credential.accessToken;
|
||||||
const token = credential.accessToken;
|
|
||||||
|
|
||||||
// The signed-in user info.
|
// The signed-in user info.
|
||||||
const user = result.user;
|
const user = result.user;
|
||||||
console.log(user);
|
console.log(user);
|
||||||
|
|
||||||
enqueueSnackbar('Signed in! All set!', { variant: 'success' });
|
enqueueSnackbar('Signed in! All set!', { variant: 'success' });
|
||||||
})
|
});
|
||||||
.catch((error) => {
|
|
||||||
// Handle Errors here.
|
|
||||||
const errorCode = error.code;
|
|
||||||
const errorMessage = error.message;
|
|
||||||
// The email of the user's account used.
|
|
||||||
const email = error.email;
|
|
||||||
// The credential that was used.
|
|
||||||
const credential = GoogleAuthProvider.credentialFromError(error);
|
|
||||||
// ...
|
|
||||||
|
|
||||||
enqueueSnackbar('Something went wrong', { variant: 'error' });
|
|
||||||
});
|
|
||||||
})
|
})
|
||||||
.catch((error: any) => {
|
.catch((error: any) => {
|
||||||
// Handle Errors here.
|
// Handle Errors here.
|
||||||
@@ -79,11 +67,13 @@ export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
|
|||||||
);
|
);
|
||||||
|
|
||||||
return () => tokenListener();
|
return () => tokenListener();
|
||||||
}, []);
|
}, [enqueueSnackbar]);
|
||||||
|
|
||||||
return <Login />;
|
return (
|
||||||
|
<AuthContext.Provider value={{ user: firebaseAuth.currentUser }}>
|
||||||
return <AuthContext.Provider value={{}}>{children}</AuthContext.Provider>;
|
{firebaseAuth.currentUser ? <>{children}</> : <Login />}
|
||||||
|
</AuthContext.Provider>
|
||||||
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const Login = () => {
|
const Login = () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user