diff --git a/frontend/src/components/HeaderFooter.tsx b/frontend/src/components/HeaderFooter.tsx index 8bc99d93..a034975d 100644 --- a/frontend/src/components/HeaderFooter.tsx +++ b/frontend/src/components/HeaderFooter.tsx @@ -46,8 +46,8 @@ export const Header = () => { padding: "10px", }} > - diff --git a/frontend/src/components/Modals.tsx b/frontend/src/components/Modals.tsx index 906bb549..f71ee9ec 100644 --- a/frontend/src/components/Modals.tsx +++ b/frontend/src/components/Modals.tsx @@ -1117,7 +1117,6 @@ export const CreateReactionModal: React.FC = ({ const createReactionProductsRef = useRef(""); useEffect(() => { - console.log("hi:", selectedFamily); const fetchReactions = async () => { try { if (selectedFamilyId && selectedMechanismId) { diff --git a/frontend/src/components/NavDropDown.tsx b/frontend/src/components/NavDropDown.tsx index dd345878..8a325573 100644 --- a/frontend/src/components/NavDropDown.tsx +++ b/frontend/src/components/NavDropDown.tsx @@ -12,7 +12,7 @@ const NavDropDown = () => { // Get the logged-in user from the AuthContext const { user, setUser } = useAuth(); - const goHome = () => navigate("/LoggedIn"); + const goHome = () => navigate("/"); const goFamily = () => navigate("/FamilyPage"); const goLogOut = () => { setUser(null); diff --git a/frontend/src/pages/logIn.tsx b/frontend/src/pages/logIn.tsx index 95dadc58..20c728ef 100644 --- a/frontend/src/pages/logIn.tsx +++ b/frontend/src/pages/logIn.tsx @@ -1,5 +1,4 @@ import { useNavigate } from "react-router-dom"; -import { useState, useEffect } from "react"; import { googleLogout, useGoogleLogin } from "@react-oauth/google"; import axios from "axios"; import { useAuth } from "../pages/AuthContext"; // Import the AuthContext @@ -11,8 +10,8 @@ import Box from "@mui/material/Box"; import Typography from "@mui/material/Typography"; import GoogleIcon from "@mui/icons-material/Google"; import NoAccountsIcon from "@mui/icons-material/NoAccounts"; -import { Footer } from "../components/HeaderFooter"; -import Holidays from "../components/Holidays"; // Import the Holidays component +import ArrowForwardIcon from '@mui/icons-material/ArrowForward'; +import { Footer, Header } from "../components/HeaderFooter"; import { getUserByEmail } from "../API/API_GetMethods"; import { createUser } from "../API/API_CreateMethods"; @@ -20,26 +19,11 @@ interface AuthUser { access_token: string; } -interface Profile { - name: string; - email: string; -} - -const LogIn = () => { - const { setUser } = useAuth(); // Get setUser from AuthContext - const [user, setLocalUser] = useState(null); - const [profile, setProfile] = useState(null); +const LogIn: React.FC = () => { + const { setUser, user } = useAuth(); // Get setUser from AuthContext const navigate = useNavigate(); - const handleClick = () => navigate("/LoggedIn"); - - const login = useGoogleLogin({ - onSuccess: (codeResponse) => { - setLocalUser(codeResponse); // Set local user - }, - onError: (error) => console.log("Login Failed:", error), - }); - useEffect(() => { + const setUserInformation = async (user: AuthUser) => { if (user) { // Fetch the user profile using the access token axios @@ -54,7 +38,6 @@ const LogIn = () => { ) .then(async (res) => { const profileData = res.data; - setProfile(profileData); if (!profileData.email) { console.error("Profile data does not contain an email."); @@ -66,11 +49,6 @@ const LogIn = () => { try { const existingUser = await getUserByEmail(profileData.email); if (existingUser) { - const updatedUser = { - access_token: user.access_token, - ...existingUser, - }; - setLocalUser(updatedUser); const contextUser = { id: existingUser.id, @@ -86,11 +64,6 @@ const LogIn = () => { role: "unverified", }; const createdUser = await createUser(newUser); - const updatedUser = { - access_token: user.access_token, - ...createdUser, - }; - setLocalUser(updatedUser); const contextUser = { id: createdUser.id, @@ -98,6 +71,7 @@ const LogIn = () => { email: createdUser.email, role: createdUser.role || "unverified", }; + setUser(createdUser); console.log("Context user ", contextUser); } @@ -111,91 +85,78 @@ const LogIn = () => { alert("Error fetching profile"); }); } - }, [user, setUser]); + } + + const login = useGoogleLogin({ + onSuccess: (codeResponse) => { + setUserInformation(codeResponse).then(() => navigate("/LoggedIn")); + }, + onError: (error) => console.log("Login Failed:", error), + }); // Log out function to log the user out of Google and set the profile array to null - const logOut = () => { + const continueAsGuest = () => { googleLogout(); - setProfile(null); setUser(null); // Clear user from AuthContext on logout + navigate("/LoggedIn"); }; return ( -
- {/* Include the Holidays component here */} -
- - - Chemistry Cafe - - -
-
- - - A collaborative tool to share, edit, manage, and export chemical - mechanisms across the scientific community and into MusicBox - Interactive.
- - -
-
-
-
-

- {profile ? ( +
+
+
+
+
+
- -

User Logged in

-

Name: {profile.name}

-

Email Address: {profile.email}

-
-
+ + + Chemistry Cafe + + + + + A collaborative tool to share, edit, manage, and export chemical + mechanisms across the scientific community and into MusicBox + Interactive. + -

+
+
+ { + user && + + } -

- ) : ( - - )} -
-
- -
-
-
-
-
+
+
+