add password change functionality with frontend integration

frontend/src/components/Header.tsx

@@ -1,10 +1,27 @@
 import React from "react";
+import { changePW } from "../utils/userHandler";
+import { myToast } from "../utils/toastify";
 
 type HeaderProps = {
   onLogout: () => void;
 };
 
 const Header: React.FC<HeaderProps> = ({ onLogout }) => {
+  const passwordForm = () => {
+    const oldPW = window.prompt("Altes Passwort");
+    const newPW = window.prompt("Neues Passwort");
+    const repeatNewPW = window.prompt("Neues Passwort wiederholen");
+    if (oldPW && newPW && repeatNewPW) {
+      if (newPW === repeatNewPW) {
+        changePW(oldPW, newPW);
+      } else {
+        myToast("Die neuen Passwörter stimmen nicht überein.", "error");
+      }
+    } else {
+      myToast("Bitte alle Felder ausfüllen.", "error");
+    }
+  };
+
   return (
     <header className="mb-4 sm:mb-6">
       <div className="flex items-start justify-between gap-3">
@@ -33,6 +50,13 @@ const Header: React.FC<HeaderProps> = ({ onLogout }) => {
             Source Code
           </button>
         </a>
+        <button
+          type="button"
+          onClick={passwordForm}
+          className="h-9 px-3 rounded-md border border-slate-300 text-slate-700 hover:bg-slate-100 transition"
+        >
+          Passwort ändern
+        </button>
       </div>
     </header>
   );

frontend/src/utils/userHandler.ts

@@ -137,3 +137,22 @@ export const onTake = async (loanID: number) => {
   myToast("Ausleihe erfolgreich ausgeliehen!", "success");
   return true;
 };
+
+export const changePW = async (oldPassword: string, newPassword: string) => {
+  const response = await fetch("http://localhost:8002/api/changePassword", {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+      Authorization: `Bearer ${Cookies.get("token") || ""}`,
+    },
+    body: JSON.stringify({ oldPassword, newPassword }),
+  });
+
+  if (!response.ok) {
+    myToast("Fehler beim Ändern des Passworts", "error");
+    return false;
+  }
+
+  myToast("Passwort erfolgreich geändert!", "success");
+  return true;
+};