@jhits/plugin-users 0.0.13 → 0.0.15

package/dist/api/bridge.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Plugin Users - Session Bridge API
+ * Handles cross-domain session transfer via secure one-time tokens
+ */
+import { NextRequest, NextResponse } from 'next/server';
+/**
+ * GET /api/plugin-users/bridge/generate - Generate a one-time transfer token
+ * Call this from the "Primary" domain (.com)
+ */
+export declare function generateTransferToken(req: NextRequest, config: any): Promise<NextResponse<{
+    error: string;
+}> | NextResponse<{
+    token: string;
+}>>;
+/**
+ * GET /api/plugin-users/bridge/verify - Verify a transfer token and return user data
+ * Call this from the "Target" domain (.nl, .se) via proxy
+ */
+export declare function verifyTransferToken(req: NextRequest, config: any): Promise<NextResponse<{
+    error: string;
+}> | NextResponse<{
+    id: any;
+    email: any;
+    name: any;
+    role: any;
+    image: any;
+}>>;
+//# sourceMappingURL=bridge.d.ts.map

package/dist/api/bridge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bridge.d.ts","sourceRoot":"","sources":["../../src/api/bridge.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAgBxD;;;GAGG;AACH,wBAAsB,qBAAqB,CAAC,GAAG,EAAE,WAAW,EAAE,MAAM,EAAE,GAAG;;;;IAwBxE;AAED;;;GAGG;AACH,wBAAsB,mBAAmB,CAAC,GAAG,EAAE,WAAW,EAAE,MAAM,EAAE,GAAG;;;;;;;;IA0CtE"}

package/dist/api/bridge.js

@@ -0,0 +1,85 @@
+/**
+ * Plugin Users - Session Bridge API
+ * Handles cross-domain session transfer via secure one-time tokens
+ */
+import { NextResponse } from 'next/server';
+import { getToken } from 'next-auth/jwt';
+import { randomBytes } from 'crypto';
+// Token store (in-memory for simplicity, as tokens are extremely short-lived)
+// In a large multi-server setup, this should be in Redis
+const tokenStore = new Map();
+// Cleanup expired tokens periodically
+setInterval(() => {
+    const now = Date.now();
+    for (const [token, data] of tokenStore.entries()) {
+        if (data.expires < now)
+            tokenStore.delete(token);
+    }
+}, 60000);
+/**
+ * GET /api/plugin-users/bridge/generate - Generate a one-time transfer token
+ * Call this from the "Primary" domain (.com)
+ */
+export async function generateTransferToken(req, config) {
+    try {
+        const token = await getToken({
+            req,
+            secret: process.env.NEXTAUTH_SECRET || config.jwtSecret
+        });
+        if (!token || !token.sub) {
+            return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+        }
+        const transferToken = randomBytes(32).toString('hex');
+        const expires = Date.now() + 30000; // 30 seconds expiry
+        tokenStore.set(transferToken, {
+            userId: token.sub,
+            expires
+        });
+        return NextResponse.json({ token: transferToken });
+    }
+    catch (err) {
+        console.error('[BridgeAPI] Generate error:', err);
+        return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
+    }
+}
+/**
+ * GET /api/plugin-users/bridge/verify - Verify a transfer token and return user data
+ * Call this from the "Target" domain (.nl, .se) via proxy
+ */
+export async function verifyTransferToken(req, config) {
+    try {
+        const url = new URL(req.url);
+        const transferToken = url.searchParams.get('token');
+        if (!transferToken) {
+            return NextResponse.json({ error: 'Token required' }, { status: 400 });
+        }
+        const data = tokenStore.get(transferToken);
+        if (!data || data.expires < Date.now()) {
+            tokenStore.delete(transferToken);
+            return NextResponse.json({ error: 'Invalid or expired token' }, { status: 401 });
+        }
+        // Token used, remove it
+        tokenStore.delete(transferToken);
+        // Fetch user data
+        const dbConnection = await config.getDb();
+        const db = dbConnection.db();
+        const { ObjectId } = require('mongodb');
+        const user = await db.collection('users').findOne({
+            _id: new ObjectId(data.userId)
+        });
+        if (!user) {
+            return NextResponse.json({ error: 'User not found' }, { status: 404 });
+        }
+        return NextResponse.json({
+            id: user._id.toString(),
+            email: user.email,
+            name: user.name,
+            role: user.role || 'user',
+            image: user.image || null
+        });
+    }
+    catch (err) {
+        console.error('[BridgeAPI] Verify error:', err);
+        return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
+    }
+}

package/dist/api/router.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"router.d.ts","sourceRoot":"","sources":["../../src/api/router.ts"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AAEH,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAIzC;;;;GAIG;AACH,wBAAsB,cAAc,CAChC,GAAG,EAAE,WAAW,EAChB,IAAI,EAAE,MAAM,EAAE,EACd,MAAM,EAAE,cAAc,GACvB,OAAO,CAAC,YAAY,CAAC,CAwEvB"}
+{"version":3,"file":"router.d.ts","sourceRoot":"","sources":["../../src/api/router.ts"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AAEH,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAIzC;;;;GAIG;AACH,wBAAsB,cAAc,CAChC,GAAG,EAAE,WAAW,EAChB,IAAI,EAAE,MAAM,EAAE,EACd,MAAM,EAAE,cAAc,GACvB,OAAO,CAAC,YAAY,CAAC,CA6EvB"}

package/dist/api/router.js

@@ -25,52 +25,60 @@ export async function handleUsersApi(req, path, config) {
             initAuthHandler(config.authOptions);
         }
         // Route: /api/auth/[...nextauth] - NextAuth routes
-        // When routed from /api/auth, the path contains the nextauth segments
-        // Path structure: /api/auth/session -> path: ['session']
-        // Path structure: /api/auth/signin -> path: ['signin']
-        // Path structure: /api/auth -> path: [] (empty)
-        // We handle this by checking if route is empty (root /api/auth) or if it's a known NextAuth route
         const isNextAuthRoute = route === '' ||
-            ['session', 'signin', 'signout', 'callback', 'csrf', 'providers', 'error'].includes(route);
+            ['session', 'signin', 'signout', 'callback', 'csrf', 'providers', 'error', '_log'].includes(route);
         if (isNextAuthRoute) {
-            // This is a NextAuth route - use the path as nextauth segments
-            // For /api/auth, path is [] -> nextauthPath is []
-            // For /api/auth/session, path is ['session'] -> nextauthPath is ['session']
             const nextauthPath = path;
-            // Create NextAuth context
             const nextauthContext = {
                 params: Promise.resolve({ nextauth: nextauthPath })
             };
-            if (method === 'GET') {
+            if (method === 'GET')
                 return await AuthGET(req, nextauthContext);
-            }
-            if (method === 'POST') {
+            if (method === 'POST')
                 return await AuthPOST(req, nextauthContext);
+        }
+        // Route: /api/plugin-users/bridge (Session Bridge)
+        if (route === 'bridge') {
+            const bridgeModule = await import('./bridge');
+            const subRoute = path.length > 1 ? path[1] : '';
+            if (subRoute === 'generate' && method === 'GET') {
+                return await bridgeModule.generateTransferToken(req, config);
+            }
+            if (subRoute === 'verify' && method === 'GET') {
+                return await bridgeModule.verifyTransferToken(req, config);
             }
         }
         // Route: /api/users or /api/plugin-users/users (user management)
         if (route === 'users') {
             if (path.length === 1) {
-                // /api/users or /api/plugin-users/users
-                if (method === 'GET') {
+                if (method === 'GET')
                     return await GET_USERS(req, config);
-                }
-                if (method === 'POST') {
+                if (method === 'POST')
                     return await POST_USERS(req, config);
-                }
             }
             else if (path.length === 2) {
-                // /api/users/[id] or /api/plugin-users/users/[id]
                 const userId = path[1];
-                if (method === 'PATCH') {
+                if (method === 'PATCH')
                     return await PATCH_USER(req, userId, config);
-                }
-                if (method === 'DELETE') {
+                if (method === 'DELETE')
                     return await DELETE_USER(req, userId, config);
-                }
             }
         }
-        // Method not allowed
+        // Route: /api/plugin-users/bootstrap (Initial Setup)
+        if (route === 'bootstrap' && method === 'POST') {
+            const { BOOTSTRAP_USER } = await import('./users');
+            return await BOOTSTRAP_USER(req, config);
+        }
+        // Route: /api/plugin-users/setup-status (Check if setup is needed)
+        if (route === 'setup-status') {
+            const { CHECK_SETUP_STATUS } = await import('./users');
+            return await CHECK_SETUP_STATUS(req, config);
+        }
+        // Route: /api/plugin-users/setup-request (Generate temporary key)
+        if (route === 'setup-request') {
+            const { REQUEST_SETUP_KEY } = await import('./users');
+            return await REQUEST_SETUP_KEY(req, config);
+        }
         return NextResponse.json({ error: `Method ${method} not allowed for route: ${route || '/'}` }, { status: 405 });
     }
     catch (error) {

package/dist/api/users.d.ts

@@ -29,4 +29,16 @@ export declare function PATCH_USER(req: NextRequest, userId: string, config: Use
  * DELETE /api/plugin-users/users/[id] - Delete user
  */
 export declare function DELETE_USER(req: NextRequest, userId: string, config: UsersApiConfig): Promise<NextResponse>;
+/**
+ * POST /api/plugin-users/setup-request - Generate a temporary setup key
+ */
+export declare function REQUEST_SETUP_KEY(req: NextRequest, config: UsersApiConfig): Promise<NextResponse>;
+/**
+ * GET /api/plugin-users/setup-status - Check if any users exist
+ */
+export declare function CHECK_SETUP_STATUS(req: NextRequest, config: UsersApiConfig): Promise<NextResponse>;
+/**
+ * POST /api/plugin-users/bootstrap - Create first admin via secret key
+ */
+export declare function BOOTSTRAP_USER(req: NextRequest, config: UsersApiConfig): Promise<NextResponse>;
 //# sourceMappingURL=users.d.ts.map

package/dist/api/users.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"users.d.ts","sourceRoot":"","sources":["../../src/api/users.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAIxD,MAAM,WAAW,cAAc;IAC3B,6BAA6B;IAC7B,KAAK,EAAE,MAAM,OAAO,CAAC;QAAE,EAAE,EAAE,MAAM,GAAG,CAAA;KAAE,CAAC,CAAC;IACxC,yCAAyC;IACzC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,iDAAiD;IACjD,WAAW,CAAC,EAAE,GAAG,CAAC;CACrB;AAED;;GAEG;AACH,wBAAsB,SAAS,CAAC,GAAG,EAAE,WAAW,EAAE,MAAM,EAAE,cAAc,GAAG,OAAO,CAAC,YAAY,CAAC,CAmB/F;AAED;;GAEG;AACH,wBAAsB,UAAU,CAAC,GAAG,EAAE,WAAW,EAAE,MAAM,EAAE,cAAc,GAAG,OAAO,CAAC,YAAY,CAAC,CAiDhG;AAED;;GAEG;AACH,wBAAsB,UAAU,CAC5B,GAAG,EAAE,WAAW,EAChB,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,cAAc,GACvB,OAAO,CAAC,YAAY,CAAC,CAiEvB;AAED;;GAEG;AACH,wBAAsB,WAAW,CAC7B,GAAG,EAAE,WAAW,EAChB,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,cAAc,GACvB,OAAO,CAAC,YAAY,CAAC,CA6BvB"}
+{"version":3,"file":"users.d.ts","sourceRoot":"","sources":["../../src/api/users.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAIxD,MAAM,WAAW,cAAc;IAC3B,6BAA6B;IAC7B,KAAK,EAAE,MAAM,OAAO,CAAC;QAAE,EAAE,EAAE,MAAM,GAAG,CAAA;KAAE,CAAC,CAAC;IACxC,yCAAyC;IACzC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,iDAAiD;IACjD,WAAW,CAAC,EAAE,GAAG,CAAC;CACrB;AAED;;GAEG;AACH,wBAAsB,SAAS,CAAC,GAAG,EAAE,WAAW,EAAE,MAAM,EAAE,cAAc,GAAG,OAAO,CAAC,YAAY,CAAC,CAmB/F;AAED;;GAEG;AACH,wBAAsB,UAAU,CAAC,GAAG,EAAE,WAAW,EAAE,MAAM,EAAE,cAAc,GAAG,OAAO,CAAC,YAAY,CAAC,CAiDhG;AAED;;GAEG;AACH,wBAAsB,UAAU,CAC5B,GAAG,EAAE,WAAW,EAChB,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,cAAc,GACvB,OAAO,CAAC,YAAY,CAAC,CAiEvB;AAED;;GAEG;AACH,wBAAsB,WAAW,CAC7B,GAAG,EAAE,WAAW,EAChB,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,cAAc,GACvB,OAAO,CAAC,YAAY,CAAC,CA6BvB;AAED;;GAEG;AACH,wBAAsB,iBAAiB,CAAC,GAAG,EAAE,WAAW,EAAE,MAAM,EAAE,cAAc,GAAG,OAAO,CAAC,YAAY,CAAC,CAuBvG;AAED;;GAEG;AACH,wBAAsB,kBAAkB,CAAC,GAAG,EAAE,WAAW,EAAE,MAAM,EAAE,cAAc,GAAG,OAAO,CAAC,YAAY,CAAC,CAcxG;AAED;;GAEG;AACH,wBAAsB,cAAc,CAAC,GAAG,EAAE,WAAW,EAAE,MAAM,EAAE,cAAc,GAAG,OAAO,CAAC,YAAY,CAAC,CAsDpG"}

package/dist/api/users.js

@@ -136,3 +136,97 @@ export async function DELETE_USER(req, userId, config) {
         return NextResponse.json({ error: 'Delete failed', detail: err.message }, { status: 500 });
     }
 }
+/**
+ * POST /api/plugin-users/setup-request - Generate a temporary setup key
+ */
+export async function REQUEST_SETUP_KEY(req, config) {
+    if (process.env.NODE_ENV !== 'development') {
+        return NextResponse.json({ error: 'Not available' }, { status: 403 });
+    }
+    const key = Math.random().toString(36).substring(2, 8).toUpperCase();
+    const expiry = Date.now() + 60000; // 1 minute
+    // Store in global shared store to persist across federated module re-evaluations
+    const g = globalThis;
+    if (g.__JHITS_SETUP_STORE__) {
+        g.__JHITS_SETUP_STORE__.key = key;
+        g.__JHITS_SETUP_STORE__.expiry = expiry;
+    }
+    else {
+        // Fallback if provider didn't run yet
+        g.__JHITS_SETUP_STORE__ = { key, expiry };
+    }
+    console.log('\n\x1b[41m\x1b[37m [SECURITY] BOOTSTRAP ACCESS REQUESTED \x1b[0m');
+    console.log(`\x1b[31m Temporary Setup Key: \x1b[1m${key}\x1b[0m`);
+    console.log('\x1b[31m This key will expire in 60 seconds.\x1b[0m\n');
+    return NextResponse.json({ message: 'Key generated and logged to console' });
+}
+/**
+ * GET /api/plugin-users/setup-status - Check if any users exist
+ */
+export async function CHECK_SETUP_STATUS(req, config) {
+    try {
+        const dbConnection = await config.getDb();
+        const db = dbConnection.db();
+        const users = db.collection(config.collectionName || 'users');
+        const count = await users.countDocuments();
+        return NextResponse.json({
+            needsSetup: count === 0,
+            isDev: process.env.NODE_ENV === 'development'
+        });
+    }
+    catch (err) {
+        return NextResponse.json({ needsSetup: false, error: 'DB connection failed' });
+    }
+}
+/**
+ * POST /api/plugin-users/bootstrap - Create first admin via secret key
+ */
+export async function BOOTSTRAP_USER(req, config) {
+    try {
+        const { email, name, password, setupKey } = await req.json();
+        // Security check: validate dynamic key from shared store
+        const g = globalThis;
+        const store = g.__JHITS_SETUP_STORE__ || {};
+        const systemSetupKey = store.key;
+        const systemExpiry = store.expiry;
+        if (!systemSetupKey || !setupKey || setupKey !== systemSetupKey) {
+            return NextResponse.json({ error: 'Invalid or missing setup key' }, { status: 403 });
+        }
+        if (Date.now() > systemExpiry) {
+            if (g.__JHITS_SETUP_STORE__)
+                g.__JHITS_SETUP_STORE__.key = null;
+            return NextResponse.json({ error: 'Setup key has expired' }, { status: 403 });
+        }
+        // Invalidate key immediately after use
+        if (g.__JHITS_SETUP_STORE__)
+            g.__JHITS_SETUP_STORE__.key = null;
+        const dbConnection = await config.getDb();
+        const db = dbConnection.db();
+        const users = db.collection(config.collectionName || 'users');
+        // Check if any admin already exists (double check)
+        const adminExists = await users.findOne({ role: 'admin' });
+        if (adminExists && process.env.NODE_ENV !== 'development') {
+            return NextResponse.json({ error: 'System already has an administrator' }, { status: 400 });
+        }
+        // Hash the password
+        const hashedPassword = await bcrypt.hash(password, 12);
+        // Save to DB
+        const result = await users.insertOne({
+            email,
+            name,
+            role: 'admin',
+            password: hashedPassword,
+            createdAt: new Date(),
+        });
+        return NextResponse.json({
+            message: 'Bootstrap successful',
+            _id: result.insertedId,
+            email,
+            role: 'admin'
+        }, { status: 201 });
+    }
+    catch (err) {
+        console.error('[UsersAPI] Bootstrap error:', err);
+        return NextResponse.json({ error: 'Bootstrap failed', detail: err.message }, { status: 500 });
+    }
+}

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,GAAG,CAQ/B,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,GAAG,CAE/B,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/dist/index.js

@@ -3,6 +3,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import UserManagement from './views/UserManagement';
 // User Management Plugin - Always enabled by default
 export const Index = ({ subPath = [], siteId, locale: dashboardLocale = 'en' }) => {
-    return (_jsx("div", { className: "w-full h-full flex flex-col overflow-hidden", children: _jsx("div", { className: "flex-1 overflow-y-auto", children: _jsx(UserManagement, { locale: dashboardLocale }) }) }));
+    return _jsx(UserManagement, { locale: dashboardLocale });
 };
 export default Index;

package/dist/index.server.d.ts

@@ -8,5 +8,6 @@ import 'server-only';
  */
 export { handleUsersApi as handleApi } from './api/router';
 export { handleUsersApi } from './api/router';
+export { generateTransferToken, verifyTransferToken } from './api/bridge';
 export type { UsersApiConfig } from './api/users';
 //# sourceMappingURL=index.server.d.ts.map

package/dist/index.server.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.server.d.ts","sourceRoot":"","sources":["../src/index.server.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAC;AAErB;;;;;;GAMG;AAEH,OAAO,EAAE,cAAc,IAAI,SAAS,EAAE,MAAM,cAAc,CAAC;AAC3D,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.server.d.ts","sourceRoot":"","sources":["../src/index.server.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAC;AAErB;;;;;;GAMG;AAEH,OAAO,EAAE,cAAc,IAAI,SAAS,EAAE,MAAM,cAAc,CAAC;AAC3D,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,qBAAqB,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAC1E,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC"}

package/dist/index.server.js

@@ -8,3 +8,4 @@ import 'server-only';
  */
 export { handleUsersApi as handleApi } from './api/router';
 export { handleUsersApi } from './api/router'; // Keep original export for backward compatibility
+export { generateTransferToken, verifyTransferToken } from './api/bridge';

package/dist/views/UserManagement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UserManagement.d.ts","sourceRoot":"","sources":["../../src/views/UserManagement.tsx"],"names":[],"mappings":"AAgBA,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EAAE,MAAa,EAAE,EAAE;IAAE,MAAM,CAAC,EAAE,MAAM,CAAA;CAAE,2CA0T5E"}
+{"version":3,"file":"UserManagement.d.ts","sourceRoot":"","sources":["../../src/views/UserManagement.tsx"],"names":[],"mappings":"AAqBA,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EAAE,MAAa,EAAE,EAAE;IAAE,MAAM,CAAC,EAAE,MAAM,CAAA;CAAE,2CAuf5E"}

package/dist/views/UserManagement.js

@@ -1,14 +1,23 @@
 'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
-import { UserPlus, Shield, Trash2, Search, Loader2, X, Eye, EyeOff, Copy, Check, Calendar } from "lucide-react";
+import { Users, UserPlus, Shield, Trash2, Key, Search, Loader2, X, Eye, EyeOff, Copy, Check, Calendar, UserCircle, Mail, Edit2, ShieldCheck, Activity, ChevronRight } from "lucide-react";
+import { motion, AnimatePresence } from "framer-motion";
+import { useSession } from "next-auth/react";
 export default function UserManagement({ locale = 'en' }) {
+    const { data: session } = useSession();
     const [users, setUsers] = useState([]);
     const [loading, setLoading] = useState(true);
     const [searchTerm, setSearchTerm] = useState("");
+    // Current User Info
+    const currentUserEmail = session?.user?.email;
+    const currentUserRole = session?.user?.role || 'editor';
     // Modal State
     const [isModalOpen, setIsModalOpen] = useState(false);
-    const [isCreating, setIsCreating] = useState(false);
+    const [modalMode, setModalMode] = useState('create');
+    const [selectedUser, setSelectedUser] = useState(null);
+    const [activeUserIdx, setActiveUserIdx] = useState(0);
+    const [isProcessing, setIsProcessing] = useState(false);
     const [showPassword, setShowPassword] = useState(false);
     const [copied, setCopied] = useState(false);
     // Form State
@@ -34,39 +43,83 @@ export default function UserManagement({ locale = 'en' }) {
         }
     };
     useEffect(() => { fetchUsers(); }, []);
+    // Permission Logic
+    const canManageEcosystem = currentUserRole === 'dev' || currentUserRole === 'admin';
+    const canActionUser = (targetUser) => {
+        if (!canManageEcosystem)
+            return false;
+        if (targetUser.email === currentUserEmail)
+            return false; // Can't delete/edit role of self in this view
+        // Dev can manage everyone
+        if (currentUserRole === 'dev')
+            return true;
+        // Admin can only manage editors (cannot touch devs or other admins)
+        if (currentUserRole === 'admin') {
+            return targetUser.role === 'editor';
+        }
+        return false;
+    };
     const generateTempPassword = () => {
         const charset = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$%";
         let retVal = "";
         for (let i = 0, n = charset.length; i < 10; ++i) {
             retVal += charset.charAt(Math.floor(Math.random() * n));
         }
-        setFormData({ ...formData, password: retVal });
+        setFormData(prev => ({ ...prev, password: retVal }));
+    };
+    const handleOpenCreate = () => {
+        setModalMode('create');
+        setFormData({ name: "", email: "", password: "", role: "editor" });
+        generateTempPassword();
+        setIsModalOpen(true);
     };
-    const handleCreateUser = async (e) => {
+    const handleOpenEdit = (user) => {
+        setModalMode('edit');
+        setSelectedUser(user);
+        setFormData({
+            name: user.name,
+            email: user.email,
+            password: "", // Don't show existing password
+            role: user.role
+        });
+        setIsModalOpen(true);
+    };
+    const handleSubmit = async (e) => {
         e.preventDefault();
-        setIsCreating(true);
+        setIsProcessing(true);
         try {
-            const res = await fetch('/api/users', {
-                method: 'POST',
+            const url = modalMode === 'create' ? '/api/users' : `/api/users/${selectedUser?._id}`;
+            const method = modalMode === 'create' ? 'POST' : 'PATCH';
+            // For editing, only send password if provided
+            const payload = { ...formData };
+            if (modalMode === 'edit' && !payload.password) {
+                delete payload.password;
+            }
+            const res = await fetch(url, {
+                method,
                 headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify(formData)
+                body: JSON.stringify(payload)
             });
             if (res.ok) {
-                const newUser = await res.json();
-                setUsers([...users, newUser]);
+                const updatedUser = await res.json();
+                if (modalMode === 'create') {
+                    setUsers([...users, updatedUser]);
+                }
+                else {
+                    setUsers(users.map(u => u._id === updatedUser._id ? updatedUser : u));
+                }
                 setIsModalOpen(false);
-                setFormData({ name: "", email: "", password: "", role: "editor" });
             }
             else {
                 const err = await res.json();
-                alert(err.error || "Failed to create user");
+                alert(err.error || `Failed to ${modalMode} user`);
             }
         }
         catch (err) {
-            alert("Network error while creating user");
+            alert("Network error occurred");
         }
         finally {
-            setIsCreating(false);
+            setIsProcessing(false);
         }
     };
     const copyToClipboard = () => {
@@ -74,15 +127,15 @@ export default function UserManagement({ locale = 'en' }) {
         setCopied(true);
         setTimeout(() => setCopied(false), 2000);
     };
-    const handleDelete = async (userId, userRole) => {
-        if (userRole === 'dev')
-            return alert("Cannot delete developer account.");
-        if (!confirm("Are you sure you want to delete this user?"))
+    const handleDelete = async (user) => {
+        if (!canActionUser(user))
+            return;
+        if (!confirm(`Are you certain you want to remove ${user.name}? This action is final.`))
             return;
         try {
-            const res = await fetch(`/api/users/${userId}`, { method: 'DELETE' });
+            const res = await fetch(`/api/users/${user._id}`, { method: 'DELETE' });
             if (res.ok)
-                setUsers(users.filter(u => u._id !== userId));
+                setUsers(users.filter(u => u._id !== user._id));
         }
         catch (err) {
             alert("Error deleting user.");
@@ -90,5 +143,24 @@ export default function UserManagement({ locale = 'en' }) {
     };
     const filteredUsers = users.filter(user => user.name?.toLowerCase().includes(searchTerm.toLowerCase()) ||
         user.email?.toLowerCase().includes(searchTerm.toLowerCase()));
-    return (_jsxs("div", { className: "h-full w-full rounded-[2.5rem] bg-dashboard-card dark:bg-neutral-900 p-8 overflow-y-auto", children: [_jsxs("div", { className: "flex flex-col md:flex-row md:items-center justify-between gap-6 mb-8", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-3xl font-black text-dashboard-text uppercase tracking-tighter mb-2", children: "User Management" }), _jsx("p", { className: "text-sm text-dashboard-text-secondary", children: "Manage who has access to the dashboard." })] }), _jsxs("button", { onClick: () => { setIsModalOpen(true); generateTempPassword(); }, className: "inline-flex items-center gap-2 px-6 py-3 bg-primary text-white rounded-full text-[10px] font-black uppercase tracking-widest hover:bg-primary/90 transition-all shadow-lg shadow-primary/20", children: [_jsx(UserPlus, { size: 16 }), "New User"] })] }), _jsxs("div", { className: "bg-dashboard-bg dark:bg-neutral-800/50 rounded-2xl sm:rounded-[2rem] border border-dashboard-border overflow-hidden", children: [_jsxs("div", { className: "p-4 sm:p-6 border-b border-dashboard-border flex items-center justify-between", children: [_jsxs("div", { className: "relative w-full sm:w-72", children: [_jsx(Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 text-dashboard-text-secondary", size: 16 }), _jsx("input", { type: "text", placeholder: "Search users...", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), className: "w-full pl-10 pr-4 py-2.5 bg-dashboard-card border border-dashboard-border rounded-lg text-sm outline-none focus:ring-2 focus:ring-primary/20 transition-all text-dashboard-text placeholder:text-dashboard-text-secondary" })] }), loading && _jsx(Loader2, { className: "animate-spin text-primary ml-4", size: 20 })] }), _jsx("div", { className: "hidden md:block overflow-x-auto", children: _jsxs("table", { className: "w-full text-left border-collapse", children: [_jsx("thead", { children: _jsxs("tr", { className: "text-[11px] font-bold text-dashboard-text-secondary uppercase tracking-widest border-b border-dashboard-border", children: [_jsx("th", { className: "px-8 py-4", children: "User" }), _jsx("th", { className: "px-8 py-4", children: "Role" }), _jsx("th", { className: "px-8 py-4", children: "Since" }), _jsx("th", { className: "px-8 py-4 text-right", children: "Actions" })] }) }), _jsx("tbody", { className: "divide-y divide-dashboard-border", children: filteredUsers.map((user) => (_jsxs("tr", { className: "group hover:bg-dashboard-card transition-colors", children: [_jsx("td", { className: "px-8 py-5", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "w-10 h-10 rounded-full bg-primary/10 text-primary flex items-center justify-center font-bold border border-primary/20", children: user.name?.[0] || 'U' }), _jsxs("div", { children: [_jsx("p", { className: "font-bold text-dashboard-text text-sm", children: user.name }), _jsx("p", { className: "text-xs text-dashboard-text-secondary", children: user.email })] })] }) }), _jsx("td", { className: "px-8 py-5", children: _jsxs("span", { className: `inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-[10px] font-bold uppercase tracking-wider ${user.role === 'dev' ? 'bg-primary text-white' : 'bg-dashboard-bg text-dashboard-text'}`, children: [_jsx(Shield, { size: 10 }), " ", user.role] }) }), _jsx("td", { className: "px-8 py-5 text-sm text-dashboard-text-secondary", children: user.createdAt ? new Date(user.createdAt).toLocaleDateString() : '-' }), _jsx("td", { className: "px-8 py-5 text-right", children: _jsx("button", { onClick: () => handleDelete(user._id, user.role), className: "p-2 text-dashboard-text-secondary hover:text-red-500 transition-colors disabled:opacity-0", disabled: user.role === 'dev', children: _jsx(Trash2, { size: 16 }) }) })] }, user._id))) })] }) }), _jsx("div", { className: "md:hidden divide-y divide-dashboard-border", children: filteredUsers.map((user) => (_jsxs("div", { className: "p-5 space-y-4", children: [_jsxs("div", { className: "flex justify-between items-start", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "w-10 h-10 rounded-full bg-primary/10 text-primary flex items-center justify-center font-bold border border-primary/20", children: user.name?.[0] || 'U' }), _jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "font-bold text-dashboard-text text-sm truncate", children: user.name }), _jsx("p", { className: "text-[11px] text-dashboard-text-secondary truncate", children: user.email })] })] }), _jsx("button", { onClick: () => handleDelete(user._id, user.role), className: `p-2 rounded-lg bg-red-50 dark:bg-red-950/20 text-red-400 ${user.role === 'dev' ? 'hidden' : 'block'}`, children: _jsx(Trash2, { size: 16 }) })] }), _jsxs("div", { className: "flex items-center justify-between pt-2 border-t border-dashboard-border", children: [_jsxs("span", { className: `inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-[9px] font-black uppercase tracking-wider ${user.role === 'dev' ? 'bg-primary text-white' : 'bg-dashboard-bg text-dashboard-text'}`, children: [_jsx(Shield, { size: 10 }), " ", user.role] }), _jsxs("div", { className: "flex items-center gap-1.5 text-[10px] text-dashboard-text-secondary font-medium", children: [_jsx(Calendar, { size: 12 }), user.createdAt ? new Date(user.createdAt).toLocaleDateString() : '-'] })] })] }, user._id))) }), filteredUsers.length === 0 && !loading && (_jsx("div", { className: "p-12 text-center text-dashboard-text-secondary text-sm", children: "No users found matching your search." }))] }), isModalOpen && (_jsx("div", { className: "fixed inset-0 z-50 flex items-end sm:items-center justify-center p-0 sm:p-4 bg-black/40 backdrop-blur-sm animate-in fade-in duration-200", children: _jsxs("div", { className: "bg-dashboard-card w-full max-w-md rounded-t-[2.5rem] sm:rounded-[2.5rem] shadow-2xl overflow-hidden animate-in slide-in-from-bottom sm:zoom-in-95 duration-300 max-h-[90vh] overflow-y-auto border border-dashboard-border", children: [_jsxs("div", { className: "p-6 sm:p-8 bg-primary text-white flex justify-between items-center sticky top-0 z-10", children: [_jsx("h2", { className: "text-xl sm:text-2xl font-black uppercase tracking-tighter", children: "New User" }), _jsx("button", { onClick: () => setIsModalOpen(false), className: "hover:rotate-90 transition-transform p-2", children: _jsx(X, { size: 24 }) })] }), _jsxs("form", { onSubmit: handleCreateUser, className: "p-6 sm:p-8 space-y-5", children: [_jsxs("div", { className: "space-y-2", children: [_jsx("label", { className: "text-xs font-bold text-dashboard-text-secondary uppercase tracking-widest ml-1", children: "Name" }), _jsx("input", { required: true, className: "w-full px-5 py-3 bg-dashboard-bg border border-dashboard-border rounded-2xl focus:ring-2 focus:ring-primary outline-none text-sm transition-all text-dashboard-text", value: formData.name, onChange: e => setFormData({ ...formData, name: e.target.value }), placeholder: "e.g. John Doe" })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("label", { className: "text-xs font-bold text-dashboard-text-secondary uppercase tracking-widest ml-1", children: "Email Address" }), _jsx("input", { required: true, type: "email", className: "w-full px-5 py-3 bg-dashboard-bg border border-dashboard-border rounded-2xl focus:ring-2 focus:ring-primary outline-none text-sm transition-all text-dashboard-text", value: formData.email, onChange: e => setFormData({ ...formData, email: e.target.value }), placeholder: "email@example.com" })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("label", { className: "text-xs font-bold text-dashboard-text-secondary uppercase tracking-widest ml-1", children: "Temporary Password" }), _jsxs("div", { className: "relative", children: [_jsx("input", { required: true, type: showPassword ? "text" : "password", className: "w-full px-5 py-3 bg-dashboard-bg border border-dashboard-border rounded-2xl focus:ring-2 focus:ring-primary outline-none text-sm transition-all font-mono text-dashboard-text", value: formData.password, onChange: e => setFormData({ ...formData, password: e.target.value }) }), _jsxs("div", { className: "absolute right-3 top-1/2 -translate-y-1/2 flex items-center gap-1", children: [_jsx("button", { type: "button", onClick: () => setShowPassword(!showPassword), className: "p-1.5 text-dashboard-text-secondary hover:text-primary", children: showPassword ? _jsx(EyeOff, { size: 16 }) : _jsx(Eye, { size: 16 }) }), _jsx("button", { type: "button", onClick: copyToClipboard, className: "p-1.5 text-dashboard-text-secondary hover:text-primary", children: copied ? _jsx(Check, { size: 16, className: "text-emerald-500" }) : _jsx(Copy, { size: 16 }) })] })] }), _jsx("button", { type: "button", onClick: generateTempPassword, className: "text-[10px] text-primary font-bold uppercase tracking-wider hover:underline ml-1", children: "Generate new password" })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("label", { className: "text-xs font-bold text-dashboard-text-secondary uppercase tracking-widest ml-1", children: "Role" }), _jsxs("div", { className: "relative", children: [_jsxs("select", { className: "w-full px-5 py-3 bg-dashboard-bg border border-dashboard-border rounded-2xl focus:ring-2 focus:ring-primary outline-none text-sm appearance-none cursor-pointer text-dashboard-text", value: formData.role, onChange: e => setFormData({ ...formData, role: e.target.value }), children: [_jsx("option", { value: "editor", children: "Editor (Content only)" }), _jsx("option", { value: "dev", children: "Developer" }), _jsx("option", { value: "admin", children: "Admin (All settings)" })] }), _jsx("div", { className: "absolute right-4 top-1/2 -translate-y-1/2 pointer-events-none text-dashboard-text-secondary", children: _jsx(Shield, { size: 16 }) })] })] }), _jsx("button", { type: "submit", disabled: isCreating, className: "w-full py-4 bg-primary text-white rounded-full text-[10px] font-black uppercase tracking-widest shadow-lg shadow-primary/20 hover:bg-primary/90 transition-all mt-4 flex items-center justify-center gap-2", children: isCreating ? _jsx(Loader2, { className: "animate-spin", size: 20 }) : "Add User" })] })] }) }))] }));
+    const getRoleStyles = (role) => {
+        switch (role) {
+            case 'dev': return 'bg-primary/20 text-primary border-primary/30 shadow-[0_0_20px_rgba(var(--color-primary),0.2)]';
+            case 'admin': return 'bg-emerald-500/20 text-emerald-500 border-emerald-500/30 shadow-[0_0_20px_rgba(16,185,129,0.1)]';
+            default: return 'bg-amber-500/20 text-amber-500 border-amber-500/30';
+        }
+    };
+    const permissions = {
+        dev: ['Full System Access', 'Kernel Management', 'Database Write', 'Ecosystem Logic', 'Security Protocol'],
+        admin: ['User Management', 'Content Orchestration', 'Settings Access', 'Analytical Review', 'Standard Security'],
+        editor: ['Content Creation', 'Media Management', 'Basic Settings', 'Public Preview']
+    };
+    const activeUser = filteredUsers[activeUserIdx] || filteredUsers[0];
+    return (_jsxs("div", { className: "h-full flex flex-col overflow-hidden bg-transparent", children: [_jsxs("div", { className: "shrink-0 p-8 lg:p-10 pb-6 border-b border-dashboard-border/30 bg-dashboard-card/20 backdrop-blur-md relative overflow-hidden", children: [_jsx("div", { className: "absolute top-0 right-0 w-1/3 h-full bg-gradient-to-l from-primary/10 to-transparent pointer-events-none" }), _jsxs("div", { className: "flex flex-col lg:flex-row lg:items-center justify-between gap-8 relative z-10", children: [_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "inline-flex items-center gap-2 px-4 py-1.5 rounded-full bg-primary/15 border border-primary/30 text-primary text-[10px] font-bold uppercase tracking-[0.2em] shadow-lg shadow-primary/5", children: [_jsx(Activity, { size: 14, className: "animate-pulse" }), _jsx("span", { children: "System Access Control" })] }), _jsxs("h1", { className: "text-5xl font-bold text-dashboard-text tracking-tight leading-none", children: ["User ", _jsx("span", { className: "text-primary italic", children: "Management" })] })] }), _jsxs("div", { className: "flex items-center gap-6", children: [_jsxs("div", { className: "flex flex-col items-end px-6 border-r border-dashboard-border/40", children: [_jsx("span", { className: "text-[10px] font-bold text-dashboard-text-secondary uppercase tracking-[0.3em] opacity-50 mb-1", children: "Team Members" }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsxs("div", { className: "flex -space-x-3", children: [users.slice(0, 3).map((u, i) => (_jsx("div", { className: "size-8 rounded-full border-2 border-dashboard-card bg-primary flex items-center justify-center text-[10px] font-bold text-white shadow-xl overflow-hidden", children: u.image ? _jsx("img", { src: u.image, className: "size-full object-cover" }) : u.name[0] }, i))), users.length > 3 && (_jsxs("div", { className: "size-8 rounded-full border-2 border-dashboard-card bg-dashboard-card flex items-center justify-center text-[10px] font-bold text-dashboard-text-secondary", children: ["+", users.length - 3] }))] }), _jsx("span", { className: "text-2xl font-bold text-dashboard-text", children: users.length })] })] }), canManageEcosystem && (_jsxs("button", { onClick: handleOpenCreate, className: "group flex items-center gap-4 px-8 py-4 bg-primary text-white rounded-2xl text-xs font-bold uppercase tracking-widest shadow-2xl shadow-primary/30 hover:shadow-primary/50 hover:scale-105 active:scale-95 transition-all", children: [_jsx(UserPlus, { size: 20 }), _jsx("span", { children: "Add New User" })] }))] })] })] }), _jsxs("div", { className: "flex-1 flex overflow-hidden p-6 lg:p-8 gap-8", children: [_jsxs("aside", { className: "w-96 flex flex-col gap-6 shrink-0 h-full", children: [_jsxs("div", { className: "relative group", children: [_jsx(Search, { className: "absolute left-4 top-1/2 -translate-y-1/2 text-primary/40 group-focus-within:text-primary transition-colors", size: 18 }), _jsx("input", { type: "text", placeholder: "Search users...", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), className: "w-full pl-12 pr-6 py-3.5 bg-dashboard-card/40 border border-dashboard-border/40 rounded-2xl text-sm font-semibold outline-none focus:ring-2 focus:ring-primary/20 transition-all text-dashboard-text placeholder:text-dashboard-text-secondary/30" })] }), _jsx("div", { className: "flex-1 overflow-y-auto custom-scrollbar pr-2 space-y-3", children: _jsx(AnimatePresence, { mode: "popLayout", children: filteredUsers.map((user, index) => {
+                                        const isActive = activeUser?._id === user._id;
+                                        const isSelf = user.email === currentUserEmail;
+                                        return (_jsxs(motion.button, { onClick: () => setActiveUserIdx(index), initial: { opacity: 0, x: -20 }, animate: { opacity: 1, x: 0 }, className: `w-full text-left p-4 rounded-2xl border transition-all flex items-center gap-4 group ${isActive
+                                                ? 'bg-primary text-white border-primary shadow-xl shadow-primary/20'
+                                                : 'bg-dashboard-card/30 border-dashboard-border/40 hover:border-primary/40 text-dashboard-text'}`, children: [_jsx("div", { className: `size-12 rounded-xl flex items-center justify-center font-bold text-white shrink-0 shadow-lg ${isActive ? 'bg-white/20' : 'bg-primary'}`, children: user.image ? _jsx("img", { src: user.image, className: "size-full object-cover rounded-xl" }) : user.name[0].toUpperCase() }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: `block text-sm font-bold truncate ${isActive ? 'text-white' : 'text-dashboard-text'}`, children: user.name }), isSelf && _jsx("span", { className: "size-1.5 rounded-full bg-emerald-400 animate-pulse" })] }), _jsx("span", { className: `block text-[10px] font-medium uppercase tracking-wider opacity-60 truncate ${isActive ? 'text-white' : 'text-dashboard-text-secondary'}`, children: user.role })] }), _jsx(ChevronRight, { size: 16, className: `transition-transform ${isActive ? 'translate-x-1 opacity-100' : 'opacity-0 group-hover:opacity-40'}` })] }, user._id));
+                                    }) }) })] }), _jsx("main", { className: "flex-1 min-w-0 h-full", children: _jsx(AnimatePresence, { mode: "wait", children: activeUser ? (_jsxs(motion.div, { initial: { opacity: 0, scale: 0.98 }, animate: { opacity: 1, scale: 1 }, className: "h-full bg-dashboard-card/40 backdrop-blur-2xl rounded-[2.5rem] border border-dashboard-border/40 overflow-hidden flex flex-col relative", children: [_jsx("div", { className: "absolute top-0 right-0 w-full h-64 bg-gradient-to-b from-primary/10 to-transparent pointer-events-none" }), _jsxs("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-10 space-y-12 relative z-10", children: [_jsxs("div", { className: "flex items-center gap-10", children: [_jsxs("div", { className: "relative", children: [_jsx("div", { className: "size-32 rounded-[2.5rem] bg-primary flex items-center justify-center text-4xl font-bold text-white shadow-2xl shadow-primary/30 overflow-hidden", children: activeUser.image ? _jsx("img", { src: activeUser.image, className: "size-full object-cover" }) : activeUser.name[0].toUpperCase() }), _jsx("div", { className: "absolute -bottom-2 -right-2 p-3 bg-dashboard-card border border-dashboard-border rounded-2xl shadow-xl", children: activeUser.role === 'dev' ? _jsx(ShieldCheck, { className: "text-primary", size: 24 }) : _jsx(Shield, { className: "text-emerald-500", size: 24 }) })] }), _jsxs("div", { className: "space-y-3", children: [_jsxs("div", { className: "flex items-center gap-4", children: [_jsx("h2", { className: "text-4xl font-bold text-dashboard-text tracking-tight uppercase italic", children: activeUser.name }), activeUser.email === currentUserEmail && (_jsx("span", { className: "px-3 py-1 bg-emerald-500/10 text-emerald-500 text-[10px] font-bold uppercase tracking-widest rounded-lg border border-emerald-500/20", children: "Active Session" }))] }), _jsxs("div", { className: "flex items-center gap-6 text-sm text-dashboard-text-secondary/70", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Mail, { size: 16, className: "text-primary/60" }), activeUser.email] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Calendar, { size: 16, className: "text-primary/60" }), "Joined ", new Date(activeUser.createdAt).toLocaleDateString()] })] }), _jsxs("div", { className: `inline-flex items-center px-4 py-1.5 rounded-full border text-[10px] font-bold uppercase tracking-[0.2em] ${getRoleStyles(activeUser.role)}`, children: [activeUser.role, " Account"] })] })] }), _jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-8", children: [_jsxs("div", { className: "space-y-6", children: [_jsx("h4", { className: "text-[10px] font-bold text-primary uppercase tracking-[0.3em] ml-1", children: "Account Permissions" }), _jsx("div", { className: "space-y-3", children: permissions[activeUser.role].map((perm, i) => (_jsxs("div", { className: "flex items-center gap-4 p-4 bg-dashboard-bg/40 border border-dashboard-border/30 rounded-2xl group hover:border-primary/40 transition-all", children: [_jsx("div", { className: "size-2 rounded-full bg-primary/40 group-hover:bg-primary shadow-[0_0_8px_rgba(var(--color-primary),0.5)] transition-all" }), _jsx("span", { className: "text-sm font-semibold text-dashboard-text/90", children: perm }), _jsx(Check, { size: 14, className: "ml-auto text-emerald-500" })] }, i))) })] }), _jsxs("div", { className: "space-y-6", children: [_jsx("h4", { className: "text-[10px] font-bold text-primary uppercase tracking-[0.3em] ml-1", children: "Account Actions" }), _jsxs("div", { className: "bg-dashboard-bg/40 border border-dashboard-border/30 rounded-3xl p-8 space-y-8 h-fit", children: [_jsx("p", { className: "text-xs text-dashboard-text-secondary leading-relaxed font-medium", children: "Manage this user's details, password, and access level within your dashboard." }), _jsx("div", { className: "flex flex-col gap-3", children: canActionUser(activeUser) ? (_jsxs(_Fragment, { children: [_jsxs("button", { onClick: () => handleOpenEdit(activeUser), className: "w-full flex items-center justify-center gap-3 py-4 bg-dashboard-card border border-dashboard-border/60 rounded-2xl text-xs font-bold uppercase tracking-widest text-dashboard-text hover:bg-primary hover:text-white hover:border-primary transition-all active:scale-[0.98]", children: [_jsx(Edit2, { size: 16 }), "Edit User Details"] }), _jsxs("button", { onClick: () => handleDelete(activeUser), className: "w-full flex items-center justify-center gap-3 py-4 bg-red-500/10 border border-red-500/20 rounded-2xl text-xs font-bold uppercase tracking-widest text-red-500 hover:bg-red-500 hover:text-white transition-all active:scale-[0.98]", children: [_jsx(Trash2, { size: 16 }), "Remove User"] })] })) : (_jsxs("div", { className: "p-6 rounded-2xl bg-neutral-500/5 border border-dashed border-neutral-500/20 text-center", children: [_jsx(Shield, { size: 24, className: "mx-auto mb-3 text-neutral-500/40" }), _jsx("span", { className: "text-[10px] font-bold text-neutral-500 uppercase tracking-widest", children: "Protected Account" })] })) })] })] })] })] })] }, activeUser._id)) : (_jsx("div", { className: "h-full flex items-center justify-center bg-dashboard-card/20 rounded-[2.5rem] border border-dashed border-dashboard-border/40", children: _jsxs("div", { className: "text-center space-y-4", children: [_jsx("div", { className: "size-20 bg-primary/10 rounded-3xl flex items-center justify-center mx-auto text-primary/40", children: _jsx(Users, { size: 40 }) }), _jsx("p", { className: "text-sm font-bold text-dashboard-text-secondary uppercase tracking-widest", children: "Select a node to inspect" })] }) })) }) })] }), _jsx(AnimatePresence, { children: isModalOpen && (_jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 sm:p-6 bg-black/40 backdrop-blur-md", children: _jsxs(motion.div, { initial: { opacity: 0, scale: 0.95, y: 10 }, animate: { opacity: 1, scale: 1, y: 0 }, exit: { opacity: 0, scale: 0.95, y: 10 }, className: "bg-dashboard-card/90 backdrop-blur-2xl w-full max-w-md rounded-[2rem] shadow-2xl overflow-hidden flex flex-col max-h-[90vh] border border-dashboard-border/40", children: [_jsxs("div", { className: "p-8 pb-4 flex justify-between items-center shrink-0", children: [_jsxs("div", { children: [_jsx("h2", { className: "text-2xl font-bold text-dashboard-text tracking-tight leading-none mb-2", children: modalMode === 'create' ? 'New Account' : 'Update Account' }), _jsx("p", { className: "text-[10px] font-bold text-primary uppercase tracking-widest opacity-80", children: modalMode === 'create' ? 'Define identity and permissions' : `Modifying ${selectedUser?.name}` })] }), _jsx("button", { onClick: () => setIsModalOpen(false), className: "hover:text-red-500 transition-all p-2 bg-dashboard-bg/50 rounded-xl border border-dashboard-border/40 active:scale-90", children: _jsx(X, { size: 20 }) })] }), _jsxs("form", { onSubmit: handleSubmit, className: "flex-1 overflow-y-auto px-8 pb-8 space-y-6 custom-scrollbar", children: [_jsxs("div", { className: "space-y-2", children: [_jsx("label", { className: "text-[10px] font-bold text-dashboard-text-secondary uppercase tracking-widest ml-1 opacity-60", children: "Account Identity" }), _jsxs("div", { className: "relative group", children: [_jsx(UserCircle, { className: "absolute left-4 top-1/2 -translate-y-1/2 text-dashboard-text-secondary/40 group-focus-within:text-primary transition-colors", size: 18 }), _jsx("input", { required: true, className: "w-full pl-12 pr-6 py-3 bg-dashboard-bg/50 border border-dashboard-border/40 rounded-xl focus:ring-2 focus:ring-primary/20 focus:border-primary/30 outline-none text-sm font-semibold transition-all text-dashboard-text", value: formData.name, onChange: e => setFormData({ ...formData, name: e.target.value }), placeholder: "e.g. Sarah Jenkins" })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("label", { className: "text-[10px] font-bold text-dashboard-text-secondary uppercase tracking-widest ml-1 opacity-60", children: "Email Endpoint" }), _jsxs("div", { className: "relative group", children: [_jsx(Mail, { className: "absolute left-4 top-1/2 -translate-y-1/2 text-dashboard-text-secondary/40 group-focus-within:text-primary transition-colors", size: 18 }), _jsx("input", { required: true, type: "email", className: "w-full pl-12 pr-6 py-3 bg-dashboard-bg/50 border border-dashboard-border/40 rounded-xl focus:ring-2 focus:ring-primary/20 focus:border-primary/30 outline-none text-sm font-semibold transition-all text-dashboard-text", value: formData.email, onChange: e => setFormData({ ...formData, email: e.target.value }), placeholder: "sarah@yourteam.com" })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("label", { className: "text-[10px] font-bold text-dashboard-text-secondary uppercase tracking-widest ml-1 opacity-60", children: modalMode === 'create' ? 'Security Credentials' : 'New Password (Optional)' }), _jsxs("div", { className: "relative group", children: [_jsx(Key, { className: "absolute left-4 top-1/2 -translate-y-1/2 text-dashboard-text-secondary/40 group-focus-within:text-primary transition-colors", size: 18 }), _jsx("input", { required: modalMode === 'create', type: showPassword ? "text" : "password", className: "w-full pl-12 pr-28 py-3 bg-dashboard-bg/50 border border-dashboard-border/40 rounded-xl focus:ring-2 focus:ring-primary/20 focus:border-primary/30 outline-none text-sm font-mono font-bold transition-all text-dashboard-text", value: formData.password, onChange: e => setFormData({ ...formData, password: e.target.value }), placeholder: modalMode === 'edit' ? "Keep current" : "" }), _jsxs("div", { className: "absolute right-3 top-1/2 -translate-y-1/2 flex items-center gap-1.5", children: [_jsx("button", { type: "button", onClick: () => setShowPassword(!showPassword), className: "p-1.5 text-dashboard-text-secondary/60 hover:text-primary transition-colors bg-dashboard-card/50 rounded-lg border border-dashboard-border/40", children: showPassword ? _jsx(EyeOff, { size: 14 }) : _jsx(Eye, { size: 14 }) }), _jsx("button", { type: "button", onClick: copyToClipboard, className: "p-1.5 text-dashboard-text-secondary/60 hover:text-primary transition-colors bg-dashboard-card/50 rounded-lg border border-dashboard-border/40", children: copied ? _jsx(Check, { size: 14, className: "text-emerald-500" }) : _jsx(Copy, { size: 14 }) })] })] }), _jsxs("button", { type: "button", onClick: generateTempPassword, className: "text-[9px] text-primary/80 font-bold uppercase tracking-widest hover:text-primary transition-colors ml-1 flex items-center gap-2", children: [_jsx(Key, { size: 10 }), " Auto-generate secure protocol"] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("label", { className: "text-[10px] font-bold text-dashboard-text-secondary uppercase tracking-widest ml-1 opacity-60", children: "Access Configuration" }), _jsxs("div", { className: "relative", children: [_jsxs("select", { className: "w-full px-5 py-3 bg-dashboard-bg/50 border border-dashboard-border/40 rounded-xl focus:ring-2 focus:ring-primary/20 focus:border-primary/30 outline-none text-xs font-bold uppercase tracking-wider appearance-none cursor-pointer text-dashboard-text", value: formData.role, onChange: e => setFormData({ ...formData, role: e.target.value }), children: [_jsx("option", { value: "editor", children: "Content Editor" }), _jsx("option", { value: "admin", children: "System Administrator" }), currentUserRole === 'dev' && _jsx("option", { value: "dev", children: "Technical Developer" })] }), _jsx("div", { className: "absolute right-5 top-1/2 -translate-y-1/2 pointer-events-none text-primary/60", children: _jsx(Shield, { size: 16 }) })] })] }), _jsx("button", { type: "submit", disabled: isProcessing, className: "group relative w-full py-4 bg-primary text-white rounded-xl text-xs font-bold uppercase tracking-widest overflow-hidden transition-all shadow-lg shadow-primary/20 hover:scale-[1.01] active:scale-95 flex items-center justify-center gap-3 mt-4", children: isProcessing ? _jsx(Loader2, { className: "animate-spin relative z-10", size: 18 }) : (_jsxs(_Fragment, { children: [modalMode === 'create' ? _jsx(UserPlus, { size: 18, className: "relative z-10" }) : _jsx(Edit2, { size: 18, className: "relative z-10" }), _jsx("span", { className: "relative z-10", children: modalMode === 'create' ? 'Initialize Account' : 'Commit Updates' })] })) })] })] }) })) })] }));
 }