Merge branch 'gruppPP' into gruppDM

frontend/src/Components/AddProject.tsx

@@ -0,0 +1,94 @@
+import { useState } from "react";
+import { APIResponse, api } from "../API/API";
+import { NewProject, Project } from "../Types/goTypes";
+import InputField from "./InputField";
+import Logo from "../assets/Logo.svg";
+import Button from "./Button";
+
+/**
+ * Tries to add a project to the system
+ * @param props - Project name and description
+ * @returns {boolean} True if created, false if not
+ */
+function CreateProject(props: { name: string; description: string }): boolean {
+  const project: NewProject = {
+    name: props.name,
+    description: props.description,
+  };
+
+  let created = false;
+
+  api
+    .createProject(project, localStorage.getItem("accessToken") ?? "")
+    .then((response: APIResponse<Project>) => {
+      if (response.success) {
+        created = true;
+      } else {
+        console.error(response.message);
+      }
+    })
+    .catch((error) => {
+      console.error("An error occurred during creation:", error);
+    });
+  return created;
+}
+
+/**
+ * Tries to add a project to the system
+ * @returns {JSX.Element} UI for project adding
+ */
+function AddProject(): JSX.Element {
+  const [name, setName] = useState("");
+  const [description, setDescription] = useState("");
+
+  return (
+    <div className="flex flex-col h-fit w-screen items-center justify-center">
+      <div className="border-4 border-black bg-white flex flex-col items-center justify-center h-fit w-fit rounded-3xl content-center pl-20 pr-20">
+        <form
+          className="bg-white rounded px-8 pt-6 pb-8 mb-4 items-center justify-center flex flex-col w-fit h-fit"
+          onSubmit={(e) => {
+            e.preventDefault();
+            CreateProject({ name: name, description: description });
+          }}
+        >
+          <img
+            src={Logo}
+            className="logo w-[7vw] mb-10 mt-10"
+            alt="TTIME Logo"
+          />
+          <h3 className="pb-4 mb-2 text-center font-bold text-[18px]">
+            Create a new project
+          </h3>
+          <InputField
+            label="Name"
+            type="text"
+            value={name}
+            onChange={(e) => {
+              setName(e.target.value);
+            }}
+          />
+          <InputField
+            label="Description"
+            type="text"
+            value={description}
+            onChange={(e) => {
+              setDescription(e.target.value);
+            }}
+          />
+          <div className="flex items-center justify-between">
+            <Button
+              text="Create"
+              onClick={(): void => {
+                return;
+              }}
+              type="submit"
+            />
+          </div>
+        </form>
+        <p className="text-center text-gray-500 text-xs"></p>
+      </div>
+    </div>
+  );
+}
+
+export default AddProject;

frontend/src/Components/Header.tsx

@@ -5,7 +5,7 @@ function Header({ username }: { username: string }): JSX.Element {
   const [isOpen, setIsOpen] = useState(false);
 
   const handleLogout = (): void => {
-    // Add any logout logic here
+    localStorage.clear();
   };
 
   return (

frontend/src/Components/LoginCheck.tsx

@@ -10,17 +10,21 @@ function LoginCheck(props: {
   username: string;
   password: string;
   setAuthority: Dispatch<SetStateAction<number>>;
-}): number {
+}): void {
   const user: NewUser = {
     username: props.username,
     password: props.password,
   };
+
+  localStorage.clear();
+
   api
     .login(user)
     .then((response: APIResponse<string>) => {
       if (response.success) {
         if (response.data !== undefined) {
           const token = response.data;
+          localStorage.setItem("accessToken", token);
           //TODO: change so that it checks for user type (admin, user, pm) instead
           if (token !== "" && props.username === "admin") {
             props.setAuthority((prevAuth) => {
@@ -42,14 +46,12 @@ function LoginCheck(props: {
           console.error("Token was undefined");
         }
       } else {
-        console.error("Token could not be fetched");
+        console.error("Token could not be fetched/No such user");
       }
     })
     .catch((error) => {
       console.error("An error occurred during login:", error);
     });
-
-  return 0;
 }
 
 export default LoginCheck;

frontend/src/Components/Register.tsx

@@ -3,34 +3,9 @@ import { NewUser } from "../Types/goTypes";
 import { api } from "../API/API";
 import Logo from "../assets/Logo.svg";
 import Button from "./Button";
+import InputField from "./InputField";
 import { useNavigate } from "react-router-dom";
 
-function InputField(props: {
-  label: string;
-  type: string;
-  value: string;
-  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
-}): JSX.Element {
-  return (
-    <div className="mb-4">
-      <label
-        className="block text-gray-700 text-sm font-sans font-bold mb-2"
-        htmlFor={props.label}
-      >
-        {props.label}
-      </label>
-      <input
-        className="appearance-none border-2 border-black rounded-2xl w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
-        id={props.label}
-        type={props.type}
-        placeholder={props.label}
-        value={props.value}
-        onChange={props.onChange}
-      />
-    </div>
-  );
-}
-
 export default function Register(): JSX.Element {
   const [username, setUsername] = useState<string>();
   const [password, setPassword] = useState<string>();

frontend/src/Components/UserListAdmin.tsx

@@ -1,11 +1,11 @@
 import { Link } from "react-router-dom";
-import { User } from "../Types/goTypes";
+import { PublicUser } from "../Types/goTypes";
 
 /**
  * The props for the UserProps component
  */
 interface UserProps {
-  users: User[];
+  users: PublicUser[];
 }
 
 /**
@@ -23,7 +23,7 @@ export function UserListAdmin(props: UserProps): JSX.Element {
     <div>
       <ul className="font-bold underline text-[30px] cursor-pointer padding">
         {props.users.map((user) => (
-          <Link to="/admin-view-user" key={user.userId} state={user.username}>
+          <Link to="/adminUserInfo" key={user.userId} state={user.username}>
             <li className="pt-5" key={user.userId}>
               {user.username}
             </li>