Custom remove namespaces methods

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

packages/core/src/renderer/components/+namespaces/namespace-menu.tsx

@@ -7,6 +7,7 @@ import { withInjectables } from "@ogre-tools/injectable-react";
 import React from "react";
 import type { Namespace } from "../../../common/k8s-api/endpoints";
 import type { KubeObject } from "../../../common/k8s-api/kube-object";
+import withConfirmationInjectable, { WithConfirmation } from "../confirm-dialog/with-confirm.injectable";
 import createEditResourceTabInjectable from "../dock/edit-resource/edit-resource-tab.injectable";
 import { Icon } from "../icon";
 import { MenuItem } from "../menu";
@@ -24,10 +25,11 @@ interface Dependencies {
   readonly removeSubnamespace: (name: string) => Promise<void>;
   readonly namespaceStore: NamespaceStore;
   readonly createEditResourceTab: (kubeObject: KubeObject) => void;
+  readonly withConfirmation: WithConfirmation;
 }
 
 function NonInjectedNamespaceMenu(props: NamespaceMenuProps & Dependencies) {
-  const { namespace, removeSubnamespace, namespaceStore, createEditResourceTab } = props;
+  const { namespace, removeSubnamespace, namespaceStore, createEditResourceTab, withConfirmation } = props;
 
   const remove = async () => {
     if (namespace.isSubnamespace()) {
@@ -39,13 +41,25 @@ function NonInjectedNamespaceMenu(props: NamespaceMenuProps & Dependencies) {
     namespaceStore.clearSelected();
   };
 
+  const renderRemoveMessage = (object: KubeObject) => {
+    return (
+      <p>
+        Remove <b>{object.getName()}</b>?
+      </p>
+    );
+  }
+
   return (
     <MenuActions {...props}>
       <MenuItem onClick={() => createEditResourceTab(namespace)}>
         <Icon material="edit" interactive={false} tooltip="Edit" />
         <span className="title">Edit</span>
       </MenuItem>
-      <MenuItem onClick={remove}>
+      <MenuItem onClick={withConfirmation({
+        message: renderRemoveMessage(namespace),
+        labelOk: "Remove",
+        ok: remove,
+      })}>
         <Icon material="delete" interactive={false} tooltip="Delete" />
         <span className="title">Delete</span>
       </MenuItem>
@@ -59,5 +73,6 @@ export const NamespaceMenu = withInjectables<Dependencies, NamespaceMenuProps>(N
     removeSubnamespace: di.inject(removeSubnamespaceInjectable),
     namespaceStore: di.inject(namespaceStoreInjectable),
     createEditResourceTab: di.inject(createEditResourceTabInjectable),
+    withConfirmation: di.inject(withConfirmationInjectable),
   }),
 });

packages/core/src/renderer/components/+namespaces/route.tsx

@@ -77,6 +77,9 @@ const NonInjectedNamespacesRoute = ({ namespaceStore, openAddNamespaceDialog }:
       addRemoveButtons={{
         addTooltip: "Add Namespace",
         onAdd: openAddNamespaceDialog,
+        onRemove: () => {
+          namespaceStore.selectedItems.forEach(namespace => namespaceStore.remove(namespace));
+        },
       }}
       renderItemMenu={namespace => (
         <NamespaceMenu