Merge branch 'feature/bring_dependencies' into 'develop'

Feature/bring dependencies

See merge request witel3/loan-facilities-user!6

public/locales/fa/app.json

@@ -8,6 +8,7 @@
   "register_navy": "ثبت نام اعضای ناوگان",
   "login_welfare_services": "ورود اعضای خدمات رفاهی",
   "register_welfare_services": "ثبت نام اعضای خدمات رفاهی",
+  "pending": "درحال اجرا...",
   "user_navy": "ناوگان",
   "header": {
     "open_profile": "پروفایل",
@@ -15,6 +16,13 @@
     "change_password": "تغییر رمز عبور",
     "logout": "خروج"
   },
+  "notifications": {
+    "error_static_text": "عملیات با خطا مواجه شد",
+    "success_static_text": "عملیات با موفقیت انجام شد",
+    "code": "کد",
+    "success": "موفق",
+    "error": "خطا"
+  },
   "Titles": {
     "title_login_page": "صفحه ورود",
     "title_login_navy_page": "ورود اعضای ناوگان",

src/components/first/index.jsx

@@ -25,7 +25,7 @@ const FirstComponent = () => {
         </Typography>
         {isAuth ? (
           <Button
-            variant="outlined"
+            variant="contained"
             component={NextLinkComposed}
             to={{
               pathname: "/dashboard",

src/components/login-navy/SendUserData.jsx

@@ -1,5 +1,5 @@
-// import Notifications from "@/core/components/notifications";
 import LinkRouting from "@/core/components/LinkRouting";
+import Notifications from "@/core/components/notifications";
 import StyledForm from "@/core/components/StyledForm";
 import { LOGIN_SEND_OTP_TOKEN } from "@/core/data/apiRoutes";
 import CenterLayout from "@/layouts/CenterLayout";
@@ -8,14 +8,14 @@ import useDirection from "@/lib/app/hooks/useDirection";
 import FingerprintIcon from "@mui/icons-material/Fingerprint";
 import PersonAddIcon from "@mui/icons-material/PersonAdd";
 import {
-    Box,
-    Button,
-    Container,
-    Grid,
-    Paper,
-    Stack,
-    TextField,
-    Typography
+  Box,
+  Button,
+  Container,
+  Grid,
+  Paper,
+  Stack,
+  TextField,
+  Typography
 } from "@mui/material";
 import axios from "axios";
 import { Field, Formik } from "formik";
@@ -39,16 +39,18 @@ const SendUserData = ({ setOtpToken, setPhoneNumber }) => {
   });
 
   const handleSubmit = async (values, props) => {
+    Notifications(directionApp, t, undefined);
     await axios
       .post(LOGIN_SEND_OTP_TOKEN, {
         phone_number: values.phone_number,
       })
       .then(function (response) {
+        Notifications(directionApp, t, response);
         setPhoneNumber(values.phone_number);
         setOtpToken(true);
       })
       .catch(function (error) {
-        // Notifications(directionApp, error.response, t);
+        Notifications(directionApp, t, error.response);
         props.setSubmitting(false);
       });
   };

src/core/components/notifications/ErrorNotification.jsx

@@ -0,0 +1,40 @@
+import DangerousIcon from "@mui/icons-material/Dangerous";
+import { Box, Typography } from "@mui/material";
+import { toast } from "react-toastify";
+
+const ErrorNotification = (directionApp, t, status, message) => {
+  toast(
+    ({ closeToast }) => (
+      <>
+        <Box
+          sx={{
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "start",
+            justifyContent: "start",
+          }}
+        >
+          <Box sx={{ display: "flex", alignItems: "center" }}>
+            <DangerousIcon color="error" sx={{ mr: 1.6 }} />
+            <Box sx={{ display: "flex", flexDirection: "column" }}>
+              <Typography color="error" variant="button">
+                {t("notifications.error")} ({t("notifications.code")}: {status})
+              </Typography>
+              <Typography variant="caption">
+                {message || t("notifications.error_static_text")}
+              </Typography>
+            </Box>
+          </Box>
+        </Box>
+      </>
+    ),
+    {
+      position: directionApp === "ltr" ? "top-left" : "top-right",
+      autoClose: false,
+      closeOnClick: false,
+      draggable: false,
+    }
+  );
+};
+
+export default ErrorNotification;

src/core/components/notifications/SuccessNotification.jsx

@@ -0,0 +1,43 @@
+import BeenhereIcon from "@mui/icons-material/Beenhere";
+import { Box, Typography } from "@mui/material";
+import { toast } from "react-toastify";
+
+const SuccessNotification = (directionApp, t, status) => {
+  toast(
+    () => (
+      <>
+        <Box
+          sx={{
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "start",
+            justifyContent: "start",
+          }}
+        >
+          <Box sx={{ display: "flex", alignItems: "center" }}>
+            <BeenhereIcon color="success" sx={{ mr: 1.6 }} />
+            <Box sx={{ display: "flex", flexDirection: "column" }}>
+              <Typography color="success.main" variant="button">
+                {t("notifications.success")} ({t("notifications.code")}:{" "}
+                {status})
+              </Typography>
+              <Typography variant="caption">
+                {t("notifications.success_static_text")}
+              </Typography>
+            </Box>
+          </Box>
+        </Box>
+      </>
+    ),
+    {
+      position: directionApp === "ltr" ? "top-left" : "top-right",
+      autoClose: 3000,
+      hideProgressBar: true,
+      pauseOnHover: true,
+      closeOnClick: false,
+      draggable: true,
+    }
+  );
+};
+
+export default SuccessNotification;

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

@@ -0,0 +1,56 @@
+import { toast } from "react-toastify";
+import ErrorNotification from "./ErrorNotification";
+import SuccessNotification from "./successNotification";
+import WarningNotification from "./warningNotification";
+
+const Notifications = async (directionApp, t, response) => {
+  console.log(directionApp, t, response);
+  const { status, data } = response != undefined ? response : ""
+  toast.dismiss();
+  switch (status) {
+    case 200:
+      SuccessNotification(directionApp, t, status);
+      break;
+    case 400:
+      ErrorNotification(directionApp, t,status);
+      break;
+    case 401:
+      ErrorNotification(directionApp, t, status);
+      break;
+    case 403:
+      ErrorNotification(directionApp, t, status);
+      break;
+    case 422:
+      ErrorNotification(directionApp, t, status, data.message);
+      break;
+    case 500:
+      WarningNotification(directionApp, t, status);
+      break;
+    case 503:
+      WarningNotification(directionApp, t, status);
+      break;
+    case 504:
+      WarningNotification(directionApp, t, status);
+      break;
+    default:
+      toast(t("pending"), {
+        position: directionApp === "ltr" ? "top-left" : "top-right",
+        autoClose: false,
+        closeOnClick: false,
+        draggable: false,
+      });
+      break;
+  }
+};
+
+export default Notifications;
+
+/* 
+usage document
+
+** for pending use ( Notifications(directionApp, t, undefined) ) this before your request.
+** for success use ( Notifications(directionApp, t, response) ) this inside .then() of your request.
+** for Error and Warning use ( Notifications(directionApp, t, error.response) ) this inside .catche() of your request.
+
+end usage document
+*/