Add loading indicator

src/components/common/Dialog/Dialog.jsx

@@ -11,7 +11,8 @@ import {
   Stack,
   Typography,
   Grid,
-  TextField
+  TextField,
+  LinearProgress
 } from "@mui/material";
 import CloseIcon from "@mui/icons-material/Close";
 
@@ -87,7 +88,8 @@ export const Dialog = ({
   open,
   onClose,
   DialogProps = {},
-  className
+  className,
+  isLoading
 }) => {
   return (
     <MuiDialog
@@ -104,6 +106,7 @@ export const Dialog = ({
         ) : (
           <Box>{content}</Box>
         )}
+        {isLoading && <LinearProgress sx={{ marginTop: "16px" }} />}
       </DialogContent>
       {renderActions ? (
         <DialogActions>{renderActions(onClose)}</DialogActions>
@@ -207,8 +210,16 @@ export const ConfirmationDialog = styled(
 )({});
 
 export const ConfirmDangerActionDialog = ({ ...props }) => {
-  const { title, text, confirmText, valueToCheck, open, onClose, onConfirm } =
-    props;
+  const {
+    title,
+    text,
+    confirmText,
+    valueToCheck,
+    open,
+    onClose,
+    onConfirm,
+    isLoading
+  } = props;
   const [isConfirmDisabled, setIsConfirmDisabled] = useState(true);
 
   const handleInputChange = (event) => {
@@ -257,7 +268,7 @@ export const ConfirmDangerActionDialog = ({ ...props }) => {
           </Grid>
         </Grid>
       }
-      {...{ open, onConfirm, isConfirmDisabled }}
+      {...{ open, onConfirm, isConfirmDisabled, isLoading }}
     />
   );
 };