Merge branch 'feature/rest_dataTable_cache' into 'develop'
add reset button for reset local storage and update state renamed See merge request witel-front-end/rms!11
This commit is contained in:
22
src/core/components/DataTable/reset/ResetStorage.jsx
Normal file
22
src/core/components/DataTable/reset/ResetStorage.jsx
Normal file
@@ -0,0 +1,22 @@
|
||||
"use client";
|
||||
|
||||
import { IconButton, Tooltip } from "@mui/material";
|
||||
import AutorenewIcon from "@mui/icons-material/Autorenew";
|
||||
import useTableSetting from "@/lib/hooks/useTableSetting";
|
||||
|
||||
function ResetStorage({ user_id, page_name, table_name }) {
|
||||
const { resetAction } = useTableSetting();
|
||||
const reset = () => {
|
||||
resetAction(user_id, page_name, table_name);
|
||||
};
|
||||
|
||||
return (
|
||||
<Tooltip title="بازنشانی اطلاعات">
|
||||
<IconButton onClick={reset} aria-label="reset table data">
|
||||
<AutorenewIcon />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
);
|
||||
}
|
||||
|
||||
export default ResetStorage;
|
||||
@@ -4,7 +4,8 @@ import DataTable_LinearProgressBar from "./LinearProgressBar";
|
||||
import DataTable_TablePagination from "./TablePagination";
|
||||
import DataTable_ToolbarInternalButtons from "./ToolbarInternalButtons";
|
||||
import FilterColumn from "@/core/components/DataTable/filter";
|
||||
import RefactorTable from "@/core/components/DataTable/refactor/RefactorTable";
|
||||
import UpdateTable from "@/core/components/DataTable/update/UpdateTable";
|
||||
import ResetStorage from "@/core/components/DataTable/reset/ResetStorage";
|
||||
|
||||
const DataTable_TopToolbar = ({ mutate, need_filter, table, columns, table_url, user_id, page_name, table_name }) => {
|
||||
const {
|
||||
@@ -69,7 +70,10 @@ const DataTable_TopToolbar = ({ mutate, need_filter, table, columns, table_url,
|
||||
justifyContent: "flex-end",
|
||||
}}
|
||||
>
|
||||
<RefactorTable mutate={mutate} />
|
||||
<ResetStorage user_id={user_id}
|
||||
page_name={page_name}
|
||||
table_name={table_name} />
|
||||
<UpdateTable mutate={mutate} />
|
||||
{need_filter && (
|
||||
<FilterColumn
|
||||
columns={columns}
|
||||
|
||||
@@ -2,18 +2,18 @@
|
||||
import { IconButton, Tooltip } from "@mui/material";
|
||||
import RestartAltIcon from "@mui/icons-material/RestartAlt";
|
||||
|
||||
function RefactorTable({ mutate }) {
|
||||
const refactor = () => {
|
||||
function UpdateTable({ mutate }) {
|
||||
const update = () => {
|
||||
mutate();
|
||||
};
|
||||
|
||||
return (
|
||||
<Tooltip title="بازنشانی اطلاعات">
|
||||
<IconButton onClick={refactor} aria-label="refactor table">
|
||||
<Tooltip title="بروزرسانی اطلاعات">
|
||||
<IconButton onClick={update} aria-label="refactor table">
|
||||
<RestartAltIcon />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
);
|
||||
}
|
||||
|
||||
export default RefactorTable;
|
||||
export default UpdateTable;
|
||||
@@ -21,6 +21,23 @@ export const TableSettingProvider = ({ children }) => {
|
||||
const filterAction = (user_id, page_name, table_name, settingValue, columns) => {
|
||||
updateSettingStorage(user_id, page_name, table_name, "filters", settingValue, columns);
|
||||
};
|
||||
const resetAction = (user_id, page_name, table_name) => {
|
||||
const prevLocalStorage = JSON.parse(localStorage.getItem("_setting-app")) || {};
|
||||
const userSettings = prevLocalStorage[user_id] || {};
|
||||
const pageSettings = userSettings[page_name] || {};
|
||||
const resetData = {
|
||||
...prevLocalStorage,
|
||||
[user_id]: {
|
||||
...userSettings,
|
||||
[page_name]: {
|
||||
...pageSettings,
|
||||
[table_name]: {},
|
||||
},
|
||||
},
|
||||
};
|
||||
localStorage.setItem("_setting-app", JSON.stringify(resetData));
|
||||
setSettingStore(resetData);
|
||||
};
|
||||
const updateSettingStorage = (user_id, page_name, table_name, settingType, settingValue, columns) => {
|
||||
const prevLocalStorage = JSON.parse(localStorage.getItem("_setting-app")) || {};
|
||||
const userSettings = prevLocalStorage[user_id] || {};
|
||||
@@ -46,7 +63,7 @@ export const TableSettingProvider = ({ children }) => {
|
||||
...tableSettings,
|
||||
[settingType]: Array.isArray(settingValue) ? [...newSettings] : { ...newSettings },
|
||||
},
|
||||
columns
|
||||
columns,
|
||||
),
|
||||
},
|
||||
},
|
||||
@@ -117,7 +134,7 @@ export const TableSettingProvider = ({ children }) => {
|
||||
};
|
||||
|
||||
return (
|
||||
<TableSettingContext.Provider value={{ settingStore, hideAction, sortAction, filterAction }}>
|
||||
<TableSettingContext.Provider value={{ settingStore, hideAction, sortAction, filterAction, resetAction }}>
|
||||
{children}
|
||||
</TableSettingContext.Provider>
|
||||
);
|
||||
|
||||
@@ -2,8 +2,8 @@ import { useContext } from "react";
|
||||
import { TableSettingContext } from "../contexts/tableSetting";
|
||||
|
||||
const useTableSetting = () => {
|
||||
const { settingStore, hideAction, sortAction, filterAction } = useContext(TableSettingContext);
|
||||
return { settingStore, hideAction, sortAction, filterAction };
|
||||
const { settingStore, hideAction, sortAction, filterAction, resetAction } = useContext(TableSettingContext);
|
||||
return { settingStore, hideAction, sortAction, filterAction, resetAction };
|
||||
};
|
||||
|
||||
export default useTableSetting;
|
||||
|
||||
Reference in New Issue
Block a user