version 2 - beta

src/components/Snackbar/LoadingSnackbar.tsx

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import Button from '@mui/material/Button';
+import Snackbar, { SnackbarCloseReason } from '@mui/material/Snackbar';
+import Alert from '@mui/material/Alert';
+
+export const  LoadingSnackbar = ({open,  info}) => {
+
+  return (
+    <div>
+      <Snackbar anchorOrigin={{ vertical: 'bottom', horizontal: 'center' }} open={open}>
+        <Alert
+          severity="info"
+          variant="filled"
+          sx={{ width: '100%' }}
+        >
+          {info?.message}
+        </Alert>
+      </Snackbar>
+    </div>
+  );
+}

src/components/Snackbar/Snackbar.tsx

@@ -0,0 +1,38 @@
+import * as React from 'react';
+import Button from '@mui/material/Button';
+import Snackbar, { SnackbarCloseReason } from '@mui/material/Snackbar';
+import Alert from '@mui/material/Alert';
+
+export const  CustomizedSnackbars = ({open, setOpen, info, setInfo}) => {
+
+
+
+  const handleClose = (
+    event?: React.SyntheticEvent | Event,
+    reason?: SnackbarCloseReason,
+  ) => {
+    if (reason === 'clickaway') {
+      return;
+    }
+
+    setOpen(false);
+    setInfo(null)
+  };
+
+  return (
+    <div>
+      <Snackbar anchorOrigin={{ vertical: 'bottom', horizontal: 'center' }} open={open} autoHideDuration={6000} onClose={handleClose}>
+        <Alert
+                
+
+          onClose={handleClose}
+          severity={info?.type}
+          variant="filled"
+          sx={{ width: '100%' }}
+        >
+          {info?.message}
+        </Alert>
+      </Snackbar>
+    </div>
+  );
+}