@applica-software-guru/react-admin 1.5.236 → 1.5.238

package/package.json

@@ -115,5 +115,5 @@
   "type": "module",
   "types": "dist/index.d.ts",
   "typings": "dist/index.d.ts",
-  "version": "1.5.236"
+  "version": "1.5.238"
 }

package/src/components/ra-buttons/CreateInDialogButton.tsx

@@ -1,7 +1,7 @@
 import { Toolbar } from '@/components/ra-forms';
-import { Breakpoint, Dialog } from '@mui/material';
-import { CreateBase, UseCreateMutateParams, useResourceContext } from 'ra-core';
-import { Button, CreateButton, CreateButtonProps, CreateProps, SaveButton } from 'ra-ui-materialui';
+import { Breakpoint, Button, Dialog } from '@mui/material';
+import { CreateBase, UseCreateMutateParams, useResourceContext, useTranslate } from 'ra-core';
+import { CreateButton, CreateButtonProps, CreateProps, SaveButton } from 'ra-ui-materialui';
 import React, { Children, PropsWithChildren, useCallback, useState } from 'react';
 import { FieldValues, useFormContext } from 'react-hook-form';
 import { useQueryClient } from 'react-query';
@@ -51,6 +51,7 @@ type SubmitButtonProps = {
 function SubmitButton(props: SubmitButtonProps) {
   const { onSubmit, closeDialog } = props;
   const { handleSubmit } = useFormContext();
+  const translate = useTranslate();
   const handleClick = useCallback(
     (event: any) => {
       (event as Event).preventDefault();
@@ -59,7 +60,11 @@ function SubmitButton(props: SubmitButtonProps) {
     },
     [handleSubmit, onSubmit, closeDialog]
   );
-  return <Button onClick={handleClick} label="ra.action.save" color="primary" variant="contained" size="medium" />;
+  return (
+    <Button onClick={handleClick} color="primary" variant="contained" size="medium">
+      {translate('ra.action.save')}
+    </Button>
+  );
 }
 type CreateInDialogButtonProps = PropsWithChildren &
   CreateProps &
@@ -67,7 +72,7 @@ type CreateInDialogButtonProps = PropsWithChildren &
     maxWidth: Breakpoint;
     fullWidth?: boolean;
     fullScreen?: boolean;
-
+    scroll: 'paper' | 'body' | undefined;
     /**
      * Custom handler for the submit event, in this case you are responsible for closing the dialog.
      * @example
@@ -86,9 +91,10 @@ type CreateInDialogButtonProps = PropsWithChildren &
     onSubmit?: SubmitFunction;
   };
 function CreateInDialogButton(props: CreateInDialogButtonProps) {
-  const { children, maxWidth = 'md', fullWidth = true, fullScreen, onSubmit, mutationOptions, ...rest } = props;
+  const { children, maxWidth = 'md', fullWidth = true, fullScreen, onSubmit, mutationOptions, scroll, ...rest } = props;
   const queryClient = useQueryClient();
   const resource = useResourceContext();
+  const translate = useTranslate();
   const Child = Children.only(children);
   const [open, setOpen] = useState(false);
   const handleOpen = useCallback(() => setOpen(true), []);
@@ -124,14 +130,28 @@ function CreateInDialogButton(props: CreateInDialogButtonProps) {
           onSuccess: handleSuccess
         }}
       >
-        <Dialog open={open} onClose={handleClose} maxWidth={maxWidth} fullWidth={fullWidth} fullScreen={fullScreen}>
+        <Dialog
+          open={open}
+          scroll={scroll}
+          onClose={handleClose}
+          maxWidth={maxWidth}
+          fullWidth={fullWidth}
+          fullScreen={fullScreen}
+          sx={{
+            '& .MuiToolbar-root': {
+              position: 'relative !important'
+            }
+          }}
+        >
           {React.isValidElement(Child)
             ? React.cloneElement(Child, {
                 ...Child.props,
                 modal: true,
                 toolbar: (
                   <Toolbar>
-                    <Button variant="text" size="medium" label="ra.action.cancel" onClick={handleClose} />
+                    <Button variant="text" size="medium" onClick={handleClose}>
+                      {translate('ra.action.cancel')}
+                    </Button>
                     {onSubmit ? (
                       <SubmitButton onSubmit={onSubmit!} closeDialog={handleClose} />
                     ) : (

package/src/components/ra-buttons/EditInDialogButton.tsx

@@ -1,7 +1,7 @@
 import { Toolbar } from '@/components/ra-forms';
-import { Breakpoint, Dialog } from '@mui/material';
-import { EditBase, UseUpdateMutateParams, useRecordContext } from 'ra-core';
-import { Button, EditButton, EditProps, SaveButton } from 'ra-ui-materialui';
+import { Breakpoint, Button, Dialog } from '@mui/material';
+import { EditBase, UseUpdateMutateParams, useRecordContext, useTranslate } from 'ra-core';
+import { EditButton, EditProps, SaveButton } from 'ra-ui-materialui';
 import React, { Children, PropsWithChildren, useCallback, useState } from 'react';
 
 type ResponsiveButtonProps = {
@@ -27,9 +27,10 @@ type EditInDialogButtonProps = PropsWithChildren &
     maxWidth: Breakpoint;
     fullWidth?: boolean;
     fullScreen?: boolean;
+    scroll: 'paper' | 'body' | undefined;
   };
 function EditInDialogButton(props: EditInDialogButtonProps): JSX.Element {
-  const { children, maxWidth = 'md', fullWidth = true, fullScreen, mutationOptions, ...rest } = props;
+  const { children, maxWidth = 'md', fullWidth = true, fullScreen, mutationOptions, scroll, ...rest } = props;
   const [open, setOpen] = useState(false);
   const Child = Children.only(children);
   const handleOpen = useCallback(() => setOpen(true), []);
@@ -42,6 +43,7 @@ function EditInDialogButton(props: EditInDialogButtonProps): JSX.Element {
     [handleClose, props.mutationOptions]
   );
   const record = useRecordContext();
+  const translate = useTranslate();
   return (
     <>
       <ResponsiveButton {...rest} onClick={handleOpen} />
@@ -56,11 +58,17 @@ function EditInDialogButton(props: EditInDialogButtonProps): JSX.Element {
       >
         <Dialog
           open={open}
+          scroll={scroll}
           onClose={handleClose}
           fullWidth={fullWidth}
           maxWidth={maxWidth}
           fullScreen={fullScreen}
           keepMounted={false}
+          sx={{
+            '& .MuiToolbar-root': {
+              position: 'relative !important'
+            }
+          }}
         >
           {React.isValidElement(Child)
             ? React.cloneElement(Child, {
@@ -68,7 +76,9 @@ function EditInDialogButton(props: EditInDialogButtonProps): JSX.Element {
                 modal: true,
                 toolbar: (
                   <Toolbar>
-                    <Button variant="text" size="medium" label="ra.action.cancel" onClick={handleClose} />
+                    <Button variant="text" size="medium" onClick={handleClose}>
+                      {translate('ra.action.cancel')}
+                    </Button>
                     <SaveButton type="button" />
                   </Toolbar>
                 )

package/src/playground/components/ra-lists/CategoryList.jsx

@@ -16,7 +16,7 @@ import {
 
 function CategoryAddButton() {
   return (
-    <CreateInDialogButton maxWidth="sm" redirect="list" size="small" variant="text">
+    <CreateInDialogButton maxWidth="sm" redirect="list" size="medium" variant="text">
       <CategoryForm />
     </CreateInDialogButton>
   );

package/src/playground/components/ra-lists/UserList.jsx

@@ -41,15 +41,15 @@ function RolesInput({ record, source, roles, ...props }) {
   );
 }
 
-function ImageField({ record }) {
+function ImageField(record) {
   return <CoverField source="image" record={record} width={50} height={50} circle />;
 }
 
-function NameField({ record }) {
+function NameField(record) {
   return record.name;
 }
 
-function SecondaryField({ record }) {
+function SecondaryField(record) {
   return record.email;
 }