diff --git a/src/components/dashboard/change-password/index.jsx b/src/components/dashboard/change-password/index.jsx
index 74896a6..7f21558 100644
--- a/src/components/dashboard/change-password/index.jsx
+++ b/src/components/dashboard/change-password/index.jsx
@@ -1,18 +1,15 @@
 import CenterLayout from "@/layouts/CenterLayout";
-import DashboardLayout from "@/layouts/DashboardLayout";
 import {Container} from "@mui/material";
 import ChangePasswordForm from "@/components/dashboard/change-password/change-password-form";
 
 const DashboardChangePasswordComponent = () => {
 
     return (
-        <DashboardLayout>
-            <CenterLayout>
-                <Container maxWidth="sm">
-                    <ChangePasswordForm />
-                </Container>
-            </CenterLayout>
-        </DashboardLayout>
+        <CenterLayout>
+            <Container maxWidth="sm">
+                <ChangePasswordForm/>
+            </Container>
+        </CenterLayout>
     );
 };
 export default DashboardChangePasswordComponent;
diff --git a/src/components/dashboard/edit-profile/index.jsx b/src/components/dashboard/edit-profile/index.jsx
index d15d467..af9a869 100644
--- a/src/components/dashboard/edit-profile/index.jsx
+++ b/src/components/dashboard/edit-profile/index.jsx
@@ -1,6 +1,5 @@
 import StyledForm from "@/core/components/StyledForm";
 import CenterLayout from "@/layouts/CenterLayout";
-import DashboardLayout from "@/layouts/DashboardLayout";
 import useUser from "@/lib/app/hooks/useUser";
 import {Box, Container, Grid, Paper, Stack, TextField, Typography,} from "@mui/material";
 import * as Yup from "yup";
@@ -50,148 +49,146 @@ const DashboardEditProfile = () => {
     const validationSchema = Yup.object().shape({});
 
     return (
-        <DashboardLayout>
-            <CenterLayout>
-                <Container maxWidth="sm">
-                    <Formik
-                        initialValues={initialValues}
-                        onSubmit={handleSubmit}
-                        validationSchema={validationSchema}
-                    >
-                        {(props) => (
-                            <StyledForm
-                                onSubmit={(e) => {
-                                    e.preventDefault();
-                                    props.handleSubmit();
-                                }}
-                            >
-                                <Paper elevation={0}>
-                                    <Stack spacing={3} sx={{p: 5}} component="div">
-                                        <Typography margin={2} variant="h4" textAlign="center">
-                                            {t("UpdateProfile.typography_edit_profile")}
-                                        </Typography>
-                                        <Box
-                                            sx={{
-                                                display: "flex",
-                                                flexDirection: "column",
-                                                alignItems: "center",
-                                                justifyContent: "center",
-                                            }}
-                                        >
-                                            <AvatarUpload
-                                                user={user}
-                                                setFieldValue={props.setFieldValue}
-                                                valueAvatar="expert_avatar"
-                                                changeFlag="change_avatar"
+        <CenterLayout>
+            <Container maxWidth="sm">
+                <Formik
+                    initialValues={initialValues}
+                    onSubmit={handleSubmit}
+                    validationSchema={validationSchema}
+                >
+                    {(props) => (
+                        <StyledForm
+                            onSubmit={(e) => {
+                                e.preventDefault();
+                                props.handleSubmit();
+                            }}
+                        >
+                            <Paper elevation={0}>
+                                <Stack spacing={3} sx={{p: 5}} component="div">
+                                    <Typography margin={2} variant="h4" textAlign="center">
+                                        {t("UpdateProfile.typography_edit_profile")}
+                                    </Typography>
+                                    <Box
+                                        sx={{
+                                            display: "flex",
+                                            flexDirection: "column",
+                                            alignItems: "center",
+                                            justifyContent: "center",
+                                        }}
+                                    >
+                                        <AvatarUpload
+                                            user={user}
+                                            setFieldValue={props.setFieldValue}
+                                            valueAvatar="expert_avatar"
+                                            changeFlag="change_avatar"
+                                        />
+                                    </Box>
+                                    <Grid container spacing={2} sx={{pb: 2}}>
+                                        <Grid item xs={12} sm={6}>
+                                            <Field
+                                                as={TextField}
+                                                name="username"
+                                                label={t("UpdateProfile.text_field_username")}
+                                                variant="outlined"
+                                                margin="normal"
+                                                size="small"
+                                                disabled={true}
+                                                error={!!(props.touched.username && props.errors.username)}
+                                                helperText={
+                                                    props.touched.username
+                                                        ? props.errors.username
+                                                        : null
+                                                }
+                                                sx={{
+                                                    width: "100%",
+                                                }}
                                             />
-                                        </Box>
-                                        <Grid container spacing={2} sx={{pb: 2}}>
-                                            <Grid item xs={12} sm={6}>
-                                                <Field
-                                                    as={TextField}
-                                                    name="username"
-                                                    label={t("UpdateProfile.text_field_username")}
-                                                    variant="outlined"
-                                                    margin="normal"
-                                                    size="small"
-                                                    disabled={true}
-                                                    error={!!(props.touched.username && props.errors.username)}
-                                                    helperText={
-                                                        props.touched.username
-                                                            ? props.errors.username
-                                                            : null
-                                                    }
-                                                    sx={{
-                                                        width: "100%",
-                                                    }}
-                                                />
-                                            </Grid>
-                                            <Grid item xs={12} sm={6}>
-                                                <Field
-                                                    as={TextField}
-                                                    name="name"
-                                                    label={t("UpdateProfile.text_field_name")}
-                                                    variant="outlined"
-                                                    margin="normal"
-                                                    size="small"
-                                                    disabled={true}
-                                                    error={!!(props.touched.name && props.errors.name)}
-                                                    helperText={
-                                                        props.touched.name ? props.errors.name : null
-                                                    }
-                                                    sx={{
-                                                        width: "100%",
-                                                    }}
-                                                />
-                                            </Grid>
-                                            <Grid item xs={12} sm={6}>
-                                                <Field
-                                                    as={TextField}
-                                                    name="email"
-                                                    label={t("UpdateProfile.text_field_email")}
-                                                    variant="outlined"
-                                                    margin="normal"
-                                                    size="small"
-                                                    disabled={true}
-                                                    error={!!(props.touched.email && props.errors.email)}
-                                                    helperText={
-                                                        props.touched.email ? props.errors.email : null
-                                                    }
-                                                    sx={{
-                                                        width: "100%",
-                                                    }}
-                                                />
-                                            </Grid>
-
-                                            <Grid item xs={12} sm={6}>
-                                                <Field
-                                                    as={TextField}
-                                                    name="province_name"
-                                                    label={t("UpdateProfile.text_field_province_name")}
-                                                    variant="outlined"
-                                                    margin="normal"
-                                                    size="small"
-                                                    disabled={true}
-                                                    error={!!(props.touched.province_name && props.errors.province_name)}
-                                                    helperText={
-                                                        props.touched.province_name
-                                                            ? props.errors.province_name
-                                                            : null
-                                                    }
-                                                    sx={{
-                                                        width: "100%",
-                                                    }}
-                                                />
-                                            </Grid>
-                                            <Grid item xs={12} sm={6}>
-                                                <Field
-                                                    as={TextField}
-                                                    name="position"
-                                                    label={t("UpdateProfile.text_field_position")}
-                                                    variant="outlined"
-                                                    margin="normal"
-                                                    size="small"
-                                                    disabled={true}
-                                                    error={!!(props.touched.position && props.errors.position)}
-                                                    helperText={
-                                                        props.touched.position
-                                                            ? props.errors.position
-                                                            : null
-                                                    }
-                                                    sx={{
-                                                        width: "100%",
-                                                    }}
-                                                />
-                                            </Grid>
                                         </Grid>
-                                    </Stack>
-                                </Paper>
-                            </StyledForm>
-                        )}
-                    </Formik>
-                </Container>
-            </CenterLayout>
-        </DashboardLayout>
+                                        <Grid item xs={12} sm={6}>
+                                            <Field
+                                                as={TextField}
+                                                name="name"
+                                                label={t("UpdateProfile.text_field_name")}
+                                                variant="outlined"
+                                                margin="normal"
+                                                size="small"
+                                                disabled={true}
+                                                error={!!(props.touched.name && props.errors.name)}
+                                                helperText={
+                                                    props.touched.name ? props.errors.name : null
+                                                }
+                                                sx={{
+                                                    width: "100%",
+                                                }}
+                                            />
+                                        </Grid>
+                                        <Grid item xs={12} sm={6}>
+                                            <Field
+                                                as={TextField}
+                                                name="email"
+                                                label={t("UpdateProfile.text_field_email")}
+                                                variant="outlined"
+                                                margin="normal"
+                                                size="small"
+                                                disabled={true}
+                                                error={!!(props.touched.email && props.errors.email)}
+                                                helperText={
+                                                    props.touched.email ? props.errors.email : null
+                                                }
+                                                sx={{
+                                                    width: "100%",
+                                                }}
+                                            />
+                                        </Grid>
+
+                                        <Grid item xs={12} sm={6}>
+                                            <Field
+                                                as={TextField}
+                                                name="province_name"
+                                                label={t("UpdateProfile.text_field_province_name")}
+                                                variant="outlined"
+                                                margin="normal"
+                                                size="small"
+                                                disabled={true}
+                                                error={!!(props.touched.province_name && props.errors.province_name)}
+                                                helperText={
+                                                    props.touched.province_name
+                                                        ? props.errors.province_name
+                                                        : null
+                                                }
+                                                sx={{
+                                                    width: "100%",
+                                                }}
+                                            />
+                                        </Grid>
+                                        <Grid item xs={12} sm={6}>
+                                            <Field
+                                                as={TextField}
+                                                name="position"
+                                                label={t("UpdateProfile.text_field_position")}
+                                                variant="outlined"
+                                                margin="normal"
+                                                size="small"
+                                                disabled={true}
+                                                error={!!(props.touched.position && props.errors.position)}
+                                                helperText={
+                                                    props.touched.position
+                                                        ? props.errors.position
+                                                        : null
+                                                }
+                                                sx={{
+                                                    width: "100%",
+                                                }}
+                                            />
+                                        </Grid>
+                                    </Grid>
+                                </Stack>
+                            </Paper>
+                        </StyledForm>
+                    )}
+                </Formik>
+            </Container>
+        </CenterLayout>
     );
 };
 
diff --git a/src/components/dashboard/expert-management/index.jsx b/src/components/dashboard/expert-management/index.jsx
index 632d89b..cd90e4f 100644
--- a/src/components/dashboard/expert-management/index.jsx
+++ b/src/components/dashboard/expert-management/index.jsx
@@ -1,11 +1,8 @@
-import DashboardLayouts from "@/layouts/DashboardLayout";
 import ExpertManagementDataTable from "@/components/dashboard/expert-management/DataTable";
 
 function DashboardExpertManagementComponent() {
     return (
-        <DashboardLayouts>
-            <ExpertManagementDataTable/>
-        </DashboardLayouts>
+        <ExpertManagementDataTable/>
     );
 }
 
diff --git a/src/components/dashboard/first/index.jsx b/src/components/dashboard/first/index.jsx
index 841d677..02e5672 100644
--- a/src/components/dashboard/first/index.jsx
+++ b/src/components/dashboard/first/index.jsx
@@ -1,7 +1,5 @@
-import DashboardLayout from "@/layouts/DashboardLayout";
-
 const DashboardFirstComponent = () => {
-    return <DashboardLayout></DashboardLayout>;
+    return <></>;
 };
 
 export default DashboardFirstComponent;
diff --git a/src/components/dashboard/role-management/index.jsx b/src/components/dashboard/role-management/index.jsx
index 6376b30..fac37e2 100644
--- a/src/components/dashboard/role-management/index.jsx
+++ b/src/components/dashboard/role-management/index.jsx
@@ -1,12 +1,8 @@
 import RoleManagementComponent from "@/components/dashboard/role-management/RoleManagementComponent";
-import DashboardLayout from "@/layouts/DashboardLayout";
-import moment from "jalali-moment";
 
 function DashboardRoleManagementComponent() {
     return (
-        <DashboardLayout>
-            <RoleManagementComponent />
-        </DashboardLayout>
+        <RoleManagementComponent/>
     );
 }
 
diff --git a/src/components/layouts/Dashboard/CallWidget/CallWidgetDialog/CallTabs/index.jsx b/src/components/layouts/Dashboard/CallWidget/CallWidgetDialog/CallTabs/index.jsx
index 8a96506..975a8b7 100644
--- a/src/components/layouts/Dashboard/CallWidget/CallWidgetDialog/CallTabs/index.jsx
+++ b/src/components/layouts/Dashboard/CallWidget/CallWidgetDialog/CallTabs/index.jsx
@@ -1,6 +1,6 @@
 import CallTabPanel from "@/components/layouts/Dashboard/CallWidget/CallWidgetDialog/CallTabs/CallTabPanel";
 import useAnswers from "@/lib/callWidget/hooks/useAnswers";
-import CallTabsList from "src/components/layouts/Dashboard/CallWidget/CallWidgetDialog/CallTabs/CallTabsList";
+import CallTabsList from "@/components/layouts/Dashboard/CallWidget/CallWidgetDialog/CallTabs/CallTabsList";
 
 const CallTabs = () => {
     const {answersList} = useAnswers()
diff --git a/src/components/layouts/Dashboard/index.jsx b/src/components/layouts/Dashboard/index.jsx
index 3ee24c6..de3b229 100644
--- a/src/components/layouts/Dashboard/index.jsx
+++ b/src/components/layouts/Dashboard/index.jsx
@@ -1,9 +1,10 @@
-import Header from "src/components/layouts/Dashboard/Header";
-import Sidebar from "src/components/layouts/Dashboard/Sidebar";
 import FullPageLayout from "@/layouts/FullPageLayout";
 import {Toolbar} from "@mui/material";
-import BreadCrumbs from "src/components/layouts/Dashboard/Breadcrumbs";
 import {useState} from "react";
+import RolePermissionMiddleware from "@/middlewares/RolePermission";
+import Header from "@/components/layouts/Dashboard/Header";
+import Sidebar from "@/components/layouts/Dashboard/Sidebar";
+import BreadCrumbs from "@/components/layouts/Dashboard/Breadcrumbs";
 
 const drawerWidth = 240;
 
@@ -34,8 +35,10 @@ const Dashboard = (props) => {
             >
                 <Toolbar/>
                 <FullPageLayout sx={{mt: 3}}>
-                    <BreadCrumbs isVisible={true}/>
-                    {props.children}
+                    <RolePermissionMiddleware requiredPermissions={props.permissions}>
+                        <BreadCrumbs isVisible={true}/>
+                        {props.children}
+                    </RolePermissionMiddleware>
                 </FullPageLayout>
             </FullPageLayout>
         </FullPageLayout>
diff --git a/src/layouts/DashboardLayout.jsx b/src/layouts/DashboardLayout.jsx
index 72344d6..668f9d8 100644
--- a/src/layouts/DashboardLayout.jsx
+++ b/src/layouts/DashboardLayout.jsx
@@ -1,16 +1,17 @@
-import Dashboard from "src/components/layouts/Dashboard";
 import AppPermission from "@/middlewares/AppPermission";
 import CallWidget from "@/components/layouts/Dashboard/CallWidget";
+import WithAuthMiddleware from "@/middlewares/WithAuth";
+import Dashboard from "@/components/layouts/Dashboard";
 
 const DashboardLayout = (props) => {
     const permissions = ["NEXT_PUBLIC_HAS_WIDGET"];
     return (
-        <>
+        <WithAuthMiddleware>
             <Dashboard {...props}/>
             <AppPermission permissions={permissions}>
-                <CallWidget />
+                <CallWidget/>
             </AppPermission>
-        </>
+        </WithAuthMiddleware>
     );
 };
 
diff --git a/src/layouts/index.jsx b/src/layouts/index.jsx
new file mode 100644
index 0000000..a620a0e
--- /dev/null
+++ b/src/layouts/index.jsx
@@ -0,0 +1,20 @@
+import DashboardLayout from "@/layouts/DashboardLayout";
+import {Fragment} from "react";
+
+const layoutList = {
+    DashboardLayout
+}
+
+const Layout = ({layout, children}) => {
+
+    const Component = layoutList[layout?.name] || Fragment
+    const props = layout?.props || {}
+
+    return (
+        <Component {...props}>
+            {children}
+        </Component>
+    )
+}
+
+export default Layout
\ No newline at end of file
diff --git a/src/middlewares/RolePermission.jsx b/src/middlewares/RolePermission.jsx
index 4b1cc8a..c546220 100644
--- a/src/middlewares/RolePermission.jsx
+++ b/src/middlewares/RolePermission.jsx
@@ -1,14 +1,14 @@
 import useUser from "@/lib/app/hooks/useUser";
 import RolePermissionComponent from "@/core/components/Middleware/RolePermissionComponent";
 
-const RolePermissionMiddleware = ({children, requiredPermissions}) => {
+const RolePermissionMiddleware = ({children, requiredPermissions = []}) => {
     const {user} = useUser();
 
-    const hasPermission = requiredPermissions.some((permission) =>
+    const hasPermission = requiredPermissions.length === 0 ? true : requiredPermissions.some((permission) =>
         user?.permissions?.includes(permission)
     );
 
-    return !hasPermission ? <RolePermissionComponent /> : <>{children}</>;
+    return !hasPermission ? <RolePermissionComponent/> : <>{children}</>;
 };
 
 export default RolePermissionMiddleware;
diff --git a/src/pages/_app.jsx b/src/pages/_app.jsx
index 2d23745..c7b75d4 100644
--- a/src/pages/_app.jsx
+++ b/src/pages/_app.jsx
@@ -9,6 +9,7 @@ import {NextIntlProvider} from "next-intl";
 import TitlePage from "@/core/components/TitlePage";
 import {SocketProvider} from "@/lib/app/contexts/socket";
 import {ToastProvider} from "@/lib/app/contexts/toast";
+import Layout from "@/layouts";
 
 const App = ({Component, pageProps}) => {
 
@@ -22,7 +23,9 @@ const App = ({Component, pageProps}) => {
                             <ToastProvider>
                                 <AppLayout isBot={pageProps.isBot}>
                                     <SocketProvider>
-                                        <Component {...pageProps} />
+                                        <Layout layout={pageProps.layout}>
+                                            <Component {...pageProps} />
+                                        </Layout>
                                     </SocketProvider>
                                 </AppLayout>
                             </ToastProvider>
diff --git a/src/pages/dashboard/change-password/index.jsx b/src/pages/dashboard/change-password/index.jsx
index f744382..ef75fb7 100644
--- a/src/pages/dashboard/change-password/index.jsx
+++ b/src/pages/dashboard/change-password/index.jsx
@@ -1,12 +1,9 @@
 import DashboardChangePasswordComponent from "@/components/dashboard/change-password";
-import WithAuthMiddleware from "@/middlewares/WithAuth";
 import {parse} from "next-useragent";
 
 export default function LoanFollowUp() {
     return (
-        <WithAuthMiddleware>
-            <DashboardChangePasswordComponent/>
-        </WithAuthMiddleware>
+        <DashboardChangePasswordComponent/>
     );
 }
 
@@ -17,7 +14,8 @@ export async function getServerSideProps({req, locale}) {
             messages: (await import(`&/locales/${locale}/app.json`)).default,
             title: "Dashboard.change_password",
             isBot,
-            locale
+            locale,
+            layout: {name: 'DashboardLayout'}
         },
     };
 }
diff --git a/src/pages/dashboard/edit-profile/index.jsx b/src/pages/dashboard/edit-profile/index.jsx
index dfa2eec..032a607 100644
--- a/src/pages/dashboard/edit-profile/index.jsx
+++ b/src/pages/dashboard/edit-profile/index.jsx
@@ -1,12 +1,9 @@
 import DashboardEditProfile from "@/components/dashboard/edit-profile";
-import WithAuthMiddleware from "@/middlewares/WithAuth";
 import {parse} from "next-useragent";
 
 export default function LoanFollowUp() {
     return (
-        <WithAuthMiddleware>
-            <DashboardEditProfile/>
-        </WithAuthMiddleware>
+        <DashboardEditProfile/>
     );
 }
 
@@ -17,7 +14,8 @@ export async function getServerSideProps({req, locale}) {
             messages: (await import(`&/locales/${locale}/app.json`)).default,
             title: "Dashboard.edit_profile",
             isBot,
-            locale
+            locale,
+            layout: {name: 'DashboardLayout'}
         },
     };
 }
diff --git a/src/pages/dashboard/expert-management/index.jsx b/src/pages/dashboard/expert-management/index.jsx
index 9a3f5f0..2daf0bb 100644
--- a/src/pages/dashboard/expert-management/index.jsx
+++ b/src/pages/dashboard/expert-management/index.jsx
@@ -1,16 +1,9 @@
-import WithAuthMiddleware from "@/middlewares/WithAuth";
 import {parse} from "next-useragent";
 import DashboardExpertManagementComponent from "@/components/dashboard/expert-management";
-import RolePermissionMiddleware from "@/middlewares/RolePermission";
 
-const requiredPermissions = ["manage_users"];
 export default function ExpertManagement() {
     return (
-        <WithAuthMiddleware>
-            <RolePermissionMiddleware requiredPermissions={requiredPermissions}>
-                <DashboardExpertManagementComponent/>
-            </RolePermissionMiddleware>
-        </WithAuthMiddleware>
+        <DashboardExpertManagementComponent/>
     );
 }
 
@@ -21,7 +14,8 @@ export async function getServerSideProps({req, locale}) {
             messages: (await import(`&/locales/${locale}/app.json`)).default,
             title: "Dashboard.expert_management",
             isBot,
-            locale
+            locale,
+            layout: {name: 'DashboardLayout', props: {permissions: ["manage_users"]}}
         },
     };
 }
diff --git a/src/pages/dashboard/index.jsx b/src/pages/dashboard/index.jsx
index eed56eb..0e309c3 100644
--- a/src/pages/dashboard/index.jsx
+++ b/src/pages/dashboard/index.jsx
@@ -1,12 +1,9 @@
 import DashboardFirstComponent from "@/components/dashboard/first";
-import WithAuthMiddleware from "@/middlewares/WithAuth";
 import {parse} from "next-useragent";
 
 export default function Dashboard() {
     return (
-        <WithAuthMiddleware>
-            <DashboardFirstComponent/>
-        </WithAuthMiddleware>
+        <DashboardFirstComponent/>
     );
 }
 
@@ -17,7 +14,8 @@ export async function getServerSideProps({req, locale}) {
             messages: (await import(`&/locales/${locale}/app.json`)).default,
             title: "Dashboard.dashboard_page",
             isBot,
-            locale
+            locale,
+            layout: {name: 'DashboardLayout'}
         },
     };
 }
diff --git a/src/pages/dashboard/role-management/index.jsx b/src/pages/dashboard/role-management/index.jsx
index fa2bedb..7ae6d45 100644
--- a/src/pages/dashboard/role-management/index.jsx
+++ b/src/pages/dashboard/role-management/index.jsx
@@ -1,16 +1,9 @@
-import RolePermissionMiddleware from "@/middlewares/RolePermission";
-import WithAuthMiddleware from "@/middlewares/WithAuth";
 import {parse} from "next-useragent";
 import DashboardRoleManagementComponent from "@/components/dashboard/role-management";
 
-const requiredPermissions = ["manage_roles"];
 export default function RoleManagement() {
     return (
-        <WithAuthMiddleware>
-            <RolePermissionMiddleware requiredPermissions={requiredPermissions}>
-                <DashboardRoleManagementComponent/>
-            </RolePermissionMiddleware>
-        </WithAuthMiddleware>
+        <DashboardRoleManagementComponent/>
     );
 }
 
@@ -21,7 +14,8 @@ export async function getServerSideProps({req, locale}) {
             messages: (await import(`&/locales/${locale}/app.json`)).default,
             title: "Dashboard.role_management_page",
             isBot,
-            locale
+            locale,
+            layout: {name: 'DashboardLayout', props: {permissions: ["manage_roles"]}}
         },
     };
 }