switch to icon type string instead of node (#43111)

* switch to icon type string instead of node. Some EUI components only take the string. * Fix lint errors * another type fix
elastic · Aug 12, 2019 · 4cfcad4 · 4cfcad4
1 parent 3503aa1
commit 4cfcad4
Show file tree

Hide file tree

Showing 12 changed files with 20 additions and 42 deletions.
diff --git a/...oard_embeddable_container/public/np_ready/public/lib/actions/expand_panel_action.test.tsx b/...oard_embeddable_container/public/np_ready/public/lib/actions/expand_panel_action.test.tsx
@@ -106,5 +106,5 @@ test('Returns title', async () => {
 
 test('Returns an icon', async () => {
   const action = new ExpandPanelAction();
-  expect(action.getIcon({ embeddable })).toBeDefined();
+  expect(action.getIconType({ embeddable })).toBeDefined();
 });
diff --git a/...dashboard_embeddable_container/public/np_ready/public/lib/actions/expand_panel_action.tsx b/...dashboard_embeddable_container/public/np_ready/public/lib/actions/expand_panel_action.tsx
@@ -17,9 +17,7 @@
  * under the License.
  */
 
-import { EuiIcon } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
-import React from 'react';
 import {
   Action,
   IEmbeddable,
@@ -70,12 +68,12 @@ export class ExpandPanelAction extends Action {
         );
   }
 
-  public getIcon({ embeddable }: ActionContext) {
+  public getIconType({ embeddable }: ActionContext) {
     if (!embeddable.parent || !isDashboard(embeddable.parent)) {
       throw new IncompatibleActionError();
     }
     // TODO: use 'minimize' when an eui-icon of such is available.
-    return <EuiIcon type={isExpanded(embeddable) ? 'expand' : 'expand'} />;
+    return isExpanded(embeddable) ? 'expand' : 'expand';
   }
 
   public async isCompatible({ embeddable }: ActionContext) {

diff --git a/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/action.ts b/src/legacy/core_plugins/embeddable_api/public/np_ready/public/lib/actions/action.ts
@@ -17,8 +17,6 @@
  * under the License.
  */
 
-import { EuiContextMenuItemIcon } from '@elastic/eui';
-
 import { IEmbeddable } from '../embeddables';
 
 export interface ActionContext<
@@ -43,11 +41,9 @@ export abstract class Action<
   constructor(public readonly id: string) {}
 
   /**
-   * Optional icon that can be displayed along with the title.
+   * Optional EUI icon type that can be displayed along with the title.
    */
-  public getIcon(
-    context: ActionContext<TEmbeddable, TTriggerContext>
-  ): EuiContextMenuItemIcon | undefined {
+  public getIconType(context: ActionContext<TEmbeddable, TTriggerContext>): string | undefined {
     return undefined;
   }
 

diff --git a/.../public/lib/actions/edit_panel_action.tsx → ...y/public/lib/actions/edit_panel_action.ts b/.../public/lib/actions/edit_panel_action.tsx → ...y/public/lib/actions/edit_panel_action.ts
@@ -17,9 +17,7 @@
  * under the License.
  */
 
-import React from 'react';
 import { i18n } from '@kbn/i18n';
-import { EuiIcon } from '@elastic/eui';
 import { Action, ActionContext } from './action';
 import { GetEmbeddableFactory, ViewMode } from '../types';
 import { EmbeddableFactoryNotFoundError } from '../errors';
@@ -46,8 +44,8 @@ export class EditPanelAction extends Action {
     });
   }
 
-  getIcon() {
-    return <EuiIcon type="pencil" />;
+  getIconType() {
+    return 'pencil';
   }
 
   public async isCompatible({ embeddable }: ActionContext) {

diff --git a/...able_api/public/np_ready/public/lib/context_menu_actions/build_eui_context_menu_panels.ts b/...able_api/public/np_ready/public/lib/context_menu_actions/build_eui_context_menu_panels.ts
@@ -99,7 +99,7 @@ function convertPanelActionToContextMenuItem({
 }): EuiContextMenuPanelItemDescriptor {
   const menuPanelItem: EuiContextMenuPanelItemDescriptor = {
     name: action.getDisplayName(actionContext),
-    icon: action.getIcon(actionContext),
+    icon: action.getIconType(actionContext),
     panel: _.get(action, 'childContextMenuPanel.id'),
     'data-test-subj': `embeddablePanelAction-${action.id}`,
   };

diff --git a/.../np_ready/public/lib/panel/panel_header/panel_actions/add_panel/add_panel_action.test.tsx b/.../np_ready/public/lib/panel/panel_header/panel_actions/add_panel/add_panel_action.test.tsx
@@ -125,5 +125,5 @@ test('Returns title', async () => {
 });
 
 test('Returns an icon', async () => {
-  expect(action.getIcon()).toBeDefined();
+  expect(action.getIconType()).toBeDefined();
 });
diff --git a/...el_actions/add_panel/add_panel_action.tsx → ...nel_actions/add_panel/add_panel_action.ts b/...el_actions/add_panel/add_panel_action.tsx → ...nel_actions/add_panel/add_panel_action.ts
@@ -16,10 +16,6 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-
-import { EuiIcon } from '@elastic/eui';
-import React from 'react';
-
 import { i18n } from '@kbn/i18n';
 import { ViewMode, GetEmbeddableFactory, GetEmbeddableFactories } from '../../../../types';
 import { Action, ActionContext } from '../../../../actions';
@@ -47,8 +43,8 @@ export class AddPanelAction extends Action {
     });
   }
 
-  public getIcon() {
-    return <EuiIcon type="plusInCircleFilled" />;
+  public getIconType() {
+    return 'plusInCircleFilled';
   }
 
   public async isCompatible({ embeddable }: ActionContext) {

diff --git a/...ustomize_title/customize_panel_action.tsx → ...customize_title/customize_panel_action.ts b/...ustomize_title/customize_panel_action.tsx → ...customize_title/customize_panel_action.ts
@@ -17,8 +17,6 @@
  * under the License.
  */
 
-import { EuiIcon } from '@elastic/eui';
-import React from 'react';
 import { i18n } from '@kbn/i18n';
 import { Action, ActionContext } from '../../../../actions';
 import { ViewMode } from '../../../../types';
@@ -41,8 +39,8 @@ export class CustomizePanelTitleAction extends Action {
     });
   }
 
-  public getIcon() {
-    return <EuiIcon type="pencil" />;
+  public getIconType() {
+    return 'pencil';
   }
 
   public async isCompatible({ embeddable }: ActionContext) {

diff --git a/...public/np_ready/public/lib/panel/panel_header/panel_actions/inspect_panel_action.test.tsx b/...public/np_ready/public/lib/panel/panel_header/panel_actions/inspect_panel_action.test.tsx
@@ -155,9 +155,5 @@ test('Returns title', async () => {
 test('Returns an icon', async () => {
   const inspector = inspectorPluginMock.createStartContract();
   const inspectAction = new InspectPanelAction(inspector);
-  expect(inspectAction.getIcon()).toMatchInlineSnapshot(`
-    <EuiIcon
-      type="inspect"
-    />
-  `);
+  expect(inspectAction.getIconType()).toBe('inspect');
 });
diff --git a/...er/panel_actions/inspect_panel_action.tsx → ...der/panel_actions/inspect_panel_action.ts b/...er/panel_actions/inspect_panel_action.tsx → ...der/panel_actions/inspect_panel_action.ts
@@ -17,8 +17,6 @@
  * under the License.
  */
 
-import { EuiIcon } from '@elastic/eui';
-import React from 'react';
 import { i18n } from '@kbn/i18n';
 import { Action, ActionContext } from '../../../actions';
 import { Start as InspectorStartContract } from '../../../../../../../../../../plugins/inspector/public';
@@ -39,8 +37,8 @@ export class InspectPanelAction extends Action {
     });
   }
 
-  public getIcon() {
-    return <EuiIcon type="inspect" />;
+  public getIconType() {
+    return 'inspect';
   }
 
   public async isCompatible({ embeddable }: ActionContext) {

diff --git a/.../public/np_ready/public/lib/panel/panel_header/panel_actions/remove_panel_action.test.tsx b/.../public/np_ready/public/lib/panel/panel_header/panel_actions/remove_panel_action.test.tsx
@@ -102,7 +102,7 @@ test('Returns title', async () => {
   expect(action.getDisplayName()).toBeDefined();
 });
 
-test('Returns an icon', async () => {
+test('Returns an icon type', async () => {
   const action = new RemovePanelAction();
-  expect(action.getIcon()).toBeDefined();
+  expect(action.getIconType()).toBeDefined();
 });
diff --git a/...der/panel_actions/remove_panel_action.tsx → ...ader/panel_actions/remove_panel_action.ts b/...der/panel_actions/remove_panel_action.tsx → ...ader/panel_actions/remove_panel_action.ts
@@ -16,9 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import React from 'react';
 import { i18n } from '@kbn/i18n';
-import { EuiIcon } from '@elastic/eui';
 import { ContainerInput, IContainer } from '../../../containers';
 import { ViewMode } from '../../../types';
 import { Action, ActionContext } from '../../../actions';
@@ -50,8 +48,8 @@ export class RemovePanelAction extends Action {
     });
   }
 
-  public getIcon() {
-    return <EuiIcon type="trash" />;
+  public getIconType() {
+    return 'trash';
   }
 
   public async isCompatible({ embeddable }: ActionContext) {