add loan request/change structure and documentary/ making middle ware for user type/update breadcrumb

public/locales/fa/app.json

@@ -4,10 +4,10 @@
   "dashboard": "داشبورد",
   "first_page": "خوش آمدید",
   "login": "ورود",
+  "pending": "درحال اجرا...",
   "login_user_panel": "ورود به پنل کاربران",
   "register_navy": "ثبت نام اعضای ناوگان",
   "register_welfare_services": "ثبت نام اعضای خدمات رفاهی",
-  "pending": "درحال اجرا...",
   "user_navy": "ناوگان",
   "page_not_found": "صفحه مورد نظر یافت نشد",
   "delete": "حذف",
@@ -25,7 +25,12 @@
     "success_static_text": "عملیات با موفقیت انجام شد",
     "code": "کد",
     "success": "موفق",
-    "error": "خطا"
+    "error": "خطا",
+    "pending": "درحال اجرا..."
+  },
+  "Permission": {
+    "typography_you_dont_have_access": "شما دسترسی لازم برای مشاهده این صفحه را ندارید!",
+    "button_back_dashboard": "بازگشت به صفحه اصلی"
   },
   "Titles": {
     "title_login_page": "صفحه ورود",
@@ -48,8 +53,8 @@
   },
   "sidebar": {
     "dashboard": "داشبورد",
-    "loan-request": "درخواست وام",
+    "add-request-loan": "درخواست وام",
-    "loan-follow-up": "پیگیری درخواست"
+    "followUp-loan": "پیگیری درخواست"
   },
   "Authorization": {
     "typography_your_login_is_valid_and_you_do_not_need_to_login_again": "شما دسترسی لازم به این صفحه را دارید نیاز به ورود مجدد نیست.",

src/components/dashboard/navgan/add-request-loan/forms/AddForm.jsx

@@ -13,7 +13,7 @@ import {useTranslations} from "next-intl";
 import {useEffect, useState} from "react";
 import * as Yup from "yup";
 
-const NavyFormComponent = () => {
+const AddFormComponent = () => {
     const t = useTranslations();
     const {directionApp} = useDirection();
     const {token} = useUser();
@@ -486,4 +486,4 @@ const NavyFormComponent = () => {
     );
 };
 
-export default NavyFormComponent;
+export default AddFormComponent;

src/components/dashboard/navgan/add-request-loan/index.jsx

@@ -1,10 +1,9 @@
 import CenterLayout from "@/layouts/CenterLayout";
 import DashboardLayouts from "@/layouts/dashboardLayouts";
 import useUser from "@/lib/app/hooks/useUser";
-import NavyFormComponent from "./NavyForm";
-import WelfareServicesFormComponent from "./WelfareServicesForm";
 import {Box, Chip, Divider} from "@mui/material";
 import {useTranslations} from "next-intl";
+import AddFormComponent from "@/components/dashboard/navgan/add-request-loan/forms/AddForm";
 
 const LoanRequestComponent = () => {
     const t = useTranslations();
@@ -22,7 +21,7 @@ const LoanRequestComponent = () => {
                         />
                     </Divider>
                 </Box>
-                {user.type_id == 1 ? <NavyFormComponent/> : <WelfareServicesFormComponent/>}
+                <AddFormComponent/>
             </CenterLayout>
         </DashboardLayouts>
     );

src/components/dashboard/refahi/add-request-loan/forms/AddForm.jsx

@@ -1,7 +1,6 @@
-import Notifications from "@/core/components/notifications";
 import StyledForm from "@/core/components/StyledForm";
 import UploadSystem from "@/core/components/UploadSystem";
-import {SEND_LOAN_REQUEST_WELFARE} from "@/core/data/apiRoutes";
+import {GET_PROVINCE_LIST, SEND_LOAN_REQUEST_WELFARE} from "@/core/data/apiRoutes";
 import useDirection from "@/lib/app/hooks/useDirection";
 import useUser from "@/lib/app/hooks/useUser";
 import DataSaverOnIcon from "@mui/icons-material/DataSaverOn";
@@ -9,13 +8,32 @@ import {Box, Button, Stack, TextField} from "@mui/material";
 import axios from "axios";
 import {Field, Formik} from "formik";
 import {useTranslations} from "next-intl";
-import {useState} from "react";
+import {useEffect, useState} from "react";
 import * as Yup from "yup";
+import SelectBox from "@/core/components/SelectBox";
+import useRequest from "@/lib/app/hooks/useRequest";
 
-const WelfareServicesFormComponent = () => {
+const AddFormComponent = () => {
     const t = useTranslations();
     const {directionApp} = useDirection();
     const {token} = useUser();
+    const requestServer = useRequest()
+
+    // get province list
+    const [provinceList, setProvinceList] = useState([]);
+    useEffect(() => {
+        requestServer(GET_PROVINCE_LIST, "get", {auth: true, notification: false})
+            .then(function ({data}) {
+                const formattedData = data.map((province, index) => ({
+                    id: index,
+                    name: province.name,
+                    value: province.id,
+                }));
+                setProvinceList(formattedData);
+            }).catch(() => {
+        })
+    }, []);
+    // end get province list
 
     // upload files
     const [selectedImageShenasname, setSelectedImageShenasname] = useState(
@@ -57,8 +75,6 @@ const WelfareServicesFormComponent = () => {
     const initialValues = {
         name: "",
         phone_number: "",
-        vehicle_type: "",
-        plate_number: "",
         province: "",
         national_code: "",
         shenasname_id: "",
@@ -71,12 +87,6 @@ const WelfareServicesFormComponent = () => {
         phone_number: Yup.string().required(
             t("LoanRequest.error_message_phone_number")
         ),
-        vehicle_type: Yup.string().required(
-            t("LoanRequest.error_message_vehicle_type")
-        ),
-        plate_number: Yup.string().required(
-            t("LoanRequest.error_message_plate_number")
-        ),
         province: Yup.string().required(t("LoanRequest.error_message_province")),
         national_code: Yup.string().required(
             t("LoanRequest.error_message_national_code")
@@ -87,34 +97,23 @@ const WelfareServicesFormComponent = () => {
     });
 
     const handleSubmit = async (values, props) => {
-        Notifications(t, undefined);
         const formData = new FormData();
         formData.append("name", values.name);
         formData.append("phone_number", values.phone_number);
-        formData.append("vehicle_type", values.vehicle_type);
-        formData.append("plate_number", values.plate_number);
         formData.append("province_id", values.province);
-        formData.append("national_code", values.national_code);
+        formData.append("national_id", values.national_code);
         formData.append("shenasname_id", values.shenasname_id);
         if (values.shenasname_img != null)
             formData.append("shenasname_image", values.shenasname_img);
         if (values.national_card_img != null)
             formData.append("national_card_image", values.national_card_img);
 
-        await axios
+        requestServer(SEND_LOAN_REQUEST_WELFARE, "post", {auth: true, data: formData})
-            .post(SEND_LOAN_REQUEST_WELFARE, formData, {
-                headers: {
-                    Authorization: `Bearer ${token}`,
-                    "Content-Type": "multipart/form-data",
-                },
-            })
             .then(function (response) {
-                Notifications(t, response);
+
-            })
+            }).catch(function (error) {
-            .catch(function (error) {
+            props.setSubmitting(false);
-                Notifications(t, error.response);
+        });
-                props.setSubmitting(false);
-            });
     };
     // end initial values, validation and request action of form
 
@@ -158,7 +157,7 @@ const WelfareServicesFormComponent = () => {
                                     label={t("LoanRequest.text_field_name")}
                                     placeholder={t("LoanRequest.text_field_enter_your_name")}
                                     type={"text"}
-                                    error={props.touched.name && props.errors.name ? true : false}
+                                    error={!!(props.touched.name && props.errors.name)}
                                     fullWidth
                                     helperText={props.touched.name ? props.errors.name : null}
                                 />
@@ -182,9 +181,7 @@ const WelfareServicesFormComponent = () => {
                                     )}
                                     type={"text"}
                                     error={
-                                        props.touched.phone_number && props.errors.phone_number
+                                        !!(props.touched.phone_number && props.errors.phone_number)
-                                            ? true
-                                            : false
                                     }
                                     fullWidth
                                     helperText={
@@ -194,16 +191,6 @@ const WelfareServicesFormComponent = () => {
                                     }
                                 />
                             </Box>
-                        </Box>
-                        <Box
-                            sx={{
-                                display: "flex",
-                                flexDirection: {xs: "column", sm: "row"},
-                                alignItems: "start",
-                                justifyContent: "center",
-                                width: "100%",
-                            }}
-                        >
                             <Box
                                 sx={{
                                     mx: {xs: 0, sm: 2},
@@ -212,82 +199,18 @@ const WelfareServicesFormComponent = () => {
                                 }}
                             >
                                 <Field
-                                    as={TextField}
-                                    sx={{width: "100%"}}
-                                    name="vehicle_type"
-                                    variant="outlined"
-                                    size="small"
-                                    label={t("LoanRequest.text_field_vehicle_type")}
-                                    placeholder={t(
-                                        "LoanRequest.text_field_enter_your_vehicle_type"
-                                    )}
-                                    type={"text"}
-                                    error={
-                                        props.touched.vehicle_type && props.errors.vehicle_type
-                                            ? true
-                                            : false
-                                    }
-                                    fullWidth
-                                    helperText={
-                                        props.touched.vehicle_type
-                                            ? props.errors.vehicle_type
-                                            : null
-                                    }
-                                />
-                            </Box>
-                            <Box
-                                sx={{
-                                    mx: {xs: 0, sm: 2},
-                                    my: 2,
-                                    width: "100%",
-                                }}
-                            >
-                                <Field
-                                    as={TextField}
-                                    sx={{width: "100%"}}
-                                    name="plate_number"
-                                    variant="outlined"
-                                    size="small"
-                                    label={t("LoanRequest.text_field_plate_number")}
-                                    placeholder={t(
-                                        "LoanRequest.text_field_enter_your_plate_number"
-                                    )}
-                                    type={"text"}
-                                    error={
-                                        props.touched.plate_number && props.errors.plate_number
-                                            ? true
-                                            : false
-                                    }
-                                    fullWidth
-                                    helperText={
-                                        props.touched.plate_number
-                                            ? props.errors.plate_number
-                                            : null
-                                    }
-                                />
-                            </Box>
-                            <Box
-                                sx={{
-                                    mx: {xs: 0, sm: 2},
-                                    my: 2,
-                                    width: "100%",
-                                }}
-                            >
-                                <Field
-                                    as={TextField}
-                                    sx={{width: "100%"}}
                                     name="province"
-                                    variant="outlined"
+                                    label={t("LoanRequest.text_field_province")} // t("LoanRequest.text_field_enter_your_province")
                                     size="small"
-                                    label={t("LoanRequest.text_field_province")}
+                                    selectType="province"
-                                    placeholder={t("LoanRequest.text_field_enter_your_province")}
+                                    component={SelectBox}
-                                    type={"text"}
+                                    selectors={provinceList}
+                                    select={props.values.province}
+                                    setFieldValue={props.setFieldValue}
+                                    setFieldTouched={props.setFieldTouched}
                                     error={
-                                        props.touched.province && props.errors.province
+                                        !!(props.touched.province && props.errors.province)
-                                            ? true
-                                            : false
                                     }
-                                    fullWidth
                                     helperText={
                                         props.touched.province ? props.errors.province : null
                                     }
@@ -322,9 +245,7 @@ const WelfareServicesFormComponent = () => {
                                     )}
                                     type={"text"}
                                     error={
-                                        props.touched.national_code && props.errors.national_code
+                                        !!(props.touched.national_code && props.errors.national_code)
-                                            ? true
-                                            : false
                                     }
                                     fullWidth
                                     helperText={
@@ -353,9 +274,7 @@ const WelfareServicesFormComponent = () => {
                                     )}
                                     type={"text"}
                                     error={
-                                        props.touched.shenasname_id && props.errors.shenasname_id
+                                        !!(props.touched.shenasname_id && props.errors.shenasname_id)
-                                            ? true
-                                            : false
                                     }
                                     fullWidth
                                     helperText={
@@ -421,7 +340,7 @@ const WelfareServicesFormComponent = () => {
                                 size="large"
                                 sx={{mt: 2}}
                                 endIcon={<DataSaverOnIcon/>}
-                                disabled={props.isSubmitting ? true : false}
+                                disabled={props.isSubmitting}
                             >
                                 {t("LoanRequest.button_submit")}
                             </Button>
@@ -433,4 +352,4 @@ const WelfareServicesFormComponent = () => {
     );
 };
 
-export default WelfareServicesFormComponent;
+export default AddFormComponent;

src/components/dashboard/refahi/add-request-loan/index.jsx

@@ -0,0 +1,30 @@
+import CenterLayout from "@/layouts/CenterLayout";
+import DashboardLayouts from "@/layouts/dashboardLayouts";
+import useUser from "@/lib/app/hooks/useUser";
+import {Box, Chip, Divider} from "@mui/material";
+import {useTranslations} from "next-intl";
+import AddFormComponent from "@/components/dashboard/refahi/add-request-loan/forms/AddForm";
+
+const LoanRequestComponent = () => {
+    const t = useTranslations();
+    const {user} = useUser();
+
+    return (
+        <DashboardLayouts>
+            <CenterLayout>
+                <Box sx={{width: "80%", my: 2}}>
+                    <Divider>
+                        <Chip
+                            label={`${t("LoanRequest.loan_request_page")} | ${
+                                user.type_name
+                            }`}
+                        />
+                    </Divider>
+                </Box>
+                <AddFormComponent/>
+            </CenterLayout>
+        </DashboardLayouts>
+    );
+};
+
+export default LoanRequestComponent;

src/components/dashboard/refahi/followUp-loan/index.jsx

@@ -0,0 +1,123 @@
+import DashboardLayouts from "@/layouts/dashboardLayouts";
+import useUser from "@/lib/app/hooks/useUser";
+import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
+import {
+    Avatar,
+    Card,
+    CardActions,
+    CardContent,
+    CardHeader,
+    Collapse,
+    Grid,
+    IconButton,
+    Stack,
+    Typography
+} from "@mui/material";
+import {styled} from "@mui/material/styles";
+import {useTranslations} from "next-intl";
+import {useState} from "react";
+
+const ExpandMore = styled((props) => {
+    const {expand, ...other} = props;
+    return <IconButton {...other} />;
+})(({theme, expand}) => ({
+    transform: !expand ? "rotate(0deg)" : "rotate(180deg)",
+    marginLeft: "auto",
+    transition: theme.transitions.create("transform", {
+        duration: theme.transitions.duration.shortest,
+    }),
+}));
+
+const data = [
+    {
+        name: "جان دو",
+        date: "۱۳۹۹/۰۴/۲۵",
+        description:
+            "لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است.",
+    },
+    {
+        name: "جین اسمیت",
+        date: "۱۳۹۹/۰۴/۲۶",
+        description: "نُلا ویته الیت لیبرو آ، آ فارِترا آوگوه.",
+    },
+    {
+        name: "مایک جانسون",
+        date: "۱۳۹۹/۰۴/۲۷",
+        description:
+            "دوئیس مولیس، است نُن کُمُدو لُکتوس، نیسی ارات پورتیتور لیگولا.",
+    },
+];
+
+const LoanFollowUpComponent = () => {
+    const t = useTranslations();
+    const {token} = useUser();
+
+    const [expanded, setExpanded] = useState([]);
+
+    const handleExpandClick = (index) => {
+        setExpanded((prevExpanded) => {
+            const newExpanded = [...prevExpanded];
+            newExpanded[index] = !newExpanded[index];
+            return newExpanded;
+        });
+    };
+
+    return (
+        <DashboardLayouts>
+            <Stack
+                spacing={2}
+                sx={{
+                    p: 4,
+                    width: "100%",
+                }}
+            >
+                <Grid
+                    container
+                    columnSpacing={2}
+                    rowSpacing={2}
+                    sx={{alignItems: "start", justifyContent: "center"}}
+                >
+                    {data.map((item, index) => (
+                        <Grid item xs={12} md={6} lg={4} key={index}>
+                            <Card sx={{width: "100%"}}>
+                                <CardHeader
+                                    avatar={
+                                        <Avatar
+                                            sx={{bgcolor: "primary.main"}}
+                                            aria-label="recipe"
+                                        ></Avatar>
+                                    }
+                                    title={item.name}
+                                    subheader={item.date}
+                                />
+                                <CardContent>
+                                    <Typography variant="body2" color="text.secondary">
+                                        متن تست
+                                    </Typography>
+                                </CardContent>
+                                <CardActions disableSpacing>
+                                    <ExpandMore
+                                        expand={expanded[index]}
+                                        onClick={() => handleExpandClick(index)}
+                                        aria-expanded={expanded[index]}
+                                        aria-label="show more"
+                                    >
+                                        <ExpandMoreIcon/>
+                                    </ExpandMore>
+                                </CardActions>
+                                <Collapse in={expanded[index]} timeout="auto" unmountOnExit>
+                                    <CardContent>
+                                        <Typography paragraph>اطلاعات تکمیلی:</Typography>
+                                        <Typography paragraph>{item.description}</Typography>
+                                    </CardContent>
+                                </Collapse>
+                            </Card>
+                        </Grid>
+                    ))}
+                </Grid>
+            </Stack>
+        </DashboardLayouts>
+    );
+};
+
+export default LoanFollowUpComponent;

src/core/components/SelectBox.jsx

@@ -10,6 +10,8 @@ function SelectBox({
                        error,
                        helperText,
                    }) {
+
+    const selectId = String(select);
     const handleChange = (event) => {
         setFieldValue(selectType, event.target.value);
     };
@@ -28,8 +30,8 @@ function SelectBox({
             <InputLabel id="language-label">{label}</InputLabel>
             <Select
                 labelId="language-label"
-                id={select}
+                id={selectId}
-                name={select}
+                name={selectId}
                 size="small"
                 value={select}
                 onChange={handleChange}

src/core/data/apiRoutes.js

@@ -6,8 +6,8 @@ export const LOGIN = BASE_URL + "/login";
 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_NAVGAN = BASE_URL + "/navgan/loan/store";
-export const SEND_LOAN_REQUEST_WELFARE = BASE_URL + "/khadamat/store_loan";
+export const SEND_LOAN_REQUEST_WELFARE = BASE_URL + "/refahi/loan/store";
 export const GET_PROVINCE_LIST = BASE_URL + "/provinces";
 
 

src/core/data/sidebarMenu.jsx

@@ -9,20 +9,39 @@ const sidebarMenu = [
             type: "page",
             route: "/dashboard",
             icon: <SpaceDashboardIcon/>,
+            userType: 0,
             selected: false,
         },
         {
-            key: "sidebar.loan-request",
+            key: "sidebar.add-request-loan",
             type: "page",
-            route: "/dashboard/loan-request",
+            route: "/dashboard/navgan/add-request-loan",
             icon: <DataSaverOnIcon/>,
+            userType: 1,
             selected: false,
         },
         {
-            key: "sidebar.loan-follow-up",
+            key: "sidebar.followUp-loan",
             type: "page",
-            route: "/dashboard/loan-follow-up",
+            route: "/dashboard/navgan/followUp-loan",
             icon: <BookmarkAddedIcon/>,
+            userType: 1,
+            selected: false,
+        },
+        {
+            key: "sidebar.add-request-loan",
+            type: "page",
+            route: "/dashboard/refahi/add-request-loan",
+            icon: <DataSaverOnIcon/>,
+            userType: 2,
+            selected: false,
+        },
+        {
+            key: "sidebar.followUp-loan",
+            type: "page",
+            route: "/dashboard/refahi/followUp-loan",
+            icon: <BookmarkAddedIcon/>,
+            userType: 2,
             selected: false,
         },
     ],

src/layouts/dashboardLayouts/breadcrumbs/index.jsx

@@ -3,11 +3,13 @@ import {Box, Breadcrumbs} from "@mui/material";
 import {useTheme} from "@mui/material/styles";
 import {NavigateBefore, NavigateNext} from "@mui/icons-material";
 import BreadcrumbItem from "./BreadcrumbItem";
+import useUser from "@/lib/app/hooks/useUser";
 
 const BreadCrumbs = (props) => {
     const {isVisible} = props;
     const theme = useTheme();
     const router = useRouter();
+    const {user} = useUser();
 
     if (!isVisible) {
         return null;
@@ -16,6 +18,17 @@ const BreadCrumbs = (props) => {
     const {pathname} = router;
     const RouterArray = pathname.split("/").filter((segment) => segment !== "");
 
+    // every part of your router you want to remove add it to this array
+    const segmentsToRemove = ["navgan", "refahi"];
+
+    segmentsToRemove.forEach((segmentToRemove) => {
+        const index = RouterArray.indexOf(segmentToRemove);
+        if (index !== -1) {
+            RouterArray.splice(index, 1);
+        }
+    });
+
+
     if (RouterArray.length === 1) {
         return null;
     }

src/layouts/dashboardLayouts/sidebar/SidebarList.jsx

@@ -3,6 +3,7 @@ import {Fragment, useEffect, useReducer} from "react";
 import SidebarListItem from "./SidebarListItem";
 import sidebarMenu from "@/core/data/sidebarMenu";
 import {useRouter} from "next/router";
+import useUser from "@/lib/app/hooks/useUser";
 
 function reducer(state, action) {
     switch (action.type) {
@@ -29,6 +30,7 @@ function reducer(state, action) {
 
 export default function SidebarList({handleDrawerToggle}) {
     const [itemMenu, dispatch] = useReducer(reducer, sidebarMenu);
+    const {user} = useUser();
 
     // activate current page in menu
     const router = useRouter();
@@ -40,14 +42,16 @@ export default function SidebarList({handleDrawerToggle}) {
         <List>
             {itemMenu.map((itemArr, index) => (
                 <Fragment key={index}>
-                    {itemArr.map((item) => (
+                    {itemArr.map((item) =>
-                        <SidebarListItem
+                        (item.userType === user.type_id || item.userType === 0) ? (
-                            item={item}
+                            <SidebarListItem
-                            dispatch={dispatch}
+                                item={item}
-                            key={item.key}
+                                dispatch={dispatch}
-                            handleDrawerToggle={handleDrawerToggle}
+                                key={item.key}
-                        />
+                                handleDrawerToggle={handleDrawerToggle}
-                    ))}
+                            />
+                        ) : null
+                    )}
                     <Divider/>
                 </Fragment>
             ))}

src/lib/app/hooks/useRequest.js

@@ -6,8 +6,11 @@ import useUser from "@/lib/app/hooks/useUser";
 import {errorRequest, errorResponse, errorSetting} from "@/core/utils/errorHandler";
 
 const defaultOptions = {
+    auth: false,
     data: {},
-    requestOptions: {},
+    requestOptions: {
+        headers: {}
+    },
     notification: true,
     pending: true,
     success: {
@@ -23,11 +26,19 @@ const defaultOptions = {
 }
 const useRequest = (initOptions) => {
     const t = useTranslations()
-    const {clearToken} = useUser()
+    const {token, clearToken} = useUser()
     let _options = {...defaultOptions, ...initOptions}
 
     function requestServer(url = '', method = 'get', options) {
         _options = {..._options, ...options}
+        if (_options.auth) _options = {
+            ..._options,
+            requestOptions: {
+                ..._options.requestOptions,
+                headers: {..._options.requestOptions.headers, authorization: `Bearer ${token}`}
+            }
+        }
+
         return new Promise((resolve, reject) => {
             if (_options.notification && _options.failed.notification.show && _options.pending) PendingNotification(t)
             axios({

src/middlewares/UserType.jsx

@@ -0,0 +1,41 @@
+import {NextLinkComposed} from "@/core/components/LinkRouting";
+import Message from "@/core/components/Messages";
+import useUser from "@/lib/app/hooks/useUser";
+import {Button, Typography} from "@mui/material";
+import {useTranslations} from "next-intl";
+
+const UserTypeMiddleware = ({children, user_type}) => {
+    const {user} = useUser();
+    const t = useTranslations();
+
+    const userPermission = user.type_id === user_type;
+
+    if (!userPermission) {
+        return (
+            <Message
+                text={
+                    <Typography sx={{textAlign: "center"}}>
+                        {t("Permission.typography_you_dont_have_access")}
+                    </Typography>
+                }
+                actions={
+                    <>
+                        <Button
+                            variant="contained"
+                            component={NextLinkComposed}
+                            to={{
+                                pathname: "/dashboard",
+                            }}
+                        >
+                            {t("Permission.button_back_dashboard")}
+                        </Button>
+                    </>
+                }
+            />
+        );
+    }
+
+    return <>{children}</>;
+};
+
+export default UserTypeMiddleware;

src/pages/dashboard/navgan/add-request-loan/index.jsx

@@ -0,0 +1,26 @@
+import WithAuthMiddleware from "@/middlewares/WithAuth";
+import {parse} from "next-useragent";
+import UserTypeMiddleware from "@/middlewares/UserType";
+import LoanRequestComponent from "@/components/dashboard/navgan/add-request-loan";
+
+const user_type = 1;
+export default function LoanRequest() {
+    return (
+        <WithAuthMiddleware>
+            <UserTypeMiddleware user_type={user_type}>
+                <LoanRequestComponent/>
+            </UserTypeMiddleware>
+        </WithAuthMiddleware>
+    );
+}
+
+export async function getServerSideProps({req, locale}) {
+    const {isBot} = parse(req.headers["user-agent"]);
+    return {
+        props: {
+            messages: (await import(`&/locales/${locale}/app.json`)).default,
+            title: "LoanRequest.loan_request_page",
+            isBot,
+        },
+    };
+}

src/pages/dashboard/navgan/followUp-loan/index.jsx

@@ -1,11 +1,15 @@
-import LoanRequestComponent from "@/components/dashboard/loan-request";
 import WithAuthMiddleware from "@/middlewares/WithAuth";
 import {parse} from "next-useragent";
+import UserTypeMiddleware from "@/middlewares/UserType";
+import LoanFollowUpComponent from "@/components/dashboard/navgan/followUp-loan";
 
+const user_type = 1;
 export default function LoanRequest() {
     return (
         <WithAuthMiddleware>
-            <LoanRequestComponent/>
+            <UserTypeMiddleware user_type={user_type}>
+                <LoanFollowUpComponent/>
+            </UserTypeMiddleware>
         </WithAuthMiddleware>
     );
 }

src/pages/dashboard/refahi/add-request-loan/index.jsx

@@ -0,0 +1,26 @@
+import WithAuthMiddleware from "@/middlewares/WithAuth";
+import {parse} from "next-useragent";
+import UserTypeMiddleware from "@/middlewares/UserType";
+import LoanRequestComponent from "@/components/dashboard/refahi/add-request-loan";
+
+const user_type = 2;
+export default function LoanRequest() {
+    return (
+        <WithAuthMiddleware>
+            <UserTypeMiddleware user_type={user_type}>
+                <LoanRequestComponent/>
+            </UserTypeMiddleware>
+        </WithAuthMiddleware>
+    );
+}
+
+export async function getServerSideProps({req, locale}) {
+    const {isBot} = parse(req.headers["user-agent"]);
+    return {
+        props: {
+            messages: (await import(`&/locales/${locale}/app.json`)).default,
+            title: "LoanRequest.loan_request_page",
+            isBot,
+        },
+    };
+}

src/pages/dashboard/refahi/followUp-loan/index.jsx

@@ -1,11 +1,15 @@
-import LoanFollowUpComponent from "@/components/dashboard/loan-follow-up";
 import WithAuthMiddleware from "@/middlewares/WithAuth";
 import {parse} from "next-useragent";
+import UserTypeMiddleware from "@/middlewares/UserType";
+import LoanFollowUpComponent from "@/components/dashboard/refahi/followUp-loan";
 
-export default function LoanFollowUp() {
+const user_type = 2;
+export default function LoanRequest() {
     return (
         <WithAuthMiddleware>
-            <LoanFollowUpComponent/>
+            <UserTypeMiddleware user_type={user_type}>
+                <LoanFollowUpComponent/>
+            </UserTypeMiddleware>
         </WithAuthMiddleware>
     );
 }
@@ -15,7 +19,7 @@ export async function getServerSideProps({req, locale}) {
     return {
         props: {
             messages: (await import(`&/locales/${locale}/app.json`)).default,
-            title: "LoanFollowUp.loan_follow_up_page",
+            title: "LoanRequest.loan_request_page",
             isBot,
         },
     };