@refinedev/antd 5.16.2 → 5.17.0

package/src/components/crud/types.ts

@@ -2,8 +2,11 @@ import { CardProps, SpaceProps } from "antd";
 import {
     CreateButtonProps,
     DeleteButtonProps,
+    EditButtonProps,
+    ListButtonProps,
+    RefreshButtonProps,
     SaveButtonProps,
-} from "@components/buttons";
+} from "../buttons/types";
 import {
     RefineCrudCreateProps,
     RefineCrudEditProps,
@@ -34,7 +37,10 @@ export type EditProps = RefineCrudEditProps<
         HTMLDivElement
     >,
     PageHeaderProps,
-    CardProps
+    CardProps,
+    {},
+    RefreshButtonProps,
+    ListButtonProps
 >;
 
 export type ListProps = RefineCrudListProps<
@@ -59,5 +65,10 @@ export type ShowProps = RefineCrudShowProps<
         HTMLDivElement
     >,
     PageHeaderProps,
-    CardProps
+    CardProps,
+    {},
+    EditButtonProps,
+    DeleteButtonProps,
+    RefreshButtonProps,
+    ListButtonProps
 >;

package/src/components/pageHeader/index.tsx

@@ -5,6 +5,7 @@ import {
 } from "@ant-design/pro-layout";
 import { Button, Typography } from "antd";
 import { ArrowLeftOutlined } from "@ant-design/icons";
+import { RefinePageHeaderClassNames } from "@refinedev/ui-types";
 
 export type PageHeaderProps = AntdPageHeaderProps;
 
@@ -18,7 +19,11 @@ export const PageHeader: FC<AntdPageHeaderProps> = ({ children, ...props }) => {
 
     const title =
         typeof props.title === "string" ? (
-            <Typography.Title level={4} style={{ marginBottom: 0 }}>
+            <Typography.Title
+                className={RefinePageHeaderClassNames.Title}
+                level={4}
+                style={{ marginBottom: 0 }}
+            >
                 {props.title}
             </Typography.Title>
         ) : (
@@ -28,6 +33,7 @@ export const PageHeader: FC<AntdPageHeaderProps> = ({ children, ...props }) => {
     const subtitle =
         typeof props.title === "string" ? (
             <Typography.Title
+                className={RefinePageHeaderClassNames.SubTitle}
                 level={5}
                 type="secondary"
                 style={{ marginBottom: 0 }}

package/src/hooks/form/useDrawerForm/useDrawerForm.ts

@@ -120,8 +120,6 @@ export const useDrawerForm = <
     TResponse,
     TResponseError
 > => {
-    const initiallySynced = React.useRef(false);
-
     const { visible, show, close } = useModal({
         defaultVisible,
     });
@@ -136,7 +134,7 @@ export const useDrawerForm = <
     >({
         ...rest,
     });
-
+    const [initiallySynced, setInitiallySynced] = React.useState(false);
     const { form, formProps, formLoading, id, setId, onFinish } = useFormProps;
 
     const { resource, action: actionFromParams } = useResource(rest.resource);
@@ -146,8 +144,10 @@ export const useDrawerForm = <
 
     const action = rest.action ?? actionFromParams ?? "";
 
-    const syncingId =
-        typeof syncWithLocation === "object" && syncWithLocation.syncId;
+    const syncingId = !(
+        typeof syncWithLocation === "object" &&
+        syncWithLocation?.syncId === false
+    );
 
     const syncWithLocationKey =
         typeof syncWithLocation === "object" && "key" in syncWithLocation
@@ -157,7 +157,7 @@ export const useDrawerForm = <
             : undefined;
 
     React.useEffect(() => {
-        if (initiallySynced.current === false && syncWithLocationKey) {
+        if (initiallySynced === false && syncWithLocationKey) {
             const openStatus = parsed?.params?.[syncWithLocationKey]?.open;
             if (typeof openStatus === "boolean") {
                 openStatus ? show() : close();
@@ -174,12 +174,12 @@ export const useDrawerForm = <
                 }
             }
 
-            initiallySynced.current = true;
+            setInitiallySynced(true);
         }
-    }, [syncWithLocationKey, parsed, syncingId, setId]);
+    }, [syncWithLocationKey, parsed, syncingId, setId, initiallySynced]);
 
     React.useEffect(() => {
-        if (initiallySynced.current === true) {
+        if (initiallySynced === true) {
             if (visible && syncWithLocationKey) {
                 go({
                     query: {
@@ -202,7 +202,15 @@ export const useDrawerForm = <
                 });
             }
         }
-    }, [id, visible, show, close, syncWithLocationKey, syncingId]);
+    }, [
+        id,
+        visible,
+        show,
+        close,
+        syncWithLocationKey,
+        syncingId,
+        initiallySynced,
+    ]);
 
     const translate = useTranslate();
 

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

@@ -128,7 +128,7 @@ export const useModalForm = <
     TResponse,
     TResponseError
 > => {
-    const initiallySynced = React.useRef(false);
+    const [initiallySynced, setInitiallySynced] = React.useState(false);
 
     const useFormProps = useForm<
         TQueryFnData,
@@ -150,8 +150,10 @@ export const useModalForm = <
 
     const action = rest.action ?? actionFromParams ?? "";
 
-    const syncingId =
-        typeof syncWithLocation === "object" && syncWithLocation.syncId;
+    const syncingId = !(
+        typeof syncWithLocation === "object" &&
+        syncWithLocation?.syncId === false
+    );
 
     const syncWithLocationKey =
         typeof syncWithLocation === "object" && "key" in syncWithLocation
@@ -191,7 +193,7 @@ export const useModalForm = <
     };
 
     React.useEffect(() => {
-        if (initiallySynced.current === false && syncWithLocationKey) {
+        if (initiallySynced === false && syncWithLocationKey) {
             const openStatus = parsed?.params?.[syncWithLocationKey]?.open;
             if (typeof openStatus === "boolean") {
                 if (openStatus) {
@@ -210,12 +212,12 @@ export const useModalForm = <
                 }
             }
 
-            initiallySynced.current = true;
+            setInitiallySynced(true);
         }
     }, [syncWithLocationKey, parsed, syncingId, setId]);
 
     React.useEffect(() => {
-        if (initiallySynced.current === true) {
+        if (initiallySynced === true) {
             if (visible && syncWithLocationKey) {
                 go({
                     query: {