diff --git a/src/components/MTableGroupbar/index.js b/src/components/MTableGroupbar/index.js index e5ac0673..c90a63e2 100644 --- a/src/components/MTableGroupbar/index.js +++ b/src/components/MTableGroupbar/index.js @@ -34,14 +34,15 @@ function MTableGroupbar(props) { useEffect(() => { if (props.persistentGroupingsId) { - const persistentGroupings = {}; + const persistentGroupings = []; props.groupColumns.forEach((column) => { - persistentGroupings[column.field] = { + persistentGroupings.push({ + field: column.field, groupOrder: column.tableData.groupOrder, groupSort: column.tableData.groupSort, columnOrder: column.tableData.columnOrder - }; + }); }); localStorage.setItem( diff --git a/src/material-table.js b/src/material-table.js index 1c1ca534..a5567ce5 100644 --- a/src/material-table.js +++ b/src/material-table.js @@ -88,18 +88,22 @@ export default class MaterialTable extends React.Component { let savedGroupings = localStorage.getItem( props.options.persistentGroupingsId ); + if (savedGroupings) { const parsedGroupings = JSON.parse(savedGroupings); + if (parsedGroupings) { - Object.entries(parsedGroupings).forEach(([columnName, groupings]) => { - const column = columnsCopy.find((col) => col.field === columnName); + parsedGroupings.forEach((savedGrouping) => { + const column = columnsCopy.find( + (col) => col.field === savedGrouping.field + ); if (column) { - Object.entries(groupings).forEach(([key, value]) => { - if (!column['tableData']) { - column['tableData'] = {}; - } - column['tableData'][key] = value; - }); + if (!column.tableData) { + column.tableData = {}; + } + column.tableData.groupOrder = savedGrouping.groupOrder; + column.tableData.groupSort = savedGrouping.groupSort; + column.tableData.columnOrder = savedGrouping.columnOrder; } }); }