@refinedev/core 4.1.6 → 4.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@refinedev/core",
-  "version": "4.1.6",
+  "version": "4.2.0",
   "description": "refine is a React-based framework for building internal tools, rapidly. It ships with Ant Design System, an enterprise-level UI toolkit.",
   "private": false,
   "main": "dist/index.js",

package/src/components/canAccess/index.tsx

@@ -1,9 +1,39 @@
 import React from "react";
 
-import { useCan } from "@hooks";
-import { CanParams } from "../../interfaces";
+import {
+    useCan,
+    useParsed,
+    useResource,
+    useResourceWithRoute,
+    useRouterContext,
+    useRouterType,
+} from "@hooks";
+import {
+    BaseKey,
+    IResourceItem,
+    ITreeMenu,
+    ResourceRouterParams,
+} from "../../interfaces";
+import { pickResource } from "@definitions/helpers/pick-resource";
 
-export type CanAccessProps = CanParams & {
+type CanAccessBaseProps = {
+    /**
+     * Resource name for API data interactions
+     */
+    resource?: string;
+    /**
+     * Intended action on resource
+     */
+    action: string;
+    /**
+     * Parameters associated with the resource
+     * @type { resource?: [IResourceItem](https://refine.dev/docs/api-reference/core/interfaceReferences/#canparams), id?: [BaseKey](https://refine.dev/docs/api-reference/core/interfaceReferences/#basekey), [key: string]: any }
+     */
+    params?: {
+        resource?: IResourceItem & { children?: ITreeMenu[] };
+        id?: BaseKey;
+        [key: string]: any;
+    };
     /**
      * Content to show if access control returns `false`
      */
@@ -11,18 +41,112 @@ export type CanAccessProps = CanParams & {
     children: React.ReactNode;
 };
 
+type CanAccessWithoutParamsProps = {
+    [key in Exclude<
+        keyof CanAccessBaseProps,
+        "fallback" | "children"
+    >]?: undefined;
+} & {
+    [key in "fallback" | "children"]?: CanAccessBaseProps[key];
+};
+
+export type CanAccessProps = CanAccessBaseProps | CanAccessWithoutParamsProps;
+
 export const CanAccess: React.FC<CanAccessProps> = ({
-    resource,
+    resource: resourceFromProp,
     action,
     params,
     fallback,
     children,
     ...rest
 }) => {
+    const routerType = useRouterType();
+    const { resources } = useResource();
+    const { useParams } = useRouterContext();
+    const {
+        resource: resourceFromRouter,
+        id: idFromRouter,
+        action: actionFromRouter,
+    } = useParsed();
+
+    const {
+        resource: legacyResourceFromRoute,
+        id: legacyIdFromParams,
+        action: legacyActionFromParams,
+    } = useParams<ResourceRouterParams>();
+
+    const newResourceNameFromRouter = resourceFromRouter?.name;
+
+    /** We only accept `id` from URL params if `resource` is not explicitly passed. */
+    /** This is done to avoid sending wrong requests for custom `resource` and an async `id` */
+    const defaultId =
+        !resourceFromProp ||
+        resourceFromProp ===
+            (routerType === "legacy"
+                ? legacyResourceFromRoute
+                : newResourceNameFromRouter)
+            ? params?.id ??
+              (routerType === "legacy" ? legacyIdFromParams : idFromRouter)
+            : params?.id;
+
+    /** `resourceName` fallback value depends on the router type */
+    const resourceName =
+        resourceFromProp ??
+        (routerType === "legacy"
+            ? legacyResourceFromRoute
+            : newResourceNameFromRouter);
+
+    let resource: IResourceItem | undefined;
+
+    const resourceWithRoute = useResourceWithRoute();
+
+    if (routerType === "legacy") {
+        if (resourceName) {
+            resource = resourceWithRoute(resourceName);
+        }
+    } else {
+        /** If `resource` is provided by the user, then try to pick the resource of create a dummy one */
+        if (resourceFromProp) {
+            const picked = pickResource(resourceFromProp, resources);
+            if (picked) {
+                resource = picked;
+            } else {
+                resource = {
+                    name: resourceFromProp,
+                    route: resourceFromProp,
+                };
+            }
+        } else {
+            /** If `resource` is not provided, check the resource from the router params */
+            if (typeof resourceFromRouter === "string") {
+                const picked = pickResource(resourceFromRouter, resources);
+                if (picked) {
+                    resource = picked;
+                } else {
+                    resource = {
+                        name: resourceFromRouter,
+                        route: resourceFromRouter,
+                    };
+                }
+            } else {
+                /** If `resource` is passed as an IResourceItem, use it or `resource` is undefined and cannot be inferred. */
+                resource = resourceFromRouter;
+            }
+        }
+    }
+
     const { data } = useCan({
-        resource,
-        action,
-        params,
+        resource: resourceFromProp ?? resource?.name,
+        action:
+            action ??
+            (routerType === "legacy"
+                ? legacyActionFromParams
+                : actionFromRouter) ??
+            "",
+        params: params ?? {
+            id: defaultId,
+            resource: resource,
+        },
     });
 
     if (data?.can) {

package/src/components/index.ts

@@ -5,5 +5,5 @@ export * from "./undoableQueue";
 export { LayoutWrapper } from "./layoutWrapper";
 export { Authenticated } from "./authenticated";
 export { RouteChangeHandler } from "./routeChangeHandler";
-export { CanAccess } from "./canAccess";
+export { CanAccess, CanAccessProps } from "./canAccess";
 export { GitHubBanner } from "./gh-banner";