diff --git a/src/common/search-store.ts b/src/common/search-store.ts index d9e3a3689a..93cc6557e8 100644 --- a/src/common/search-store.ts +++ b/src/common/search-store.ts @@ -1,6 +1,5 @@ -import { action, computed, observable, reaction, makeObservable } from "mobx"; +import { action, computed, makeObservable, observable, reaction } from "mobx"; import { dockStore } from "../renderer/components/dock/dock.store"; -import { autobind } from "../renderer/utils"; export class SearchStore { /** @@ -108,15 +107,13 @@ export class SearchStore { return prev; } - @autobind - public setNextOverlayActive(): void { + public setNextOverlayActive = (): void => { this.activeOverlayIndex = this.getNextOverlay(true); - } + }; - @autobind - public setPrevOverlayActive(): void { + public setPrevOverlayActive = (): void => { this.activeOverlayIndex = this.getPrevOverlay(true); - } + }; /** * Gets line index of where active overlay is located @@ -139,12 +136,11 @@ export class SearchStore { * @param line Index of the line where overlay is located * @param occurrence Number of the overlay within one line */ - @autobind - public isActiveOverlay(line: number, occurrence: number): boolean { + public isActiveOverlay = (line: number, occurrence: number): boolean => { const firstLineIndex = this.occurrences.findIndex(item => item === line); return firstLineIndex + occurrence === this.activeOverlayIndex; - } + }; @action private reset(): void { diff --git a/src/common/utils/autobind.ts b/src/common/utils/autobind.ts deleted file mode 100644 index f37d3a0797..0000000000 --- a/src/common/utils/autobind.ts +++ /dev/null @@ -1,47 +0,0 @@ -// Auto-binding class method(s) to proper "this"-context. -// Useful when calling methods after object-destruction or when method copied to scope variable. - -type Constructor = new (...args: any[]) => object; - -export function autobind>(target: T): T; -export function autobind(target: T, prop?: PropertyKey, descriptor?: PropertyDescriptor): PropertyDescriptor; - -export function autobind(target: any, prop?: PropertyKey, descriptor?: PropertyDescriptor) { - if (typeof target === "function") { - return bindClass(target); - } - if (typeof descriptor === "object") { - return bindMethod(target, prop, descriptor); - } -} - -export function bindClass>(target: T): T { - return new Proxy(target, { - construct(target, args: any[], newTarget?: any) { - const instance = Reflect.construct(target, args, newTarget); - const protoDescriptors = Object.entries(Object.getOwnPropertyDescriptors(target.prototype)); - protoDescriptors.forEach(([prop, descriptor]) => bindMethod(instance, prop, descriptor)); - return instance; - } - }) -} - -export function bindMethod(target: T, prop: PropertyKey, descriptor: PropertyDescriptor): PropertyDescriptor { - const originalMethod = descriptor.value; - - if (typeof originalMethod === "function") { - const boundDescriptor: PropertyDescriptor = { - configurable: descriptor.configurable, - enumerable: descriptor.enumerable, - get() { - return (...args: any[]) => Reflect.apply(originalMethod, this, args); - }, - set(value: any) { - Object.defineProperty(target, prop, { ...descriptor, value }); - } - }; - - Object.defineProperty(target, prop, boundDescriptor); - return boundDescriptor; - } -} diff --git a/src/common/utils/index.ts b/src/common/utils/index.ts index 57dd6e1cbc..2e63dbfe5a 100644 --- a/src/common/utils/index.ts +++ b/src/common/utils/index.ts @@ -3,7 +3,6 @@ export const noop: any = () => { /* empty */ }; export * from "./app-version"; -export * from "./autobind"; export * from "./base64"; export * from "./camelCase"; export * from "./toJS"; diff --git a/src/main/window-manager.ts b/src/main/window-manager.ts index 3686876acf..95200fa8df 100644 --- a/src/main/window-manager.ts +++ b/src/main/window-manager.ts @@ -1,5 +1,5 @@ import type { ClusterId } from "../common/cluster-store"; -import { observable, makeObservable } from "mobx"; +import { makeObservable, observable } from "mobx"; import { app, BrowserWindow, dialog, shell, webContents } from "electron"; import windowStateKeeper from "electron-window-state"; import { appEventBus } from "../common/event-bus"; @@ -10,7 +10,7 @@ import { Singleton } from "../common/utils"; import { ClusterFrameInfo, clusterFrameMap } from "../common/cluster-frames"; import { IpcRendererNavigationEvents } from "../renderer/navigation/events"; import logger from "./logger"; -import { productName } from "../common/vars"; +import { isDevelopment, productName } from "../common/vars"; export class WindowManager extends Singleton { protected mainWindow: BrowserWindow; @@ -59,7 +59,7 @@ export class WindowManager extends Singleton { nodeIntegration: true, nodeIntegrationInSubFrames: true, enableRemoteModule: true, - }, + } }); this.windowState.manage(this.mainWindow); @@ -84,6 +84,7 @@ export class WindowManager extends Singleton { shell.openExternal(url); }) .on("dom-ready", () => { + this.mainWindow.webContents.openDevTools({ mode: "right", activate: isDevelopment }); appEventBus.emit({ name: "app", action: "dom-ready" }); }) .on("did-fail-load", (_event, code, desc) => { diff --git a/src/renderer/api/api-manager.ts b/src/renderer/api/api-manager.ts index 88bb4dfabf..bbabb19085 100644 --- a/src/renderer/api/api-manager.ts +++ b/src/renderer/api/api-manager.ts @@ -1,9 +1,7 @@ import type { KubeObjectStore } from "../kube-object.store"; import { action, makeObservable, observable } from "mobx"; import { KubeApi, parseKubeApi } from "./kube-api"; -import { autobind } from "../../common/utils"; -@autobind export class ApiManager { private apis = observable.map(); private stores = observable.map(); diff --git a/src/renderer/api/endpoints/cluster-role.api.ts b/src/renderer/api/endpoints/cluster-role.api.ts index b89dc6ef1a..34397ab94c 100644 --- a/src/renderer/api/endpoints/cluster-role.api.ts +++ b/src/renderer/api/endpoints/cluster-role.api.ts @@ -1,8 +1,6 @@ -import { autobind } from "../../utils"; import { Role } from "./role.api"; import { KubeApi } from "../kube-api"; -@autobind export class ClusterRole extends Role { static kind = "ClusterRole"; static namespaced = false; diff --git a/src/renderer/api/endpoints/configmap.api.ts b/src/renderer/api/endpoints/configmap.api.ts index 15c9ad53ba..0a4c43677f 100644 --- a/src/renderer/api/endpoints/configmap.api.ts +++ b/src/renderer/api/endpoints/configmap.api.ts @@ -1,11 +1,9 @@ import { KubeObject } from "../kube-object"; import { KubeJsonApiData } from "../kube-json-api"; -import { autobind } from "../../utils"; import { KubeApi } from "../kube-api"; export type ConfigMapData = Record; -@autobind export class ConfigMap extends KubeObject { static kind = "ConfigMap"; static namespaced = true; diff --git a/src/renderer/api/endpoints/cron-job.api.ts b/src/renderer/api/endpoints/cron-job.api.ts index 319943ddb7..2ac931a4e0 100644 --- a/src/renderer/api/endpoints/cron-job.api.ts +++ b/src/renderer/api/endpoints/cron-job.api.ts @@ -2,7 +2,6 @@ import moment from "moment"; import { KubeObject } from "../kube-object"; import { IPodContainer } from "./pods.api"; import { formatDuration } from "../../utils/formatDuration"; -import { autobind } from "../../utils"; import { KubeApi } from "../kube-api"; export class CronJobApi extends KubeApi { @@ -37,7 +36,6 @@ export class CronJobApi extends KubeApi { } } -@autobind export class CronJob extends KubeObject { static kind = "CronJob"; static namespaced = true; diff --git a/src/renderer/api/endpoints/daemon-set.api.ts b/src/renderer/api/endpoints/daemon-set.api.ts index 5852ecf20a..90a2cf126b 100644 --- a/src/renderer/api/endpoints/daemon-set.api.ts +++ b/src/renderer/api/endpoints/daemon-set.api.ts @@ -1,10 +1,8 @@ import get from "lodash/get"; import { IPodContainer } from "./pods.api"; import { IAffinity, WorkloadKubeObject } from "../workload-kube-object"; -import { autobind } from "../../utils"; import { KubeApi } from "../kube-api"; -@autobind export class DaemonSet extends WorkloadKubeObject { static kind = "DaemonSet"; static namespaced = true; diff --git a/src/renderer/api/endpoints/deployment.api.ts b/src/renderer/api/endpoints/deployment.api.ts index 169ef853ed..96e52047bc 100644 --- a/src/renderer/api/endpoints/deployment.api.ts +++ b/src/renderer/api/endpoints/deployment.api.ts @@ -1,7 +1,6 @@ import moment from "moment"; import { IAffinity, WorkloadKubeObject } from "../workload-kube-object"; -import { autobind } from "../../utils"; import { KubeApi } from "../kube-api"; export class DeploymentApi extends KubeApi { @@ -66,7 +65,6 @@ interface IContainerProbe { failureThreshold?: number; } -@autobind export class Deployment extends WorkloadKubeObject { static kind = "Deployment"; static namespaced = true; diff --git a/src/renderer/api/endpoints/endpoint.api.ts b/src/renderer/api/endpoints/endpoint.api.ts index fe055d1747..5e2e362a48 100644 --- a/src/renderer/api/endpoints/endpoint.api.ts +++ b/src/renderer/api/endpoints/endpoint.api.ts @@ -1,4 +1,3 @@ -import { autobind } from "../../utils"; import { KubeObject } from "../kube-object"; import { KubeApi } from "../kube-api"; @@ -100,7 +99,6 @@ export class EndpointSubset implements IEndpointSubset { } } -@autobind export class Endpoint extends KubeObject { static kind = "Endpoints"; static namespaced = true; diff --git a/src/renderer/api/endpoints/events.api.ts b/src/renderer/api/endpoints/events.api.ts index 26c712b72b..d026d3d1f0 100644 --- a/src/renderer/api/endpoints/events.api.ts +++ b/src/renderer/api/endpoints/events.api.ts @@ -1,10 +1,8 @@ import moment from "moment"; import { KubeObject } from "../kube-object"; import { formatDuration } from "../../utils/formatDuration"; -import { autobind } from "../../utils"; import { KubeApi } from "../kube-api"; -@autobind export class KubeEvent extends KubeObject { static kind = "Event"; static namespaced = true; diff --git a/src/renderer/api/endpoints/helm-charts.api.ts b/src/renderer/api/endpoints/helm-charts.api.ts index 925f7c1d88..f1580c3151 100644 --- a/src/renderer/api/endpoints/helm-charts.api.ts +++ b/src/renderer/api/endpoints/helm-charts.api.ts @@ -1,7 +1,6 @@ import { compile } from "path-to-regexp"; import { apiBase } from "../index"; import { stringify } from "querystring"; -import { autobind } from "../../utils"; export type RepoHelmChartList = Record; export type HelmChartList = Record; @@ -62,7 +61,6 @@ export async function getChartValues(repo: string, name: string, version: string return apiBase.get(`/v2/charts/${repo}/${name}/values?${stringify({ version })}`); } -@autobind export class HelmChart { constructor(data: any) { Object.assign(this, data); diff --git a/src/renderer/api/endpoints/helm-releases.api.ts b/src/renderer/api/endpoints/helm-releases.api.ts index 38235e9739..4e368f7c0b 100644 --- a/src/renderer/api/endpoints/helm-releases.api.ts +++ b/src/renderer/api/endpoints/helm-releases.api.ts @@ -1,6 +1,6 @@ import jsYaml from "js-yaml"; import { compile } from "path-to-regexp"; -import { autobind, formatDuration } from "../../utils"; +import { formatDuration } from "../../utils"; import capitalize from "lodash/capitalize"; import { apiBase } from "../index"; import { helmChartStore } from "../../components/+apps-helm-charts/helm-chart.store"; @@ -134,7 +134,6 @@ export async function rollbackRelease(name: string, namespace: string, revision: }); } -@autobind export class HelmRelease implements ItemObject { constructor(data: any) { Object.assign(this, data); diff --git a/src/renderer/api/endpoints/ingress.api.ts b/src/renderer/api/endpoints/ingress.api.ts index 6af26710d0..b5efde79b6 100644 --- a/src/renderer/api/endpoints/ingress.api.ts +++ b/src/renderer/api/endpoints/ingress.api.ts @@ -1,5 +1,4 @@ import { KubeObject } from "../kube-object"; -import { autobind } from "../../utils"; import { IMetrics, metricsApi } from "./metrics.api"; import { KubeApi } from "../kube-api"; @@ -61,7 +60,6 @@ export const getBackendServiceNamePort = (backend: IIngressBackend) => { return { serviceName, servicePort }; }; -@autobind export class Ingress extends KubeObject { static kind = "Ingress"; static namespaced = true; diff --git a/src/renderer/api/endpoints/job.api.ts b/src/renderer/api/endpoints/job.api.ts index 109bdbeec2..1949f202f9 100644 --- a/src/renderer/api/endpoints/job.api.ts +++ b/src/renderer/api/endpoints/job.api.ts @@ -1,11 +1,9 @@ import get from "lodash/get"; -import { autobind } from "../../utils"; import { IAffinity, WorkloadKubeObject } from "../workload-kube-object"; import { IPodContainer } from "./pods.api"; import { KubeApi } from "../kube-api"; import { JsonApiParams } from "../json-api"; -@autobind export class Job extends WorkloadKubeObject { static kind = "Job"; static namespaced = true; diff --git a/src/renderer/api/endpoints/limit-range.api.ts b/src/renderer/api/endpoints/limit-range.api.ts index fcab56d9ce..b085c9f34b 100644 --- a/src/renderer/api/endpoints/limit-range.api.ts +++ b/src/renderer/api/endpoints/limit-range.api.ts @@ -1,6 +1,5 @@ import { KubeObject } from "../kube-object"; import { KubeApi } from "../kube-api"; -import { autobind } from "../../utils"; export enum LimitType { CONTAINER = "Container", @@ -29,7 +28,6 @@ export interface LimitRangeItem extends LimitRangeParts { type: string } -@autobind export class LimitRange extends KubeObject { static kind = "LimitRange"; static namespaced = true; diff --git a/src/renderer/api/endpoints/namespaces.api.ts b/src/renderer/api/endpoints/namespaces.api.ts index b5fee4d214..de4ff4455c 100644 --- a/src/renderer/api/endpoints/namespaces.api.ts +++ b/src/renderer/api/endpoints/namespaces.api.ts @@ -1,13 +1,11 @@ import { KubeApi } from "../kube-api"; import { KubeObject } from "../kube-object"; -import { autobind } from "../../utils"; export enum NamespaceStatus { ACTIVE = "Active", TERMINATING = "Terminating", } -@autobind export class Namespace extends KubeObject { static kind = "Namespace"; static namespaced = false; diff --git a/src/renderer/api/endpoints/network-policy.api.ts b/src/renderer/api/endpoints/network-policy.api.ts index a0894d7e6f..0375ea9126 100644 --- a/src/renderer/api/endpoints/network-policy.api.ts +++ b/src/renderer/api/endpoints/network-policy.api.ts @@ -1,5 +1,4 @@ import { KubeObject } from "../kube-object"; -import { autobind } from "../../utils"; import { KubeApi } from "../kube-api"; export interface IPolicyIpBlock { @@ -35,7 +34,6 @@ export interface IPolicyEgress { }[]; } -@autobind export class NetworkPolicy extends KubeObject { static kind = "NetworkPolicy"; static namespaced = true; diff --git a/src/renderer/api/endpoints/nodes.api.ts b/src/renderer/api/endpoints/nodes.api.ts index 24f20c6eaa..cfabc60b09 100644 --- a/src/renderer/api/endpoints/nodes.api.ts +++ b/src/renderer/api/endpoints/nodes.api.ts @@ -1,5 +1,5 @@ import { KubeObject } from "../kube-object"; -import { autobind, cpuUnitsToNumber, unitsToBytes } from "../../utils"; +import { cpuUnitsToNumber, unitsToBytes } from "../../utils"; import { IMetrics, metricsApi } from "./metrics.api"; import { KubeApi } from "../kube-api"; @@ -28,7 +28,6 @@ export interface INodeMetrics { fsSize: T; } -@autobind export class Node extends KubeObject { static kind = "Node"; static namespaced = false; diff --git a/src/renderer/api/endpoints/persistent-volume-claims.api.ts b/src/renderer/api/endpoints/persistent-volume-claims.api.ts index 1e7245e16b..38144160ba 100644 --- a/src/renderer/api/endpoints/persistent-volume-claims.api.ts +++ b/src/renderer/api/endpoints/persistent-volume-claims.api.ts @@ -1,5 +1,4 @@ import { KubeObject } from "../kube-object"; -import { autobind } from "../../utils"; import { IMetrics, metricsApi } from "./metrics.api"; import { Pod } from "./pods.api"; import { KubeApi } from "../kube-api"; @@ -21,7 +20,6 @@ export interface IPvcMetrics { diskCapacity: T; } -@autobind export class PersistentVolumeClaim extends KubeObject { static kind = "PersistentVolumeClaim"; static namespaced = true; diff --git a/src/renderer/api/endpoints/persistent-volume.api.ts b/src/renderer/api/endpoints/persistent-volume.api.ts index 7c0abcf0d2..7942e19732 100644 --- a/src/renderer/api/endpoints/persistent-volume.api.ts +++ b/src/renderer/api/endpoints/persistent-volume.api.ts @@ -1,9 +1,7 @@ import { KubeObject } from "../kube-object"; import { unitsToBytes } from "../../utils/convertMemory"; -import { autobind } from "../../utils"; import { KubeApi } from "../kube-api"; -@autobind export class PersistentVolume extends KubeObject { static kind = "PersistentVolume"; static namespaced = false; diff --git a/src/renderer/api/endpoints/poddisruptionbudget.api.ts b/src/renderer/api/endpoints/poddisruptionbudget.api.ts index 4423c64151..047275c7ca 100644 --- a/src/renderer/api/endpoints/poddisruptionbudget.api.ts +++ b/src/renderer/api/endpoints/poddisruptionbudget.api.ts @@ -1,8 +1,6 @@ -import { autobind } from "../../utils"; import { KubeObject } from "../kube-object"; import { KubeApi } from "../kube-api"; -@autobind export class PodDisruptionBudget extends KubeObject { static kind = "PodDisruptionBudget"; static namespaced = true; diff --git a/src/renderer/api/endpoints/pods.api.ts b/src/renderer/api/endpoints/pods.api.ts index b31638a033..c8e0187184 100644 --- a/src/renderer/api/endpoints/pods.api.ts +++ b/src/renderer/api/endpoints/pods.api.ts @@ -1,5 +1,4 @@ import { IAffinity, WorkloadKubeObject } from "../workload-kube-object"; -import { autobind } from "../../utils"; import { IMetrics, metricsApi } from "./metrics.api"; import { KubeApi } from "../kube-api"; @@ -181,7 +180,6 @@ export interface IPodContainerStatus { started?: boolean; } -@autobind export class Pod extends WorkloadKubeObject { static kind = "Pod"; static namespaced = true; diff --git a/src/renderer/api/endpoints/podsecuritypolicy.api.ts b/src/renderer/api/endpoints/podsecuritypolicy.api.ts index 09aee92ac1..0f433178b7 100644 --- a/src/renderer/api/endpoints/podsecuritypolicy.api.ts +++ b/src/renderer/api/endpoints/podsecuritypolicy.api.ts @@ -1,8 +1,6 @@ -import { autobind } from "../../utils"; import { KubeObject } from "../kube-object"; import { KubeApi } from "../kube-api"; -@autobind export class PodSecurityPolicy extends KubeObject { static kind = "PodSecurityPolicy"; static namespaced = false; diff --git a/src/renderer/api/endpoints/replica-set.api.ts b/src/renderer/api/endpoints/replica-set.api.ts index ae90d0a58b..06173257db 100644 --- a/src/renderer/api/endpoints/replica-set.api.ts +++ b/src/renderer/api/endpoints/replica-set.api.ts @@ -1,5 +1,4 @@ import get from "lodash/get"; -import { autobind } from "../../utils"; import { WorkloadKubeObject } from "../workload-kube-object"; import { IPodContainer, Pod } from "./pods.api"; import { KubeApi } from "../kube-api"; @@ -27,7 +26,6 @@ export class ReplicaSetApi extends KubeApi { } } -@autobind export class ReplicaSet extends WorkloadKubeObject { static kind = "ReplicaSet"; static namespaced = true; diff --git a/src/renderer/api/endpoints/role-binding.api.ts b/src/renderer/api/endpoints/role-binding.api.ts index 75f884a2d6..a04348b5e7 100644 --- a/src/renderer/api/endpoints/role-binding.api.ts +++ b/src/renderer/api/endpoints/role-binding.api.ts @@ -1,4 +1,3 @@ -import { autobind } from "../../utils"; import { KubeObject } from "../kube-object"; import { KubeApi } from "../kube-api"; @@ -9,7 +8,6 @@ export interface IRoleBindingSubject { apiGroup?: string; } -@autobind export class RoleBinding extends KubeObject { static kind = "RoleBinding"; static namespaced = true; diff --git a/src/renderer/api/endpoints/secret.api.ts b/src/renderer/api/endpoints/secret.api.ts index 08f05e9187..620674a2dc 100644 --- a/src/renderer/api/endpoints/secret.api.ts +++ b/src/renderer/api/endpoints/secret.api.ts @@ -1,6 +1,5 @@ import { KubeObject } from "../kube-object"; import { KubeJsonApiData } from "../kube-json-api"; -import { autobind } from "../../utils"; import { KubeApi } from "../kube-api"; export enum SecretType { @@ -19,7 +18,6 @@ export interface ISecretRef { name: string; } -@autobind export class Secret extends KubeObject { static kind = "Secret"; static namespaced = true; diff --git a/src/renderer/api/endpoints/service-accounts.api.ts b/src/renderer/api/endpoints/service-accounts.api.ts index 2790573df9..53e2a5f9f4 100644 --- a/src/renderer/api/endpoints/service-accounts.api.ts +++ b/src/renderer/api/endpoints/service-accounts.api.ts @@ -1,8 +1,6 @@ -import { autobind } from "../../utils"; import { KubeObject } from "../kube-object"; import { KubeApi } from "../kube-api"; -@autobind export class ServiceAccount extends KubeObject { static kind = "ServiceAccount"; static namespaced = true; diff --git a/src/renderer/api/endpoints/service.api.ts b/src/renderer/api/endpoints/service.api.ts index b45415a328..e067411dd9 100644 --- a/src/renderer/api/endpoints/service.api.ts +++ b/src/renderer/api/endpoints/service.api.ts @@ -1,4 +1,3 @@ -import { autobind } from "../../utils"; import { KubeObject } from "../kube-object"; import { KubeApi } from "../kube-api"; @@ -29,7 +28,6 @@ export class ServicePort implements IServicePort { } } -@autobind export class Service extends KubeObject { static kind = "Service"; static namespaced = true; diff --git a/src/renderer/api/endpoints/stateful-set.api.ts b/src/renderer/api/endpoints/stateful-set.api.ts index dcb9bff9c0..cab886bc3b 100644 --- a/src/renderer/api/endpoints/stateful-set.api.ts +++ b/src/renderer/api/endpoints/stateful-set.api.ts @@ -1,7 +1,6 @@ import get from "lodash/get"; import { IPodContainer } from "./pods.api"; import { IAffinity, WorkloadKubeObject } from "../workload-kube-object"; -import { autobind } from "../../utils"; import { KubeApi } from "../kube-api"; export class StatefulSetApi extends KubeApi { @@ -27,7 +26,6 @@ export class StatefulSetApi extends KubeApi { } } -@autobind export class StatefulSet extends WorkloadKubeObject { static kind = "StatefulSet"; static namespaced = true; diff --git a/src/renderer/api/endpoints/storage-class.api.ts b/src/renderer/api/endpoints/storage-class.api.ts index 0d747f9720..74feddd6c4 100644 --- a/src/renderer/api/endpoints/storage-class.api.ts +++ b/src/renderer/api/endpoints/storage-class.api.ts @@ -1,8 +1,6 @@ -import { autobind } from "../../utils"; import { KubeObject } from "../kube-object"; import { KubeApi } from "../kube-api"; -@autobind export class StorageClass extends KubeObject { static kind = "StorageClass"; static namespaced = false; diff --git a/src/renderer/api/kube-object.ts b/src/renderer/api/kube-object.ts index 8e79cc729a..c9be3cb152 100644 --- a/src/renderer/api/kube-object.ts +++ b/src/renderer/api/kube-object.ts @@ -2,7 +2,7 @@ import moment from "moment"; import { KubeJsonApiData, KubeJsonApiDataList, KubeJsonApiListMetadata, KubeJsonApiMetadata } from "./kube-json-api"; -import { autobind, formatDuration } from "../utils"; +import { formatDuration } from "../utils"; import { ItemObject } from "../item.store"; import { apiKube } from "./index"; import { JsonApiParams } from "./json-api"; @@ -66,7 +66,6 @@ export class KubeStatus { export type IKubeMetaField = keyof IKubeObjectMetadata; -@autobind export class KubeObject implements ItemObject { static readonly kind: string; static readonly namespaced: boolean; diff --git a/src/renderer/api/kube-watch-api.ts b/src/renderer/api/kube-watch-api.ts index 2d0b37fcf1..e1e16123c9 100644 --- a/src/renderer/api/kube-watch-api.ts +++ b/src/renderer/api/kube-watch-api.ts @@ -5,7 +5,7 @@ import type { KubeObjectStore } from "../kube-object.store"; import type { ClusterContext } from "../components/context"; import plimit from "p-limit"; import { comparer, IReactionDisposer, makeObservable, observable, reaction, when } from "mobx"; -import { autobind, noop } from "../utils"; +import { noop } from "../utils"; import { KubeJsonApiData } from "./kube-json-api"; import { isDebugging, isProduction } from "../../common/vars"; @@ -27,7 +27,6 @@ export interface IKubeWatchLog { cssStyle?: string; } -@autobind export class KubeWatchApi { @observable context: ClusterContext = null; diff --git a/src/renderer/api/terminal-api.ts b/src/renderer/api/terminal-api.ts index 714ca165c5..b22505fd1f 100644 --- a/src/renderer/api/terminal-api.ts +++ b/src/renderer/api/terminal-api.ts @@ -1,5 +1,5 @@ import { stringify } from "querystring"; -import { autobind, base64, EventEmitter } from "../utils"; +import { base64, EventEmitter } from "../utils"; import { WebSocketApi } from "./websocket-api"; import isEqual from "lodash/isEqual"; import { isDevelopment } from "../../common/vars"; @@ -85,8 +85,7 @@ export class TerminalApi extends WebSocketApi { this.onReady.removeAllListeners(); } - @autobind - protected _onReady(data: string) { + protected _onReady = (data: string) => { if (!data) return; this.isReady = true; this.onReady.emit(); @@ -95,7 +94,7 @@ export class TerminalApi extends WebSocketApi { this.onData.emit(data); // re-emit data return false; // prevent calling rest of listeners - } + }; reconnect() { super.reconnect(); diff --git a/src/renderer/components/+apps-helm-charts/helm-chart-details.tsx b/src/renderer/components/+apps-helm-charts/helm-chart-details.tsx index b03a851cba..6a3bf40310 100644 --- a/src/renderer/components/+apps-helm-charts/helm-chart-details.tsx +++ b/src/renderer/components/+apps-helm-charts/helm-chart-details.tsx @@ -2,10 +2,10 @@ import "./helm-chart-details.scss"; import React, { Component } from "react"; import { getChartDetails, HelmChart } from "../../api/endpoints/helm-charts.api"; -import { observable, autorun, makeObservable } from "mobx"; +import { autorun, makeObservable, observable } from "mobx"; import { observer } from "mobx-react"; import { Drawer, DrawerItem } from "../drawer"; -import { autobind, stopPropagation } from "../../utils"; +import { stopPropagation } from "../../utils"; import { MarkdownViewer } from "../markdown-viewer"; import { Spinner } from "../spinner"; import { Button } from "../button"; @@ -51,8 +51,7 @@ export class HelmChartDetails extends Component { }); }); - @autobind - async onVersionChange({ value: version }: SelectOption) { + async onVersionChange(version: string) { this.selectedChart = this.chartVersions.find(chart => chart.version === version); this.readme = null; @@ -60,7 +59,7 @@ export class HelmChartDetails extends Component { this.abortController?.abort(); this.abortController = new AbortController(); const { chart: { name, repo } } = this.props; - const { readme } = await getChartDetails(repo, name, { version, reqInit: { signal: this.abortController.signal }}); + const { readme } = await getChartDetails(repo, name, { version, reqInit: { signal: this.abortController.signal } }); this.readme = readme; } catch (error) { @@ -68,14 +67,13 @@ export class HelmChartDetails extends Component { } } - @autobind install() { createInstallChartTab(this.selectedChart); this.props.hideDetails(); } renderIntroduction() { - const { selectedChart, chartVersions, onVersionChange } = this; + const { selectedChart, chartVersions } = this; const placeholder = require("./helm-placeholder.svg"); return ( @@ -88,7 +86,7 @@ export class HelmChartDetails extends Component {
{selectedChart.getDescription()} -
{ const id = dockStore.selectedTabId; diff --git a/src/renderer/components/dock/logs.tsx b/src/renderer/components/dock/logs.tsx index 498fcd9343..5a6c378c56 100644 --- a/src/renderer/components/dock/logs.tsx +++ b/src/renderer/components/dock/logs.tsx @@ -1,9 +1,8 @@ import React from "react"; -import { observable, reaction, makeObservable } from "mobx"; +import { makeObservable, observable, reaction } from "mobx"; import { disposeOnUnmount, observer } from "mobx-react"; import { searchStore } from "../../../common/search-store"; -import { autobind } from "../../utils"; import { IDockTab } from "./dock.store"; import { InfoPanel } from "./info-panel"; import { LogResourceSelector } from "./log-resource-selector"; @@ -54,16 +53,14 @@ export class Logs extends React.Component { * A function for various actions after search is happened * @param query {string} A text from search field */ - @autobind - onSearch() { + onSearch = () => { this.toOverlay(); - } + }; /** * Scrolling to active overlay (search word highlight) */ - @autobind - toOverlay() { + toOverlay = () => { const { activeOverlayLine } = searchStore; if (!this.logListElement.current || activeOverlayLine === undefined) return; @@ -76,7 +73,7 @@ export class Logs extends React.Component { if (!overlay) return; overlay.scrollIntoViewIfNeeded(); }, 100); - } + }; renderResourceSelector(data?: LogTabData) { if (!data) { diff --git a/src/renderer/components/dock/terminal-tab.tsx b/src/renderer/components/dock/terminal-tab.tsx index ba3f757581..9b634c0398 100644 --- a/src/renderer/components/dock/terminal-tab.tsx +++ b/src/renderer/components/dock/terminal-tab.tsx @@ -3,7 +3,7 @@ import "./terminal-tab.scss"; import React from "react"; import { reaction } from "mobx"; import { observer } from "mobx-react"; -import { autobind, cssNames } from "../../utils"; +import { cssNames } from "../../utils"; import { DockTab, DockTabProps } from "./dock-tab"; import { Icon } from "../icon"; import { terminalStore } from "./terminal.store"; @@ -28,10 +28,9 @@ export class TerminalTab extends React.Component { return terminalStore.isDisconnected(this.tabId); } - @autobind - reconnect() { + reconnect = () => { terminalStore.reconnect(this.tabId); - } + }; render() { const tabIcon = ; diff --git a/src/renderer/components/dock/terminal.store.ts b/src/renderer/components/dock/terminal.store.ts index ac0777bec6..dd3f41bfcc 100644 --- a/src/renderer/components/dock/terminal.store.ts +++ b/src/renderer/components/dock/terminal.store.ts @@ -3,7 +3,6 @@ import { Terminal } from "./terminal"; import { TerminalApi } from "../../api/terminal-api"; import { dockStore, IDockTab, TabId, TabKind } from "./dock.store"; import { WebSocketApiState } from "../../api/websocket-api"; -import { autobind } from "../../../common/utils"; export interface ITerminalTab extends IDockTab { node?: string; // activate node shell mode @@ -21,7 +20,6 @@ export function createTerminalTab(tabParams: Partial = {}) { }); } -@autobind export class TerminalStore { protected terminals = new Map(); protected connections = observable.map(); diff --git a/src/renderer/components/dock/terminal.ts b/src/renderer/components/dock/terminal.ts index 623f041da8..898f6adc8d 100644 --- a/src/renderer/components/dock/terminal.ts +++ b/src/renderer/components/dock/terminal.ts @@ -4,7 +4,6 @@ import { FitAddon } from "xterm-addon-fit"; import { dockStore, TabId } from "./dock.store"; import { TerminalApi } from "../../api/terminal-api"; import { ThemeStore } from "../../theme.store"; -import { autobind, toJS } from "../../utils"; import { isMac } from "../../../common/vars"; import { camelCase, debounce } from "lodash"; @@ -35,8 +34,7 @@ export class Terminal { public scrollPos = 0; public disposers: Function[] = []; - @autobind - protected setTheme(colors: Record) { + protected setTheme = (colors: Record) => { // Replacing keys stored in styles to format accepted by terminal // E.g. terminalBrightBlack -> brightBlack const colorPrefix = "terminal"; @@ -46,7 +44,7 @@ export class Terminal { const terminalColors = Object.fromEntries(terminalColorEntries); this.xterm.setOption("theme", terminalColors); - } + }; get elem() { return this.xterm.element; @@ -103,7 +101,7 @@ export class Terminal { window.addEventListener("resize", this.onResize); this.disposers.push( - reaction(() => toJS(ThemeStore.getInstance().activeTheme.colors), this.setTheme, { + reaction(() => ThemeStore.getInstance().activeTheme.colors, this.setTheme, { fireImmediately: true }), dockStore.onResize(this.onResize), diff --git a/src/renderer/components/editable-list/editable-list.tsx b/src/renderer/components/editable-list/editable-list.tsx index e0f72c4bca..9b44c49141 100644 --- a/src/renderer/components/editable-list/editable-list.tsx +++ b/src/renderer/components/editable-list/editable-list.tsx @@ -3,9 +3,8 @@ import "./editable-list.scss"; import React from "react"; import { Icon } from "../icon"; import { Input } from "../input"; -import { observable, makeObservable } from "mobx"; +import { makeObservable, observable } from "mobx"; import { observer } from "mobx-react"; -import { autobind } from "../../utils"; export interface Props { items: T[], @@ -33,15 +32,14 @@ export class EditableList extends React.Component> { makeObservable(this); } - @autobind - onSubmit(val: string) { + onSubmit = (value: string) => { const { add } = this.props; - if (val) { - add(val); + if (value) { + add(value); this.currentNewItem = ""; } - } + }; render() { const { items, remove, renderItem, placeholder } = this.props; @@ -63,7 +61,7 @@ export class EditableList extends React.Component> {
{renderItem(item, index)}
- remove(({ index, oldItem: item }))} /> + remove(({ index, oldItem: item }))}/>
)) diff --git a/src/renderer/components/icon/icon.tsx b/src/renderer/components/icon/icon.tsx index 0c4cec3fef..60112838bd 100644 --- a/src/renderer/components/icon/icon.tsx +++ b/src/renderer/components/icon/icon.tsx @@ -4,7 +4,7 @@ import React, { ReactNode } from "react"; import { findDOMNode } from "react-dom"; import { NavLink } from "react-router-dom"; import { LocationDescriptor } from "history"; -import { autobind, cssNames } from "../../utils"; +import { cssNames } from "../../utils"; import { TooltipDecoratorProps, withTooltip } from "../tooltip"; import isNumber from "lodash/isNumber"; @@ -36,8 +36,7 @@ export class Icon extends React.PureComponent { return interactive ?? !!(onClick || href || link); } - @autobind - onClick(evt: React.MouseEvent) { + onClick = (evt: React.MouseEvent) => { if (this.props.disabled) { return; } @@ -45,10 +44,9 @@ export class Icon extends React.PureComponent { if (this.props.onClick) { this.props.onClick(evt); } - } + }; - @autobind - onKeyDown(evt: React.KeyboardEvent) { + onKeyDown = (evt: React.KeyboardEvent) => { switch (evt.nativeEvent.code) { case "Space": @@ -65,7 +63,7 @@ export class Icon extends React.PureComponent { if (this.props.onKeyDown) { this.props.onKeyDown(evt); } - } + }; render() { const { isInteractive } = this; diff --git a/src/renderer/components/input/drop-file-input.tsx b/src/renderer/components/input/drop-file-input.tsx index 7be233e1d6..3b28baa5a7 100644 --- a/src/renderer/components/input/drop-file-input.tsx +++ b/src/renderer/components/input/drop-file-input.tsx @@ -1,7 +1,7 @@ import "./drop-file-input.scss"; import React from "react"; -import { autobind, cssNames, IClassName } from "../../utils"; -import { observable, makeObservable } from "mobx"; +import { cssNames, IClassName } from "../../utils"; +import { makeObservable, observable } from "mobx"; import { observer } from "mobx-react"; import logger from "../../../main/logger"; @@ -24,27 +24,23 @@ export class DropFileInput extends React.Component< makeObservable(this); } - @autobind - onDragEnter() { + onDragEnter = () => { this.dropAreaActive = true; - } + }; - @autobind - onDragLeave() { + onDragLeave = () => { this.dropAreaActive = false; - } + }; - @autobind - onDragOver(evt: React.DragEvent) { + onDragOver = (evt: React.DragEvent) => { if (this.props.onDragOver) { this.props.onDragOver(evt); } evt.preventDefault(); // enable onDrop()-callback evt.dataTransfer.dropEffect = "move"; - } + }; - @autobind - onDrop(evt: React.DragEvent) { + onDrop = (evt: React.DragEvent) => { if (this.props.onDrop) { this.props.onDrop(evt); } @@ -54,7 +50,7 @@ export class DropFileInput extends React.Component< if (files.length > 0) { this.props.onDropFiles(files, { evt }); } - } + }; render() { const { onDragEnter, onDragLeave, onDragOver, onDrop } = this; diff --git a/src/renderer/components/input/input.tsx b/src/renderer/components/input/input.tsx index c90831a6b9..35c30f9157 100644 --- a/src/renderer/components/input/input.tsx +++ b/src/renderer/components/input/input.tsx @@ -1,7 +1,7 @@ import "./input.scss"; import React, { DOMAttributes, InputHTMLAttributes, TextareaHTMLAttributes } from "react"; -import { autobind, cssNames, debouncePromise, getRandId } from "../../utils"; +import { cssNames, debouncePromise, getRandId } from "../../utils"; import { Icon } from "../icon"; import { Tooltip, TooltipProps } from "../tooltip"; import * as Validators from "./input_validators"; @@ -195,26 +195,23 @@ export class Input extends React.Component { this.setState({ dirty }); } - @autobind - onFocus(evt: React.FocusEvent) { + onFocus = (evt: React.FocusEvent) => { const { onFocus, autoSelectOnFocus } = this.props; if (onFocus) onFocus(evt); if (autoSelectOnFocus) this.select(); this.setState({ focused: true }); - } + }; - @autobind - onBlur(evt: React.FocusEvent) { + onBlur = (evt: React.FocusEvent) => { const { onBlur } = this.props; if (onBlur) onBlur(evt); if (this.state.dirtyOnBlur) this.setState({ dirty: true, dirtyOnBlur: false }); this.setState({ focused: false }); - } + }; - @autobind - onChange(evt: React.ChangeEvent) { + onChange = (evt: React.ChangeEvent) => { if (this.props.onChange) { this.props.onChange(evt.currentTarget.value, evt); } @@ -230,10 +227,9 @@ export class Input extends React.Component { if (this.isUncontrolled && this.showMaxLenIndicator) { this.forceUpdate(); } - } + }; - @autobind - onKeyDown(evt: React.KeyboardEvent) { + onKeyDown = (evt: React.KeyboardEvent) => { const modified = evt.shiftKey || evt.metaKey || evt.altKey || evt.ctrlKey; if (this.props.onKeyDown) { @@ -247,7 +243,7 @@ export class Input extends React.Component { } break; } - } + }; get showMaxLenIndicator() { const { maxLength, multiLine } = this.props; @@ -281,10 +277,9 @@ export class Input extends React.Component { } } - @autobind - bindRef(elem: InputElement) { + bindRef = (elem: InputElement) => { this.input = elem; - } + }; render() { const { diff --git a/src/renderer/components/input/search-input.tsx b/src/renderer/components/input/search-input.tsx index 43da86bdeb..e8024e6e49 100644 --- a/src/renderer/components/input/search-input.tsx +++ b/src/renderer/components/input/search-input.tsx @@ -2,7 +2,7 @@ import "./search-input.scss"; import React, { createRef } from "react"; import { observer } from "mobx-react"; -import { autobind, cssNames } from "../../utils"; +import { cssNames } from "../../utils"; import { Icon } from "../icon"; import { Input, InputProps } from "./input"; @@ -37,17 +37,15 @@ export class SearchInput extends React.Component { window.removeEventListener("keydown", this.onGlobalKey); } - @autobind - onGlobalKey(evt: KeyboardEvent) { + onGlobalKey = (evt: KeyboardEvent) => { const meta = evt.metaKey || evt.ctrlKey; if (meta && evt.key === "f") { this.inputRef.current.focus(); } - } + }; - @autobind - onKeyDown(evt: React.KeyboardEvent) { + onKeyDown = (evt: React.KeyboardEvent) => { if (this.props.onKeyDown) { this.props.onKeyDown(evt); } @@ -58,16 +56,15 @@ export class SearchInput extends React.Component { this.clear(); evt.stopPropagation(); } - } + }; - @autobind - clear() { + clear = () => { if (this.props.onClear) { this.props.onClear(); } else { this.inputRef.current.setValue(""); } - } + }; render() { const { className, compact, onClear, showClearIcon, bindGlobalFocusHotkey, value, ...inputProps } = this.props; diff --git a/src/renderer/components/item-object-list/item-list-layout.tsx b/src/renderer/components/item-object-list/item-list-layout.tsx index 5bf6cfdefb..ab278a48ed 100644 --- a/src/renderer/components/item-object-list/item-list-layout.tsx +++ b/src/renderer/components/item-object-list/item-list-layout.tsx @@ -6,7 +6,7 @@ import { computed, makeObservable } from "mobx"; import { disposeOnUnmount, observer } from "mobx-react"; import { ConfirmDialog, ConfirmDialogParams } from "../confirm-dialog"; import { Table, TableCell, TableCellProps, TableHead, TableProps, TableRow, TableRowProps, TableSortCallback } from "../table"; -import { autobind, createStorage, cssNames, IClassName, isReactNode, noop, ObservableToggleSet, prevDefault, stopPropagation } from "../../utils"; +import { createStorage, cssNames, IClassName, isReactNode, noop, ObservableToggleSet, prevDefault, stopPropagation } from "../../utils"; import { AddRemoveButtons, AddRemoveButtonsProps } from "../add-remove-buttons"; import { NoItems } from "../no-items"; import { Spinner } from "../spinner"; @@ -94,7 +94,6 @@ const defaultProps: Partial = { customizeTableRowProps: () => ({} as TableRowProps), }; -@autobind @observer export class ItemListLayout extends React.Component { static defaultProps = defaultProps as object; @@ -222,7 +221,7 @@ export class ItemListLayout extends React.Component { return this.applyFilters(filterItems.concat(this.props.filterItems), items); } - getRow(uid: string) { + getRow = (uid: string) => { const { isSelectable, renderTableHeader, renderTableContents, renderItemMenu, store, hasDetailsView, onDetails, @@ -272,9 +271,9 @@ export class ItemListLayout extends React.Component { )} ); - } + }; - removeItemsDialog() { + removeItemsDialog = () => { const { customizeRemoveDialog, store } = this.props; const { selectedItems } = store; const visibleMaxNamesCount = 5; @@ -291,7 +290,7 @@ export class ItemListLayout extends React.Component { message, ...dialogCustomProps, }); - } + }; toggleFilters() { this.showFilters = !this.showFilters; @@ -444,7 +443,6 @@ export class ItemListLayout extends React.Component { store, hasDetailsView, addRemoveButtons = {}, virtual, sortingCallbacks, detailsItem, className, tableProps = {}, tableId, } = this.props; - const { removeItemsDialog, items } = this; const { selectedItems } = store; const selectedItemId = detailsItem && detailsItem.getId(); const classNames = cssNames(className, "box", "grow", ThemeStore.getInstance().activeTheme.type); @@ -457,7 +455,7 @@ export class ItemListLayout extends React.Component { selectable={hasDetailsView} sortable={sortingCallbacks} getTableRow={this.getRow} - items={items} + items={this.items} selectedItemId={selectedItemId} noItems={this.renderNoItems()} className={classNames} @@ -467,7 +465,7 @@ export class ItemListLayout extends React.Component { {this.renderItems()} diff --git a/src/renderer/components/item-object-list/page-filters.store.ts b/src/renderer/components/item-object-list/page-filters.store.ts index c89e0e4636..55d8cfeacf 100644 --- a/src/renderer/components/item-object-list/page-filters.store.ts +++ b/src/renderer/components/item-object-list/page-filters.store.ts @@ -1,6 +1,5 @@ import { computed, makeObservable, observable, reaction } from "mobx"; import { searchUrlParam } from "../input/search-input-url"; -import { autobind } from "../../../common/utils"; export enum FilterType { SEARCH = "search", @@ -12,7 +11,6 @@ export interface Filter { value: string; } -@autobind export class PageFiltersStore { protected filters = observable.array([], { deep: false }); protected isDisabled = observable.map(); diff --git a/src/renderer/components/kube-object/kube-object-menu.tsx b/src/renderer/components/kube-object/kube-object-menu.tsx index c8a1dedad6..a4eec2b795 100644 --- a/src/renderer/components/kube-object/kube-object-menu.tsx +++ b/src/renderer/components/kube-object/kube-object-menu.tsx @@ -1,5 +1,5 @@ import React from "react"; -import { autobind, cssNames } from "../../utils"; +import { cssNames } from "../../utils"; import { KubeObject } from "../../api/kube-object"; import { editResourceTab } from "../dock/edit-resource.store"; import { MenuActions, MenuActionsProps } from "../menu/menu-actions"; @@ -34,23 +34,20 @@ export class KubeObjectMenu extends React.Component { hideDetails(); editResourceTab(this.props.object); - } + }; - @autobind - async remove() { + remove = async () => { hideDetails(); const { object, removeAction } = this.props; if (removeAction) await removeAction(); else await this.store.remove(object); - } + }; - @autobind - renderRemoveMessage() { + renderRemoveMessage = () => { const { object } = this.props; if (!object) { @@ -60,7 +57,7 @@ export class KubeObjectMenu extends React.ComponentRemove {object.kind} {object.getName()}?

); - } + }; getMenuItems(object: T): React.ReactChild[] { if (!object) { @@ -69,7 +66,7 @@ export class KubeObjectMenu extends React.Component ( + .map(({ components: { MenuItem } }, index) => ( = { export class PageLayout extends React.Component { static defaultProps = defaultProps as object; - @autobind - back(evt?: React.MouseEvent | KeyboardEvent) { + back = (evt?: React.MouseEvent | KeyboardEvent) => { if (this.props.back) { this.props.back(evt); } else { navigation.goBack(); } - } + }; async componentDidMount() { window.addEventListener("keydown", this.onEscapeKey); diff --git a/src/renderer/components/menu/menu-actions.tsx b/src/renderer/components/menu/menu-actions.tsx index ef3d6880f4..ce18863023 100644 --- a/src/renderer/components/menu/menu-actions.tsx +++ b/src/renderer/components/menu/menu-actions.tsx @@ -1,9 +1,9 @@ import "./menu-actions.scss"; import React, { isValidElement } from "react"; -import { observable, makeObservable } from "mobx"; +import { makeObservable, observable } from "mobx"; import { observer } from "mobx-react"; -import { autobind, cssNames } from "../../utils"; +import { cssNames } from "../../utils"; import { ConfirmDialog } from "../confirm-dialog"; import { Icon, IconProps } from "../icon"; import { Menu, MenuItem, MenuProps } from "../menu"; @@ -43,8 +43,7 @@ export class MenuActions extends React.Component { makeObservable(this); } - @autobind - remove() { + remove = () => { const { removeAction } = this.props; let { removeConfirmationMessage } = this.props; @@ -56,7 +55,7 @@ export class MenuActions extends React.Component { labelOk: `Remove`, message:
{removeConfirmationMessage}
, }); - } + }; renderTriggerIcon() { if (this.props.toolbar) return; @@ -109,7 +108,7 @@ export class MenuActions extends React.Component { className={menuClassName} usePortal={autoClose} closeOnScroll={autoClose} - closeOnClickItem={autoCloseOnSelect ?? autoClose } + closeOnClickItem={autoCloseOnSelect ?? autoClose} closeOnClickOutside={autoClose} {...menuProps} > diff --git a/src/renderer/components/menu/menu.tsx b/src/renderer/components/menu/menu.tsx index 22a6d96187..e3c1d99d37 100644 --- a/src/renderer/components/menu/menu.tsx +++ b/src/renderer/components/menu/menu.tsx @@ -2,7 +2,7 @@ import "./menu.scss"; import React, { Fragment, ReactElement, ReactNode } from "react"; import { createPortal } from "react-dom"; -import { autobind, cssNames, noop } from "../../utils"; +import { cssNames, noop } from "../../utils"; import { Animate } from "../animate"; import { Icon, IconProps } from "../icon"; @@ -47,7 +47,6 @@ const defaultPropsMenu: Partial = { toggleEvent: "click" }; -@autobind export class Menu extends React.Component { static defaultProps = defaultPropsMenu as object; @@ -173,11 +172,11 @@ export class Menu extends React.Component { this.props.close(); } - toggle() { + toggle = () => { this.isOpen ? this.close() : this.open(); } - onKeyDown(evt: KeyboardEvent) { + onKeyDown = (evt: KeyboardEvent) => { if (!this.isOpen) return; switch (evt.code) { @@ -204,16 +203,16 @@ export class Menu extends React.Component { } } - onContextMenu() { + onContextMenu = () => { this.close(); } - onWindowResize() { + onWindowResize = () => { if (!this.isOpen) return; this.refreshPosition(); } - onScrollOutside(evt: UIEvent) { + onScrollOutside = (evt: UIEvent) => { if (!this.isOpen) return; const target = evt.target as HTMLElement; const { usePortal, closeOnScroll } = this.props; @@ -223,7 +222,7 @@ export class Menu extends React.Component { } } - onClickOutside(evt: MouseEvent) { + onClickOutside = (evt: MouseEvent) => { if (!this.props.closeOnClickOutside) return; if (!this.isOpen || evt.target === document.body) return; const target = evt.target as HTMLElement; @@ -235,17 +234,17 @@ export class Menu extends React.Component { } } - onBlur() { + onBlur = () => { if (document.activeElement?.tagName == "IFRAME") { this.close(); } } - protected bindRef(elem: HTMLUListElement) { + protected bindRef = (elem: HTMLUListElement) => { this.elem = elem; } - protected bindItemRef(item: MenuItem, index: number) { + protected bindItemRef = (item: MenuItem, index: number) => { this.items[index] = item; } @@ -292,21 +291,6 @@ export class Menu extends React.Component { } } -export function SubMenu(props: Partial) { - const { className, ...menuProps } = props; - - return ( - - ); -} - export interface MenuItemProps extends React.HTMLProps { icon?: string | Partial; disabled?: boolean; @@ -319,7 +303,6 @@ const defaultPropsMenuItem: Partial = { onClick: noop, }; -@autobind export class MenuItem extends React.Component { static defaultProps = defaultPropsMenuItem as object; static contextType = MenuContext; @@ -349,7 +332,7 @@ export class MenuItem extends React.Component { } } - protected bindRef(elem: HTMLElement) { + bindRef = (elem: HTMLElement): void => { this.elem = elem; } diff --git a/src/renderer/components/select/select.tsx b/src/renderer/components/select/select.tsx index 905423036a..a1189def59 100644 --- a/src/renderer/components/select/select.tsx +++ b/src/renderer/components/select/select.tsx @@ -5,7 +5,7 @@ import "./select.scss"; import React, { ReactNode } from "react"; import { computed, makeObservable } from "mobx"; import { observer } from "mobx-react"; -import { autobind, cssNames } from "../../utils"; +import { cssNames } from "../../utils"; import ReactSelect, { ActionMeta, components, Props as ReactSelectProps, Styles } from "react-select"; import Creatable, { CreatableProps } from "react-select/creatable"; import { ThemeStore } from "../../theme.store"; @@ -85,22 +85,20 @@ export class Select extends React.Component { return options as SelectOption[]; } - @autobind - onChange(value: SelectOption, meta: ActionMeta) { + onChange = (value: SelectOption, meta: ActionMeta) => { if (this.props.onChange) { this.props.onChange(value, meta); } - } + }; - @autobind - onKeyDown(evt: React.KeyboardEvent) { + onKeyDown = (evt: React.KeyboardEvent) => { if (this.props.onKeyDown) { this.props.onKeyDown(evt); } const escapeKey = evt.nativeEvent.code === "Escape"; if (escapeKey) evt.stopPropagation(); // don't close the - } + }; render() { const { diff --git a/src/renderer/components/table/table-cell.tsx b/src/renderer/components/table/table-cell.tsx index 714c0810e0..825e05c300 100644 --- a/src/renderer/components/table/table-cell.tsx +++ b/src/renderer/components/table/table-cell.tsx @@ -2,7 +2,7 @@ import "./table-cell.scss"; import type { TableSortBy, TableSortParams } from "./table"; import React, { ReactNode } from "react"; -import { autobind, cssNames, displayBooleans } from "../../utils"; +import { cssNames, displayBooleans } from "../../utils"; import { Icon } from "../icon"; import { Checkbox } from "../checkbox"; @@ -23,8 +23,7 @@ export interface TableCellProps extends React.DOMAttributes { } export class TableCell extends React.Component { - @autobind - onClick(evt: React.MouseEvent) { + onClick = (evt: React.MouseEvent) => { if (this.props.onClick) { this.props.onClick(evt); } @@ -32,7 +31,7 @@ export class TableCell extends React.Component { if (this.isSortable) { this.props._sort(this.props.sortBy); } - } + }; get isSortable() { const { _sorting, sortBy } = this.props; @@ -60,7 +59,7 @@ export class TableCell extends React.Component { const showCheckbox = isChecked !== undefined; if (checkbox && showCheckbox) { - return ; + return ; } } diff --git a/src/renderer/components/table/table.tsx b/src/renderer/components/table/table.tsx index efaf1a671e..479109a75e 100644 --- a/src/renderer/components/table/table.tsx +++ b/src/renderer/components/table/table.tsx @@ -3,7 +3,7 @@ import "./table.scss"; import React from "react"; import { orderBy } from "lodash"; import { observer } from "mobx-react"; -import { autobind, cssNames, noop } from "../../utils"; +import { cssNames, noop } from "../../utils"; import { TableRow, TableRowElem, TableRowProps } from "./table-row"; import { TableHead, TableHeadElem, TableHeadProps } from "./table-head"; import { TableCellElem } from "./table-cell"; @@ -122,8 +122,7 @@ export class Table extends React.Component { return orderBy(items, sortingCallback, order as any); } - @autobind - protected onSort({ sortBy, orderBy }: TableSortParams) { + protected onSort = ({ sortBy, orderBy }: TableSortParams) => { setSortParams(this.props.tableId, { sortBy, orderBy }); const { sortSyncWithUrl, onSort } = this.props; @@ -135,10 +134,9 @@ export class Table extends React.Component { if (onSort) { onSort({ sortBy, orderBy }); } - } + }; - @autobind - sort(colName: TableSortBy) { + sort = (colName: TableSortBy) => { const { sortBy, orderBy } = this.sortParams; const sameColumn = sortBy == colName; const newSortBy: TableSortBy = colName; @@ -148,7 +146,7 @@ export class Table extends React.Component { sortBy: String(newSortBy), orderBy: newOrderBy, }); - } + }; renderRows() { const { sortable, noItems, children, virtual, customRowHeights, rowLineHeight, rowPadding, items, getTableRow, selectedItemId, className } = this.props; diff --git a/src/renderer/components/tabs/tabs.tsx b/src/renderer/components/tabs/tabs.tsx index f497c63f9e..dfdb11ed86 100644 --- a/src/renderer/components/tabs/tabs.tsx +++ b/src/renderer/components/tabs/tabs.tsx @@ -1,6 +1,6 @@ import "./tabs.scss"; import React, { DOMAttributes } from "react"; -import { autobind, cssNames } from "../../utils"; +import { cssNames } from "../../utils"; import { Icon } from "../icon"; const TabsContext = React.createContext({}); @@ -24,11 +24,6 @@ export interface TabsProps extends TabsContextValue, Omit { public elem: HTMLElement; - @autobind - protected bindRef(elem: HTMLElement) { - this.elem = elem; - } - render() { const { center, wrap, onChange, value, autoFocus, scrollable = true, withBorder, ...elemProps } = this.props; const className = cssNames("Tabs", this.props.className, { @@ -43,7 +38,7 @@ export class Tabs extends React.PureComponent {
this.elem = elem} /> ); @@ -82,26 +77,23 @@ export class Tab extends React.PureComponent { }); } - @autobind - onClick(evt: React.MouseEvent) { + onClick = (evt: React.MouseEvent) => { const { value, active, disabled, onClick } = this.props; const { onChange } = this.context; if (disabled || active) return; if (onClick) onClick(evt); if (onChange) onChange(value); - } + }; - @autobind - onFocus(evt: React.FocusEvent) { + onFocus =(evt: React.FocusEvent) => { const { onFocus } = this.props; if (onFocus) onFocus(evt); this.scrollIntoView(); - } + }; - @autobind - onKeyDown(evt: React.KeyboardEvent) { + onKeyDown = (evt: React.KeyboardEvent) => { const ENTER_KEY = evt.keyCode === 13; const SPACE_KEY = evt.keyCode === 32; @@ -109,7 +101,7 @@ export class Tab extends React.PureComponent { const { onKeyDown } = this.props; if (onKeyDown) onKeyDown(evt); - } + }; componentDidMount() { if (this.isActive && this.context.autoFocus) { @@ -117,11 +109,6 @@ export class Tab extends React.PureComponent { } } - @autobind - protected bindRef(elem: HTMLElement) { - this.elem = elem; - } - render() { const { active, disabled, icon, label, value, ...elemProps } = this.props; let { className } = this.props; @@ -139,7 +126,7 @@ export class Tab extends React.PureComponent { onClick={this.onClick} onFocus={this.onFocus} onKeyDown={this.onKeyDown} - ref={this.bindRef} + ref={elem => this.elem = elem} > {typeof icon === "string" ? : icon}
diff --git a/src/renderer/components/tooltip/tooltip.tsx b/src/renderer/components/tooltip/tooltip.tsx index db4f65c1f9..2b4a9e2de8 100644 --- a/src/renderer/components/tooltip/tooltip.tsx +++ b/src/renderer/components/tooltip/tooltip.tsx @@ -3,8 +3,8 @@ import "./tooltip.scss"; import React from "react"; import { createPortal } from "react-dom"; import { observer } from "mobx-react"; -import { autobind, cssNames, IClassName } from "../../utils"; -import { observable, makeObservable } from "mobx"; +import { cssNames, IClassName } from "../../utils"; +import { makeObservable, observable } from "mobx"; export enum TooltipPosition { TOP = "top", @@ -78,19 +78,16 @@ export class Tooltip extends React.Component { this.hoverTarget.removeEventListener("mouseleave", this.onLeaveTarget); } - @autobind - protected onEnterTarget() { + protected onEnterTarget = () => { this.isVisible = true; this.refreshPosition(); - } + }; - @autobind - protected onLeaveTarget() { + protected onLeaveTarget = () => { this.isVisible = false; - } + }; - @autobind - refreshPosition() { + refreshPosition = () => { const { preferredPositions } = this.props; const { elem, targetElem } = this; @@ -138,7 +135,7 @@ export class Tooltip extends React.Component { this.activePosition = fallbackPosition; this.setPosition({ left, top }); - } + }; protected setPosition(pos: { left: number, top: number }) { const elemStyle = this.elem.style; @@ -199,10 +196,9 @@ export class Tooltip extends React.Component { }; } - @autobind - bindRef(elem: HTMLElement) { + bindRef = (elem: HTMLElement) => { this.elem = elem; - } + }; render() { const { style, formatters, usePortal, children } = this.props; diff --git a/src/renderer/item.store.ts b/src/renderer/item.store.ts index dbdcbc1735..d9f06d57ee 100644 --- a/src/renderer/item.store.ts +++ b/src/renderer/item.store.ts @@ -1,14 +1,11 @@ import { action, computed, makeObservable, observable, toJS, when } from "mobx"; import { noop, orderBy } from "lodash"; -import { autobind } from "../common/utils"; export interface ItemObject { getId(): string; getName(): string; } -// @ts-ignore -@autobind export abstract class ItemStore { abstract loadAll(...args: any[]): Promise; diff --git a/src/renderer/kube-object.store.ts b/src/renderer/kube-object.store.ts index 0da7ab678c..ab45a76602 100644 --- a/src/renderer/kube-object.store.ts +++ b/src/renderer/kube-object.store.ts @@ -1,7 +1,7 @@ import type { ClusterContext } from "./components/context"; import { action, computed, makeObservable, observable, reaction, when } from "mobx"; -import { autobind, noop, rejectPromiseBy } from "./utils"; +import { noop, rejectPromiseBy } from "./utils"; import { KubeObject, KubeStatus } from "./api/kube-object"; import { IKubeWatchEvent } from "./api/kube-watch-api"; import { ItemStore } from "./item.store"; @@ -16,8 +16,6 @@ export interface KubeObjectStoreLoadingParams { reqInit?: RequestInit; } -// @ts-ignore -@autobind export abstract class KubeObjectStore extends ItemStore { static metadata = observable({ context: null as ClusterContext, // TODO: support multiple cluster contexts diff --git a/src/renderer/protocol-handler/router.ts b/src/renderer/protocol-handler/router.ts index 711d2c3dc1..a176414d35 100644 --- a/src/renderer/protocol-handler/router.ts +++ b/src/renderer/protocol-handler/router.ts @@ -2,7 +2,6 @@ import { ipcRenderer } from "electron"; import * as proto from "../../common/protocol-handler"; import logger from "../../main/logger"; import Url from "url-parse"; -import { autobind } from "../utils"; export class LensProtocolRouterRenderer extends proto.LensProtocolRouter { /** @@ -14,8 +13,7 @@ export class LensProtocolRouterRenderer extends proto.LensProtocolRouter { .on(proto.ProtocolHandlerExtension, this.ipcExtensionHandler); } - @autobind - private ipcInternalHandler(event: Electron.IpcRendererEvent, ...args: any[]): void { + private ipcInternalHandler = (event: Electron.IpcRendererEvent, ...args: any[]): void => { if (args.length !== 1) { return void logger.warn(`${proto.LensProtocolRouter.LoggingPrefix}: unexpected number of args`, { args }); } @@ -24,10 +22,9 @@ export class LensProtocolRouterRenderer extends proto.LensProtocolRouter { const url = new Url(rawUrl, true); this._routeToInternal(url); - } + }; - @autobind - private ipcExtensionHandler(event: Electron.IpcRendererEvent, ...args: any[]): void { + private ipcExtensionHandler = (event: Electron.IpcRendererEvent, ...args: any[]): void => { if (args.length !== 1) { return void logger.warn(`${proto.LensProtocolRouter.LoggingPrefix}: unexpected number of args`, { args }); } @@ -36,5 +33,5 @@ export class LensProtocolRouterRenderer extends proto.LensProtocolRouter { const url = new Url(rawUrl, true); this._routeToExtension(url); - } + }; } diff --git a/src/renderer/theme.store.ts b/src/renderer/theme.store.ts index f48c61fcc7..495a38141d 100644 --- a/src/renderer/theme.store.ts +++ b/src/renderer/theme.store.ts @@ -1,5 +1,5 @@ import { computed, makeObservable, observable, reaction } from "mobx"; -import { autobind, Singleton } from "./utils"; +import { Singleton } from "./utils"; import { UserStore } from "../common/user-store"; import logger from "../main/logger"; @@ -19,7 +19,6 @@ export interface Theme { author?: string; } -@autobind export class ThemeStore extends Singleton { protected styles: HTMLStyleElement; @@ -77,7 +76,7 @@ export class ThemeStore extends Singleton { return this.allThemes.get(themeId); } - protected async loadTheme(themeId: ThemeId): Promise { + protected loadTheme = async (themeId: ThemeId): Promise => { try { const existingTheme = this.getThemeById(themeId); @@ -85,7 +84,7 @@ export class ThemeStore extends Singleton { const theme = await import( /* webpackChunkName: "themes/[name]" */ `./themes/${themeId}.json` - ); + ); existingTheme.author = theme.author; existingTheme.colors = theme.colors;