add basic user management

frontend/src/components/SettingsMenu.tsx

@@ -0,0 +1,61 @@
+// src/components/basics/SettingsMenu.tsx
+import {X} from "lucide-react";
+import {useNavigate} from "react-router-dom";
+import type {LoginResponseDto} from "../api/dtos/LoginResponseDto";
+import {getUserUrl} from "../routes.ts";
+
+/**
+ * Overlay settings menu that displays current user info
+ * and provides navigation to user management.
+ */
+type SettingsMenuProps = {
+    onClose: () => void;
+};
+
+export function SettingsMenu({onClose}: SettingsMenuProps) {
+    const navigate = useNavigate();
+    const storedSession = localStorage.getItem("session");
+    const loginData: LoginResponseDto | null = storedSession
+        ? JSON.parse(storedSession)
+        : null;
+    const user = loginData?.userData;
+
+    return (
+        <div className="fixed inset-0 bg-black/40 flex justify-end z-50">
+            <div className="bg-white dark:bg-gray-800 w-80 p-6 shadow-xl flex flex-col">
+                {/* Close button */}
+                <button
+                    onClick={onClose}
+                    className="self-end text-gray-500 hover:text-gray-800"
+                >
+                    <X/>
+                </button>
+
+                <h2 className="text-xl font-semibold mb-4">Einstellungen</h2>
+
+                {user ? (
+                    <>
+                        <p className="text-gray-800 dark:text-gray-100 font-medium">
+                            {user.firstName} {user.lastName}
+                        </p>
+                        <p className="text-gray-600 dark:text-gray-400 text-sm mb-6">
+                            {user.role === "admin" ? "Administrator" : "Benutzer"}
+                        </p>
+
+                        <button
+                            onClick={() => {
+                                navigate(getUserUrl());
+                                onClose();
+                            }}
+                            className="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600 transition"
+                        >
+                            Benutzerverwaltung
+                        </button>
+                    </>
+                ) : (
+                    <p className="text-gray-500">Nicht eingeloggt</p>
+                )}
+            </div>
+        </div>
+    );
+}