From 3fb4c4a3a359b692f24d0183bbad7fd085fcb269 Mon Sep 17 00:00:00 2001
From: Mohammad Jalali <muhammad.art79@gmail.com>
Date: Mon, 24 Jul 2023 16:23:26 +0330
Subject: [PATCH] debug for lunching project

---
 public/locales/fa/app.json                  |  8 ++-
 src/components/login-navy/SendToken.jsx     | 65 +++++++++++++++++----
 src/components/login-navy/index.jsx         | 10 +++-
 src/core/components/notifications/index.jsx |  4 +-
 4 files changed, 71 insertions(+), 16 deletions(-)

diff --git a/public/locales/fa/app.json b/public/locales/fa/app.json
index 2461a38..b2b1a92 100644
--- a/public/locales/fa/app.json
+++ b/public/locales/fa/app.json
@@ -56,7 +56,10 @@
     "link_routing_main_page": "صفحه اصلی",
     "error_message_required": "اجباری!",
     "button_make_account": "ایجاد حساب",
-    "button_request_verification": "دریافت کد یکبارمصرف"
+    "button_request_verification": "دریافت کد یکبارمصرف",
+    "resend_code": "ارسال دوباره کد",
+    "Resend_code_in": "ارسال مجدد کد در",
+    "seconds_later": "ثانیه دیگر"
   },
   "RegisterPage": {
     "link_routing_back_to": "بازگشت به",
@@ -74,7 +77,8 @@
     "button_submit": "ورود",
     "button_back_to_send_data": "بازگشت",
     "sent_token_to": "ارسال کد یکبار مصرف به شماره",
-    "change_phone_number": "تغییر شماره"
+    "change_phone_number": "تغییر شماره",
+    "resend_code": "ارسال دوباره کد"
   },
   "Dashboard": {
     "dashboard_page": "داشبورد"
diff --git a/src/components/login-navy/SendToken.jsx b/src/components/login-navy/SendToken.jsx
index 26eb4f7..65acff8 100644
--- a/src/components/login-navy/SendToken.jsx
+++ b/src/components/login-navy/SendToken.jsx
@@ -1,6 +1,6 @@
 import Notifications from "@/core/components/notifications";
 import StyledForm from "@/core/components/StyledForm";
-import { LOGIN } from "@/core/data/apiRoutes";
+import { LOGIN, LOGIN_SEND_OTP_TOKEN } from "@/core/data/apiRoutes";
 import CenterLayout from "@/layouts/CenterLayout";
 import FullPageLayout from "@/layouts/FullPageLayout";
 import useDirection from "@/lib/app/hooks/useDirection";
@@ -8,22 +8,24 @@ import useUser from "@/lib/app/hooks/useUser";
 import ChangeCircleIcon from "@mui/icons-material/ChangeCircle";
 import LoginIcon from "@mui/icons-material/Login";
 import {
-    Box,
-    Button,
-    Container,
-    Grid,
-    Paper,
-    Stack,
-    TextField,
-    Typography
+  Box,
+  Button,
+  Container,
+  Grid,
+  Link,
+  Paper,
+  Stack,
+  TextField,
+  Typography,
 } from "@mui/material";
 import axios from "axios";
 import { Field, Formik } from "formik";
 import { useTranslations } from "next-intl";
 import Image from "next/image";
+import { useEffect } from "react";
 import * as Yup from "yup";
 
-const SendToken = ({ PhoneNumber, setOtpToken }) => {
+const SendToken = ({ PhoneNumber, setOtpToken, timer, setTimer }) => {
   const t = useTranslations();
   const { directionApp } = useDirection();
   const { setToken } = useUser();
@@ -55,6 +57,35 @@ const SendToken = ({ PhoneNumber, setOtpToken }) => {
       });
   };
 
+  useEffect(() => {
+    let interval;
+    if (timer > 0) {
+      interval = setInterval(() => {
+        setTimer((prevTimer) => prevTimer - 1);
+      }, 1000);
+    } else {
+      clearInterval(interval);
+    }
+
+    return () => clearInterval(interval);
+  }, [timer]);
+
+  const handleResendClick = async () => {
+    if (timer != 0) return  
+    Notifications(directionApp, t, undefined);
+    await axios
+      .post(LOGIN_SEND_OTP_TOKEN, {
+        phone_number: PhoneNumber,
+      })
+      .then(function (response) {
+        Notifications(directionApp, t, response);
+        setTimer(30);
+      })
+      .catch(function (error) {
+        Notifications(directionApp, t, error.response);
+      });
+  };
+
   return (
     <FullPageLayout sx={{ p: 1 }}>
       <CenterLayout>
@@ -90,7 +121,7 @@ const SendToken = ({ PhoneNumber, setOtpToken }) => {
                         }}
                       >
                         <Typography variant="button">
-                          {t("RegisterPage.sent_token_to")}: {PhoneNumber}{" "}
+                          {t("RegisterPage.sent_token_to")}: {PhoneNumber}
                         </Typography>
                         <Button
                           size="small"
@@ -137,6 +168,18 @@ const SendToken = ({ PhoneNumber, setOtpToken }) => {
                           </Button>
                         </Grid>
                       </Grid>
+                      <Typography
+                        variant={"button"}
+                        sx={{ cursor: "pointer", textAlign: "center" }}
+                        onClick={handleResendClick}
+                        underline="hover"
+                      >
+                        {timer > 0
+                          ? `${t("LoginPage.Resend_code_in")}: ${timer} ${t(
+                              "LoginPage.seconds_later"
+                            )}`
+                          : t("LoginPage.resend_code")}
+                      </Typography>
                     </Stack>
                   </StyledForm>
                 </Stack>
diff --git a/src/components/login-navy/index.jsx b/src/components/login-navy/index.jsx
index 2ea750f..957fcf5 100644
--- a/src/components/login-navy/index.jsx
+++ b/src/components/login-navy/index.jsx
@@ -5,6 +5,7 @@ import SendToken from "./SendToken";
 const LoginComponent = () => {
   const [otpToken, setOtpToken] = useState(false);
   const [PhoneNumber, setPhoneNumber] = useState("");
+  const [timer, setTimer] = useState(30);
 
   if (!otpToken) {
     return (
@@ -15,7 +16,14 @@ const LoginComponent = () => {
       />
     );
   } else {
-    return <SendToken PhoneNumber={PhoneNumber} setOtpToken={setOtpToken} />;
+    return (
+      <SendToken
+        PhoneNumber={PhoneNumber}
+        setOtpToken={setOtpToken}
+        timer={timer}
+        setTimer={setTimer}
+      />
+    );
   }
 };
 
diff --git a/src/core/components/notifications/index.jsx b/src/core/components/notifications/index.jsx
index 9e8e52b..e3432c5 100644
--- a/src/core/components/notifications/index.jsx
+++ b/src/core/components/notifications/index.jsx
@@ -1,7 +1,7 @@
 import { toast } from "react-toastify";
 import ErrorNotification from "./ErrorNotification";
-import SuccessNotification from "./successNotification";
-import WarningNotification from "./warningNotification";
+import SuccessNotification from "./SuccessNotification";
+import WarningNotification from "./WarningNotification";
 
 const Notifications = async (directionApp, t, response) => {
   console.log(directionApp, t, response);