Merge branch 'develop' of https://gitlab.com/witel3/loan-facilities-expert into feature/upload_file

public/locales/fa/app.json

@@ -52,6 +52,7 @@
   "Dashboard": {
     "dashboard_page": "داشبورد",
     "passenger_boss_page": "رئیس مسافر",
+    "transportation_assistance": "معاونت حمل و نقل",
     "change_password": "تغییر رمز عبور",
     "province_manager_page": "مدیر کل استانی",
     "passenger_office_page": "اداره مسافر",

src/components/dashboard/machinary-office/Form/ConfirmForm.jsx

@@ -65,7 +65,7 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
     }
   };
   return (
-    <Dialog open={open} onClose={handleClose}>
+    <Dialog open={open}>
       <DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
       <DialogContent>
         <DialogContentText>{t("ConfirmDialog.context")}</DialogContentText>
@@ -118,12 +118,12 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
         />
       </DialogContent>
       <DialogActions>
-        <Button onClick={formik.handleSubmit} color="primary">
-          {t("ConfirmDialog.button-confirm")}
-        </Button>
         <Button onClick={handleClose} color="secondary" autoFocus>
           {t("ConfirmDialog.button-cancel")}
         </Button>
+        <Button onClick={formik.handleSubmit} color="primary">
+          {t("ConfirmDialog.button-confirm")}
+        </Button>
       </DialogActions>
     </Dialog>
   );

src/components/dashboard/machinary-office/Form/RejectForm.jsx

@@ -58,7 +58,7 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
   };
 
   return (
-    <Dialog open={open} onClose={handleClose}>
+    <Dialog open={open}>
       <DialogTitle>{t("RejectDialog.reject")}</DialogTitle>
       <DialogContent>
         <DialogContentText>{t("RejectDialog.context")}</DialogContentText>
@@ -93,12 +93,12 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
         />
       </DialogContent>
       <DialogActions>
-        <Button onClick={formik.handleSubmit} color="primary">
-          {t("RejectDialog.button-reject")}
-        </Button>
         <Button onClick={handleClose} color="secondary" autoFocus>
           {t("RejectDialog.button-cancel")}
         </Button>
+        <Button onClick={formik.handleSubmit} color="primary">
+          {t("RejectDialog.button-reject")}
+        </Button>
       </DialogActions>
     </Dialog>
   );

src/components/dashboard/machinary-office/TableRowActions.jsx

@@ -1,12 +1,14 @@
 import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
 import ThumbDownIcon from "@mui/icons-material/ThumbDown";
-import { Box, IconButton } from "@mui/material";
+import { Box, IconButton, Tooltip } from "@mui/material";
 import { useContext } from "react";
 import { DataTableContext } from "@/lib/app/contexts/DataTableContext";
 import ConfirmForm from "./Form/ConfirmForm";
 import RejectForm from "./Form/RejectForm";
+import { useTranslations } from "next-intl";
 
 const TableRowActions = ({ row }) => {
+  const t = useTranslations();
   const {
     openConfirmDialog,
     openRejectDialog,
@@ -20,14 +22,16 @@ const TableRowActions = ({ row }) => {
   } = useContext(DataTableContext);
   return (
     <Box sx={{ display: "flex", flexWrap: "nowrap", gap: "8px" }}>
-      <IconButton
+      <Tooltip title={t("ConfirmDialog.confirm")}>
-        color="primary"
+        <IconButton
-        onClick={() => {
+          color="primary"
-          handleOpenConfirmDialog(row);
+          onClick={() => {
-        }}
+            handleOpenConfirmDialog(row);
-      >
+          }}
-        <ThumbUpAltIcon />
+        >
-      </IconButton>
+          <ThumbUpAltIcon />
+        </IconButton>
+      </Tooltip>
       {openConfirmDialog && (
         <ConfirmForm
           rowId={rowId}
@@ -36,9 +40,11 @@ const TableRowActions = ({ row }) => {
           confirmData={confirmData}
         />
       )}
-      <IconButton color="primary" onClick={() => handleOpenRejectDialog(row)}>
+      <Tooltip title={t("RejectDialog.reject")}>
-        <ThumbDownIcon />
+        <IconButton color="primary" onClick={() => handleOpenRejectDialog(row)}>
-      </IconButton>
+          <ThumbDownIcon />
+        </IconButton>
+      </Tooltip>
       {openRejectDialog && (
         <RejectForm
           rowId={rowId}

src/components/dashboard/machinary-office/index.jsx

@@ -176,6 +176,7 @@ function DashboardMachinaryOfficeComponent() {
         header: t("MachinaryOffice.state_name"),
         enableColumnFilter: false,
         datatype: "numeric",
+        minSize: 300,
         // filterFn: "equals",
         // filterSelectOptions: [
         // ],

src/components/dashboard/passenger-boss/Form/ConfirmForm.jsx

@@ -67,7 +67,7 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
   };
 
   return (
-    <Dialog open={open} onClose={handleClose}>
+    <Dialog open={open}>
       <DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
       <DialogContent>
         <DialogContentText>{t("ConfirmDialog.context")}</DialogContentText>
@@ -120,12 +120,12 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
         />
       </DialogContent>
       <DialogActions>
-        <Button onClick={formik.handleSubmit} color="primary">
-          {t("ConfirmDialog.button-confirm")}
-        </Button>
         <Button onClick={handleClose} color="secondary" autoFocus>
           {t("ConfirmDialog.button-cancel")}
         </Button>
+        <Button onClick={formik.handleSubmit} color="primary">
+          {t("ConfirmDialog.button-confirm")}
+        </Button>
       </DialogActions>
     </Dialog>
   );

src/components/dashboard/passenger-boss/Form/RejectForm.jsx

@@ -58,7 +58,7 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
   };
 
   return (
-    <Dialog open={open} onClose={handleClose}>
+    <Dialog open={open}>
       <DialogTitle>{t("RejectDialog.reject")}</DialogTitle>
       <DialogContent>
         <DialogContentText>{t("RejectDialog.context")}</DialogContentText>
@@ -93,12 +93,12 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
         />
       </DialogContent>
       <DialogActions>
-        <Button onClick={formik.handleSubmit} color="primary">
-          {t("RejectDialog.button-reject")}
-        </Button>
         <Button onClick={handleClose} color="secondary" autoFocus>
           {t("RejectDialog.button-cancel")}
         </Button>
+        <Button onClick={formik.handleSubmit} color="primary">
+          {t("RejectDialog.button-reject")}
+        </Button>
       </DialogActions>
     </Dialog>
   );

src/components/dashboard/passenger-boss/TableRowActions.jsx

@@ -1,12 +1,14 @@
 import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
 import ThumbDownIcon from "@mui/icons-material/ThumbDown";
-import { Box, IconButton } from "@mui/material";
+import { Box, IconButton, Tooltip } from "@mui/material";
 import { useContext } from "react";
 import { DataTableContext } from "@/lib/app/contexts/DataTableContext";
 import ConfirmForm from "./Form/ConfirmForm";
 import RejectForm from "./Form/RejectForm";
+import { useTranslations } from "next-intl";
 
 const TableRowActions = ({ row }) => {
+  const t = useTranslations();
   const {
     openConfirmDialog,
     openRejectDialog,
@@ -20,14 +22,16 @@ const TableRowActions = ({ row }) => {
   } = useContext(DataTableContext);
   return (
     <Box sx={{ display: "flex", flexWrap: "nowrap", gap: "8px" }}>
-      <IconButton
+      <Tooltip title={t("ConfirmDialog.confirm")}>
-        color="primary"
+        <IconButton
-        onClick={() => {
+          color="primary"
-          handleOpenConfirmDialog(row);
+          onClick={() => {
-        }}
+            handleOpenConfirmDialog(row);
-      >
+          }}
-        <ThumbUpAltIcon />
+        >
-      </IconButton>
+          <ThumbUpAltIcon />
+        </IconButton>
+      </Tooltip>
       {openConfirmDialog && (
         <ConfirmForm
           rowId={rowId}
@@ -36,9 +40,11 @@ const TableRowActions = ({ row }) => {
           confirmData={confirmData}
         />
       )}
-      <IconButton color="primary" onClick={() => handleOpenRejectDialog(row)}>
+      <Tooltip title={t("RejectDialog.reject")}>
-        <ThumbDownIcon />
+        <IconButton color="primary" onClick={() => handleOpenRejectDialog(row)}>
-      </IconButton>
+          <ThumbDownIcon />
+        </IconButton>
+      </Tooltip>
       {openRejectDialog && (
         <RejectForm
           rowId={rowId}

src/components/dashboard/passenger-boss/index.jsx

@@ -178,6 +178,7 @@ function DashboardPassengerOfficeComponent() {
         header: t("PassengerBoss.state_name"),
         enableColumnFilter: false,
         datatype: "numeric",
+        minSize: 300,
         // filterFn: "equals",
         // filterSelectOptions: [
         // ],

src/components/dashboard/passenger-office/Form/ConfirmForm.jsx

@@ -60,7 +60,7 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
   };
 
   return (
-    <Dialog open={open} onClose={handleClose}>
+    <Dialog open={open}>
       <DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
       <DialogContent>
         <DialogContentText>{t("ConfirmDialog.context")}</DialogContentText>
@@ -91,12 +91,12 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
         />
       </DialogContent>
       <DialogActions>
-        <Button onClick={formik.handleSubmit} color="primary">
-          {t("ConfirmDialog.button-confirm")}
-        </Button>
         <Button onClick={handleClose} color="secondary" autoFocus>
           {t("ConfirmDialog.button-cancel")}
         </Button>
+        <Button onClick={formik.handleSubmit} color="primary">
+          {t("ConfirmDialog.button-confirm")}
+        </Button>
       </DialogActions>
     </Dialog>
   );

src/components/dashboard/passenger-office/Form/RejectForm.jsx

@@ -56,7 +56,7 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
     }
   };
   return (
-    <Dialog open={open} onClose={handleClose}>
+    <Dialog open={open}>
       <DialogTitle>{t("RejectDialog.reject")}</DialogTitle>
       <DialogContent>
         <DialogContentText>{t("RejectDialog.context")}</DialogContentText>
@@ -91,12 +91,12 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
         />
       </DialogContent>
       <DialogActions>
-        <Button onClick={formik.handleSubmit} color="primary">
-          {t("RejectDialog.button-reject")}
-        </Button>
         <Button onClick={handleClose} color="secondary" autoFocus>
           {t("RejectDialog.button-cancel")}
         </Button>
+        <Button onClick={formik.handleSubmit} color="primary">
+          {t("RejectDialog.button-reject")}
+        </Button>
       </DialogActions>
     </Dialog>
   );

src/components/dashboard/passenger-office/TableRowActions.jsx

@@ -1,12 +1,14 @@
 import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
 import ThumbDownIcon from "@mui/icons-material/ThumbDown";
-import { Box, IconButton } from "@mui/material";
+import { Box, IconButton, Tooltip } from "@mui/material";
 import { useContext } from "react";
 import { DataTableContext } from "@/lib/app/contexts/DataTableContext";
 import ConfirmForm from "./Form/ConfirmForm";
 import RejectForm from "./Form/RejectForm";
+import { useTranslations } from "next-intl";
 
 const TableRowActions = ({ row }) => {
+  const t = useTranslations();
   const {
     openConfirmDialog,
     openRejectDialog,
@@ -20,14 +22,16 @@ const TableRowActions = ({ row }) => {
   } = useContext(DataTableContext);
   return (
     <Box sx={{ display: "flex", flexWrap: "nowrap", gap: "8px" }}>
-      <IconButton
+      <Tooltip title={t("ConfirmDialog.confirm")}>
-        color="primary"
+        <IconButton
-        onClick={() => {
+          color="primary"
-          handleOpenConfirmDialog(row);
+          onClick={() => {
-        }}
+            handleOpenConfirmDialog(row);
-      >
+          }}
-        <ThumbUpAltIcon />
+        >
-      </IconButton>
+          <ThumbUpAltIcon />
+        </IconButton>
+      </Tooltip>
       {openConfirmDialog && (
         <ConfirmForm
           rowId={rowId}
@@ -36,9 +40,11 @@ const TableRowActions = ({ row }) => {
           confirmData={confirmData}
         />
       )}
-      <IconButton color="primary" onClick={() => handleOpenRejectDialog(row)}>
+      <Tooltip title={t("RejectDialog.reject")}>
-        <ThumbDownIcon />
+        <IconButton color="primary" onClick={() => handleOpenRejectDialog(row)}>
-      </IconButton>
+          <ThumbDownIcon />
+        </IconButton>
+      </Tooltip>
       {openRejectDialog && (
         <RejectForm
           rowId={rowId}

src/components/dashboard/passenger-office/index.jsx

@@ -178,6 +178,7 @@ function DashboardPassengerOfficeComponent() {
         header: t("PassengerOffice.state_name"),
         enableColumnFilter: false,
         datatype: "numeric",
+        minSize: 300,
         // filterFn: "equals",
         // filterSelectOptions: [
         // ],

src/components/dashboard/province-manager/Form/ConfirmForm.jsx

@@ -57,7 +57,7 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
   };
 
   return (
-    <Dialog open={open} onClose={handleClose}>
+    <Dialog open={open}>
       <DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
       <DialogContent>
         <DialogContentText>{t("ConfirmDialog.context")}</DialogContentText>
@@ -89,12 +89,12 @@ const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
         
       </DialogContent>
       <DialogActions>
-        <Button onClick={formik.handleSubmit} color="primary">
-          {t("ConfirmDialog.button-confirm")}
-        </Button>
         <Button onClick={handleClose} color="secondary" autoFocus>
           {t("ConfirmDialog.button-cancel")}
         </Button>
+        <Button onClick={formik.handleSubmit} color="primary">
+          {t("ConfirmDialog.button-confirm")}
+        </Button>
       </DialogActions>
     </Dialog>
   );

src/components/dashboard/province-manager/Form/RejectForm.jsx

@@ -57,7 +57,7 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
   };
 
   return (
-    <Dialog open={open} onClose={handleClose}>
+    <Dialog open={open}>
       <DialogTitle>{t("RejectDialog.reject")}</DialogTitle>
       <DialogContent>
         <DialogContentText>{t("RejectDialog.context")}</DialogContentText>
@@ -92,12 +92,12 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
         />
       </DialogContent>
       <DialogActions>
-        <Button onClick={formik.handleSubmit} color="primary">
-          {t("RejectDialog.button-reject")}
-        </Button>
         <Button onClick={handleClose} color="secondary" autoFocus>
           {t("RejectDialog.button-cancel")}
         </Button>
+        <Button onClick={formik.handleSubmit} color="primary">
+          {t("RejectDialog.button-reject")}
+        </Button>
       </DialogActions>
     </Dialog>
   );

src/components/dashboard/province-manager/TableRowActions.jsx

@@ -1,12 +1,14 @@
 import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
 import ThumbDownIcon from "@mui/icons-material/ThumbDown";
-import { Box, IconButton } from "@mui/material";
+import { Box, IconButton, Tooltip } from "@mui/material";
 import { useContext } from "react";
 import { DataTableContext } from "@/lib/app/contexts/DataTableContext";
 import ConfirmForm from "./Form/ConfirmForm";
 import RejectForm from "./Form/RejectForm";
+import { useTranslations } from "next-intl";
 
 const TableRowActions = ({ row }) => {
+  const t = useTranslations();
   const {
     openConfirmDialog,
     openRejectDialog,
@@ -20,14 +22,16 @@ const TableRowActions = ({ row }) => {
   } = useContext(DataTableContext);
   return (
     <Box sx={{ display: "flex", flexWrap: "nowrap", gap: "8px" }}>
-      <IconButton
+      <Tooltip title={t("ConfirmDialog.confirm")}>
-        color="primary"
+        <IconButton
-        onClick={() => {
+          color="primary"
-          handleOpenConfirmDialog(row);
+          onClick={() => {
-        }}
+            handleOpenConfirmDialog(row);
-      >
+          }}
-        <ThumbUpAltIcon />
+        >
-      </IconButton>
+          <ThumbUpAltIcon />
+        </IconButton>
+      </Tooltip>
       {openConfirmDialog && (
         <ConfirmForm
           rowId={rowId}
@@ -36,9 +40,11 @@ const TableRowActions = ({ row }) => {
           confirmData={confirmData}
         />
       )}
-      <IconButton color="primary" onClick={() => handleOpenRejectDialog(row)}>
+      <Tooltip title={t("RejectDialog.reject")}>
-        <ThumbDownIcon />
+        <IconButton color="primary" onClick={() => handleOpenRejectDialog(row)}>
-      </IconButton>
+          <ThumbDownIcon />
+        </IconButton>
+      </Tooltip>
       {openRejectDialog && (
         <RejectForm
           rowId={rowId}

src/components/dashboard/province-manager/index.jsx

@@ -178,6 +178,7 @@ function DashboardProvinceManagerComponent() {
         header: t("ProvinceManager.state_name"),
         enableColumnFilter: false,
         datatype: "numeric",
+        minSize: 300,
         // filterFn: "equals",
         // filterSelectOptions: [
         // ],

src/components/dashboard/transportation-assistance/Form/ConfirmForm.jsx

@@ -6,28 +6,56 @@ import {
   DialogContentText,
   DialogActions,
   Button,
+  TextField,
 } from "@mui/material";
+import { useFormik } from "formik";
 import { useTranslations } from "next-intl";
+import { useState } from "react";
 
 const ConfirmForm = ({ open, handleClose, rowId, confirmData }) => {
   const t = useTranslations();
-  const handleConfirm = () => {
+  const [description, setDescription] = useState("");
-    handleClose();
+
-    confirmData(CONFIRM_TRANSPORTATION_ASSISTANCE, rowId);
+  const formik = useFormik({
+    initialValues: {
+      description: "",
+    },
+    onSubmit: () => {
+      const formData = new FormData();
+      if (description != "") formData.append("expert_description", description);
+      handleClose();
+      confirmData(CONFIRM_TRANSPORTATION_ASSISTANCE, rowId, formData);
+    },
+  });
+
+  const handleDescriptionChange = (event) => {
+    setDescription(event.target.value);
   };
+
   return (
-    <Dialog open={open} onClose={handleClose}>
+    <Dialog open={open}>
       <DialogTitle>{t("ConfirmDialog.confirm")}</DialogTitle>
       <DialogContent>
         <DialogContentText>{t("ConfirmDialog.context")}</DialogContentText>
+        <TextField
+          name="description"
+          multiline
+          rows={8}
+          placeholder={t("ConfirmDialog.description")}
+          value={description}
+          onChange={handleDescriptionChange}
+          fullWidth
+          variant="outlined"
+          sx={{ mt: 1 }}
+        />
       </DialogContent>
       <DialogActions>
-        <Button onClick={handleConfirm} color="primary">
-          {t("ConfirmDialog.button-confirm")}
-        </Button>
         <Button onClick={handleClose} color="secondary" autoFocus>
           {t("ConfirmDialog.button-cancel")}
         </Button>
+        <Button onClick={formik.handleSubmit} color="primary">
+          {t("ConfirmDialog.button-confirm")}
+        </Button>
       </DialogActions>
     </Dialog>
   );

src/components/dashboard/transportation-assistance/Form/RejectForm.jsx

@@ -56,7 +56,7 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
     }
   };
   return (
-    <Dialog open={open} onClose={handleClose}>
+    <Dialog open={open}>
       <DialogTitle>{t("RejectDialog.reject")}</DialogTitle>
       <DialogContent>
         <DialogContentText>{t("RejectDialog.context")}</DialogContentText>
@@ -91,12 +91,12 @@ const RejectForm = ({ open, handleClose, rowId, rejectData }) => {
         />
       </DialogContent>
       <DialogActions>
-        <Button onClick={formik.handleSubmit} color="primary">
-          {t("RejectDialog.button-reject")}
-        </Button>
         <Button onClick={handleClose} color="secondary" autoFocus>
           {t("RejectDialog.button-cancel")}
         </Button>
+        <Button onClick={formik.handleSubmit} color="primary">
+          {t("RejectDialog.button-reject")}
+        </Button>
       </DialogActions>
     </Dialog>
   );

src/components/dashboard/transportation-assistance/TableRowActions.jsx

@@ -1,12 +1,15 @@
 import ThumbUpAltIcon from "@mui/icons-material/ThumbUpAlt";
 import ThumbDownIcon from "@mui/icons-material/ThumbDown";
-import { Box, IconButton } from "@mui/material";
+import { Box, IconButton, Tooltip } from "@mui/material";
 import { useContext } from "react";
 import { DataTableContext } from "@/lib/app/contexts/DataTableContext";
 import ConfirmForm from "./Form/ConfirmForm";
 import RejectForm from "./Form/RejectForm";
+import { useTranslations } from "next-intl";
 
 const TableRowActions = ({ row }) => {
+  const t = useTranslations();
+
   const {
     openConfirmDialog,
     openRejectDialog,
@@ -20,14 +23,16 @@ const TableRowActions = ({ row }) => {
   } = useContext(DataTableContext);
   return (
     <Box sx={{ display: "flex", flexWrap: "nowrap", gap: "8px" }}>
-      <IconButton
+      <Tooltip title={t("ConfirmDialog.confirm")}>
-        color="primary"
+        <IconButton
-        onClick={() => {
+          color="primary"
-          handleOpenConfirmDialog(row);
+          onClick={() => {
-        }}
+            handleOpenConfirmDialog(row);
-      >
+          }}
-        <ThumbUpAltIcon />
+        >
-      </IconButton>
+          <ThumbUpAltIcon />
+        </IconButton>
+      </Tooltip>
       {openConfirmDialog && (
         <ConfirmForm
           rowId={rowId}
@@ -36,9 +41,11 @@ const TableRowActions = ({ row }) => {
           confirmData={confirmData}
         />
       )}
-      <IconButton color="primary" onClick={() => handleOpenRejectDialog(row)}>
+      <Tooltip title={t("RejectDialog.reject")}>
-        <ThumbDownIcon />
+        <IconButton color="primary" onClick={() => handleOpenRejectDialog(row)}>
-      </IconButton>
+          <ThumbDownIcon />
+        </IconButton>
+      </Tooltip>
       {openRejectDialog && (
         <RejectForm
           rowId={rowId}

src/components/dashboard/transportation-assistance/index.jsx

@@ -177,6 +177,7 @@ function DashboardTransportationAssistanceComponent() {
         header: t("TransportationAssistance.state_name"),
         enableColumnFilter: false,
         datatype: "numeric",
+        minSize: 300,
         // filterFn: "equals",
         // filterSelectOptions: [
         // ],

src/core/components/notifications/WarningNotification.jsx

@@ -0,0 +1,41 @@
+import ReportIcon from "@mui/icons-material/Report";
+import { Box, Divider, Typography } from "@mui/material";
+import { toast } from "react-toastify";
+
+const WarningNotification = (directionApp, t, status) => {
+  toast(
+    ({ closeToast }) => (
+      <>
+        <Box
+          sx={{
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "start",
+            justifyContent: "start",
+          }}
+        >
+          <Box sx={{ display: "flex", alignItems: "center" }}>
+            <ReportIcon color="warning" sx={{ mr: 1.6 }} />
+            <Box sx={{ display: "flex", flexDirection: "column" }}>
+              <Typography color="warning.main" variant="button">
+                {t("warning")} ({t("code")}: {status})
+              </Typography>
+              <Typography variant="caption">
+                {t("warning_static_text")}
+              </Typography>
+            </Box>
+          </Box>
+        </Box>
+        <Divider sx={{ my: 1 }} />
+      </>
+    ),
+    {
+      position: directionApp === "ltr" ? "top-left" : "top-right",
+      autoClose: false,
+      closeOnClick: false,
+      draggable: false,
+    }
+  );
+};
+
+export default WarningNotification;

src/core/components/notifications/index.jsx

@@ -1,4 +1,5 @@
 import ErrorNotification from "./ErrorNotification";
+import WarningNotification from "./WarningNotification";
 import SuccessNotification from "./successNotification";
 
 const Notifications = async (directionApp, response, t) => {

src/core/utils/theme.jsx

@@ -13,6 +13,15 @@ const theme = {
       dark: "#ad3a07",
     },
   },
+  components: {
+    MuiBackdrop: {
+      styleOverrides: {
+        root: {
+          backgroundColor: "#02020226", // Replace with your desired backdrop color and opacity
+        },
+      },
+    },
+  },
 };
 
 export default theme;

src/pages/dashboard/transportation-assistance/index.jsx

@@ -6,7 +6,7 @@ import { parse } from "next-useragent";
 export default function TransportationAssistance() {
   return (
     <WithAuthMiddleware>
-      <TitlePage text="Dashboard.passenger_office_page" />
+      <TitlePage text="Dashboard.transportation_assistance" />
       <DashboardTransportationAssistanceComponent />
     </WithAuthMiddleware>
   );