fixed bug

src/components/dashboard/roadItems/operator/OperatorList.jsx

@@ -128,8 +128,8 @@ const OperatorList = () => {
                                         props.dependencyFieldValue.value === ""
                                             ? "empty"
                                             : loadingSubItemsList
-                                                ? "loading"
+                                              ? "loading"
-                                                : props.filterParameters.value
+                                              : props.filterParameters.value
                                     }
                                     columnSelectOption={getColumnSelectOptions}
                                 />
@@ -282,7 +282,7 @@ const OperatorList = () => {
                         grow: false,
                         size: 100,
                     },
-                ]
+                ],
             },
             {
                 accessorFn: (row) => moment(row.created_at).locale("fa").format("HH:mm | yyyy/MM/DD"),

src/components/dashboard/roadItems/supervisor/SupervisorList.jsx

@@ -378,7 +378,7 @@ const SupervisorList = () => {
                         grow: false,
                         size: 100,
                     },
-                ]
+                ],
             },
             {
                 accessorFn: (row) => moment(row.created_at).locale("fa").format("HH:mm | yyyy/MM/DD"),

src/core/components/DataTable/Main.js

@@ -5,14 +5,25 @@ import isArrayEmpty from "@/core/utils/isArrayEmpty";
 import useDataTable from "@/lib/hooks/useDataTable";
 import useRequest from "@/lib/hooks/useRequest";
 import { useMaterialReactTable } from "material-react-table";
-import { useCallback, useEffect, useState } from "react";
+import { useCallback, useEffect, useReducer, useState } from "react";
 import useSWR from "swr";
 import { FA_DATATABLE_LOCALIZATION } from "./localization/fa/datatable";
 import DataTable_Paper from "./table/Paper";
 
+const rowSelectionReducer = (state, action) => {
+    switch (action.type) {
+        case "TOGGLE_ROW":
+            return { [action.payload]: true };
+        case "RESET":
+            return {};
+        default:
+            return state;
+    }
+};
+
 const DataTable_Main = (props) => {
     const request = useRequest();
-    const [rowSelection, setRowSelection] = useState({});
+    const [rowSelection, dispatchRowSelection] = useReducer(rowSelectionReducer, {});
     const { filterData, sortData, setSortData, hideData } = useDataTable();
     const {
         need_filter,
@@ -75,7 +86,8 @@ const DataTable_Main = (props) => {
     });
 
     useEffect(() => {
-        setRowSelection({});
+        if (!isValidating) return;
+        dispatchRowSelection({ type: "RESET" });
     }, [isValidating]);
 
     const table = useMaterialReactTable({
@@ -83,11 +95,8 @@ const DataTable_Main = (props) => {
         columns,
         data: data ?? [],
         muiTableBodyRowProps: ({ row }) => ({
-            onClick: () =>
+            onClick: () => dispatchRowSelection({ type: "TOGGLE_ROW", payload: row.id }),
-                setRowSelection((prev) => ({
+            selected: !!rowSelection[row.id],
-                    [row.id]: true,
-                })),
-            selected: rowSelection[row.id],
         }),
         initialState: {
             density: "compact",