chore: 🤖 catch up with latest

Author: streamich

src/plugins/ui_actions/public/actions/action.ts

@@ -20,7 +20,6 @@
 import { UiComponent } from 'src/plugins/kibana_utils/common';
 import { ActionType, ActionContextMapping } from '../types';
 import { Presentable } from '../util/presentable';
-import { Configurable } from '../util/configurable';
 
 export type ActionByType<T extends ActionType> = Action<ActionContextMapping[T], T>;
 
@@ -82,7 +81,7 @@ export interface Action<Context extends {} = {}, T = ActionType>
 export interface ActionDefinition<
   Context extends object = object,
   Config extends object | undefined = undefined
-> extends Partial<Presentable<Context>>, Partial<Configurable<Config, Context>> {
+> extends Partial<Presentable<Context>> {
   /**
    * ID of the action that uniquely identifies this action in the actions registry.
    */
@@ -116,7 +115,6 @@ export type ActionConfig<A> = A extends ActionDefinition<any, infer Config> ? Co
 export type DynamicActionDefinition<
   Context extends object = object,
   Config extends object | undefined = undefined
-> = ActionDefinition<Context, Config> &
-  Required<Pick<ActionDefinition<Context, Config>, 'CollectConfig' | 'defaultConfig' | 'type'>>;
+> = ActionDefinition<Context, Config>;
 
 export type AnyDynamicActionDefinition = DynamicActionDefinition<any, any>;

src/plugins/ui_actions/public/actions/action_internal.ts

@@ -19,7 +19,7 @@
 
 import { Action, ActionContext, AnyActionDefinition } from './action';
 import { Presentable } from '../util/presentable';
-import { createActionStateContainer, ActionState } from './action_state_container';
+// import { ActionState } from './action_state_container';
 import { uiToReactComponent } from '../../../kibana_react/public';
 import { ActionContract } from './action_contract';
 import { ActionType } from '../types';
@@ -33,20 +33,11 @@ export class ActionInternal<A extends AnyActionDefinition>
   public readonly order: number = this.definition.order || 0;
   public readonly MenuItem? = this.definition.MenuItem;
   public readonly ReactMenuItem? = this.MenuItem ? uiToReactComponent(this.MenuItem) : undefined;
-  public readonly CollectConfig? = this.definition.CollectConfig;
-  public readonly ReactCollectConfig? = this.CollectConfig
-    ? uiToReactComponent(this.CollectConfig)
-    : undefined;
 
   public get contract(): ActionContract<A> {
     return this;
   }
 
-  public readonly state = createActionStateContainer({
-    name: '',
-    config: this.definition.defaultConfig || {},
-  });
-
   public execute(context: ActionContext<A>) {
     return this.definition.execute(context);
   }
@@ -72,25 +63,21 @@ export class ActionInternal<A extends AnyActionDefinition>
   }
 
   serialize(): SerializedAction {
-    const state = this.state.get();
     const serialized: SerializedAction = {
       id: this.id,
       type: this.type || '',
-      state,
     };
 
     return serialized;
   }
 
-  deserialize({ state }: SerializedAction) {
-    this.state.set(state);
-  }
+  deserialize() {}
 }
 
 export type AnyActionInternal = ActionInternal<any>;
 
 export interface SerializedAction<Config extends object = object> {
   readonly id: string;
   readonly type: string;
-  readonly state: ActionState<Config>;
+  // readonly state: ActionState<Config>;
 }

src/plugins/ui_actions/public/index.ts

@@ -34,8 +34,9 @@ export {
   ActionInternal as UiActionsActionInternal,
   ActionContract as UiActionsActionContract,
 } from './actions';
-export { CollectConfigProps as UiActionsCollectConfigProps } from './util';
 export { buildContextMenuForActions, contextMenuSeparatorAction } from './context_menu';
+export { CollectConfigProps, Presentable, Configurable, ConfigurableBaseConfig } from './util';
+export { buildContextMenuForActions } from './context_menu';
 export { Trigger, TriggerContext } from './triggers';
 export { TriggerContextMapping, TriggerId, ActionContextMapping, ActionType } from './types';
 export { ActionByType } from './actions';

src/plugins/ui_actions/public/util/configurable.ts

@@ -19,30 +19,33 @@
 
 import { UiComponent } from 'src/plugins/kibana_utils/common';
 
+// eslint-disable-next-line @typescript-eslint/no-empty-interface
+export interface ConfigurableBaseConfig {}
+
 /**
  * Represents something that can be configured by user using UI.
  */
-export interface Configurable<Config, Context = void> {
+export interface Configurable<Config extends ConfigurableBaseConfig> {
+  /**
+   * Create default config for this item, used when item is created for the first time.
+   */
+  readonly createConfig: () => Config;
+
   /**
-   * Default config for this item, used when item is created for the first time.
+   * Is this config valid. Used to validate user's input before saving
    */
-  readonly defaultConfig?: Config;
+  readonly isConfigValid: (config: Config) => boolean;
 
   /**
    * `UiComponent` to be rendered when collecting configuration for this item.
    */
-  readonly CollectConfig?: UiComponent<CollectConfigProps<Config, Context>>;
+  readonly CollectConfig: UiComponent<CollectConfigProps<Config>>;
 }
 
 /**
  * Props provided to `CollectConfig` component on every re-render.
  */
-export interface CollectConfigProps<Config, Context = void> {
-  /**
-   * Context represents environment where this component is being rendered.
-   */
-  context: Context;
-
+export interface CollectConfigProps<Config> {
   /**
    * Current (latest) config of the item.
    */

src/plugins/ui_actions/public/util/presentable.ts

@@ -43,16 +43,16 @@ export interface Presentable<Context extends object = object> {
   /**
    * Optional EUI icon type that can be displayed along with the title.
    */
-  getIconType(context: Context): string | undefined;
+  getIconType(context?: Context): string | undefined;
 
   /**
    * Returns a title to be displayed to the user.
    */
-  getDisplayName(context: Context): string;
+  getDisplayName(context?: Context): string;
 
   /**
    * Returns a promise that resolves to true if this item is compatible given
    * the context and should be displayed to user, otherwise resolves to false.
    */
-  isCompatible(context: Context): Promise<boolean>;
+  isCompatible(context?: Context): Promise<boolean>;
 }

x-pack/plugins/advanced_ui_actions/public/components/action_wizard/action_wizard.tsx

@@ -16,28 +16,8 @@ import {
 } from '@elastic/eui';
 import { txtChangeButton } from './i18n';
 import './action_wizard.scss';
-
-// TODO: this interface is temporary for just moving forward with the component
-// and it will be imported from the ../ui_actions when implemented properly
-// eslint-disable-next-line @typescript-eslint/consistent-type-definitions
-export type ActionBaseConfig = {};
-export interface ActionFactory<Config extends ActionBaseConfig = ActionBaseConfig> {
-  type: string; // TODO: type should be tied to Action and ActionByType
-  displayName: string;
-  iconType?: string;
-  wizard: React.FC<ActionFactoryWizardProps<Config>>;
-  createConfig: () => Config;
-  isValid: (config: Config) => boolean;
-}
-
-export interface ActionFactoryWizardProps<Config extends ActionBaseConfig> {
-  config?: Config;
-
-  /**
-   * Callback called when user updates the config in UI.
-   */
-  onConfig: (config: Config) => void;
-}
+import { ActionBaseConfig, ActionFactory } from '../../ui_actions_factory';
+import { uiToReactComponent } from '../../../../../../src/plugins/kibana_react/public';
 
 export interface ActionWizardProps {
   /**
@@ -130,14 +110,14 @@ const SelectedActionFactory: React.FC<SelectedActionFactoryProps> = ({
     >
       <header>
         <EuiFlexGroup alignItems="center" gutterSize="s">
-          {actionFactory.iconType && (
+          {actionFactory.getIconType() && (
             <EuiFlexItem grow={false}>
-              <EuiIcon type={actionFactory.iconType} size="m" />
+              <EuiIcon type={actionFactory.getIconType()!} size="m" />
             </EuiFlexItem>
           )}
           <EuiFlexItem grow={true}>
             <EuiText>
-              <h4>{actionFactory.displayName}</h4>
+              <h4>{actionFactory.getDisplayName()}</h4>
             </EuiText>
           </EuiFlexItem>
           {showDeselect && (
@@ -151,7 +131,7 @@ const SelectedActionFactory: React.FC<SelectedActionFactoryProps> = ({
       </header>
       <EuiSpacer size="m" />
       <div>
-        {actionFactory.wizard({
+        {uiToReactComponent(actionFactory.CollectConfig)({
           config,
           onConfig: onConfigChange,
         })}
@@ -182,13 +162,13 @@ const ActionFactorySelector: React.FC<ActionFactorySelectorProps> = ({
       {actionFactories.map(actionFactory => (
         <EuiKeyPadMenuItemButton
           className="auaActionWizard__actionFactoryItem"
-          key={actionFactory.type}
-          label={actionFactory.displayName}
+          key={actionFactory.id}
+          label={actionFactory.getDisplayName()}
           data-testid={TEST_SUBJ_ACTION_FACTORY_ITEM}
           data-test-subj={TEST_SUBJ_ACTION_FACTORY_ITEM}
           onClick={() => onActionFactorySelected(actionFactory)}
         >
-          {actionFactory.iconType && <EuiIcon type={actionFactory.iconType} size="m" />}
+          {actionFactory.getIconType() && <EuiIcon type={actionFactory.getIconType()!} size="m" />}
         </EuiKeyPadMenuItemButton>
       ))}
     </EuiFlexGroup>

x-pack/plugins/advanced_ui_actions/public/components/action_wizard/index.ts

@@ -4,4 +4,4 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-export { ActionFactory, ActionWizard, ActionBaseConfig } from './action_wizard';
+export { ActionWizard } from './action_wizard';