Persist local-storage in external json-file (#2279)

src/renderer/components/+cluster/cluster-overview.store.ts

@@ -16,36 +16,50 @@ export enum MetricNodeRole {
   WORKER = "worker"
 }
 
+export interface ClusterOverviewStorageState {
+  metricType: MetricType;
+  metricNodeRole: MetricNodeRole,
+}
+
 @autobind()
-export class ClusterOverviewStore extends KubeObjectStore<Cluster> {
+export class ClusterOverviewStore extends KubeObjectStore<Cluster> implements ClusterOverviewStorageState {
   api = clusterApi;
 
   @observable metrics: Partial<IClusterMetrics> = {};
   @observable metricsLoaded = false;
-  @observable metricType: MetricType;
-  @observable metricNodeRole: MetricNodeRole;
+
+  private storage = createStorage<ClusterOverviewStorageState>("cluster_overview", {
+    metricType: MetricType.CPU, // setup defaults
+    metricNodeRole: MetricNodeRole.WORKER,
+  });
+
+  get metricType(): MetricType {
+    return this.storage.get().metricType;
+  }
+
+  set metricType(value: MetricType) {
+    this.storage.merge({ metricType: value });
+  }
+
+  get metricNodeRole(): MetricNodeRole {
+    return this.storage.get().metricNodeRole;
+  }
+
+  set metricNodeRole(value: MetricNodeRole) {
+    this.storage.merge({ metricNodeRole: value });
+  }
 
   constructor() {
     super();
-    this.resetMetrics();
+    this.init();
+  }
 
-    // sync user setting with local storage
-    const storage = createStorage("cluster_metric_switchers", {});
-
-    Object.assign(this, storage.get());
-    reaction(() => {
-      const { metricType, metricNodeRole } = this;
-
-      return { metricType, metricNodeRole };
-    },
-    settings => storage.set(settings)
-    );
-
-    // auto-update metrics
+  private init() {
+    // TODO: refactor, seems not a correct place to be
+    // auto-refresh metrics on user-action
     reaction(() => this.metricNodeRole, () => {
       if (!this.metricsLoaded) return;
-      this.metrics = {};
-      this.metricsLoaded = false;
+      this.resetMetrics();
       this.loadMetrics();
     });
 
@@ -79,16 +93,16 @@ export class ClusterOverviewStore extends KubeObjectStore<Cluster> {
     }
   }
 
+  @action
   resetMetrics() {
     this.metrics = {};
     this.metricsLoaded = false;
-    this.metricType = MetricType.CPU;
-    this.metricNodeRole = MetricNodeRole.WORKER;
   }
 
   reset() {
     super.reset();
     this.resetMetrics();
+    this.storage?.reset();
   }
 }