@refinedev/antd 5.37.4 → 6.0.0

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

@@ -2,18 +2,18 @@ import React, { useContext } from "react";
 import { Button } from "antd";
 import { PlusSquareOutlined } from "@ant-design/icons";
 import {
-    useNavigation,
-    useTranslate,
-    useCan,
-    useResource,
-    useRouterContext,
-    useRouterType,
-    useLink,
-    AccessControlContext,
+  useNavigation,
+  useTranslate,
+  useCan,
+  useResource,
+  useRouterContext,
+  useRouterType,
+  useLink,
+  AccessControlContext,
 } from "@refinedev/core";
 import {
-    RefineButtonClassNames,
-    RefineButtonTestIds,
+  RefineButtonClassNames,
+  RefineButtonTestIds,
 } from "@refinedev/ui-types";
 
 import { CreateButtonProps } from "../types";
@@ -26,92 +26,91 @@ import { CreateButtonProps } from "../types";
  * @see {@link https://refine.dev/docs/api-reference/antd/components/buttons/create-button} for more details.
  */
 export const CreateButton: React.FC<CreateButtonProps> = ({
-    resource: resourceNameFromProps,
-    resourceNameOrRouteName: propResourceNameOrRouteName,
-    hideText = false,
-    accessControl,
-    meta,
-    children,
-    onClick,
-    ...rest
+  resource: resourceNameFromProps,
+  resourceNameOrRouteName: propResourceNameOrRouteName,
+  hideText = false,
+  accessControl,
+  meta,
+  children,
+  onClick,
+  ...rest
 }) => {
-    const accessControlContext = useContext(AccessControlContext);
+  const accessControlContext = useContext(AccessControlContext);
 
-    const accessControlEnabled =
-        accessControl?.enabled ??
-        accessControlContext.options.buttons.enableAccessControl;
+  const accessControlEnabled =
+    accessControl?.enabled ??
+    accessControlContext.options.buttons.enableAccessControl;
 
-    const hideIfUnauthorized =
-        accessControl?.hideIfUnauthorized ??
-        accessControlContext.options.buttons.hideIfUnauthorized;
+  const hideIfUnauthorized =
+    accessControl?.hideIfUnauthorized ??
+    accessControlContext.options.buttons.hideIfUnauthorized;
 
-    const translate = useTranslate();
-    const routerType = useRouterType();
-    const Link = useLink();
-    const { Link: LegacyLink } = useRouterContext();
+  const translate = useTranslate();
+  const routerType = useRouterType();
+  const Link = useLink();
+  const { Link: LegacyLink } = useRouterContext();
 
-    const ActiveLink = routerType === "legacy" ? LegacyLink : Link;
+  const ActiveLink = routerType === "legacy" ? LegacyLink : Link;
 
-    const { createUrl: generateCreateUrl } = useNavigation();
+  const { createUrl: generateCreateUrl } = useNavigation();
 
-    const { resource } = useResource(
-        resourceNameFromProps ?? propResourceNameOrRouteName,
-    );
+  const { resource } = useResource(
+    resourceNameFromProps ?? propResourceNameOrRouteName,
+  );
+
+  const { data } = useCan({
+    resource: resource?.name,
+    action: "create",
+    queryOptions: {
+      enabled: accessControlEnabled,
+    },
+    params: {
+      resource,
+    },
+  });
 
-    const { data } = useCan({
-        resource: resource?.name,
-        action: "create",
-        queryOptions: {
-            enabled: accessControlEnabled,
-        },
-        params: {
-            resource,
-        },
-    });
+  const createButtonDisabledTitle = () => {
+    if (data?.can) return "";
+    if (data?.reason) return data.reason;
 
-    const createButtonDisabledTitle = () => {
-        if (data?.can) return "";
-        else if (data?.reason) return data.reason;
-        else
-            return translate(
-                "buttons.notAccessTitle",
-                "You don't have permission to access",
-            );
-    };
+    return translate(
+      "buttons.notAccessTitle",
+      "You don't have permission to access",
+    );
+  };
 
-    const createUrl = resource ? generateCreateUrl(resource, meta) : "";
+  const createUrl = resource ? generateCreateUrl(resource, meta) : "";
 
-    if (accessControlEnabled && hideIfUnauthorized && !data?.can) {
-        return null;
-    }
+  if (accessControlEnabled && hideIfUnauthorized && !data?.can) {
+    return null;
+  }
 
-    return (
-        <ActiveLink
-            to={createUrl}
-            replace={false}
-            onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-                if (data?.can === false) {
-                    e.preventDefault();
-                    return;
-                }
-                if (onClick) {
-                    e.preventDefault();
-                    onClick(e);
-                }
-            }}
-        >
-            <Button
-                icon={<PlusSquareOutlined />}
-                disabled={data?.can === false}
-                title={createButtonDisabledTitle()}
-                data-testid={RefineButtonTestIds.CreateButton}
-                className={RefineButtonClassNames.CreateButton}
-                type="primary"
-                {...rest}
-            >
-                {!hideText &&
-                    (children ?? translate("buttons.create", "Create"))}
-            </Button>
-        </ActiveLink>
-    );
+  return (
+    <ActiveLink
+      to={createUrl}
+      replace={false}
+      onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
+        if (data?.can === false) {
+          e.preventDefault();
+          return;
+        }
+        if (onClick) {
+          e.preventDefault();
+          onClick(e);
+        }
+      }}
+    >
+      <Button
+        icon={<PlusSquareOutlined />}
+        disabled={data?.can === false}
+        title={createButtonDisabledTitle()}
+        data-testid={RefineButtonTestIds.CreateButton}
+        className={RefineButtonClassNames.CreateButton}
+        type="primary"
+        {...rest}
+      >
+        {!hideText && (children ?? translate("buttons.create", "Create"))}
+      </Button>
+    </ActiveLink>
+  );
 };

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

@@ -2,18 +2,18 @@ import React, { useContext } from "react";
 import { Button, Popconfirm } from "antd";
 import { DeleteOutlined } from "@ant-design/icons";
 import {
-    useDelete,
-    useTranslate,
-    useMutationMode,
-    useCan,
-    useResource,
-    pickNotDeprecated,
-    useWarnAboutChange,
-    AccessControlContext,
+  useDelete,
+  useTranslate,
+  useMutationMode,
+  useCan,
+  useResource,
+  pickNotDeprecated,
+  useWarnAboutChange,
+  AccessControlContext,
 } from "@refinedev/core";
 import {
-    RefineButtonClassNames,
-    RefineButtonTestIds,
+  RefineButtonClassNames,
+  RefineButtonTestIds,
 } from "@refinedev/ui-types";
 
 import { DeleteButtonProps } from "../types";
@@ -25,126 +25,121 @@ import { DeleteButtonProps } from "../types";
  * @see {@link https://refine.dev/docs/api-reference/antd/components/buttons/delete-button} for more details.
  */
 export const DeleteButton: React.FC<DeleteButtonProps> = ({
-    resource: resourceNameFromProps,
-    resourceNameOrRouteName: propResourceNameOrRouteName,
-    recordItemId,
-    onSuccess,
-    mutationMode: mutationModeProp,
-    children,
-    successNotification,
-    errorNotification,
-    hideText = false,
-    accessControl,
-    metaData,
-    meta,
-    dataProviderName,
-    confirmTitle,
-    confirmOkText,
-    confirmCancelText,
-    invalidates,
-    ...rest
+  resource: resourceNameFromProps,
+  resourceNameOrRouteName: propResourceNameOrRouteName,
+  recordItemId,
+  onSuccess,
+  mutationMode: mutationModeProp,
+  children,
+  successNotification,
+  errorNotification,
+  hideText = false,
+  accessControl,
+  metaData,
+  meta,
+  dataProviderName,
+  confirmTitle,
+  confirmOkText,
+  confirmCancelText,
+  invalidates,
+  ...rest
 }) => {
-    const accessControlContext = useContext(AccessControlContext);
+  const accessControlContext = useContext(AccessControlContext);
 
-    const accessControlEnabled =
-        accessControl?.enabled ??
-        accessControlContext.options.buttons.enableAccessControl;
+  const accessControlEnabled =
+    accessControl?.enabled ??
+    accessControlContext.options.buttons.enableAccessControl;
 
-    const hideIfUnauthorized =
-        accessControl?.hideIfUnauthorized ??
-        accessControlContext.options.buttons.hideIfUnauthorized;
+  const hideIfUnauthorized =
+    accessControl?.hideIfUnauthorized ??
+    accessControlContext.options.buttons.hideIfUnauthorized;
 
-    const translate = useTranslate();
+  const translate = useTranslate();
 
-    const { id, resource, identifier } = useResource(
-        resourceNameFromProps ?? propResourceNameOrRouteName,
-    );
+  const { id, resource, identifier } = useResource(
+    resourceNameFromProps ?? propResourceNameOrRouteName,
+  );
+
+  const { mutationMode: mutationModeContext } = useMutationMode();
 
-    const { mutationMode: mutationModeContext } = useMutationMode();
+  const mutationMode = mutationModeProp ?? mutationModeContext;
 
-    const mutationMode = mutationModeProp ?? mutationModeContext;
+  const { mutate, isLoading, variables } = useDelete();
 
-    const { mutate, isLoading, variables } = useDelete();
+  const { data } = useCan({
+    resource: resource?.name,
+    action: "delete",
+    params: { id: recordItemId ?? id, resource },
+    queryOptions: {
+      enabled: accessControlEnabled,
+    },
+  });
 
-    const { data } = useCan({
-        resource: resource?.name,
-        action: "delete",
-        params: { id: recordItemId ?? id, resource },
-        queryOptions: {
-            enabled: accessControlEnabled,
-        },
-    });
+  const disabledTitle = () => {
+    if (data?.can) return "";
+    if (data?.reason) return data.reason;
 
-    const disabledTitle = () => {
-        if (data?.can) return "";
-        else if (data?.reason) return data.reason;
-        else
-            return translate(
-                "buttons.notAccessTitle",
-                "You don't have permission to access",
-            );
-    };
+    return translate(
+      "buttons.notAccessTitle",
+      "You don't have permission to access",
+    );
+  };
 
-    const { setWarnWhen } = useWarnAboutChange();
+  const { setWarnWhen } = useWarnAboutChange();
 
-    if (accessControlEnabled && hideIfUnauthorized && !data?.can) {
-        return null;
-    }
+  if (accessControlEnabled && hideIfUnauthorized && !data?.can) {
+    return null;
+  }
 
-    return (
-        <Popconfirm
-            key="delete"
-            okText={confirmOkText ?? translate("buttons.delete", "Delete")}
-            cancelText={
-                confirmCancelText ?? translate("buttons.cancel", "Cancel")
-            }
-            okType="danger"
-            title={
-                confirmTitle ?? translate("buttons.confirm", "Are you sure?")
-            }
-            okButtonProps={{ disabled: isLoading }}
-            onConfirm={(): void => {
-                if ((recordItemId ?? id) && identifier) {
-                    setWarnWhen(false);
-                    mutate(
-                        {
-                            id: recordItemId ?? id ?? "",
-                            resource: identifier,
-                            mutationMode,
-                            successNotification,
-                            errorNotification,
-                            meta: pickNotDeprecated(meta, metaData),
-                            metaData: pickNotDeprecated(meta, metaData),
-                            dataProviderName,
-                            invalidates,
-                        },
-                        {
-                            onSuccess: (value) => {
-                                onSuccess && onSuccess(value);
-                            },
-                        },
-                    );
-                }
-            }}
-            disabled={
-                typeof rest?.disabled !== "undefined"
-                    ? rest.disabled
-                    : data?.can === false
-            }
-        >
-            <Button
-                danger
-                loading={(recordItemId ?? id) === variables?.id && isLoading}
-                icon={<DeleteOutlined />}
-                title={disabledTitle()}
-                disabled={data?.can === false}
-                data-testid={RefineButtonTestIds.DeleteButton}
-                className={RefineButtonClassNames.DeleteButton}
-                {...rest}
-            >
-                {!hideText &&
-                    (children ?? translate("buttons.delete", "Delete"))}
-            </Button>
-        </Popconfirm>
-    );
+  return (
+    <Popconfirm
+      key="delete"
+      okText={confirmOkText ?? translate("buttons.delete", "Delete")}
+      cancelText={confirmCancelText ?? translate("buttons.cancel", "Cancel")}
+      okType="danger"
+      title={confirmTitle ?? translate("buttons.confirm", "Are you sure?")}
+      okButtonProps={{ disabled: isLoading }}
+      onConfirm={(): void => {
+        if ((recordItemId ?? id) && identifier) {
+          setWarnWhen(false);
+          mutate(
+            {
+              id: recordItemId ?? id ?? "",
+              resource: identifier,
+              mutationMode,
+              successNotification,
+              errorNotification,
+              meta: pickNotDeprecated(meta, metaData),
+              metaData: pickNotDeprecated(meta, metaData),
+              dataProviderName,
+              invalidates,
+            },
+            {
+              onSuccess: (value) => {
+                onSuccess?.(value);
+              },
+            },
+          );
+        }
+      }}
+      disabled={
+        typeof rest?.disabled !== "undefined"
+          ? rest.disabled
+          : data?.can === false
+      }
+    >
+      <Button
+        danger
+        loading={(recordItemId ?? id) === variables?.id && isLoading}
+        icon={<DeleteOutlined />}
+        title={disabledTitle()}
+        disabled={data?.can === false}
+        data-testid={RefineButtonTestIds.DeleteButton}
+        className={RefineButtonClassNames.DeleteButton}
+        {...rest}
+      >
+        {!hideText && (children ?? translate("buttons.delete", "Delete"))}
+      </Button>
+    </Popconfirm>
+  );
 };

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

@@ -2,18 +2,18 @@ import React, { useContext } from "react";
 import { Button } from "antd";
 import { EditOutlined } from "@ant-design/icons";
 import {
-    useCan,
-    useNavigation,
-    useTranslate,
-    useResource,
-    useRouterContext,
-    useRouterType,
-    useLink,
-    AccessControlContext,
+  useCan,
+  useNavigation,
+  useTranslate,
+  useResource,
+  useRouterContext,
+  useRouterType,
+  useLink,
+  AccessControlContext,
 } from "@refinedev/core";
 import {
-    RefineButtonClassNames,
-    RefineButtonTestIds,
+  RefineButtonClassNames,
+  RefineButtonTestIds,
 } from "@refinedev/ui-types";
 
 import { EditButtonProps } from "../types";
@@ -26,93 +26,93 @@ import { EditButtonProps } from "../types";
  * @see {@link https://refine.dev/docs/api-reference/antd/components/buttons/edit-button} for more details.
  */
 export const EditButton: React.FC<EditButtonProps> = ({
-    resource: resourceNameFromProps,
-    resourceNameOrRouteName: propResourceNameOrRouteName,
-    recordItemId,
-    hideText = false,
-    accessControl,
-    meta,
-    children,
-    onClick,
-    ...rest
+  resource: resourceNameFromProps,
+  resourceNameOrRouteName: propResourceNameOrRouteName,
+  recordItemId,
+  hideText = false,
+  accessControl,
+  meta,
+  children,
+  onClick,
+  ...rest
 }) => {
-    const accessControlContext = useContext(AccessControlContext);
+  const accessControlContext = useContext(AccessControlContext);
 
-    const accessControlEnabled =
-        accessControl?.enabled ??
-        accessControlContext.options.buttons.enableAccessControl;
+  const accessControlEnabled =
+    accessControl?.enabled ??
+    accessControlContext.options.buttons.enableAccessControl;
 
-    const hideIfUnauthorized =
-        accessControl?.hideIfUnauthorized ??
-        accessControlContext.options.buttons.hideIfUnauthorized;
+  const hideIfUnauthorized =
+    accessControl?.hideIfUnauthorized ??
+    accessControlContext.options.buttons.hideIfUnauthorized;
 
-    const translate = useTranslate();
+  const translate = useTranslate();
 
-    const routerType = useRouterType();
-    const Link = useLink();
-    const { Link: LegacyLink } = useRouterContext();
+  const routerType = useRouterType();
+  const Link = useLink();
+  const { Link: LegacyLink } = useRouterContext();
 
-    const ActiveLink = routerType === "legacy" ? LegacyLink : Link;
+  const ActiveLink = routerType === "legacy" ? LegacyLink : Link;
 
-    const { editUrl: generateEditUrl } = useNavigation();
+  const { editUrl: generateEditUrl } = useNavigation();
 
-    const { id, resource } = useResource(
-        resourceNameFromProps ?? propResourceNameOrRouteName,
-    );
+  const { id, resource } = useResource(
+    resourceNameFromProps ?? propResourceNameOrRouteName,
+  );
+
+  const { data } = useCan({
+    resource: resource?.name,
+    action: "edit",
+    params: { id: recordItemId ?? id, resource },
+    queryOptions: {
+      enabled: accessControlEnabled,
+    },
+  });
 
-    const { data } = useCan({
-        resource: resource?.name,
-        action: "edit",
-        params: { id: recordItemId ?? id, resource },
-        queryOptions: {
-            enabled: accessControlEnabled,
-        },
-    });
+  const createButtonDisabledTitle = () => {
+    if (data?.can) return "";
+    if (data?.reason) return data.reason;
 
-    const createButtonDisabledTitle = () => {
-        if (data?.can) return "";
-        else if (data?.reason) return data.reason;
-        else
-            return translate(
-                "buttons.notAccessTitle",
-                "You don't have permission to access",
-            );
-    };
+    return translate(
+      "buttons.notAccessTitle",
+      "You don't have permission to access",
+    );
+  };
 
-    const editUrl =
-        resource && (recordItemId ?? id)
-            ? generateEditUrl(resource, recordItemId! ?? id!, meta)
-            : "";
+  const editUrl =
+    resource && (recordItemId ?? id)
+      ? generateEditUrl(resource, recordItemId! ?? id!, meta)
+      : "";
 
-    if (accessControlEnabled && hideIfUnauthorized && !data?.can) {
-        return null;
-    }
+  if (accessControlEnabled && hideIfUnauthorized && !data?.can) {
+    return null;
+  }
 
-    return (
-        <ActiveLink
-            to={editUrl}
-            replace={false}
-            onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
-                if (data?.can === false) {
-                    e.preventDefault();
-                    return;
-                }
-                if (onClick) {
-                    e.preventDefault();
-                    onClick(e);
-                }
-            }}
-        >
-            <Button
-                icon={<EditOutlined />}
-                disabled={data?.can === false}
-                title={createButtonDisabledTitle()}
-                data-testid={RefineButtonTestIds.EditButton}
-                className={RefineButtonClassNames.EditButton}
-                {...rest}
-            >
-                {!hideText && (children ?? translate("buttons.edit", "Edit"))}
-            </Button>
-        </ActiveLink>
-    );
+  return (
+    <ActiveLink
+      to={editUrl}
+      replace={false}
+      onClick={(e: React.PointerEvent<HTMLButtonElement>) => {
+        if (data?.can === false) {
+          e.preventDefault();
+          return;
+        }
+        if (onClick) {
+          e.preventDefault();
+          onClick(e);
+        }
+      }}
+    >
+      <Button
+        icon={<EditOutlined />}
+        disabled={data?.can === false}
+        title={createButtonDisabledTitle()}
+        data-testid={RefineButtonTestIds.EditButton}
+        className={RefineButtonClassNames.EditButton}
+        {...rest}
+      >
+        {!hideText && (children ?? translate("buttons.edit", "Edit"))}
+      </Button>
+    </ActiveLink>
+  );
 };