Merge branch 'main' into homepage-2nd-sprint
This commit is contained in:
commit
eb9e055287
5 changed files with 45 additions and 35 deletions
4
.env
4
.env
|
|
@ -1,2 +1,2 @@
|
||||||
VITE_AUTH_URL="http://localhost:8080/auth/google"
|
#VITE_AUTH_URL="http://localhost:8080"
|
||||||
#VITE_AUTH_URL="https://byte-camp-auth-service.fly.dev/auth/google"
|
VITE_AUTH_URL="https://byte-camp-auth-service.fly.dev"
|
||||||
2
.env.development
Normal file
2
.env.development
Normal file
|
|
@ -0,0 +1,2 @@
|
||||||
|
VITE_AUTH_URL="http://localhost:8080"
|
||||||
|
#VITE_AUTH_URL="https://byte-camp-auth-service.fly.dev"
|
||||||
|
|
@ -1,7 +1,9 @@
|
||||||
import React, { useState, useEffect, useRef } from "react";
|
import React, { useState, useEffect, useRef } from "react";
|
||||||
import "../scss/styles.scss";
|
import "../scss/styles.scss";
|
||||||
import "../scss/components/_navbar.scss";
|
import "../scss/components/_navbar.scss";
|
||||||
import { Link, useNavigate } from "react-router-dom";
|
import { Link } from "react-router-dom";
|
||||||
|
|
||||||
|
const authUrl = import.meta.env.VITE_AUTH_URL;
|
||||||
|
|
||||||
const Navbar = () => {
|
const Navbar = () => {
|
||||||
const [glitchEffect, setGlitchEffect] = useState(false);
|
const [glitchEffect, setGlitchEffect] = useState(false);
|
||||||
|
|
@ -9,23 +11,9 @@ const Navbar = () => {
|
||||||
const [user, setUser] = useState(null);
|
const [user, setUser] = useState(null);
|
||||||
const [menuOpen, setMenuOpen] = useState(false);
|
const [menuOpen, setMenuOpen] = useState(false);
|
||||||
const menuRef = useRef(null);
|
const menuRef = useRef(null);
|
||||||
const navigate = useNavigate();
|
|
||||||
|
|
||||||
const handleLogout = () => {
|
async function handleLogout() {
|
||||||
// Implement client-side logout without calling the backend
|
window.open(`${authUrl}/auth/logout`, "_self");
|
||||||
// This clears the user state in the frontend
|
|
||||||
setUser(null);
|
|
||||||
|
|
||||||
// Clear any authentication cookies if they exist
|
|
||||||
document.cookie.split(";").forEach((cookie) => {
|
|
||||||
const [name] = cookie.trim().split("=");
|
|
||||||
document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;`;
|
|
||||||
});
|
|
||||||
|
|
||||||
// Redirect to home page
|
|
||||||
navigate("/");
|
|
||||||
|
|
||||||
console.log("Logged out successfully");
|
|
||||||
};
|
};
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
@ -51,7 +39,7 @@ const Navbar = () => {
|
||||||
|
|
||||||
document.addEventListener("mousedown", handleClickOutside);
|
document.addEventListener("mousedown", handleClickOutside);
|
||||||
async function fetchUser() {
|
async function fetchUser() {
|
||||||
const res = await fetch("http://localhost:8080/auth/current_user", {
|
const res = await fetch(`${authUrl}/auth/current_user`, {
|
||||||
credentials: "include", // very important
|
credentials: "include", // very important
|
||||||
});
|
});
|
||||||
if (res.ok) {
|
if (res.ok) {
|
||||||
|
|
|
||||||
|
|
@ -1,9 +1,11 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import "@fortawesome/fontawesome-free/css/all.min.css";
|
import "@fortawesome/fontawesome-free/css/all.min.css";
|
||||||
|
|
||||||
|
const authUrl = import.meta.env.VITE_AUTH_URL;
|
||||||
|
|
||||||
function SignInForm() {
|
function SignInForm() {
|
||||||
const [state, setState] = React.useState({
|
const [state, setState] = React.useState({
|
||||||
email: "",
|
assignmentID: "",
|
||||||
password: "",
|
password: "",
|
||||||
});
|
});
|
||||||
const handleChange = (evt) => {
|
const handleChange = (evt) => {
|
||||||
|
|
@ -17,15 +19,33 @@ function SignInForm() {
|
||||||
const handleOnSubmit = (evt) => {
|
const handleOnSubmit = (evt) => {
|
||||||
evt.preventDefault();
|
evt.preventDefault();
|
||||||
|
|
||||||
const { email, password } = state;
|
const { assignmentId, password } = state;
|
||||||
alert(`You are login with email: ${email} and password: ${password}`);
|
console.log(`You are loggind in with email: ${assignmentId} and password: ${password}`);
|
||||||
|
|
||||||
for (const key in state) {
|
console.log("Submitting login request with state:", state);
|
||||||
setState({
|
fetch(`${authUrl}/auth/student/login`, {
|
||||||
...state,
|
method: "POST",
|
||||||
[key]: "",
|
headers: {
|
||||||
});
|
"Content-Type": "application/json",
|
||||||
|
},
|
||||||
|
body: JSON.stringify(state),
|
||||||
|
credentials: "include",
|
||||||
|
})
|
||||||
|
.then((response) => {
|
||||||
|
console.log("Received response:", response);
|
||||||
|
if (!response.ok) {
|
||||||
|
throw new Error("Network response was not ok");
|
||||||
}
|
}
|
||||||
|
return response.json();
|
||||||
|
})
|
||||||
|
.then((data) => {
|
||||||
|
console.log("Success:", data);
|
||||||
|
window.location.href = "/";
|
||||||
|
})
|
||||||
|
.catch((error) => {
|
||||||
|
console.error("Error occurred during login:", error);
|
||||||
|
alert("Login failed!");
|
||||||
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
@ -39,10 +59,10 @@ function SignInForm() {
|
||||||
</div> */}
|
</div> */}
|
||||||
|
|
||||||
<input
|
<input
|
||||||
type="email"
|
type="assignmentId"
|
||||||
placeholder="Student Name"
|
placeholder="Assignment ID"
|
||||||
name="email"
|
name="assignmentId"
|
||||||
value={state.email}
|
value={state.assignmentId}
|
||||||
onChange={handleChange}
|
onChange={handleChange}
|
||||||
/>
|
/>
|
||||||
<input
|
<input
|
||||||
|
|
|
||||||
|
|
@ -19,9 +19,9 @@ function SignUpForm() {
|
||||||
const handleOnSubmit = (evt) => {
|
const handleOnSubmit = (evt) => {
|
||||||
evt.preventDefault();
|
evt.preventDefault();
|
||||||
|
|
||||||
const { name, email, password } = state;
|
const { assignmentID, password } = state;
|
||||||
alert(
|
alert(
|
||||||
`You are signed in with name: ${name} email: ${email} and password: ${password}`
|
`You are signed in with assignmentID: ${assignmentID} and password: ${password}`
|
||||||
);
|
);
|
||||||
|
|
||||||
for (const key in state) {
|
for (const key in state) {
|
||||||
|
|
@ -34,7 +34,7 @@ function SignUpForm() {
|
||||||
|
|
||||||
const googleAuth = () => {
|
const googleAuth = () => {
|
||||||
|
|
||||||
window.open(authUrl, "_self");
|
window.open(`${authUrl}/auth/google`, "_self");
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue