fix: various app-crashes related to KubeObject.spec.* access from "undefined"

fix: config-map-details crash

Signed-off-by: Roman <ixrock@gmail.com>

src/renderer/api/endpoints/cluster.api.ts

@@ -54,7 +54,7 @@ export class Cluster extends KubeObject {
   static kind = "Cluster";
   static apiBase = "/apis/cluster.k8s.io/v1alpha1/clusters";
 
-  spec: {
+  declare spec: {
     clusterNetwork?: {
       serviceDomain?: string;
       pods?: {

src/renderer/api/endpoints/crd.api.ts

@@ -22,7 +22,7 @@ export class CustomResourceDefinition extends KubeObject {
   static namespaced = false;
   static apiBase = "/apis/apiextensions.k8s.io/v1/customresourcedefinitions";
 
-  spec: {
+  declare spec: {
     group: string;
     version?: string; // deprecated in v1 api
     names: {

src/renderer/api/endpoints/cron-job.api.ts

@@ -48,7 +48,7 @@ export class CronJob extends KubeObject {
     autoBind(this);
   }
 
-  spec: {
+  declare spec: {
     schedule: string;
     concurrencyPolicy: string;
     suspend: boolean;

src/renderer/api/endpoints/hpa.api.ts

@@ -43,7 +43,7 @@ export class HorizontalPodAutoscaler extends KubeObject {
   static namespaced = true;
   static apiBase = "/apis/autoscaling/v2beta1/horizontalpodautoscalers";
 
-  spec: {
+  declare spec: {
     scaleTargetRef: {
       kind: string;
       name: string;

src/renderer/api/endpoints/ingress.api.ts

@@ -72,7 +72,7 @@ export class Ingress extends KubeObject {
     autoBind(this);
   }
 
-  spec: {
+  declare spec: {
     tls: {
       secretName: string;
     }[];

src/renderer/api/endpoints/limit-range.api.ts

@@ -40,7 +40,7 @@ export class LimitRange extends KubeObject {
     autoBind(this);
   }
 
-  spec: {
+  declare spec: {
     limits: LimitRangeItem[];
   };
 

src/renderer/api/endpoints/network-policy.api.ts

@@ -46,7 +46,7 @@ export class NetworkPolicy extends KubeObject {
     autoBind(this);
   }
 
-  spec: {
+  declare spec: {
     podSelector: {
       matchLabels: {
         [label: string]: string;

src/renderer/api/endpoints/nodes.api.ts

@@ -39,7 +39,7 @@ export class Node extends KubeObject {
     autoBind(this);
   }
 
-  spec: {
+  declare spec: {
     podCIDR: string;
     externalID: string;
     taints?: {

src/renderer/api/endpoints/persistent-volume-claims.api.ts

@@ -32,7 +32,7 @@ export class PersistentVolumeClaim extends KubeObject {
     autoBind(this);
   }
 
-  spec: {
+  declare spec: {
     accessModes: string[];
     storageClassName: string;
     selector: {

src/renderer/api/endpoints/persistent-volume.api.ts

@@ -14,7 +14,7 @@ export class PersistentVolume extends KubeObject {
     autoBind(this);
   }
 
-  spec: {
+  declare spec: {
     capacity: {
       storage: string; // 8Gi
     };

src/renderer/api/endpoints/poddisruptionbudget.api.ts

@@ -13,7 +13,7 @@ export class PodDisruptionBudget extends KubeObject {
     autoBind(this);
   }
 
-  spec: {
+  declare spec: {
     minAvailable: string;
     maxUnavailable: string;
     selector: { matchLabels: { [app: string]: string } };

src/renderer/api/endpoints/podsecuritypolicy.api.ts

@@ -13,7 +13,7 @@ export class PodSecurityPolicy extends KubeObject {
     autoBind(this);
   }
 
-  spec: {
+  declare spec: {
     allowPrivilegeEscalation?: boolean;
     allowedCSIDrivers?: {
       name: string;

src/renderer/api/endpoints/resource-quota.api.ts

@@ -40,7 +40,7 @@ export class ResourceQuota extends KubeObject {
     this.spec = this.spec || {} as any;
   }
 
-  spec: {
+  declare spec: {
     hard: IResourceQuotaValues;
     scopeSelector?: {
       matchExpressions: {

src/renderer/api/endpoints/selfsubjectrulesreviews.api.ts

@@ -25,7 +25,7 @@ export class SelfSubjectRulesReview extends KubeObject {
   static namespaced = false;
   static apiBase = "/apis/authorization.k8s.io/v1/selfsubjectrulesreviews";
 
-  spec: {
+  declare spec: {
     // todo: add more types from api docs
     namespace?: string;
   };

src/renderer/api/endpoints/service.api.ts

@@ -40,7 +40,7 @@ export class Service extends KubeObject {
     autoBind(this);
   }
 
-  spec: {
+  declare spec: {
     type: string;
     clusterIP: string;
     externalTrafficPolicy?: string;

src/renderer/api/kube-object.ts

@@ -144,7 +144,8 @@ export class KubeObject implements ItemObject {
   apiVersion: string;
   kind: string;
   metadata: IKubeObjectMetadata;
-  status?: any; // todo: type-safety support
+  status?: any;
+  spec: any = {};
 
   get selfLink() {
     return this.metadata.selfLink;

src/renderer/api/workload-kube-object.ts

@@ -47,8 +47,6 @@ export interface IAffinity {
 }
 
 export class WorkloadKubeObject extends KubeObject {
-  spec: any; // todo: add proper types
-
   getSelectors(): string[] {
     const selector = this.spec.selector;
 

src/renderer/components/+config-maps/config-map-details.tsx

@@ -62,17 +62,17 @@ export class ConfigMapDetails extends React.Component<Props> {
     const { object: configMap } = this.props;
 
     if (!configMap) return null;
-    const dataEntries = Object.entries(this.data);
+    const data = Array.from(this.data.entries());
 
     return (
       <div className="ConfigMapDetails">
         <KubeObjectMeta object={configMap}/>
         {
-          dataEntries.length > 0 && (
+          data.length > 0 && (
             <>
               <DrawerTitle title="Data"/>
               {
-                dataEntries.map(([name, value]) => {
+                data.map(([name, value]) => {
                   return (
                     <div key={name} className="data">
                       <div className="name">{name}</div>

src/renderer/components/+namespaces/namespace.store.ts

@@ -1,19 +1,11 @@
-import {
-  action,
-  comparer,
-  computed,
-  IReactionDisposer,
-  IReactionOptions,
-  observable,
-  reaction,
-  makeObservable,
-} from "mobx";
+import { action, comparer, computed, IReactionDisposer, IReactionOptions, makeObservable, observable, reaction, } from "mobx";
 import { autoBind, createStorage } from "../../utils";
 import { KubeObjectStore, KubeObjectStoreLoadingParams } from "../../kube-object.store";
 import { Namespace, namespacesApi } from "../../api/endpoints/namespaces.api";
 import { createPageParam } from "../../navigation";
 import { apiManager } from "../../api/api-manager";
 
+// FIXME: something fishy with sync selected-namespaces with URL
 const selectedNamespaces = createStorage<string[] | undefined>("selected_namespaces", undefined);
 
 export const namespaceUrlParam = createPageParam<string[]>({

src/renderer/components/+workloads-pods/pod-details-list.tsx

@@ -2,7 +2,7 @@ import "./pod-details-list.scss";
 
 import React from "react";
 import kebabCase from "lodash/kebabCase";
-import { reaction, makeObservable } from "mobx";
+import { reaction } from "mobx";
 import { disposeOnUnmount, observer } from "mobx-react";
 import { podsStore } from "./pods.store";
 import { Pod } from "../../api/endpoints";
@@ -50,11 +50,6 @@ export class PodDetailsList extends React.Component<Props> {
     [sortBy.memory]: (pod: Pod) => podsStore.getPodKubeMetrics(pod).memory,
   };
 
-  constructor(props: Props) {
-    super(props);
-    makeObservable(this);
-  }
-
   componentDidMount() {
     this.metricsWatcher.start(true);
     disposeOnUnmount(this, [

src/renderer/utils/storageHelper.ts

@@ -1,6 +1,6 @@
 // Helper for working with storages (e.g. window.localStorage, NodeJS/file-system, etc.)
 
-import { action, IObservableValue, makeObservable, observable, toJS, when, } from "mobx";
+import { action, comparer, IObservableValue, makeObservable, observable, toJS, when, } from "mobx";
 import produce, { Draft } from "immer";
 import { isEqual, isFunction, isPlainObject } from "lodash";
 import logger from "../../main/logger";
@@ -36,7 +36,11 @@ export class StorageHelper<T> {
 
     this.storage = options.storage;
     this.defaultValue = options.defaultValue;
-    this.data = observable.box<T>(this.defaultValue);
+    this.data = observable.box<T>(this.defaultValue, {
+      autoBind: true,
+      deep: true,
+      equals: comparer.structural,
+    });
 
     this.data.observe_(({ newValue, oldValue }) => {
       this.onChange(newValue as T, oldValue as T);