Fix local cluster delete flow (#3473)

* Fix local cluster delete flow - Now checks for the cluster being the current cluster and confirms the action - <ConfirmDialog> is fixed to work with several confirmations happinging at once Signed-off-by: Sebastian Malton <sebastian@malton.name> * Custom delete cluster dialog Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Saving kubeconfig file refactoring Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Switching current-context from dialog Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Cleaning up css styles Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Show Delete menu item only for local cluster Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Make all dialogs rounded Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Releasing kubeconfig file after lock Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Adding delete cluster dialog tests Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Cleaning up Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Delete cluster dialog refactoring Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Fixing typo Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Removing temp file on error Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Updating tests Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Do not switch context if select is hidden Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Removing spread symbols Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Moving cluster delete event from catalog initializer to ipc Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Refactor warning messages Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Getting spread (...) back to fix Select render Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Using async form without promises Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Do not show context switcher if no contexts left Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * Updating the tests Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> * don't allow delete of the active cluster before setting to new active cluster (#3749) * don't allow user to delete the active cluster before setting to new active cluster Signed-off-by: Jim Ehrismann <jehrismann@mirantis.com> * fix lint issues Signed-off-by: Jim Ehrismann <jehrismann@mirantis.com> * Show delete button if no more contexts available Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> Co-authored-by: Alex Andreev <alex.andreev.email@gmail.com> Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com> Co-authored-by: Alex Andreev <alex.andreev.email@gmail.com> Co-authored-by: Jim Ehrismann <40840436+jim-docker@users.noreply.github.com>
2025-05-20 05:10:56 +00:00 · 2021-09-08 15:06:14 +03:00
1 parent b9aec3ad9f
commit d72158cc63
@@ -0,0 +1,279 @@
+/**
+ * Copyright (c) 2021 OpenLens Authors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of
+ * this software and associated documentation files (the "Software"), to deal in
+ * the Software without restriction, including without limitation the rights to
+ * use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+ * the Software, and to permit persons to whom the Software is furnished to do so,
+ * subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+ * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+ * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+ * IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+ * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+import styles from "./delete-cluster-dialog.module.css";
+
+import { computed, makeObservable, observable } from "mobx";
+import { observer } from "mobx-react";
+import React from "react";
+
+import { Button } from "../button";
+import type { KubeConfig } from "@kubernetes/client-node";
+import type { Cluster } from "../../../main/cluster";
+import { saveKubeconfig } from "./save-config";
+import { requestMain } from "../../../common/ipc";
+import { clusterClearDeletingHandler, clusterDeleteHandler, clusterSetDeletingHandler } from "../../../common/cluster-ipc";
+import { Notifications } from "../notifications";
+import { HotbarStore } from "../../../common/hotbar-store";
+import { boundMethod } from "autobind-decorator";
+import { Dialog } from "../dialog";
+import { Icon } from "../icon";
+import { Select } from "../select";
+import { Checkbox } from "../checkbox";
+
+type DialogState = {
+  isOpen: boolean,
+  config?: KubeConfig,
+  cluster?: Cluster
+};
+
+const dialogState: DialogState = observable({
+  isOpen: false
+});
+
+type Props = {};
+
+@observer
+export class DeleteClusterDialog extends React.Component {
+  showContextSwitch = false;
+  newCurrentContext = "";
+
+  constructor(props: Props) {
+    super(props);
+    makeObservable(this, {
+      showContextSwitch: observable,
+      newCurrentContext: observable
+    });
+  }
+
+  static open({ config, cluster }: Partial<DialogState>) {
+    dialogState.isOpen = true;
+    dialogState.config = config;
+    dialogState.cluster = cluster;
+  }
+
+  static close() {
+    dialogState.isOpen = false;
+    dialogState.cluster = null;
+    dialogState.config = null;
+  }
+
+  @boundMethod
+  onOpen() {
+    this.newCurrentContext = "";
+
+    if (this.isCurrentContext()) {
+      this.showContextSwitch = true;
+    }
+  }
+
+  @boundMethod
+  onClose() {
+    DeleteClusterDialog.close();
+    this.showContextSwitch = false;
+  }
+
+  removeContext() {
+    dialogState.config.contexts = dialogState.config.contexts.filter(item =>
+      item.name !== dialogState.cluster.contextName
+    );
+  }
+
+  changeCurrentContext() {
+    if (this.newCurrentContext && this.showContextSwitch) {
+      dialogState.config.currentContext = this.newCurrentContext;
+    }
+  }
+
+  @boundMethod
+  async onDelete() {
+    const { cluster, config } = dialogState;
+
+    await requestMain(clusterSetDeletingHandler, cluster.id);
+    this.removeContext();
+    this.changeCurrentContext();
+
+    try {
+      await saveKubeconfig(config, cluster.kubeConfigPath);
+      HotbarStore.getInstance().removeAllHotbarItems(cluster.id);
+      await requestMain(clusterDeleteHandler, cluster.id);
+    } catch(error) {
+      Notifications.error(`Cannot remove cluster, failed to process config file. ${error}`);
+      await requestMain(clusterClearDeletingHandler, cluster.id);
+    }
+
+    this.onClose();
+  }
+
+  @computed get disableDelete() {
+    const { cluster, config } = dialogState;
+    const noContextsAvailable = config.contexts.filter(context => context.name !== cluster.contextName).length == 0;
+    const newContextNotSelected = this.newCurrentContext === "";
+
+    if (noContextsAvailable) {
+      return false;
+    }
+
+    return this.showContextSwitch && newContextNotSelected;
+  }
+
+  isCurrentContext() {
+    return dialogState.config.currentContext == dialogState.cluster.contextName;
+  }
+
+  renderCurrentContextSwitch() {
+    if (!this.showContextSwitch) return null;
+    const { cluster, config } = dialogState;
+    const contexts = config.contexts.filter(context => context.name !== cluster.contextName);
+
+    const options = [
+      ...contexts.map(context => ({
+        label: context.name,
+        value: context.name,
+      })),
+    ];
+
+    return (
+      <div className="mt-4">
+        <Select
+          options={options}
+          value={this.newCurrentContext}
+          onChange={({ value }) => this.newCurrentContext = value}
+          themeName="light"
+          className="ml-[1px] mr-[1px]"
+        />
+      </div>
+    );
+  }
+
+  renderDeleteMessage() {
+    const { cluster } = dialogState;
+
+    if (cluster.isInLocalKubeconfig()) {
+      return (
+        <div>
+          Delete the <b>{cluster.getMeta().name}</b> context from Lens&apos;s internal kubeconfig?
+        </div>
+      );
+    }
+
+    return (
+      <div>
+        Delete the <b>{cluster.getMeta().name}</b> context from <b>{cluster.kubeConfigPath}</b>?
+      </div>
+    );
+  }
+
+  getWarningMessage() {
+    const { cluster, config } = dialogState;
+    const contexts = config.contexts.filter(context => context.name !== cluster.contextName);
+
+    if (!contexts.length) {
+      return (
+        <p data-testid="no-more-contexts-warning">
+          This will remove the last context in kubeconfig. There will be no active context.
+        </p>
+      );
+    }
+
+    if (this.isCurrentContext()) {
+      return (
+        <p data-testid="current-context-warning">
+          This will remove active context in kubeconfig. Use drop down below to&nbsp;select a&nbsp;different one.
+        </p>
+      );
+    }
+
+    if (cluster.isInLocalKubeconfig()) {
+      return (
+        <p data-testid="internal-kubeconfig-warning">
+          Are you sure you want to delete it? It can be re-added through the copy/paste mechanism.
+        </p>
+      );
+    }
+
+    return (
+      <p data-testid="kubeconfig-change-warning">The contents of kubeconfig file will be changed!</p>
+    );
+  }
+
+  renderWarning() {
+    return (
+      <div className={styles.warning}>
+        <Icon material="warning_amber" className={styles.warningIcon}/>
+        {this.getWarningMessage()}
+      </div>
+    );
+  }
+
+  render() {
+    const { cluster, config, isOpen } = dialogState;
+
+    if (!cluster || !config) return null;
+
+    const contexts = config.contexts.filter(context => context.name !== cluster.contextName);
+
+    return (
+      <Dialog
+        className={styles.dialog}
+        isOpen={isOpen}
+        close={this.onClose}
+        onOpen={this.onOpen}
+      >
+        <div className={styles.dialogContent}>
+          {this.renderDeleteMessage()}
+          {this.renderWarning()}
+          <hr className={styles.hr}/>
+          {contexts.length > 0 && (
+            <>
+              <div className="mt-4">
+                <Checkbox
+                  data-testid="context-switch"
+                  theme="light"
+                  label={(
+                    <>
+                      <span className="font-semibold">Select current-context</span>{" "}
+                      {!this.isCurrentContext() && "(optional)"}
+                    </>
+                  )}
+                  value={this.showContextSwitch}
+                  onChange={value => this.showContextSwitch = this.isCurrentContext() ? true : value}
+                />
+              </div>
+              {this.renderCurrentContextSwitch()}
+            </>
+          )}
+        </div>
+        <div className={styles.dialogButtons}>
+          <Button
+            onClick={this.onClose} plain
+            label="Cancel"
+          />
+          <Button
+            onClick={this.onDelete}
+            autoFocus accent
+            label="Delete Context"
+            disabled={this.disableDelete}
+          />
+        </div>
+      </Dialog>
+    );
+  }
+}