@zealamic/payload-auth-rbac-plugin 1.0.1 → 1.0.2

package/src/components/role-permission-matrix-client/index.tsx

@@ -1,369 +0,0 @@
-"use client";
-
-import {
-  useConfig,
-  useDocumentInfo,
-  useField,
-  useTranslation,
-} from "@payloadcms/ui";
-import { Fragment, useEffect, useId, useMemo, useRef, useState } from "react";
-import type { PermissionAction } from "../../collections/permission-actions/types.js";
-import type { PermissionFeature } from "../../collections/permission-features/types.js";
-import type { Permission } from "../../collections/permissions/types.js";
-import type { RolePermission } from "../../collections/roles-permissions/types.js";
-import { STATUS as PERMISSION_STATUS } from "../../lib/constants/permission.js";
-import {
-  STATUS as PERMISSION_ACTION_STATUS,
-  TYPE,
-} from "../../lib/constants/permission-action.js";
-import { STATUS as PERMISSION_FEATURE_STATUS } from "../../lib/constants/permission-feature.js";
-import { toID } from "../../lib/utils/data.js";
-
-import styles from "./matrix.module.scss";
-
-const RBAC_PREFIX = "rbac";
-
-type ApiListResponse<T> = {
-  docs?: T[];
-};
-
-export const RolePermissionMatrixClient = () => {
-  const checkboxId = useId();
-  const { config } = useConfig();
-  const { hasSavePermission, id } = useDocumentInfo();
-  const { setValue, value } = useField<Record<string, boolean> | null>({
-    path: "permissionMatrixDraft",
-  });
-  const isReadOnly = !hasSavePermission;
-
-  const [features, setFeatures] = useState<PermissionFeature[]>([]);
-  const [actions, setActions] = useState<PermissionAction[]>([]);
-  const [permissions, setPermissions] = useState<Permission[]>([]);
-  const [rolePermissions, setRolePermissions] = useState<RolePermission[]>([]);
-  const [loading, setLoading] = useState(true);
-  const { t } = useTranslation();
-  const seededForRoleIdRef = useRef<string | null>(null);
-
-  useEffect(() => {
-    const run = async () => {
-      setLoading(true);
-      try {
-        const base = config?.routes?.api || "/api";
-
-        const [featuresRes, actionsRes, permissionsRes, rolePermissionsRes] =
-          await Promise.all([
-            fetch(
-              `${base}/permission-features?limit=0&depth=0&where[status][equals]=${PERMISSION_FEATURE_STATUS.ACTIVE}`,
-              { credentials: "include" },
-            ),
-            fetch(
-              `${base}/permission-actions?limit=0&depth=0&where[status][equals]=${PERMISSION_ACTION_STATUS.ACTIVE}`,
-              { credentials: "include" },
-            ),
-            fetch(
-              `${base}/permissions?limit=0&depth=1&where[status][equals]=${PERMISSION_STATUS.ACTIVE}`,
-              { credentials: "include" },
-            ),
-            id
-              ? fetch(
-                  `${base}/roles-permissions?limit=0&depth=0&where[role][equals]=${id}`,
-                  {
-                    credentials: "include",
-                  },
-                )
-              : Promise.resolve(new Response(JSON.stringify({ docs: [] }))),
-          ]);
-
-        const featuresJson =
-          (await featuresRes.json()) as ApiListResponse<PermissionFeature>;
-        const actionsJson =
-          (await actionsRes.json()) as ApiListResponse<PermissionAction>;
-        const permissionsJson =
-          (await permissionsRes.json()) as ApiListResponse<Permission>;
-        const rolePermissionsJson =
-          (await rolePermissionsRes.json()) as ApiListResponse<RolePermission>;
-
-        setFeatures(
-          featuresJson.docs?.sort(
-            (a, b) => (a?.sortOrder ?? 0) - (b?.sortOrder ?? 0),
-          ) || [],
-        );
-        setActions(
-          actionsJson.docs?.sort(
-            (a, b) => (a?.sortOrder ?? 0) - (b?.sortOrder ?? 0),
-          ) || [],
-        );
-        setPermissions(permissionsJson.docs || []);
-        setRolePermissions(rolePermissionsJson.docs || []);
-      } finally {
-        setLoading(false);
-      }
-    };
-
-    void run();
-  }, [config?.routes?.api, id]);
-
-  const enabledByPermissionID = useMemo(() => {
-    const map = new Map<string, boolean>();
-    for (const row of rolePermissions) {
-      map.set(toID(row.permission), Boolean(row.enabled));
-    }
-    return map;
-  }, [rolePermissions]);
-
-  const draftValue = (
-    value && typeof value === "object" && !Array.isArray(value) ? value : {}
-  ) as Record<string, boolean>;
-
-  useEffect(() => {
-    if (!id || loading) {
-      return;
-    }
-
-    const roleId = String(id);
-    if (seededForRoleIdRef.current === roleId) {
-      return;
-    }
-
-    const fromRolesPermissions: Record<string, boolean> = {};
-    for (const [permissionID, enabled] of enabledByPermissionID.entries()) {
-      if (permissionID) {
-        fromRolesPermissions[permissionID] = enabled;
-      }
-    }
-
-    const fromDocument =
-      value && typeof value === "object" && !Array.isArray(value)
-        ? (value as Record<string, boolean>)
-        : {};
-
-    const hasRolesPermissions = Object.keys(fromRolesPermissions).length > 0;
-    const hasDocumentDraft = Object.keys(fromDocument).length > 0;
-
-    if (!hasRolesPermissions && !hasDocumentDraft) {
-      return;
-    }
-
-    seededForRoleIdRef.current = roleId;
-    setValue({
-      ...fromRolesPermissions,
-      ...fromDocument,
-    });
-  }, [enabledByPermissionID, id, loading, setValue, value]);
-
-  if (!id) {
-    return (
-      <div className={styles[`${RBAC_PREFIX}-component-placeholder`]}>
-        {t(
-          `components:rolePermissionMatrix:viewInUpdateScreenOnly:label` as Parameters<
-            typeof t
-          >[0],
-        )}
-      </div>
-    );
-  }
-
-  if (loading) {
-    return (
-      <div className={styles[`${RBAC_PREFIX}-component-placeholder`]}>
-        {t(
-          `components:rolePermissionMatrix:loading:placeholder` as Parameters<
-            typeof t
-          >[0],
-        )}
-      </div>
-    );
-  }
-
-  return (
-    <div>
-      <div className={styles[`${RBAC_PREFIX}-component-title`]}>
-        {t(`components:rolePermissionMatrix:title` as Parameters<typeof t>[0])}
-      </div>
-
-      <div className={styles[`${RBAC_PREFIX}-table-container`]}>
-        <table className={styles[`${RBAC_PREFIX}-table`]}>
-          <thead>
-            <tr>
-              <th className={styles[`${RBAC_PREFIX}-table-th-feature`]}>
-                {t(
-                  `components:rolePermissionMatrix:featuresLabel` as Parameters<
-                    typeof t
-                  >[0],
-                )}
-              </th>
-              <th
-                className={styles[`${RBAC_PREFIX}-table-th-action`]}
-                colSpan={
-                  actions.filter((action) => action.type === TYPE.MAIN).length
-                }
-              >
-                {t(
-                  `components:rolePermissionMatrix:actionsLabel` as Parameters<
-                    typeof t
-                  >[0],
-                )}
-              </th>
-            </tr>
-          </thead>
-          <tbody>
-            {features.map((feature) => {
-              const mainActions = actions.filter(
-                (action) => action.type === TYPE.MAIN,
-              );
-              const subActions = actions.filter(
-                (action) =>
-                  action.type === TYPE.SUB &&
-                  permissions.some(
-                    (permission) =>
-                      toID(permission.permissionAction) === String(action.id) &&
-                      toID(permission.permissionFeature) === String(feature.id),
-                  ),
-              );
-              const isSubActionInPermission = subActions.length > 0;
-
-              return (
-                <Fragment key={String(feature.id)}>
-                  <tr>
-                    <td className={styles[`${RBAC_PREFIX}-table-td-feature`]}>
-                      {t(
-                        `components:rolePermissionMatrix:features:${feature.code}` as Parameters<
-                          typeof t
-                        >[0],
-                      ) || feature.id}
-                    </td>
-
-                    {mainActions.map((action) => {
-                      const matchedPermission = permissions.find(
-                        (permission) =>
-                          toID(permission.permissionFeature) ===
-                            String(feature.id) &&
-                          toID(permission.permissionAction) ===
-                            String(action.id),
-                      );
-
-                      if (!matchedPermission) {
-                        return (
-                          <td
-                            key={`${feature.id}-${action.id}`}
-                            className={styles[`${RBAC_PREFIX}-table-td-action`]}
-                          >
-                            -
-                          </td>
-                        );
-                      }
-
-                      const permissionID = String(matchedPermission.id);
-                      const checked =
-                        typeof draftValue[permissionID] === "boolean"
-                          ? draftValue[permissionID]
-                          : (enabledByPermissionID.get(permissionID) ?? false);
-
-                      return (
-                        <td
-                          key={`${feature.id}-${action.id}`}
-                          className={styles[`${RBAC_PREFIX}-table-td-action`]}
-                        >
-                          <div
-                            className={
-                              styles[`${RBAC_PREFIX}-table-td-action-container`]
-                            }
-                          >
-                            <input
-                              type="checkbox"
-                              id={`permission-matrix-checkbox-${checkboxId}-${feature.id}-${action.id}`}
-                              name={`permission-matrix-checkbox-${checkboxId}-${feature.id}-${action.id}`}
-                              checked={checked}
-                              disabled={isReadOnly}
-                              onChange={(event) => {
-                                setValue({
-                                  ...draftValue,
-                                  [permissionID]: event.target.checked,
-                                });
-                              }}
-                              className={
-                                styles[`${RBAC_PREFIX}-table-td-action-input`]
-                              }
-                            />
-                            <label
-                              htmlFor={`permission-matrix-checkbox-${checkboxId}-${feature.id}-${action.id}`}
-                              className={
-                                styles[`${RBAC_PREFIX}-table-td-action-label`]
-                              }
-                            >
-                              {t(
-                                `components:rolePermissionMatrix:actions:${action.code}` as Parameters<
-                                  typeof t
-                                >[0],
-                              ) || action.id}
-                            </label>
-                          </div>
-                        </td>
-                      );
-                    })}
-                  </tr>
-
-                  {isSubActionInPermission && (
-                    <tr>
-                      <td
-                        className={styles[`${RBAC_PREFIX}-table-td-feature`]}
-                      ></td>
-                      <td
-                        className={styles[`${RBAC_PREFIX}-table-td-action`]}
-                        colSpan={mainActions.length}
-                      >
-                        {subActions.map((action) => {
-                          const matchedPermission = permissions.find(
-                            (permission) =>
-                              toID(permission.permissionFeature) ===
-                                String(feature.id) &&
-                              toID(permission.permissionAction) ===
-                                String(action.id),
-                          );
-
-                          if (!matchedPermission) {
-                            return null;
-                          }
-
-                          const permissionID = String(matchedPermission.id);
-                          const checked =
-                            typeof draftValue[permissionID] === "boolean"
-                              ? draftValue[permissionID]
-                              : (enabledByPermissionID.get(permissionID) ??
-                                false);
-
-                          return (
-                            <div key={`${feature.id}-${action.id}-sub`}>
-                              <input
-                                type="checkbox"
-                                checked={checked}
-                                disabled={isReadOnly}
-                                onChange={(event) => {
-                                  setValue({
-                                    ...draftValue,
-                                    [permissionID]: event.target.checked,
-                                  });
-                                }}
-                              />{" "}
-                              <span
-                                style={{
-                                  display: "inline-block",
-                                }}
-                              >
-                                {action.code || action.id}
-                              </span>
-                            </div>
-                          );
-                        })}
-                      </td>
-                    </tr>
-                  )}
-                </Fragment>
-              );
-            })}
-          </tbody>
-        </table>
-      </div>
-    </div>
-  );
-};

package/src/components/role-permission-matrix-client/matrix.module.scss

@@ -1,66 +0,0 @@
-// Import Payload compile-time SCSS vars ($breakpoint-s-width, etc.).
-// Note: @payloadcms/ui/scss/vars is not a published export — use dist/scss/vars.
-// @use "../../../node_modules/@payloadcms/ui/dist/scss/vars" as payload-vars;
-@use "../../styles/variables" as rbac-vars;
-
-$local-prefix: rbac-vars.$rbac-prefix;
-
-.#{$local-prefix}-component {
-  &-label {
-    opacity: 0.8;
-    padding: 0.5rem 0;
-  }
-  &-placeholder {
-    opacity: 0.8;
-    padding: 0.5rem 0;
-  }
-  &-title {
-    font-weight: 600;
-    margin-bottom: 0.5rem;
-  }
-}
-
-.#{$local-prefix}-table {
-  border-collapse: collapse;
-  width: 100%;
-  &-container {
-    border-radius: var(--style-radius-m);
-    border: 1px solid var(--theme-border-color);
-  }
-  &-th {
-    &-feature {
-      padding: 0.5rem;
-      text-align: left;
-      border-right: 1px solid var(--theme-border-color);
-      width: 25%;
-    }
-    &-action {
-      padding: 0.5rem;
-    }
-  }
-  &-td {
-    &-feature {
-      border-right: 1px solid var(--theme-border-color);
-      border-top: 1px solid var(--theme-border-color);
-      padding: 0.5rem;
-    }
-    &-action {
-      border-top: 1px solid var(--theme-border-color);
-      padding: 0.5rem;
-      &-container {
-        display: flex;
-        align-items: center;
-      }
-      &-input {
-        user-select: none;
-        cursor: pointer;
-      }
-      &-label {
-        display: inline-block;
-        padding-left: 0.25rem;
-        user-select: none;
-        cursor: pointer;
-      }
-    }
-  }
-}

package/src/components/role-permission-matrix-client/types.ts

@@ -1,16 +0,0 @@
-export type RolePermissionMatrixClientTranslations = {
-  [locale: string]: {
-    viewInUpdateScreenOnly?: {
-      label?: string;
-      placeholder?: string;
-    };
-    loading?: {
-      placeholder?: string;
-    };
-    title?: string;
-    featuresLabel?: string;
-    features?: Record<string, string>;
-    actionsLabel?: string;
-    actions?: Record<string, string>;
-  };
-};

package/src/endpoints/customEndpointHandler.ts

@@ -1,5 +0,0 @@
-import type { PayloadHandler } from "payload"
-
-export const customEndpointHandler: PayloadHandler = () => {
-  return Response.json({ message: "Hello from custom endpoint" })
-}

package/src/exports/client.ts

@@ -1 +0,0 @@
-export { RolePermissionMatrixClient } from "../components/role-permission-matrix-client/index.js"