1 files changed, 31 insertions, 20 deletions
diff --git a/packages/web-util/src/hooks/useLocalStorage.ts b/packages/web-util/src/hooks/useLocalStorage.ts
index b460144a6..7c41f98be 100644
--- a/packages/web-util/src/hooks/useLocalStorage.ts
+++ b/packages/web-util/src/hooks/useLocalStorage.ts
@@ -19,7 +19,7 @@
  * @author Sebastian Javier Marchano (sebasjm)
  */
 
-import { Codec, codecForString } from "@gnu-taler/taler-util";
+import { AbsoluteTime, Codec, codecForString } from "@gnu-taler/taler-util";
 import { useEffect, useState } from "preact/hooks";
 import {
   ObservableMap,
@@ -61,12 +61,25 @@ const supportLocalStorage = typeof window !== "undefined";
 const supportBrowserStorage =
   typeof chrome !== "undefined" && typeof chrome.storage !== "undefined";
 
+  /**
+   * Build setting storage
+   */
 const storage: ObservableMap<string, string> = (function buildStorage() {
   if (supportBrowserStorage) {
-    return browserStorageMap(memoryMap<string>());
+    //browser storage is like local storage but
+    //with app sync.
+    //Works for almost every browser
+    if (supportLocalStorage) {
+      return browserStorageMap(localStorageMap());
+    } else {
+      // service worker doesn't have local storage
+      return browserStorageMap(memoryMap<string>());
+    }
   } else if (supportLocalStorage) {
+    // fallback if browser is too old
     return localStorageMap();
   } else {
+    // new need to save settings somewhere
     return memoryMap<string>();
   }
 })();
@@ -85,26 +98,14 @@ export function useLocalStorage<Type = string>(
   key: StorageKey<Type>,
   defaultValue?: Type,
 ): StorageState<Type> {
-  function convert(updated: string | undefined): Type | undefined {
-    if (updated === undefined) return defaultValue; //optional
-    try {
-      return key.codec.decode(JSON.parse(updated));
-    } catch (e) {
-      //decode error
-      return defaultValue;
-    }
-  }
-  const [storedValue, setStoredValue] = useState<Type | undefined>(
-    (): Type | undefined => {
-      const prev = storage.get(key.id);
-      return convert(prev);
-    },
-  );
+  const current = convert(storage.get(key.id), key, defaultValue);
+
+  const [_, setStoredValue] = useState(AbsoluteTime.now().t_ms);
 
   useEffect(() => {
     return storage.onUpdate(key.id, () => {
-      const newValue = storage.get(key.id);
-      setStoredValue(convert(newValue));
+      // const newValue = storage.get(key.id);
+      setStoredValue(AbsoluteTime.now().t_ms);
     });
   }, [key.id]);
 
@@ -120,10 +121,20 @@ export function useLocalStorage<Type = string>(
   };
 
   return {
-    value: storedValue,
+    value: current,
     update: setValue,
     reset: () => {
       setValue(defaultValue);
     },
   };
 }
+
+function convert<Type>(updated: string | undefined, key: StorageKey<Type>, defaultValue?: Type): Type | undefined {
+  if (updated === undefined) return defaultValue; //optional
+  try {
+    return key.codec.decode(JSON.parse(updated));
+  } catch (e) {
+    //decode error
+    return defaultValue;
+  }
+}