Co-authored-by: Imbus <imbus64@users.noreply.github.com>

frontend/src/Components/Register.tsx

@@ -1,22 +1,14 @@
 import { useState } from "react";
 import { NewUser, User } from "../Types/Users";
+import { api } from "../API/API";
 
-export default function Register() {
+export default function Register(): JSX.Element {
-const [username, setUsername] = useState('')
+  const [username, setUsername] = useState("");
-const [password, setPassword] = useState('')
+  const [password, setPassword] = useState("");
-const [error, setError] = useState('')
 
-    
+  const handleRegister = async (): Promise<void> => {
-
+    const newUser: NewUser = { userName: username, password };
-  const handleRegister = async () => {
+    const user = await api.registerUser(newUser);
-    try {
-      const newUser: NewUser = { username, password };
-      const registeredUser: User = await api.registerUser(newUser);
-      console.log("User registered:", registeredUser);
-      // Optionally, you can navigate to another page or show a success message here
-    } catch (error) {
-      setError("Registration failed. Please try again."); // Handle error appropriately
-    }
   };
 
   return (
@@ -26,7 +18,7 @@ const [error, setError] = useState('')
           className="bg-white shadow-md rounded px-8 pt-6 pb-8 mb-4"
           onSubmit={(e) => {
             e.preventDefault();
-            handleRegister();
+            void handleRegister();
           }}
         >
           <h3 className="pb-2">Register new user</h3>
@@ -43,7 +35,9 @@ const [error, setError] = useState('')
               type="text"
               placeholder="Username"
               value={username}
-              onChange={(e) => setUsername(e.target.value)}
+              onChange={(e) => {
+                setUsername(e.target.value);
+              }}
             />
           </div>
           <div className="mb-6">
@@ -54,16 +48,15 @@ const [error, setError] = useState('')
               Password
             </label>
             <input
-              className="shadow appearance-none border border-red-500 rounded w-full py-2 px-3 text-gray-700 mb-3 leading-tight focus:outline-none focus:shadow-outline"
+              className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 mb-3 leading-tight focus:outline-none focus:shadow-outline"
               id="password"
               type="password"
               placeholder="Choose your password"
               value={password}
-              onChange={(e) => setPassword(e.target.value)}
+              onChange={(e) => {
+                setPassword(e.target.value);
+              }}
             />
-            <p className="text-red-500 text-xs italic">
-              Please choose a password.
-            </p>
           </div>
           <div className="flex items-center justify-between">
             <button
@@ -73,7 +66,6 @@ const [error, setError] = useState('')
               Register
             </button>
           </div>
-          {error && <p className="text-red-500 text-xs italic">{error}</p>}
         </form>
         <p className="text-center text-gray-500 text-xs"></p>
       </div>

package-lock.json

@@ -0,0 +1,6 @@
+{
+  "name": "TTime",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {}
+}