Can now remove users from projects

frontend/src/Components/MemberInfoModal.tsx

@@ -1,8 +1,8 @@
 import Button from "./Button";
-import DeleteUser from "./DeleteUser";
 import UserProjectListAdmin from "./UserProjectListAdmin";
 import { useState } from "react";
 import ChangeRoleView from "./ChangeRoleView";
+import RemoveUserFromProj from "./RemoveUserFromProj";
 
 function MemberInfoModal(props: {
   projectName: string;
@@ -42,13 +42,16 @@ function MemberInfoModal(props: {
           <UserProjectListAdmin username={props.username} />
           <div className="items-center space-x-6">
             <Button
-              text={"Delete"}
+              text={"Remove"}
               onClick={function (): void {
                 if (
-                  window.confirm("Are you sure you want to delete this user?")
+                  window.confirm(
+                    "Are you sure you want to remove this user from the project?",
+                  )
                 ) {
-                  DeleteUser({
-                    usernameToDelete: props.username,
+                  RemoveUserFromProj({
+                    userToRemove: props.username,
+                    projectName: props.projectName,
                   });
                 }
               }}

frontend/src/Components/RemoveUserFromProj.tsx

@@ -0,0 +1,41 @@
+import { api, APIResponse } from "../API/API";
+
+/**
+ * Removes a user from a project
+ * @param {string} props.usernameToDelete - The username of user to remove
+ * @param {string} props.projectName - Project to remove user from
+ * @returns {void}
+ * @example
+ * const exampleUsername = "user";
+ * const exampleProjectName "project";
+ * RemoveUserFromProj({ userToRemove: exampleUsername, projectName: exampleProjectName });
+ */
+
+export default function RemoveUserFromProj(props: {
+  userToRemove: string;
+  projectName: string;
+}): void {
+  if (props.userToRemove === localStorage.getItem("username")) {
+    alert("Cannot remove yourself");
+    return;
+  }
+  api
+    .removeUserFromProject(
+      props.userToRemove,
+      props.projectName,
+      localStorage.getItem("accessToken") ?? "",
+    )
+    .then((response: APIResponse<void>) => {
+      if (response.success) {
+        alert(`${props.userToRemove} has been removed!`);
+        location.reload();
+      } else {
+        alert(`${props.userToRemove} has not been removed due to an error`);
+        console.error(response.message);
+      }
+    })
+    .catch((error) => {
+      alert(`${props.userToRemove} has not been removed due to an error`);
+      console.error("An error occurred during deletion:", error);
+    });
+}