Enhance: validate local storage (#4784)

* Validate localStorage with spec

This will help get at the source of errors like #4706 quicker

* Fix settings bugs

Close #4679 as shortcut tooltip setting is now visible.
No need to js/alert when a setting is changed. Probably leftover bugging

* Add docs and example of reusing specs in bb task

Co-authored-by: Andelf <andelf@gmail.com>

src/main/frontend/storage.cljs

@@ -2,6 +2,8 @@
   (:refer-clojure :exclude [get set remove])
   (:require [cljs.reader :as reader]
             [datascript.transit :as dt]
+            [frontend.spec.storage :as storage-spec]
+            [cljs.spec.alpha :as s]
             [frontend.util :as util]))
 
 ;; TODO: refactor: separate side effects
@@ -12,6 +14,10 @@
 
 (defn set
   [key value]
+  ;; Prevent invalid data from being saved into storage
+  (s/assert ::storage-spec/local-storage
+            ;; Translate key to keyword for spec as not all keys are keywords
+            {(keyword key) value})
   (when-not util/node-test?
     (.setItem ^js js/localStorage (name key) (pr-str value))))