feat(gui): Preserve global state across page reloads (#48)

This commit is contained in:
binarybaron 2024-08-29 13:38:11 +02:00 committed by GitHub
parent c7c7cf1886
commit d913206062
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 35 additions and 11 deletions

View file

@ -1,5 +1,6 @@
import { createRoot } from "react-dom/client";
import { Provider } from "react-redux";
import { PersistGate } from "redux-persist/integration/react";
import { setAlerts } from "store/features/alertsSlice";
import { setRegistryProviders } from "store/features/providersSlice";
import { setBtcPrice, setXmrPrice } from "store/features/ratesSlice";
@ -12,7 +13,7 @@ import {
} from "./api";
import App from "./components/App";
import { checkBitcoinBalance, getRawSwapInfos } from "./rpc";
import { store } from "./store/storeRenderer";
import { persistor, store } from "./store/storeRenderer";
setInterval(() => {
checkBitcoinBalance();
@ -23,7 +24,9 @@ const container = document.getElementById("root");
const root = createRoot(container!);
root.render(
<Provider store={store}>
<App />
<PersistGate loading={null} persistor={persistor}>
<App />
</PersistGate>
</Provider>,
);

View file

@ -1,9 +1,28 @@
import { configureStore } from "@reduxjs/toolkit";
import { combineReducers, configureStore } from "@reduxjs/toolkit";
import { persistReducer, persistStore } from "redux-persist";
import sessionStorage from "redux-persist/lib/storage/session";
import { reducers } from "store/combinedReducer";
// We persist the redux store in sessionStorage
// The point of this is to preserve the store across reloads while not persisting it across GUI restarts
//
// If the user reloads the page, while a swap is running we want to
// continue displaying the correct state of the swap
const persistConfig = {
key: "gui-global-state-store",
storage: sessionStorage,
};
const persistedReducer = persistReducer(
persistConfig,
combineReducers(reducers),
);
export const store = configureStore({
reducer: reducers,
reducer: persistedReducer,
});
export const persistor = persistStore(store);
export type AppDispatch = typeof store.dispatch;
export type RootState = ReturnType<typeof store.getState>;