@checkstack/catalog-frontend 0.1.0 → 0.2.0

package/CHANGELOG.md

@@ -1,5 +1,85 @@
 # @checkstack/catalog-frontend
 
+## 0.2.0
+
+### Minor Changes
+
+- 9faec1f: # Unified AccessRule Terminology Refactoring
+
+  This release completes a comprehensive terminology refactoring from "permission" to "accessRule" across the entire codebase, establishing a consistent and modern access control vocabulary.
+
+  ## Changes
+
+  ### Core Infrastructure (`@checkstack/common`)
+
+  - Introduced `AccessRule` interface as the primary access control type
+  - Added `accessPair()` helper for creating read/manage access rule pairs
+  - Added `access()` builder for individual access rules
+  - Replaced `Permission` type with `AccessRule` throughout
+
+  ### API Changes
+
+  - `env.registerPermissions()` → `env.registerAccessRules()`
+  - `meta.permissions` → `meta.access` in RPC contracts
+  - `usePermission()` → `useAccess()` in frontend hooks
+  - Route `permission:` field → `accessRule:` field
+
+  ### UI Changes
+
+  - "Roles & Permissions" tab → "Roles & Access Rules"
+  - "You don't have permission..." → "You don't have access..."
+  - All permission-related UI text updated
+
+  ### Documentation & Templates
+
+  - Updated 18 documentation files with AccessRule terminology
+  - Updated 7 scaffolding templates with `accessPair()` pattern
+  - All code examples use new AccessRule API
+
+  ## Migration Guide
+
+  ### Backend Plugins
+
+  ```diff
+  - import { permissionList } from "./permissions";
+  - env.registerPermissions(permissionList);
+  + import { accessRules } from "./access";
+  + env.registerAccessRules(accessRules);
+  ```
+
+  ### RPC Contracts
+
+  ```diff
+  - .meta({ userType: "user", permissions: [permissions.read.id] })
+  + .meta({ userType: "user", access: [access.read] })
+  ```
+
+  ### Frontend Hooks
+
+  ```diff
+  - const canRead = accessApi.usePermission(permissions.read.id);
+  + const canRead = accessApi.useAccess(access.read);
+  ```
+
+  ### Routes
+
+  ```diff
+  - permission: permissions.entityRead.id,
+  + accessRule: access.read,
+  ```
+
+### Patch Changes
+
+- Updated dependencies [9faec1f]
+- Updated dependencies [95eeec7]
+- Updated dependencies [f533141]
+  - @checkstack/auth-frontend@0.2.0
+  - @checkstack/catalog-common@1.1.0
+  - @checkstack/common@0.2.0
+  - @checkstack/frontend-api@0.1.0
+  - @checkstack/notification-common@0.1.0
+  - @checkstack/ui@0.2.0
+
 ## 0.1.0
 
 ### Minor Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@checkstack/catalog-frontend",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "type": "module",
   "main": "src/index.tsx",
   "scripts": {

package/src/components/CatalogConfigPage.tsx

@@ -2,11 +2,14 @@ import React, { useState, useEffect } from "react";
 import { useSearchParams } from "react-router-dom";
 import {
   useApi,
-  permissionApiRef,
+  accessApiRef,
   ExtensionSlot,
 } from "@checkstack/frontend-api";
 import { catalogApiRef, System, Group } from "../api";
-import { CatalogSystemActionsSlot } from "@checkstack/catalog-common";
+import {
+  CatalogSystemActionsSlot,
+  catalogAccess,
+} from "@checkstack/catalog-common";
 import {
   SectionHeader,
   Card,
@@ -17,7 +20,7 @@ import {
   Label,
   LoadingSpinner,
   EmptyState,
-  PermissionDenied,
+  AccessDenied,
   EditableText,
   ConfirmationModal,
   useToast,
@@ -28,11 +31,11 @@ import { GroupEditor } from "./GroupEditor";
 
 export const CatalogConfigPage = () => {
   const catalogApi = useApi(catalogApiRef);
-  const permissionApi = useApi(permissionApiRef);
+  const accessApi = useApi(accessApiRef);
   const toast = useToast();
   const [searchParams, setSearchParams] = useSearchParams();
-  const { allowed: canManage, loading: permissionLoading } =
-    permissionApi.useManagePermission("catalog");
+  const { allowed: canManage, loading: accessLoading } =
+    accessApi.useAccess(catalogAccess.system.manage);
 
   const [systems, setSystems] = useState<System[]>([]);
   const [groups, setGroups] = useState<Group[]>([]);
@@ -219,10 +222,10 @@ export const CatalogConfigPage = () => {
     }
   };
 
-  if (loading || permissionLoading) return <LoadingSpinner />;
+  if (loading || accessLoading) return <LoadingSpinner />;
 
   if (!canManage) {
-    return <PermissionDenied />;
+    return <AccessDenied />;
   }
 
   const selectedGroup = groups.find((g) => g.id === selectedGroupId);

package/src/components/UserMenuItems.tsx

@@ -3,20 +3,18 @@ import { Link } from "react-router-dom";
 import { Settings } from "lucide-react";
 import type { UserMenuItemsContext } from "@checkstack/frontend-api";
 import { DropdownMenuItem } from "@checkstack/ui";
-import { qualifyPermissionId, resolveRoute } from "@checkstack/common";
+import { resolveRoute } from "@checkstack/common";
 import {
   catalogRoutes,
-  permissions,
+  catalogAccess,
   pluginMetadata,
 } from "@checkstack/catalog-common";
 
 export const CatalogUserMenuItems = ({
-  permissions: userPerms,
+  accessRules: userPerms,
 }: UserMenuItemsContext) => {
-  const qualifiedId = qualifyPermissionId(
-    pluginMetadata,
-    permissions.catalogManage
-  );
+  // Use the access rule's id directly
+  const qualifiedId = `${pluginMetadata.pluginId}.${catalogAccess.system.manage.id}`;
   const canManage = userPerms.includes("*") || userPerms.includes(qualifiedId);
 
   if (!canManage) {

package/src/index.tsx

@@ -10,7 +10,7 @@ import {
   catalogRoutes,
   CatalogApi,
   pluginMetadata,
-  permissions,
+  catalogAccess,
 } from "@checkstack/catalog-common";
 
 import { CatalogPage } from "./components/CatalogPage";
@@ -38,7 +38,7 @@ export const catalogPlugin = createFrontendPlugin({
     {
       route: catalogRoutes.routes.config,
       element: <CatalogConfigPage />,
-      permission: permissions.catalogManage,
+      accessRule: catalogAccess.system.manage,
     },
     {
       route: catalogRoutes.routes.systemDetail,