From d5a576bf9b246867677e3dbf2bd61a16ccc92db5 Mon Sep 17 00:00:00 2001 From: RamsesCode Date: Wed, 30 Jul 2025 15:27:50 -0400 Subject: [PATCH 01/27] Auth-o branch --- src/App.jsx | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/App.jsx b/src/App.jsx index d793b9af..11f04fa2 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -71,3 +71,8 @@ const Root = () => { const root = createRoot(document.getElementById("root")); root.render(); + + + + +//Test for Auth-o branch creation From 64058a848080d166b084d8bbcba6ed9c194aeef9 Mon Sep 17 00:00:00 2001 From: RamsesCode Date: Wed, 30 Jul 2025 15:54:35 -0400 Subject: [PATCH 02/27] log in button and autho implemented but some errors on AuthO's side --- package-lock.json | 10 +-- package.json | 2 +- src/App.jsx | 50 ++++++++--- src/components/AuthoProvider.jsx | 0 src/components/Login.jsx | 144 +++++++------------------------ 5 files changed, 74 insertions(+), 132 deletions(-) create mode 100644 src/components/AuthoProvider.jsx diff --git a/package-lock.json b/package-lock.json index dc268f09..db8ff7a7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,7 +9,7 @@ "version": "1.0.0", "license": "ISC", "dependencies": { - "@auth0/auth0-react": "^2.3.0", + "@auth0/auth0-react": "^2.4.0", "@babel/core": "^7.27.4", "@babel/preset-react": "^7.27.1", "axios": "^1.10.0", @@ -45,12 +45,12 @@ } }, "node_modules/@auth0/auth0-react": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/@auth0/auth0-react/-/auth0-react-2.3.0.tgz", - "integrity": "sha512-YYTc/DWWigKC9fURufR/79h3+3DAnIzbfEzJLZ8Z4Q0BXE0azru3pKUbU+vYzS4lMAJkclwLuAbUnLjK81vCpA==", + "version": "2.4.0", + "resolved": "https://registry.npmjs.org/@auth0/auth0-react/-/auth0-react-2.4.0.tgz", + "integrity": "sha512-5bt3sO9FVupNM15IpqyYu/2OPHpLI5El7RgWLQXZOPbnCBbtl+VgdHR+H2NfhNQ4SqQtC/5uKbHWafcVcsxkiw==", "license": "MIT", "dependencies": { - "@auth0/auth0-spa-js": "^2.1.3" + "@auth0/auth0-spa-js": "^2.2.0" }, "peerDependencies": { "react": "^16.11.0 || ^17 || ^18 || ^19", diff --git a/package.json b/package.json index da1486c6..83ce0264 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,7 @@ "license": "ISC", "description": "", "dependencies": { - "@auth0/auth0-react": "^2.3.0", + "@auth0/auth0-react": "^2.4.0", "@babel/core": "^7.27.4", "@babel/preset-react": "^7.27.1", "axios": "^1.10.0", diff --git a/src/App.jsx b/src/App.jsx index 11f04fa2..afbbbfeb 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,3 +1,5 @@ +// src/main.jsx (or index.jsx) + import React, { useState, useEffect } from "react"; import { createRoot } from "react-dom/client"; import axios from "axios"; @@ -9,10 +11,19 @@ import Signup from "./components/Signup"; import Home from "./components/Home"; import NotFound from "./components/NotFound"; import { API_URL } from "./shared"; +import { Auth0Provider, useAuth0 } from "@auth0/auth0-react"; + +// Replace these with your Auth0 domain and client ID +const AUTH0_DOMAIN = "dev-m71z1z5w3vgzg8av.us.auth0.com"; +const AUTH0_CLIENT_ID = "dev-m71z1z5w3vgzg8av.us.auth0.com"; const App = () => { const [user, setUser] = useState(null); + // Optionally integrate Auth0 user info if needed + const { isAuthenticated, user: auth0User } = useAuth0(); + + // Keep your backend auth check, but you can also sync Auth0 user info const checkAuth = async () => { try { const response = await axios.get(`${API_URL}/auth/me`, { @@ -25,20 +36,28 @@ const App = () => { } }; - // Check authentication status on app load useEffect(() => { checkAuth(); }, []); + // You might want to sync Auth0 user info or decide how to unify auth here + useEffect(() => { + if (isAuthenticated && auth0User) { + // Example: update your local user state from Auth0 profile + setUser({ + name: auth0User.name, + email: auth0User.email, + picture: auth0User.picture, + }); + } + }, [isAuthenticated, auth0User]); + const handleLogout = async () => { try { - // Logout from our backend await axios.post( `${API_URL}/auth/logout`, {}, - { - withCredentials: true, - } + { withCredentials: true } ); setUser(null); } catch (error) { @@ -53,6 +72,7 @@ const App = () => { } /> } /> + Logging in...} /> } /> } /> @@ -63,16 +83,20 @@ const App = () => { const Root = () => { return ( - - - + + + + + ); }; const root = createRoot(document.getElementById("root")); root.render(); - - - - -//Test for Auth-o branch creation diff --git a/src/components/AuthoProvider.jsx b/src/components/AuthoProvider.jsx new file mode 100644 index 00000000..e69de29b diff --git a/src/components/Login.jsx b/src/components/Login.jsx index 849e495a..7bccabfc 100644 --- a/src/components/Login.jsx +++ b/src/components/Login.jsx @@ -1,127 +1,45 @@ -import React, { useState } from "react"; -import { useNavigate, Link } from "react-router-dom"; -import axios from "axios"; -import { API_URL } from "../shared"; +import React, { useEffect } from "react"; +import { useNavigate } from "react-router-dom"; +import { useAuth0 } from "@auth0/auth0-react"; import "./AuthStyles.css"; const Login = ({ setUser }) => { - const [formData, setFormData] = useState({ - username: "", - password: "", - }); - const [errors, setErrors] = useState({}); - const [isLoading, setIsLoading] = useState(false); + const { loginWithRedirect, isAuthenticated, user: auth0User } = useAuth0(); const navigate = useNavigate(); - const validateForm = () => { - const newErrors = {}; - - if (!formData.username) { - newErrors.username = "Username is required"; - } else if (formData.username.length < 3 || formData.username.length > 20) { - newErrors.username = "Username must be between 3 and 20 characters"; - } - - if (!formData.password) { - newErrors.password = "Password is required"; - } else if (formData.password.length < 6) { - newErrors.password = "Password must be at least 6 characters"; - } - - setErrors(newErrors); - return Object.keys(newErrors).length === 0; - }; - - const handleSubmit = async (e) => { - e.preventDefault(); - - if (!validateForm()) { - return; - } - - setIsLoading(true); - try { - const response = await axios.post(`${API_URL}/auth/login`, formData, { - withCredentials: true, + useEffect(() => { + if (isAuthenticated && auth0User) { + setUser({ + name: auth0User.name, + email: auth0User.email, + picture: auth0User.picture, }); - - setUser(response.data.user); navigate("/"); - } catch (error) { - if (error.response?.data?.error) { - setErrors({ general: error.response.data.error }); - } else { - setErrors({ general: "An error occurred during login" }); - } - } finally { - setIsLoading(false); } - }; - - const handleChange = (e) => { - const { name, value } = e.target; - setFormData((prev) => ({ - ...prev, - [name]: value, - })); - - // Clear error when user starts typing - if (errors[name]) { - setErrors((prev) => ({ - ...prev, - [name]: "", - })); - } - }; + }, [isAuthenticated, auth0User, setUser, navigate]); return (
-
-

Login

- - {errors.general && ( -
{errors.general}
- )} - -
-
- - - {errors.username && ( - {errors.username} - )} -
- -
- - - {errors.password && ( - {errors.password} - )} -
- - -
- -

- Don't have an account? Sign up -

+
+

Login with Spotify

+ +
); From bb8d4c1ec6dbd2387d9acffe133b0b5144612d9b Mon Sep 17 00:00:00 2001 From: RamsesCode Date: Thu, 31 Jul 2025 11:35:36 -0400 Subject: [PATCH 03/27] Auth-o finished and fully working --- src/App.jsx | 22 ++++++++++++---------- src/components/AuthoProvider.jsx | 0 src/components/CallBack.jsx | 27 +++++++++++++++++++++++++++ webpack.config.js | 4 +++- 4 files changed, 42 insertions(+), 11 deletions(-) delete mode 100644 src/components/AuthoProvider.jsx create mode 100644 src/components/CallBack.jsx diff --git a/src/App.jsx b/src/App.jsx index afbbbfeb..692407ac 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -10,12 +10,13 @@ import Login from "./components/Login"; import Signup from "./components/Signup"; import Home from "./components/Home"; import NotFound from "./components/NotFound"; +import CallBack from "./components/CallBack"; import { API_URL } from "./shared"; import { Auth0Provider, useAuth0 } from "@auth0/auth0-react"; // Replace these with your Auth0 domain and client ID -const AUTH0_DOMAIN = "dev-m71z1z5w3vgzg8av.us.auth0.com"; -const AUTH0_CLIENT_ID = "dev-m71z1z5w3vgzg8av.us.auth0.com"; +const AUTH0_DOMAIN = "dev-m71z1z5w3vgzg8av.us.auth0.com"; +const AUTH0_CLIENT_ID = "qhqEo3tGexhy8VRLbVR1OiSv2KGuadlh"; const App = () => { const [user, setUser] = useState(null); @@ -72,7 +73,7 @@ const App = () => { } /> } /> - Logging in...
} /> + } /> } /> } /> @@ -84,13 +85,14 @@ const App = () => { const Root = () => { return ( + domain={AUTH0_DOMAIN} + clientId={AUTH0_CLIENT_ID} + authorizationParams={{ + redirectUri: window.location.origin + "/callback", + }} + cacheLocation="localstorage" +> + diff --git a/src/components/AuthoProvider.jsx b/src/components/AuthoProvider.jsx deleted file mode 100644 index e69de29b..00000000 diff --git a/src/components/CallBack.jsx b/src/components/CallBack.jsx new file mode 100644 index 00000000..e421c3c0 --- /dev/null +++ b/src/components/CallBack.jsx @@ -0,0 +1,27 @@ +import React from "react"; +import { useEffect } from "react"; +import { useNavigate } from "react-router-dom"; +import { useAuth0 } from "@auth0/auth0-react"; + +const CallBack = () => { + const { isLoading, error } = useAuth0(); + const navigate = useNavigate(); + + useEffect(() => { + if (!isLoading && !error) { + navigate("/"); + } + }, [isLoading, error, navigate]); + + if (isLoading) { + return

Loading...

; + } + + if (error) { + return

Error: {error.message}

; + } + + return null; +}; + +export default CallBack; diff --git a/webpack.config.js b/webpack.config.js index bfa8e19e..7cca762e 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -8,7 +8,7 @@ module.exports = { output: { path: path.resolve(__dirname, "dist"), filename: "main.js", - publicPath: "/", + publicPath: "/", // needed for React Router }, devtool: "source-map", plugins: [ @@ -47,5 +47,7 @@ module.exports = { compress: true, historyApiFallback: true, port: 3000, + host: "127.0.0.1", // Serve at 127.0.0.1 + open: true, // Auto-open browser }, }; From 3b787647effeb978b1ac417c769c2a3ea16db45b Mon Sep 17 00:00:00 2001 From: RamsesCode Date: Thu, 31 Jul 2025 11:55:21 -0400 Subject: [PATCH 04/27] random push to fix merge --- src/App.jsx | 27 ++++++++++++--------------- 1 file changed, 12 insertions(+), 15 deletions(-) diff --git a/src/App.jsx b/src/App.jsx index 692407ac..cb68aa77 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,5 +1,3 @@ -// src/main.jsx (or index.jsx) - import React, { useState, useEffect } from "react"; import { createRoot } from "react-dom/client"; import axios from "axios"; @@ -55,11 +53,7 @@ const App = () => { const handleLogout = async () => { try { - await axios.post( - `${API_URL}/auth/logout`, - {}, - { withCredentials: true } - ); + await axios.post(`${API_URL}/auth/logout`, {}, { withCredentials: true }); setUser(null); } catch (error) { console.error("Logout error:", error); @@ -85,14 +79,13 @@ const App = () => { const Root = () => { return ( - + domain={AUTH0_DOMAIN} + clientId={AUTH0_CLIENT_ID} + authorizationParams={{ + redirectUri: window.location.origin + "/callback", + }} + cacheLocation="localstorage" + > @@ -102,3 +95,7 @@ const Root = () => { const root = createRoot(document.getElementById("root")); root.render(); + + + +// test to help fix issues with merge \ No newline at end of file From 65a6a6035fb872d05f2f7341aec98e1c6fe18fed Mon Sep 17 00:00:00 2001 From: rend1027 Date: Fri, 1 Aug 2025 12:45:05 -0400 Subject: [PATCH 05/27] added webpack rule for images --- src/App.jsx | 4 ++-- src/assets/LocalBeats.png | Bin 0 -> 14357 bytes src/components/NavBar.jsx | 5 ++++- src/components/NavBarStyles.css | 6 +++++- webpack.config.js | 8 ++++++++ 5 files changed, 19 insertions(+), 4 deletions(-) create mode 100644 src/assets/LocalBeats.png diff --git a/src/App.jsx b/src/App.jsx index cb68aa77..a733df5f 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -65,10 +65,10 @@ const App = () => {
- } /> + } /> } /> } /> - } /> + {/* } /> */} } />
diff --git a/src/assets/LocalBeats.png b/src/assets/LocalBeats.png new file mode 100644 index 0000000000000000000000000000000000000000..665a4490e39b59760ac28e864f93102fcd602211 GIT binary patch literal 14357 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
  • kd z)b|I_TFrj$nnJ1`lcQs5Q4i(VFFItqCldxFl$ralx(dsURH+(pfDF?JH9O#XC2XK2 z@`oGToi$pTjvqhS39sDDk2?YVLdfEN2y3_nj6G1hEDfWN(I2kS^+-)mHI81$C>A5Y zsO$l9q=gK!<)3S_8kA;DBKFQn=osk+#h+g^)n|T_9q>CEw#Qtq)x|#&VW1u6W_2#@ z(TKH)4&rnBnn>r@47K5Ygrr78nsGil>@zmJ{$t0(&20>*t0d(o%L=KbEbzx)DvyXY zE)y>7$%oav;Z5g#NpL3yJQ$nF^C*46rzoOJK{H(oLRgSs36wkcM8s7NgL`!ybqxiS za54K)zxjyT3T5?UYa+Ypip6I%7K_a7gq1BT(%-M!V!6c7(N0Z)nvqQw#Un0!ljR5u zSjzE#5d2KuIs)yjim*bfgz=vnINXNByqaocUPBkmP@hB&E8`IHHhAWD?G=4WClCNfSahFZEz-XM6T0JFHa1wv(t2u0j$097 zs3+nE|1=bu{%L8{rueeNCK~a1JDfu_B}OdhdZzyRD>_?d_%ibk#SE39M2E$E8cwy!5?4shYw zAef_z>6sern%Y&e1hu)0hp6nd>}@!RYR|eOj;^`BO~R;6x*lQWAW?}7DHY9O&(^IE zvVAUwGvBaP+@J0VTIr05*mT)nEXGgpbsF^N-g)}u^au6XpH5UDt(7wh%)KL=AH*Ai zh7$m3UOSL+H)|j%jS$~Mu%@&h`dulL$Yce>*}2*zQIONRmLPqNdu4|X3$viyK@K|e zrGDW@V{+L?maKipvg)X4c)VX!3a+XN*^poIxPCRJXO`-+(}c#;cir?7!exr|zrO}A zsE>!KMmZ419wv2_xC54Rsg3rwvQ)rxFxy{MJM6jt;18Z;%co}k#a8=SPwq2(bEjgs z;3ty10$J|NW6S>Q>BF4idg^waWz8s)-!f_zlS+7l%IYd~IRY2W`^-a#py!iqarr65Y-VQA(4XM z=Mso~;L*px6dw@uCV#M;6m?swgG2C64Axb6>xS~L*kI``<;+l`%>}Rxk;4Xs)E$)$ zh}R>gsAa`|kOi#bHZ|)8NJP!m&%*&A^W~@`SIQ=Z02rEB#JjSlkOmE^1w5??0P@Z} z9EHVfu$I|pLOI2^i)UCE9|@ER$lIRz`yzZA+7-P{5O|L9Iim&Z*%4Os%ytuqH2I+L yF)h^ob?NTI>YufZO literal 0 HcmV?d00001 diff --git a/src/components/NavBar.jsx b/src/components/NavBar.jsx index 648f3808..7b1960b7 100644 --- a/src/components/NavBar.jsx +++ b/src/components/NavBar.jsx @@ -1,12 +1,15 @@ import React from "react"; import { Link } from "react-router-dom"; import "./NavBarStyles.css"; +import logo from '../assets/LocalBeats.png' const NavBar = ({ user, onLogout }) => { return (