filter

src/components/DataTableTest.jsx

@@ -2,7 +2,8 @@
 import {useMemo, useState} from 'react';
 import {MaterialReactTable} from 'material-react-table';
 import useTableSetting from "@/lib/hooks/useTableSetting";
-import {Typography} from "@mui/material";
+import {IconButton, Tooltip, Typography} from "@mui/material";
+import CustomToolbar from "@/components/CustomToolbar";
 
 
 const data = [
@@ -53,13 +54,16 @@ const data = [
     },
 ];
 
+function RefreshIcon() {
+    return null;
+}
+
 const TestDataTable = ({columns}) => {
     const [userId, setUserId] = useState(2);
     const [pageName, setPageName] = useState('loan');
     const [tableName, setTableName] = useState('loan_table');
     const {settingStore, hideAction, filterAction, sortAction,} = useTableSetting();
 
-
     const onColumnVisibilityChange = (event) => {
         const settingValue = event();
         hideAction(userId, pageName, tableName, settingValue, columns);
@@ -76,6 +80,11 @@ const TestDataTable = ({columns}) => {
             columns={columns}
             data={data}
             manualSorting={true}
+            renderTopToolbarCustomActions={({table}) => (<>
+                    <CustomToolbar
+                        columns={columns}
+                    />
+            </>)}
             initialState={{
                 columnVisibility: settingStore?.[userId]?.[pageName]?.[tableName]?.['hides'],
                 sorting: settingStore?.[userId]?.[pageName]?.[tableName]?.['sorts'] || []