@goplusvn/core 0.1.0 → 0.1.2

package/src/rbac/pages/role-list-page.tsx

@@ -0,0 +1,378 @@
+"use client";
+
+import { useMemo, useCallback, useState } from "react";
+import { Loader2, UserCheck, UserX, KeyRound } from "lucide-react";
+import { 
+  Button, 
+  Badge,
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+  DialogFooter,
+  Avatar, 
+  AvatarFallback, 
+  AvatarImage 
+} from "../../ui";
+
+import type { CrudPermissions } from "../../types";
+
+import { RoleStatsCards } from "../components/roles/role-stats-cards";
+import { RoleToolbar } from "../components/roles/role-toolbar";
+import { RoleCard } from "../components/roles/role-card";
+import { useRolesData } from "../hooks/use-roles-data";
+import { useRoleOperations } from "../hooks/use-role-operations";
+import {
+  getUsersWithPermission,
+  getPermissionDescription,
+} from "../lib/permission-helpers";
+import type { Role, RolesResponse } from "../types";
+
+export interface RoleListPageProps {
+  dictionary: any;
+  permissions: CrudPermissions;
+  lang: string;
+  initialData: RolesResponse;
+  resources: Array<{
+    id: string;
+    code: string;
+    name: string;
+    group: string | null;
+    description: string | null;
+    icon: string | null;
+    order: number | null;
+    config: any;
+  }>;
+  actions: Array<{
+    id: string;
+    code: string;
+    name: string;
+    description: string | null;
+    isDefault?: boolean;
+  }>;
+}
+
+export function RoleListPage({
+  dictionary,
+  permissions,
+  lang,
+  initialData,
+  resources,
+  actions,
+}: RoleListPageProps) {
+  const canCreate = permissions.create;
+  const canUpdate = permissions.update;
+  const canDelete = permissions.delete;
+  const canImport = permissions.import;
+  const canExport = permissions.export;
+
+  // Data fetching
+  const {
+    roles,
+    totalRows,
+    activeRolesCount,
+    searchTerm,
+    statusFilter,
+    setSearchTerm,
+    setStatusFilter,
+    error,
+    isLoading,
+    mutate,
+  } = useRolesData(initialData);
+
+  // Role operations
+  const {
+    handleDeleteRole,
+    handleDuplicateRole,
+  } = useRoleOperations(mutate);
+
+  // UI State
+  const [isDeleteDialogOpen, setIsDeleteDialogOpen] = useState(false);
+  const [roleToDelete, setRoleToDelete] = useState<Role | null>(null);
+  const [isPermissionDetailOpen, setIsPermissionDetailOpen] = useState(false);
+  const [selectedPermission, setSelectedPermission] = useState<string | null>(
+    null,
+  );
+
+  // Build dynamic permission matrix from resources and actions
+  const permissionMatrix = useMemo(() => {
+    return resources.map((resource) => {
+      // Default actions using database configuration
+      let allowedActions: string[] = [];
+      const defaultActions = actions.filter((a) => a.isDefault).map((a) => a.code);
+      // Fallback to hardcoded if no default actions found (safety check)
+      const effectiveDefaultActions = defaultActions.length > 0 
+        ? defaultActions 
+        : ["view", "create", "update", "delete"];
+
+      if (resource.config) {
+        try {
+          const config =
+            typeof resource.config === "string"
+              ? JSON.parse(resource.config)
+              : resource.config;
+
+          if (config.actions && Array.isArray(config.actions)) {
+            // Case 2: Config exists -> use configured actions (even if empty)
+            const allowedCodes = config.actions;
+            allowedActions = actions
+              .map((a) => a.code)
+              .filter((code) => allowedCodes.includes(code));
+          } else {
+             // Config exists but no actions array -> use defaults
+             allowedActions = actions
+              .map((a) => a.code)
+              .filter((code) => effectiveDefaultActions.includes(code));
+          }
+        } catch (e) {
+          // Ignore config parsing errors, fallback to defaults
+          console.warn("Failed to parse resource config", e);
+          allowedActions = actions
+            .map((a) => a.code)
+            .filter((code) => effectiveDefaultActions.includes(code));
+        }
+      } else {
+        // Case 1: No config -> use defaults
+        allowedActions = actions
+          .map((a) => a.code)
+          .filter((code) => effectiveDefaultActions.includes(code));
+      }
+
+      return {
+        resource: resource.code,
+        name: resource.name,
+        icon: resource.icon || "📄",
+        actions: allowedActions,
+      };
+    });
+  }, [resources, actions]);
+
+  const totalPermissions = useMemo(
+    () => permissionMatrix.flatMap((r) => r.actions).length,
+    [permissionMatrix],
+  );
+
+  const totalUsers = useMemo(
+    () => roles.reduce((sum, role) => sum + role.usersCount, 0),
+    [roles],
+  );
+
+  // Handlers
+  const openDeleteDialog = useCallback((role: Role) => {
+    setRoleToDelete(role);
+    setIsDeleteDialogOpen(true);
+  }, []);
+
+  const handleDelete = useCallback(async () => {
+    if (!roleToDelete) return;
+    const success = await handleDeleteRole(roleToDelete.id);
+    if (success) {
+      setIsDeleteDialogOpen(false);
+      setRoleToDelete(null);
+    }
+  }, [roleToDelete, handleDeleteRole]);
+
+  // Memoize users with permission calculation
+  const getUsersForPermission = useCallback(
+    (permission: string) => {
+      return getUsersWithPermission(permission, roles);
+    },
+    [roles],
+  );
+
+  if (isLoading) {
+    return (
+      <div className="flex items-center justify-center h-96">
+        <Loader2 className="h-8 w-8 animate-spin text-muted-foreground" />
+      </div>
+    );
+  }
+
+  if (error) {
+    return (
+      <div className="text-red-500">Không thể tải dữ liệu: {error.message}</div>
+    );
+  }
+
+  return (
+    <div className="space-y-4">
+      <RoleStatsCards
+        totalRoles={totalRows}
+        activeRoles={activeRolesCount}
+        totalPermissions={totalPermissions}
+        totalUsers={totalUsers}
+      />
+
+      <RoleToolbar
+        dictionary={dictionary}
+        totalRows={totalRows}
+        searchTerm={searchTerm}
+        statusFilter={statusFilter}
+        onSearchChange={setSearchTerm}
+        onStatusFilterChange={setStatusFilter}
+        lang={lang}
+        canCreate={canCreate}
+        canImport={canImport}
+        canExport={canExport}
+      />
+
+      {/* Roles Grid */}
+      <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4">
+        {roles.length === 0 && !isLoading ? (
+          <div className="col-span-full text-center py-8">
+            <p className="text-muted-foreground">
+              {roles.length === 0
+                ? "Không có dữ liệu roles"
+                : "Không tìm thấy roles phù hợp với bộ lọc"}
+            </p>
+          </div>
+        ) : null}
+        {roles.map((role) => (
+          <RoleCard
+            key={role.id}
+            role={role}
+            lang={lang}
+            canUpdate={canUpdate}
+            canCreate={canCreate}
+            canDelete={canDelete}
+            onDuplicate={handleDuplicateRole}
+            onDelete={openDeleteDialog}
+          />
+        ))}
+      </div>
+
+      {/* Delete Confirmation Dialog */}
+      <AlertDialog
+        open={isDeleteDialogOpen}
+        onOpenChange={setIsDeleteDialogOpen}
+      >
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle>Xác nhận xóa vai trò</AlertDialogTitle>
+            <AlertDialogDescription>
+              Bạn có chắc chắn muốn xóa vai trò "{roleToDelete?.name}"? Hành
+              động này không thể hoàn tác.
+            </AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel onClick={() => setRoleToDelete(null)}>
+              Hủy
+            </AlertDialogCancel>
+            <AlertDialogAction onClick={handleDelete}>Xóa</AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
+
+      {/* Permission Detail Dialog */}
+      <Dialog
+        open={isPermissionDetailOpen}
+        onOpenChange={setIsPermissionDetailOpen}
+      >
+        <DialogContent className="max-w-2xl">
+          <DialogHeader>
+            <DialogTitle className="flex items-center space-x-2">
+              <KeyRound className="h-5 w-5" />
+              <span>Chi tiết Quyền hạn</span>
+            </DialogTitle>
+            <DialogDescription>
+              Xem danh sách người dùng được gán quyền hạn này
+            </DialogDescription>
+          </DialogHeader>
+
+          {selectedPermission && (
+            <div className="space-y-4">
+              <div className="p-4 bg-muted/50 rounded-lg">
+                <div className="flex items-center space-x-2 mb-2">
+                  <Badge variant="outline" className="text-sm">
+                    {selectedPermission.split(":")[0]}
+                  </Badge>
+                  <span className="text-muted-foreground">:</span>
+                  <Badge variant="outline" className="text-sm">
+                    {selectedPermission.split(":")[1]}
+                  </Badge>
+                </div>
+                <p className="text-sm text-muted-foreground">
+                  {getPermissionDescription(selectedPermission)}
+                </p>
+              </div>
+
+              {/* ... rest of the dialog content ... */}
+
+              <div>
+                <h4 className="font-medium mb-3">
+                  Người dùng có quyền này (
+                  {getUsersForPermission(selectedPermission).length})
+                </h4>
+                <div className="space-y-2 max-h-60 overflow-y-auto">
+                  {getUsersForPermission(selectedPermission).length > 0 ? (
+                    getUsersForPermission(selectedPermission).map((user) => (
+                      <div
+                        key={user.id}
+                        className="flex items-center space-x-3 p-3 bg-muted/30 rounded-lg"
+                      >
+                        <Avatar className="h-10 w-10">
+                          <AvatarImage
+                            src={user.image || undefined}
+                            alt={user.name || ""}
+                          />
+                          <AvatarFallback>
+                            {(user.name || "U")
+                              .split(" ")
+                              .map((n: string) => n[0])
+                              .join("")}
+                          </AvatarFallback>
+                        </Avatar>
+                        <div className="flex-1">
+                          <p className="font-medium">{user.name}</p>
+                          <p className="text-sm text-muted-foreground">
+                            {user.jobTitle || "N/A"}
+                          </p>
+                          <p className="text-xs text-muted-foreground">
+                            {user.email}
+                          </p>
+                        </div>
+                        <div className="flex items-center space-x-2">
+                          {user.isActive ? (
+                            <Badge variant="default" className="text-xs">
+                              <UserCheck className="h-3 w-3 mr-1" />
+                              Active
+                            </Badge>
+                          ) : (
+                            <Badge variant="secondary" className="text-xs">
+                              <UserX className="h-3 w-3 mr-1" />
+                              Inactive
+                            </Badge>
+                          )}
+                        </div>
+                      </div>
+                    ))
+                  ) : (
+                    <div className="text-center p-6 text-muted-foreground">
+                      <UserX className="h-12 w-12 mx-auto mb-3 opacity-50" />
+                      <p>Không có người dùng nào có quyền này</p>
+                    </div>
+                  )}
+                </div>
+              </div>
+            </div>
+          )}
+
+          <DialogFooter>
+            <Button onClick={() => setIsPermissionDetailOpen(false)}>
+              Đóng
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </div>
+  );
+}

package/src/rbac/permission-service.ts

@@ -0,0 +1,140 @@
+import type { Permission } from "../types";
+import { logger } from "../utils";
+import { getFromCache, pendingQueries, setToCache } from "./index";
+
+/**
+ * Interface defining the subset of Prisma Client required for RBAC operations.
+ * This allows the service to be agnostic of the actual PrismaClient instance.
+ */
+export interface RBACPrismaClient {
+  userRole: {
+    findMany: (args: {
+      where: { userId: string };
+      select: {
+        roleCode: boolean;
+        role: {
+          select: {
+            rolePermissions: {
+              select: {
+                resourceCode: boolean;
+                actionCode: boolean;
+              };
+            };
+          };
+        };
+      };
+    }) => Promise<
+      Array<{
+        roleCode: string;
+        role: {
+          rolePermissions: Array<{
+            resourceCode: string;
+            actionCode: string;
+          }>;
+        };
+      }>
+    >;
+  };
+}
+
+/**
+ * Fetch user permissions from database based on roles.
+ * Deduplicates permissions by resourceCode:actionCode.
+ *
+ * @param db - The tenant-specific Prisma Client instance
+ * @param userId - The user ID to fetch permissions for
+ */
+export async function getUserPermissionsFromDB(
+  db: RBACPrismaClient,
+  userId: string,
+): Promise<Permission[]> {
+  try {
+    const userRoles = await db.userRole.findMany({
+      where: { userId },
+      select: {
+        roleCode: true,
+        role: {
+          select: {
+            rolePermissions: {
+              select: {
+                resourceCode: true,
+                actionCode: true,
+              },
+            },
+          },
+        },
+      },
+    });
+
+    if (userRoles.length === 0) {
+      return [];
+    }
+
+    // Flatten permissions from all roles
+    const allPermissions = userRoles.flatMap((ur) =>
+      ur.role.rolePermissions.map((rp) => ({
+        resourceCode: rp.resourceCode,
+        actionCode: rp.actionCode,
+      })),
+    );
+
+    // Deduplicate by resourceCode:actionCode
+    const uniquePermissions = Array.from(
+      new Map(
+        allPermissions.map((p) => [
+          `${p.resourceCode}:${p.actionCode}`,
+          {
+            resourceCode: p.resourceCode,
+            actionCode: p.actionCode,
+          } as Permission,
+        ]),
+      ).values(),
+    ) as Permission[];
+
+    return uniquePermissions;
+  } catch (error) {
+    logger.error("Error fetching user permissions from DB", error);
+    return [];
+  }
+}
+
+/**
+ * Get permissions with caching.
+ *
+ * @param db - The tenant-specific Prisma Client instance
+ * @param userId - The user ID
+ * @param opts.forceRefresh - Bypass cache
+ */
+export async function getCachedUserPermissions(
+  db: RBACPrismaClient,
+  userId: string,
+  opts?: { forceRefresh?: boolean },
+): Promise<Permission[]> {
+  const force = opts?.forceRefresh === true;
+
+  if (!force) {
+    const cached = await getFromCache(userId);
+    if (cached) return cached;
+  }
+
+  // Check if there's already a pending query for this user
+  const pendingQuery = pendingQueries.get(userId);
+  if (pendingQuery) {
+    return pendingQuery;
+  }
+
+  // Create new query promise
+  const queryPromise = getUserPermissionsFromDB(db, userId)
+    .then(async (perms) => {
+      await setToCache(userId, perms);
+      pendingQueries.delete(userId); // Remove from pending when done
+      return perms;
+    })
+    .catch((error) => {
+      pendingQueries.delete(userId); // Remove from pending on error
+      throw error;
+    });
+
+  pendingQueries.set(userId, queryPromise);
+  return queryPromise;
+}

package/src/rbac/permissions.ts

@@ -0,0 +1,135 @@
+// @goerp/core/rbac/permissions
+// Server-only permission utilities - no client/UI imports
+// Use this in Server Components and API routes to avoid bundling client code
+
+import type { Permission } from "../types";
+import type { Session } from "next-auth";
+
+// ============================================================================
+// Action Mapping
+// ============================================================================
+
+export const CRUD_ACTIONS = {
+  create: "create",
+  view: "view",
+  update: "update",
+  delete: "delete",
+  export: "export",
+  import: "import",
+  approve: "approve",
+  reject: "reject",
+} as const;
+
+export type CrudAction = keyof typeof CRUD_ACTIONS;
+
+export function getActionCode(operation: CrudAction): string {
+  return CRUD_ACTIONS[operation];
+}
+
+// ============================================================================
+// Permission Helpers
+// ============================================================================
+
+interface ExtendedUser {
+  id: string;
+  name?: string | null;
+  email?: string | null;
+  image?: string | null;
+  roles?: string[];
+  permissions?: Permission[];
+}
+
+const BYPASS_AUTH =
+  process.env.BYPASS_AUTH === "true" || process.env.BYPASS_AUTH === "1";
+
+const ADMIN_ROLE_CODES = ["admin", "SUPER_ADMIN"];
+
+export function getCrudPermissionsFromSession(
+  session: Session | null,
+  entity: string,
+): {
+  create: boolean;
+  view: boolean;
+  update: boolean;
+  delete: boolean;
+  export: boolean;
+  import: boolean;
+  approve: boolean;
+  reject: boolean;
+} {
+  if (BYPASS_AUTH) {
+    return {
+      create: true,
+      view: true,
+      update: true,
+      delete: true,
+      export: true,
+      import: true,
+      approve: true,
+      reject: true,
+    };
+  }
+
+  if (!session?.user) {
+    return {
+      create: false,
+      view: false,
+      update: false,
+      delete: false,
+      export: false,
+      import: false,
+      approve: false,
+      reject: false,
+    };
+  }
+
+  const user = session.user as ExtendedUser;
+
+  if (!user.id) {
+    return {
+      create: false,
+      view: false,
+      update: false,
+      delete: false,
+      export: false,
+      import: false,
+      approve: false,
+      reject: false,
+    };
+  }
+
+  const isAdmin = user.roles?.some((role) => ADMIN_ROLE_CODES.includes(role));
+  if (isAdmin) {
+    return {
+      create: true,
+      view: true,
+      update: true,
+      delete: true,
+      export: true,
+      import: true,
+      approve: true,
+      reject: true,
+    };
+  }
+
+  const permissions = user.permissions || [];
+  const permissionKeys = new Set(
+    permissions.map((p) => `${p.resourceCode}:${p.actionCode}`),
+  );
+
+  const hasPermission = (action: string) => {
+    const key = `${entity}:${action}`;
+    return permissionKeys.has(key);
+  };
+
+  return {
+    create: hasPermission(getActionCode("create")),
+    view: hasPermission(getActionCode("view")),
+    update: hasPermission(getActionCode("update")),
+    delete: hasPermission(getActionCode("delete")),
+    export: hasPermission(getActionCode("export")),
+    import: hasPermission(getActionCode("import")),
+    approve: hasPermission(getActionCode("approve")),
+    reject: hasPermission(getActionCode("reject")),
+  };
+}