Merge pull request openshift#8629 from rohitkrai03/new-kebab-actions

Migrate helm actions to use new action extensions

frontend/packages/console-dynamic-plugin-sdk/src/extensions/actions.ts

@@ -1,42 +1,41 @@
 import * as React from 'react';
 import { Extension } from '@console/plugin-sdk/src/typings/base';
-import { CodeRef, EncodedCodeRef, UpdateExtensionProperties } from '../types';
+import { ExtensionDeclaration, CodeRef } from '../types';
 import { ExtensionHook } from '../api/common-types';
 import { AccessReviewResourceAttributes } from './console-types';
 
-namespace ExtensionProperties {
- export type ActionCreator = {
-  /** ID used to identify the action creator. */
-  id: string;
+/** ActionProvider contributes a hook that returns list of actions for specific context */
+export type ActionProvider = ExtensionDeclaration<
+ 'console.action/provider',
+ {
  /** The context ID helps to narrow the scope of contributed actions to a particular area of the application. Ex - topology, helm */
  contextId: string | 'resource';
- /** A react hook which creates and returns action for the given scope.
+ /** A react hook which returns actions for the given scope.
  * If contextId = `resource` then the scope will always be a K8s resource object
  * */
- creator: EncodedCodeRef;
- };
-
- export type ActionProvider = {
- /** The context ID helps to narrow the scope of contributed actions to a particular area of the application. Ex - topology, helm */
- contextId: string | 'resource';
- /** A react hook which returns action for the given scope.
- * If contextId = `resource` then the scope will always be a K8s resource object
- * */
- provider: EncodedCodeRef;
- };
+ provider: CodeRef<ExtensionHook<Action[]>>;
+ }
+>;
 
- export type ResourceActionProvider = {
+/** ResourceActionProvider contributes a hook that returns list of actions for specific resource model */
+export type ResourceActionProvider = ExtensionDeclaration<
+ 'console.action/resource-provider',
+ {
  /** The model for which this provider provides actions for. */
  model: {
  group: string;
  version?: string;
  kind?: string;
  };
- /** The action ids to contribute to */
- actions: string[];
- };
+ /** A react hook which returns actions for the given resource model */
+ provider: CodeRef<ExtensionHook<Action[]>>;
+ }
+>;
 
- export type ActionGroup = {
+/** ActionGroup contributes an action group that can also be a submenu */
+export type ActionGroup = ExtensionDeclaration<
+ 'console.action/group',
+ {
  /** ID used to identify the action section. */
  id: string;
  /** The label to display in the UI.
@@ -54,71 +53,32 @@ namespace ExtensionProperties {
  * insertBefore takes precedence.
  * */
  insertAfter?: string | string[];
- };
+ }
+>;
 
- export type ActionFilter = {
+/** ActionFilter can be used to filter an action */
+export type ActionFilter = ExtensionDeclaration<
+ 'console.action/filter',
+ {
  /** The context ID helps to narrow the scope of contributed actions to a particular area of the application. Ex - topology, helm */
  contextId: string | 'resource';
  /** A function which will filter actions based on some conditions.
  * scope: The scope in which actions should be provided for.
  * Note: hook may be required if we want to remove the ModifyCount action from a deployment with HPA
  * */
- filter: EncodedCodeRef;
- };
-
- export type ActionCreatorCodeRefs = {
- creator: CodeRef<ExtensionHook<Action>>;
- };
-
- export type ActionProviderCodeRefs = {
- provider: CodeRef<ExtensionHook<string[]>>;
- };
-
- export type ActionFilterCodeRefs = {
  filter: CodeRef<(scope: any, action: Action) => boolean>;
- };
-}
-
-export type ActionCreator = Extension<ExtensionProperties.ActionCreator> & {
- type: 'console.action/creator';
-};
-
-export type ActionProvider = Extension<ExtensionProperties.ActionProvider> & {
- type: 'console.action/provider';
-};
-
-export type ResourceActionProvider = Extension<ExtensionProperties.ResourceActionProvider> & {
- type: 'console.action/resource-provider';
-};
-
-export type ActionGroup = Extension<ExtensionProperties.ActionGroup> & {
- type: 'console.action/group';
-};
-
-export type ActionFilter = Extension<ExtensionProperties.ActionFilter> & {
- type: 'console.action/filter';
-};
-
-export type ResolvedActionCreator = UpdateExtensionProperties<
- ActionCreator,
- ExtensionProperties.ActionCreatorCodeRefs
+ }
 >;
 
-export type ResolvedActionProvider = UpdateExtensionProperties<
- ActionProvider,
- ExtensionProperties.ActionProviderCodeRefs
->;
+export type SupportedActionExtensions =
+ | ActionProvider
+ | ResourceActionProvider
+ | ActionGroup
+ | ActionFilter;
 
-export type ResolvedActionFilter = UpdateExtensionProperties<
- ActionFilter,
- ExtensionProperties.ActionFilterCodeRefs
->;
+// Type Guards
 
-export const isActionCreator = (e: Extension): e is ResolvedActionCreator => {
- return e.type === 'console.action/creator';
-};
-
-export const iActionProvider = (e: Extension): e is ResolvedActionProvider => {
+export const isActionProvider = (e: Extension): e is ActionProvider => {
  return e.type === 'console.action/provider';
 };
 
@@ -130,10 +90,12 @@ export const isActionGroup = (e: Extension): e is ActionGroup => {
  return e.type === 'console.action/group';
 };
 
-export const isActionFilter = (e: Extension): e is ResolvedActionFilter => {
+export const isActionFilter = (e: Extension): e is ActionFilter => {
  return e.type === 'console.action/filter';
 };
 
+// Support types
+
 export type Action = {
  /** A unique identifier for this action. */
  id: string;
@@ -142,7 +104,7 @@ export type Action = {
  /** Executable callback or href.
  * External links should automatically provide an external link icon on action.
  * */
- cta: () => void | { href: string; external?: boolean };
+ cta: (() => void) | { href: string; external?: boolean };
  /** Whether the action is disabled. */
  disabled?: boolean;
  /** The tooltip for this action. */
@@ -163,5 +125,5 @@ export type Action = {
  * */
  insertAfter?: string | string[];
  /** Describes the access check to perform. */
- accessReview?: AccessReviewResourceAttributes[];
+ accessReview?: AccessReviewResourceAttributes;
 };

frontend/packages/console-dynamic-plugin-sdk/src/extensions/catalog.ts

@@ -47,6 +47,8 @@ export type CatalogItemFilter = ExtensionDeclaration<
  }
 >;
 
+export type SupportedCatalogExtensions = CatalogItemType | CatalogItemProvider | CatalogItemFilter;
+
 // Type guards
 
 export const isCatalogItemType = (e: Extension): e is CatalogItemType => {

frontend/packages/console-dynamic-plugin-sdk/src/extensions/index.ts

@@ -14,3 +14,5 @@ export * from './yaml-templates';
 export * from './notification-alert';
 export * from './console-types';
 export * from './storage-provider';
+export * from './actions';
+export * from './topology-details';

frontend/packages/console-dynamic-plugin-sdk/src/extensions/topology-details.ts

@@ -1,10 +1,12 @@
 import * as React from 'react';
 import { Extension } from '@console/plugin-sdk/src/typings/base';
 import { GraphElement } from '@patternfly/react-topology';
-import { CodeRef, EncodedCodeRef, UpdateExtensionProperties } from '../types';
+import { CodeRef, ExtensionDeclaration } from '../types';
 
-namespace ExtensionProperties {
- export type DetailsTab = {
+/** DetailsTab contributes a tab for the topology details panel. */
+export type DetailsTab = ExtensionDeclaration<
+ 'topology.details/tab',
+ {
  /** A unique identifier for this details tab. */
  id: string;
  /** The tab label to display in the UI. */
@@ -18,17 +20,21 @@ namespace ExtensionProperties {
  * insertBefore takes precedence.
  * */
  insertAfter?: string | string[];
- };
+ }
+>;
 
- export type DetailsTabSection = {
+/** DetailsTabSection contributes a section for a specific tab in topology details panel. */
+export type DetailsTabSection = ExtensionDeclaration<
+ 'topology.details/tab-section',
+ {
  /** A unique identifier for this details tab section. */
  id: string;
  /** The parent tab ID that this section should contribute to. */
  tab: string;
  /** Returns a section for the graph element or undefined if not provided.
  * SDK component: <Section title={<optional>}>... padded area </Section>
  * */
- section: EncodedCodeRef;
+ section: CodeRef<(element: GraphElement) => React.Component | undefined>;
  /** Insert this item before the item referenced here.
  * For arrays, the first one found in order is used.
  * */
@@ -38,85 +44,58 @@ namespace ExtensionProperties {
  * insertBefore takes precedence.
  * */
  insertAfter?: string | string[];
- };
+ }
+>;
 
- export type DetailsResourceLink = {
+/** DetailsResourceLink contributes a link for specific topology context or graph element. */
+export type DetailsResourceLink = ExtensionDeclaration<
+ 'topology.details/resource-link',
+ {
  /** A higher priority factory will get the first chance to create the link. */
  priority?: number;
  /** Return the resource link if provided, otherwise undefined.
  * Use ResourceIcon and ResourceLink for styles.
  * */
- link: EncodedCodeRef;
- };
+ link: CodeRef<(element: GraphElement) => React.Component | undefined>;
+ }
+>;
 
- export type DetailsResourceAlert = {
+/** DetailsResourceAlert contributes an alert for specific topology context or graph element. */
+export type DetailsResourceAlert = ExtensionDeclaration<
+ 'topology.details/resource-alert',
+ {
  /** The ID of this alert. Used to save state if the alert should be shown after dismissed. */
  id: string;
  /** The title of the alert */
  title: string;
  /** Hook to return the contents of the Alert. */
- contentProvider: EncodedCodeRef;
+ contentProvider: CodeRef<(element: GraphElement) => DetailsResourceAlertContent>;
  /** Whether to show a dismiss button. false by default */
  dismissible?: boolean;
- };
-
- export type DetailsTabSectionCodeRefs = {
- section: CodeRef<(element: GraphElement) => React.Component | undefined>;
- };
-
- export type DetailsResourceLinkCodeRefs = {
- link: CodeRef<(element: GraphElement) => React.Component | undefined>;
- };
-
- export type DetailsResourceAlertCodeRefs = {
- contentProvider: CodeRef<(element: GraphElement) => DetailsResourceAlertContent>;
- };
-}
-
-export type DetailsTab = Extension<ExtensionProperties.DetailsTab> & {
- type: 'topology.details/tab';
-};
-
-export type DetailsTabSection = Extension<ExtensionProperties.DetailsTabSection> & {
- type: 'topology.details/tab-section';
-};
-
-export type DetailsResourceLink = Extension<ExtensionProperties.DetailsResourceLink> & {
- type: 'topology.details/resource-link';
-};
-
-export type DetailsResourceAlert = Extension<ExtensionProperties.DetailsResourceAlert> & {
- type: 'topology.details/resource-alert';
-};
-
-export type ResolvedDetailsTabSection = UpdateExtensionProperties<
- DetailsTabSection,
- ExtensionProperties.DetailsTabSectionCodeRefs
+ }
 >;
 
-export type ResolvedDetailsResourceLink = UpdateExtensionProperties<
- DetailsResourceLink,
- ExtensionProperties.DetailsResourceLinkCodeRefs
->;
+export type SupportedTopologyDetailsExtensions =
+ | DetailsTab
+ | DetailsTabSection
+ | DetailsResourceLink
+ | DetailsResourceAlert;
 
-export type ResolvedDetailsResourceAlert = UpdateExtensionProperties<
- DetailsResourceAlert,
- ExtensionProperties.DetailsResourceAlertCodeRefs
->;
+// Type guards
 
 export const isDetailsTab = (e: Extension): e is DetailsTab => {
  return e.type === 'topology.details/tab';
 };
 
-export const isDetailsTabSection = (e: Extension): e is ResolvedDetailsTabSection => {
+export const isDetailsTabSection = (e: Extension): e is DetailsTabSection => {
  return e.type === 'topology.details/tab-section';
 };
 
-export const isDetailsResourceLink = (e: Extension): e is ResolvedDetailsResourceLink => {
+export const isDetailsResourceLink = (e: Extension): e is DetailsResourceLink => {
  return e.type === 'topology.details/resource-link';
 };
 
-export const isDetailsResourceAlert = (e: Extension): e is ResolvedDetailsResourceAlert => {
+export const isDetailsResourceAlert = (e: Extension): e is DetailsResourceAlert => {
  return e.type === 'topology.details/resource-alert';
 };
 

frontend/packages/console-dynamic-plugin-sdk/src/schema/console-extensions.ts

@@ -12,13 +12,15 @@ import {
  Separator,
  NavSection,
 } from '../extensions/navigation';
-import { CatalogItemType, CatalogItemProvider, CatalogItemFilter } from '../extensions/catalog';
+import { SupportedCatalogExtensions } from '../extensions/catalog';
 import { FileUpload } from '../extensions/file-upload';
 import { ModelMetadata } from '../extensions/resource-metadata';
 import { AlertAction } from '../extensions/notification-alert';
 import { PVCCreateProp, PVCStatus, PVCAlert, PVCDelete } from '../extensions/pvc';
 import { StorageProvider } from '../extensions/storage-provider';
 import { TelemetryListener } from '../extensions/telemetry';
+import { SupportedActionExtensions } from '../extensions/actions';
+import { SupportedTopologyDetailsExtensions } from '../extensions/topology-details';
 
 export type SupportedExtension =
  | FeatureFlag
@@ -38,14 +40,14 @@ export type SupportedExtension =
  | ResourceClusterNavItem
  | Separator
  | NavSection
- | CatalogItemType
- | CatalogItemProvider
- | CatalogItemFilter
  | FileUpload
  | ModelMetadata
  | AlertAction
  | StorageProvider
- | TelemetryListener;
+ | TelemetryListener
+ | SupportedCatalogExtensions
+ | SupportedActionExtensions
+ | SupportedTopologyDetailsExtensions;
 
 /**
  * Schema of Console plugin's `console-extensions.json` file.

frontend/packages/console-shared/locales/en/console-shared.json

@@ -60,6 +60,7 @@
  "Are you sure you want to remove the {{hpaLabel}}": "Are you sure you want to remove the {{hpaLabel}}",
  "from": "from",
  "The resources that are attached to the {{hpaLabel}} will be deleted.": "The resources that are attached to the {{hpaLabel}} will be deleted.",
+ "Actions": "Actions",
  "Copy to clipboard": "Copy to clipboard",
  "Run in Web Terminal": "Run in Web Terminal",
  "Successfully copied to clipboard!": "Successfully copied to clipboard!",