Merge branch 'develop' of https://gitlab.com/witel-front-end/loan-facilities/expert into develop

public/locales/fa/app.json

@@ -628,6 +628,7 @@
     "choose_year": "انتخاب سال",
     "provinces": "استان های",
     "province": "استان",
+    "all_provinces": "تمامی استان ها",
     "year": "سال",
     "years": "سال های",
     "text_field_loading_provinces_list": "درحال دریافت استان ها",

src/components/dashboard/reports/Filter/ProvinceFilter.jsx

@@ -24,22 +24,21 @@ const ProvinceFilter = ({formik, multiple, setFilteredText}) => {
     const t = useTranslations();
     const provinceChange = (event) => {
         const {target: {value}} = event;
-        formik.handleChange(event);
         formik.setFieldValue('province_id', value);
         if (Array.isArray(value)) {
-            const province_names = []
+            const province_names = [];
             value.map((item) => {
                 province_names.push(provinceList.find(province => province.id === item).name)
             })
             setFilteredText(prevState => ({
                 ...prevState,
-                province: province_names.length !== 0 ? `| ${t("filters.provinces")}: ${province_names.join(' , ')}` : ""
+                province: province_names.length !== 0 ? `${t("filters.provinces")}: ${province_names.join(' , ')}` : ""
             }));
         } else {
             const selectedProvince = provinceList.find(province => province.id === value);
             setFilteredText(prevState => ({
                 ...prevState,
-                province: `| ${t("filters.province")}: ${selectedProvince.name}`
+                province: `${t("filters.province")}: ${selectedProvince.name}`
             }));
         }
     };
@@ -78,10 +77,10 @@ const ProvinceFilter = ({formik, multiple, setFilteredText}) => {
                     !needAdorment ?
                         <InputAdornment position="end" sx={{mr: 2}}>
                             <IconButton
-                                onClick={() => multiple
-                                    ? formik.setFieldValue('province_id', [])
-                                    : formik.setFieldValue('province_id', "")
-                                }
+                                onClick={() => {
+                                    multiple ? formik.setFieldValue('province_id', []) : formik.setFieldValue('province_id', "")
+                                    setFilteredText(prevState => ({...prevState, province: t("filters.all_provinces")}))
+                                }}
                                 size="small">
                                 <ClearIcon/>
                             </IconButton>

src/components/dashboard/reports/Filter/index.jsx

@@ -25,8 +25,12 @@ const Filter = ({title, filterItem, setFilterOption, isLoadingReportList, mutate
     const t = useTranslations();
     const filter_by_province = filterItem.find((item) => item.type === "province");
     const filter_by_year = filterItem.find((item) => item.type === "year");
-    const [expanded, setExpanded] = useState(false);
-    const [filteredText, setFilteredText] = useState({province: "", year: ""});
+    const [expanded, setExpanded] = useState(true);
+    const [filteredText, setFilteredText] = useState({
+        ...(filter_by_province ? {province: t("filters.all_provinces")} : {}),
+        ...(filter_by_year ? {year: ""} : {})
+    });
+    const [textFilter, setTextFilter] = useState()
     const [stepValue, setStepValue] = useState({
         ...(filter_by_year && {
             date: filter_by_year.multiple ? [] : `${moment().format('jYYYY')}`
@@ -55,10 +59,15 @@ const Filter = ({title, filterItem, setFilterOption, isLoadingReportList, mutate
                             : []
                 ),
             ].filter(Boolean);
-            setFilterOption(fields)
+            setFilterOption(fields);
+            textMaker();
         },
     });
 
+    const textMaker = (() => {
+        setTextFilter(`| ${Object.values(filteredText).join(", ")}`)
+    });
+
     useEffect(() => {
         const province = formik.values.province_id;
         const fields = [
@@ -73,6 +82,7 @@ const Filter = ({title, filterItem, setFilterOption, isLoadingReportList, mutate
                         : []
             ),
         ].filter(Boolean);
+        setTextFilter(`| ${Object.values(filteredText).join(", ")}`)
     }, []);
 
     return (
@@ -89,7 +99,7 @@ const Filter = ({title, filterItem, setFilterOption, isLoadingReportList, mutate
                         <EqualizerIcon sx={{color: "primary.main"}}/>
                         <Typography sx={{fontWeight: 500, color: "primary.main"}}>{title}</Typography>
                         <Typography variant="caption" sx={{fontWeight: 500}} color="error">
-                            {filteredText.province} {filteredText.year}
+                            {textFilter}
                         </Typography>
                     </Box>
                     <Box>