From f0db6c7c8ac22219d4cfde042fe354ccfe08cc19 Mon Sep 17 00:00:00 2001 From: Christopher Davies Date: Tue, 1 Oct 2019 14:37:34 -0400 Subject: [PATCH 1/2] Remove Lens-specific code from visualize --- .../__snapshots__/new_vis_modal.test.tsx.snap | 288 +----------------- .../type_selection/new_vis_help.test.tsx | 76 +++++ .../wizard/type_selection/new_vis_help.tsx | 52 ++-- .../wizard/type_selection/type_selection.tsx | 10 +- .../np_ready/types/vis_type_alias_registry.ts | 7 +- .../lens/public/register_vis_type_alias.ts | 9 +- 6 files changed, 134 insertions(+), 308 deletions(-) create mode 100644 src/legacy/core_plugins/kibana/public/visualize/wizard/type_selection/new_vis_help.test.tsx diff --git a/src/legacy/core_plugins/kibana/public/visualize/wizard/__snapshots__/new_vis_modal.test.tsx.snap b/src/legacy/core_plugins/kibana/public/visualize/wizard/__snapshots__/new_vis_modal.test.tsx.snap index af487202c84fe..341a839e9c776 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/wizard/__snapshots__/new_vis_modal.test.tsx.snap +++ b/src/legacy/core_plugins/kibana/public/visualize/wizard/__snapshots__/new_vis_modal.test.tsx.snap @@ -322,34 +322,6 @@ exports[`NewVisModal filter for visualization types should render as expected 1`

Start creating your visualization by selecting a type for that visualization.

-

- - Try Lens, our new, intuitive way to create visualizations. - -

- @@ -614,34 +586,6 @@ exports[`NewVisModal filter for visualization types should render as expected 1`

Start creating your visualization by selecting a type for that visualization.

-

- - Try Lens, our new, intuitive way to create visualizations. - -

- @@ -849,34 +793,6 @@ exports[`NewVisModal filter for visualization types should render as expected 1`

Start creating your visualization by selecting a type for that visualization.

-

- - Try Lens, our new, intuitive way to create visualizations. - -

- @@ -1314,7 +1230,9 @@ exports[`NewVisModal filter for visualization types should render as expected 1` className="euiSpacer euiSpacer--m" /> - +

-

- - - Try Lens, our new, intuitive way to create visualizations. - - -

- - -
@@ -1738,34 +1600,6 @@ exports[`NewVisModal should render as expected 1`] = `

Start creating your visualization by selecting a type for that visualization.

-

- - Try Lens, our new, intuitive way to create visualizations. - -

- @@ -2027,34 +1861,6 @@ exports[`NewVisModal should render as expected 1`] = `

Start creating your visualization by selecting a type for that visualization.

-

- - Try Lens, our new, intuitive way to create visualizations. - -

- @@ -2259,34 +2065,6 @@ exports[`NewVisModal should render as expected 1`] = `

Start creating your visualization by selecting a type for that visualization.

-

- - Try Lens, our new, intuitive way to create visualizations. - -

- @@ -2712,7 +2490,9 @@ exports[`NewVisModal should render as expected 1`] = ` className="euiSpacer euiSpacer--m" /> - +

-

- - - Try Lens, our new, intuitive way to create visualizations. - - -

- - -
diff --git a/src/legacy/core_plugins/kibana/public/visualize/wizard/type_selection/new_vis_help.test.tsx b/src/legacy/core_plugins/kibana/public/visualize/wizard/type_selection/new_vis_help.test.tsx new file mode 100644 index 0000000000000..f83b7fd2a2f00 --- /dev/null +++ b/src/legacy/core_plugins/kibana/public/visualize/wizard/type_selection/new_vis_help.test.tsx @@ -0,0 +1,76 @@ +/* + * Licensed to Elasticsearch B.V. under one or more contributor + * license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright + * ownership. Elasticsearch B.V. licenses this file to you under + * the Apache License, Version 2.0 (the "License"); you may + * not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +import React from 'react'; +import { shallowWithIntl } from 'test_utils/enzyme_helpers'; +import { NewVisHelp } from './new_vis_help'; +import chrome from 'ui/chrome'; + +jest.doMock('ui/chrome'); + +describe('NewVisHelp', () => { + it('should render as expected', () => { + (chrome.addBasePath as unknown) = (url: string) => `testbasepath${url}`; + + expect( + shallowWithIntl( + + ) + ).toMatchInlineSnapshot(` + +

+ +

+

+ + Look at this fancy new thing!!! + +

+ + Do it now! + +
+ `); + }); +}); diff --git a/src/legacy/core_plugins/kibana/public/visualize/wizard/type_selection/new_vis_help.tsx b/src/legacy/core_plugins/kibana/public/visualize/wizard/type_selection/new_vis_help.tsx index 426cf0ea73ccb..6603bdf38e88a 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/wizard/type_selection/new_vis_help.tsx +++ b/src/legacy/core_plugins/kibana/public/visualize/wizard/type_selection/new_vis_help.tsx @@ -19,27 +19,39 @@ import { FormattedMessage } from '@kbn/i18n/react'; import React from 'react'; - import { EuiText, EuiButton } from '@elastic/eui'; +import chrome from 'ui/chrome'; +import { VisTypeAliasListEntry } from './type_selection'; + +interface Props { + promotedTypes: VisTypeAliasListEntry[]; +} -export const NewVisHelp = () => ( - -

- -

-

- +export function NewVisHelp(props: Props) { + return ( + +

- -

- - Go to Lens - -
-); +

+ {props.promotedTypes.map(t => ( + <> +

+ {t.promotion!.description} +

+ + {t.promotion!.calloutText} + + + ))} + + ); +} diff --git a/src/legacy/core_plugins/kibana/public/visualize/wizard/type_selection/type_selection.tsx b/src/legacy/core_plugins/kibana/public/visualize/wizard/type_selection/type_selection.tsx index a4a37e6143f62..04bb30458ead7 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/wizard/type_selection/type_selection.tsx +++ b/src/legacy/core_plugins/kibana/public/visualize/wizard/type_selection/type_selection.tsx @@ -43,11 +43,11 @@ import { VisHelpText } from './vis_help_text'; import { VisTypeIcon } from './vis_type_icon'; import { TypesStart } from '../../../../../visualizations/public/np_ready/types'; -interface VisTypeListEntry extends VisType { +export interface VisTypeListEntry extends VisType { highlighted: boolean; } -interface VisTypeAliasListEntry extends VisTypeAlias { +export interface VisTypeAliasListEntry extends VisTypeAlias { highlighted: boolean; } @@ -152,7 +152,9 @@ class TypeSelection extends React.Component - + t.promotion)} + /> )} @@ -196,7 +198,7 @@ class TypeSelection extends React.Component { diff --git a/src/legacy/core_plugins/visualizations/public/np_ready/types/vis_type_alias_registry.ts b/src/legacy/core_plugins/visualizations/public/np_ready/types/vis_type_alias_registry.ts index 8334a8b130e6f..1fa8f8e880cea 100644 --- a/src/legacy/core_plugins/visualizations/public/np_ready/types/vis_type_alias_registry.ts +++ b/src/legacy/core_plugins/visualizations/public/np_ready/types/vis_type_alias_registry.ts @@ -37,12 +37,17 @@ interface VisualizationsAppExtension { }) => VisualizationListItem; } +export interface VisTypeAliasPromotion { + description: string; + calloutText: string; +} + export interface VisTypeAlias { aliasUrl: string; name: string; title: string; icon: string; - isPromoted?: boolean; + promotion?: VisTypeAliasPromotion; description: string; appExtensions?: { diff --git a/x-pack/legacy/plugins/lens/public/register_vis_type_alias.ts b/x-pack/legacy/plugins/lens/public/register_vis_type_alias.ts index 701c351b8b149..23a3452a8c94d 100644 --- a/x-pack/legacy/plugins/lens/public/register_vis_type_alias.ts +++ b/x-pack/legacy/plugins/lens/public/register_vis_type_alias.ts @@ -11,7 +11,14 @@ import { BASE_APP_URL, getEditPath } from '../common'; visualizations.types.registerAlias({ aliasUrl: BASE_APP_URL, name: 'lens', - isPromoted: true, + promotion: { + description: i18n.translate('xpack.lens.visTypeAlias.promotion.description', { + defaultMessage: 'Try Lens, our new, intuitive way to create visualizations.', + }), + calloutText: i18n.translate('xpack.lens.visTypeAlias.promotion.calloutText', { + defaultMessage: 'Go to Lens', + }), + }, title: i18n.translate('xpack.lens.visTypeAlias.title', { defaultMessage: 'Lens Visualizations', }), From be984ef5b1963283944c3d3d1008e0ac68eb6b39 Mon Sep 17 00:00:00 2001 From: Christopher Davies Date: Tue, 1 Oct 2019 15:03:20 -0400 Subject: [PATCH 2/2] Add Lens help to the chrome help menu --- .../legacy/plugins/lens/public/help_menu.js | 48 ------------------- .../plugins/lens/public/help_menu_util.js | 17 ------- .../plugins/lens/public/help_menu_util.tsx | 48 +++++++++++++++++++ x-pack/legacy/plugins/lens/public/index.ts | 3 ++ 4 files changed, 51 insertions(+), 65 deletions(-) delete mode 100644 x-pack/legacy/plugins/lens/public/help_menu.js delete mode 100644 x-pack/legacy/plugins/lens/public/help_menu_util.js create mode 100644 x-pack/legacy/plugins/lens/public/help_menu_util.tsx diff --git a/x-pack/legacy/plugins/lens/public/help_menu.js b/x-pack/legacy/plugins/lens/public/help_menu.js deleted file mode 100644 index 9661a35d8f9f6..0000000000000 --- a/x-pack/legacy/plugins/lens/public/help_menu.js +++ /dev/null @@ -1,48 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License; - * you may not use this file except in compliance with the Elastic License. - */ - -import React, { Fragment, PureComponent } from 'react'; -import { EuiHorizontalRule, EuiSpacer, EuiLink, EuiText, EuiIcon, EuiButton } from '@elastic/eui'; -import { ELASTIC_WEBSITE_URL, DOC_LINK_VERSION } from 'ui/documentation_links'; -import { i18n } from '@kbn/i18n'; -import { FormattedMessage } from '@kbn/i18n/react'; - -const docsPage = undefined; - -export class HelpMenu extends PureComponent { - render() { - return ( - - - {docsPage && ( - <> - - - - - - - )} - -   - - {i18n.translate('xpack.lens.helpMenu.feedbackLinkText', { - defaultMessage: 'Provide feedback for the Lens application', - })} - - - - ); - } -} diff --git a/x-pack/legacy/plugins/lens/public/help_menu_util.js b/x-pack/legacy/plugins/lens/public/help_menu_util.js deleted file mode 100644 index 7ded62493d52d..0000000000000 --- a/x-pack/legacy/plugins/lens/public/help_menu_util.js +++ /dev/null @@ -1,17 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License; - * you may not use this file except in compliance with the Elastic License. - */ -import React from 'react'; -import { render, unmountComponentAtNode } from 'react-dom'; -import { HelpMenu } from './help_menu'; - -export function addHelpMenuToAppChrome(chrome) { - chrome.helpExtension.set(domElement => { - render(, domElement); - return () => { - unmountComponentAtNode(domElement); - }; - }); -} diff --git a/x-pack/legacy/plugins/lens/public/help_menu_util.tsx b/x-pack/legacy/plugins/lens/public/help_menu_util.tsx new file mode 100644 index 0000000000000..be4a7947612a9 --- /dev/null +++ b/x-pack/legacy/plugins/lens/public/help_menu_util.tsx @@ -0,0 +1,48 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import React from 'react'; +import { EuiHorizontalRule, EuiSpacer, EuiLink, EuiText, EuiIcon, EuiButton } from '@elastic/eui'; +import { ELASTIC_WEBSITE_URL, DOC_LINK_VERSION } from 'ui/documentation_links'; +import { i18n } from '@kbn/i18n'; +import { FormattedMessage } from '@kbn/i18n/react'; +import { render, unmountComponentAtNode } from 'react-dom'; +import { Chrome } from 'ui/chrome'; + +export function addHelpMenuToAppChrome(chrome: Chrome) { + chrome.helpExtension.set(domElement => { + render(, domElement); + return () => { + unmountComponentAtNode(domElement); + }; + }); +} + +function HelpMenu() { + return ( + <> + + + + + + + +   + + {i18n.translate('xpack.lens.helpMenu.feedbackLinkText', { + defaultMessage: 'Provide feedback for the Lens application', + })} + + + + ); +} diff --git a/x-pack/legacy/plugins/lens/public/index.ts b/x-pack/legacy/plugins/lens/public/index.ts index 75f956662ec37..cd1cbc92fb330 100644 --- a/x-pack/legacy/plugins/lens/public/index.ts +++ b/x-pack/legacy/plugins/lens/public/index.ts @@ -20,6 +20,7 @@ import { IScope } from 'angular'; import chrome from 'ui/chrome'; import { appStart, appSetup, appStop } from './app_plugin'; import { PLUGIN_ID } from '../common'; +import { addHelpMenuToAppChrome } from './help_menu_util'; // TODO: Convert this to the "new platform" way of doing UI function Root($scope: IScope, $element: JQLite) { @@ -30,6 +31,8 @@ function Root($scope: IScope, $element: JQLite) { }); appSetup(); + addHelpMenuToAppChrome(chrome); + return render(appStart(), el); }