feat: add resolvePermissions API

apps/demo/app/custom-ui/[...puckPath]/client.tsx

@@ -318,6 +318,7 @@ const CustomDrawer = () => {
           const canInsert = getPermissions({
             type: componentKey,
           }).insert;
+
           return (
             <Drawer.Item
               key={componentKey}
@@ -361,6 +362,13 @@ export function Client({ path, isEdit }: { path: string; isEdit: boolean }) {
           duplicate: false,
           insert: false,
         },
+        resolvePermissions: (data) => {
+          if (data.props.title.includes("Puck")) {
+            return { duplicate: true };
+          } else {
+            return { duplicate: false };
+          }
+        },
       },
     },
   };

packages/core/components/ComponentList/index.tsx

@@ -18,12 +18,13 @@ const ComponentListItem = ({
   label?: string;
   index: number;
 }) => {
-  const { overrides, config, globalPermissions } = useAppContext();
+  const { overrides, config, globalPermissions, state } = useAppContext();
 
   const canInsert = getPermissions({
     type: name,
     config,
     globalPermissions: globalPermissions || {},
+    appState: state,
   }).insert;
 
   return (

packages/core/components/DraggableComponent/index.tsx

@@ -91,6 +91,7 @@ export const DraggableComponent = ({
     selectedItem,
     config,
     globalPermissions,
+    state,
   } = useAppContext();
   const isModifierHeld = useModifierHeld("Alt");
 
@@ -124,6 +125,7 @@ export const DraggableComponent = ({
       selectedItem,
       globalPermissions: globalPermissions || {},
       config,
+      appState: state,
     });
 
   return (

packages/core/components/DropZone/index.tsx

@@ -245,6 +245,7 @@ function DropZoneEdit({ zone, allow, disallow, style }: DropZoneProps) {
                   ),
                   config: appContext.config,
                   globalPermissions: appContext.globalPermissions || {},
+                  appState: appContext.state,
                 }).drag;
 
                 return (

packages/core/components/Puck/components/Fields/index.tsx

@@ -260,6 +260,7 @@ export const Fields = () => {
               selectedItem,
               config,
               globalPermissions: globalPermissions || {},
+              appState: state,
             });
 
             return (

packages/core/lib/get-permissions.ts

@@ -1,28 +1,73 @@
 import {
+  AppState,
   ComponentData,
   Config,
   DefaultComponentProps,
   Permissions,
 } from "../types/Config";
+import { getChanged } from "./get-changed";
+
+import { resolvePermissions } from "./resolve-permissions";
+
+const cache: {
+  lastPermissions: Record<string, Partial<Permissions>>;
+  lastSelected: ComponentData | {} | undefined;
+} = { lastPermissions: {}, lastSelected: {} };
 
 export const getPermissions = ({
   selectedItem,
   type,
   globalPermissions,
   config,
+  appState,
 }: {
   selectedItem?: ComponentData | undefined;
   type?: keyof DefaultComponentProps;
   globalPermissions: Partial<Permissions>;
   config: Config;
+  appState: AppState;
 }) => {
   const componentType = type || (selectedItem && selectedItem.type) || "";
+  const componentId = (selectedItem && selectedItem.props.id) || "";
+
   let componentPermissions = getInitialPermissions({
     componentType,
     config,
     globalPermissions,
   });
 
+  const changed = getChanged(selectedItem, cache.lastSelected);
+
+  if (Object.values(changed).some((el) => el === true)) {
+    const resolvedPermissions = resolvePermissions({
+      selectedItem,
+      config,
+      changed,
+      lastPermissions:
+        cache.lastPermissions[componentId] || componentPermissions,
+      initialPermissions: componentPermissions,
+      appState,
+    });
+
+    if (resolvedPermissions !== undefined) {
+      componentPermissions = {
+        ...componentPermissions,
+        ...resolvedPermissions,
+      };
+    }
+
+    cache.lastSelected = selectedItem;
+    cache.lastPermissions[componentId] = componentPermissions;
+
+    return componentPermissions;
+  }
+
+  if (
+    Object.keys(componentId && cache.lastPermissions[componentId]).length !== 0
+  ) {
+    componentPermissions = cache.lastPermissions[componentId];
+  }
+
   return componentPermissions;
 };
 

packages/core/lib/resolve-permissions.ts

@@ -0,0 +1,32 @@
+import { AppState, ComponentData, Config, Permissions } from "../types/Config";
+
+export const resolvePermissions = ({
+  selectedItem,
+  config,
+  changed,
+  lastPermissions,
+  initialPermissions,
+  appState,
+}: {
+  selectedItem: ComponentData | undefined;
+  config: Config;
+  changed: Record<string, boolean>;
+  lastPermissions: Partial<Permissions>;
+  initialPermissions: Partial<Permissions>;
+  appState: AppState;
+}) => {
+  const componentConfig = selectedItem
+    ? config.components[selectedItem.type]
+    : null;
+
+  if (selectedItem && componentConfig?.resolvePermissions) {
+    return componentConfig.resolvePermissions(selectedItem, {
+      changed,
+      lastPermissions,
+      initialPermissions,
+      appState,
+    });
+  }
+
+  return {};
+};

packages/core/lib/use-puck.ts

@@ -28,6 +28,7 @@ export const usePuck = () => {
         type,
         globalPermissions: globalPermissions || {},
         config,
+        appState,
       });
     },
     history: {

packages/core/types/Config.tsx

@@ -63,6 +63,15 @@ export type ComponentConfig<
         props?: Partial<ComponentProps>;
         readOnly?: Partial<Record<keyof ComponentProps, boolean>>;
       };
+  resolvePermissions?: (
+    data: DataShape,
+    params: {
+      changed: Partial<Record<keyof ComponentProps, boolean>>;
+      lastPermissions: Partial<Permissions> | undefined;
+      initialPermissions: Partial<Permissions>;
+      appState: AppState;
+    }
+  ) => Partial<Permissions>;
 };
 
 type Category<ComponentName> = {