feat: add generic type to usePuck hook

measuredco · Sep 16, 2024 · 01703a9 · 01703a9
1 parent b5025a1
commit 01703a9
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 22 deletions.
diff --git a/packages/core/lib/get-permissions.ts b/packages/core/lib/get-permissions.ts
@@ -15,23 +15,26 @@ const cache: {
   lastSelected: ComponentData | {} | undefined;
 } = { lastPermissions: {}, lastSelected: {} };
 
-export const getPermissions = ({
+export const getPermissions = <
+  UserConfig extends Config = Config,
+  G extends UserGenerics<UserConfig> = UserGenerics<UserConfig>
+>({
   selectedItem,
   type,
   globalPermissions,
   config,
   appState,
 }: {
-  selectedItem?: ComponentData | undefined;
-  type?: keyof DefaultComponentProps;
+  selectedItem?: G["UserData"]["content"][0] | undefined;
+  type?: string;
   globalPermissions: Partial<Permissions>;
-  config: Config;
-  appState: AppState;
+  config: UserConfig;
+  appState: G["UserAppState"];
 }) => {
   const componentType = type || (selectedItem && selectedItem.type) || "";
   const componentId = (selectedItem && selectedItem.props.id) || "";
 
-  let componentPermissions = getInitialPermissions({
+  let componentPermissions = getInitialPermissions<UserConfig>({
     componentType,
     config,
     globalPermissions,
@@ -72,17 +75,17 @@ export const getPermissions = ({
   return componentPermissions;
 };
 
-export const getInitialPermissions = ({
+export const getInitialPermissions = <UserConfig extends Config = Config>({
   componentType,
   globalPermissions,
   config,
 }: {
-  componentType: keyof DefaultComponentProps;
+  componentType: string;
   globalPermissions: Partial<Permissions>;
-  config: Config;
+  config: UserConfig;
 }) => {
   return {
     ...globalPermissions,
-    ...config.components[componentType]?.permissions,
+    ...config.components[componentType as string]?.permissions,
   };
 };
diff --git a/packages/core/lib/resolve-permissions.ts b/packages/core/lib/resolve-permissions.ts
@@ -1,19 +1,35 @@
-import { AppState, ComponentData, Config, Permissions } from "../types";
+import {
+  AppState,
+  ComponentData,
+  Config,
+  Data,
+  ExtractPropsFromConfig,
+  ExtractRootPropsFromConfig,
+  Permissions,
+} from "../types";
 
-export const resolvePermissions = ({
+export const resolvePermissions = <
+  UserConfig extends Config = Config,
+  UserProps extends ExtractPropsFromConfig<UserConfig> = ExtractPropsFromConfig<UserConfig>,
+  UserRootProps extends ExtractRootPropsFromConfig<UserConfig> = ExtractRootPropsFromConfig<UserConfig>,
+  UserData extends Data<UserProps, UserRootProps> | Data = Data<
+    UserProps,
+    UserRootProps
+  >
+>({
   selectedItem,
   config,
   changed,
   lastPermissions,
   initialPermissions,
   appState,
 }: {
-  selectedItem: ComponentData | undefined;
-  config: Config;
+  selectedItem: UserData["content"][0] | undefined;
+  config: UserConfig;
   changed: Record<string, boolean>;
   lastPermissions: Partial<Permissions>;
   initialPermissions: Partial<Permissions>;
-  appState: AppState;
+  appState: AppState<UserData>;
 }) => {
   const componentConfig = selectedItem
     ? config.components[selectedItem.type]

diff --git a/packages/core/lib/use-puck.ts b/packages/core/lib/use-puck.ts
@@ -1,16 +1,19 @@
 import { useAppContext } from "../components/Puck/context";
-import { ComponentData, DefaultComponentProps } from "../types";
+import { Config, UserGenerics } from "../types";
 import { getPermissions } from "./get-permissions";
 
-export const usePuck = () => {
+export const usePuck = <
+  UserConfig extends Config = Config,
+  G extends UserGenerics<UserConfig> = UserGenerics<UserConfig>
+>() => {
   const {
     state: appState,
     config,
     history,
     dispatch,
     selectedItem: currentItem,
     globalPermissions,
-  } = useAppContext();
+  } = useAppContext<UserConfig>();
 
   return {
     appState,
@@ -20,12 +23,12 @@ export const usePuck = () => {
       item,
       type,
     }: {
-      item?: ComponentData;
-      type?: keyof DefaultComponentProps;
+      item?: G["UserData"]["content"][0];
+      type?: keyof G["UserProps"];
     } = {}) => {
-      return getPermissions({
+      return getPermissions<UserConfig>({
         selectedItem: item || currentItem,
-        type,
+        type: type as string,
         globalPermissions: globalPermissions || {},
         config,
         appState,