diff --git a/public/locales/fa/app.json b/public/locales/fa/app.json
index fde5626..ec9cd67 100644
--- a/public/locales/fa/app.json
+++ b/public/locales/fa/app.json
@@ -355,6 +355,8 @@
     "text_field_province_id": "استان",
     "text_field_city_id": "شهر",
     "text_field_role_id": "نقش",
+    "text_field_loading_provinces_list": "درحال دریافت شهر ها",
+    "text_field_error_fetching_provinces": "خطا در دریافت شهر ها",
     "text_field_please_select_province": "ابتدا استان خود را انتخاب کنید",
     "text_field_loading_cities_list": "درحال دریافت شهر ها",
     "text_field_error_fetching_cities": "خطا در دریافت شهر ها",
diff --git a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent.jsx b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent.jsx
index 82d8a58..80795ae 100644
--- a/src/components/dashboard/expert-management/Form/CreateForm/CreateContent.jsx
+++ b/src/components/dashboard/expert-management/Form/CreateForm/CreateContent.jsx
@@ -17,29 +17,17 @@ import {useFormik} from "formik";
 import {useTranslations} from "next-intl";
 import * as Yup from "yup";
 import {useEffect, useState} from "react";
-import {CREATE_EXPERT_MANAGEMENT, GET_CITY_LIST, GET_PROVINCE_LIST, GET_ROLE_LIST} from "@/core/data/apiRoutes";
+import {CREATE_EXPERT_MANAGEMENT, GET_CITY_LIST, GET_ROLE_LIST} from "@/core/data/apiRoutes";
 import useRequest from "@/lib/app/hooks/useRequest";
+import useProvince from "@/lib/app/hooks/useProvince";
 
 const CreateContent = ({setOpenCreateDialog, mutate, fetchUrl}) => {
     const t = useTranslations();
     const requestServer = useRequest()
-    const [provinceList, setProvinceList] = useState([]);
     const [cityList, setCityList] = useState([]);
     const [roleList, setRoleList] = useState([]);
     const [cityTextField, setCityTextField] = useState(t("ExpertMangement.text_field_please_select_province"));
-
-    useEffect(() => {
-        requestServer(GET_PROVINCE_LIST, "get", {auth: true, notification: false})
-            .then(({data}) => {
-                const formattedData = data.map((province, index) => ({
-                    id: index,
-                    name: province.name,
-                    value: province.id,
-                }));
-                setProvinceList(formattedData);
-            }).catch(() => {
-        });
-    }, []);
+    const {provinceList, isLoadingProvinceList, errorProvinceList} = useProvince();
 
     useEffect(() => {
         requestServer(GET_ROLE_LIST, "get", {auth: true, notification: false})
@@ -255,6 +243,7 @@ const CreateContent = ({setOpenCreateDialog, mutate, fetchUrl}) => {
                             <InputLabel>{t("ExpertMangement.text_field_province_id")}</InputLabel>
                             <Select
                                 name="province_id"
+                                disabled={isLoadingProvinceList || errorProvinceList}
                                 label={t("ExpertMangement.text_field_province_id")}
                                 value={formik.values.province_id}
                                 onChange={(e) => {
@@ -265,11 +254,21 @@ const CreateContent = ({setOpenCreateDialog, mutate, fetchUrl}) => {
                                 fullWidth
                                 variant="outlined"
                             >
-                                {provinceList.map((item) => (
-                                    <MenuItem key={item.value} value={item.value}>
-                                        {item.name}
+                                {isLoadingProvinceList ? (
+                                    <MenuItem>
+                                        {t("ExpertMangement.text_field_loading_provinces_list")}
                                     </MenuItem>
-                                ))}
+                                ) : errorProvinceList ? (
+                                    <MenuItem>
+                                        {t("ExpertMangement.text_field_error_fetching_provinces")}
+                                    </MenuItem>
+                                ) : (
+                                    provinceList.map((item) => (
+                                        <MenuItem key={item.id} value={item.id}>
+                                            {item.name}
+                                        </MenuItem>
+                                    ))
+                                )}
                             </Select>
                             <FormHelperText>
                                 {formik.touched.province_id && formik.errors.province_id ? formik.errors.province_id : ""}
diff --git a/src/components/dashboard/expert-management/Form/UpdateForm/UpdateContent.jsx b/src/components/dashboard/expert-management/Form/UpdateForm/UpdateContent.jsx
index 39a8a6b..3fa43a9 100644
--- a/src/components/dashboard/expert-management/Form/UpdateForm/UpdateContent.jsx
+++ b/src/components/dashboard/expert-management/Form/UpdateForm/UpdateContent.jsx
@@ -19,28 +19,17 @@ import {useFormik} from "formik";
 import {GET_CITY_LIST, GET_PROVINCE_LIST, GET_ROLE_LIST, UPDATE_EXPERT_MANAGEMENT} from "@/core/data/apiRoutes";
 import * as Yup from "yup";
 import useRequest from "@/lib/app/hooks/useRequest";
+import useProvince from "@/lib/app/hooks/useProvince";
 
 
 const UpdateContent = ({row, fetchUrl, mutate, setOpenUpdateDialog}) => {
     const t = useTranslations();
     const requestServer = useRequest();
-    const [provinceList, setProvinceList] = useState([]);
+    // const [provinceList, setProvinceList] = useState([]);
     const [cityList, setCityList] = useState([]);
     const [roleList, setRoleList] = useState([]);
     const [cityTextField, setCityTextField] = useState(t("ExpertMangement.text_field_please_select_province"));
-
-    useEffect(() => {
-        requestServer(GET_PROVINCE_LIST, "get", {auth: true, notification: false})
-            .then(({data}) => {
-                const formattedData = data.map((province, index) => ({
-                    id: index,
-                    name: province.name,
-                    value: province.id,
-                }));
-                setProvinceList(formattedData);
-            }).catch(() => {
-        });
-    }, []);
+    const {provinceList, isLoadingProvinceList, errorProvinceList} = useProvince();
 
     useEffect(() => {
         requestServer(GET_ROLE_LIST, "get", {auth: true, notification: false})
@@ -247,11 +236,21 @@ const UpdateContent = ({row, fetchUrl, mutate, setOpenUpdateDialog}) => {
                                 fullWidth
                                 variant="outlined"
                             >
-                                {provinceList.map((item) => (
-                                    <MenuItem key={item.value} value={item.value}>
-                                        {item.name}
+                                {isLoadingProvinceList ? (
+                                    <MenuItem>
+                                        {t("ExpertMangement.text_field_loading_provinces_list")}
                                     </MenuItem>
-                                ))}
+                                ) : errorProvinceList ? (
+                                    <MenuItem>
+                                        {t("ExpertMangement.text_field_error_fetching_provinces")}
+                                    </MenuItem>
+                                ) : (
+                                    provinceList.map((item) => (
+                                        <MenuItem key={item.id} value={item.id}>
+                                            {item.name}
+                                        </MenuItem>
+                                    ))
+                                )}
                             </Select>
                             <FormHelperText>
                                 {formik.touched.province_id && formik.errors.province_id ? formik.errors.province_id : ""}
diff --git a/src/lib/app/hooks/useProvince.jsx b/src/lib/app/hooks/useProvince.jsx
new file mode 100644
index 0000000..d0fbda0
--- /dev/null
+++ b/src/lib/app/hooks/useProvince.jsx
@@ -0,0 +1,29 @@
+import {GET_PROVINCE_LIST} from "@/core/data/apiRoutes";
+import useRequest from "@/lib/app/hooks/useRequest";
+import useSWR from "swr";
+
+const useProvince = () => {
+    const requestServer = useRequest({auth: true, notification: false})
+
+    //swr config
+    const fetcher = (...args) => {
+        return requestServer(args, 'get').then(({data}) => {
+            return data;
+        }).catch(() => {
+        })
+    };
+
+    const {data, isLoading} = useSWR(GET_PROVINCE_LIST, fetcher, {
+        revalidateIfStale: false,
+        revalidateOnFocus: false,
+        revalidateOnReconnect: false
+    });
+
+    return {
+        provinceList: data,
+        isLoadingProvinceList: isLoading,
+        errorProvinceList: !data
+    }
+};
+
+export default useProvince;
\ No newline at end of file