diff --git a/.gitignore b/.gitignore
index ccfafdc..a59383e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -31,4 +31,6 @@ cypress/screenshots
 .env
 .idea
 package-lock.json
-ecosystem.config
\ No newline at end of file
+ecosystem.config
+
+public/config.json
\ No newline at end of file
diff --git a/package.json b/package.json
index e44361c..9b8b7b0 100644
--- a/package.json
+++ b/package.json
@@ -16,7 +16,7 @@
     "@mui/icons-material": "^5.11.16",
     "@mui/lab": "^5.0.0-alpha.152",
     "@mui/material": "^5.12.0",
-    "@witel/webapp-builder": "^1.0.2",
+    "@witel/webapp-builder": "^1.0.6",
     "axios": "^1.4.0",
     "colord": "^2.9.3",
     "eslint": "8.36.0",
diff --git a/public/config.json.example b/public/config.json.example
new file mode 100644
index 0000000..59e8e23
--- /dev/null
+++ b/public/config.json.example
@@ -0,0 +1,36 @@
+{
+  "time_lines": {
+    "navgan_first_page": [
+      {
+        "date": {
+          "from": "1402/09/01",
+          "to": "1402/09/10"
+        },
+        "label": {
+          "primary": "ثبت نام متقاضی",
+          "secondary": "ثبت نام متقاضیان واجد شرایط"
+        }
+      },
+      {
+        "date": {
+          "from": "1402/09/15",
+          "to": "1402/11/10"
+        },
+        "label": {
+          "primary": "صحت سنجی متقاضیان",
+          "secondary": "بررسی و کارشناسی درخواست ها"
+        }
+      },
+      {
+        "date": {
+          "from": "1402/11/10",
+          "to": "1402/12/20"
+        },
+        "label": {
+          "primary": "ارجاع به بانک",
+          "secondary": "فرآیند معرفی ضامن و پرداخت"
+        }
+      }
+    ]
+  }
+}
\ No newline at end of file
diff --git a/public/locales/fa/app.json b/public/locales/fa/app.json
index 2eeb753..6978a5d 100644
--- a/public/locales/fa/app.json
+++ b/public/locales/fa/app.json
@@ -18,6 +18,7 @@
   "upload_file_text": "بارگذاری فایل",
   "online_message": "شما به اینترنت وصل هستید",
   "offline_message": "اتصال شما به اینترنت قطع شده است",
+  "routing_to": "در حال انتقال به صفحه",
   "header": {
     "open_profile": "پروفایل",
     "edit_profile": "ویرایش پروفایل",
diff --git a/src/components/first/LoanDescription/TimeLineDetails.jsx b/src/components/first/LoanDescription/TimeLineDetails.jsx
index 5feb4fe..d57064b 100644
--- a/src/components/first/LoanDescription/TimeLineDetails.jsx
+++ b/src/components/first/LoanDescription/TimeLineDetails.jsx
@@ -1,19 +1,74 @@
 import {useTranslations} from "next-intl";
+import {useEffect, useState} from "react";
+import {useRequest} from "@witel/webapp-builder";
+import TimelineManager from "@/core/components/timelines/timelineManager";
+import moment from "jalali-moment";
 import {Timeline} from "@mui/lab";
-import OpenTimeLine from "@/core/components/timelines/OpenTimeLine";
-import InProgressTimeLine from "@/core/components/timelines/InProgressTimeLine";
+import {LinearProgress} from "@mui/material";
 
 const TimeLineDetails = () => {
     const t = useTranslations();
+    const request = useRequest({notification: false, auth: false})
+    const [timeLineList, setTimeLineList] = useState([])
+    const [loading, setLoading] = useState(true)
+
+    useEffect(() => {
+        setLoading(true)
+        request(process.env.NEXT_PUBLIC_CONFIG_APP_URL, 'get').then(res => {
+            let tempArr = []
+            for (const timeLine of res.data.time_lines.navgan_first_page) {
+                let temp = {}
+                temp['label'] = timeLine.label
+                temp['date'] = moment(timeLine.date.from, 'jYYYY/jMM/jDD').locale('fa').format('jD jMMMM')
+                const fromDate = moment(timeLine.date.from, 'jYYYY/jMM/jDD')
+                const toDate = moment(timeLine.date.to, 'jYYYY/jMM/jDD')
+                const today = moment()
+                if (today.isBetween(fromDate, toDate, null, '[]')) {
+                    temp['status'] = 'in progress'
+                } else if (today.isAfter(toDate, null)) {
+                    temp['status'] = 'done'
+                } else if (today.isBefore(fromDate, null)) {
+                    temp['status'] = 'open'
+                }
+                tempArr.push(temp)
+            }
+            setTimeLineList(tempArr)
+            setLoading(false)
+        }).catch(() => {
+            setLoading(false)
+        })
+    }, []);
+
     return (
-        <Timeline position="alternate">
-            <InProgressTimeLine date={'10 دی'} primaryLabel={'ثبت نام متقاضی'}
-                                secondaryLabel={'ثبت نام متقاضیان واجد شرایط'}/>
-            <OpenTimeLine date={'10 بهمن'} primaryLabel={'صحت سنجی متقاضیان'}
-                          secondaryLabel={'بررسی و کارشناسی درخواست ها'}/>
-            <OpenTimeLine position={'end'} date={'10 اسفند'} primaryLabel={'ارجاع به بانک'}
-                          secondaryLabel={'فرآیند معرفی ضامن و پرداخت'}/>
-        </Timeline>
+        <>
+            {loading ? (
+                <LinearProgress/>
+            ) : (
+                <Timeline position="alternate">
+                    {timeLineList.map((timeLine, index) => (
+                        <TimelineManager
+                            key={index}
+                            status={timeLine.status}
+                            date={timeLine.dateLabel}
+                            primaryLabel={timeLine.label.primary}
+                            secondaryLabel={timeLine.label.secondary}
+                            position={index === (timeLineList.length - 1) ? 'end' : ''}
+                        />
+                    ))
+                    }
+                </Timeline>
+            )}
+        </>
     )
+    // return (
+    //     <Timeline position="alternate">
+    //         <InProgressTimeLine date={'10 دی'} primaryLabel={'ثبت نام متقاضی'}
+    //                             secondaryLabel={'ثبت نام متقاضیان واجد شرایط'}/>
+    //         <OpenTimeLine date={'10 بهمن'} primaryLabel={'صحت سنجی متقاضیان'}
+    //                       secondaryLabel={'بررسی و کارشناسی درخواست ها'}/>
+    //         <OpenTimeLine position={'end'} date={'10 اسفند'} primaryLabel={'ارجاع به بانک'}
+    //                       secondaryLabel={'فرآیند معرفی ضامن و پرداخت'}/>
+    //     </Timeline>
+    // )
 }
 export default TimeLineDetails
\ No newline at end of file
diff --git a/src/core/components/timelines/timelineManager.jsx b/src/core/components/timelines/timelineManager.jsx
new file mode 100644
index 0000000..292c3d1
--- /dev/null
+++ b/src/core/components/timelines/timelineManager.jsx
@@ -0,0 +1,16 @@
+import OpenTimeLine from "@/core/components/timelines/OpenTimeLine";
+import InProgressTimeLine from "@/core/components/timelines/InProgressTimeLine";
+import DoneTimeLine from "@/core/components/timelines/DoneTimeLine";
+
+const TimelineManager = (props) => {
+    switch (props.status) {
+        case 'open':
+            return <OpenTimeLine {...props} />
+        case 'in progress':
+            return <InProgressTimeLine {...props} />
+        case 'done':
+            return <DoneTimeLine {...props} />
+    }
+}
+
+export default TimelineManager
\ No newline at end of file
diff --git a/src/core/data/sidebarMenu.js b/src/core/data/sidebarMenu.js
index 1869bae..5f24a93 100644
--- a/src/core/data/sidebarMenu.js
+++ b/src/core/data/sidebarMenu.js
@@ -6,27 +6,30 @@ const sidebarMenu = [
     [
         {
             key: "sidebar.dashboard",
+            name: "sidebar.dashboard",
             type: "page",
             route: "/dashboard",
-            icon: <SpaceDashboardIcon/>,
+            icon: <SpaceDashboardIcon sx={{width: 'inherit', height: 'inherit'}}/>,
             selected: false,
-            permission_name: "all"
+            permission: "all"
         },
         {
             key: "sidebar.add-request-loan",
+            name: "sidebar.add-request-loan",
             type: "page",
             route: "/dashboard/navgan/add-request-loan",
-            icon: <DataSaverOnIcon/>,
+            icon: <DataSaverOnIcon sx={{width: 'inherit', height: 'inherit'}}/>,
             selected: false,
-            permission_name: "can_request_a_new_loan"
+            permission: "can_request_a_new_loan"
         },
         {
             key: "sidebar.followUp-loan",
+            name: "sidebar.followUp-loan",
             type: "page",
             route: "/dashboard/navgan/followUp-loan",
-            icon: <BookmarkAddedIcon/>,
+            icon: <BookmarkAddedIcon sx={{width: 'inherit', height: 'inherit'}}/>,
             selected: false,
-            permission_name: "all"
+            permission: "all"
         },
     ],
 ];
diff --git a/src/layouts/dashboard.jsx b/src/layouts/dashboard.jsx
index 945416c..9b1a916 100644
--- a/src/layouts/dashboard.jsx
+++ b/src/layouts/dashboard.jsx
@@ -1,13 +1,21 @@
-import {DashboardLayout as DashboardLayoutPure} from "@witel/webapp-builder";
+import {DashboardLayout as DashboardLayoutPure, useUser} from "@witel/webapp-builder";
 import headerProfileItems from "@/core/data/headerProfileItems";
 import sidebarMenu from "@/core/data/sidebarMenu";
 import {GET_SIDEBAR_NOTIFICATION} from "@/core/data/apiRoutes";
 
 const DashboardLayout = (props) => {
+    const {user} = useUser()
     return (
         <>
-            <DashboardLayoutPure headerProfileItems={headerProfileItems} sidebarMenu={sidebarMenu}
-                                 urlNotification={GET_SIDEBAR_NOTIFICATION} {...props} />
+            <DashboardLayoutPure
+                loginUrl={'/login'}
+                user_introduction={user.type_name}
+                headerProfileItems={headerProfileItems}
+                sidebarMenu={sidebarMenu}
+                urlNotification={GET_SIDEBAR_NOTIFICATION}
+                BC_segmentsToRemove={[]}
+                {...props}
+            />
         </>
     )
 }