@arch-cadre/panel 0.0.1 → 1.0.2

package/dist/ui/rbac/pages/rbac-admin.cjs

@@ -0,0 +1,328 @@
+"use strict";
+"use client";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+module.exports = RbacAdminPage;
+var _intl = require("@arch-cadre/intl");
+var _ui = require("@arch-cadre/ui");
+var _button = require("@arch-cadre/ui/components/button");
+var _card = require("@arch-cadre/ui/components/card");
+var _dialog = require("@arch-cadre/ui/components/dialog");
+var _input = require("@arch-cadre/ui/components/input");
+var _table = require("@arch-cadre/ui/components/table");
+var _react = _interopRequireWildcard(require("react"));
+var React = _react;
+var _rbac = require("../../../actions/rbac/index.cjs");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function RbacAdminPage() {
+  const [roles, setRoles] = (0, _react.useState)([]);
+  const [permissions, setPermissions] = (0, _react.useState)([]);
+  const [users, setUsers] = (0, _react.useState)([]);
+  const [loading, setLoading] = (0, _react.useState)(true);
+  const {
+    t
+  } = (0, _intl.useTranslation)();
+  const [newRoleName, setNewRoleName] = (0, _react.useState)("");
+  const [newPermissionName, setNewPermissionName] = (0, _react.useState)("");
+  const [selectedRole, setSelectedRole] = (0, _react.useState)(null);
+  const [rolePermissions, setRolePermissions] = (0, _react.useState)([]);
+  const [selectedUser, setSelectedUser] = (0, _react.useState)(null);
+  const [userRbacData, setUserRbacData] = (0, _react.useState)({
+    roles: [],
+    directPermissions: [],
+    effectivePermissions: []
+  });
+  const loadData = (0, _react.useCallback)(async () => {
+    setLoading(true);
+    try {
+      const [r, p, u] = await Promise.all([(0, _rbac.getRoles)(), (0, _rbac.getPermissions)(), (0, _rbac.getUsers)()]);
+      setRoles(r);
+      setPermissions(p);
+      setUsers(u);
+    } catch (e) {
+      console.error("[RBAC] Failed to load initial data:", e);
+      _ui.toast.error(t("Failed to load RBAC data."));
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+  const loadRolePermissions = (0, _react.useCallback)(async roleId => {
+    try {
+      const p = await (0, _rbac.getRolePermissions)(roleId);
+      setRolePermissions(p);
+    } catch (e) {
+      console.error(`[RBAC] Failed to load permissions for role ${roleId}:`, e);
+      _ui.toast.error(t("Failed to load permissions for role."));
+    }
+  }, []);
+  const loadUserRbacData = (0, _react.useCallback)(async userId => {
+    try {
+      const data = await (0, _rbac.getUserRbacData)(userId);
+      setUserRbacData(data);
+    } catch (e) {
+      console.error(`[RBAC] Failed to load RBAC data for user ${userId}:`, e);
+      _ui.toast.error(t("Failed to load user RBAC data."));
+    }
+  }, []);
+  (0, _react.useEffect)(() => {
+    loadData();
+  }, [loadData]);
+  (0, _react.useEffect)(() => {
+    if (selectedRole?.id) {
+      loadRolePermissions(selectedRole.id);
+    }
+  }, [selectedRole?.id, loadRolePermissions]);
+  (0, _react.useEffect)(() => {
+    if (selectedUser?.id) {
+      loadUserRbacData(selectedUser.id);
+    }
+  }, [selectedUser?.id, loadUserRbacData]);
+  const handleCreateRole = (0, _react.useCallback)(async () => {
+    if (!newRoleName) return;
+    try {
+      await (0, _rbac.createRole)(newRoleName);
+      setNewRoleName("");
+      _ui.toast.success(t("Role created."));
+      loadData();
+    } catch (_e) {
+      _ui.toast.error(t("Failed to create role."));
+    }
+  }, [newRoleName, loadData]);
+  const handleCreatePermission = (0, _react.useCallback)(async () => {
+    if (!newPermissionName) return;
+    try {
+      await (0, _rbac.createPermission)(newPermissionName);
+      setNewPermissionName("");
+      _ui.toast.success(t("Permission created."));
+      loadData();
+    } catch (_e) {
+      _ui.toast.error(t("Failed to create permission."));
+    }
+  }, [newPermissionName, loadData]);
+  const handleDeleteRole = (0, _react.useCallback)(async id => {
+    try {
+      await (0, _rbac.deleteRole)(id);
+      _ui.toast.success(t("Role deleted."));
+      if (selectedRole?.id === id) setSelectedRole(null);
+      loadData();
+    } catch (_e) {
+      _ui.toast.error(t("Failed to delete role."));
+    }
+  }, [selectedRole, loadData]);
+  const handleDeletePermission = (0, _react.useCallback)(async id => {
+    try {
+      await (0, _rbac.deletePermission)(id);
+      _ui.toast.success(t("Permission deleted."));
+      loadData();
+    } catch (_e) {
+      _ui.toast.error(t("Failed to delete permission."));
+    }
+  }, [loadData]);
+  const togglePermissionForRole = (0, _react.useCallback)(async (permId, hasIt) => {
+    if (!selectedRole) return;
+    try {
+      if (hasIt) {
+        await (0, _rbac.revokePermissionFromRole)(selectedRole.id, permId);
+      } else {
+        await (0, _rbac.assignPermissionToRole)(selectedRole.id, permId);
+      }
+      loadRolePermissions(selectedRole.id);
+    } catch (_e) {
+      _ui.toast.error(t("Action failed."));
+    }
+  }, [selectedRole, loadRolePermissions]);
+  const toggleRoleForUser = (0, _react.useCallback)(async (roleId, hasIt) => {
+    if (!selectedUser) return;
+    try {
+      if (hasIt) {
+        await (0, _rbac.revokeRoleFromUser)(selectedUser.id, roleId);
+      } else {
+        await (0, _rbac.assignRoleToUser)(selectedUser.id, roleId);
+      }
+      loadUserRbacData(selectedUser.id);
+    } catch (_e) {
+      _ui.toast.error(t("Action failed."));
+    }
+  }, [selectedUser, loadUserRbacData]);
+  const togglePermissionForUser = (0, _react.useCallback)(async (permId, hasIt) => {
+    if (!selectedUser) return;
+    try {
+      if (hasIt) {
+        await (0, _rbac.revokePermissionFromUser)(selectedUser.id, permId);
+      } else {
+        await (0, _rbac.assignPermissionToUser)(selectedUser.id, permId);
+      }
+      loadUserRbacData(selectedUser.id);
+    } catch (_e) {
+      _ui.toast.error(t("Action failed."));
+    }
+  }, [selectedUser, loadUserRbacData]);
+  return /* @__PURE__ */React.createElement("div", {
+    className: "space-y-6"
+  }, /* @__PURE__ */React.createElement("div", {
+    className: "space-y-1"
+  }, /* @__PURE__ */React.createElement("h1", {
+    className: "text-3xl font-black tracking-tight flex items-center gap-2"
+  }, t("Role-Based Access Control Manager")), /* @__PURE__ */React.createElement("p", {
+    className: "text-muted-foreground"
+  }, t("Manage roles, permissions, and their relationships."))), /* @__PURE__ */React.createElement("div", {
+    className: "grid gap-6 lg:grid-cols-3"
+  }, /* @__PURE__ */React.createElement(_card.Card, {
+    className: "border-primary/5 shadow-sm"
+  }, /* @__PURE__ */React.createElement(_card.CardHeader, null, /* @__PURE__ */React.createElement(_card.CardTitle, null, t("Roles")), /* @__PURE__ */React.createElement(_card.CardDescription, null, t("System roles."))), /* @__PURE__ */React.createElement(_card.CardContent, {
+    className: "space-y-4"
+  }, /* @__PURE__ */React.createElement("div", {
+    className: "flex gap-2"
+  }, /* @__PURE__ */React.createElement(_input.Input, {
+    placeholder: t("New role..."),
+    value: newRoleName,
+    onChange: e => setNewRoleName(e.target.value)
+  }), /* @__PURE__ */React.createElement(_button.Button, {
+    onClick: handleCreateRole
+  }, t("Add"))), /* @__PURE__ */React.createElement("div", {
+    className: "border rounded-md max-h-[300px] overflow-auto"
+  }, /* @__PURE__ */React.createElement(_table.Table, null, /* @__PURE__ */React.createElement(_table.TableBody, null, roles.map(role => /* @__PURE__ */React.createElement(_table.TableRow, {
+    key: role.id,
+    className: selectedRole?.id === role.id ? "bg-primary/5" : ""
+  }, /* @__PURE__ */React.createElement(_table.TableCell, {
+    className: "font-medium cursor-pointer",
+    onClick: () => setSelectedRole(role)
+  }, role.name), /* @__PURE__ */React.createElement(_table.TableCell, {
+    className: "text-right"
+  }, /* @__PURE__ */React.createElement(_button.Button, {
+    variant: "ghost",
+    size: "icon",
+    onClick: () => handleDeleteRole(role.id)
+  }, /* @__PURE__ */React.createElement(_ui.Icon, {
+    icon: "solar:trash-bin-trash-bold",
+    className: "size-4 text-destructive"
+  })))))))))), /* @__PURE__ */React.createElement(_card.Card, {
+    className: "border-primary/5 shadow-sm"
+  }, /* @__PURE__ */React.createElement(_card.CardHeader, null, /* @__PURE__ */React.createElement(_card.CardTitle, null, t("Permissions")), /* @__PURE__ */React.createElement(_card.CardDescription, null, t("System permissions."))), /* @__PURE__ */React.createElement(_card.CardContent, {
+    className: "space-y-4"
+  }, /* @__PURE__ */React.createElement("div", {
+    className: "flex gap-2"
+  }, /* @__PURE__ */React.createElement(_input.Input, {
+    placeholder: t("New permission..."),
+    value: newPermissionName,
+    onChange: e => setNewPermissionName(e.target.value)
+  }), /* @__PURE__ */React.createElement(_button.Button, {
+    onClick: handleCreatePermission
+  }, t("Add"))), /* @__PURE__ */React.createElement("div", {
+    className: "border rounded-md max-h-[300px] overflow-auto"
+  }, /* @__PURE__ */React.createElement(_table.Table, null, /* @__PURE__ */React.createElement(_table.TableBody, null, permissions.map(perm => /* @__PURE__ */React.createElement(_table.TableRow, {
+    key: perm.id
+  }, /* @__PURE__ */React.createElement(_table.TableCell, {
+    className: "font-medium"
+  }, perm.name), /* @__PURE__ */React.createElement(_table.TableCell, {
+    className: "text-right"
+  }, /* @__PURE__ */React.createElement(_button.Button, {
+    variant: "ghost",
+    size: "icon",
+    onClick: () => handleDeletePermission(perm.id)
+  }, /* @__PURE__ */React.createElement(_ui.Icon, {
+    icon: "solar:trash-bin-trash-bold",
+    className: "size-4 text-destructive"
+  })))))))))), /* @__PURE__ */React.createElement(_card.Card, {
+    className: "border-primary/5 shadow-sm"
+  }, /* @__PURE__ */React.createElement(_card.CardHeader, null, /* @__PURE__ */React.createElement(_card.CardTitle, null, t("Users")), /* @__PURE__ */React.createElement(_card.CardDescription, null, t("Manage user roles."))), /* @__PURE__ */React.createElement(_card.CardContent, {
+    className: "space-y-4"
+  }, /* @__PURE__ */React.createElement("div", {
+    className: "border rounded-md max-h-[358px] overflow-auto"
+  }, /* @__PURE__ */React.createElement(_table.Table, null, /* @__PURE__ */React.createElement(_table.TableBody, null, users.map(user => /* @__PURE__ */React.createElement(_table.TableRow, {
+    key: user.id,
+    className: selectedUser?.id === user.id ? "bg-primary/5" : ""
+  }, /* @__PURE__ */React.createElement(_table.TableCell, {
+    className: "font-medium cursor-pointer",
+    onClick: () => setSelectedUser(user)
+  }, /* @__PURE__ */React.createElement("div", null, user.name), /* @__PURE__ */React.createElement("div", {
+    className: "text-[10px] text-muted-foreground"
+  }, user.email)))))))))), /* @__PURE__ */React.createElement(_dialog.Dialog, {
+    open: !!selectedRole,
+    onOpenChange: open => !open && setSelectedRole(null)
+  }, /* @__PURE__ */React.createElement(_dialog.DialogContent, null, /* @__PURE__ */React.createElement(_dialog.DialogHeader, null, /* @__PURE__ */React.createElement(_dialog.DialogTitle, null, t("Edit Role: {roleName}", {
+    roleName: selectedRole?.name
+  })), /* @__PURE__ */React.createElement(_dialog.DialogDescription, null, t("Manage permissions for role {roleName}", {
+    roleName: selectedRole?.name
+  })), /* @__PURE__ */React.createElement("div", {
+    className: "grid grid-cols-1 sm:grid-cols-2 gap-2"
+  }, permissions.map(perm => {
+    const hasIt = rolePermissions.some(rp => rp.id === perm.id);
+    return /* @__PURE__ */React.createElement(_button.Button, {
+      key: perm.id,
+      variant: hasIt ? "default" : "outline",
+      size: "sm",
+      className: "justify-start gap-2 h-auto py-2 px-3 overflow-hidden",
+      onClick: () => togglePermissionForRole(perm.id, hasIt)
+    }, /* @__PURE__ */React.createElement(_ui.Icon, {
+      icon: hasIt ? "solar:check-circle-bold" : "solar:circle-linear",
+      className: hasIt ? "text-primary-foreground" : "text-muted-foreground"
+    }), /* @__PURE__ */React.createElement("span", {
+      className: "truncate text-xs"
+    }, perm.name));
+  }))))), /* @__PURE__ */React.createElement(_dialog.Dialog, {
+    open: !!selectedUser,
+    onOpenChange: open => !open && setSelectedUser(null)
+  }, /* @__PURE__ */React.createElement(_dialog.DialogContent, null, /* @__PURE__ */React.createElement(_dialog.DialogHeader, null, /* @__PURE__ */React.createElement(_dialog.DialogTitle, null, t("Management for {selectedUser}", {
+    selectedUser: selectedUser?.name
+  })), /* @__PURE__ */React.createElement(_dialog.DialogDescription, null, t("Manage roles and permissions for {selectedUser}", {
+    selectedUser: selectedUser?.name
+  })), /* @__PURE__ */React.createElement("div", {
+    className: "space-y-6"
+  }, /* @__PURE__ */React.createElement("div", null, /* @__PURE__ */React.createElement("p", {
+    className: "text-[10px] font-black uppercase text-muted-foreground tracking-widest mb-3"
+  }, t("User Roles")), /* @__PURE__ */React.createElement("div", {
+    className: "grid grid-cols-1 sm:grid-cols-2 gap-2"
+  }, roles.map(role => {
+    const hasIt = userRbacData.roles.some(ur => ur.id === role.id);
+    return /* @__PURE__ */React.createElement(_button.Button, {
+      key: role.id,
+      variant: hasIt ? "default" : "outline",
+      size: "sm",
+      className: "justify-start gap-2 h-auto py-2 px-3 overflow-hidden",
+      onClick: () => toggleRoleForUser(role.id, hasIt)
+    }, /* @__PURE__ */React.createElement(_ui.Icon, {
+      icon: hasIt ? "solar:check-circle-bold" : "solar:circle-linear",
+      className: hasIt ? "text-primary-foreground" : "text-muted-foreground"
+    }), /* @__PURE__ */React.createElement("span", {
+      className: "truncate text-xs"
+    }, role.name));
+  }))), /* @__PURE__ */React.createElement("div", null, /* @__PURE__ */React.createElement("p", {
+    className: "text-[10px] font-black uppercase text-muted-foreground tracking-widest mb-3"
+  }, t("Direct Permissions (User-specific)")), /* @__PURE__ */React.createElement("div", {
+    className: "grid grid-cols-1 sm:grid-cols-2 gap-2"
+  }, permissions.map(perm => {
+    const isDirect = userRbacData.directPermissions.some(up => up.id === perm.id);
+    return /* @__PURE__ */React.createElement(_button.Button, {
+      key: perm.id,
+      variant: isDirect ? "default" : "outline",
+      size: "sm",
+      className: "justify-start gap-2 h-auto py-2 px-3 overflow-hidden",
+      onClick: () => togglePermissionForUser(perm.id, isDirect)
+    }, /* @__PURE__ */React.createElement(_ui.Icon, {
+      icon: isDirect ? "solar:check-circle-bold" : "solar:circle-linear",
+      className: isDirect ? "text-primary-foreground" : "text-muted-foreground"
+    }), /* @__PURE__ */React.createElement("span", {
+      className: "truncate text-xs"
+    }, perm.name));
+  }))), /* @__PURE__ */React.createElement("div", {
+    className: "pt-4 border-t"
+  }, /* @__PURE__ */React.createElement("p", {
+    className: "text-[10px] font-black uppercase text-muted-foreground tracking-widest mb-2"
+  }, t("Effective Permissions (inherited + direct)")), /* @__PURE__ */React.createElement("div", {
+    className: "flex flex-wrap gap-1"
+  }, userRbacData.effectivePermissions.map(p => /* @__PURE__ */React.createElement("div", {
+    key: p.id,
+    className: "bg-muted px-2 py-0.5 rounded text-[9px] font-mono"
+  }, p.name)), userRbacData.effectivePermissions.length === 0 && /* @__PURE__ */React.createElement("span", {
+    className: "text-[10px] italic"
+  }, t("No permissions")))))))), loading && /* @__PURE__ */React.createElement("div", {
+    className: "fixed inset-0 bg-background/50 backdrop-blur-sm flex items-center justify-center z-50"
+  }, /* @__PURE__ */React.createElement(_ui.Icon, {
+    icon: "svg-spinners:18-dots-indicator",
+    className: "size-12 text-primary"
+  })));
+}

package/dist/ui/rbac/pages/rbac-admin.d.ts

@@ -0,0 +1,2 @@
+import * as React from "react";
+export default function RbacAdminPage(): React.JSX.Element;