Merge pull request #240 from brunomous/feature/crud-edit-cancel-button

Add Cancel button to Crud edit form
conceptadev · Sep 25, 2024 · fd73232 · fd73232
2 parents fa190ea + f22705d
commit fd73232
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 12 deletions.
diff --git a/packages/react-material-ui/src/components/submodules/DrawerForm/index.tsx b/packages/react-material-ui/src/components/submodules/DrawerForm/index.tsx
@@ -141,12 +141,13 @@ const DrawerFormSubmodule = (props: FormSubmoduleProps) => {
         )}
         <Box display="flex" flexDirection="row" alignItems="center" gap={2}>
           {props.customFooterContent}
-          {viewMode === 'creation' && !props.hideCancelButton && (
-            <Button variant="outlined" onClick={onClose} sx={{ flex: 1 }}>
-              {cancelButtonTitle || 'Cancel'}
-            </Button>
-          )}
-          {viewMode === 'edit' && !props.hideCancelButton && (
+          {(viewMode === 'creation' || viewMode === 'edit') &&
+            !props.hideCancelButton && (
+              <Button variant="outlined" onClick={onClose} sx={{ flex: 1 }}>
+                {cancelButtonTitle || 'Cancel'}
+              </Button>
+            )}
+          {viewMode === 'edit' && props.isDeleteButtonVisible && (
             <Button
               variant="contained"
               color="error"

diff --git a/packages/react-material-ui/src/components/submodules/ModalForm/index.tsx b/packages/react-material-ui/src/components/submodules/ModalForm/index.tsx
@@ -190,12 +190,13 @@ const ModalFormSubmodule = (props: FormSubmoduleProps) => {
               gap={2}
             >
               {props.customFooterContent}
-              {viewMode === 'creation' && !props.hideCancelButton && (
-                <Button variant="outlined" onClick={onClose} sx={{ flex: 1 }}>
-                  {cancelButtonTitle || 'Cancel'}
-                </Button>
-              )}
-              {viewMode === 'edit' && !props.hideCancelButton && (
+              {(viewMode === 'creation' || viewMode === 'edit') &&
+                !props.hideCancelButton && (
+                  <Button variant="outlined" onClick={onClose} sx={{ flex: 1 }}>
+                    {cancelButtonTitle || 'Cancel'}
+                  </Button>
+                )}
+              {viewMode === 'edit' && props.isDeleteButtonVisible && (
                 <Button
                   variant="contained"
                   color="error"

diff --git a/packages/react-material-ui/src/components/submodules/types/Form.ts b/packages/react-material-ui/src/components/submodules/types/Form.ts
@@ -41,6 +41,7 @@ export type FormSubmoduleProps = PropsWithChildren<
   submitButtonTitle?: string;
   cancelButtonTitle?: string;
   hideCancelButton?: boolean;
+  isDeleteButtonVisible?: boolean;
   customFooterContent?: ReactNode;
   onClose?: () => void;
   customValidate?: CustomValidator;