@checkstack/frontend 0.0.5 → 0.1.0

package/CHANGELOG.md

@@ -1,5 +1,87 @@
 # @checkstack/frontend
 
+## 0.1.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-frontend@0.2.0
+  - @checkstack/command-frontend@0.1.0
+  - @checkstack/common@0.2.0
+  - @checkstack/frontend-api@0.1.0
+  - @checkstack/signal-common@0.1.0
+  - @checkstack/ui@0.2.0
+  - @checkstack/signal-frontend@0.0.6
+
 ## 0.0.5
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@checkstack/frontend",
-  "version": "0.0.5",
+  "version": "0.1.0",
   "type": "module",
   "scripts": {
     "dev": "vite",

package/src/App.tsx

@@ -10,7 +10,7 @@ import {
   ApiProvider,
   ApiRegistryBuilder,
   loggerApiRef,
-  permissionApiRef,
+  accessApiRef,
   fetchApiRef,
   rpcApiRef,
   useApi,
@@ -28,17 +28,14 @@ import { ConsoleLoggerApi } from "./apis/logger-api";
 import { CoreFetchApi } from "./apis/fetch-api";
 import { CoreRpcApi } from "./apis/rpc-api";
 import {
-  PermissionDenied,
+  AccessDenied,
   LoadingSpinner,
   ToastProvider,
   AmbientBackground,
 } from "@checkstack/ui";
 import { SignalProvider } from "@checkstack/signal-frontend";
 import { usePluginLifecycle } from "./hooks/usePluginLifecycle";
-import {
-  useCommands,
-  useGlobalShortcuts,
-} from "@checkstack/command-frontend";
+import { useCommands, useGlobalShortcuts } from "@checkstack/command-frontend";
 
 /**
  * Component that registers global keyboard shortcuts for all commands.
@@ -48,7 +45,7 @@ function GlobalShortcuts() {
   const { commands } = useCommands();
   const navigate = useNavigate();
 
-  // Pass "*" as permission since backend already filters by permission
+  // Pass "*" as access since backend already filters by access
   useGlobalShortcuts(commands, navigate, ["*"]);
 
   // This component renders nothing - it only registers event listeners
@@ -57,10 +54,16 @@ function GlobalShortcuts() {
 
 const RouteGuard: React.FC<{
   children: React.ReactNode;
-  permission?: string;
-}> = ({ children, permission }) => {
-  const permissionApi = useApi(permissionApiRef);
-  const { allowed, loading } = permissionApi.usePermission(permission || "");
+  accessRule?: string;
+}> = ({ children, accessRule }) => {
+  const accessApi = useApi(accessApiRef);
+  // If there's an access rule requirement, use useAccess with a minimal AccessRule-like object
+  // the route.accessRule is already the qualified access rule ID string
+  const { allowed, loading } = accessRule
+    ? accessApi.useAccess({ id: accessRule } as Parameters<
+        typeof accessApi.useAccess
+      >[0])
+    : { allowed: true, loading: false };
 
   if (loading) {
     return (
@@ -70,10 +73,8 @@ const RouteGuard: React.FC<{
     );
   }
 
-  const isAllowed = permission ? allowed : true;
-
-  if (!isAllowed) {
-    return <PermissionDenied />;
+  if (!allowed) {
+    return <AccessDenied />;
   }
 
   return <>{children}</>;
@@ -130,7 +131,7 @@ function AppContent() {
                 key={route.path}
                 path={route.path}
                 element={
-                  <RouteGuard permission={route.permission}>
+                  <RouteGuard accessRule={route.accessRule}>
                     {route.element}
                   </RouteGuard>
                 }
@@ -154,10 +155,8 @@ function AppWithApis() {
     // Initialize API Registry with core apiRefs
     const registryBuilder = new ApiRegistryBuilder()
       .register(loggerApiRef, new ConsoleLoggerApi())
-      .register(permissionApiRef, {
-        usePermission: () => ({ loading: false, allowed: true }), // Default to allow all if no auth plugin present
-        useResourcePermission: () => ({ loading: false, allowed: true }),
-        useManagePermission: () => ({ loading: false, allowed: true }),
+      .register(accessApiRef, {
+        useAccess: () => ({ loading: false, allowed: true }), // Default to allow all if no auth plugin present
       })
       .registerFactory(fetchApiRef, (_registry) => {
         return new CoreFetchApi(baseUrl);