diff --git a/src/dashboard/Data/Browser/DataBrowser.react.js b/src/dashboard/Data/Browser/DataBrowser.react.js index a7bd4e69e..371c805ee 100644 --- a/src/dashboard/Data/Browser/DataBrowser.react.js +++ b/src/dashboard/Data/Browser/DataBrowser.react.js @@ -26,6 +26,8 @@ const AGGREGATION_PANEL_AUTO_LOAD_FIRST_ROW = 'aggregationPanelAutoLoadFirstRow' const AGGREGATION_PANEL_SYNC_SCROLL = 'aggregationPanelSyncScroll'; const AGGREGATION_PANEL_BATCH_NAVIGATE = 'aggregationPanelBatchNavigate'; const AGGREGATION_PANEL_SHOW_CHECKBOX = 'aggregationPanelShowCheckbox'; +const AGGREGATION_PANEL_WIDTH = 'aggregationPanelWidth'; +const AGGREGATION_PANEL_COUNT = 'aggregationPanelCount'; function formatValueForCopy(value, type) { if (value === undefined) { @@ -98,6 +100,10 @@ export default class DataBrowser extends React.Component { window.localStorage?.getItem(AGGREGATION_PANEL_BATCH_NAVIGATE) !== 'false'; const storedShowPanelCheckbox = window.localStorage?.getItem(AGGREGATION_PANEL_SHOW_CHECKBOX) !== 'false'; + const storedPanelWidth = window.localStorage?.getItem(AGGREGATION_PANEL_WIDTH); + const parsedPanelWidth = storedPanelWidth ? parseInt(storedPanelWidth, 10) : 300; + const storedPanelCount = window.localStorage?.getItem(AGGREGATION_PANEL_COUNT); + const parsedPanelCount = storedPanelCount ? parseInt(storedPanelCount, 10) : 1; const hasAggregation = props.classwiseCloudFunctions?.[ `${props.app.applicationId}${props.appName}` @@ -117,7 +123,7 @@ export default class DataBrowser extends React.Component { firstSelectedCell: null, selectedData: [], prevClassName: props.className, - panelWidth: 300, + panelWidth: parsedPanelWidth, isResizing: false, maxWidth: window.innerWidth - 300, showAggregatedData: true, @@ -131,7 +137,7 @@ export default class DataBrowser extends React.Component { prefetchCache: {}, selectionHistory: [], displayedObjectIds: [], // Array of object IDs currently displayed in the panel - panelCount: 1, // Number of panels to display + panelCount: parsedPanelCount, // Number of panels to display multiPanelData: {}, // Object mapping objectId to panel data _objectsToFetch: [], // Temporary field for async fetch handling loadingObjectIds: new Set(), @@ -358,6 +364,7 @@ export default class DataBrowser extends React.Component { isResizing: false, panelWidth: size.width, }); + window.localStorage?.setItem(AGGREGATION_PANEL_WIDTH, size.width); } handleResizeDiv(event, { size }) { @@ -1148,6 +1155,8 @@ export default class DataBrowser extends React.Component { multiPanelData: currentObjectData, panelWidth: limitedWidth, }); + window.localStorage?.setItem(AGGREGATION_PANEL_COUNT, newPanelCount); + window.localStorage?.setItem(AGGREGATION_PANEL_WIDTH, limitedWidth); // Fetch missing data asynchronously objectsToFetch.forEach((objectId, i) => { @@ -1169,6 +1178,9 @@ export default class DataBrowser extends React.Component { const newWidth = (prevState.panelWidth / prevState.panelCount) * newPanelCount; + window.localStorage?.setItem(AGGREGATION_PANEL_COUNT, newPanelCount); + window.localStorage?.setItem(AGGREGATION_PANEL_WIDTH, newWidth); + return { panelCount: newPanelCount, displayedObjectIds: newDisplayedObjectIds,