redesign and make more flexible login register system

public/locales/fa/app.json

@@ -4,14 +4,16 @@
   "dashboard": "داشبورد",
   "first_page": "خوش آمدید",
   "login": "ورود",
-  "login_navy": "ورود اعضای ناوگان",
+  "login_user_panel": "ورود به پنل کاربران",
   "register_navy": "ثبت نام اعضای ناوگان",
-  "login_welfare_services": "ورود اعضای خدمات رفاهی",
   "register_welfare_services": "ثبت نام اعضای خدمات رفاهی",
   "pending": "درحال اجرا...",
   "user_navy": "ناوگان",
   "page_not_found": "صفحه مورد نظر یافت نشد",
   "delete": "حذف",
+  "resend_code": "ارسال مجدد کد",
+  "Resend_code_in": "ارسال مجدد کد در",
+  "seconds_later": "ثانیه دیگر",
   "header": {
     "open_profile": "پروفایل",
     "edit_profile": "ویرایش پروفایل",
@@ -27,6 +29,7 @@
   },
   "Titles": {
     "title_login_page": "صفحه ورود",
+    "title_register_page": "صفحه ثبت نام",
     "title_login_navy_page": "ورود اعضای ناوگان",
     "title_login_welfare_services_page": "ورود اعضای خدمات رفاهی",
     "title_register_navy_page": "ثبت نام اعضای ناوگان",
@@ -57,13 +60,13 @@
     "error_message_required": "اجباری!",
     "button_make_account": "ایجاد حساب",
     "button_request_verification": "دریافت کد یکبارمصرف",
-    "resend_code": "ارسال دوباره کد",
+    "sent_token_to": "ارسال کد یکبار مصرف به شماره",
-    "Resend_code_in": "ارسال مجدد کد در",
+    "change_phone_number": "تغییر شماره"
-    "seconds_later": "ثانیه دیگر"
   },
   "RegisterPage": {
     "link_routing_back_to": "بازگشت به",
-    "link_routing_login_navy": "صفحه ورود",
+    "link_routing_register": "صفحه انتخاب نوع ثبت نام",
+    "link_routing_login": "صفحه ورود",
     "text_field_phone_number": "شماره تلفن",
     "text_field_enter_your_phone_number": "شماره تلفن خود را وارد کنید",
     "text_field_verification_code": "کد یکبار مصرف",
@@ -74,11 +77,11 @@
     "text_field_enter_your_navgan_id": "شماره ناوگان خود را وارد کنید",
     "error_message_required": "اجباری!",
     "button_request_verification": "دریافت کد یکبارمصرف",
-    "button_submit": "ورود",
+    "button_submit": "ثبت و ورود",
     "button_back_to_send_data": "بازگشت",
     "sent_token_to": "ارسال کد یکبار مصرف به شماره",
     "change_phone_number": "تغییر شماره",
-    "resend_code": "ارسال دوباره کد"
+    "complete_information": "مشخصات"
   },
   "Dashboard": {
     "dashboard_page": "داشبورد"

src/components/first/index.jsx

@@ -4,7 +4,7 @@ import StyledImage from "@/core/components/StyledImage";
 import CenterLayout from "@/layouts/CenterLayout";
 import FullPageLayout from "@/layouts/FullPageLayout";
 import useUser from "@/lib/app/hooks/useUser";
-import { Box, Button, Grid, Typography } from "@mui/material";
+import { Button, Typography } from "@mui/material";
 import { useTranslations } from "next-intl";
 
 const FirstComponent = () => {
@@ -35,43 +35,17 @@ const FirstComponent = () => {
             {t("dashboard")}
           </Button>
         ) : (
-          <Box>
+          <Button
-            <Grid
+            sx={{ whiteSpace: "nowrap" }}
-              container
+            variant="contained"
-              rowSpacing={{ xs: 1, sm: 0 }}
+            size="large"
-              sx={{
+            component={NextLinkComposed}
-                flexDirection: { xs: "column", sm: "row" },
+            to={{
-                alignItems: "center",
+              pathname: "/login",
-              }}
+            }}
-            >
+          >
-              <Grid item xs={12} sm={6} sx={{ px: { xs: 0, sm: 1 } }}>
+            {t("login_user_panel")}
-                <Button
+          </Button>
-                  sx={{ whiteSpace: "nowrap" }}
-                  variant="contained"
-                  size="large"
-                  component={NextLinkComposed}
-                  to={{
-                    pathname: "/login-navy",
-                  }}
-                >
-                  {t("login_navy")}
-                </Button>
-              </Grid>
-              <Grid item xs={12} sm={6} sx={{ px: { xs: 0, sm: 1 } }}>
-                <Button
-                  sx={{ whiteSpace: "nowrap" }}
-                  variant="contained"
-                  size="large"
-                  component={NextLinkComposed}
-                  to={{
-                    pathname: "/login-welfare-services",
-                  }}
-                >
-                  {t("login_welfare_services")}
-                </Button>
-              </Grid>
-            </Grid>
-          </Box>
         )}
       </CenterLayout>
     </FullPageLayout>

src/components/login-welfare-services/SendUserData.jsx

@@ -1,166 +0,0 @@
-import Notifications from "@/core/components/notifications";
-import LinkRouting from "@/core/components/LinkRouting";
-import StyledForm from "@/core/components/StyledForm";
-import { 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";
-import FingerprintIcon from "@mui/icons-material/Fingerprint";
-import PersonAddIcon from "@mui/icons-material/PersonAdd";
-import {
-  Box,
-  Button,
-  Container,
-  Grid,
-  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 { useSearchParams } from "next/navigation";
-import * as Yup from "yup";
-
-const SendUserData = ({ setOtpToken, setPhoneNumber, PhoneNumber }) => {
-  const t = useTranslations();
-  const { directionApp } = useDirection();
-
-  const searchParams = useSearchParams();
-  const backUrlDecodedPath = searchParams.get("back_url");
-
-  const initialValues = {
-    phone_number: PhoneNumber,
-  };
-  const validationSchema = Yup.object().shape({
-    phone_number: Yup.string().required(t("LoginPage.error_message_required")),
-  });
-
-  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, t, error.response);
-        props.setSubmitting(false);
-      });
-  };
-
-  return (
-    <FullPageLayout sx={{ p: 1 }}>
-      <CenterLayout>
-        <Container maxWidth="sm">
-          <Paper elevation={0}>
-            <Formik
-              initialValues={initialValues}
-              onSubmit={handleSubmit}
-              validationSchema={validationSchema}
-            >
-              {(props) => (
-                <Stack spacing={2} sx={{ p: 2 }}>
-                  <Box
-                    sx={{ position: "relative", width: "100%", height: 200 }}
-                  >
-                    <Image
-                      fill
-                      src="/images/login.svg"
-                      priority
-                      alt={t("app_name")}
-                    />
-                  </Box>
-                  <Typography margin={2} variant="h4" textAlign="center">
-                    {t("login_welfare_services")}
-                  </Typography>
-                  <StyledForm sx={{ width: "100%" }}>
-                    <Stack spacing={3} sx={{ p: 2 }}>
-                      <Field
-                        as={TextField}
-                        name="phone_number"
-                        variant="outlined"
-                        label={t("LoginPage.text_field_phone_number")}
-                        placeholder={t(
-                          "LoginPage.text_field_enter_your_phone_number"
-                        )}
-                        type={"text"}
-                        error={
-                          props.touched.phone_number &&
-                          props.errors.phone_number
-                            ? true
-                            : false
-                        }
-                        fullWidth
-                        helperText={
-                          props.touched.phone_number
-                            ? props.errors.phone_number
-                            : null
-                        }
-                      />
-                      <Grid
-                        container
-                        rowSpacing={{ xs: 1, sm: 0 }}
-                        sx={{
-                          flexDirection: { xs: "column-reverse", sm: "row" },
-                        }}
-                      >
-                        <Grid item xs={12} sm={6} sx={{ pr: { xs: 0, sm: 1 } }}>
-                          <LinkRouting href={"/register-welfare-services"}>
-                            <Button
-                              fullWidth
-                              type="submit"
-                              variant="outlined"
-                              size="large"
-                              endIcon={<PersonAddIcon />}
-                              disabled={props.isSubmitting ? true : false}
-                            >
-                              {t("LoginPage.button_make_account")}
-                            </Button>
-                          </LinkRouting>
-                        </Grid>
-                        <Grid item xs={12} sm={6} sx={{ pl: { xs: 0, sm: 1 } }}>
-                          <Button
-                            fullWidth
-                            type="submit"
-                            variant="contained"
-                            size="large"
-                            endIcon={<FingerprintIcon />}
-                            disabled={props.isSubmitting ? true : false}
-                          >
-                            {t("LoginPage.button_request_verification")}
-                          </Button>
-                        </Grid>
-                      </Grid>
-                    </Stack>
-                  </StyledForm>
-                </Stack>
-              )}
-            </Formik>
-          </Paper>
-        </Container>
-      </CenterLayout>
-      <Stack direction="row" alignItems="center" justifyContent="center">
-        <LinkRouting
-          sx={{ margin: 2 }}
-          href={
-            backUrlDecodedPath ? decodeURIComponent(backUrlDecodedPath) : "/"
-          }
-        >
-          {t("LoginPage.link_routing_back_to")}{" "}
-          {backUrlDecodedPath
-            ? t("LoginPage.link_routing_previuos_page")
-            : t("LoginPage.link_routing_main_page")}
-        </LinkRouting>
-      </Stack>
-    </FullPageLayout>
-  );
-};
-
-export default SendUserData;

src/components/login-welfare-services/index.jsx

@@ -1,22 +0,0 @@
-import SendUserData from "./SendUserData";
-import { useState } from "react";
-import SendToken from "./sendToken";
-
-const LoginComponent = () => {
-  const [otpToken, setOtpToken] = useState(false);
-  const [PhoneNumber, setPhoneNumber] = useState("");
-
-  if (!otpToken) {
-    return (
-      <SendUserData
-        setOtpToken={setOtpToken}
-        setPhoneNumber={setPhoneNumber}
-        PhoneNumber={PhoneNumber}
-      />
-    );
-  } else {
-    return <SendToken PhoneNumber={PhoneNumber} setOtpToken={setOtpToken} />;
-  }
-};
-
-export default LoginComponent;

src/components/login-welfare-services/sendToken.jsx

@@ -1,152 +0,0 @@
-import Notifications from "@/core/components/notifications";
-import StyledForm from "@/core/components/StyledForm";
-import { LOGIN } from "@/core/data/apiRoutes";
-import CenterLayout from "@/layouts/CenterLayout";
-import FullPageLayout from "@/layouts/FullPageLayout";
-import useDirection from "@/lib/app/hooks/useDirection";
-import useUser from "@/lib/app/hooks/useUser";
-import LoginIcon from "@mui/icons-material/Login";
-import ChangeCircleIcon from "@mui/icons-material/ChangeCircle";
-import {
-  Box,
-  Button,
-  Container,
-  Grid,
-  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 * as Yup from "yup";
-
-const SendToken = ({ PhoneNumber, setOtpToken }) => {
-  const t = useTranslations();
-  const { directionApp } = useDirection();
-  const { setToken } = useUser();
-
-  const initialValues = {
-    phone_number: PhoneNumber,
-    verification_code: "",
-  };
-  const validationSchema = Yup.object().shape({
-    verification_code: Yup.string().required(
-      t("LoginPage.error_message_required")
-    ),
-  });
-
-  const handleSubmit = async (values, props) => {
-    Notifications(directionApp, t, undefined);
-    await axios
-      .post(LOGIN, {
-        phone_number: values.phone_number,
-        verification_code: values.verification_code,
-      })
-      .then(function (response) {
-        Notifications(directionApp, t, response);
-        setToken(response.data.token);
-      })
-      .catch(function (error) {
-        Notifications(directionApp, t, error.response);
-        props.setSubmitting(false);
-      });
-  };
-
-  return (
-    <FullPageLayout sx={{ p: 1 }}>
-      <CenterLayout>
-        <Container maxWidth="sm">
-          <Paper elevation={0}>
-            <Formik
-              initialValues={initialValues}
-              onSubmit={handleSubmit}
-              validationSchema={validationSchema}
-            >
-              {(props) => (
-                <Stack spacing={2} sx={{ p: 2 }}>
-                  <Box
-                    sx={{ position: "relative", width: "100%", height: 200 }}
-                  >
-                    <Image
-                      fill
-                      src="/images/login.svg"
-                      priority
-                      alt={t("app_name")}
-                    />
-                  </Box>
-                  <Typography margin={2} variant="h4" textAlign="center">
-                    {t("login_welfare_services")}
-                  </Typography>
-                  <StyledForm sx={{ width: "100%" }}>
-                    <Stack spacing={3} sx={{ p: 2 }}>
-                      <Box
-                        sx={{
-                          display: "flex",
-                          alignItems: "center",
-                          justifyContent: "space-between",
-                        }}
-                      >
-                        <Typography variant="button">
-                          {t("RegisterPage.sent_token_to")}: {PhoneNumber}{" "}
-                        </Typography>
-                        <Button
-                          size="small"
-                          startIcon={<ChangeCircleIcon />}
-                          variant="outlined"
-                          onClick={() => setOtpToken(false)}
-                        >
-                          {t("RegisterPage.change_phone_number")}
-                        </Button>
-                      </Box>
-                      <Field
-                        as={TextField}
-                        name="verification_code"
-                        variant="outlined"
-                        label={t("LoginPage.text_field_verification_code")}
-                        placeholder={t(
-                          "LoginPage.text_field_enter_your_verification_code"
-                        )}
-                        type={"text"}
-                        error={
-                          props.touched.verification_code &&
-                          props.errors.verification_code
-                            ? true
-                            : false
-                        }
-                        fullWidth
-                        helperText={
-                          props.touched.verification_code
-                            ? props.errors.verification_code
-                            : null
-                        }
-                      />
-                      <Grid container>
-                        <Grid item xs={12}>
-                          <Button
-                            fullWidth
-                            type="submit"
-                            variant="contained"
-                            size="large"
-                            endIcon={<LoginIcon />}
-                            disabled={props.isSubmitting ? true : false}
-                          >
-                            {t("LoginPage.button_submit")}
-                          </Button>
-                        </Grid>
-                      </Grid>
-                    </Stack>
-                  </StyledForm>
-                </Stack>
-              )}
-            </Formik>
-          </Paper>
-        </Container>
-      </CenterLayout>
-    </FullPageLayout>
-  );
-};
-
-export default SendToken;

src/components/login/SendToken.jsx

@@ -12,10 +12,11 @@ import {
   Box,
   Button,
   Container,
-  Grid, Paper,
+  Grid,
+  Paper,
   Stack,
   TextField,
-  Typography
+  Typography,
 } from "@mui/material";
 import axios from "axios";
 import { Field, Formik } from "formik";
@@ -84,27 +85,29 @@ const SendToken = ({
                     />
                   </Box>
                   <Typography margin={2} variant="h4" textAlign="center">
-                    {t("login_navy")}
+                    {t("login")}
                   </Typography>
                   <StyledForm sx={{ width: "100%" }}>
                     <Stack spacing={3} sx={{ p: 2 }}>
                       <Box
                         sx={{
-                          display: "flex",
+                          display: { xs: "column", sm: "flex" },
                           alignItems: "center",
+                          textAlign: { xs: "center", sm: "unset" },
                           justifyContent: "space-between",
                         }}
                       >
-                        <Typography variant="button">
+                        <Typography variant="button" sx={{ display: "block" }}>
-                          {t("RegisterPage.sent_token_to")}: {PhoneNumber}
+                          {t("LoginPage.sent_token_to")}: {PhoneNumber}
                         </Typography>
                         <Button
                           size="small"
                           startIcon={<ChangeCircleIcon />}
                           variant="outlined"
                           onClick={() => setOtpToken(false)}
+                          sx={{ whiteSpace: "nowrap", my: { xs: 1, sm: 0 } }}
                         >
-                          {t("RegisterPage.change_phone_number")}
+                          {t("LoginPage.change_phone_number")}
                         </Button>
                       </Box>
                       <Field

src/components/login/SendUserData.jsx

@@ -1,7 +1,7 @@
 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 { SEND_OTP_TOKEN } from "@/core/data/apiRoutes";
 import CenterLayout from "@/layouts/CenterLayout";
 import FullPageLayout from "@/layouts/FullPageLayout";
 import useDirection from "@/lib/app/hooks/useDirection";
@@ -47,7 +47,7 @@ const SendUserData = ({
   const handleSubmit = async (values, props) => {
     Notifications(directionApp, t, undefined);
     await axios
-      .post(LOGIN_SEND_OTP_TOKEN, {
+      .post(SEND_OTP_TOKEN, {
         phone_number: values.phone_number,
       })
       .then(function (response) {
@@ -85,7 +85,7 @@ const SendUserData = ({
                     />
                   </Box>
                   <Typography margin={2} variant="h4" textAlign="center">
-                    {t("login_navy")}
+                    {t("Titles.title_login_page")}
                   </Typography>
                   <StyledForm sx={{ width: "100%" }}>
                     <Stack spacing={3} sx={{ p: 2 }}>
@@ -119,7 +119,7 @@ const SendUserData = ({
                         }}
                       >
                         <Grid item xs={12} sm={6} sx={{ pr: { xs: 0, sm: 1 } }}>
-                          <LinkRouting href={"/register-navy"}>
+                          <LinkRouting href={"/register"}>
                             <Button
                               fullWidth
                               type="submit"

src/components/login/index.jsx

@@ -1,6 +1,6 @@
-import SendUserData from "./SendUserData";
 import { useState } from "react";
 import SendToken from "./SendToken";
+import SendUserData from "./SendUserData";
 
 const LoginComponent = () => {
   const [otpToken, setOtpToken] = useState(false);

src/components/register-navy/SendToken.jsx

@@ -1,160 +0,0 @@
-import LinkRouting from "@/core/components/LinkRouting";
-import Notifications from "@/core/components/notifications";
-import StyledForm from "@/core/components/StyledForm";
-import { REGISTER } from "@/core/data/apiRoutes";
-import CenterLayout from "@/layouts/CenterLayout";
-import FullPageLayout from "@/layouts/FullPageLayout";
-import useDirection from "@/lib/app/hooks/useDirection";
-import useUser from "@/lib/app/hooks/useUser";
-import LoginIcon from "@mui/icons-material/Login";
-import ChangeCircleIcon from "@mui/icons-material/ChangeCircle";
-import {
-  Box,
-  Button,
-  Container,
-  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 * as Yup from "yup";
-
-const SendToken = ({
-  PhoneNumber,
-  nationalId,
-  navganId,
-  typeId,
-  setOtpToken,
-}) => {
-  const t = useTranslations();
-  const { directionApp } = useDirection();
-  const { setToken } = useUser();
-
-  const initialValues = {
-    phone_number: PhoneNumber,
-    national_id: nationalId,
-    navgan_id: navganId,
-    type_id: typeId,
-    verification_code: "",
-  };
-  const validationSchema = Yup.object().shape({
-    verification_code: Yup.string().required(
-      t("RegisterPage.error_message_required")
-    ),
-  });
-
-  const handleSubmit = async (values, props) => {
-    Notifications(directionApp, t, undefined);
-    await axios
-      .post(REGISTER, {
-        phone_number: values.phone_number,
-        national_id: values.national_id,
-        navgan_id: values.navgan_id,
-        type_id: values.type_id,
-        verification_code: values.verification_code,
-      })
-      .then(function (response) {
-        Notifications(directionApp, t, response);
-        setToken(response.data.token);
-      })
-      .catch(function (error) {
-        Notifications(directionApp, t, error.response);
-        props.setSubmitting(false);
-      });
-  };
-
-  return (
-    <FullPageLayout sx={{ p: 1 }}>
-      <CenterLayout>
-        <Container maxWidth="sm">
-          <Paper elevation={0}>
-            <Formik
-              initialValues={initialValues}
-              onSubmit={handleSubmit}
-              validationSchema={validationSchema}
-            >
-              {(props) => (
-                <Stack spacing={2} sx={{ p: 2 }}>
-                  <Box
-                    sx={{ position: "relative", width: "100%", height: 200 }}
-                  >
-                    <Image
-                      fill
-                      src="/images/register.svg"
-                      alt={t("app_name")}
-                      priority
-                    />
-                  </Box>
-                  <Typography margin={2} variant="h4" textAlign="center">
-                    {t("register_navy")}
-                  </Typography>
-                  <StyledForm sx={{ width: "100%" }}>
-                    <Stack spacing={3} sx={{ p: 2 }}>
-                      <Box
-                        sx={{
-                          display: "flex",
-                          alignItems: "center",
-                          justifyContent: "space-between",
-                        }}
-                      >
-                        <Typography variant="button">
-                          {t("RegisterPage.sent_token_to")}: {PhoneNumber}{" "}
-                        </Typography>
-                        <Button
-                          size="small"
-                          startIcon={<ChangeCircleIcon />}
-                          variant="outlined"
-                          onClick={() => setOtpToken(false)}
-                        >
-                          {t("RegisterPage.change_phone_number")}
-                        </Button>
-                      </Box>
-                      <Field
-                        as={TextField}
-                        name="verification_code"
-                        variant="outlined"
-                        label={t("RegisterPage.text_field_verification_code")}
-                        placeholder={t(
-                          "RegisterPage.text_field_enter_your_verification_code"
-                        )}
-                        type={"text"}
-                        error={
-                          props.touched.verification_code &&
-                          props.errors.verification_code
-                            ? true
-                            : false
-                        }
-                        fullWidth
-                        helperText={
-                          props.touched.verification_code
-                            ? props.errors.verification_code
-                            : null
-                        }
-                      />
-                      <Button
-                        fullWidth
-                        type="submit"
-                        variant="contained"
-                        size="large"
-                        endIcon={<LoginIcon />}
-                        disabled={props.isSubmitting ? true : false}
-                      >
-                        {t("RegisterPage.button_submit")}
-                      </Button>
-                    </Stack>
-                  </StyledForm>
-                </Stack>
-              )}
-            </Formik>
-          </Paper>
-        </Container>
-      </CenterLayout>
-    </FullPageLayout>
-  );
-};
-
-export default SendToken;

src/components/register-navy/index.jsx

@@ -1,38 +0,0 @@
-import { useState } from "react";
-import SendToken from "./SendToken";
-import SendUserData from "./SendUserData";
-
-const RegisterNavyComponent = () => {
-  const [otpToken, setOtpToken] = useState(false);
-  const [PhoneNumber, setPhoneNumber] = useState("");
-  const [nationalId, setNationalId] = useState("");
-  const [navganId, setNavganId] = useState("");
-  const [typeId, setTypeId] = useState("");
-
-  if (!otpToken) {
-    return (
-      <SendUserData
-        setOtpToken={setOtpToken}
-        setPhoneNumber={setPhoneNumber}
-        setNationalId={setNationalId}
-        setNavganId={setNavganId}
-        setTypeId={setTypeId}
-        PhoneNumber={PhoneNumber}
-        nationalId={nationalId}
-        navganId={navganId}
-      />
-    );
-  } else {
-    return (
-      <SendToken
-        PhoneNumber={PhoneNumber}
-        nationalId={nationalId}
-        navganId={navganId}
-        typeId={typeId}
-        setOtpToken={setOtpToken}
-      />
-    );
-  }
-};
-
-export default RegisterNavyComponent;

src/components/register-welfare-services/index.jsx

@@ -1,34 +0,0 @@
-import { useState } from "react";
-import SendToken from "./sendToken";
-import SendUserData from "./SendUserData";
-
-const RegisterNavyComponent = () => {
-  const [otpToken, setOtpToken] = useState(false);
-  const [PhoneNumber, setPhoneNumber] = useState("");
-  const [nationalId, setNationalId] = useState("");
-  const [typeId, setTypeId] = useState("");
-
-  if (!otpToken) {
-    return (
-      <SendUserData
-        setOtpToken={setOtpToken}
-        setPhoneNumber={setPhoneNumber}
-        setNationalId={setNationalId}
-        setTypeId={setTypeId}
-        PhoneNumber={PhoneNumber}
-        nationalId={nationalId}
-      />
-    );
-  } else {
-    return (
-      <SendToken
-        PhoneNumber={PhoneNumber}
-        nationalId={nationalId}
-        typeId={typeId}
-        setOtpToken={setOtpToken}
-      />
-    );
-  }
-};
-
-export default RegisterNavyComponent;

src/components/register/RequestOtp.jsx

@@ -1,7 +1,7 @@
 import LinkRouting from "@/core/components/LinkRouting";
 import Notifications from "@/core/components/notifications";
 import StyledForm from "@/core/components/StyledForm";
-import { REGISTER_SEND_OTP_TOKEN } from "@/core/data/apiRoutes";
+import { SEND_OTP_TOKEN } from "@/core/data/apiRoutes";
 import CenterLayout from "@/layouts/CenterLayout";
 import FullPageLayout from "@/layouts/FullPageLayout";
 import useDirection from "@/lib/app/hooks/useDirection";
@@ -22,13 +22,12 @@ import Image from "next/image";
 import { useSearchParams } from "next/navigation";
 import * as Yup from "yup";
 
-const SendUserData = ({
+const RequestOtp = ({
   setOtpToken,
   setPhoneNumber,
-  setNationalId,
-  setTypeId,
   PhoneNumber,
-  nationalId,
+  setTimer,
+  initialTimerValue,
 }) => {
   const t = useTranslations();
   const { directionApp } = useDirection();
@@ -37,33 +36,25 @@ const SendUserData = ({
   const backUrlDecodedPath = searchParams.get("back_url");
 
   const initialValues = {
-    type_id: "2",
     phone_number: PhoneNumber,
-    national_id: nationalId,
   };
   const validationSchema = Yup.object().shape({
     phone_number: Yup.string().required(
       t("RegisterPage.error_message_required")
     ),
-    national_id: Yup.string().required(
-      t("RegisterPage.error_message_required")
-    ),
   });
 
   const handleSubmit = async (values, props) => {
     Notifications(directionApp, t, undefined);
     await axios
-      .post(REGISTER_SEND_OTP_TOKEN, {
+      .post(SEND_OTP_TOKEN, {
-        type_id: values.type_id,
-        national_id: values.national_id,
         phone_number: values.phone_number,
       })
       .then(function (response) {
         Notifications(directionApp, t, response);
         setPhoneNumber(values.phone_number);
-        setNationalId(values.national_id);
-        setTypeId(values.type_id);
         setOtpToken(true);
+        setTimer(initialTimerValue);
       })
       .catch(function (error) {
         Notifications(directionApp, t, error.response);
@@ -88,13 +79,13 @@ const SendUserData = ({
                   >
                     <Image
                       fill
-                      src="/images/register.svg"
+                      src="/images/login.svg"
-                      alt={t("app_name")}
                       priority
+                      alt={t("app_name")}
                     />
                   </Box>
                   <Typography margin={2} variant="h4" textAlign="center">
-                    {t("register_welfare_services")}
+                    {t("Titles.title_register_page")}
                   </Typography>
                   <StyledForm sx={{ width: "100%" }}>
                     <Stack spacing={3} sx={{ p: 2 }}>
@@ -120,27 +111,6 @@ const SendUserData = ({
                             : null
                         }
                       />
-                      <Field
-                        as={TextField}
-                        name="national_id"
-                        variant="outlined"
-                        label={t("RegisterPage.text_field_national_id")}
-                        placeholder={t(
-                          "RegisterPage.text_field_enter_your_national_id"
-                        )}
-                        type={"text"}
-                        error={
-                          props.touched.national_id && props.errors.national_id
-                            ? true
-                            : false
-                        }
-                        fullWidth
-                        helperText={
-                          props.touched.national_id
-                            ? props.errors.national_id
-                            : null
-                        }
-                      />
                       <Button
                         fullWidth
                         type="submit"
@@ -165,15 +135,17 @@ const SendUserData = ({
           href={
             backUrlDecodedPath
               ? decodeURIComponent(backUrlDecodedPath)
-              : "/login-navy"
+              : "/register"
           }
         >
           {t("RegisterPage.link_routing_back_to")}{" "}
-          {t("RegisterPage.link_routing_login_navy")}
+          {backUrlDecodedPath
+            ? t("RegisterPage.link_routing_previuos_page")
+            : t("RegisterPage.link_routing_register")}
         </LinkRouting>
       </Stack>
     </FullPageLayout>
   );
 };
 
-export default SendUserData;
+export default RequestOtp;

src/components/register/index.jsx

@@ -0,0 +1,98 @@
+import dahsboardImage from "&/images/dashboard.svg";
+import LinkRouting from "@/core/components/LinkRouting";
+import { NextLinkComposed } from "@/core/components/LinkRouting";
+import StyledImage from "@/core/components/StyledImage";
+import CenterLayout from "@/layouts/CenterLayout";
+import FullPageLayout from "@/layouts/FullPageLayout";
+import useUser from "@/lib/app/hooks/useUser";
+import { Box, Button, Grid, Stack } from "@mui/material";
+import { useTranslations } from "next-intl";
+import { useSearchParams } from "next/navigation";
+
+const RegisterComponent = () => {
+  const t = useTranslations();
+  const { isAuth } = useUser();
+
+  const searchParams = useSearchParams();
+  const backUrlDecodedPath = searchParams.get("back_url");
+
+  return (
+    <FullPageLayout sx={{ p: 1 }}>
+      <CenterLayout spacing={3}>
+        <StyledImage
+          src={dahsboardImage}
+          alt={t("app_name")}
+          width={300}
+          height={200}
+          priority
+        />
+        {isAuth ? (
+          <Button
+            variant="contained"
+            component={NextLinkComposed}
+            to={{
+              pathname: "/dashboard",
+            }}
+          >
+            {t("dashboard")}
+          </Button>
+        ) : (
+          <Box>
+            <Grid
+              container
+              rowSpacing={{ xs: 1, sm: 0 }}
+              sx={{
+                flexDirection: { xs: "column", sm: "row" },
+                alignItems: "center",
+              }}
+            >
+              <Grid item xs={12} sm={6} sx={{ px: { xs: 0, sm: 1 } }}>
+                <Button
+                  sx={{ whiteSpace: "nowrap" }}
+                  variant="contained"
+                  size="large"
+                  component={NextLinkComposed}
+                  to={{
+                    pathname: "register/navy",
+                  }}
+                >
+                  {t("register_navy")}
+                </Button>
+              </Grid>
+              <Grid item xs={12} sm={6} sx={{ px: { xs: 0, sm: 1 } }}>
+                <Button
+                  sx={{ whiteSpace: "nowrap" }}
+                  variant="contained"
+                  size="large"
+                  component={NextLinkComposed}
+                  to={{
+                    pathname: "register/welfare-services",
+                  }}
+                >
+                  {t("register_welfare_services")}
+                </Button>
+              </Grid>
+            </Grid>
+          </Box>
+        )}
+      </CenterLayout>
+      <Stack direction="row" alignItems="center" justifyContent="center">
+        <LinkRouting
+          sx={{ margin: 2 }}
+          href={
+            backUrlDecodedPath
+              ? decodeURIComponent(backUrlDecodedPath)
+              : "/login"
+          }
+        >
+          {t("RegisterPage.link_routing_back_to")}{" "}
+          {backUrlDecodedPath
+            ? t("RegisterPage.link_routing_previuos_page")
+            : t("RegisterPage.link_routing_login")}
+        </LinkRouting>
+      </Stack>
+    </FullPageLayout>
+  );
+};
+
+export default RegisterComponent;

src/components/register/navy/UserRegister.jsx

@@ -1,49 +1,51 @@
-import LinkRouting from "@/core/components/LinkRouting";
 import Notifications from "@/core/components/notifications";
 import StyledForm from "@/core/components/StyledForm";
-import { REGISTER_SEND_OTP_TOKEN } from "@/core/data/apiRoutes";
+import { REGISTER } from "@/core/data/apiRoutes";
 import CenterLayout from "@/layouts/CenterLayout";
 import FullPageLayout from "@/layouts/FullPageLayout";
 import useDirection from "@/lib/app/hooks/useDirection";
-import FingerprintIcon from "@mui/icons-material/Fingerprint";
+import LoginIcon from "@mui/icons-material/Login";
+import ChangeCircleIcon from "@mui/icons-material/ChangeCircle";
 import {
   Box,
   Button,
+  Chip,
   Container,
+  Divider,
   Paper,
-  Stack, TextField, Typography
+  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 { useSearchParams } from "next/navigation";
 import * as Yup from "yup";
+import ResendToken from "@/core/components/ResendToken";
+import useUser from "@/lib/app/hooks/useUser";
 
-const SendUserData = ({
+const UserRegister = ({
-  setOtpToken,
-  setPhoneNumber,
   PhoneNumber,
-  setNationalId,
+  setOtpToken,
-  nationalId,
+  initialTimerValue,
-  setNavganId,
+  timer,
-  navganId,
+  setTimer,
-  setTypeId,
 }) => {
   const t = useTranslations();
   const { directionApp } = useDirection();
-
+  const { setToken } = useUser();
-  const searchParams = useSearchParams();
-  const backUrlDecodedPath = searchParams.get("back_url");
 
   const initialValues = {
     type_id: "1",
+    verification_code: "",
     phone_number: PhoneNumber,
-    national_id: nationalId,
+    national_id: "",
-    navgan_id: navganId,
+    navgan_id: "",
   };
+
   const validationSchema = Yup.object().shape({
-    phone_number: Yup.string().required(
+    verification_code: Yup.string().required(
       t("RegisterPage.error_message_required")
     ),
     national_id: Yup.string().required(
@@ -54,20 +56,19 @@ const SendUserData = ({
 
   const handleSubmit = async (values, props) => {
     Notifications(directionApp, t, undefined);
+    console.log(initialValues);
     await axios
-      .post(REGISTER_SEND_OTP_TOKEN, {
+      .post(REGISTER, {
         type_id: values.type_id,
         national_id: values.national_id,
         navgan_id: values.navgan_id,
         phone_number: values.phone_number,
+        verification_code: values.verification_code,
       })
       .then(function (response) {
         Notifications(directionApp, t, response);
-        setPhoneNumber(values.phone_number);
+        setOtpToken(true);
-        setNationalId(values.national_id);
+        setToken(response.data.token);
-        setNavganId(values.navgan_id);
-        setTypeId(values.type_id);
-        setOtpToken(true)
       })
       .catch(function (error) {
         Notifications(directionApp, t, error.response);
@@ -102,28 +103,58 @@ const SendUserData = ({
                   </Typography>
                   <StyledForm sx={{ width: "100%" }}>
                     <Stack spacing={3} sx={{ p: 2 }}>
+                      <Box
+                        sx={{
+                          display: { xs: "column", sm: "flex" },
+                          alignItems: "center",
+                          textAlign: { xs: "center", sm: "unset" },
+                          justifyContent: "space-between",
+                        }}
+                      >
+                        <Typography variant="button" sx={{ display: "block" }}>
+                          {t("LoginPage.sent_token_to")}: {PhoneNumber}
+                        </Typography>
+                        <Button
+                          size="small"
+                          startIcon={<ChangeCircleIcon />}
+                          variant="outlined"
+                          sx={{ whiteSpace: "nowrap", my: { xs: 1, sm: 0 } }}
+                          onClick={() => setOtpToken(false)}
+                        >
+                          {t("LoginPage.change_phone_number")}
+                        </Button>
+                      </Box>
                       <Field
                         as={TextField}
-                        name="phone_number"
+                        name="verification_code"
                         variant="outlined"
-                        label={t("RegisterPage.text_field_phone_number")}
+                        label={t("LoginPage.text_field_verification_code")}
                         placeholder={t(
-                          "RegisterPage.text_field_enter_your_phone_number"
+                          "LoginPage.text_field_enter_your_verification_code"
                         )}
                         type={"text"}
                         error={
-                          props.touched.phone_number &&
+                          props.touched.verification_code &&
-                          props.errors.phone_number
+                          props.errors.verification_code
                             ? true
                             : false
                         }
                         fullWidth
                         helperText={
-                          props.touched.phone_number
+                          props.touched.verification_code
-                            ? props.errors.phone_number
+                            ? props.errors.verification_code
                             : null
                         }
                       />
+                      <ResendToken
+                        initialTimerValue={initialTimerValue}
+                        timer={timer}
+                        setTimer={setTimer}
+                        PhoneNumber={PhoneNumber}
+                      />
+                      <Divider>
+                        <Chip label={t("RegisterPage.complete_information")} />
+                      </Divider>
                       <Field
                         as={TextField}
                         name="national_id"
@@ -171,10 +202,10 @@ const SendUserData = ({
                         type="submit"
                         variant="contained"
                         size="large"
-                        endIcon={<FingerprintIcon />}
+                        endIcon={<LoginIcon />}
                         disabled={props.isSubmitting ? true : false}
                       >
-                        {t("RegisterPage.button_request_verification")}
+                        {t("RegisterPage.button_submit")}
                       </Button>
                     </Stack>
                   </StyledForm>
@@ -184,21 +215,8 @@ const SendUserData = ({
           </Paper>
         </Container>
       </CenterLayout>
-      <Stack direction="row" alignItems="center" justifyContent="center">
-        <LinkRouting
-          sx={{ margin: 2 }}
-          href={
-            backUrlDecodedPath
-              ? decodeURIComponent(backUrlDecodedPath)
-              : "/login-navy"
-          }
-        >
-          {t("RegisterPage.link_routing_back_to")}{" "}
-          {t("RegisterPage.link_routing_login_navy")}
-        </LinkRouting>
-      </Stack>
     </FullPageLayout>
   );
 };
 
-export default SendUserData;
+export default UserRegister;

src/components/register/navy/index.jsx

@@ -0,0 +1,37 @@
+import { useState } from "react";
+import RequestOtp from "../RequestOtp";
+import UserRegister from "./UserRegister";
+
+const NavyComponent = () => {
+  const [otpToken, setOtpToken] = useState(false);
+  const [PhoneNumber, setPhoneNumber] = useState("");
+
+  // For Resend Token (read ResendToken Component Doc)
+  const initialTimerValue = 30;
+  const [timer, setTimer] = useState(initialTimerValue);
+  // End For Resend Token
+
+  if (!otpToken) {
+    return (
+      <RequestOtp
+        setOtpToken={setOtpToken}
+        PhoneNumber={PhoneNumber}
+        setPhoneNumber={setPhoneNumber}
+        setTimer={setTimer}
+        initialTimerValue={initialTimerValue}
+      />
+    );
+  } else {
+    return (
+      <UserRegister
+        PhoneNumber={PhoneNumber}
+        setOtpToken={setOtpToken}
+        timer={timer}
+        setTimer={setTimer}
+        initialTimerValue={initialTimerValue}
+      />
+    );
+  }
+};
+
+export default NavyComponent;

src/components/register/welfare-services/UserRegister.jsx

@@ -4,13 +4,14 @@ import { REGISTER } from "@/core/data/apiRoutes";
 import CenterLayout from "@/layouts/CenterLayout";
 import FullPageLayout from "@/layouts/FullPageLayout";
 import useDirection from "@/lib/app/hooks/useDirection";
-import useUser from "@/lib/app/hooks/useUser";
 import LoginIcon from "@mui/icons-material/Login";
 import ChangeCircleIcon from "@mui/icons-material/ChangeCircle";
 import {
   Box,
   Button,
+  Chip,
   Container,
+  Divider,
   Paper,
   Stack,
   TextField,
@@ -21,35 +22,49 @@ import { Field, Formik } from "formik";
 import { useTranslations } from "next-intl";
 import Image from "next/image";
 import * as Yup from "yup";
+import ResendToken from "@/core/components/ResendToken";
+import useUser from "@/lib/app/hooks/useUser";
 
-const SendToken = ({ PhoneNumber, nationalId, typeId, setOtpToken }) => {
+const UserRegister = ({
+  PhoneNumber,
+  setOtpToken,
+  initialTimerValue,
+  timer,
+  setTimer,
+}) => {
   const t = useTranslations();
   const { directionApp } = useDirection();
   const { setToken } = useUser();
 
   const initialValues = {
-    phone_number: PhoneNumber,
+    type_id: "2",
-    national_id: nationalId,
-    type_id: typeId,
     verification_code: "",
+    phone_number: PhoneNumber,
+    national_id: "",
   };
+
   const validationSchema = Yup.object().shape({
     verification_code: Yup.string().required(
       t("RegisterPage.error_message_required")
     ),
+    national_id: Yup.string().required(
+      t("RegisterPage.error_message_required")
+    ),
   });
 
   const handleSubmit = async (values, props) => {
     Notifications(directionApp, t, undefined);
+    console.log(initialValues);
     await axios
       .post(REGISTER, {
-        phone_number: values.phone_number,
-        national_id: values.national_id,
         type_id: values.type_id,
+        national_id: values.national_id,
+        phone_number: values.phone_number,
         verification_code: values.verification_code,
       })
       .then(function (response) {
         Notifications(directionApp, t, response);
+        setOtpToken(true);
         setToken(response.data.token);
       })
       .catch(function (error) {
@@ -87,30 +102,32 @@ const SendToken = ({ PhoneNumber, nationalId, typeId, setOtpToken }) => {
                     <Stack spacing={3} sx={{ p: 2 }}>
                       <Box
                         sx={{
-                          display: "flex",
+                          display: { xs: "column", sm: "flex" },
                           alignItems: "center",
+                          textAlign: { xs: "center", sm: "unset" },
                           justifyContent: "space-between",
                         }}
                       >
-                        <Typography variant="button">
+                        <Typography variant="button" sx={{ display: "block" }}>
-                          {t("RegisterPage.sent_token_to")}: {PhoneNumber}{" "}
+                          {t("LoginPage.sent_token_to")}: {PhoneNumber}
                         </Typography>
                         <Button
                           size="small"
                           startIcon={<ChangeCircleIcon />}
                           variant="outlined"
                           onClick={() => setOtpToken(false)}
+                          sx={{ whiteSpace: "nowrap", my: { xs: 1, sm: 0 } }}
                         >
-                          {t("RegisterPage.change_phone_number")}
+                          {t("LoginPage.change_phone_number")}
                         </Button>
                       </Box>
                       <Field
                         as={TextField}
                         name="verification_code"
                         variant="outlined"
-                        label={t("RegisterPage.text_field_verification_code")}
+                        label={t("LoginPage.text_field_verification_code")}
                         placeholder={t(
-                          "RegisterPage.text_field_enter_your_verification_code"
+                          "LoginPage.text_field_enter_your_verification_code"
                         )}
                         type={"text"}
                         error={
@@ -126,6 +143,36 @@ const SendToken = ({ PhoneNumber, nationalId, typeId, setOtpToken }) => {
                             : null
                         }
                       />
+                      <ResendToken
+                        initialTimerValue={initialTimerValue}
+                        timer={timer}
+                        setTimer={setTimer}
+                        PhoneNumber={PhoneNumber}
+                      />
+                      <Divider>
+                        <Chip label={t("RegisterPage.complete_information")} />
+                      </Divider>
+                      <Field
+                        as={TextField}
+                        name="national_id"
+                        variant="outlined"
+                        label={t("RegisterPage.text_field_national_id")}
+                        placeholder={t(
+                          "RegisterPage.text_field_enter_your_national_id"
+                        )}
+                        type={"text"}
+                        error={
+                          props.touched.national_id && props.errors.national_id
+                            ? true
+                            : false
+                        }
+                        fullWidth
+                        helperText={
+                          props.touched.national_id
+                            ? props.errors.national_id
+                            : null
+                        }
+                      />
                       <Button
                         fullWidth
                         type="submit"
@@ -148,4 +195,4 @@ const SendToken = ({ PhoneNumber, nationalId, typeId, setOtpToken }) => {
   );
 };
 
-export default SendToken;
+export default UserRegister;

src/components/register/welfare-services/index.jsx

@@ -0,0 +1,37 @@
+import { useState } from "react";
+import RequestOtp from "../RequestOtp";
+import UserRegister from "./UserRegister";
+
+const NavyComponent = () => {
+  const [otpToken, setOtpToken] = useState(false);
+  const [PhoneNumber, setPhoneNumber] = useState("");
+
+  // For Resend Token (read ResendToken Component Doc)
+  const initialTimerValue = 30;
+  const [timer, setTimer] = useState(initialTimerValue);
+  // End For Resend Token
+
+  if (!otpToken) {
+    return (
+      <RequestOtp
+        setOtpToken={setOtpToken}
+        PhoneNumber={PhoneNumber}
+        setPhoneNumber={setPhoneNumber}
+        setTimer={setTimer}
+        initialTimerValue={initialTimerValue}
+      />
+    );
+  } else {
+    return (
+      <UserRegister
+        PhoneNumber={PhoneNumber}
+        setOtpToken={setOtpToken}
+        timer={timer}
+        setTimer={setTimer}
+        initialTimerValue={initialTimerValue}
+      />
+    );
+  }
+};
+
+export default NavyComponent;

src/core/components/ResendToken.jsx

@@ -1,10 +1,10 @@
 import Notifications from "@/core/components/notifications";
 import useDirection from "@/lib/app/hooks/useDirection";
-import { Typography } from "@mui/material";
+import { Button, Typography } from "@mui/material";
 import axios from "axios";
 import { useTranslations } from "next-intl";
 import { useEffect } from "react";
-import { LOGIN_SEND_OTP_TOKEN } from "../data/apiRoutes";
+import { SEND_OTP_TOKEN } from "../data/apiRoutes";
 
 const ResendToken = ({ initialTimerValue, timer, setTimer, PhoneNumber }) => {
   const t = useTranslations();
@@ -31,7 +31,7 @@ const ResendToken = ({ initialTimerValue, timer, setTimer, PhoneNumber }) => {
     if (timer != 0) return;
     Notifications(directionApp, t, undefined);
     await axios
-      .post(LOGIN_SEND_OTP_TOKEN, {
+      .post(SEND_OTP_TOKEN, {
         phone_number: PhoneNumber,
       })
       .then(function (response) {
@@ -47,19 +47,23 @@ const ResendToken = ({ initialTimerValue, timer, setTimer, PhoneNumber }) => {
   return (
     <>
       {timer > 0 ? (
-        <Typography variant={"button"} sx={{ textAlign: "center" }}>
+        <Button
-          {t("LoginPage.Resend_code_in")}: {timer}
+          color="success"
-          {t("LoginPage.seconds_later")}
+          disabled
-        </Typography>
+          sx={{ width: "auto", alignSelf: "center", mt: 0 }}
-      ) : (
-        <Typography
-          variant={"button"}
-          sx={{ cursor: "pointer", textAlign: "center" }}
           onClick={handleResendClick}
-          underline="hover"
         >
-          {t("LoginPage.resend_code")}
+          {t("Resend_code_in")} {timer} {" "}
-        </Typography>
+          {t("seconds_later")}
+        </Button>
+      ) : (
+        <Button
+          color="success"
+          sx={{ width: "120px", alignSelf: "center", mt: 0 }}
+          onClick={handleResendClick}
+        >
+          {t("resend_code")}
+        </Button>
       )}
     </>
   );
@@ -67,7 +71,6 @@ const ResendToken = ({ initialTimerValue, timer, setTimer, PhoneNumber }) => {
 
 export default ResendToken;
 
-
 //////****** usage document ******/////////
 // 1.) use <ResendToken /> component inside your page
 // 2.) list of props that you need to send is down below

src/core/data/apiRoutes.js

@@ -1,12 +1,13 @@
 const BASE_URL = process.env.NEXT_PUBLIC_BASE_URL + "/api";
 
-export const LOGIN_SEND_OTP_TOKEN = BASE_URL + "/login/send_otp";
+// export const LOGIN_SEND_OTP_TOKEN = BASE_URL + "/login/send_otp";
 export const LOGIN = BASE_URL + "/login";
-export const REGISTER_SEND_OTP_TOKEN = BASE_URL + "/register/send_otp";
+// export const REGISTER_SEND_OTP_TOKEN = BASE_URL + "/register/send_otp";
+export const SEND_OTP_TOKEN = BASE_URL + "/otp";
 export const REGISTER = BASE_URL + "/register";
 export const USER_INFO = BASE_URL + "/profile/info";
 export const SEND_LOAN_REQUEST_NAVGAN = BASE_URL + "/navgan/store_loan";
-export const SEND_LOAN_REQUEST_WELFARE = BASE_URL + "/navgan/store_loan";
+export const SEND_LOAN_REQUEST_WELFARE = BASE_URL + "/khadamat/store_loan";
 export const GET_PROVINCE_LIST = BASE_URL + "/provinces";
 
 

src/pages/login.jsx

@@ -1,4 +1,4 @@
-import LoginComponent from "@/components/login-welfare-services";
+import LoginComponent from "@/components/login";
 import TitlePage from "@/core/components/TitlePage";
 import WithoutAuthMiddleware from "@/middlewares/WithoutAuth";
 import { parse } from "next-useragent";
@@ -10,7 +10,7 @@ export default function Login() {
   const { directionApp } = useDirection();
   return (
     <WithoutAuthMiddleware>
-      <TitlePage text="Titles.title_login_welfare_services_page" />
+      <TitlePage text="Titles.title_login_page" />
       <LoginComponent />
       {directionApp === "rtl" ? <ToastContainer rtl /> : <ToastContainer ltr />}
     </WithoutAuthMiddleware>

src/pages/register/index.jsx

@@ -1,4 +1,4 @@
-import LoginComponent from "@/components/login-navy";
+import RegisterComponent from "@/components/register";
 import TitlePage from "@/core/components/TitlePage";
 import WithoutAuthMiddleware from "@/middlewares/WithoutAuth";
 import { parse } from "next-useragent";
@@ -6,12 +6,12 @@ import "react-toastify/dist/ReactToastify.css";
 import { ToastContainer } from "react-toastify";
 import useDirection from "@/lib/app/hooks/useDirection";
 
-export default function LoginNavy() {
+export default function Register() {
   const { directionApp } = useDirection();
   return (
     <WithoutAuthMiddleware>
-      <TitlePage text="Titles.title_login_navy_page" />
+      <TitlePage text="Titles.title_register_page" />
-      <LoginComponent />
+      <RegisterComponent />
       {directionApp === "rtl" ? <ToastContainer rtl /> : <ToastContainer ltr />}
     </WithoutAuthMiddleware>
   );

src/pages/register/navy/index.jsx

@@ -1,4 +1,4 @@
-import RegisterNavyComponent from "@/components/register-navy";
+import NavyComponent from "@/components/register/navy";
 import TitlePage from "@/core/components/TitlePage";
 import WithoutAuthMiddleware from "@/middlewares/WithoutAuth";
 import { parse } from "next-useragent";
@@ -6,12 +6,12 @@ import "react-toastify/dist/ReactToastify.css";
 import { ToastContainer } from "react-toastify";
 import useDirection from "@/lib/app/hooks/useDirection";
 
-export default function RegisterNavy() {
+export default function Register() {
   const { directionApp } = useDirection();
   return (
     <WithoutAuthMiddleware>
       <TitlePage text="Titles.title_register_navy_page" />
-      <RegisterNavyComponent />
+      <NavyComponent />
       {directionApp === "rtl" ? <ToastContainer rtl /> : <ToastContainer ltr />}
     </WithoutAuthMiddleware>
   );

src/pages/register/welfare-services/index.jsx

@@ -1,4 +1,4 @@
-import RegisterComponent from "@/components/register-welfare-services";
+import WelfareServicesComponent from "@/components/register/welfare-services";
 import TitlePage from "@/core/components/TitlePage";
 import WithoutAuthMiddleware from "@/middlewares/WithoutAuth";
 import { parse } from "next-useragent";
@@ -6,12 +6,12 @@ import "react-toastify/dist/ReactToastify.css";
 import { ToastContainer } from "react-toastify";
 import useDirection from "@/lib/app/hooks/useDirection";
 
-export default function RegisterWelfareServices() {
+export default function Register() {
   const { directionApp } = useDirection();
   return (
     <WithoutAuthMiddleware>
       <TitlePage text="Titles.title_register_welfare_services_page" />
-      <RegisterComponent />
+      <WelfareServicesComponent />
       {directionApp === "rtl" ? <ToastContainer rtl /> : <ToastContainer ltr />}
     </WithoutAuthMiddleware>
   );