Merge branch 'main' of https://github.com/TobiasSchaeuble-EH/LunchHeroes

# Conflicts:
#	frontend/src/App.js

README.md

@@ -4,9 +4,13 @@
 
 
 # LunchHeroes
-Lunch Heros Basel Hack Event Repo 
+
+Lunch Heros Basel Hack Event Repo
 
 # Presentation Slides
+
 [LunchHero Presentation](https://www.canva.com/design/DAFyifsFr18/oOybsSYmFfqYSdd0SuqZMA/edit?utm_content=DAFyifsFr18&utm_campaign=designshare&utm_medium=link2&utm_source=sharebutton)
 
+# Figma Mockup
 
+[Figma Mockup] (https://www.figma.com/file/gjotWvh3EWwIkEOtJcM88B/Untitled?type=design&node-id=0%3A1&mode=design&t=BT1mFm6CNMV2inDX-1)

frontend/src/App.js

@@ -1,4 +1,5 @@
-import React, { useState, useEffect} from 'react';
+
+import React, { useState, useEffect } from 'react';
 // import logo from './logo.svg';
 import './App.css';
 import Login from './Components/Login';
@@ -9,10 +10,13 @@ import Status from './Components/Status';
 import {useSelector} from 'react-redux';  // import useSelector from react-redux
 import { Route, Navigate, Routes, useNavigate } from 'react-router-dom';  // import Route and Navigate from react-router-dom
 import Scheduling from './Components/Scheduling';
-// import{ supabase } from './supabaseclient';
 
 function App() {
 
+  const user = useSelector(state => state.session.user);
+  console.log("LOGIN USER", user?.user?.id);
+  console.log("LOGIN", user);
+
   // const [isLoaded, setIsLoaded] = useState(false);
   // useEffect(() => {
   //   dispatch(authenticate()).then(() => setIsLoaded(true));
@@ -41,9 +45,7 @@ function App() {
     setTimeSlot(slot);
   }
 
-  const user = useSelector(state => state.session.user);
-  console.log("LOGIN USER", user?.user?.id);
-  console.log("LOGIN", user);
+
 
   const RedirectToHome = () => {
     const navigate = useNavigate();

frontend/src/Components/Navigation.js

@@ -40,7 +40,7 @@ function Navigation({ isLoaded }) {
     <>
       <div className="nav-div-user-logged-in">
         <div className="nav-icon-user-logged-in">
-          <Link exact to="/">
+          <Link exact to="/home">
             <img className="responsive-logo" alt="Here the Basel Hack Logo is displayed" src="/Logo.svg" />
             <img className="responsive-logo" alt="Here the Basel Hack Logo is displayed" src="/burger_wink.svg" />
           </Link>

frontend/src/Components/ProfileButton.js

@@ -1,11 +1,14 @@
 import React, { useState, useEffect, useRef } from "react";
+import { useDispatch } from "react-redux";
+
 import { logout } from "../store/session";
 import { useNavigate } from "react-router-dom";
 import "../SCSS/navigation.css";
 function ProfileButton({ user }) {
   const [showMenu, setShowMenu] = useState(false);
   const ulRef = useRef();
-  const navigate= useNavigate()
+  const navigate= useNavigate();
+  const dispatch = useDispatch();
   const openMenu = () => {
     if (showMenu) return;
     setShowMenu(true);
@@ -22,8 +25,11 @@ function ProfileButton({ user }) {
   }, [showMenu]);
   const handleLogout = (e) => {
     e.preventDefault();
-    logout();
-    navigate("/");
+    dispatch(logout())
+    .then(() => {
+      navigate("/");
+      closeMenu();
+    })
   };
   const navUserProfile = (e) => {
     e.preventDefault();
@@ -54,4 +60,4 @@ function ProfileButton({ user }) {
     </>
   );
 }
-export default ProfileButton;
+export default ProfileButton;

frontend/src/SCSS/scheduling.css

@@ -176,9 +176,10 @@ input[type='range'] {
     border: 1px solid #007CAA;
     /* Change border color when hovered or focused */
 }
+
 .randomize-button {
     height: 100px !important;
     width: 250px !important;
     font-size: 25px;
     margin-top: 25px;
-}
+}

frontend/src/store/session.js

@@ -5,7 +5,7 @@ const SET_USER = "session/SET_USER";
 const REMOVE_USER = "session/REMOVE_USER";
 
 
-const setUser = (user) => ({
+export const setUser = (user) => ({
 	type: SET_USER,
 	payload: user,
 });
@@ -44,7 +44,7 @@ export const login = (email, password) => async (dispatch) => {
 
 	if (response.data.user) {
 		const data = response.data
-		console.log('DATA', data)
+		localStorage.setItem('user', data.user)
 		dispatch(setUser(data));
 		return data;
 	} else if (response.error) {
@@ -57,13 +57,9 @@ export const login = (email, password) => async (dispatch) => {
 };
 
 export const logout = () => async (dispatch) => {
-	const response = await fetch("/api/auth/logout", {
-		headers: {
-			"Content-Type": "application/json",
-		},
-	});
+	const response = await supabase.auth.signOut()
 
-	if (response.ok) {
+	if (!response.error) {
 		dispatch(removeUser());
 	}
 };