basic log in mechanism

packages/desktop/src/providers/AuthProvider.tsx

@@ -1,6 +1,6 @@
 import { Credentials } from 'google-auth-library/build/src/auth/credentials';
 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 { blueGrey } from '@mui/material/colors';
@@ -11,6 +11,7 @@ import {
   signInWithCredential,
   setPersistence,
   browserLocalPersistence,
+  User as FirebaseUser,
 } from 'firebase/auth';
 import { useSnackbar } from 'notistack';
 
@@ -19,7 +20,7 @@ const provider = new GoogleAuthProvider();
 provider.addScope('https://www.googleapis.com/auth/contacts.readonly');
 
 interface IAuthContext {
-  user?: any;
+  user?: FirebaseUser;
 }
 
 const AuthContext = React.createContext<IAuthContext>({});
@@ -38,30 +39,17 @@ export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
         setPersistence(firebaseAuth, browserLocalPersistence)
           .then(() => {
             // Sign in with credential from the Google user.
-            return signInWithCredential(firebaseAuth, credential)
-              .then((result) => {
-                // This gives you a Google Access Token. You can use it to access Google APIs.
-                const credential = GoogleAuthProvider.credentialFromResult(result);
-                const token = credential.accessToken;
+            return signInWithCredential(firebaseAuth, credential).then((result) => {
+              // This gives you a Google Access Token. You can use it to access Google APIs.
+              const credential = GoogleAuthProvider.credentialFromResult(result);
+              const token = credential.accessToken;
 
-                // The signed-in user info.
-                const user = result.user;
-                console.log(user);
+              // The signed-in user info.
+              const user = result.user;
+              console.log(user);
 
-                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' });
-              });
+              enqueueSnackbar('Signed in! All set!', { variant: 'success' });
+            });
           })
           .catch((error: any) => {
             // Handle Errors here.
@@ -79,11 +67,13 @@ export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
     );
 
     return () => tokenListener();
-  }, []);
+  }, [enqueueSnackbar]);
 
-  return <Login />;
-
-  return <AuthContext.Provider value={{}}>{children}</AuthContext.Provider>;
+  return (
+    <AuthContext.Provider value={{ user: firebaseAuth.currentUser }}>
+      {firebaseAuth.currentUser ? <>{children}</> : <Login />}
+    </AuthContext.Provider>
+  );
 };
 
 const Login = () => {