Justfile save-release target now saves image with name containing commit hash and date

Justfile

@@ -15,7 +15,7 @@ remove-podman-containers:
 
 # Saves the release container to a tarball, pigz is just gzip but multithreaded
 save-release: build-container-release
-    podman save --format=oci-archive ttime-server | pigz -9 > ttime-server.tar.gz
+    podman save --format=oci-archive ttime-server | pigz -9 > ttime-server_`date -I`_`git rev-parse --short HEAD`.tar.gz
 
 # Loads the release container from a tarball
 load-release file:

backend/internal/database/db.go

@@ -204,15 +204,22 @@ func (d *Db) AddProject(name string, description string, username string) error
 	tx := d.MustBegin()
 	_, err := tx.Exec(projectInsert, name, description, username)
 	if err != nil {
-		tx.Rollback()
+		if err := tx.Rollback(); err != nil {
+			return err
+		}
 		return err
 	}
 	_, err = tx.Exec(changeUserRole, "project_manager", username, name)
 	if err != nil {
-		tx.Rollback()
+		if err := tx.Rollback(); err != nil {
+			return err
+		}
 		return err
 	}
-	tx.Commit()
+	if err := tx.Commit(); err != nil {
+		return err
+	}
+
 	return err
 }
 

frontend/src/API/API.ts

@@ -42,10 +42,7 @@ interface API {
     token: string,
   ): Promise<APIResponse<NewWeeklyReport>>;
   /** Gets all the projects of a user*/
-  getUserProjects(
-    username: string,
-    token: string,
-  ): Promise<APIResponse<Project[]>>;
+  getUserProjects(token: string): Promise<APIResponse<Project[]>>;
   /** Gets a project from id*/
   getProject(id: number): Promise<APIResponse<Project>>;
 }
@@ -150,10 +147,7 @@ export const api: API = {
     }
   },
 
-  async getUserProjects(
-    username: string,
-    token: string,
-  ): Promise<APIResponse<Project[]>> {
+  async getUserProjects(token: string): Promise<APIResponse<Project[]>> {
     try {
       const response = await fetch("/api/getUserProjects", {
         method: "GET",
@@ -161,7 +155,6 @@ export const api: API = {
           "Content-Type": "application/json",
           Authorization: "Bearer " + token,
         },
-        body: JSON.stringify({ username }),
       });
 
       if (!response.ok) {
@@ -176,7 +169,7 @@ export const api: API = {
     } catch (e) {
       return Promise.resolve({
         success: false,
-        message: "Failed to get user projects",
+        message: "API fucked",
       });
     }
   },

frontend/src/Components/DeleteUser.tsx

@@ -0,0 +1,34 @@
+import { User } from "../Types/goTypes";
+import { api, APIResponse } from "../API/API";
+
+/**
+ * Use to remove a user from the system
+ * @param props - The username of user to remove
+ * @returns {boolean} True if removed, false if not
+ * @example
+ * const exampleUsername = "user";
+ * DeleteUser({ usernameToDelete: exampleUsername });
+ */
+
+function DeleteUser(props: { usernameToDelete: string }): boolean {
+  //console.log(props.usernameToDelete); FOR DEBUG
+  let removed = false;
+  api
+    .removeUser(
+      props.usernameToDelete,
+      localStorage.getItem("accessToken") ?? "",
+    )
+    .then((response: APIResponse<User>) => {
+      if (response.success) {
+        removed = true;
+      } else {
+        console.error(response.message);
+      }
+    })
+    .catch((error) => {
+      console.error("An error occurred during creation:", error);
+    });
+  return removed;
+}
+
+export default DeleteUser;

frontend/src/Components/Header.tsx

@@ -1,5 +1,6 @@
 import { useState } from "react";
 import { Link } from "react-router-dom";
+import backgroundImage from "../assets/1.jpg";
 
 function Header(): JSX.Element {
   const [isOpen, setIsOpen] = useState(false);
@@ -11,7 +12,7 @@ function Header(): JSX.Element {
   return (
     <header
       className="fixed top-0 left-0 right-0 border-[1.75px] border-black text-black p-3 pl-5 flex items-center justify-between bg-cover"
-      style={{ backgroundImage: `url('src/assets/1.jpg')` }}
+      style={{ backgroundImage: `url(${backgroundImage})` }}
     >
       <Link to="/your-projects">
         <img

frontend/src/Components/NewWeeklyReport.tsx

@@ -1,32 +1,31 @@
-import { useState, useContext } from "react";
+import { useState } from "react";
 import type { NewWeeklyReport } from "../Types/goTypes";
 import { api } from "../API/API";
-import { useNavigate } from "react-router-dom";
+import { useNavigate, useParams } from "react-router-dom";
 import Button from "./Button";
-import { ProjectNameContext } from "../Pages/YourProjectsPage";
 
 export default function NewWeeklyReport(): JSX.Element {
-  const [week, setWeek] = useState(0);
-  const [developmentTime, setDevelopmentTime] = useState(0);
-  const [meetingTime, setMeetingTime] = useState(0);
-  const [adminTime, setAdminTime] = useState(0);
-  const [ownWorkTime, setOwnWorkTime] = useState(0);
-  const [studyTime, setStudyTime] = useState(0);
-  const [testingTime, setTestingTime] = useState(0);
+  const [week, setWeek] = useState<number>();
+  const [developmentTime, setDevelopmentTime] = useState<number>();
+  const [meetingTime, setMeetingTime] = useState<number>();
+  const [adminTime, setAdminTime] = useState<number>();
+  const [ownWorkTime, setOwnWorkTime] = useState<number>();
+  const [studyTime, setStudyTime] = useState<number>();
+  const [testingTime, setTestingTime] = useState<number>();
 
-  const projectName = useContext(ProjectNameContext);
+  const { projectName } = useParams();
   const token = localStorage.getItem("accessToken") ?? "";
 
   const handleNewWeeklyReport = async (): Promise<void> => {
     const newWeeklyReport: NewWeeklyReport = {
-      projectName,
-      week,
-      developmentTime,
-      meetingTime,
-      adminTime,
-      ownWorkTime,
-      studyTime,
-      testingTime,
+      projectName: projectName ?? "",
+      week: week ?? 0,
+      developmentTime: developmentTime ?? 0,
+      meetingTime: meetingTime ?? 0,
+      adminTime: adminTime ?? 0,
+      ownWorkTime: ownWorkTime ?? 0,
+      studyTime: studyTime ?? 0,
+      testingTime: testingTime ?? 0,
     };
 
     await api.submitWeeklyReport(newWeeklyReport, token);
@@ -59,7 +58,9 @@ export default function NewWeeklyReport(): JSX.Element {
                 setWeek(weekNumber);
               }}
               onKeyDown={(event) => {
-                event.preventDefault();
+                const keyValue = event.key;
+                if (!/\d/.test(keyValue) && keyValue !== "Backspace")
+                  event.preventDefault();
               }}
               onPaste={(event) => {
                 event.preventDefault();

frontend/src/Components/UserInfoModal.tsx

@@ -0,0 +1,54 @@
+import { Link } from "react-router-dom";
+import Button from "./Button";
+import DeleteUser from "./DeleteUser";
+import UserProjectListAdmin from "./UserProjectListAdmin";
+
+function UserInfoModal(props: {
+  isVisible: boolean;
+  username: string;
+  onClose: () => void;
+}): JSX.Element {
+  if (!props.isVisible) return <></>;
+
+  return (
+    <div
+      className="fixed inset-0 bg-black bg-opacity-30 backdrop-blur-sm 
+      flex justify-center items-center"
+    >
+      <div className="border-4 border-black bg-white p-2 rounded-lg text-center">
+        <p className="font-bold text-[30px]">{props.username}</p>
+        <Link to="/AdminChangeUserName">
+          <p className="mb-[20px] hover:font-bold hover:cursor-pointer underline">
+            (Change Username)
+          </p>
+        </Link>
+        <div>
+          <h2 className="font-bold text-[22px] mb-[20px]">
+            Member of these projects:
+          </h2>
+          <div className="pr-6 pl-6">
+            <UserProjectListAdmin />
+          </div>
+        </div>
+        <div className="items-center space-x-6 pr-6 pl-6">
+          <Button
+            text={"Delete"}
+            onClick={function (): void {
+              DeleteUser({ usernameToDelete: props.username });
+            }}
+            type="button"
+          />
+          <Button
+            text={"Close"}
+            onClick={function (): void {
+              props.onClose();
+            }}
+            type="button"
+          />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default UserInfoModal;

frontend/src/Components/UserListAdmin.tsx

@@ -1,5 +1,6 @@
-import { Link } from "react-router-dom";
+import { useState } from "react";
 import { PublicUser } from "../Types/goTypes";
+import UserInfoModal from "./UserInfoModal";
 
 /**
  * The props for the UserProps component
@@ -9,27 +10,52 @@ interface UserProps {
 }
 
 /**
- * A list of users for admin manage users page, that links admin to the right user page
- * thanks to the state property
- * @param props - The users to display
+ * A list of users for admin manage users page, that sets an onClick
+ * function for eact user <li> element, which displays a modul with
+ * user info.
+ * @param props - An array of users users to display
  * @returns {JSX.Element} The user list
  * @example
- * const users = [{ id: 1, userName: "Random name" }];
+ * const users = [{ id: 1, userName: "ExampleName" }];
  * return <UserList users={users} />;
  */
 
 export function UserListAdmin(props: UserProps): JSX.Element {
+  const [modalVisible, setModalVisible] = useState(false);
+  const [username, setUsername] = useState("");
+
+  const handleClick = (username: string): void => {
+    setUsername(username);
+    setModalVisible(true);
+  };
+
+  const handleClose = (): void => {
+    setUsername("");
+    setModalVisible(false);
+  };
+
   return (
-    <div>
-      <ul className="font-bold underline text-[30px] cursor-pointer padding">
-        {props.users.map((user) => (
-          <Link to="/adminUserInfo" key={user.userId} state={user.username}>
-            <li className="pt-5" key={user.userId}>
+    <>
+      <UserInfoModal
+        onClose={handleClose}
+        isVisible={modalVisible}
+        username={username}
+      />
+      <div>
+        <ul className="font-bold underline text-[30px] cursor-pointer padding">
+          {props.users.map((user) => (
+            <li
+              className="pt-5"
+              key={user.userId}
+              onClick={() => {
+                handleClick(user.username);
+              }}
+            >
               {user.username}
             </li>
-          </Link>
-        ))}
-      </ul>
-    </div>
+          ))}
+        </ul>
+      </div>
+    </>
   );
 }

frontend/src/Components/UserProjectListAdmin.tsx

@@ -1,17 +1,17 @@
-import React, { useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 import { api } from "../API/API";
 import { Project } from "../Types/goTypes";
 
-const UserProjectListAdmin: React.FC = () => {
+function UserProjectListAdmin(): JSX.Element {
   const [projects, setProjects] = useState<Project[]>([]);
 
   useEffect(() => {
     const fetchProjects = async (): Promise<void> => {
       try {
         const token = localStorage.getItem("accessToken") ?? "";
-        const username = "NoUser"; // getUsernameFromContext(); // Assuming you have a function to get the username from your context
+        // const username = props.username;
 
-        const response = await api.getUserProjects(username, token);
+        const response = await api.getUserProjects(token);
         if (response.success) {
           setProjects(response.data ?? []);
         } else {
@@ -26,18 +26,16 @@ const UserProjectListAdmin: React.FC = () => {
   }, []);
 
   return (
-    <div>
-      <h2>User Projects</h2>
+    <div className="border-2 border-black bg-white p-2 rounded-lg text-center">
       <ul>
         {projects.map((project) => (
           <li key={project.id}>
             <span>{project.name}</span>
-            {/* Add any additional project details you want to display */}
           </li>
         ))}
       </ul>
     </div>
   );
-};
+}
 
 export default UserProjectListAdmin;

frontend/src/Pages/AdminPages/AdminChangeUsername.tsx

@@ -1,3 +1,4 @@
+import BackButton from "../../Components/BackButton";
 import BasicWindow from "../../Components/BasicWindow";
 import Button from "../../Components/Button";
 
@@ -13,13 +14,7 @@ function AdminChangeUsername(): JSX.Element {
         }}
         type="button"
       />
-      <Button
-        text="Back"
-        onClick={(): void => {
-          return;
-        }}
-        type="button"
-      />
+      <BackButton />
     </>
   );
 

frontend/src/Pages/App.tsx

@@ -13,7 +13,7 @@ function App(): JSX.Element {
     } else if (authority === 2) {
       navigate("/pm");
     } else if (authority === 3) {
-      navigate("/user");
+      navigate("/yourProjects");
     }
   }, [authority, navigate]);
 

frontend/src/Pages/NotFoundPage.tsx

@@ -0,0 +1,18 @@
+import Button from "../Components/Button";
+
+export default function NotFoundPage(): JSX.Element {
+  return (
+    <div className="flex flex-col items-center justify-center min-h-screen bg-white">
+      <h1 className="text-[30px]">404 Page Not Found</h1>
+      <a href="/">
+        <Button
+          text="Go to Home Page"
+          onClick={(): void => {
+            localStorage.clear();
+          }}
+          type="button"
+        />
+      </a>
+    </div>
+  );
+}

frontend/src/Pages/UserPages/UserProjectPage.tsx

@@ -1,18 +1,20 @@
-import { Link, useLocation } from "react-router-dom";
+import { Link, useLocation, useParams } from "react-router-dom";
 import BasicWindow from "../../Components/BasicWindow";
 import BackButton from "../../Components/BackButton";
 
 function UserProjectPage(): JSX.Element {
+  const { projectName } = useParams();
+
   const content = (
     <>
       <h1 className="font-bold text-[30px] mb-[20px]">{useLocation().state}</h1>
       <div className="border-4 border-black bg-white flex flex-col items-center justify-center min-h-[65vh] h-fit w-[50vw] rounded-3xl content-center overflow-scroll space-y-[10vh] p-[30px]">
-        <Link to="/project-page">
+        <Link to={`/projectPage/${projectName}`}>
           <h1 className="font-bold underline text-[30px] cursor-pointer">
             Your Time Reports
           </h1>
         </Link>
-        <Link to="/new-time-report">
+        <Link to={`/newTimeReport/${projectName}`}>
           <h1 className="font-bold underline text-[30px] cursor-pointer">
             New Time Report
           </h1>

frontend/src/Pages/YourProjectsPage.tsx

@@ -11,9 +11,8 @@ function UserProjectPage(): JSX.Element {
   const [selectedProject, setSelectedProject] = useState("");
 
   const getProjects = async (): Promise<void> => {
-    const username = localStorage.getItem("username") ?? ""; // replace with actual username
-    const token = localStorage.getItem("accessToken") ?? ""; // replace with actual token
-    const response = await api.getUserProjects(username, token);
+    const token = localStorage.getItem("accessToken") ?? "";
+    const response = await api.getUserProjects(token);
     console.log(response);
     if (response.success) {
       setProjects(response.data ?? []);
@@ -36,7 +35,7 @@ function UserProjectPage(): JSX.Element {
       <div className="border-4 border-black bg-white flex flex-col items-center justify-center min-h-[65vh] h-fit w-[50vw] rounded-3xl content-center overflow-scroll space-y-[10vh] p-[30px]">
         {projects.map((project, index) => (
           <Link
-            to={`/project/${project.id}`}
+            to={`/project/${project.name}`}
             onClick={() => {
               handleProjectClick(project.name);
             }}

frontend/src/main.tsx

@@ -29,12 +29,14 @@ import AdminProjectManageMembers from "./Pages/AdminPages/AdminProjectManageMemb
 import AdminProjectStatistics from "./Pages/AdminPages/AdminProjectStatistics.tsx";
 import AdminProjectViewMemberInfo from "./Pages/AdminPages/AdminProjectViewMemberInfo.tsx";
 import AdminProjectPage from "./Pages/AdminPages/AdminProjectPage.tsx";
+import NotFoundPage from "./Pages/NotFoundPage.tsx";
 
 // This is where the routes are mounted
 const router = createBrowserRouter([
   {
     path: "/",
     element: <App />,
+    errorElement: <NotFoundPage />,
   },
   {
     path: "/admin",
@@ -44,30 +46,26 @@ const router = createBrowserRouter([
     path: "/pm",
     element: <YourProjectsPage />,
   },
-  {
-    path: "/user",
-    element: <YourProjectsPage />,
-  },
   {
     path: "/yourProjects",
     element: <YourProjectsPage />,
   },
   {
-    path: "/editTimeReport",
-    element: <UserEditTimeReportPage />,
-  },
-  {
-    path: "/newTimeReport",
-    element: <UserNewTimeReportPage />,
-  },
-  {
-    path: "/project",
+    path: "/project/:projectName",
     element: <UserProjectPage />,
   },
   {
-    path: "/projectPage",
+    path: "/newTimeReport/:projectName",
+    element: <UserNewTimeReportPage />,
+  },
+  {
+    path: "/projectPage/:projectName",
     element: <UserViewTimeReportsPage />,
   },
+  {
+    path: "/editTimeReport",
+    element: <UserEditTimeReportPage />,
+  },
   {
     path: "/changeRole",
     element: <PMChangeRole />,