diff --git a/src/legacy/core_plugins/kibana/public/visualize/index.ts b/src/legacy/core_plugins/kibana/public/visualize/index.ts index e7170836cf749..83b820a8e3134 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/index.ts +++ b/src/legacy/core_plugins/kibana/public/visualize/index.ts @@ -21,7 +21,6 @@ import { PluginInitializerContext } from 'kibana/public'; import { VisualizePlugin } from './plugin'; export * from './np_ready/visualize_constants'; -export { showNewVisModal } from './np_ready/wizard'; export { VisualizeConstants, createVisualizeEditUrl } from './np_ready/visualize_constants'; // Core will be looking for this when loading our plugin in the new platform diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/_index.scss b/src/legacy/core_plugins/kibana/public/visualize/np_ready/_index.scss index f97ae012055b0..847e72bf29fbc 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/np_ready/_index.scss +++ b/src/legacy/core_plugins/kibana/public/visualize/np_ready/_index.scss @@ -7,4 +7,3 @@ @import 'editor/index'; @import 'listing/index'; -@import 'wizard/index'; diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/listing/visualize_listing.html b/src/legacy/core_plugins/kibana/public/visualize/np_ready/listing/visualize_listing.html index 522d20fffafd3..17caaba144a44 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/np_ready/listing/visualize_listing.html +++ b/src/legacy/core_plugins/kibana/public/visualize/np_ready/listing/visualize_listing.html @@ -9,15 +9,4 @@ edit-item="listingController.editItem" listing-limit="listingController.listingLimit" > - - - diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/listing/visualize_listing.js b/src/legacy/core_plugins/kibana/public/visualize/np_ready/listing/visualize_listing.js index ac8308e1cd1c5..6bac4e4c62efa 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/np_ready/listing/visualize_listing.js +++ b/src/legacy/core_plugins/kibana/public/visualize/np_ready/listing/visualize_listing.js @@ -19,7 +19,7 @@ import { addHelpMenuToAppChrome } from '../help_menu/help_menu_util'; import { VisualizeListingTable } from './visualize_listing_table'; -import { NewVisModal } from '../wizard/new_vis_modal'; + import { VisualizeConstants } from '../visualize_constants'; import { i18n } from '@kbn/i18n'; @@ -30,17 +30,6 @@ export function initListingDirective(app) { app.directive('visualizeListingTable', reactDirective => reactDirective(wrapInI18nContext(VisualizeListingTable)) ); - app.directive('newVisModal', reactDirective => - reactDirective(wrapInI18nContext(NewVisModal), [ - ['visTypesRegistry', { watchDepth: 'collection' }], - ['onClose', { watchDepth: 'reference' }], - ['addBasePath', { watchDepth: 'reference' }], - ['uiSettings', { watchDepth: 'reference' }], - ['savedObjects', { watchDepth: 'reference' }], - ['usageCollection', { watchDepth: 'reference' }], - 'isOpen', - ]) - ); } export function VisualizeListingController($injector, createNewVis) { @@ -59,21 +48,18 @@ export function VisualizeListingController($injector, createNewVis) { uiSettings, visualizations, core: { docLinks, savedObjects }, - usageCollection, } = getServices(); const kbnUrl = $injector.get('kbnUrl'); timefilter.disableAutoRefreshSelector(); timefilter.disableTimeRangeSelector(); - this.showNewVisModal = false; this.addBasePath = addBasePath; this.uiSettings = uiSettings; this.savedObjects = savedObjects; - this.usageCollection = usageCollection; this.createNewVis = () => { - this.showNewVisModal = true; + visualizations.showNewVisModal(); }; this.editItem = ({ editUrl }) => { @@ -85,19 +71,15 @@ export function VisualizeListingController($injector, createNewVis) { return addBasePath(editUrl); }; - this.closeNewVisModal = () => { - this.showNewVisModal = false; - // In case the user came via a URL to this page, change the URL to the regular landing page URL after closing the modal - if (createNewVis) { - kbnUrl.changePath(VisualizeConstants.LANDING_PAGE_PATH); - } - }; - if (createNewVis) { // In case the user navigated to the page via the /visualize/new URL we start the dialog immediately - this.createNewVis(); + visualizations.showNewVisModal({ + onClose: () => { + // In case the user came via a URL to this page, change the URL to the regular landing page URL after closing the modal + kbnUrl.changePath(VisualizeConstants.LANDING_PAGE_PATH); + }, + }); } - this.visTypeRegistry = visualizations.types; this.fetchItems = filter => { const isLabsEnabled = uiSettings.get('visualize:enableLabs'); diff --git a/src/legacy/core_plugins/visualizations/public/embeddable/visualize_embeddable_factory.tsx b/src/legacy/core_plugins/visualizations/public/embeddable/visualize_embeddable_factory.tsx index e5836c1372068..03471174753fa 100644 --- a/src/legacy/core_plugins/visualizations/public/embeddable/visualize_embeddable_factory.tsx +++ b/src/legacy/core_plugins/visualizations/public/embeddable/visualize_embeddable_factory.tsx @@ -20,31 +20,24 @@ import { i18n } from '@kbn/i18n'; import { SavedObjectAttributes } from 'kibana/public'; import { - EmbeddableFactory, - ErrorEmbeddable, Container, + EmbeddableFactory, EmbeddableOutput, + ErrorEmbeddable, } from '../../../../../plugins/embeddable/public'; -import { showNewVisModal } from '../../../kibana/public/visualize'; import { SavedVisualizations } from '../../../kibana/public/visualize/np_ready/types'; import { DisabledLabEmbeddable } from './disabled_lab_embeddable'; import { getIndexPattern } from './get_index_pattern'; import { + VisSavedObject, VisualizeEmbeddable, VisualizeInput, VisualizeOutput, - VisSavedObject, } from './visualize_embeddable'; import { VISUALIZE_EMBEDDABLE_TYPE } from './constants'; -import { - getUISettings, - getCapabilities, - getHttp, - getTypes, - getSavedObjects, - getUsageCollector, -} from '../np_ready/public/services'; +import { getCapabilities, getHttp, getTypes, getUISettings } from '../np_ready/public/services'; +import { showNewVisModal } from '../np_ready/public/wizard'; interface VisualizationAttributes extends SavedObjectAttributes { visState: string; @@ -157,16 +150,9 @@ export class VisualizeEmbeddableFactory extends EmbeddableFactory< public async create() { // TODO: This is a bit of a hack to preserve the original functionality. Ideally we will clean this up // to allow for in place creation of visualizations without having to navigate away to a new URL. - showNewVisModal( - getTypes(), - { - editorParams: ['addToDashboard'], - }, - getHttp().basePath.prepend, - getUISettings(), - getSavedObjects(), - getUsageCollector() - ); + showNewVisModal({ + editorParams: ['addToDashboard'], + }); return undefined; } } diff --git a/src/legacy/core_plugins/visualizations/public/index.scss b/src/legacy/core_plugins/visualizations/public/index.scss index 957d06be4daf0..748945eabd331 100644 --- a/src/legacy/core_plugins/visualizations/public/index.scss +++ b/src/legacy/core_plugins/visualizations/public/index.scss @@ -1,3 +1,4 @@ @import 'src/legacy/ui/public/styles/styling_constants'; -@import './embeddable/_index'; +@import './embeddable/index'; +@import './np_ready/public/index'; diff --git a/src/legacy/core_plugins/visualizations/public/np_ready/public/_index.scss b/src/legacy/core_plugins/visualizations/public/np_ready/public/_index.scss new file mode 100644 index 0000000000000..d87b6b004a511 --- /dev/null +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/_index.scss @@ -0,0 +1 @@ +@import 'wizard/index'; diff --git a/src/legacy/core_plugins/visualizations/public/np_ready/public/mocks.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/mocks.ts index fc85970b906ae..1063b1718b851 100644 --- a/src/legacy/core_plugins/visualizations/public/np_ready/public/mocks.ts +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/mocks.ts @@ -48,6 +48,7 @@ const createStartContract = (): VisualizationsStart => ({ getAliases: jest.fn(), }, getSavedVisualizationsLoader: jest.fn(), + showNewVisModal: jest.fn(), }); const createInstance = async () => { diff --git a/src/legacy/core_plugins/visualizations/public/np_ready/public/plugin.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/plugin.ts index 01059044b98c2..cbbeb7ff980a6 100644 --- a/src/legacy/core_plugins/visualizations/public/np_ready/public/plugin.ts +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/plugin.ts @@ -43,6 +43,7 @@ import { SavedObjectKibanaServicesWithVisualizations, } from '../../saved_visualizations'; import { SavedVisualizations } from '../../../../kibana/public/visualize/np_ready/types'; +import { showNewVisModal } from './wizard'; /** * Interface for this plugin's returned setup/start contracts. * @@ -55,6 +56,7 @@ export interface VisualizationsSetup { export interface VisualizationsStart { types: TypesStart; getSavedVisualizationsLoader: () => SavedVisualizations; + showNewVisModal: typeof showNewVisModal; } export interface VisualizationsSetupDeps { @@ -92,7 +94,7 @@ export class VisualizationsPlugin public setup( core: CoreSetup, { expressions, embeddable, usageCollection }: VisualizationsSetupDeps - ) { + ): VisualizationsSetup { setUISettings(core.uiSettings); setUsageCollector(usageCollection); @@ -107,7 +109,7 @@ export class VisualizationsPlugin }; } - public start(core: CoreStart, { data }: VisualizationsStartDeps) { + public start(core: CoreStart, { data }: VisualizationsStartDeps): VisualizationsStart { const types = this.types.start(); setI18n(core.i18n); setTypes(types); @@ -128,6 +130,7 @@ export class VisualizationsPlugin return { types, getSavedVisualizationsLoader: () => this.getSavedVisualizationsLoader(), + showNewVisModal, }; } diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/__snapshots__/new_vis_modal.test.tsx.snap b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/__snapshots__/new_vis_modal.test.tsx.snap similarity index 99% rename from src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/__snapshots__/new_vis_modal.test.tsx.snap rename to src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/__snapshots__/new_vis_modal.test.tsx.snap index 2dcf3ed0ea06f..b1c9e37218c58 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/__snapshots__/new_vis_modal.test.tsx.snap +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/__snapshots__/new_vis_modal.test.tsx.snap @@ -1154,7 +1154,7 @@ exports[`NewVisModal filter for visualization types should render as expected 1` > New Visualization @@ -1344,7 +1344,7 @@ exports[`NewVisModal filter for visualization types should render as expected 1` > Select a visualization type @@ -1718,7 +1718,7 @@ exports[`NewVisModal filter for visualization types should render as expected 1`

Start creating your visualization by selecting a type for that visualization. @@ -2844,7 +2844,7 @@ exports[`NewVisModal should render as expected 1`] = ` > New Visualization @@ -3317,7 +3317,7 @@ exports[`NewVisModal should render as expected 1`] = ` > Select a visualization type @@ -3342,7 +3342,7 @@ exports[`NewVisModal should render as expected 1`] = `

Start creating your visualization by selecting a type for that visualization. diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/_dialog.scss b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/_dialog.scss similarity index 100% rename from src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/_dialog.scss rename to src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/_dialog.scss diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/_index.scss b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/_index.scss similarity index 100% rename from src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/_index.scss rename to src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/_index.scss diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/index.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/index.ts similarity index 94% rename from src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/index.ts rename to src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/index.ts index 7a3fc63af5259..55ac9ddfb5ca8 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/index.ts +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/index.ts @@ -17,5 +17,4 @@ * under the License. */ -export { NewVisModal } from './new_vis_modal'; export { showNewVisModal } from './show_new_vis'; diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/new_vis_modal.test.tsx b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/new_vis_modal.test.tsx similarity index 96% rename from src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/new_vis_modal.test.tsx rename to src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/new_vis_modal.test.tsx index 0ef1b711eafc8..0701b5042a4bd 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/new_vis_modal.test.tsx +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/new_vis_modal.test.tsx @@ -19,15 +19,7 @@ import React from 'react'; import { mountWithIntl } from 'test_utils/enzyme_helpers'; - -import { VisType } from '../../legacy_imports'; -import { TypesStart } from '../../../../../visualizations/public/np_ready/public/types'; - -jest.mock('../../legacy_imports', () => ({ - State: () => null, - AppState: () => null, -})); - +import { TypesStart, VisType } from '../types'; import { NewVisModal } from './new_vis_modal'; import { SavedObjectsStart } from 'kibana/public'; diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/new_vis_modal.tsx b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/new_vis_modal.tsx similarity index 93% rename from src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/new_vis_modal.tsx rename to src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/new_vis_modal.tsx index 082fc3bc36b6b..fe66d2e56c611 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/new_vis_modal.tsx +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/new_vis_modal.tsx @@ -24,14 +24,9 @@ import { i18n } from '@kbn/i18n'; import { METRIC_TYPE, UiStatsMetricType } from '@kbn/analytics'; import { IUiSettingsClient, SavedObjectsStart } from 'kibana/public'; -import { VisType } from '../../legacy_imports'; -import { VisualizeConstants } from '../visualize_constants'; import { SearchSelection } from './search_selection'; import { TypeSelection } from './type_selection'; -import { - TypesStart, - VisTypeAlias, -} from '../../../../../visualizations/public/np_ready/public/types'; +import { TypesStart, VisType, VisTypeAlias } from '../types'; import { UsageCollectionSetup } from '../../../../../../../plugins/usage_collection/public'; interface TypeSelectionProps { @@ -50,7 +45,9 @@ interface TypeSelectionState { visType?: VisType; } -const baseUrl = `#${VisualizeConstants.CREATE_PATH}?`; +// TODO: redirect logic is specific to visualise & dashboard +// but it is likely should be decoupled. e.g. handled by the container instead +const baseUrl = `#/visualize/create?`; class NewVisModal extends React.Component { public static defaultProps = { @@ -82,7 +79,7 @@ class NewVisModal extends React.Component void; @@ -42,13 +42,13 @@ export class SearchSelection extends React.Component { {' '} /{' '} @@ -59,7 +59,7 @@ export class SearchSelection extends React.Component { onChoose={this.props.onSearchSelected} showFilter noItemsMessage={i18n.translate( - 'kbn.visualize.newVisWizard.searchSelection.notFoundLabel', + 'visualizations.newVisWizard.searchSelection.notFoundLabel', { defaultMessage: 'No matching indices or saved searches found.', } @@ -69,7 +69,7 @@ export class SearchSelection extends React.Component { type: 'search', getIconForSavedObject: () => 'search', name: i18n.translate( - 'kbn.visualize.newVisWizard.searchSelection.savedObjectType.search', + 'visualizations.newVisWizard.searchSelection.savedObjectType.search', { defaultMessage: 'Saved search', } @@ -79,7 +79,7 @@ export class SearchSelection extends React.Component { type: 'index-pattern', getIconForSavedObject: () => 'indexPatternApp', name: i18n.translate( - 'kbn.visualize.newVisWizard.searchSelection.savedObjectType.indexPattern', + 'visualizations.newVisWizard.searchSelection.savedObjectType.indexPattern', { defaultMessage: 'Index pattern', } diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/show_new_vis.tsx b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/show_new_vis.tsx similarity index 63% rename from src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/show_new_vis.tsx rename to src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/show_new_vis.tsx index 567b7e861ad8e..8ca846ee39499 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/show_new_vis.tsx +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/show_new_vis.tsx @@ -21,27 +21,22 @@ import React from 'react'; import ReactDOM from 'react-dom'; import { I18nProvider } from '@kbn/i18n/react'; -import { IUiSettingsClient, SavedObjectsStart } from 'kibana/public'; import { NewVisModal } from './new_vis_modal'; -import { TypesStart } from '../../../../../visualizations/public/np_ready/public/types'; -import { UsageCollectionSetup } from '../../../../../../../plugins/usage_collection/public'; +import { getHttp, getSavedObjects, getTypes, getUISettings, getUsageCollector } from '../services'; -interface ShowNewVisModalParams { +export interface ShowNewVisModalParams { editorParams?: string[]; + onClose?: () => void; } -export function showNewVisModal( - visTypeRegistry: TypesStart, - { editorParams = [] }: ShowNewVisModalParams = {}, - addBasePath: (path: string) => string, - uiSettings: IUiSettingsClient, - savedObjects: SavedObjectsStart, - usageCollection?: UsageCollectionSetup -) { +export function showNewVisModal({ editorParams = [], onClose }: ShowNewVisModalParams = {}) { const container = document.createElement('div'); - const onClose = () => { + const handleClose = () => { ReactDOM.unmountComponentAtNode(container); document.body.removeChild(container); + if (onClose) { + onClose(); + } }; document.body.appendChild(container); @@ -49,13 +44,13 @@ export function showNewVisModal( ); diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/type_selection/index.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/type_selection/index.ts similarity index 100% rename from src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/type_selection/index.ts rename to src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/type_selection/index.ts diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/type_selection/new_vis_help.test.tsx b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/type_selection/new_vis_help.test.tsx similarity index 97% rename from src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/type_selection/new_vis_help.test.tsx rename to src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/type_selection/new_vis_help.test.tsx index a33a82c252fb3..138251beb9593 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/type_selection/new_vis_help.test.tsx +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/type_selection/new_vis_help.test.tsx @@ -49,7 +49,7 @@ describe('NewVisHelp', () => {

diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/type_selection/new_vis_help.tsx b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/type_selection/new_vis_help.tsx similarity index 93% rename from src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/type_selection/new_vis_help.tsx rename to src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/type_selection/new_vis_help.tsx index 2f7effb7a33c8..5068f43952c4e 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/type_selection/new_vis_help.tsx +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/type_selection/new_vis_help.tsx @@ -21,7 +21,7 @@ import { FormattedMessage } from '@kbn/i18n/react'; import React, { Fragment } from 'react'; import { EuiText, EuiButton } from '@elastic/eui'; import { VisTypeAliasListEntry } from './type_selection'; -import { VisTypeAlias } from '../../../../../../visualizations/public'; +import { VisTypeAlias } from '../../types'; interface Props { promotedTypes: VisTypeAliasListEntry[]; @@ -33,7 +33,7 @@ export function NewVisHelp(props: Props) {

diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/type_selection/type_selection.tsx b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/type_selection/type_selection.tsx similarity index 90% rename from src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/type_selection/type_selection.tsx rename to src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/type_selection/type_selection.tsx index 44da7cc8f2c45..574f5b3cccc99 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/np_ready/wizard/type_selection/type_selection.tsx +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/wizard/type_selection/type_selection.tsx @@ -34,13 +34,13 @@ import { EuiSpacer, EuiTitle, } from '@elastic/eui'; -import { VisType } from '../../../legacy_imports'; + import { memoizeLast } from '../../../../../../visualizations/public/np_ready/public/legacy/memoize'; import { VisTypeAlias } from '../../../../../../visualizations/public'; import { NewVisHelp } from './new_vis_help'; import { VisHelpText } from './vis_help_text'; import { VisTypeIcon } from './vis_type_icon'; -import { TypesStart } from '../../../../../../visualizations/public/np_ready/public/types'; +import { VisType, TypesStart } from '../../types'; export interface VisTypeListEntry extends VisType { highlighted: boolean; @@ -85,7 +85,7 @@ class TypeSelection extends React.Component @@ -107,7 +107,7 @@ class TypeSelection extends React.Component {query && (

@@ -207,26 +207,26 @@ class TypeSelection extends React.Component