From 649c961178a6a7193a94ebf2011243d755889aaa Mon Sep 17 00:00:00 2001
From: Kai Ritthaler <kajsu.kaepfer@gmial.com>
Date: Fri, 20 Jun 2025 12:40:47 +0200
Subject: [PATCH] added react router and routes to login and signup

---
 code/frontend/package.json                    |  1 +
 code/frontend/src/App.tsx                     | 15 ++++++++++-
 .../frontend/src/pages/LoginAndSignUpPage.tsx | 12 ++++-----
 code/frontend/yarn.lock                       | 25 +++++++++++++++++++
 4 files changed, 46 insertions(+), 7 deletions(-)

diff --git a/code/frontend/package.json b/code/frontend/package.json
index 6435e64..cc14fb3 100644
--- a/code/frontend/package.json
+++ b/code/frontend/package.json
@@ -14,6 +14,7 @@
     "axios": "^1.10.0",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
+    "react-router-dom": "^7.6.2",
     "react-scripts": "5.0.1",
     "typescript": "^4.4.2",
     "web-vitals": "^2.1.0"
diff --git a/code/frontend/src/App.tsx b/code/frontend/src/App.tsx
index f87006d..90e803a 100644
--- a/code/frontend/src/App.tsx
+++ b/code/frontend/src/App.tsx
@@ -4,12 +4,25 @@ import "./styles/fonts.css";
 import LoginAndSignUpPage from "./pages/LoginAndSignUpPage";
 import Footer from "./components/Footer";
 import Header from "./components/header";
+import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
 
 function App() {
   return (
     <div className="App">
       <Header />
-      <LoginAndSignUpPage />
+      <Router>
+        <Routes>
+          <Route
+            path="/login"
+            element={<LoginAndSignUpPage signupProp={false} />}
+          ></Route>
+          <Route
+            path="/register"
+            element={<LoginAndSignUpPage signupProp={true} />}
+          ></Route>
+        </Routes>
+      </Router>
+
       <Footer />
     </div>
   );
diff --git a/code/frontend/src/pages/LoginAndSignUpPage.tsx b/code/frontend/src/pages/LoginAndSignUpPage.tsx
index 6d85888..34e3914 100644
--- a/code/frontend/src/pages/LoginAndSignUpPage.tsx
+++ b/code/frontend/src/pages/LoginAndSignUpPage.tsx
@@ -8,17 +8,17 @@ type FormData = {
   password: string;
 };
 
-function LoginAndSignUpPage() {
+function LoginAndSignUpPage({ signupProp }: { signupProp: boolean }) {
+  const [signup, setSignup] = useState<boolean>(signupProp);
+  const [errorMessages, setErrorMessages] = useState<{
+    error: String;
+    details: { message: string }[];
+  }>();
   const toggleLogin = (event: React.MouseEvent<HTMLElement>) => {
     event.preventDefault();
     setErrorMessages(undefined);
     setSignup(!signup);
   };
-  const [signup, setSignup] = useState<boolean>(false);
-  const [errorMessages, setErrorMessages] = useState<{
-    error: String;
-    details: { message: string }[];
-  }>();
   const [formData, setFormData] = useState<FormData>({
     username: "",
     email: "",
diff --git a/code/frontend/yarn.lock b/code/frontend/yarn.lock
index df342f7..82aaf7a 100644
--- a/code/frontend/yarn.lock
+++ b/code/frontend/yarn.lock
@@ -3348,6 +3348,11 @@ cookie@0.7.1:
   resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.7.1.tgz#2f73c42142d5d5cf71310a74fc4ae61670e5dbc9"
   integrity sha512-6DnInpx7SJ2AK3+CTUE/ZM0vWTUboZCegxhC2xiIydHR9jNuTAASBrfEpHhiGOZw/nX51bHt6YQl8jsGo4y/0w==
 
+cookie@^1.0.1:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/cookie/-/cookie-1.0.2.tgz#27360701532116bd3f1f9416929d176afe1e4610"
+  integrity sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==
+
 core-js-compat@^3.40.0:
   version "3.41.0"
   resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.41.0.tgz#4cdfce95f39a8f27759b667cf693d96e5dda3d17"
@@ -7839,6 +7844,21 @@ react-refresh@^0.11.0:
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.11.0.tgz#77198b944733f0f1f1a90e791de4541f9f074046"
   integrity sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==
 
+react-router-dom@^7.6.2:
+  version "7.6.2"
+  resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-7.6.2.tgz#e97e386ab390b6503a2a7968124b7a3237fb10c7"
+  integrity sha512-Q8zb6VlTbdYKK5JJBLQEN06oTUa/RAbG/oQS1auK1I0TbJOXktqm+QENEVJU6QvWynlXPRBXI3fiOQcSEA78rA==
+  dependencies:
+    react-router "7.6.2"
+
+react-router@7.6.2:
+  version "7.6.2"
+  resolved "https://registry.yarnpkg.com/react-router/-/react-router-7.6.2.tgz#9f48b343bead7d0a94e28342fc4f9ae29131520e"
+  integrity sha512-U7Nv3y+bMimgWjhlT5CRdzHPu2/KVmqPwKUCChW8en5P3znxUqwlYFlbmyj8Rgp1SF6zs5X4+77kBVknkg6a0w==
+  dependencies:
+    cookie "^1.0.1"
+    set-cookie-parser "^2.6.0"
+
 react-scripts@5.0.1:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/react-scripts/-/react-scripts-5.0.1.tgz#6285dbd65a8ba6e49ca8d651ce30645a6d980003"
@@ -8346,6 +8366,11 @@ serve-static@1.16.2:
     parseurl "~1.3.3"
     send "0.19.0"
 
+set-cookie-parser@^2.6.0:
+  version "2.7.1"
+  resolved "https://registry.yarnpkg.com/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz#3016f150072202dfbe90fadee053573cc89d2943"
+  integrity sha512-IOc8uWeOZgnb3ptbCURJWNjWUPcO3ZnTTdzsurqERrP6nPyv+paC55vJM0LpOlT2ne+Ix+9+CRG1MNLlyZ4GjQ==
+
 set-function-length@^1.2.2:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/set-function-length/-/set-function-length-1.2.2.tgz#aac72314198eaed975cf77b2c3b6b880695e5449"