From d2231b9c1f4ab0c6148c9632f3e7ec2ba10db1c8 Mon Sep 17 00:00:00 2001 From: dhyaneshsiddhartha15 Date: Sat, 18 May 2024 23:37:50 +0530 Subject: [PATCH 01/35] Firebase added --- frontend/package.json | 2 + frontend/src/Firebase/firebase-config.js | 27 ++++++ frontend/src/Pages/Landing-Page.jsx | 2 + frontend/src/Pages/Login.jsx | 107 +++++++++++++++++++++++ frontend/src/custom-hooks/UseAuth.js | 25 ++++++ 5 files changed, 163 insertions(+) create mode 100644 frontend/src/Firebase/firebase-config.js create mode 100644 frontend/src/Pages/Login.jsx create mode 100644 frontend/src/custom-hooks/UseAuth.js diff --git a/frontend/package.json b/frontend/package.json index f450de5..02779b8 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -11,9 +11,11 @@ "preview": "vite preview" }, "dependencies": { + "@chakra-ui/react": "^2.8.2", "@material-tailwind/react": "^2.1.9", "@remixicon/react": "^4.2.0", "express": "^4.19.2", + "firebase": "^10.12.0", "flowbite": "^2.3.0", "flowbite-react": "^0.9.0", "mongoose": "^8.3.5", diff --git a/frontend/src/Firebase/firebase-config.js b/frontend/src/Firebase/firebase-config.js new file mode 100644 index 0000000..e14bca1 --- /dev/null +++ b/frontend/src/Firebase/firebase-config.js @@ -0,0 +1,27 @@ +// Import the functions you need from the SDKs you need +import { getAuth, GoogleAuthProvider } from 'firebase/auth'; +import { getFirestore } from 'firebase/firestore'; +// Import the functions you need from the SDKs you need +import { initializeApp } from "firebase/app"; +import { getAnalytics } from "firebase/analytics"; +// TODO: Add SDKs for Firebase products that you want to use +// https://firebase.google.com/docs/web/setup#available-libraries + +// Your web app's Firebase configuration +// For Firebase JS SDK v7.20.0 and later, measurementId is optional +const firebaseConfig = { + apiKey: "AIzaSyDM3zqvyOeyXMOCDMfXWtl1yH7g6wdadh0", + authDomain: "awesome-griffin-421204.firebaseapp.com", + projectId: "awesome-griffin-421204", + storageBucket: "awesome-griffin-421204.appspot.com", + messagingSenderId: "133501638693", + appId: "1:133501638693:web:a452989f29cbfab903c7cc", + measurementId: "G-V7GPV4FVR5" +}; + +// Initialize Firebase +const app = initializeApp(firebaseConfig); +const analytics = getAnalytics(app); +export const auth = getAuth(app); +export const db = getFirestore(app); +export const provider = new GoogleAuthProvider(); diff --git a/frontend/src/Pages/Landing-Page.jsx b/frontend/src/Pages/Landing-Page.jsx index 5b8a943..62757cc 100644 --- a/frontend/src/Pages/Landing-Page.jsx +++ b/frontend/src/Pages/Landing-Page.jsx @@ -6,6 +6,7 @@ import JoinRoom from './JoinRoom-Page'; import HeroSection from '../Components/Pages/Landing-Page/HeroSection'; import FeatureCardSection from '../Components/Pages/Landing-Page/FeatureCardSection'; import JoinWithCode from '../Components/Pages/Landing-Page/JoinWithCode'; +import Login from './Login'; export const LandingPage = () => { return ( @@ -13,6 +14,7 @@ export const LandingPage = () => { + ); diff --git a/frontend/src/Pages/Login.jsx b/frontend/src/Pages/Login.jsx new file mode 100644 index 0000000..701e1e0 --- /dev/null +++ b/frontend/src/Pages/Login.jsx @@ -0,0 +1,107 @@ +import { Box, Button, Heading, Input } from '@chakra-ui/react' +import React, { useState } from 'react' +import { signInWithPopup, createUserWithEmailAndPassword, signOut, signInWithEmailAndPassword } from 'firebase/auth'; +import { auth, db, provider } from "../Firebase/firebase-config"; +import { doc, setDoc } from 'firebase/firestore'; + + +const Login = () => { + + const [emailSignUp, setEmailSignUp] = useState('') + const [passwordSignUp, setPasswordSignUp] = useState('') + + const [emailSignIn, setEmailSignIn] = useState('') + const [passwordSignIn, setPasswordSignIn] = useState('') + const Signup = async () => { + try { + const email = emailSignUp; + const password = passwordSignUp; + + const userCredential = await createUserWithEmailAndPassword(auth, email, password) + const user = userCredential.user; + + const usersCollectionRef = doc(db, 'users', user.uid); + await setDoc(usersCollectionRef, { email, password }) + + setEmailSignUp(""); + setPasswordSignUp(""); + } catch (error) { + console.log('error: ', error); + } + } + + const SignIn = async () => { + try { + const email = emailSignIn; + const password = passwordSignIn; + + const userCredential = await signInWithEmailAndPassword(auth, email, password); + const user = userCredential.user; + + setEmailSignIn("") + setPasswordSignIn("") + } catch (error) { + console.log('error: ', error); + } + } + + const signInWithGoogle = async () => { + try { + const userCredential = await signInWithPopup(auth, provider) + const user = userCredential.user + const name = user.displayName; + const email = user.email; + const profilePic = user.photoURL; + + const usersCollectionRef = doc(db, 'users', user.uid); + await setDoc(usersCollectionRef, { email, googleAuth: true }); + + } catch (error) { + console.log('error: ', error); + } + } + + // * Logout + const logout = async () => { + try { + await signOut(auth); + alert("logout") + } catch (error) { + console.log('error: ', error); + } + } + + return ( + + + Sign Up + + + setEmailSignUp(e.target.value)} /> + + + setPasswordSignUp(e.target.value)} /> + + + + + + + Sign In + + + setEmailSignIn(e.target.value)} /> + + + setPasswordSignIn(e.target.value)} /> + + + + + + + + ) +} + +export default Login \ No newline at end of file diff --git a/frontend/src/custom-hooks/UseAuth.js b/frontend/src/custom-hooks/UseAuth.js new file mode 100644 index 0000000..4db38dc --- /dev/null +++ b/frontend/src/custom-hooks/UseAuth.js @@ -0,0 +1,25 @@ +import React, { useEffect, useState } from 'react'; +import { onAuthStateChanged } from 'firebase/auth'; +import { auth } from '../Firebase/firebase-config'; + +const UseAuth = () => { + + const [currentUser, setCurrentUser] = useState(null); + + useEffect(() => { + const unsubscribe = onAuthStateChanged(auth, (user) => { + if (user) { + setCurrentUser(user) + } else { + setCurrentUser(null); + } + }) + + // * cleanup; + return unsubscribe; + }, []) + + return currentUser; +} + +export default UseAuth \ No newline at end of file From 52eec83b02c1cd80d44501648a906806b28fcc74 Mon Sep 17 00:00:00 2001 From: Harshil Gupta Date: Sun, 19 May 2024 18:43:39 +0530 Subject: [PATCH 02/35] flickering fixed --- frontend/src/Components/Pages/Landing-Page/JoinWithCode.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/Components/Pages/Landing-Page/JoinWithCode.jsx b/frontend/src/Components/Pages/Landing-Page/JoinWithCode.jsx index d522169..42999ae 100644 --- a/frontend/src/Components/Pages/Landing-Page/JoinWithCode.jsx +++ b/frontend/src/Components/Pages/Landing-Page/JoinWithCode.jsx @@ -10,7 +10,7 @@ const JoinWithCode = () => { -
+
Join Room
Date: Sun, 19 May 2024 20:01:10 +0530 Subject: [PATCH 03/35] Add 404 error page --- frontend/src/App.jsx | 3 +++ .../Components/Pages/Error-Page/ErrorPage.jsx | 25 ++++++++++++++++++ frontend/src/Pages/Error-Page.jsx | 12 +++++++++ .../assets/Landing-Page-Assets/ErrorImage.png | Bin 0 -> 495287 bytes 4 files changed, 40 insertions(+) create mode 100644 frontend/src/Components/Pages/Error-Page/ErrorPage.jsx create mode 100644 frontend/src/Pages/Error-Page.jsx create mode 100644 frontend/src/assets/Landing-Page-Assets/ErrorImage.png diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx index 35f5d0a..fe44734 100644 --- a/frontend/src/App.jsx +++ b/frontend/src/App.jsx @@ -10,6 +10,7 @@ import TermsOfService from './Components/common/Footer/LegalSection/TermsOfServi import CreateMeeting from './Pages/Create-Meeting-Page'; import MeetingDetails from './Components/Pages/Meeting-Page/Meeting-Details'; import MeetingAvailability from './Components/Pages/Meeting-Page/Meeting-Availability'; +import ErrorPage from './Pages/Error-Page'; const App = () => { return ( @@ -36,6 +37,8 @@ const App = () => { path='/meetingDetails/meetingAvailaibility' element={} /> + {/* Error */} + } />