diff --git a/src/renderer/components/+apps-releases/release-rollback-dialog.tsx b/src/renderer/components/+apps-releases/release-rollback-dialog.tsx index 4166111934..91271e0574 100644 --- a/src/renderer/components/+apps-releases/release-rollback-dialog.tsx +++ b/src/renderer/components/+apps-releases/release-rollback-dialog.tsx @@ -14,11 +14,13 @@ import orderBy from "lodash/orderBy"; interface Props extends DialogProps { } +const dialogState = observable.object({ + isOpen: false, + release: null as HelmRelease, +}); + @observer export class ReleaseRollbackDialog extends React.Component { - @observable static isOpen = false; - @observable.ref static release: HelmRelease = null; - @observable isLoading = false; @observable revision: IReleaseRevision; @observable revisions = observable.array(); @@ -29,16 +31,16 @@ export class ReleaseRollbackDialog extends React.Component { } static open(release: HelmRelease) { - ReleaseRollbackDialog.isOpen = true; - ReleaseRollbackDialog.release = release; + dialogState.isOpen = true; + dialogState.release = release; } static close() { - ReleaseRollbackDialog.isOpen = false; + dialogState.isOpen = false; } get release(): HelmRelease { - return ReleaseRollbackDialog.release; + return dialogState.release; } onOpen = async () => { @@ -99,7 +101,7 @@ export class ReleaseRollbackDialog extends React.Component { diff --git a/src/renderer/components/+config-resource-quotas/add-quota-dialog.tsx b/src/renderer/components/+config-resource-quotas/add-quota-dialog.tsx index c7d3a24502..8f43f5c1cf 100644 --- a/src/renderer/components/+config-resource-quotas/add-quota-dialog.tsx +++ b/src/renderer/components/+config-resource-quotas/add-quota-dialog.tsx @@ -18,10 +18,12 @@ import { SubTitle } from "../layout/sub-title"; interface Props extends DialogProps { } +const dialogState = observable.object({ + isOpen: false, +}); + @observer export class AddQuotaDialog extends React.Component { - @observable static isOpen = false; - static defaultQuotas: IResourceQuotaValues = { "limits.cpu": "", "limits.memory": "", @@ -57,11 +59,11 @@ export class AddQuotaDialog extends React.Component { } static open() { - AddQuotaDialog.isOpen = true; + dialogState.isOpen = true; } static close() { - AddQuotaDialog.isOpen = false; + dialogState.isOpen = false; } @computed get quotaEntries() { @@ -138,7 +140,7 @@ export class AddQuotaDialog extends React.Component { diff --git a/src/renderer/components/+config-secrets/add-secret-dialog.tsx b/src/renderer/components/+config-secrets/add-secret-dialog.tsx index f0608510f9..e748f40c82 100644 --- a/src/renderer/components/+config-secrets/add-secret-dialog.tsx +++ b/src/renderer/components/+config-secrets/add-secret-dialog.tsx @@ -36,21 +36,23 @@ interface ISecretTemplate { type ISecretField = keyof ISecretTemplate; +const dialogState = observable.object({ + isOpen: false, +}); + @observer export class AddSecretDialog extends React.Component { - @observable static isOpen = false; - constructor(props: Props) { super(props); makeObservable(this); } static open() { - AddSecretDialog.isOpen = true; + dialogState.isOpen = true; } static close() { - AddSecretDialog.isOpen = false; + dialogState.isOpen = false; } private secretTemplate: { [p: string]: ISecretTemplate } = { @@ -189,7 +191,7 @@ export class AddSecretDialog extends React.Component { diff --git a/src/renderer/components/+namespaces/add-namespace-dialog.tsx b/src/renderer/components/+namespaces/add-namespace-dialog.tsx index c62d93e628..3222299b0c 100644 --- a/src/renderer/components/+namespaces/add-namespace-dialog.tsx +++ b/src/renderer/components/+namespaces/add-namespace-dialog.tsx @@ -16,9 +16,12 @@ interface Props extends DialogProps { onError?(error: any): void; } +const dialogState = observable.object({ + isOpen: false, +}); + @observer export class AddNamespaceDialog extends React.Component { - @observable static isOpen = false; @observable namespace = ""; constructor(props: Props) { @@ -27,11 +30,11 @@ export class AddNamespaceDialog extends React.Component { } static open() { - AddNamespaceDialog.isOpen = true; + dialogState.isOpen = true; } static close() { - AddNamespaceDialog.isOpen = false; + dialogState.isOpen = false; } reset = () => { @@ -62,7 +65,7 @@ export class AddNamespaceDialog extends React.Component { diff --git a/src/renderer/components/+preferences/add-helm-repo-dialog.tsx b/src/renderer/components/+preferences/add-helm-repo-dialog.tsx index 5ffec819f8..4a20b3a68d 100644 --- a/src/renderer/components/+preferences/add-helm-repo-dialog.tsx +++ b/src/renderer/components/+preferences/add-helm-repo-dialog.tsx @@ -25,6 +25,10 @@ enum FileType { CertFile = "certFile", } +const dialogState = observable.object({ + isOpen: false, +}); + @observer export class AddHelmRepoDialog extends React.Component { private emptyRepo = {name: "", url: "", username: "", password: "", insecureSkipTlsVerify: false, caFile:"", keyFile: "", certFile: ""}; @@ -32,19 +36,17 @@ export class AddHelmRepoDialog extends React.Component { private static keyExtensions = ["key", "keystore", "jks", "p12", "pfx", "pem"]; private static certExtensions = ["crt", "cer", "ca-bundle", "p7b", "p7c" , "p7s", "p12", "pfx", "pem"]; - @observable static isOpen = false; - constructor(props: Props) { super(props); makeObservable(this); } static open() { - AddHelmRepoDialog.isOpen = true; + dialogState.isOpen = true; } static close() { - AddHelmRepoDialog.isOpen = false; + dialogState.isOpen = false; } @observable helmRepo : HelmRepo = this.emptyRepo; @@ -145,7 +147,7 @@ export class AddHelmRepoDialog extends React.Component { diff --git a/src/renderer/components/+user-management-roles-bindings/add-role-binding-dialog.tsx b/src/renderer/components/+user-management-roles-bindings/add-role-binding-dialog.tsx index d06e5b8e53..012fc5fa33 100644 --- a/src/renderer/components/+user-management-roles-bindings/add-role-binding-dialog.tsx +++ b/src/renderer/components/+user-management-roles-bindings/add-role-binding-dialog.tsx @@ -30,27 +30,29 @@ interface BindingSelectOption extends SelectOption { interface Props extends Partial { } +const dialogState = observable.object({ + isOpen: false, + data: null as RoleBinding, +}); + @observer export class AddRoleBindingDialog extends React.Component { - @observable static isOpen = false; - @observable static data: RoleBinding = null; - constructor(props: Props) { super(props); makeObservable(this); } static open(roleBinding?: RoleBinding) { - AddRoleBindingDialog.isOpen = true; - AddRoleBindingDialog.data = roleBinding; + dialogState.isOpen = true; + dialogState.data = roleBinding; } static close() { - AddRoleBindingDialog.isOpen = false; + dialogState.isOpen = false; } get roleBinding(): RoleBinding { - return AddRoleBindingDialog.data; + return dialogState.data; } @observable isLoading = false; @@ -276,7 +278,7 @@ export class AddRoleBindingDialog extends React.Component { diff --git a/src/renderer/components/+user-management-roles/add-role-dialog.tsx b/src/renderer/components/+user-management-roles/add-role-dialog.tsx index 1b39762563..c20f405135 100644 --- a/src/renderer/components/+user-management-roles/add-role-dialog.tsx +++ b/src/renderer/components/+user-management-roles/add-role-dialog.tsx @@ -15,10 +15,12 @@ import { showDetails } from "../kube-object"; interface Props extends Partial { } +const dialogState = observable.object({ + isOpen: false, +}); + @observer export class AddRoleDialog extends React.Component { - @observable static isOpen = false; - @observable roleName = ""; @observable namespace = ""; @@ -28,11 +30,11 @@ export class AddRoleDialog extends React.Component { } static open() { - AddRoleDialog.isOpen = true; + dialogState.isOpen = true; } static close() { - AddRoleDialog.isOpen = false; + dialogState.isOpen = false; } close = () => { @@ -64,7 +66,7 @@ export class AddRoleDialog extends React.Component { diff --git a/src/renderer/components/+user-management-service-accounts/create-service-account-dialog.tsx b/src/renderer/components/+user-management-service-accounts/create-service-account-dialog.tsx index 8ebb871e37..70b25e77dc 100644 --- a/src/renderer/components/+user-management-service-accounts/create-service-account-dialog.tsx +++ b/src/renderer/components/+user-management-service-accounts/create-service-account-dialog.tsx @@ -1,7 +1,7 @@ import "./create-service-account-dialog.scss"; import React from "react"; -import { observable, makeObservable } from "mobx"; +import { makeObservable, observable } from "mobx"; import { observer } from "mobx-react"; import { Dialog, DialogProps } from "../dialog"; import { Wizard, WizardStep } from "../wizard"; @@ -16,10 +16,12 @@ import { showDetails } from "../kube-object"; interface Props extends Partial { } +const dialogState = observable.object({ + isOpen: false, +}); + @observer export class CreateServiceAccountDialog extends React.Component { - @observable static isOpen = false; - @observable name = ""; @observable namespace = "default"; @@ -29,11 +31,11 @@ export class CreateServiceAccountDialog extends React.Component { } static open() { - CreateServiceAccountDialog.isOpen = true; + dialogState.isOpen = true; } static close() { - CreateServiceAccountDialog.isOpen = false; + dialogState.isOpen = false; } close = () => { @@ -63,7 +65,7 @@ export class CreateServiceAccountDialog extends React.Component { diff --git a/src/renderer/components/+workloads-cronjobs/cronjob-trigger-dialog.tsx b/src/renderer/components/+workloads-cronjobs/cronjob-trigger-dialog.tsx index 65df8abea4..0b51832811 100644 --- a/src/renderer/components/+workloads-cronjobs/cronjob-trigger-dialog.tsx +++ b/src/renderer/components/+workloads-cronjobs/cronjob-trigger-dialog.tsx @@ -14,13 +14,14 @@ import { systemName, maxLength } from "../input/input_validators"; interface Props extends Partial { } +const dialogState = observable.object({ + isOpen: false, + data: null as CronJob, +}); + @observer export class CronJobTriggerDialog extends Component { - @observable static isOpen = false; - @observable static data: CronJob = null; - @observable jobName = ""; - @observable ready = false; constructor(props: Props) { @@ -29,16 +30,16 @@ export class CronJobTriggerDialog extends Component { } static open(cronjob: CronJob) { - CronJobTriggerDialog.isOpen = true; - CronJobTriggerDialog.data = cronjob; + dialogState.isOpen = true; + dialogState.data = cronjob; } static close() { - CronJobTriggerDialog.isOpen = false; + dialogState.isOpen = false; } get cronjob() { - return CronJobTriggerDialog.data; + return dialogState.data; } close = () => { @@ -112,7 +113,7 @@ export class CronJobTriggerDialog extends Component { return ( { } +const dialogState = observable.object({ + isOpen: false, + data: null as Deployment, +}); + @observer export class DeploymentScaleDialog extends Component { - @observable static isOpen = false; - @observable static data: Deployment = null; - @observable ready = false; @observable currentReplicas = 0; @observable desiredReplicas = 0; @@ -29,16 +31,16 @@ export class DeploymentScaleDialog extends Component { } static open(deployment: Deployment) { - DeploymentScaleDialog.isOpen = true; - DeploymentScaleDialog.data = deployment; + dialogState.isOpen = true; + dialogState.data = deployment; } static close() { - DeploymentScaleDialog.isOpen = false; + dialogState.isOpen = false; } get deployment() { - return DeploymentScaleDialog.data; + return dialogState.data; } close = () => { @@ -149,7 +151,7 @@ export class DeploymentScaleDialog extends Component { return ( { } +const dialogState = observable.object({ + isOpen: false, + data: null as ReplicaSet, +}); + @observer export class ReplicaSetScaleDialog extends Component { - @observable static isOpen = false; - @observable static data: ReplicaSet = null; - @observable ready = false; @observable currentReplicas = 0; @observable desiredReplicas = 0; @@ -29,16 +31,16 @@ export class ReplicaSetScaleDialog extends Component { } static open(replicaSet: ReplicaSet) { - ReplicaSetScaleDialog.isOpen = true; - ReplicaSetScaleDialog.data = replicaSet; + dialogState.isOpen = true; + dialogState.data = replicaSet; } static close() { - ReplicaSetScaleDialog.isOpen = false; + dialogState.isOpen = false; } get replicaSet() { - return ReplicaSetScaleDialog.data; + return dialogState.data; } close = () => { @@ -151,7 +153,7 @@ export class ReplicaSetScaleDialog extends Component { return ( { } +const dialogState = observable.object({ + isOpen: false, + data: null as StatefulSet, +}); + @observer export class StatefulSetScaleDialog extends Component { - @observable static isOpen = false; - @observable static data: StatefulSet = null; - @observable ready = false; @observable currentReplicas = 0; @observable desiredReplicas = 0; @@ -29,16 +31,16 @@ export class StatefulSetScaleDialog extends Component { } static open(statefulSet: StatefulSet) { - StatefulSetScaleDialog.isOpen = true; - StatefulSetScaleDialog.data = statefulSet; + dialogState.isOpen = true; + dialogState.data = statefulSet; } static close() { - StatefulSetScaleDialog.isOpen = false; + dialogState.isOpen = false; } get statefulSet() { - return StatefulSetScaleDialog.data; + return dialogState.data; } close = () => { @@ -151,7 +153,7 @@ export class StatefulSetScaleDialog extends Component { return ( ; } +const dialogState = observable.object({ + isOpen: false, + params: null as ConfirmDialogParams, +}); + @observer export class ConfirmDialog extends React.Component { - @observable static isOpen = false; - @observable.ref static params: ConfirmDialogParams; - @observable isSaving = false; constructor(props: ConfirmDialogProps) { @@ -38,8 +40,8 @@ export class ConfirmDialog extends React.Component { } static open(params: ConfirmDialogParams) { - ConfirmDialog.isOpen = true; - ConfirmDialog.params = params; + dialogState.isOpen = true; + dialogState.params = params; } static confirm(params: ConfirmDialogBooleanParams): Promise { @@ -61,7 +63,7 @@ export class ConfirmDialog extends React.Component { }; get params(): ConfirmDialogParams { - return Object.assign({}, ConfirmDialog.defaultParams, ConfirmDialog.params); + return Object.assign({}, ConfirmDialog.defaultParams, dialogState.params); } ok = async () => { @@ -70,7 +72,7 @@ export class ConfirmDialog extends React.Component { await Promise.resolve(this.params.ok()).catch(noop); } finally { this.isSaving = false; - ConfirmDialog.isOpen = false; + dialogState.isOpen = false; } }; @@ -83,7 +85,7 @@ export class ConfirmDialog extends React.Component { await Promise.resolve(this.params.cancel()).catch(noop); } finally { this.isSaving = false; - ConfirmDialog.isOpen = false; + dialogState.isOpen = false; } }; @@ -99,7 +101,7 @@ export class ConfirmDialog extends React.Component { diff --git a/src/renderer/components/kubeconfig-dialog/kubeconfig-dialog.tsx b/src/renderer/components/kubeconfig-dialog/kubeconfig-dialog.tsx index c8d2fe34a9..dd6c4e4dd1 100644 --- a/src/renderer/components/kubeconfig-dialog/kubeconfig-dialog.tsx +++ b/src/renderer/components/kubeconfig-dialog/kubeconfig-dialog.tsx @@ -22,11 +22,13 @@ interface IKubeconfigDialogData { interface Props extends Partial { } +const dialogState = observable.object({ + isOpen: false, + data: null as IKubeconfigDialogData, +}); + @observer export class KubeConfigDialog extends React.Component { - @observable static isOpen = false; - @observable static data: IKubeconfigDialogData = null; - @observable.ref configTextArea: HTMLTextAreaElement; // required for coping config text @observable config = ""; // parsed kubeconfig in yaml format @@ -36,16 +38,17 @@ export class KubeConfigDialog extends React.Component { } static open(data: IKubeconfigDialogData) { - KubeConfigDialog.isOpen = true; - KubeConfigDialog.data = data; + dialogState.isOpen = true; + dialogState.data = data; } static close() { - KubeConfigDialog.isOpen = false; + dialogState.isOpen = false; + dialogState.data = null; } get data(): IKubeconfigDialogData { - return KubeConfigDialog.data; + return dialogState.data; } close = () => { @@ -76,10 +79,9 @@ export class KubeConfigDialog extends React.Component { }; render() { - const { isOpen, data = {} } = KubeConfigDialog; const { ...dialogProps } = this.props; const yamlConfig = this.config; - const header =
{data.title || "Kubeconfig File"}
; + const header =
{this.data?.title || "Kubeconfig File"}
; const buttons = (