ChangeUserPassword.tsx created and implemented + minor fix in API.ts

frontend/src/API/API.ts

@@ -1065,7 +1065,7 @@ export const api: API = {
   ): Promise<APIResponse<string>> {
     try {
       const response = await fetch(
-        `/api/changePassword/${username}?newPassword=${newPassword}`,
+        `/api/changeUserPassword/${username}?newPassword=${newPassword}`,
         {
           method: "PUT",
           headers: {

frontend/src/Components/ChangeUserPassword.tsx

@@ -0,0 +1,36 @@
+import { APIResponse, api } from "../API/API";
+
+/**
+ * Changes the password of a user
+ * @param {string} props.username - The username of the user
+ * @param {string} props.newPassword - The new password
+ * @returns {void} - Nothing
+ */
+export default function ChangeUserPassword(props: {
+  username: string;
+  newPassword: string;
+}): void {
+  if (props.username === localStorage.getItem("username")) {
+    alert("You cannot change admin password");
+    return;
+  }
+  api
+    .changeUserPassword(
+      props.username,
+      props.newPassword,
+      localStorage.getItem("accessToken") ?? "",
+    )
+    .then((response: APIResponse<string>) => {
+      if (response.success) {
+        alert("Password changed successfully");
+        location.reload();
+      } else {
+        alert("Password not changed");
+        console.error(response.message);
+      }
+    })
+    .catch((error) => {
+      alert("Password not changed");
+      console.error("An error occurred during change:", error);
+    });
+}

frontend/src/Components/UserInfoModal.tsx

@@ -12,6 +12,7 @@ import {
   usernameLowLimit,
   usernameUpLimit,
 } from "../Data/constants";
+import ChangeUserPassword from "./ChangeUserPassword";
 
 function UserInfoModal(props: {
   isVisible: boolean;
@@ -94,9 +95,10 @@ function UserInfoModal(props: {
     if (
       confirm(`Are you sure you want to change password of ${props.username}?`)
     ) {
-      //TODO: insert change password functionality
+      ChangeUserPassword({
-      alert("Not implemented yet");
+        username: props.username,
-      setNewPassword("");
+        newPassword: newPassword,
+      });
     } else {
       alert("Password was not changed!");
     }