chore: improve toast and show once

src/hooks/useApiToast.jsx

@@ -5,7 +5,7 @@ export default function useApiToast() {
 
     const handleError = (error, defaultMessage = 'API error') => {
         console.error(error);
-        enqueueSnackbar(error.message || defaultMessage, { variant: 'error' });
+        enqueueSnackbar(defaultMessage, { variant: 'error' });
     };
 
     return { handleError };

src/main.jsx

@@ -9,14 +9,9 @@ import App from './App.jsx'
 createRoot(document.getElementById('root')).render(
   <StrictMode>
     <ThemeProvider theme={theme}>
-      <SnackbarProvider maxSnack={3}
+      <SnackbarProvider maxSnack={3} autoHideDuration={3000}>
-        autoHideDuration={5000}
-        anchorOrigin={{
-          vertical: 'top',
-          horizontal: 'right',
-        }}>
         <App />
       </SnackbarProvider>
     </ThemeProvider>
   </StrictMode>,
-)
+)

src/private/mongo/Admin.jsx

@@ -1,5 +1,5 @@
 import SectionContainer from '../../components/SectionContainer';
-import { useEffect, useState } from 'react';
+import { useEffect, useState, useRef } from 'react';
 import { DataGrid } from '@mui/x-data-grid';
 import { Typography, Button, Dialog, DialogTitle, DialogContent, IconButton, Box } from '@mui/material';
 import EditRoundedIcon from '@mui/icons-material/EditRounded';
@@ -42,11 +42,14 @@ export default function Admin() {
     const [rowToDelete, setRowToDelete] = useState(null);
     const { handleError } = useApiToast();
 
-    useEffect(() => {
+const hasLoaded = useRef(false);
-        let isMounted = true;
+
-        loadData();
+useEffect(() => {
-        return () => { isMounted = false };
+  if (!hasLoaded.current) {
-    }, []);
+    loadData();
+    hasLoaded.current = true;
+  }
+}, []);
 
     const handleEditClick = (params) => {
         setEditingData(params.row);