From 87cdaa3661156d88f8fcc4494124f20e0edd477c Mon Sep 17 00:00:00 2001
From: Roman <ixrock@gmail.com>
Date: Mon, 3 May 2021 20:14:43 +0300
Subject: [PATCH] storage-helper fixes/ micro-refactoring

Signed-off-by: Roman <ixrock@gmail.com>
---
 src/renderer/utils/createStorage.ts | 10 ++++-----
 src/renderer/utils/storageHelper.ts | 32 ++++++++++++++++-------------
 2 files changed, 22 insertions(+), 20 deletions(-)

diff --git a/src/renderer/utils/createStorage.ts b/src/renderer/utils/createStorage.ts
index f7e6e91ece..f40a96a897 100755
--- a/src/renderer/utils/createStorage.ts
+++ b/src/renderer/utils/createStorage.ts
@@ -1,11 +1,9 @@
 // Keeps window.localStorage state in external JSON-files.
 // Because app creates random port between restarts => storage session wiped out each time.
-import type { CreateObservableOptions } from "mobx";
-
 import path from "path";
-import { app, remote } from "electron";
-import { observable, reaction, when } from "mobx";
 import fse from "fs-extra";
+import { app, remote } from "electron";
+import { observable, reaction, when, CreateObservableOptions } from "mobx";
 import { StorageHelper } from "./storageHelper";
 import { ClusterStore, getHostedClusterId } from "../../common/cluster-store";
 import logger from "../../main/logger";
@@ -14,7 +12,7 @@ let initialized = false;
 const loaded = observable.box(false);
 const storage = observable.map<string/* key */, any /* serializable */>();
 
-export function createStorage<T>(key: string, defaultValue: T, observableOptions?: CreateObservableOptions) {
+export function createStorage<T>(key: string, defaultValue: T, observableOptions?: CreateObservableOptions): StorageHelper<T> {
   const clusterId = getHostedClusterId();
   const savingFolder = path.resolve((app || remote.app).getPath("userData"), "lens-local-storage");
   const jsonFilePath = path.resolve(savingFolder, `${clusterId ?? "app"}.json`);
@@ -53,7 +51,7 @@ export function createStorage<T>(key: string, defaultValue: T, observableOptions
 
   return new StorageHelper<T>(key, {
     autoInit: true,
-    observable: observableOptions,
+    observableOptions,
     defaultValue,
     storage: {
       async getItem(key: string) {
diff --git a/src/renderer/utils/storageHelper.ts b/src/renderer/utils/storageHelper.ts
index d66efce1ac..3015369db8 100755
--- a/src/renderer/utils/storageHelper.ts
+++ b/src/renderer/utils/storageHelper.ts
@@ -2,7 +2,7 @@
 
 import { action, comparer, CreateObservableOptions, IObservableValue, IReactionDisposer, makeObservable, observable, reaction, toJS, when } from "mobx";
 import produce, { Draft } from "immer";
-import { isEqual, isFunction, isPlainObject, merge } from "lodash";
+import { isEqual, isFunction, isPlainObject } from "lodash";
 import logger from "../../main/logger";
 
 export interface StorageAdapter<T> {
@@ -14,8 +14,8 @@ export interface StorageAdapter<T> {
 }
 
 export interface StorageHelperOptions<T> {
-  autoInit?: boolean; // start preloading data immediately, default: true
-  observable?: CreateObservableOptions;
+  autoInit?: boolean; // start preloading data immediately (default: true)
+  observableOptions?: CreateObservableOptions;
   storage: StorageAdapter<T>;
   defaultValue: T;
 }
@@ -23,9 +23,10 @@ export interface StorageHelperOptions<T> {
 export class StorageHelper<T> {
   static defaultOptions: Partial<StorageHelperOptions<any>> = {
     autoInit: true,
-    observable: {
+    observableOptions: {
       deep: true,
-      equals: comparer.shallow,
+      defaultDecorator: observable,
+      equals: comparer.structural,
     }
   };
 
@@ -40,20 +41,23 @@ export class StorageHelper<T> {
   constructor(readonly key: string, private options: StorageHelperOptions<T>) {
     makeObservable(this);
 
-    this.options = merge({}, StorageHelper.defaultOptions, options);
+    this.options = Object.assign({}, StorageHelper.defaultOptions, options);
     this.storage = options.storage;
     this.defaultValue = options.defaultValue;
-    this.data = observable.box(this.defaultValue, this.options.observable);
-
-    this.unwatchChanges = reaction(() => toJS(this.data.get()), (newValue, oldValue) => {
-      this.onChange(newValue, oldValue);
-    }, this.options.observable);
+    this.data = observable.box(this.defaultValue, this.options.observableOptions);
+    this.bindEvents();
 
     if (this.options.autoInit) {
       this.init();
     }
   }
 
+  protected bindEvents() {
+    this.unwatchChanges = reaction(() => toJS(this.data.get()), (newValue, oldValue) => {
+      this.onChange(newValue, oldValue);
+    });
+  }
+
   @action
   init({ force = false } = {}) {
     if (this.initialized && !force) return;
@@ -115,7 +119,7 @@ export class StorageHelper<T> {
   }
 
   get(): T {
-    return this.data.get();
+    return this.data.get() ?? this.defaultValue;
   }
 
   set(value: T) {
@@ -143,8 +147,8 @@ export class StorageHelper<T> {
     this.set(nextValue as T);
   }
 
-  destroy() {
-    this.unwatchChanges();
+  unbindEvents() {
+    this.unwatchChanges?.();
   }
 
   toJS() {