summary text

src/components/DataTableTest.jsx

@@ -57,13 +57,12 @@ const TestDataTable = () => {
     const [pageName, setPageName] = useState('loan');
     const [tableName, setTableName] = useState('loan_table');
     const {settingStore, hideAction, filterAction, sortAction, oldSorting} = useTableSetting();
-    console.log(settingStore)
 
     const columns = useMemo(
         () => [
             {
                 accessorKey: 'name.firstName',
-                header: 'First Name',
+                header: 'نام',
                 size: 150,
                 id: "firstName",
                 enableColumnFilter: true,
@@ -77,7 +76,7 @@ const TestDataTable = () => {
             },
             {
                 accessorKey: 'name.lastName',
-                header: 'Last Name',
+                header: 'نام خانوادگی',
                 size: 150,
                 id: "lastName",
                 enableColumnFilter: true,
@@ -91,7 +90,7 @@ const TestDataTable = () => {
             },
             {
                 accessorKey: 'address',
-                header: 'Address',
+                header: 'آدرس',
                 size: 200,
                 id: "address",
                 enableColumnFilter: true,
@@ -105,7 +104,7 @@ const TestDataTable = () => {
             },
             {
                 accessorKey: 'city',
-                header: 'City',
+                header: 'شهر',
                 size: 150,
                 id: "city",
                 enableColumnFilter: true,
@@ -123,9 +122,10 @@ const TestDataTable = () => {
             },
             {
                 accessorKey: 'state',
-                header: 'State',
+                header: 'وضعیت',
                 size: 150,
                 id: "state",
+                text:'نام',
                 enableColumnFilter: true,
                 datatype: "text",
                 filterFn: "contains",
@@ -140,11 +140,11 @@ const TestDataTable = () => {
     );
     const onColumnVisibilityChange = (event) => {
         const settingValue = event();
-        hideAction(userId, pageName, tableName, settingValue);
+        hideAction(userId, pageName, tableName, settingValue, columns);
     };
     const onSortingChange = (event) => {
         const settingValue = event(settingStore?.[userId]?.[pageName]?.[tableName]?.['sorts'] || []);
-        sortAction(userId, pageName, tableName, settingValue);
+        sortAction(userId, pageName, tableName, settingValue, columns);
     }
 
     return <MaterialReactTable

src/lib/contexts/tableSetting.jsx

@@ -1,9 +1,11 @@
 'use client'
 import {createContext, useCallback, useEffect, useState} from "react";
+
 export const TableSettingContext = createContext();
 export const TableSettingProvider = ({children}) => {
     const [settingStore, setSettingStore] = useState({});
 
+
     useEffect(() => {
         const _localStorage = localStorage.getItem("_setting-app")
         if (_localStorage) {
@@ -11,16 +13,16 @@ export const TableSettingProvider = ({children}) => {
         }
     }, []);
 
-    const hideAction = useCallback((user_id, page_name, table_name, settingValue) => {
+    const hideAction = useCallback((user_id, page_name, table_name, settingValue, columns) => {
-        updateSettingStorage(user_id, page_name, table_name, "hides", settingValue);
+        updateSettingStorage(user_id, page_name, table_name, "hides", settingValue, columns);
-    },[])
+    }, [])
-    const sortAction = useCallback((user_id, page_name, table_name, settingValue) => {
+    const sortAction = useCallback((user_id, page_name, table_name, settingValue, columns) => {
-        updateSettingStorage(user_id, page_name, table_name, "sorts", settingValue);
+        updateSettingStorage(user_id, page_name, table_name, "sorts", settingValue, columns);
-    },[])
+    }, [])
     const filterAction = (user_id, page_name, table_name, settingValue) => {
         updateSettingStorage(user_id, page_name, table_name, "filters", settingValue);
     }
-    const updateSettingStorage = (user_id, page_name, table_name, settingType, settingValue) => {
+    const updateSettingStorage = (user_id, page_name, table_name, settingType, settingValue, columns) => {
         const prevLocalStorage = JSON.parse(localStorage.getItem("_setting-app")) || {};
         const userSettings = prevLocalStorage[user_id] || {};
         const pageSettings = userSettings[page_name] || {};
@@ -40,6 +42,10 @@ export const TableSettingProvider = ({children}) => {
                     [table_name]: {
                         ...tableSettings,
                         [settingType]: Array.isArray(settingValue) ? [...newSettings] : {...newSettings},
+                        summary: SummaryTextMessage({
+                            ...tableSettings,
+                            [settingType]: Array.isArray(settingValue) ? [...newSettings] : {...newSettings},
+                        }, columns)
                     },
                 },
             },
@@ -48,6 +54,49 @@ export const TableSettingProvider = ({children}) => {
         setSettingStore(updatedLocalStorage);
     }
 
+    const SummaryTextMessage = (values, columns) => {
+        let SummaryText = "";
+        let HideText = "";
+        let FilterText;
+        let SortText = "";
+
+        if (values.sorts && values.sorts.length > 0) {
+            const _list = []
+            for (const sort of values.sorts) {
+                const _column = columns.find(column => column.id == sort.id)
+                _list.push(`${_column.header}` + `(${sort.desc ? "نزولی" : "صعودی"})`)
+            }
+            SortText = " مرتب شده بر اساس " + _list.join(", ")
+        }
+
+        if (values.hides) {
+            const hidesArray = Object.entries(values.hides).map((e) => ({id: e[0], value: e[1]}))
+            if (hidesArray.length > 0) {
+                const _list = []
+                for (const hide of hidesArray) {
+                    if (hide.value) continue
+                    const _column = columns.find(c => c.id == hide.id)
+                    _list.push(_column.header)
+                }
+                HideText = "ستون های مخفی شده : " + _list.join(", ");
+            }
+        }
+
+        if (HideText || SortText) {
+            if (SortText) {
+                SummaryText += SortText;
+                if (HideText) {
+                    SummaryText += " ; ";
+                }
+            }
+            if (HideText) {
+                SummaryText += HideText;
+            }
+        }
+
+        return SummaryText;
+    };
+
     return (
         <TableSettingContext.Provider
             value={{settingStore, hideAction, sortAction, filterAction}}>