diff options
| -rw-r--r-- | rails-backend/app/controllers/api/v1/auth_controller.rb | 15 | ||||
| -rw-r--r-- | rails-backend/config/routes.rb | 1 | ||||
| -rw-r--r-- | react-frontend/src/components/Layout.tsx | 25 | ||||
| -rw-r--r-- | react-frontend/src/routes/index.tsx | 6 |
4 files changed, 35 insertions, 12 deletions
diff --git a/rails-backend/app/controllers/api/v1/auth_controller.rb b/rails-backend/app/controllers/api/v1/auth_controller.rb index 590be3b..cfcb253 100644 --- a/rails-backend/app/controllers/api/v1/auth_controller.rb +++ b/rails-backend/app/controllers/api/v1/auth_controller.rb @@ -7,11 +7,10 @@ class Api::V1::AuthController < ApplicationController def data if !cookies[:session].nil? + puts "Logged in" puts cookies[:session] #render json: Api::V1::AuthController.user_table[cookies[:session]] result = User.find_by(access_token_digest: cookies[:session]) - puts "--- RESULT: ---" - puts result render json: result else puts "Not logged in" @@ -37,7 +36,7 @@ class Api::V1::AuthController < ApplicationController value: access_token_digest, #domain: :all, #same_site: :none, - secure: true + #secure: true } #user_params = { # # access_token_digest: hashed_token, @@ -53,6 +52,16 @@ class Api::V1::AuthController < ApplicationController #redirect_to 'http://localhost:5173/', allow_other_host: true redirect_to "#{ENV['ROOT_DOMAIN']}/closewindow", allow_other_host: true end + def logout + if !cookies[:session].nil? + puts cookies[:session] + cookies.delete :session + else + puts "cookies not found" + end + #cookies.delete :session, domain: 'localhost' + #redirect_to "#{ENV['ROOT_DOMAIN']}", allow_other_host: true + end private diff --git a/rails-backend/config/routes.rb b/rails-backend/config/routes.rb index ba4c647..4c65fb1 100644 --- a/rails-backend/config/routes.rb +++ b/rails-backend/config/routes.rb @@ -31,6 +31,7 @@ Rails.application.routes.draw do # AUTH get 'auth/callback', to: 'auth#callback' get 'auth/data', to: 'auth#data' + get 'auth/logout', to: 'auth#logout' #end end diff --git a/react-frontend/src/components/Layout.tsx b/react-frontend/src/components/Layout.tsx index 979dacb..db31b55 100644 --- a/react-frontend/src/components/Layout.tsx +++ b/react-frontend/src/components/Layout.tsx @@ -1,25 +1,36 @@ -import { Outlet } from "react-router-dom"; +import { Dispatch } from 'react'; +import { Outlet, useNavigate } from "react-router-dom"; import { IconButton, Button, ButtonGroup } from 'rsuite'; import { Icon } from '@rsuite/icons'; import { FaUser } from "react-icons/fa6"; import { FaGamepad } from "react-icons/fa"; import { GiCowboyHolster } from "react-icons/gi"; import { GrAdd } from "react-icons/gr"; +import { UserType } from "../routes/index"; -export type userData = { userData: { name: string } }; +export type userData = { name: string }; - //{ userData.name ? <div className="flex items-end gap-2 pb-2"> <div className="text-xs"> Logged in as: </div> <div>{userData.name}</div> </div> : <a href="" onClick={loginLink} className="pb-2"> Login with Github </a> } - -export default function Layout({userData} : userData) +export default function Layout(prop : { userData: userData, setUserData : Dispatch<UserType> }) { + const navigate = useNavigate(); + const loginLink = () => { window.open(`https://github.com/login/oauth/authorize?client_id=${import.meta.env.VITE_GITHUB_CLIENTID}`); }; + const logoutLink = () => { + fetch(`${import.meta.env.VITE_API_TITLE}/api/v1/auth/logout`, { credentials: "include" }).then(function() { + prop.setUserData({name: ""}) + navigate('/'); + }); + }; + const loggedout_element = <IconButton onClick={loginLink} appearance="primary" color="green" icon={<Icon as={FaUser}/>}>Log In</IconButton>; - const loggedin_element = <ButtonGroup className="flex"><Button appearance="ghost" style={{width:"100%"}}>{userData.name}</Button><Button appearance="subtle" style={{paddingLeft:"1.4em", paddingRight:"1.4em"}}>Log Out</Button></ButtonGroup>; + const loggedin_element = <ButtonGroup className="flex"><Button appearance="ghost" style={{width:"100%"}}>{prop.userData.name}</Button><Button onClick={logoutLink} appearance="subtle" style={{paddingLeft:"1.4em", paddingRight:"1.4em"}}>Log Out</Button></ButtonGroup>; + + console.log(prop); return( <> @@ -27,7 +38,7 @@ export default function Layout({userData} : userData) <div className="flex flex-col h-screen overflow-y-auto overflow-x-hidden w-72 bg-stone-100"> <div className="flex flex-col bg-stone-800"> <div className="m-4 mb-0 flex flex-col flex-grow"> - { userData.name ? loggedin_element : loggedout_element } + { prop.userData.name ? loggedin_element : loggedout_element } </div> </div> <div className="border-green-500 p-2 mb-2 text-red-700 bg-stone-800 rounded-b-xl"><Icon as={GiCowboyHolster} style={{width:"100%", height:"100%"}}/></div> diff --git a/react-frontend/src/routes/index.tsx b/react-frontend/src/routes/index.tsx index e22bcc4..6876ce5 100644 --- a/react-frontend/src/routes/index.tsx +++ b/react-frontend/src/routes/index.tsx @@ -4,10 +4,12 @@ import Home from "../pages/Home"; import Layout from "../components/Layout"; import CloseWindow from "../pages/CloseWindow"; +export type UserType = { name: string }; + export default function Index() { - const [userData, setUserData] = useState({ name: '' }); + const [userData, setUserData] = useState<UserType>({ name: '' }); useEffect(() => { const update_login_status = () => { //localStorage.removeItem("logged in trigger"); @@ -30,7 +32,7 @@ export default function Index() return (<> <Router> <Routes> - <Route path="/" element = {<Layout userData={userData}/>}> + <Route path="/" element = {<Layout userData={userData} setUserData={setUserData}/>}> <Route index element={<Home />} /> <Route path="/closewindow" element={<CloseWindow />} /> </Route> |