From ba7f9ce7d165f98b7f0068a95039c6861a79b903 Mon Sep 17 00:00:00 2001
From: djmil <andriy@djmil.dev>
Date: Fri, 3 Nov 2023 13:32:59 +0100
Subject: [PATCH] useLocalStorage for persistant values from Reducer

---
 webapp/src/App.js                    |  5 +--
 webapp/src/reducer/polling.js        | 61 ++++++++++++++++++----------
 webapp/src/util/PersistentStorage.js | 31 ++++++++++++++
 3 files changed, 72 insertions(+), 25 deletions(-)
 create mode 100644 webapp/src/util/PersistentStorage.js

diff --git a/webapp/src/App.js b/webapp/src/App.js
index 7f1f6ad..04ad760 100644
--- a/webapp/src/App.js
+++ b/webapp/src/App.js
@@ -7,12 +7,11 @@ import Leaderboard from "./components/Leaderboard"
 import Game from "./components/Game"
 import About from "./components/About"
 
-import { pollingReducer, pollingDefaults } from './reducer/polling';
+import Polling from './reducer/polling';
 
 function App() {
-  const [polling, dispatchPolling] = useReducer(pollingReducer, pollingDefaults)
+  const [polling, dispatchPolling] = useReducer(Polling.reducer, Polling.initialState)
 
-  console.log('polling', polling)
   return <div className="App">
     <BrowserRouter>
       <Header polling={polling} dispatchPolling={dispatchPolling} />
diff --git a/webapp/src/reducer/polling.js b/webapp/src/reducer/polling.js
index a5f343c..89ebf9a 100644
--- a/webapp/src/reducer/polling.js
+++ b/webapp/src/reducer/polling.js
@@ -1,32 +1,49 @@
-export function pollingReducer(polling, action) {
+import { useLocalStorage } from './util/PersistentStorage'
+
+const Persistent = (() => {
+  const [getEnabled, setEnabled] = useLocalStorage('polling.enabled', true);
+
+  return {
+    getEnabled,
+    setEnabled
+  }
+})(); // <<--- execute
+
+export const pollingGetInitialState = () => {
+  return {
+    enabled: Persistent.getEnabled() === 'true',
+
+    games: false,
+    leaderboard: false
+  }
+};
+
+export function pollingReducer(state, action) {
   switch (action.type) {
 
-    case "toggleOnOff":
-      return {
-        ...polling,
-        enabled: !polling.enabled
-      };
+    case 'toggleOnOff': return {
+      ...state,
+      enabled: Persistent.setEnabled(!state.enabled)
+    };
 
-    case "games":
-      return {
-        ...polling,
-        games: action.value
-      };
+    case 'games': return {
+      ...state,
+      games: action.value
+    };
 
-    case "leaderboard":
-      return {
-        ...polling,
-        leaderboard: action.value
-      };
+    case 'leaderboard': return {
+      ...state,
+      leaderboard: action.value
+    };
 
     default:
-      throw Error("Unknown action: " + action.type);
+      throw Error('Unknown action:' + action.type);
   }
 }
 
-export const pollingDefaults = {
-  enabled: true,
+const Polling = {
+  initialState: pollingGetInitialState(), // <<--- execute
+  reducer: pollingReducer
+}
 
-  games: false,
-  leaderboard: false,
-};
+export default Polling
\ No newline at end of file
diff --git a/webapp/src/util/PersistentStorage.js b/webapp/src/util/PersistentStorage.js
new file mode 100644
index 0000000..ea44750
--- /dev/null
+++ b/webapp/src/util/PersistentStorage.js
@@ -0,0 +1,31 @@
+export function useLocalStorage(name, initialValue) {
+
+    const get = () => localStorage.getItem(name);
+    const del = () => localStorage.removeItem(name);
+    const set = (value) => { 
+        localStorage.setItem(name, value); 
+        return value;
+    }
+
+    if (get() === null) {
+        set(initialValue);
+    }
+
+    return [get, set, del]
+}
+
+export function useSessionStorage(name, initialValue) {
+
+    const get = () => sessionStorage.getItem(name);
+    const del = () => sessionStorage.removeItem(name);
+    const set = (value) => { 
+        sessionStorage.setItem(name, value); 
+        return value;
+    }
+
+    if (get() === null) {
+        set(initialValue);
+    }
+
+    return [get, set, del]
+}
\ No newline at end of file