It sounds like you are using the browser's session storage to keep track of the scheduled tasks in your timesheet, and the data is vanishing when you reopen the same timesheet. The data stored in session storage is only available for the duration of the page session, and it gets wiped out once the session ends, like when you close and reopen the browser tab.
If you want the scheduled data to persist even after the session ends, you can use local storage instead of session storage. Local storage works similarly to session storage, but the data persists across browser sessions and tabs.
Here's an example of how you can modify your existing code to use local storage instead:
Saving Data to Local Storage
You can save the scheduled tasks to local storage by stringifying the data object and using localStorage.setItem:
function saveSchedulerData(data) {
localStorage.setItem('schedulerData', JSON.stringify(data));
}
You need to save the updated data set whenever there is a change (in onEventMove, onEventResize, etc.).
Retrieving Data from Local Storage
You can retrieve the data from local storage by parsing the stringified data object using localStorage.getItem:
function loadSchedulerData() {
const data = localStorage.getItem('schedulerData');
return data ? JSON.parse(data) : null;
}
Deleting Data from Local Storage
If you need to remove the data at some point, you can use localStorage.removeItem:
function deleteSchedulerData() {
localStorage.removeItem('schedulerData');
}
Applying Data to Your Timesheet Component
You can load the scheduler data when your component is mounted and apply it to the timesheet as needed. Here's an example if you're using React:
const events = loadSchedulerData();
scheduler.update({events: events});
By using local storage instead of session storage, the scheduled tasks in your timesheet should persist even after reopening the same timesheet, and you'll be able to continue working with the saved data as needed.