fix: drawer content views on examples (refinedev#3904)

yidou120 · Mar 17, 2023 · f71366d · f71366d
1 parent ee0f25e
commit f71366d
Show file tree

Hide file tree

Showing 5 changed files with 48 additions and 16 deletions.
diff --git a/examples/finefoods-antd/src/components/product/create.tsx b/examples/finefoods-antd/src/components/product/create.tsx
@@ -3,6 +3,7 @@ import { useTranslate, useApiUrl } from "@refinedev/core";
 import { Create, getValueFromEvent, useSelect } from "@refinedev/antd";
 
 import {
+    Drawer,
     DrawerProps,
     Form,
     FormProps,
@@ -21,7 +22,6 @@ import {
 const { Text } = Typography;
 
 import { ICategory } from "interfaces";
-import { Drawer } from "./styled";
 
 type CreateProductProps = {
     drawerProps: DrawerProps;
@@ -46,10 +46,21 @@ export const CreateProduct: React.FC<CreateProductProps> = ({
         <Drawer
             {...drawerProps}
             width={breakpoint.sm ? "500px" : "100%"}
-            bodyStyle={{ padding: 0 }}
             zIndex={1001}
         >
-            <Create resource="products" saveButtonProps={saveButtonProps}>
+            <Create
+                resource="products"
+                saveButtonProps={saveButtonProps}
+                goBack={false}
+                contentProps={{
+                    style: {
+                        boxShadow: "none",
+                    },
+                    bodyStyle: {
+                        padding: 0,
+                    },
+                }}
+            >
                 <Form
                     {...formProps}
                     layout="vertical"

diff --git a/examples/finefoods-antd/src/components/product/edit.tsx b/examples/finefoods-antd/src/components/product/edit.tsx
@@ -1,4 +1,4 @@
-import { useTranslate, useApiUrl } from "@refinedev/core";
+import { useTranslate, useApiUrl, BaseKey } from "@refinedev/core";
 
 import { Edit, getValueFromEvent, useSelect } from "@refinedev/antd";
 
@@ -27,12 +27,14 @@ type EditProductProps = {
     drawerProps: DrawerProps;
     formProps: FormProps;
     saveButtonProps: ButtonProps;
+    editId?: BaseKey;
 };
 
 export const EditProduct: React.FC<EditProductProps> = ({
     drawerProps,
     formProps,
     saveButtonProps,
+    editId,
 }) => {
     const t = useTranslate();
     const apiUrl = useApiUrl();
@@ -46,13 +48,20 @@ export const EditProduct: React.FC<EditProductProps> = ({
         <Drawer
             {...drawerProps}
             width={breakpoint.sm ? "500px" : "100%"}
-            bodyStyle={{ padding: 0 }}
             zIndex={1001}
         >
             <Edit
                 saveButtonProps={saveButtonProps}
-                headerProps={{ extra: null }}
                 resource="products"
+                recordItemId={editId}
+                contentProps={{
+                    style: {
+                        boxShadow: "none",
+                    },
+                    bodyStyle: {
+                        padding: 0,
+                    },
+                }}
             >
                 <Form {...formProps} layout="vertical">
                     <Form.Item label={t("products.fields.images.label")}>

diff --git a/examples/finefoods-antd/src/components/product/styled.tsx b/examples/finefoods-antd/src/components/product/styled.tsx
diff --git a/examples/finefoods-antd/src/pages/products/list.tsx b/examples/finefoods-antd/src/pages/products/list.tsx
@@ -66,6 +66,7 @@ export const ProductList: React.FC<IResourceComponentsProps> = () => {
         formProps: editFormProps,
         saveButtonProps: editSaveButtonProps,
         show: editShow,
+        id: editId,
     } = useDrawerForm<IProduct>({
         action: "edit",
         resource: "products",
@@ -161,6 +162,7 @@ export const ProductList: React.FC<IResourceComponentsProps> = () => {
                 drawerProps={editDrawerProps}
                 formProps={editFormProps}
                 saveButtonProps={editSaveButtonProps}
+                editId={editId}
             />
         </div>
     );

diff --git a/examples/form-antd-use-drawer-form/src/pages/posts/list.tsx b/examples/form-antd-use-drawer-form/src/pages/posts/list.tsx
@@ -93,7 +93,18 @@ export const PostList: React.FC<IResourceComponentsProps> = () => {
                 </Table>
             </List>
             <Drawer {...createDrawerProps}>
-                <Create saveButtonProps={createSaveButtonProps}>
+                <Create
+                    saveButtonProps={createSaveButtonProps}
+                    goBack={false}
+                    contentProps={{
+                        style: {
+                            boxShadow: "none",
+                        },
+                        bodyStyle: {
+                            padding: 0,
+                        },
+                    }}
+                >
                     <Form {...createFormProps} layout="vertical">
                         <Form.Item
                             label="Title"
@@ -143,6 +154,14 @@ export const PostList: React.FC<IResourceComponentsProps> = () => {
                         disabled: formLoading,
                     }}
                     deleteButtonProps={deleteButtonProps}
+                    contentProps={{
+                        style: {
+                            boxShadow: "none",
+                        },
+                        bodyStyle: {
+                            padding: 0,
+                        },
+                    }}
                 >
                     <Form {...editFormProps} layout="vertical">
                         <Form.Item