From 624d0784e0d2ff2f426a77a33553167365ba02a6 Mon Sep 17 00:00:00 2001
From: Aman koli <2025.amana@isu.ac.in>
Date: Fri, 26 Jun 2026 17:33:51 +0530
Subject: [PATCH] feat(dashboard): [dashboard] create user avatar dropdown menu
 in navbar closes #604

---
 dashboard/src/App.tsx                         |   5 +
 .../src/components/UserAvatarDropdown.tsx     | 276 ++++++++++++++++++
 package-lock.json                             |  84 +++++-
 3 files changed, 356 insertions(+), 9 deletions(-)
 create mode 100644 dashboard/src/components/UserAvatarDropdown.tsx

diff --git a/dashboard/src/App.tsx b/dashboard/src/App.tsx
index e0c2baac..0512d9af 100644
--- a/dashboard/src/App.tsx
+++ b/dashboard/src/App.tsx
@@ -17,6 +17,7 @@ import type { UiConfig } from './types';
 import { LogoMark } from './components/LogoMark';
 import { RequirementList } from './components/RequirementList';
 import { NotificationBell } from './components/NotificationBell';
+import { UserAvatarDropdown } from './components/UserAvatarDropdown';
 
 // Lazy-load heavy tab views so they are only fetched when first visited
 const DashboardOverview = lazy(() => import('./components/DashboardOverview'));
@@ -230,6 +231,10 @@ const App = () => {
               <Wallet size={18} aria-hidden="true" />
               <span className="text-sm font-medium">Connect Wallet</span>
             </button>
+            <UserAvatarDropdown
+              onSettings={() => setActiveTab('settings')}
+              onNotifications={() => setActiveTab('notifications')}
+            />
           </div>
         </header>
 
diff --git a/dashboard/src/components/UserAvatarDropdown.tsx b/dashboard/src/components/UserAvatarDropdown.tsx
new file mode 100644
index 00000000..018a2ea0
--- /dev/null
+++ b/dashboard/src/components/UserAvatarDropdown.tsx
@@ -0,0 +1,276 @@
+import React, { useState, useRef, useEffect } from 'react';
+import { motion, AnimatePresence } from 'framer-motion';
+import {
+  Settings,
+  LogOut,
+  ChevronDown,
+  Shield,
+  Bell,
+  HelpCircle,
+  Copy,
+  Check,
+} from 'lucide-react';
+
+interface UserAvatarDropdownProps {
+  /** Display name shown in the avatar and dropdown header */
+  displayName?: string;
+  /** Email or sub-label shown under the display name */
+  email?: string;
+  /** Role badge label */
+  role?: string;
+  /** Callback when "Settings" is selected */
+  onSettings?: () => void;
+  /** Callback when "Notifications" is selected */
+  onNotifications?: () => void;
+  /** Callback when "Sign Out" is selected */
+  onSignOut?: () => void;
+}
+
+/** Derive initials from a display name (up to 2 characters). */
+const getInitials = (name: string): string => {
+  const parts = name.trim().split(/\s+/);
+  if (parts.length === 1) return parts[0].slice(0, 2).toUpperCase();
+  return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
+};
+
+/** Deterministic gradient colour based on name string. */
+const getAvatarGradient = (name: string): string => {
+  const gradients = [
+    'from-blue-500 to-violet-600',
+    'from-teal-500 to-cyan-600',
+    'from-amber-500 to-orange-600',
+    'from-rose-500 to-pink-600',
+    'from-emerald-500 to-green-600',
+    'from-indigo-500 to-purple-600',
+  ];
+  let hash = 0;
+  for (let i = 0; i < name.length; i++) {
+    hash = (hash << 5) - hash + name.charCodeAt(i);
+    hash |= 0;
+  }
+  return gradients[Math.abs(hash) % gradients.length];
+};
+
+export const UserAvatarDropdown: React.FC<UserAvatarDropdownProps> = ({
+  displayName = 'Institutional Admin',
+  email = 'admin@anchorpoint.local',
+  role = 'Admin',
+  onSettings,
+  onNotifications,
+  onSignOut,
+}) => {
+  const [isOpen, setIsOpen] = useState(false);
+  const [copied, setCopied] = useState(false);
+  const containerRef = useRef<HTMLDivElement>(null);
+
+  const initials = getInitials(displayName);
+  const gradient = getAvatarGradient(displayName);
+
+  /* Close on outside click */
+  useEffect(() => {
+    const handleOutside = (e: MouseEvent) => {
+      if (containerRef.current && !containerRef.current.contains(e.target as Node)) {
+        setIsOpen(false);
+      }
+    };
+    if (isOpen) document.addEventListener('mousedown', handleOutside);
+    return () => document.removeEventListener('mousedown', handleOutside);
+  }, [isOpen]);
+
+  /* Close on Escape */
+  useEffect(() => {
+    const handleKey = (e: KeyboardEvent) => {
+      if (e.key === 'Escape') setIsOpen(false);
+    };
+    if (isOpen) document.addEventListener('keydown', handleKey);
+    return () => document.removeEventListener('keydown', handleKey);
+  }, [isOpen]);
+
+  const copyEmail = async () => {
+    try {
+      await navigator.clipboard.writeText(email);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2000);
+    } catch {
+      /* clipboard not available */
+    }
+  };
+
+  const handleAction = (cb?: () => void) => {
+    setIsOpen(false);
+    cb?.();
+  };
+
+  const menuItems = [
+    {
+      id: 'settings',
+      icon: Settings,
+      label: 'Account Settings',
+      description: 'Manage preferences',
+      onClick: () => handleAction(onSettings),
+    },
+    {
+      id: 'notifications',
+      icon: Bell,
+      label: 'Notifications',
+      description: 'View alerts & events',
+      onClick: () => handleAction(onNotifications),
+    },
+    {
+      id: 'kyc',
+      icon: Shield,
+      label: 'KYC / Compliance',
+      description: 'Verification status',
+      onClick: () => handleAction(),
+    },
+    {
+      id: 'help',
+      icon: HelpCircle,
+      label: 'Help & Support',
+      description: 'Docs & contact',
+      onClick: () => handleAction(),
+    },
+  ];
+
+  return (
+    <div className="relative" ref={containerRef}>
+      {/* Trigger button */}
+      <button
+        id="user-avatar-trigger"
+        onClick={() => setIsOpen((prev) => !prev)}
+        aria-haspopup="true"
+        aria-expanded={isOpen}
+        aria-controls="user-avatar-dropdown"
+        aria-label={`User menu for ${displayName}`}
+        className="flex items-center gap-2 rounded-lg border border-slate-700 bg-slate-900 px-2 py-1.5 transition-all hover:bg-slate-800 hover:border-slate-600 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50"
+      >
+        {/* Avatar circle */}
+        <span
+          className={`flex h-8 w-8 items-center justify-center rounded-full bg-gradient-to-br ${gradient} text-xs font-bold text-white shadow-inner select-none`}
+          aria-hidden="true"
+        >
+          {initials}
+        </span>
+
+        {/* Name - hidden on small screens */}
+        <span className="hidden text-sm font-medium text-slate-200 sm:block max-w-[120px] truncate">
+          {displayName}
+        </span>
+
+        {/* Animated chevron */}
+        <motion.span
+          animate={{ rotate: isOpen ? 180 : 0 }}
+          transition={{ duration: 0.2 }}
+          className="hidden sm:block"
+          aria-hidden="true"
+        >
+          <ChevronDown size={14} className="text-slate-400" />
+        </motion.span>
+      </button>
+
+      {/* Dropdown panel */}
+      <AnimatePresence>
+        {isOpen && (
+          <motion.div
+            id="user-avatar-dropdown"
+            role="menu"
+            aria-label="User account menu"
+            initial={{ opacity: 0, y: -8, scale: 0.97 }}
+            animate={{ opacity: 1, y: 0, scale: 1 }}
+            exit={{ opacity: 0, y: -8, scale: 0.97 }}
+            transition={{ duration: 0.18, ease: 'easeOut' }}
+            className="absolute right-0 z-50 mt-2 w-72 origin-top-right rounded-xl border border-slate-700/80 bg-slate-900/95 shadow-2xl backdrop-blur-md"
+          >
+            {/* Header */}
+            <div className="flex items-center gap-3 border-b border-slate-800 p-4">
+              <span
+                className={`flex h-11 w-11 shrink-0 items-center justify-center rounded-full bg-gradient-to-br ${gradient} text-sm font-bold text-white shadow-lg select-none`}
+                aria-hidden="true"
+              >
+                {initials}
+              </span>
+              <div className="min-w-0 flex-1">
+                <p className="truncate text-sm font-semibold text-slate-100">{displayName}</p>
+                <button
+                  onClick={copyEmail}
+                  title="Copy email address"
+                  className="group mt-0.5 flex items-center gap-1 text-xs text-slate-500 transition-colors hover:text-slate-300 focus-visible:outline-none"
+                  aria-label={copied ? 'Email copied' : `Copy email: ${email}`}
+                >
+                  <span className="truncate">{email}</span>
+                  {copied ? (
+                    <Check size={11} className="shrink-0 text-emerald-400" aria-hidden="true" />
+                  ) : (
+                    <Copy
+                      size={11}
+                      className="shrink-0 opacity-0 transition-opacity group-hover:opacity-100"
+                      aria-hidden="true"
+                    />
+                  )}
+                </button>
+              </div>
+              {/* Role badge */}
+              <span className="shrink-0 rounded-full border border-primary/30 bg-primary/10 px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wider text-primary">
+                {role}
+              </span>
+            </div>
+
+            {/* Menu items */}
+            <div className="p-2" role="none">
+              {menuItems.map((item) => (
+                <button
+                  key={item.id}
+                  id={`user-menu-item-${item.id}`}
+                  role="menuitem"
+                  onClick={item.onClick}
+                  className="flex w-full items-center gap-3 rounded-lg px-3 py-2.5 text-left transition-all hover:bg-slate-800/70 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40 group"
+                >
+                  <span className="flex h-8 w-8 shrink-0 items-center justify-center rounded-md border border-slate-700 bg-slate-800 transition-colors group-hover:border-primary/30 group-hover:bg-primary/10">
+                    <item.icon
+                      size={15}
+                      className="text-slate-400 transition-colors group-hover:text-primary"
+                      aria-hidden="true"
+                    />
+                  </span>
+                  <span className="min-w-0 flex-1">
+                    <span className="block text-sm font-medium text-slate-200">{item.label}</span>
+                    <span className="block text-xs text-slate-500">{item.description}</span>
+                  </span>
+                </button>
+              ))}
+            </div>
+
+            {/* Divider + Sign out */}
+            <div className="border-t border-slate-800 p-2">
+              <button
+                id="user-menu-item-signout"
+                role="menuitem"
+                onClick={() => handleAction(onSignOut)}
+                className="flex w-full items-center gap-3 rounded-lg px-3 py-2.5 text-left transition-all hover:bg-red-500/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-red-500/40 group"
+              >
+                <span className="flex h-8 w-8 shrink-0 items-center justify-center rounded-md border border-slate-700 bg-slate-800 transition-colors group-hover:border-red-500/30 group-hover:bg-red-500/10">
+                  <LogOut
+                    size={15}
+                    className="text-slate-400 transition-colors group-hover:text-red-400"
+                    aria-hidden="true"
+                  />
+                </span>
+                <span className="min-w-0 flex-1">
+                  <span className="block text-sm font-medium text-slate-200 group-hover:text-red-300 transition-colors">
+                    Sign Out
+                  </span>
+                  <span className="block text-xs text-slate-500">End your session</span>
+                </span>
+              </button>
+            </div>
+
+            {/* Footer version pill */}
+            <div className="flex justify-center border-t border-slate-800/50 py-2">
+              <span className="text-[10px] text-slate-600 select-none">AnchorPoint · v1.0.0</span>
+            </div>
+          </motion.div>
+        )}
+      </AnimatePresence>
+    </div>
+  );
+};
diff --git a/package-lock.json b/package-lock.json
index 8491af16..803ac63f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -705,6 +705,7 @@
       "version": "8.20.0",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.20.0.tgz",
       "integrity": "sha512-Thbli+OlOj+iMPYFBVBfJ3OmCAnaSyNn4M1vz9T6Gka5Jt9ba/HIR56joy65tY6kx/FCF5VXNB819Y7/GUrBGA==",
+      "peer": true,
       "dependencies": {
         "fast-deep-equal": "^3.1.3",
         "fast-uri": "^3.0.1",
@@ -1143,6 +1144,7 @@
       "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.29.7.tgz",
       "integrity": "sha512-RgHBCvtjbOK2gXSNBNIkNoEc9qoVEtau3hj8gEqKQuL3HZAibKarWFEI3Lfm6EYKkLalOh8eSrj9b+ch9H/VBA==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.29.7",
         "@babel/generator": "^7.29.7",
@@ -1675,6 +1677,7 @@
       "resolved": "https://registry.npmjs.org/@bull-board/ui/-/ui-5.21.0.tgz",
       "integrity": "sha512-eH8QQwIHgCXxNEmlg9EZr3fSvno/bdbgBGfSQO5s9c9n9eDEaKX46ambKSPvgFPtwSdiV1AYQEa/3fGSebVIxg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@bull-board/api": "5.21.0"
       }
@@ -1847,6 +1850,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=20.19.0"
       },
@@ -1895,6 +1899,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=20.19.0"
       }
@@ -3589,6 +3594,7 @@
       "version": "1.8.0",
       "resolved": "https://registry.npmjs.org/@noble/hashes/-/hashes-1.8.0.tgz",
       "integrity": "sha512-jCs9ldd7NwzpgXDIf6P3+NrHh9/sD6CQdxHyjQI+h/6rDNo88ypBxxz45UDuZHz9r3tNz7N/VInSVoVdtXEI4A==",
+      "peer": true,
       "engines": {
         "node": "^14.21.3 || >=16"
       },
@@ -3672,6 +3678,7 @@
       "resolved": "https://registry.npmjs.org/@opentelemetry/api/-/api-1.9.1.tgz",
       "integrity": "sha512-gLyJlPHPZYdAk1JENA9LeHejZe1Ti77/pTeFm/nMXmQH/HFZlcS/O2XJB+L8fkbrNSqhdtlvjBVjxwUYanNH5Q==",
       "license": "Apache-2.0",
+      "peer": true,
       "engines": {
         "node": ">=8.0.0"
       }
@@ -5706,6 +5713,7 @@
       "integrity": "sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.10.4",
         "@babel/runtime": "^7.12.5",
@@ -6141,6 +6149,7 @@
       "version": "25.9.1",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-25.9.1.tgz",
       "integrity": "sha512-xfrlY7UD5rMJk3ZVJP8BNzS28J36YJg+xp+LPXV1TdWxr8uMH5A860QNxYDGQe/ylDSgjxE52Q9VnO7p75tJxg==",
+      "peer": true,
       "dependencies": {
         "undici-types": ">=7.24.0 <7.24.7"
       }
@@ -6205,6 +6214,7 @@
       "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.29.tgz",
       "integrity": "sha512-ch0qJdr2JY0r04NXSprbK6TXOgnaJ1Tz23fm5W+z0/CBah6BSBc3n96h7K9GOtwh0HrilNWHIBzE1Ko4Dcw/Wg==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "@types/prop-types": "*",
         "csstype": "^3.2.2"
@@ -6215,6 +6225,7 @@
       "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.7.tgz",
       "integrity": "sha512-MEe3UeoENYVFXzoXEWsvcpg6ZvlrFNlOQ7EOsvhI3CfAXwzPfO8Qwuxd40nepsYKqyyVQnTdEfv68q91yLcKrQ==",
       "dev": true,
+      "peer": true,
       "peerDependencies": {
         "@types/react": "^18.0.0"
       }
@@ -6399,6 +6410,7 @@
       "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-7.18.0.tgz",
       "integrity": "sha512-4Z+L8I2OqhZV8qA132M4wNL30ypZGYOQVBfMgxDH/K5UX0PNqTu1c6za9ST5r9+tavvHiTWmBnKzpCJ/GlVFtg==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "@typescript-eslint/scope-manager": "7.18.0",
         "@typescript-eslint/types": "7.18.0",
@@ -6837,6 +6849,7 @@
       "version": "8.16.0",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.16.0.tgz",
       "integrity": "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==",
+      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -7543,6 +7556,7 @@
           "url": "https://github.com/sponsors/ai"
         }
       ],
+      "peer": true,
       "dependencies": {
         "baseline-browser-mapping": "^2.10.12",
         "caniuse-lite": "^1.0.30001782",
@@ -9054,6 +9068,7 @@
       "integrity": "sha512-rRqJg/6gd538VHvR3PSrdRBb/1Vy2YfzHqzvbhGIQpDRKIa4FgV/54b5Q1xYSxOOwKvjXweS26E0Q+nAMwp2pQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "ansi-colors": "^4.1.1",
         "strip-ansi": "^6.0.1"
@@ -9137,6 +9152,7 @@
       "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.12.tgz",
       "integrity": "sha512-bbPBYYrtZbkt6Os6FiTLCTFxvq4tt3JKall1vRwshA3fdVztsLAatFaZobhkBC8/BrPetoa0oksYoKXoG4ryJg==",
       "hasInstallScript": true,
+      "peer": true,
       "bin": {
         "esbuild": "bin/esbuild"
       },
@@ -9216,6 +9232,7 @@
       "integrity": "sha512-ypowyDxpVSYpkXr9WPv2PAZCtNip1Mv5KTW0SCurXv/9iOpcrH9PaqUElksqEB6pChqHGDRCFTyrZlGhnLNGiA==",
       "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.2.0",
         "@eslint-community/regexpp": "^4.6.1",
@@ -9492,6 +9509,7 @@
       "version": "4.22.2",
       "resolved": "https://registry.npmjs.org/express/-/express-4.22.2.tgz",
       "integrity": "sha512-IuL+Elrou2ZvCFHs18/CIzy2Nzvo25nZ1/D2eIZlz7c+QUayAcYoiM2BthCjs+EBHVpjYjcuLDAiCWgeIX3X1Q==",
+      "peer": true,
       "dependencies": {
         "accepts": "~1.3.8",
         "array-flatten": "1.1.1",
@@ -9537,6 +9555,7 @@
       "version": "7.5.1",
       "resolved": "https://registry.npmjs.org/express-rate-limit/-/express-rate-limit-7.5.1.tgz",
       "integrity": "sha512-7iN8iPMDzOMHPUYllBEsQdWVB6fPDMPqwjBaFrgr4Jgr/+okjvzAy+UHlYYL/Vs0OsOrMkwS6PJDkFlJwoxUnw==",
+      "peer": true,
       "engines": {
         "node": ">= 16"
       },
@@ -11357,6 +11376,7 @@
       "resolved": "https://registry.npmjs.org/jest/-/jest-29.7.0.tgz",
       "integrity": "sha512-NIy3oAFp9shda19hy4HK0HRTWKtPJmGdnvywu01nOqNC2vZg+Z+fvJDxpMQA88eb2I9EcafcdjYgsDthnYTvGw==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "@jest/core": "^29.7.0",
         "@jest/types": "^29.6.3",
@@ -11897,6 +11917,7 @@
       "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.7.0.tgz",
       "integrity": "sha512-AC/7JofJvZGrrneWNaEnJeOLUx+JlGt7tNa0wZiRPT4MY1wmfKjt2+6O2p2uz2+skll8OZZmJMNqeke7kKbNgQ==",
       "devOptional": true,
+      "peer": true,
       "bin": {
         "jiti": "lib/jiti-cli.mjs"
       }
@@ -13714,6 +13735,7 @@
           "url": "https://github.com/sponsors/ai"
         }
       ],
+      "peer": true,
       "dependencies": {
         "nanoid": "^3.3.12",
         "picocolors": "^1.1.1",
@@ -13982,6 +14004,7 @@
       "integrity": "sha512-++ZJ0ijLrDJF6hNB4t4uxg2br3fC4H9Yc9tcbjr2fcNFP3rh/SBNrAgjhsqBU4Ght8JPrVofG/ZkXfnSfnYsFg==",
       "devOptional": true,
       "hasInstallScript": true,
+      "peer": true,
       "dependencies": {
         "@prisma/config": "6.19.3",
         "@prisma/engines": "6.19.3"
@@ -14242,6 +14265,7 @@
       "version": "18.3.1",
       "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
       "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
+      "peer": true,
       "dependencies": {
         "loose-envify": "^1.1.0"
       },
@@ -14301,6 +14325,7 @@
       "version": "18.3.1",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
       "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
+      "peer": true,
       "dependencies": {
         "loose-envify": "^1.1.0",
         "scheduler": "^0.23.2"
@@ -14613,6 +14638,7 @@
       "version": "4.60.4",
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.60.4.tgz",
       "integrity": "sha512-WHeFSbZYsPu3+bLoNRUuAO+wavNlocOPf3wSHTP7hcFKVnJeWsYlCDbr3mTS14FCizf9ccIxXA8sGL8zKeQN3g==",
+      "peer": true,
       "dependencies": {
         "@types/estree": "1.0.8"
       },
@@ -15200,6 +15226,7 @@
       "integrity": "sha512-p8seiSI6FiVY6P3V0pG+5v7c8pDMehMAFRWEhG5XqIBSQszzOjDnW2rNvm3odoLKfo3V3P6Cs6Hv9ILzymULyQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@storybook/core": "8.6.18"
       },
@@ -15810,6 +15837,7 @@
       "version": "4.0.4",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
       "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
+      "peer": true,
       "engines": {
         "node": ">=12"
       },
@@ -16065,6 +16093,7 @@
       "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-10.9.2.tgz",
       "integrity": "sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "@cspotcode/source-map-support": "^0.8.0",
         "@tsconfig/node10": "^1.0.7",
@@ -16262,6 +16291,7 @@
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
       "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
       "devOptional": true,
+      "peer": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -16516,6 +16546,7 @@
       "version": "6.4.1",
       "resolved": "https://registry.npmjs.org/vite/-/vite-6.4.1.tgz",
       "integrity": "sha512-+Oxm7q9hDoLMyJOYfUYBuHQo+dkAloi33apOPP56pzj+vsdJDzr+j1NISE5pyaAuKL4A3UD34qd0lx5+kfKp2g==",
+      "peer": true,
       "dependencies": {
         "esbuild": "^0.25.0",
         "fdir": "^6.4.4",
@@ -16605,6 +16636,7 @@
       "version": "4.0.4",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
       "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
+      "peer": true,
       "engines": {
         "node": ">=12"
       },
@@ -17114,6 +17146,7 @@
       "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.9.0.tgz",
       "integrity": "sha512-2AvhNX3mb8zd6Zy7INTtSpl1F15HW6Wnqj0srWlkKLcpYl/gMIMJiyuGq2KeI2YFxUPjdlB+3Lc10seMLtL4cA==",
       "license": "ISC",
+      "peer": true,
       "bin": {
         "yaml": "bin.mjs"
       },
@@ -17239,6 +17272,7 @@
           "version": "8.20.0",
           "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.20.0.tgz",
           "integrity": "sha512-Thbli+OlOj+iMPYFBVBfJ3OmCAnaSyNn4M1vz9T6Gka5Jt9ba/HIR56joy65tY6kx/FCF5VXNB819Y7/GUrBGA==",
+          "peer": true,
           "requires": {
             "fast-deep-equal": "^3.1.3",
             "fast-uri": "^3.0.1",
@@ -17592,6 +17626,7 @@
       "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.29.7.tgz",
       "integrity": "sha512-RgHBCvtjbOK2gXSNBNIkNoEc9qoVEtau3hj8gEqKQuL3HZAibKarWFEI3Lfm6EYKkLalOh8eSrj9b+ch9H/VBA==",
       "dev": true,
+      "peer": true,
       "requires": {
         "@babel/code-frame": "^7.29.7",
         "@babel/generator": "^7.29.7",
@@ -17973,6 +18008,7 @@
       "version": "5.21.0",
       "resolved": "https://registry.npmjs.org/@bull-board/ui/-/ui-5.21.0.tgz",
       "integrity": "sha512-eH8QQwIHgCXxNEmlg9EZr3fSvno/bdbgBGfSQO5s9c9n9eDEaKX46ambKSPvgFPtwSdiV1AYQEa/3fGSebVIxg==",
+      "peer": true,
       "requires": {
         "@bull-board/api": "5.21.0"
       }
@@ -18061,6 +18097,7 @@
       "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-4.0.0.tgz",
       "integrity": "sha512-+B87qS7fIG3L5h3qwJ/IFbjoVoOe/bpOdh9hAjXbvx0o8ImEmUsGXN0inFOnk2ChCFgqkkGFQ+TpM5rbhkKe4w==",
       "dev": true,
+      "peer": true,
       "requires": {}
     },
     "@csstools/css-syntax-patches-for-csstree": {
@@ -18074,7 +18111,8 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-4.0.0.tgz",
       "integrity": "sha512-QxULHAm7cNu72w97JUNCBFODFaXpbDg+dP8b/oWFAZ2MTRppA3U00Y2L1HqaS4J6yBqxwa/Y3nMBaxVKbB/NsA==",
-      "dev": true
+      "dev": true,
+      "peer": true
     },
     "@cypress/request": {
       "version": "3.0.10",
@@ -19149,7 +19187,8 @@
     "@noble/hashes": {
       "version": "1.8.0",
       "resolved": "https://registry.npmjs.org/@noble/hashes/-/hashes-1.8.0.tgz",
-      "integrity": "sha512-jCs9ldd7NwzpgXDIf6P3+NrHh9/sD6CQdxHyjQI+h/6rDNo88ypBxxz45UDuZHz9r3tNz7N/VInSVoVdtXEI4A=="
+      "integrity": "sha512-jCs9ldd7NwzpgXDIf6P3+NrHh9/sD6CQdxHyjQI+h/6rDNo88ypBxxz45UDuZHz9r3tNz7N/VInSVoVdtXEI4A==",
+      "peer": true
     },
     "@nodable/entities": {
       "version": "2.1.1",
@@ -19207,7 +19246,8 @@
     "@opentelemetry/api": {
       "version": "1.9.1",
       "resolved": "https://registry.npmjs.org/@opentelemetry/api/-/api-1.9.1.tgz",
-      "integrity": "sha512-gLyJlPHPZYdAk1JENA9LeHejZe1Ti77/pTeFm/nMXmQH/HFZlcS/O2XJB+L8fkbrNSqhdtlvjBVjxwUYanNH5Q=="
+      "integrity": "sha512-gLyJlPHPZYdAk1JENA9LeHejZe1Ti77/pTeFm/nMXmQH/HFZlcS/O2XJB+L8fkbrNSqhdtlvjBVjxwUYanNH5Q==",
+      "peer": true
     },
     "@opentelemetry/api-logs": {
       "version": "0.219.0",
@@ -20474,6 +20514,7 @@
       "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.0.tgz",
       "integrity": "sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ==",
       "dev": true,
+      "peer": true,
       "requires": {
         "@babel/code-frame": "^7.10.4",
         "@babel/runtime": "^7.12.5",
@@ -20849,6 +20890,7 @@
       "version": "25.9.1",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-25.9.1.tgz",
       "integrity": "sha512-xfrlY7UD5rMJk3ZVJP8BNzS28J36YJg+xp+LPXV1TdWxr8uMH5A860QNxYDGQe/ylDSgjxE52Q9VnO7p75tJxg==",
+      "peer": true,
       "requires": {
         "undici-types": ">=7.24.0 <7.24.7"
       },
@@ -20914,6 +20956,7 @@
       "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.29.tgz",
       "integrity": "sha512-ch0qJdr2JY0r04NXSprbK6TXOgnaJ1Tz23fm5W+z0/CBah6BSBc3n96h7K9GOtwh0HrilNWHIBzE1Ko4Dcw/Wg==",
       "dev": true,
+      "peer": true,
       "requires": {
         "@types/prop-types": "*",
         "csstype": "^3.2.2"
@@ -20924,6 +20967,7 @@
       "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.7.tgz",
       "integrity": "sha512-MEe3UeoENYVFXzoXEWsvcpg6ZvlrFNlOQ7EOsvhI3CfAXwzPfO8Qwuxd40nepsYKqyyVQnTdEfv68q91yLcKrQ==",
       "dev": true,
+      "peer": true,
       "requires": {}
     },
     "@types/resolve": {
@@ -21087,6 +21131,7 @@
       "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-7.18.0.tgz",
       "integrity": "sha512-4Z+L8I2OqhZV8qA132M4wNL30ypZGYOQVBfMgxDH/K5UX0PNqTu1c6za9ST5r9+tavvHiTWmBnKzpCJ/GlVFtg==",
       "dev": true,
+      "peer": true,
       "requires": {
         "@typescript-eslint/scope-manager": "7.18.0",
         "@typescript-eslint/types": "7.18.0",
@@ -21372,7 +21417,8 @@
     "acorn": {
       "version": "8.16.0",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.16.0.tgz",
-      "integrity": "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw=="
+      "integrity": "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==",
+      "peer": true
     },
     "acorn-import-attributes": {
       "version": "1.9.5",
@@ -21940,6 +21986,7 @@
       "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.2.tgz",
       "integrity": "sha512-48xSriZYYg+8qXna9kwqjIVzuQxi+KYWp2+5nCYnYKPTr0LvD89Jqk2Or5ogxz0NUMfIjhh2lIUX/LyX9B4oIg==",
       "dev": true,
+      "peer": true,
       "requires": {
         "baseline-browser-mapping": "^2.10.12",
         "caniuse-lite": "^1.0.30001782",
@@ -23373,6 +23420,7 @@
       "resolved": "https://registry.npmjs.org/enquirer/-/enquirer-2.4.1.tgz",
       "integrity": "sha512-rRqJg/6gd538VHvR3PSrdRBb/1Vy2YfzHqzvbhGIQpDRKIa4FgV/54b5Q1xYSxOOwKvjXweS26E0Q+nAMwp2pQ==",
       "dev": true,
+      "peer": true,
       "requires": {
         "ansi-colors": "^4.1.1",
         "strip-ansi": "^6.0.1"
@@ -23432,6 +23480,7 @@
       "version": "0.25.12",
       "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.12.tgz",
       "integrity": "sha512-bbPBYYrtZbkt6Os6FiTLCTFxvq4tt3JKall1vRwshA3fdVztsLAatFaZobhkBC8/BrPetoa0oksYoKXoG4ryJg==",
+      "peer": true,
       "requires": {
         "@esbuild/aix-ppc64": "0.25.12",
         "@esbuild/android-arm": "0.25.12",
@@ -23491,6 +23540,7 @@
       "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.57.1.tgz",
       "integrity": "sha512-ypowyDxpVSYpkXr9WPv2PAZCtNip1Mv5KTW0SCurXv/9iOpcrH9PaqUElksqEB6pChqHGDRCFTyrZlGhnLNGiA==",
       "dev": true,
+      "peer": true,
       "requires": {
         "@eslint-community/eslint-utils": "^4.2.0",
         "@eslint-community/regexpp": "^4.6.1",
@@ -23692,6 +23742,7 @@
       "version": "4.22.2",
       "resolved": "https://registry.npmjs.org/express/-/express-4.22.2.tgz",
       "integrity": "sha512-IuL+Elrou2ZvCFHs18/CIzy2Nzvo25nZ1/D2eIZlz7c+QUayAcYoiM2BthCjs+EBHVpjYjcuLDAiCWgeIX3X1Q==",
+      "peer": true,
       "requires": {
         "accepts": "~1.3.8",
         "array-flatten": "1.1.1",
@@ -23899,6 +23950,7 @@
       "version": "7.5.1",
       "resolved": "https://registry.npmjs.org/express-rate-limit/-/express-rate-limit-7.5.1.tgz",
       "integrity": "sha512-7iN8iPMDzOMHPUYllBEsQdWVB6fPDMPqwjBaFrgr4Jgr/+okjvzAy+UHlYYL/Vs0OsOrMkwS6PJDkFlJwoxUnw==",
+      "peer": true,
       "requires": {}
     },
     "exsolve": {
@@ -24986,6 +25038,7 @@
       "resolved": "https://registry.npmjs.org/jest/-/jest-29.7.0.tgz",
       "integrity": "sha512-NIy3oAFp9shda19hy4HK0HRTWKtPJmGdnvywu01nOqNC2vZg+Z+fvJDxpMQA88eb2I9EcafcdjYgsDthnYTvGw==",
       "dev": true,
+      "peer": true,
       "requires": {
         "@jest/core": "^29.7.0",
         "@jest/types": "^29.6.3",
@@ -25400,7 +25453,8 @@
       "version": "2.7.0",
       "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.7.0.tgz",
       "integrity": "sha512-AC/7JofJvZGrrneWNaEnJeOLUx+JlGt7tNa0wZiRPT4MY1wmfKjt2+6O2p2uz2+skll8OZZmJMNqeke7kKbNgQ==",
-      "devOptional": true
+      "devOptional": true,
+      "peer": true
     },
     "js-md5": {
       "version": "0.8.3",
@@ -26717,6 +26771,7 @@
       "version": "8.5.15",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.15.tgz",
       "integrity": "sha512-FfR8sjd4em2T6fb3I2MwAJU7HWVMr9zba+enmQeeWFfCbm+UOC/0X4DS8XtpUTMwWMGbjKYP7xjfNekzyGmB3A==",
+      "peer": true,
       "requires": {
         "nanoid": "^3.3.12",
         "picocolors": "^1.1.1",
@@ -26868,6 +26923,7 @@
       "resolved": "https://registry.npmjs.org/prisma/-/prisma-6.19.3.tgz",
       "integrity": "sha512-++ZJ0ijLrDJF6hNB4t4uxg2br3fC4H9Yc9tcbjr2fcNFP3rh/SBNrAgjhsqBU4Ght8JPrVofG/ZkXfnSfnYsFg==",
       "devOptional": true,
+      "peer": true,
       "requires": {
         "@prisma/config": "6.19.3",
         "@prisma/engines": "6.19.3"
@@ -27039,6 +27095,7 @@
       "version": "18.3.1",
       "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
       "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
+      "peer": true,
       "requires": {
         "loose-envify": "^1.1.0"
       }
@@ -27081,6 +27138,7 @@
       "version": "18.3.1",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
       "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
+      "peer": true,
       "requires": {
         "loose-envify": "^1.1.0",
         "scheduler": "^0.23.2"
@@ -27318,6 +27376,7 @@
       "version": "4.60.4",
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.60.4.tgz",
       "integrity": "sha512-WHeFSbZYsPu3+bLoNRUuAO+wavNlocOPf3wSHTP7hcFKVnJeWsYlCDbr3mTS14FCizf9ccIxXA8sGL8zKeQN3g==",
+      "peer": true,
       "requires": {
         "@rollup/rollup-android-arm-eabi": "4.60.4",
         "@rollup/rollup-android-arm64": "4.60.4",
@@ -27726,6 +27785,7 @@
       "resolved": "https://registry.npmjs.org/storybook/-/storybook-8.6.18.tgz",
       "integrity": "sha512-p8seiSI6FiVY6P3V0pG+5v7c8pDMehMAFRWEhG5XqIBSQszzOjDnW2rNvm3odoLKfo3V3P6Cs6Hv9ILzymULyQ==",
       "dev": true,
+      "peer": true,
       "requires": {
         "@storybook/core": "8.6.18"
       }
@@ -28159,7 +28219,8 @@
         "picomatch": {
           "version": "4.0.4",
           "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
-          "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A=="
+          "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
+          "peer": true
         }
       }
     },
@@ -28322,6 +28383,7 @@
       "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-10.9.2.tgz",
       "integrity": "sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==",
       "dev": true,
+      "peer": true,
       "requires": {
         "@cspotcode/source-map-support": "^0.8.0",
         "@tsconfig/node10": "^1.0.7",
@@ -28444,7 +28506,8 @@
       "version": "5.9.3",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
       "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
-      "devOptional": true
+      "devOptional": true,
+      "peer": true
     },
     "uglify-js": {
       "version": "3.19.3",
@@ -28627,6 +28690,7 @@
       "version": "6.4.1",
       "resolved": "https://registry.npmjs.org/vite/-/vite-6.4.1.tgz",
       "integrity": "sha512-+Oxm7q9hDoLMyJOYfUYBuHQo+dkAloi33apOPP56pzj+vsdJDzr+j1NISE5pyaAuKL4A3UD34qd0lx5+kfKp2g==",
+      "peer": true,
       "requires": {
         "esbuild": "^0.25.0",
         "fdir": "^6.4.4",
@@ -28646,7 +28710,8 @@
         "picomatch": {
           "version": "4.0.4",
           "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
-          "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A=="
+          "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
+          "peer": true
         }
       }
     },
@@ -28960,7 +29025,8 @@
     "yaml": {
       "version": "2.9.0",
       "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.9.0.tgz",
-      "integrity": "sha512-2AvhNX3mb8zd6Zy7INTtSpl1F15HW6Wnqj0srWlkKLcpYl/gMIMJiyuGq2KeI2YFxUPjdlB+3Lc10seMLtL4cA=="
+      "integrity": "sha512-2AvhNX3mb8zd6Zy7INTtSpl1F15HW6Wnqj0srWlkKLcpYl/gMIMJiyuGq2KeI2YFxUPjdlB+3Lc10seMLtL4cA==",
+      "peer": true
     },
     "yargs": {
       "version": "17.7.2",