@refinedev/antd 5.26.0 → 5.27.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@refinedev/antd",
-  "version": "5.26.0",
+  "version": "5.27.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",
@@ -24,8 +24,8 @@
   },
   "devDependencies": {
     "@refinedev/cli": "^2.7.0",
-    "@refinedev/ui-tests": "^1.7.2",
-    "@refinedev/core": "^4.24.0",
+    "@refinedev/ui-tests": "^1.8.0",
+    "@refinedev/core": "^4.25.1",
     "@esbuild-plugins/node-resolve": "^0.1.4",
     "@testing-library/jest-dom": "^5.16.4",
     "@testing-library/react": "^13.1.1",
@@ -49,7 +49,7 @@
   "dependencies": {
     "@ant-design/icons": "5.0.1",
     "@ant-design/pro-layout": "7.8.3",
-    "@refinedev/ui-types": "^1.16.0",
+    "@refinedev/ui-types": "^1.17.0",
     "@tanstack/react-query": "^4.10.1",
     "antd": "^5.0.5",
     "dayjs": "^1.10.7",

package/src/components/breadcrumb/index.tsx

@@ -45,14 +45,21 @@ export const Breadcrumb: React.FC<BreadcrumbProps> = ({
     const breadCrumbItems = breadcrumbs.map(({ label, icon, href }) => ({
         key: `breadcrumb-item-${label}`,
         title: (
-            <>
+            <div
+                style={{
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    gap: 4,
+                }}
+            >
                 {!hideIcons && icon}
                 {href ? (
                     <ActiveLink to={href}>{label}</ActiveLink>
                 ) : (
                     <span>{label}</span>
                 )}
-            </>
+            </div>
         ),
     }));
 

package/src/components/buttons/list/index.tsx

@@ -5,7 +5,7 @@ import {
     useCan,
     useNavigation,
     useTranslate,
-    userFriendlyResourceName,
+    useUserFriendlyName,
     useResource,
     useRouterContext,
     useRouterType,
@@ -51,6 +51,7 @@ export const ListButton: React.FC<ListButtonProps> = ({
     const routerType = useRouterType();
     const Link = useLink();
     const { Link: LegacyLink } = useRouterContext();
+    const getUserFriendlyName = useUserFriendlyName();
 
     const ActiveLink = routerType === "legacy" ? LegacyLink : Link;
 
@@ -118,7 +119,7 @@ export const ListButton: React.FC<ListButtonProps> = ({
                                 resourceNameFromProps ??
                                 propResourceNameOrRouteName
                             }.titles.list`,
-                            userFriendlyResourceName(
+                            getUserFriendlyName(
                                 resource?.meta?.label ??
                                     resource?.label ??
                                     identifier ??

package/src/components/crud/create/index.tsx

@@ -3,7 +3,7 @@ import { Card, Space, Spin } from "antd";
 import {
     useNavigation,
     useTranslate,
-    userFriendlyResourceName,
+    useUserFriendlyName,
     useRefineContext,
     useRouterType,
     useResource,
@@ -47,6 +47,7 @@ export const Create: React.FC<CreateProps> = ({
     const routerType = useRouterType();
     const back = useBack();
     const { goBack } = useNavigation();
+    const getUserFriendlyName = useUserFriendlyName();
 
     const { resource, action, identifier } = useResource(resourceFromProps);
 
@@ -83,7 +84,7 @@ export const Create: React.FC<CreateProps> = ({
                     title ??
                     translate(
                         `${identifier}.titles.create`,
-                        `Create ${userFriendlyResourceName(
+                        `Create ${getUserFriendlyName(
                             resource?.meta?.label ??
                                 resource?.options?.label ??
                                 resource?.label ??

package/src/components/crud/edit/index.tsx

@@ -5,7 +5,7 @@ import {
     useMutationMode,
     useNavigation,
     useTranslate,
-    userFriendlyResourceName,
+    useUserFriendlyName,
     useRefineContext,
     useRouterType,
     useBack,
@@ -65,6 +65,7 @@ export const Edit: React.FC<EditProps> = ({
     const back = useBack();
     const go = useGo();
     const { goBack, list: legacyGoList } = useNavigation();
+    const getUserFriendlyName = useUserFriendlyName();
 
     const {
         resource,
@@ -160,7 +161,7 @@ export const Edit: React.FC<EditProps> = ({
                     title ??
                     translate(
                         `${identifier}.titles.edit`,
-                        `Edit ${userFriendlyResourceName(
+                        `Edit ${getUserFriendlyName(
                             resource?.meta?.label ??
                                 resource?.options?.label ??
                                 resource?.label ??

package/src/components/crud/list/index.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import { Space } from "antd";
 import {
     useTranslate,
-    userFriendlyResourceName,
+    useUserFriendlyName,
     useRefineContext,
     useRouterType,
     useResource,
@@ -40,6 +40,7 @@ export const List: React.FC<ListProps> = ({
         useRefineContext();
 
     const routerType = useRouterType();
+    const getUserFriendlyName = useUserFriendlyName();
 
     const { resource, identifier } = useResource(resourceFromProps);
 
@@ -75,7 +76,7 @@ export const List: React.FC<ListProps> = ({
                     title ??
                     translate(
                         `${identifier}.titles.list`,
-                        userFriendlyResourceName(
+                        getUserFriendlyName(
                             resource?.meta?.label ??
                                 resource?.options?.label ??
                                 resource?.label ??

package/src/components/crud/show/index.tsx

@@ -3,7 +3,7 @@ import { Card, Space, Spin } from "antd";
 import {
     useNavigation,
     useTranslate,
-    userFriendlyResourceName,
+    useUserFriendlyName,
     useRefineContext,
     useResource,
     useToPath,
@@ -59,6 +59,7 @@ export const Show: React.FC<ShowProps> = ({
     const back = useBack();
     const go = useGo();
     const { goBack, list: legacyGoList } = useNavigation();
+    const getUserFriendlyName = useUserFriendlyName();
 
     const {
         resource,
@@ -147,7 +148,7 @@ export const Show: React.FC<ShowProps> = ({
                     title ??
                     translate(
                         `${identifier}.titles.show`,
-                        `Show ${userFriendlyResourceName(
+                        `Show ${getUserFriendlyName(
                             resource?.meta?.label ??
                                 resource?.options?.label ??
                                 resource?.label ??

package/src/components/themedLayoutV2/sider/index.tsx

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { CSSProperties } from "react";
 import { Layout, Menu, Grid, Drawer, Button, theme } from "antd";
 import {
     DashboardOutlined,
@@ -38,6 +38,7 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
     render,
     meta,
     fixed,
+    activeItemDisabled = false,
 }) => {
     const { token } = useToken();
     const {
@@ -108,6 +109,11 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
                     undefined && children.length === 0
             );
 
+            const linkStyle: CSSProperties =
+                activeItemDisabled && isSelected
+                    ? { pointerEvents: "none" }
+                    : {};
+
             return (
                 <CanAccess
                     key={item.key}
@@ -120,8 +126,11 @@ export const ThemedSiderV2: React.FC<RefineThemedLayoutV2SiderProps> = ({
                     <Menu.Item
                         key={item.key}
                         icon={icon ?? (isRoute && <UnorderedListOutlined />)}
+                        style={linkStyle}
                     >
-                        <Link to={route ?? ""}>{label}</Link>
+                        <Link to={route ?? ""} style={linkStyle}>
+                            {label}
+                        </Link>
                         {!siderCollapsed && isSelected && (
                             <div className="ant-menu-tree-arrow" />
                         )}

package/src/hooks/form/useModalForm/useModalForm.ts

@@ -9,7 +9,7 @@ import {
     BaseRecord,
     LiveModeProps,
     BaseKey,
-    userFriendlyResourceName,
+    useUserFriendlyName,
     useResource,
     FormWithSyncWithLocationParams,
     useParsed,
@@ -151,6 +151,7 @@ export const useModalForm = <
 
     const parsed = useParsed();
     const go = useGo();
+    const getUserFriendlyName = useUserFriendlyName();
 
     const action = rest.action ?? actionFromParams ?? "";
 
@@ -321,7 +322,7 @@ export const useModalForm = <
             okButtonProps: saveButtonPropsSF,
             title: translate(
                 `${identifier}.titles.${rest.action}`,
-                `${userFriendlyResourceName(
+                `${getUserFriendlyName(
                     `${rest.action} ${
                         resource?.meta?.label ??
                         resource?.options?.label ??