Migrate Helm actions on topology to use the new extensions

openshift · Jun 22, 2021 · 3ea481d · 3ea481d
1 parent 5909e2e
commit 3ea481d
Show file tree

Hide file tree

Showing 6 changed files with 59 additions and 14 deletions.
diff --git a/frontend/packages/helm-plugin/src/topology/TopologyHelmReleasePanel.tsx b/frontend/packages/helm-plugin/src/topology/TopologyHelmReleasePanel.tsx
@@ -11,10 +11,11 @@ import {
   StatusBox,
   ActionsMenu,
 } from '@console/internal/components/utils';
+import { ActionsLoader } from '@console/shared';
 import TopologyGroupResourcesPanel from '@console/topology/src/components/side-bar/TopologyGroupResourcesPanel';
 import { getResource } from '@console/topology/src/utils/topology-utils';
 import HelmReleaseOverview from '../components/details-page/overview/HelmReleaseOverview';
-import { helmReleaseActions } from './actions/helmReleaseActions';
+import { HelmActionOrigins } from '../types/helm-types';
 import TopologyHelmReleaseNotesPanel from './TopologyHelmReleaseNotesPanel';
 
 type PropsFromState = {
@@ -50,6 +51,12 @@ export const ConnectedTopologyHelmReleasePanel: React.FC<TopologyHelmReleasePane
   const name = helmRelease.getLabel();
   const { namespace } = getResource(helmRelease).metadata;
 
+  const actionsScope = {
+    releaseName: name,
+    namespace,
+    actionOrigin: HelmActionOrigins.topology,
+  };
+
   const detailsComponent = !secret
     ? () => (
         <StatusBox
@@ -75,7 +82,6 @@ export const ConnectedTopologyHelmReleasePanel: React.FC<TopologyHelmReleasePane
 
   const releaseNotesComponent = () => <TopologyHelmReleaseNotesPanel releaseNotes={releaseNotes} />;
 
-  const actions = helmReleaseActions(helmRelease);
   return (
     <div className="overview__sidebar-pane resource-overview">
       <div className="overview__sidebar-pane-head resource-overview__heading">
@@ -91,11 +97,11 @@ export const ConnectedTopologyHelmReleasePanel: React.FC<TopologyHelmReleasePane
               </Link>
             )}
           </div>
-          {actions?.length && (
-            <div className="co-actions">
-              <ActionsMenu actions={helmReleaseActions(helmRelease)} />
-            </div>
-          )}
+          <div className="co-actions">
+            <ActionsLoader contextId="helm-actions" scope={actionsScope}>
+              {(actions, loaded) => loaded && <ActionsMenu actions={actions} />}
+            </ActionsLoader>
+          </div>
         </h1>
       </div>
       <SimpleTabNav

diff --git a/frontend/packages/helm-plugin/src/topology/actions/helmReleaseContextMenu.tsx b/frontend/packages/helm-plugin/src/topology/actions/helmReleaseContextMenu.tsx
@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { Node } from '@patternfly/react-topology';
+import { kebabOptionsToMenu } from '@console/internal/components/utils';
+import { ActionsLoader } from '@console/shared';
+import { createMenuItems } from '@console/topology/src/components/graph-view';
+import { getResource } from '@console/topology/src/utils';
+import { HelmActionOrigins } from '../../types/helm-types';
+
+export const helmReleaseContextMenu = (element: Node): any => {
+  const { namespace } = getResource(element).metadata;
+  const actionsScope = {
+    releaseName: element.getLabel(),
+    namespace,
+    actionOrigin: HelmActionOrigins.topology,
+  };
+
+  return (
+    <ActionsLoader contextId="helm-actions" scope={actionsScope}>
+      {(actions, loaded) => loaded && createMenuItems(kebabOptionsToMenu(actions))}
+    </ActionsLoader>
+  );
+};
diff --git a/frontend/packages/helm-plugin/src/topology/components/helmComponentFactory.ts b/frontend/packages/helm-plugin/src/topology/components/helmComponentFactory.ts
@@ -1,17 +1,14 @@
 import * as React from 'react';
 import {
-  Node,
   GraphElement,
   withDragNode,
   withSelection,
   withDndDrop,
   withCreateConnector,
 } from '@patternfly/react-topology';
-import { kebabOptionsToMenu } from '@console/internal/components/utils';
 import {
   WorkloadNode,
   noRegroupWorkloadContextMenu,
-  createMenuItems,
   createConnectorCallback,
   NodeComponentProps,
   nodeDragSourceSpec,
@@ -21,13 +18,10 @@ import {
   CreateConnector,
 } from '@console/topology/src/components/graph-view';
 import { withEditReviewAccess } from '@console/topology/src/utils';
-import { helmReleaseActions } from '../actions/helmReleaseActions';
+import { helmReleaseContextMenu } from '../actions/helmReleaseContextMenu';
 import { TYPE_HELM_RELEASE, TYPE_HELM_WORKLOAD } from './const';
 import HelmRelease from './HelmRelease';
 
-export const helmReleaseContextMenu = (element: Node) =>
-  createMenuItems(kebabOptionsToMenu(helmReleaseActions(element)));
-
 export const getHelmComponentFactory = (
   kind,
   type,

diff --git a/frontend/packages/topology/src/components/graph-view/components/nodeContextMenu.tsx b/frontend/packages/topology/src/components/graph-view/components/nodeContextMenu.tsx
@@ -7,6 +7,7 @@ import {
   isGraph,
 } from '@patternfly/react-topology';
 import i18next from 'i18next';
+import * as _ from 'lodash';
 import {
   history,
   KebabItem,
@@ -32,6 +33,16 @@ const onKebabOptionClick = (option: KebabOption) => {
   if (option.href) {
     history.push(option.href);
   }
+  if (_.isFunction(option.cta)) {
+    option.cta();
+  } else if (_.isObject(option.cta)) {
+    const { href, external } = option.cta;
+    if (external) {
+      window.open(href);
+    } else {
+      history.push(href);
+    }
+  }
 };
 
 export const createMenuItems = (actions: KebabMenuOption[]) =>

diff --git a/frontend/public/components/utils/dropdown.jsx b/frontend/public/components/utils/dropdown.jsx
@@ -645,6 +645,17 @@ class ActionsMenuDropdown_ extends DropdownMixin {
         history.push(option.href);
       }
 
+      if (_.isFunction(option.cta)) {
+        option.cta();
+      } else if (_.isObject(option.cta)) {
+        const { href, external } = option.cta;
+        if (external) {
+          window.open(href);
+        } else {
+          history.push(href);
+        }
+      }
+
       this.hide();
     };
     return (

diff --git a/frontend/public/components/utils/kebab.tsx b/frontend/public/components/utils/kebab.tsx
@@ -582,6 +582,7 @@ export type KebabOption = {
   path?: string;
   pathKey?: string;
   icon?: React.ReactNode;
+  cta?: (() => void) | { href: string; external?: boolean };
 };
 
 export type KebabAction = (