diff --git a/package.json b/package.json index f9593c8..46f004d 100644 --- a/package.json +++ b/package.json @@ -25,6 +25,7 @@ "dayjs": "^1.11.10", "formik": "^2.4.5", "jalali-moment": "^3.3.11", + "lz-string": "^1.5.0", "material-react-table": "^2.11.2", "next": "^14.2.3", "react": "^18", diff --git a/src/lib/contexts/tableSetting.js b/src/lib/contexts/tableSetting.js index a55bf58..2d565b6 100644 --- a/src/lib/contexts/tableSetting.js +++ b/src/lib/contexts/tableSetting.js @@ -1,32 +1,52 @@ "use client"; import { createContext, useCallback, useEffect, useState } from "react"; +import LZString from "lz-string"; export const TableSettingContext = createContext(); + +const decompressData = (compressedData) => { + const decompressed = LZString.decompressFromUTF16(compressedData); + if (decompressed === null) { + localStorage.removeItem("_setting-app"); + return null; + } else { + return JSON.parse(decompressed); + } +}; + export const TableSettingProvider = ({ children }) => { const [settingStore, setSettingStore] = useState({}); useEffect(() => { - const _localStorage = localStorage.getItem("_setting-app"); - if (_localStorage) { - setSettingStore(JSON.parse(_localStorage)); + const compressedData = localStorage.getItem("_setting-app"); + + const data = compressedData ? decompressData(compressedData) : null; + if (data) { + setSettingStore(data); } }, []); - const hideAction = useCallback((user_id, page_name, table_name, settingValue, columns) => { + const hideAction = useCallback((user_id, page_name, table_name, settingValue) => { clearAction(user_id, page_name, table_name, "hides"); - updateSettingStorage(user_id, page_name, table_name, "hides", settingValue, columns); + updateSettingStorage(user_id, page_name, table_name, "hides", settingValue); }, []); - const sortAction = useCallback((user_id, page_name, table_name, settingValue, columns) => { - updateSettingStorage(user_id, page_name, table_name, "sorts", settingValue, columns); + + const sortAction = useCallback((user_id, page_name, table_name, settingValue) => { + updateSettingStorage(user_id, page_name, table_name, "sorts", settingValue); }, []); - const filterAction = (user_id, page_name, table_name, settingValue, columns) => { - updateSettingStorage(user_id, page_name, table_name, "filters", settingValue, columns); + + const filterAction = (user_id, page_name, table_name, settingValue) => { + updateSettingStorage(user_id, page_name, table_name, "filters", settingValue); }; + const resetAction = (user_id, page_name, table_name) => { - const prevLocalStorage = JSON.parse(localStorage.getItem("_setting-app")) || {}; + const compressedData = localStorage.getItem("_setting-app"); + const prevLocalStorage = compressedData ? decompressData(compressedData) : {}; + const userSettings = prevLocalStorage[user_id] || {}; const pageSettings = userSettings[page_name] || {}; delete pageSettings[table_name]; + const resetData = { ...prevLocalStorage, [user_id]: { @@ -36,20 +56,26 @@ export const TableSettingProvider = ({ children }) => { }, }, }; - localStorage.setItem("_setting-app", JSON.stringify(resetData)); + + localStorage.setItem("_setting-app", LZString.compressToUTF16(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 updateSettingStorage = (user_id, page_name, table_name, settingType, settingValue) => { + const compressedData = localStorage.getItem("_setting-app"); + const prevLocalStorage = compressedData ? decompressData(compressedData) : {}; + const userSettings = prevLocalStorage[user_id] || {}; const pageSettings = userSettings[page_name] || {}; const tableSettings = pageSettings[table_name] || {}; + let newSettings; if (settingType === "sorts" || settingType === "filters") { newSettings = [...settingValue]; } else { newSettings = { ...(tableSettings[settingType] || {}), ...settingValue }; } + const updatedLocalStorage = { ...prevLocalStorage, [user_id]: { @@ -63,15 +89,19 @@ export const TableSettingProvider = ({ children }) => { }, }, }; - localStorage.setItem("_setting-app", JSON.stringify(updatedLocalStorage)); + + localStorage.setItem("_setting-app", LZString.compressToUTF16(JSON.stringify(updatedLocalStorage))); setSettingStore(updatedLocalStorage); }; const clearAction = (user_id, page_name, table_name, key) => { - const prevLocalStorage = JSON.parse(localStorage.getItem("_setting-app")) || {}; + const compressedData = localStorage.getItem("_setting-app"); + const prevLocalStorage = compressedData ? decompressData(compressedData) : {}; + const userSettings = prevLocalStorage[user_id] || {}; const pageSettings = userSettings[page_name] || {}; const tableSettings = pageSettings[table_name] || {}; + const updatedSettings = { ...prevLocalStorage, [user_id]: { @@ -86,7 +116,7 @@ export const TableSettingProvider = ({ children }) => { }, }; - localStorage.setItem("_setting-app", JSON.stringify(updatedSettings)); + localStorage.setItem("_setting-app", LZString.compressToUTF16(JSON.stringify(updatedSettings))); setSettingStore(updatedSettings); }; @@ -95,4 +125,4 @@ export const TableSettingProvider = ({ children }) => { {children} ); -}; +}; \ No newline at end of file