I am small working on a small Tauri app. For the state management. am using Redux Toolkit.
Until now i have been using localStorage to persist my data but i would like to change to something that allows me to save more data, like a JSON file on the app's data folder.
To do that i am rewritting my middleware "save function" and my "rehydrate" function to use Tauri's fs and path API.
Saving the data works ok. For that i am using a custom middleware, which saves the data on the $APPLOCALDATA directory as a JSON file (in the configureStore
middleware
).
What i now would like to do is to read that data when the app loads and set it as the preloadedState
on the store (inside the configureStore
function).
My problem is that Tauri exposes an async readTextFile
function, but the configureStore preloadedState cannot be a call to a async function.
Any idea how i can do this?
This is the code i have store.ts
export const store = configureStore({
reducer: {
...my reducers are here...
},
preloadedState: reHydrateStore(),
middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(localStorageMiddleware)
});
the reHydrateStore function
export const reHydrateStore = (): any => {
console.log('NEED TO HYDRATE STORE');
if (localStorage.getItem(APP_NAME) !== null) {
// @ts-expect-error
return JSON.parse(localStorage.getItem(APP_NAME)); // re-hydrate the store
}
};
I would like to change getting the data from localStorage, to getting it from the file.
Any help would be much appreciated.
If there are any other better ways to save the data, i am also open to suggestions!
Thank you!