diff --git a/src/legacy/core_plugins/kibana/public/visualize/listing/visualize_listing.js b/src/legacy/core_plugins/kibana/public/visualize/listing/visualize_listing.js index d221dcfc5ecaf..4da6ed16a144c 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/listing/visualize_listing.js +++ b/src/legacy/core_plugins/kibana/public/visualize/listing/visualize_listing.js @@ -30,11 +30,13 @@ import { SavedObjectsClientProvider } from 'ui/saved_objects'; import { VisualizeListingTable } from './visualize_listing_table'; import { NewVisModal } from '../wizard/new_vis_modal'; import { VisualizeConstants } from '../visualize_constants'; -import { visualizations } from 'plugins/visualizations'; +import { setup } from '../../../../visualizations/public/np_ready/public/legacy'; import { i18n } from '@kbn/i18n'; const app = uiModules.get('app/visualize', ['ngRoute', 'react']); -app.directive('visualizeListingTable', reactDirective => reactDirective(wrapInI18nContext(VisualizeListingTable))); +app.directive('visualizeListingTable', reactDirective => + reactDirective(wrapInI18nContext(VisualizeListingTable)) +); app.directive('newVisModal', reactDirective => reactDirective(wrapInI18nContext(NewVisModal))); export function VisualizeListingController($injector, createNewVis) { @@ -44,7 +46,7 @@ export function VisualizeListingController($injector, createNewVis) { const savedObjectClient = Private(SavedObjectsClientProvider); this.visTypeRegistry = Private(VisTypesRegistryProvider); - this.visTypeAliases = visualizations.types.visTypeAliasRegistry.get(); + this.visTypeAliases = setup.types.visTypeAliasRegistry.get(); timefilter.disableAutoRefreshSelector(); timefilter.disableTimeRangeSelector(); @@ -81,15 +83,16 @@ export function VisualizeListingController($injector, createNewVis) { const services = Private(SavedObjectRegistryProvider).byLoaderPropertiesName; const visualizationService = services.visualizations; - this.fetchItems = (filter) => { + this.fetchItems = filter => { const isLabsEnabled = config.get('visualize:enableLabs'); - return visualizationService.findListItems(filter, config.get('savedObjects:listingLimit')) + return visualizationService + .findListItems(filter, config.get('savedObjects:listingLimit')) .then(result => { this.totalItems = result.total; return { total: result.total, - hits: result.hits.filter(result => (isLabsEnabled || result.type.stage !== 'experimental')) + hits: result.hits.filter(result => isLabsEnabled || result.type.stage !== 'experimental'), }; }); }; @@ -98,23 +101,27 @@ export function VisualizeListingController($injector, createNewVis) { return Promise.all( selectedItems.map(item => { return savedObjectClient.delete(item.savedObjectType, item.id); - }), - ).then(() => { - chrome.untrackNavLinksForDeletedSavedObjects(selectedItems.map(item => item.id)); - }).catch(error => { - toastNotifications.addError(error, { - title: i18n.translate('kbn.visualize.visualizeListingDeleteErrorTitle', { - defaultMessage: 'Error deleting visualization', - }), + }) + ) + .then(() => { + chrome.untrackNavLinksForDeletedSavedObjects(selectedItems.map(item => item.id)); + }) + .catch(error => { + toastNotifications.addError(error, { + title: i18n.translate('kbn.visualize.visualizeListingDeleteErrorTitle', { + defaultMessage: 'Error deleting visualization', + }), + }); }); - }); }; - chrome.breadcrumbs.set([{ - text: i18n.translate('kbn.visualize.visualizeListingBreadcrumbsTitle', { - defaultMessage: 'Visualize', - }) - }]); + chrome.breadcrumbs.set([ + { + text: i18n.translate('kbn.visualize.visualizeListingBreadcrumbsTitle', { + defaultMessage: 'Visualize', + }), + }, + ]); this.listingLimit = config.get('savedObjects:listingLimit'); diff --git a/src/legacy/core_plugins/kibana/public/visualize/saved_visualizations/saved_visualizations.js b/src/legacy/core_plugins/kibana/public/visualize/saved_visualizations/saved_visualizations.js index cfe5eeec3834f..5f0a2be54e095 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/saved_visualizations/saved_visualizations.js +++ b/src/legacy/core_plugins/kibana/public/visualize/saved_visualizations/saved_visualizations.js @@ -22,7 +22,7 @@ import { VisTypesRegistryProvider } from 'ui/registry/vis_types'; import { uiModules } from 'ui/modules'; import { SavedObjectLoader, SavedObjectsClientProvider } from 'ui/saved_objects'; import { savedObjectManagementRegistry } from '../../management/saved_object_registry'; -import { visualizations } from 'plugins/visualizations'; +import { setup } from '../../../../visualizations/public/np_ready/public/legacy'; import { createVisualizeEditUrl } from '../visualize_constants'; import { findListItems } from './find_list_items'; @@ -32,13 +32,18 @@ const app = uiModules.get('app/visualize'); // edited by the object editor. savedObjectManagementRegistry.register({ service: 'savedVisualizations', - title: 'visualizations' + title: 'visualizations', }); app.service('savedVisualizations', function (SavedVis, Private, kbnUrl, chrome) { const visTypes = Private(VisTypesRegistryProvider); const savedObjectClient = Private(SavedObjectsClientProvider); - const saveVisualizationLoader = new SavedObjectLoader(SavedVis, kbnUrl, chrome, savedObjectClient); + const saveVisualizationLoader = new SavedObjectLoader( + SavedVis, + kbnUrl, + chrome, + savedObjectClient + ); saveVisualizationLoader.mapHitSource = function (source, id) { source.id = id; @@ -46,8 +51,11 @@ app.service('savedVisualizations', function (SavedVis, Private, kbnUrl, chrome) let typeName = source.typeName; if (source.visState) { - try { typeName = JSON.parse(source.visState).type; } - catch (e) { /* missing typename handled below */ } // eslint-disable-line no-empty + try { + typeName = JSON.parse(source.visState).type; + } catch (e) { + /* missing typename handled below */ + } // eslint-disable-line no-empty } if (!typeName || !visTypes.byName[typeName]) { @@ -78,7 +86,7 @@ app.service('savedVisualizations', function (SavedVis, Private, kbnUrl, chrome) size, mapSavedObjectApiHits: this.mapSavedObjectApiHits.bind(this), savedObjectsClient: this.savedObjectsClient, - visTypes: visualizations.types.visTypeAliasRegistry.get(), + visTypes: setup.types.visTypeAliasRegistry.get(), }); }; diff --git a/src/legacy/core_plugins/kibana/public/visualize/wizard/new_vis_modal.tsx b/src/legacy/core_plugins/kibana/public/visualize/wizard/new_vis_modal.tsx index 4039bf3dff7a5..f7bb0a8f45731 100644 --- a/src/legacy/core_plugins/kibana/public/visualize/wizard/new_vis_modal.tsx +++ b/src/legacy/core_plugins/kibana/public/visualize/wizard/new_vis_modal.tsx @@ -24,7 +24,7 @@ import { i18n } from '@kbn/i18n'; import chrome from 'ui/chrome'; import { VisType } from 'ui/vis'; -import { VisTypeAlias } from 'plugins/visualizations'; +import { VisTypeAlias } from '../../../../visualizations/public/np_ready/public'; import { VisualizeConstants } from '../visualize_constants'; import { SearchSelection } from './search_selection'; 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 f2eb273af8f04..76fc84921627a 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 @@ -37,7 +37,7 @@ import { } from '@elastic/eui'; import { memoizeLast } from 'ui/utils/memoize'; import { VisType } from 'ui/vis'; -import { VisTypeAlias } from 'plugins/visualizations'; +import { VisTypeAlias } from '../../../../../visualizations/public/np_ready/public'; import { NewVisHelp } from './new_vis_help'; import { VisHelpText } from './vis_help_text'; import { VisTypeIcon } from './vis_type_icon'; diff --git a/src/legacy/core_plugins/metrics/public/legacy.ts b/src/legacy/core_plugins/metrics/public/legacy.ts index 49420e4b51273..8dc24503772db 100644 --- a/src/legacy/core_plugins/metrics/public/legacy.ts +++ b/src/legacy/core_plugins/metrics/public/legacy.ts @@ -20,12 +20,12 @@ import { PluginInitializerContext } from 'kibana/public'; import { npSetup, npStart } from 'ui/new_platform'; -import { visualizations } from '../../visualizations/public'; +import { setup as setupVisualizations } from '../../visualizations/public/np_ready/public/legacy'; import { MetricsPluginSetupDependencies } from './plugin'; import { plugin } from '.'; const plugins: Readonly = { - visualizations, + visualizations: setupVisualizations, data: npSetup.plugins.data, }; diff --git a/src/legacy/core_plugins/metrics/public/metrics_type.ts b/src/legacy/core_plugins/metrics/public/metrics_type.ts index 35182fbe25265..00f54a90b3b0f 100644 --- a/src/legacy/core_plugins/metrics/public/metrics_type.ts +++ b/src/legacy/core_plugins/metrics/public/metrics_type.ts @@ -22,7 +22,7 @@ import { i18n } from '@kbn/i18n'; // @ts-ignore import { defaultFeedbackMessage } from 'ui/vis/default_feedback_message'; -import { visFactory } from '../../visualizations/public'; +import { visFactory } from '../../visualizations/public/np_ready/public'; // @ts-ignore import { createMetricsRequestHandler } from './request_handler'; diff --git a/src/legacy/core_plugins/metrics/public/plugin.ts b/src/legacy/core_plugins/metrics/public/plugin.ts index e1eca37970604..5c103a3ae4b08 100644 --- a/src/legacy/core_plugins/metrics/public/plugin.ts +++ b/src/legacy/core_plugins/metrics/public/plugin.ts @@ -18,7 +18,7 @@ */ import { PluginInitializerContext, CoreSetup, CoreStart, Plugin } from '../../../../core/public'; import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public'; -import { VisualizationsSetup } from '../../visualizations/public'; +import { VisualizationsSetup } from '../../visualizations/public/np_ready/public'; import { createMetricsFn } from './metrics_fn'; import { createMetricsTypeDefinition } from './metrics_type'; @@ -39,7 +39,7 @@ export class MetricsPlugin implements Plugin, void> { public async setup(core: CoreSetup, { data, visualizations }: MetricsPluginSetupDependencies) { data.expressions.registerFunction(createMetricsFn); - visualizations.types.VisTypesRegistryProvider.register(createMetricsTypeDefinition); + visualizations.types.registerVisualization(createMetricsTypeDefinition); } public start(core: CoreStart) { diff --git a/src/legacy/core_plugins/region_map/public/__tests__/region_map_visualization.js b/src/legacy/core_plugins/region_map/public/__tests__/region_map_visualization.js index a5c2296bd8b99..b0b40f8ff704e 100644 --- a/src/legacy/core_plugins/region_map/public/__tests__/region_map_visualization.js +++ b/src/legacy/core_plugins/region_map/public/__tests__/region_map_visualization.js @@ -39,7 +39,7 @@ import afterdatachangePng from './afterdatachange.png'; import afterdatachangeandresizePng from './afterdatachangeandresize.png'; import aftercolorchangePng from './aftercolorchange.png'; import changestartupPng from './changestartup.png'; -import { visualizations } from '../../../visualizations/public'; +import { setup } from '../../../visualizations/public/np_ready/public/legacy'; import { createRegionMapVisualization } from '../region_map_visualization'; import { createRegionMapTypeDefinition } from '../region_map_type'; @@ -48,7 +48,6 @@ const THRESHOLD = 0.45; const PIXEL_DIFF = 96; describe('RegionMapsVisualizationTests', function () { - let domNode; let RegionMapsVisualization; let Vis; @@ -61,83 +60,87 @@ describe('RegionMapsVisualizationTests', function () { const _makeJsonAjaxCallOld = ChoroplethLayer.prototype._makeJsonAjaxCall; const dummyTableGroup = { - columns: [{ - 'id': 'col-0', - 'aggConfig': { - 'id': '2', - 'enabled': true, - 'type': 'terms', - 'schema': 'segment', - 'params': { 'field': 'geo.dest', 'size': 5, 'order': 'desc', 'orderBy': '1' } - }, 'title': 'geo.dest: Descending' - }, { - 'id': 'col-1', - 'aggConfig': { 'id': '1', 'enabled': true, 'type': 'count', 'schema': 'metric', 'params': {} }, - 'title': 'Count' - }], + columns: [ + { + id: 'col-0', + aggConfig: { + id: '2', + enabled: true, + type: 'terms', + schema: 'segment', + params: { field: 'geo.dest', size: 5, order: 'desc', orderBy: '1' }, + }, + title: 'geo.dest: Descending', + }, + { + id: 'col-1', + aggConfig: { id: '1', enabled: true, type: 'count', schema: 'metric', params: {} }, + title: 'Count', + }, + ], rows: [ { 'col-0': 'CN', 'col-1': 26 }, { 'col-0': 'IN', 'col-1': 17 }, { 'col-0': 'US', 'col-1': 6 }, { 'col-0': 'DE', 'col-1': 4 }, - { 'col-0': 'BR', 'col-1': 3 } - ] + { 'col-0': 'BR', 'col-1': 3 }, + ], }; beforeEach(ngMock.module('kibana')); let getManifestStub; - beforeEach(ngMock.inject((Private, $injector) => { - const serviceSettings = $injector.get('serviceSettings'); - const uiSettings = $injector.get('config'); - const regionmapsConfig = { - includeElasticMapsService: true, - layers: [] - }; - - dependencies = { - serviceSettings, - $injector, - regionmapsConfig, - uiSettings - }; - - visualizations.types.VisTypesRegistryProvider.register(() => - createRegionMapTypeDefinition(dependencies) - ); - - Vis = Private(visModule.VisProvider); - RegionMapsVisualization = createRegionMapVisualization(dependencies); - indexPattern = Private(LogstashIndexPatternStubProvider); - - ChoroplethLayer.prototype._makeJsonAjaxCall = async function () { - //simulate network call - return new Promise((resolve)=> { - setTimeout(() => { - resolve(worldJson); - }, 10); - }); - }; - - getManifestStub = serviceSettings.__debugStubManifestCalls(async (url) => { - //simulate network calls - if (url.startsWith('https://foobar')) { - return EMS_CATALOGUE; - } else if (url.startsWith('https://tiles.foobar')) { - return EMS_TILES; - } else if (url.startsWith('https://files.foobar')) { - return EMS_FILES; - } else if (url.startsWith('https://raster-style.foobar')) { - if (url.includes('osm-bright-desaturated')) { - return EMS_STYLE_ROAD_MAP_DESATURATED; - } else if (url.includes('osm-bright')) { - return EMS_STYLE_ROAD_MAP_BRIGHT; - } else if (url.includes('dark-matter')) { - return EMS_STYLE_DARK_MAP; + beforeEach( + ngMock.inject((Private, $injector) => { + const serviceSettings = $injector.get('serviceSettings'); + const uiSettings = $injector.get('config'); + const regionmapsConfig = { + includeElasticMapsService: true, + layers: [], + }; + + dependencies = { + serviceSettings, + $injector, + regionmapsConfig, + uiSettings, + }; + + setup.types.registerVisualization(() => createRegionMapTypeDefinition(dependencies)); + + Vis = Private(visModule.VisProvider); + RegionMapsVisualization = createRegionMapVisualization(dependencies); + indexPattern = Private(LogstashIndexPatternStubProvider); + + ChoroplethLayer.prototype._makeJsonAjaxCall = async function () { + //simulate network call + return new Promise(resolve => { + setTimeout(() => { + resolve(worldJson); + }, 10); + }); + }; + + getManifestStub = serviceSettings.__debugStubManifestCalls(async url => { + //simulate network calls + if (url.startsWith('https://foobar')) { + return EMS_CATALOGUE; + } else if (url.startsWith('https://tiles.foobar')) { + return EMS_TILES; + } else if (url.startsWith('https://files.foobar')) { + return EMS_FILES; + } else if (url.startsWith('https://raster-style.foobar')) { + if (url.includes('osm-bright-desaturated')) { + return EMS_STYLE_ROAD_MAP_DESATURATED; + } else if (url.includes('osm-bright')) { + return EMS_STYLE_ROAD_MAP_BRIGHT; + } else if (url.includes('dark-matter')) { + return EMS_STYLE_DARK_MAP; + } } - } - }); - })); + }); + }) + ); afterEach(function () { ChoroplethLayer.prototype._makeJsonAjaxCall = _makeJsonAjaxCallOld; @@ -145,15 +148,13 @@ describe('RegionMapsVisualizationTests', function () { }); describe('RegionMapVisualization - basics', function () { - beforeEach(async function () { setupDOM('512px', '512px'); imageComparator = new ImageComparator(); - vis = new Vis(indexPattern, { - type: 'region_map' + type: 'region_map', }); vis.params.bucket = { @@ -163,19 +164,25 @@ describe('RegionMapsVisualizationTests', function () { accessor: 1, }; - vis.params.selectedJoinField = { 'name': 'iso2', 'description': 'Two letter abbreviation' }; + vis.params.selectedJoinField = { name: 'iso2', description: 'Two letter abbreviation' }; vis.params.selectedLayer = { - 'attribution': '

Made with NaturalEarth | Elastic Maps Service

', - 'name': 'World Countries', - 'format': 'geojson', - 'url': 'https://vector-staging.maps.elastic.co/blob/5715999101812736?elastic_tile_service_tos=agree&my_app_version=7.0.0-alpha1', - 'fields': [{ 'name': 'iso2', 'description': 'Two letter abbreviation' }, { - 'name': 'iso3', - 'description': 'Three letter abbreviation' - }, { 'name': 'name', 'description': 'Country name' }], - 'created_at': '2017-07-31T16:00:19.996450', - 'id': 5715999101812736, - 'layerId': 'elastic_maps_service.World Countries' + attribution: + '

Made with NaturalEarth | Elastic Maps Service

', + name: 'World Countries', + format: 'geojson', + url: + 'https://vector-staging.maps.elastic.co/blob/5715999101812736?elastic_tile_service_tos=agree&my_app_version=7.0.0-alpha1', + fields: [ + { name: 'iso2', description: 'Two letter abbreviation' }, + { + name: 'iso3', + description: 'Three letter abbreviation', + }, + { name: 'name', description: 'Country name' }, + ], + created_at: '2017-07-31T16:00:19.996450', + id: 5715999101812736, + layerId: 'elastic_maps_service.World Countries', }; }); @@ -184,7 +191,6 @@ describe('RegionMapsVisualizationTests', function () { imageComparator.destroy(); }); - it('should instantiate at zoom level 2', async function () { const regionMapsVisualization = new RegionMapsVisualization(domNode, vis); await regionMapsVisualization.render(dummyTableGroup, vis.params, { @@ -192,7 +198,7 @@ describe('RegionMapsVisualizationTests', function () { params: true, aggs: true, data: true, - uiState: false + uiState: false, }); const mismatchedPixels = await compareImage(initialPng); regionMapsVisualization.destroy(); @@ -206,35 +212,33 @@ describe('RegionMapsVisualizationTests', function () { params: true, aggs: true, data: true, - uiState: false + uiState: false, }); //this will actually create an empty image - vis.params.selectedJoinField = { 'name': 'iso3', 'description': 'Three letter abbreviation' }; - vis.params.isDisplayWarning = false;//so we don't get notifications + vis.params.selectedJoinField = { name: 'iso3', description: 'Three letter abbreviation' }; + vis.params.isDisplayWarning = false; //so we don't get notifications await regionMapsVisualization.render(dummyTableGroup, vis.params, { resize: false, params: true, aggs: false, data: false, - uiState: false + uiState: false, }); const mismatchedPixels = await compareImage(toiso3Png); regionMapsVisualization.destroy(); expect(mismatchedPixels).to.be.lessThan(PIXEL_DIFF); - }); it('should resize', async function () { - const regionMapsVisualization = new RegionMapsVisualization(domNode, vis); await regionMapsVisualization.render(dummyTableGroup, vis.params, { resize: false, params: true, aggs: true, data: true, - uiState: false + uiState: false, }); domNode.style.width = '256px'; @@ -244,7 +248,7 @@ describe('RegionMapsVisualizationTests', function () { params: false, aggs: false, data: false, - uiState: false + uiState: false, }); const mismatchedPixelsAfterFirstResize = await compareImage(afterresizePng); @@ -255,7 +259,7 @@ describe('RegionMapsVisualizationTests', function () { params: false, aggs: false, data: false, - uiState: false + uiState: false, }); const mismatchedPixelsAfterSecondResize = await compareImage(initialPng); @@ -265,32 +269,31 @@ describe('RegionMapsVisualizationTests', function () { }); it('should redo data', async function () { - const regionMapsVisualization = new RegionMapsVisualization(domNode, vis); await regionMapsVisualization.render(dummyTableGroup, vis.params, { resize: false, params: true, aggs: true, data: true, - uiState: false + uiState: false, }); const newTableGroup = _.cloneDeep(dummyTableGroup); - newTableGroup.rows.pop();//remove one shape + newTableGroup.rows.pop(); //remove one shape await regionMapsVisualization.render(newTableGroup, vis.params, { resize: false, params: false, aggs: false, data: true, - uiState: false + uiState: false, }); const mismatchedPixelsAfterDataChange = await compareImage(afterdatachangePng); const anotherTableGroup = _.cloneDeep(newTableGroup); - anotherTableGroup.rows.pop();//remove one shape + anotherTableGroup.rows.pop(); //remove one shape domNode.style.width = '412px'; domNode.style.height = '112px'; await regionMapsVisualization.render(anotherTableGroup, vis.params, { @@ -298,9 +301,11 @@ describe('RegionMapsVisualizationTests', function () { params: false, aggs: false, data: true, - uiState: false + uiState: false, }); - const mismatchedPixelsAfterDataChangeAndResize = await compareImage(afterdatachangeandresizePng); + const mismatchedPixelsAfterDataChangeAndResize = await compareImage( + afterdatachangeandresizePng + ); regionMapsVisualization.destroy(); expect(mismatchedPixelsAfterDataChange).to.be.lessThan(PIXEL_DIFF); @@ -314,18 +319,18 @@ describe('RegionMapsVisualizationTests', function () { params: true, aggs: true, data: true, - uiState: false + uiState: false, }); const newTableGroup = _.cloneDeep(dummyTableGroup); - newTableGroup.rows.pop();//remove one shape + newTableGroup.rows.pop(); //remove one shape vis.params.colorSchema = 'Blues'; await regionMapsVisualization.render(newTableGroup, vis.params, { resize: false, params: true, aggs: false, data: true, - uiState: false + uiState: false, }); const mismatchedPixelsAfterDataAndColorChange = await compareImage(aftercolorchangePng); @@ -342,7 +347,7 @@ describe('RegionMapsVisualizationTests', function () { params: true, aggs: true, data: true, - uiState: false + uiState: false, }); const mismatchedPixels = await compareImage(changestartupPng); @@ -350,7 +355,6 @@ describe('RegionMapsVisualizationTests', function () { expect(mismatchedPixels).to.be.lessThan(PIXEL_DIFF); }); - }); async function compareImage(expectedImageSource) { diff --git a/src/legacy/core_plugins/region_map/public/legacy.ts b/src/legacy/core_plugins/region_map/public/legacy.ts index 5e01e7ee56e2f..7adbc2117d7ee 100644 --- a/src/legacy/core_plugins/region_map/public/legacy.ts +++ b/src/legacy/core_plugins/region_map/public/legacy.ts @@ -20,7 +20,7 @@ import { PluginInitializerContext } from 'kibana/public'; import { npSetup, npStart } from 'ui/new_platform'; -import { visualizations } from '../../visualizations/public'; +import { setup as setupVisualizations } from '../../visualizations/public/np_ready/public/legacy'; import { RegionMapPluginSetupDependencies, RegionMapsConfig } from './plugin'; import { LegacyDependenciesPlugin } from './shim'; import { plugin } from '.'; @@ -30,7 +30,7 @@ const regionmapsConfig = npSetup.core.injectedMetadata.getInjectedVar( ) as RegionMapsConfig; const plugins: Readonly = { - visualizations, + visualizations: setupVisualizations, data: npSetup.plugins.data, // Temporary solution diff --git a/src/legacy/core_plugins/region_map/public/plugin.ts b/src/legacy/core_plugins/region_map/public/plugin.ts index 995a96b7a19c7..4afee7269c578 100644 --- a/src/legacy/core_plugins/region_map/public/plugin.ts +++ b/src/legacy/core_plugins/region_map/public/plugin.ts @@ -24,7 +24,7 @@ import { UiSettingsClientContract, } from '../../../../core/public'; import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public'; -import { VisualizationsSetup } from '../../visualizations/public'; +import { VisualizationsSetup } from '../../visualizations/public/np_ready/public'; import { LegacyDependenciesPlugin, LegacyDependenciesPluginSetup } from './shim'; @@ -70,7 +70,7 @@ export class RegionMapPlugin implements Plugin, void> { data.expressions.registerFunction(createRegionMapFn); - visualizations.types.VisTypesRegistryProvider.register(() => + visualizations.types.registerVisualization(() => createRegionMapTypeDefinition(visualizationDependencies) ); } diff --git a/src/legacy/core_plugins/region_map/public/region_map_type.js b/src/legacy/core_plugins/region_map/public/region_map_type.js index 10aaeb1060bc0..9b28aa96eccbc 100644 --- a/src/legacy/core_plugins/region_map/public/region_map_type.js +++ b/src/legacy/core_plugins/region_map/public/region_map_type.js @@ -25,7 +25,7 @@ import { createRegionMapVisualization } from './region_map_visualization'; import { Status } from 'ui/vis/update_status'; import { RegionMapOptions } from './components/region_map_options'; -import { visFactory } from '../../visualizations/public'; +import { visFactory } from '../../visualizations/public/np_ready/public'; // TODO: reference to TILE_MAP plugin should be removed import { ORIGIN } from '../../tile_map/common/origin'; @@ -40,8 +40,11 @@ export function createRegionMapTypeDefinition(dependencies) { return visFactory.createBaseVisualization({ name: 'region_map', title: i18n.translate('regionMap.mapVis.regionMapTitle', { defaultMessage: 'Region Map' }), - description: i18n.translate('regionMap.mapVis.regionMapDescription', { defaultMessage: 'Show metrics on a thematic map. Use one of the \ -provided base maps, or add your own. Darker colors represent higher values.' }), + description: i18n.translate('regionMap.mapVis.regionMapDescription', { + defaultMessage: + 'Show metrics on a thematic map. Use one of the \ +provided base maps, or add your own. Darker colors represent higher values.', + }), icon: 'visMapRegion', visConfig: { defaults: { @@ -56,45 +59,59 @@ provided base maps, or add your own. Darker colors represent higher values.' }), mapZoom: 2, mapCenter: [0, 0], outlineWeight: 1, - showAllShapes: true//still under consideration - } + showAllShapes: true, //still under consideration + }, }, requiresUpdateStatus: [Status.AGGS, Status.PARAMS, Status.RESIZE, Status.DATA, Status.UI_STATE], visualization, editorConfig: { - optionsTemplate: (props) => - ( ( + ), + /> + ), collections: { colorSchemas, vectorLayers, - tmsLayers: [] + tmsLayers: [], }, schemas: new Schemas([ { group: 'metrics', name: 'metric', - title: i18n.translate('regionMap.mapVis.regionMapEditorConfig.schemas.metricTitle', { defaultMessage: 'Value' }), + title: i18n.translate('regionMap.mapVis.regionMapEditorConfig.schemas.metricTitle', { + defaultMessage: 'Value', + }), min: 1, max: 1, - aggFilter: ['count', 'avg', 'sum', 'min', 'max', 'cardinality', 'top_hits', - 'sum_bucket', 'min_bucket', 'max_bucket', 'avg_bucket'], - defaults: [ - { schema: 'metric', type: 'count' } - ] + aggFilter: [ + 'count', + 'avg', + 'sum', + 'min', + 'max', + 'cardinality', + 'top_hits', + 'sum_bucket', + 'min_bucket', + 'max_bucket', + 'avg_bucket', + ], + defaults: [{ schema: 'metric', type: 'count' }], }, { group: 'buckets', name: 'segment', - title: i18n.translate('regionMap.mapVis.regionMapEditorConfig.schemas.segmentTitle', { defaultMessage: 'Shape field' }), + title: i18n.translate('regionMap.mapVis.regionMapEditorConfig.schemas.segmentTitle', { + defaultMessage: 'Shape field', + }), min: 1, max: 1, - aggFilter: ['terms'] - } - ]) - } + aggFilter: ['terms'], + }, + ]), + }, }); } diff --git a/src/legacy/core_plugins/tile_map/public/__tests__/coordinate_maps_visualization.js b/src/legacy/core_plugins/tile_map/public/__tests__/coordinate_maps_visualization.js index 6b3bdd6c8f993..e32df04a583c2 100644 --- a/src/legacy/core_plugins/tile_map/public/__tests__/coordinate_maps_visualization.js +++ b/src/legacy/core_plugins/tile_map/public/__tests__/coordinate_maps_visualization.js @@ -33,7 +33,7 @@ import EMS_TILES from '../../../../ui/public/vis/__tests__/map/ems_mocks/sample_ import EMS_STYLE_ROAD_MAP_BRIGHT from '../../../../ui/public/vis/__tests__/map/ems_mocks/sample_style_bright'; import EMS_STYLE_ROAD_MAP_DESATURATED from '../../../../ui/public/vis/__tests__/map/ems_mocks/sample_style_desaturated'; import EMS_STYLE_DARK_MAP from '../../../../ui/public/vis/__tests__/map/ems_mocks/sample_style_dark'; -import { visualizations } from '../../../visualizations/public'; +import { setup } from '../../../visualizations/public/np_ready/public/legacy'; import { createTileMapVisualization } from '../tile_map_visualization'; import { createTileMapTypeDefinition } from '../tile_map_type'; @@ -62,7 +62,6 @@ const THRESHOLD = 0.45; const PIXEL_DIFF = 64; describe('CoordinateMapsVisualizationTest', function () { - let domNode; let CoordinateMapsVisualization; let Vis; @@ -72,59 +71,57 @@ describe('CoordinateMapsVisualizationTest', function () { let imageComparator; - let getManifestStub; beforeEach(ngMock.module('kibana')); - beforeEach(ngMock.inject((Private, $injector) => { - const serviceSettings = $injector.get('serviceSettings'); - const uiSettings = $injector.get('config'); - - dependencies = { - serviceSettings, - uiSettings, - $injector - }; - - visualizations.types.VisTypesRegistryProvider.register(() => - createTileMapTypeDefinition(dependencies) - ); - - Vis = Private(visModule.VisProvider); - CoordinateMapsVisualization = createTileMapVisualization(dependencies); - indexPattern = Private(LogstashIndexPatternStubProvider); - - getManifestStub = serviceSettings.__debugStubManifestCalls(async (url) => { - //simulate network calls - if (url.startsWith('https://foobar')) { - return EMS_CATALOGUE; - } else if (url.startsWith('https://tiles.foobar')) { - return EMS_TILES; - } else if (url.startsWith('https://files.foobar')) { - return EMS_FILES; - } else if (url.startsWith('https://raster-style.foobar')) { - if (url.includes('osm-bright-desaturated')) { - return EMS_STYLE_ROAD_MAP_DESATURATED; - } else if (url.includes('osm-bright')) { - return EMS_STYLE_ROAD_MAP_BRIGHT; - } else if (url.includes('dark-matter')) { - return EMS_STYLE_DARK_MAP; + beforeEach( + ngMock.inject((Private, $injector) => { + const serviceSettings = $injector.get('serviceSettings'); + const uiSettings = $injector.get('config'); + + dependencies = { + serviceSettings, + uiSettings, + $injector, + }; + + setup.types.registerVisualization(() => createTileMapTypeDefinition(dependencies)); + + Vis = Private(visModule.VisProvider); + CoordinateMapsVisualization = createTileMapVisualization(dependencies); + indexPattern = Private(LogstashIndexPatternStubProvider); + + getManifestStub = serviceSettings.__debugStubManifestCalls(async url => { + //simulate network calls + if (url.startsWith('https://foobar')) { + return EMS_CATALOGUE; + } else if (url.startsWith('https://tiles.foobar')) { + return EMS_TILES; + } else if (url.startsWith('https://files.foobar')) { + return EMS_FILES; + } else if (url.startsWith('https://raster-style.foobar')) { + if (url.includes('osm-bright-desaturated')) { + return EMS_STYLE_ROAD_MAP_DESATURATED; + } else if (url.includes('osm-bright')) { + return EMS_STYLE_ROAD_MAP_BRIGHT; + } else if (url.includes('dark-matter')) { + return EMS_STYLE_DARK_MAP; + } } - } - }); - })); + }); + }) + ); afterEach(() => { getManifestStub.removeStub(); }); describe('CoordinateMapsVisualization - basics', function () { - beforeEach(async function () { setupDOM('512px', '512px'); imageComparator = new ImageComparator(); vis = new Vis(indexPattern, { - type: 'tile_map' + type: 'tile_map', }); vis.params = { mapType: 'Scaled Circle Markers', @@ -136,32 +133,33 @@ describe('CoordinateMapsVisualizationTest', function () { mapCenter: [0, 0], }; const mockAggs = { - byType: (type) => { + byType: type => { return mockAggs.aggs.find(agg => agg.type.type === type); }, aggs: [ { type: { - type: 'metrics' + type: 'metrics', }, - fieldFormatter: (x) => { + fieldFormatter: x => { return x; }, makeLabel: () => { return 'foobar'; - } - }, { + }, + }, + { type: { - type: 'buckets' + type: 'buckets', }, - params: { useGeoCentroid: true } - }] + params: { useGeoCentroid: true }, + }, + ], }; vis.getAggConfig = function () { return mockAggs; }; vis.aggs = mockAggs; - }); afterEach(function () { @@ -176,7 +174,7 @@ describe('CoordinateMapsVisualizationTest', function () { params: true, aggs: true, data: true, - uiState: false + uiState: false, }); const mismatchedPixels = await compareImage(initial, 0); @@ -184,43 +182,38 @@ describe('CoordinateMapsVisualizationTest', function () { expect(mismatchedPixels).to.be.lessThan(PIXEL_DIFF); }); - it('should toggle to Heatmap OK', async function () { - const coordinateMapVisualization = new CoordinateMapsVisualization(domNode, vis); await coordinateMapVisualization.render(dummyESResponse, vis.params, { resize: false, params: true, aggs: true, data: true, - uiState: false + uiState: false, }); - vis.params.mapType = 'Heatmap'; await coordinateMapVisualization.render(dummyESResponse, vis.params, { resize: false, params: true, aggs: false, data: false, - uiState: false + uiState: false, }); const mismatchedPixels = await compareImage(heatmapRaw, 1); coordinateMapVisualization.destroy(); expect(mismatchedPixels).to.be.lessThan(PIXEL_DIFF); - }); it('should toggle back&forth OK between mapTypes', async function () { - const coordinateMapVisualization = new CoordinateMapsVisualization(domNode, vis); await coordinateMapVisualization.render(dummyESResponse, vis.params, { resize: false, params: true, aggs: true, data: true, - uiState: false + uiState: false, }); vis.params.mapType = 'Heatmap'; @@ -229,7 +222,7 @@ describe('CoordinateMapsVisualizationTest', function () { params: true, aggs: false, data: false, - uiState: false + uiState: false, }); vis.params.mapType = 'Scaled Circle Markers'; @@ -238,54 +231,48 @@ describe('CoordinateMapsVisualizationTest', function () { params: true, aggs: false, data: false, - uiState: false + uiState: false, }); const mismatchedPixels = await compareImage(initial, 0); coordinateMapVisualization.destroy(); expect(mismatchedPixels).to.be.lessThan(PIXEL_DIFF); - }); it('should toggle to different color schema ok', async function () { - const coordinateMapVisualization = new CoordinateMapsVisualization(domNode, vis); await coordinateMapVisualization.render(dummyESResponse, vis.params, { resize: false, params: true, aggs: true, data: true, - uiState: false + uiState: false, }); - vis.params.colorSchema = 'Blues'; await coordinateMapVisualization.render(dummyESResponse, vis.params, { resize: false, params: true, aggs: false, data: false, - uiState: false + uiState: false, }); const mismatchedPixels = await compareImage(blues, 0); coordinateMapVisualization.destroy(); expect(mismatchedPixels).to.be.lessThan(PIXEL_DIFF); - }); it('should toggle to different color schema and maptypes ok', async function () { - const coordinateMapVisualization = new CoordinateMapsVisualization(domNode, vis); await coordinateMapVisualization.render(dummyESResponse, vis.params, { resize: false, params: true, aggs: true, data: true, - uiState: false + uiState: false, }); - vis.params.colorSchema = 'Greens'; vis.params.mapType = 'Shaded Geohash Grid'; await coordinateMapVisualization.render(dummyESResponse, vis.params, { @@ -293,26 +280,21 @@ describe('CoordinateMapsVisualizationTest', function () { params: true, aggs: false, data: false, - uiState: false + uiState: false, }); const mismatchedPixels = await compareImage(shadedGeohashGrid, 0); coordinateMapVisualization.destroy(); expect(mismatchedPixels).to.be.lessThan(PIXEL_DIFF); - }); - - }); - async function compareImage(expectedImageSource, index) { const elementList = domNode.querySelectorAll('canvas'); const firstCanvasOnMap = elementList[index]; return imageComparator.compareImage(firstCanvasOnMap, expectedImageSource, THRESHOLD); } - function setupDOM(width, height) { domNode = document.createElement('div'); domNode.style.top = '0'; @@ -329,6 +311,4 @@ describe('CoordinateMapsVisualizationTest', function () { domNode.innerHTML = ''; document.body.removeChild(domNode); } - }); - diff --git a/src/legacy/core_plugins/tile_map/public/legacy.ts b/src/legacy/core_plugins/tile_map/public/legacy.ts index 3237ab4373720..cf2e702cd09b6 100644 --- a/src/legacy/core_plugins/tile_map/public/legacy.ts +++ b/src/legacy/core_plugins/tile_map/public/legacy.ts @@ -20,13 +20,13 @@ import { PluginInitializerContext } from 'kibana/public'; import { npSetup, npStart } from 'ui/new_platform'; -import { visualizations } from '../../visualizations/public'; +import { setup as setupVisualizations } from '../../visualizations/public/np_ready/public/legacy'; import { TileMapPluginSetupDependencies } from './plugin'; import { LegacyDependenciesPlugin } from './shim'; import { plugin } from '.'; const plugins: Readonly = { - visualizations, + visualizations: setupVisualizations, data: npSetup.plugins.data, // Temporary solution diff --git a/src/legacy/core_plugins/tile_map/public/plugin.ts b/src/legacy/core_plugins/tile_map/public/plugin.ts index f5ce0df297125..1309c37a4c73a 100644 --- a/src/legacy/core_plugins/tile_map/public/plugin.ts +++ b/src/legacy/core_plugins/tile_map/public/plugin.ts @@ -24,7 +24,7 @@ import { UiSettingsClientContract, } from '../../../../core/public'; import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public'; -import { VisualizationsSetup } from '../../visualizations/public'; +import { VisualizationsSetup } from '../../visualizations/public/np_ready/public'; import { LegacyDependenciesPlugin, LegacyDependenciesPluginSetup } from './shim'; @@ -64,7 +64,7 @@ export class TileMapPlugin implements Plugin, void> { data.expressions.registerFunction(() => createTileMapFn(visualizationDependencies)); - visualizations.types.VisTypesRegistryProvider.register(() => + visualizations.types.registerVisualization(() => createTileMapTypeDefinition(visualizationDependencies) ); } diff --git a/src/legacy/core_plugins/tile_map/public/tile_map_type.js b/src/legacy/core_plugins/tile_map/public/tile_map_type.js index 6d3158c7e5f82..d96d8ad9be786 100644 --- a/src/legacy/core_plugins/tile_map/public/tile_map_type.js +++ b/src/legacy/core_plugins/tile_map/public/tile_map_type.js @@ -27,7 +27,7 @@ import { colorSchemas } from 'ui/vislib/components/color/truncated_colormaps'; import { convertToGeoJson } from 'ui/vis/map/convert_to_geojson'; import { createTileMapVisualization } from './tile_map_visualization'; -import { visFactory } from '../../visualizations/public'; +import { visFactory } from '../../visualizations/public/np_ready/public'; import { TileMapOptions } from './components/tile_map_options'; import { MapTypes } from './map_types'; @@ -65,27 +65,32 @@ export function createTileMapTypeDefinition(dependencies) { editorConfig: { collections: { colorSchemas, - legendPositions: [{ - value: 'bottomleft', - text: i18n.translate('tileMap.vis.editorConfig.legendPositions.bottomLeftText', { - defaultMessage: 'Bottom left', - }), - }, { - value: 'bottomright', - text: i18n.translate('tileMap.vis.editorConfig.legendPositions.bottomRightText', { - defaultMessage: 'Bottom right', - }), - }, { - value: 'topleft', - text: i18n.translate('tileMap.vis.editorConfig.legendPositions.topLeftText', { - defaultMessage: 'Top left', - }), - }, { - value: 'topright', - text: i18n.translate('tileMap.vis.editorConfig.legendPositions.topRightText', { - defaultMessage: 'Top right', - }), - }], + legendPositions: [ + { + value: 'bottomleft', + text: i18n.translate('tileMap.vis.editorConfig.legendPositions.bottomLeftText', { + defaultMessage: 'Bottom left', + }), + }, + { + value: 'bottomright', + text: i18n.translate('tileMap.vis.editorConfig.legendPositions.bottomRightText', { + defaultMessage: 'Bottom right', + }), + }, + { + value: 'topleft', + text: i18n.translate('tileMap.vis.editorConfig.legendPositions.topLeftText', { + defaultMessage: 'Top left', + }), + }, + { + value: 'topright', + text: i18n.translate('tileMap.vis.editorConfig.legendPositions.topRightText', { + defaultMessage: 'Top right', + }), + }, + ], mapTypes: [ { value: MapTypes.ScaledCircleMarkers, @@ -114,7 +119,7 @@ export function createTileMapTypeDefinition(dependencies) { ], tmsLayers: [], }, - optionsTemplate: (props) => , + optionsTemplate: props => , schemas: new Schemas([ { group: 'metrics', @@ -125,9 +130,7 @@ export function createTileMapTypeDefinition(dependencies) { min: 1, max: 1, aggFilter: ['count', 'avg', 'sum', 'min', 'max', 'cardinality', 'top_hits'], - defaults: [ - { schema: 'metric', type: 'count' }, - ], + defaults: [{ schema: 'metric', type: 'count' }], }, { group: 'buckets', diff --git a/src/legacy/core_plugins/vis_type_markdown/public/legacy.ts b/src/legacy/core_plugins/vis_type_markdown/public/legacy.ts index 769fc72b4c661..539b4e1bdfb45 100644 --- a/src/legacy/core_plugins/vis_type_markdown/public/legacy.ts +++ b/src/legacy/core_plugins/vis_type_markdown/public/legacy.ts @@ -20,12 +20,12 @@ import { PluginInitializerContext } from 'kibana/public'; import { npSetup, npStart } from 'ui/new_platform'; -import { visualizations } from '../../visualizations/public'; +import { setup as setupVisualizations } from '../../visualizations/public/np_ready/public/legacy'; import { MarkdownPluginSetupDependencies } from './plugin'; import { plugin } from '.'; const plugins: Readonly = { - visualizations, + visualizations: setupVisualizations, data: npSetup.plugins.data, }; diff --git a/src/legacy/core_plugins/vis_type_markdown/public/markdown_vis.ts b/src/legacy/core_plugins/vis_type_markdown/public/markdown_vis.ts index 7b2f8f6c236b2..2f1a46f1d8f3f 100644 --- a/src/legacy/core_plugins/vis_type_markdown/public/markdown_vis.ts +++ b/src/legacy/core_plugins/vis_type_markdown/public/markdown_vis.ts @@ -19,7 +19,7 @@ import { i18n } from '@kbn/i18n'; -import { visFactory, DefaultEditorSize } from '../../visualizations/public'; +import { visFactory, DefaultEditorSize } from '../../visualizations/public/np_ready/public'; import { MarkdownVisWrapper } from './markdown_vis_controller'; import { MarkdownOptions } from './markdown_options'; diff --git a/src/legacy/core_plugins/vis_type_markdown/public/plugin.ts b/src/legacy/core_plugins/vis_type_markdown/public/plugin.ts index 286b233280382..5f9c82ca89290 100644 --- a/src/legacy/core_plugins/vis_type_markdown/public/plugin.ts +++ b/src/legacy/core_plugins/vis_type_markdown/public/plugin.ts @@ -19,7 +19,7 @@ import { PluginInitializerContext, CoreSetup, CoreStart, Plugin } from '../../../../core/public'; import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public'; -import { VisualizationsSetup } from '../../visualizations/public'; +import { VisualizationsSetup } from '../../visualizations/public/np_ready/public'; import { markdownVis } from './markdown_vis'; import { createMarkdownVisFn } from './markdown_fn'; @@ -39,7 +39,7 @@ export class MarkdownPlugin implements Plugin { } public setup(core: CoreSetup, { data, visualizations }: MarkdownPluginSetupDependencies) { - visualizations.types.VisTypesRegistryProvider.register(() => markdownVis); + visualizations.types.registerVisualization(() => markdownVis); data.expressions.registerFunction(createMarkdownVisFn); } diff --git a/src/legacy/core_plugins/vis_type_metric/public/__tests__/metric_vis.js b/src/legacy/core_plugins/vis_type_metric/public/__tests__/metric_vis.js index 7adf7007e8603..ce77c64d77651 100644 --- a/src/legacy/core_plugins/vis_type_metric/public/__tests__/metric_vis.js +++ b/src/legacy/core_plugins/vis_type_metric/public/__tests__/metric_vis.js @@ -24,7 +24,7 @@ import expect from '@kbn/expect'; import { VisProvider } from 'ui/vis'; import LogstashIndexPatternStubProvider from 'fixtures/stubbed_logstash_index_pattern'; -import { visualizations } from '../../../visualizations/public'; +import { setup as setupVisualizations } from '../../../visualizations/public/np_ready/public/legacy'; import { createMetricVisTypeDefinition } from '../metric_vis_type'; describe('metric_vis - createMetricVisTypeDefinition', () => { @@ -32,48 +32,52 @@ describe('metric_vis - createMetricVisTypeDefinition', () => { let vis; beforeEach(ngMock.module('kibana')); - beforeEach(ngMock.inject((Private) => { - setup = () => { - const Vis = Private(VisProvider); - const metricVisType = createMetricVisTypeDefinition(); - - visualizations.types.VisTypesRegistryProvider.register(() => - metricVisType - ); - - const indexPattern = Private(LogstashIndexPatternStubProvider); - - indexPattern.stubSetFieldFormat('ip', 'url', { - urlTemplate: 'http://ip.info?address={{value}}', - labelTemplate: 'ip[{{value}}]' - }); - - vis = new Vis(indexPattern, { - type: 'metric', - aggs: [{ id: '1', type: 'top_hits', schema: 'metric', params: { field: 'ip' } }], - }); - - vis.params.dimensions = { - metrics: [{ - accessor: 0, format: { - id: 'url', params: { - urlTemplate: 'http://ip.info?address={{value}}', - labelTemplate: 'ip[{{value}}]' - } - } - }] - }; - - const el = document.createElement('div'); - const Controller = metricVisType.visualization; - const controller = new Controller(el, vis); - const render = (esResponse) => { - controller.render(esResponse, vis.params); + beforeEach( + ngMock.inject(Private => { + setup = () => { + const Vis = Private(VisProvider); + const metricVisType = createMetricVisTypeDefinition(); + + setupVisualizations.types.registerVisualization(() => metricVisType); + + const indexPattern = Private(LogstashIndexPatternStubProvider); + + indexPattern.stubSetFieldFormat('ip', 'url', { + urlTemplate: 'http://ip.info?address={{value}}', + labelTemplate: 'ip[{{value}}]', + }); + + vis = new Vis(indexPattern, { + type: 'metric', + aggs: [{ id: '1', type: 'top_hits', schema: 'metric', params: { field: 'ip' } }], + }); + + vis.params.dimensions = { + metrics: [ + { + accessor: 0, + format: { + id: 'url', + params: { + urlTemplate: 'http://ip.info?address={{value}}', + labelTemplate: 'ip[{{value}}]', + }, + }, + }, + ], + }; + + const el = document.createElement('div'); + const Controller = metricVisType.visualization; + const controller = new Controller(el, vis); + const render = esResponse => { + controller.render(esResponse, vis.params); + }; + + return { el, render }; }; - - return { el, render }; - }; - })); + }) + ); it('renders html value from field formatter', () => { const { el, render } = setup(); @@ -81,12 +85,14 @@ describe('metric_vis - createMetricVisTypeDefinition', () => { const ip = '235.195.237.208'; render({ columns: [{ id: 'col-0', name: 'ip' }], - rows: [{ 'col-0': ip }] + rows: [{ 'col-0': ip }], }); const $link = $(el) .find('a[href]') - .filter(function () { return this.href.includes('ip.info'); }); + .filter(function () { + return this.href.includes('ip.info'); + }); expect($link).to.have.length(1); expect($link.text()).to.be(`ip[${ip}]`); diff --git a/src/legacy/core_plugins/vis_type_metric/public/legacy.ts b/src/legacy/core_plugins/vis_type_metric/public/legacy.ts index 4ab399977d7b1..2eea4c70309de 100644 --- a/src/legacy/core_plugins/vis_type_metric/public/legacy.ts +++ b/src/legacy/core_plugins/vis_type_metric/public/legacy.ts @@ -20,13 +20,13 @@ import { PluginInitializerContext } from 'kibana/public'; import { npSetup, npStart } from 'ui/new_platform'; -import { visualizations } from '../../visualizations/public'; +import { setup as setupVisualizations } from '../../visualizations/public/np_ready/public/legacy'; import { MetricVisPluginSetupDependencies } from './plugin'; import { LegacyDependenciesPlugin } from './shim'; import { plugin } from '.'; const plugins: Readonly = { - visualizations, + visualizations: setupVisualizations, data: npSetup.plugins.data, // Temporary solution diff --git a/src/legacy/core_plugins/vis_type_metric/public/metric_vis_type.ts b/src/legacy/core_plugins/vis_type_metric/public/metric_vis_type.ts index 76e88888ef7f2..eba61edeeb84a 100644 --- a/src/legacy/core_plugins/vis_type_metric/public/metric_vis_type.ts +++ b/src/legacy/core_plugins/vis_type_metric/public/metric_vis_type.ts @@ -26,7 +26,7 @@ import { vislibColorMaps } from 'ui/vislib/components/color/colormaps'; // @ts-ignore import { MetricVisComponent } from './components/metric_vis_controller'; -import { visFactory } from '../../visualizations/public'; +import { visFactory } from '../../visualizations/public/np_ready/public'; export const createMetricVisTypeDefinition = () => { return visFactory.createReactVisualization({ diff --git a/src/legacy/core_plugins/vis_type_metric/public/plugin.ts b/src/legacy/core_plugins/vis_type_metric/public/plugin.ts index d99df03fcc560..66a3bb007e379 100644 --- a/src/legacy/core_plugins/vis_type_metric/public/plugin.ts +++ b/src/legacy/core_plugins/vis_type_metric/public/plugin.ts @@ -20,7 +20,7 @@ import { PluginInitializerContext, CoreSetup, CoreStart, Plugin } from '../../../../core/public'; import { LegacyDependenciesPlugin } from './shim'; import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public'; -import { VisualizationsSetup } from '../../visualizations/public'; +import { VisualizationsSetup } from '../../visualizations/public/np_ready/public'; import { createMetricVisFn } from './metric_vis_fn'; // @ts-ignore @@ -48,7 +48,7 @@ export class MetricVisPlugin implements Plugin { __LEGACY.setup(); data.expressions.registerFunction(createMetricVisFn); - visualizations.types.VisTypesRegistryProvider.register(createMetricVisTypeDefinition); + visualizations.types.registerVisualization(createMetricVisTypeDefinition); } public start(core: CoreStart) { diff --git a/src/legacy/core_plugins/vis_type_table/public/__tests__/table_vis_controller.js b/src/legacy/core_plugins/vis_type_table/public/__tests__/table_vis_controller.js index 4253efd4689cf..9110c8dcb8486 100644 --- a/src/legacy/core_plugins/vis_type_table/public/__tests__/table_vis_controller.js +++ b/src/legacy/core_plugins/vis_type_table/public/__tests__/table_vis_controller.js @@ -28,7 +28,7 @@ import { AppStateProvider } from 'ui/state_management/app_state'; import { tabifyAggResponse } from 'ui/agg_response/tabify'; import { createTableVisTypeDefinition } from '../table_vis_type'; -import { visualizations } from '../../../visualizations/public'; +import { setup as setupVisualizations } from '../../../visualizations/public/np_ready/public/legacy'; describe('Table Vis - Controller', async function () { let $rootScope; @@ -44,68 +44,73 @@ describe('Table Vis - Controller', async function () { let legacyDependencies; beforeEach(ngMock.module('kibana', 'kibana/table_vis')); - beforeEach(ngMock.inject(function ($injector) { - Private = $injector.get('Private'); - legacyDependencies = { - // eslint-disable-next-line new-cap - createAngularVisualization: VisFactoryProvider(Private).createAngularVisualization - }; - - visualizations.types.VisTypesRegistryProvider.register(() => - createTableVisTypeDefinition(legacyDependencies) - ); - - $rootScope = $injector.get('$rootScope'); - $compile = $injector.get('$compile'); - fixtures = require('fixtures/fake_hierarchical_data'); - AppState = Private(AppStateProvider); - Vis = Private(VisProvider); - tableAggResponse = legacyResponseHandlerProvider().handler; - })); + beforeEach( + ngMock.inject(function ($injector) { + Private = $injector.get('Private'); + legacyDependencies = { + // eslint-disable-next-line new-cap + createAngularVisualization: VisFactoryProvider(Private).createAngularVisualization, + }; + + setupVisualizations.types.registerVisualization(() => + createTableVisTypeDefinition(legacyDependencies) + ); + + $rootScope = $injector.get('$rootScope'); + $compile = $injector.get('$compile'); + fixtures = require('fixtures/fake_hierarchical_data'); + AppState = Private(AppStateProvider); + Vis = Private(VisProvider); + tableAggResponse = legacyResponseHandlerProvider().handler; + }) + ); function OneRangeVis(params) { - return new Vis( - Private(FixturesStubbedLogstashIndexPatternProvider), - { - type: 'table', - params: params || {}, - aggs: [ - { type: 'count', schema: 'metric' }, - { - type: 'range', - schema: 'bucket', - params: { - field: 'bytes', - ranges: [ - { from: 0, to: 1000 }, - { from: 1000, to: 2000 } - ] - } - } - ] - } - ); + return new Vis(Private(FixturesStubbedLogstashIndexPatternProvider), { + type: 'table', + params: params || {}, + aggs: [ + { type: 'count', schema: 'metric' }, + { + type: 'range', + schema: 'bucket', + params: { + field: 'bytes', + ranges: [{ from: 0, to: 1000 }, { from: 1000, to: 2000 }], + }, + }, + ], + }); } const dimensions = { - buckets: [{ - accessor: 0, - }], metrics: [{ - accessor: 1, - format: { id: 'range' }, - }] + buckets: [ + { + accessor: 0, + }, + ], + metrics: [ + { + accessor: 1, + format: { id: 'range' }, + }, + ], }; // basically a parameterized beforeEach function initController(vis) { - vis.aggs.aggs.forEach(function (agg, i) { agg.id = 'agg_' + (i + 1); }); + vis.aggs.aggs.forEach(function (agg, i) { + agg.id = 'agg_' + (i + 1); + }); tabifiedResponse = tabifyAggResponse(vis.aggs, fixtures.oneRangeBucket); $rootScope.vis = vis; $rootScope.visParams = vis.params; $rootScope.uiState = new AppState({ uiState: {} }).makeStateful('uiState'); $rootScope.renderComplete = () => {}; - $rootScope.newScope = function (scope) { $scope = scope; }; + $rootScope.newScope = function (scope) { + $scope = scope; + }; $el = $('
') .attr('ng-controller', 'KbnTableVisController') @@ -157,7 +162,7 @@ describe('Table Vis - Controller', async function () { it('sets the sort on the scope when it is passed as a vis param', async function () { const sortObj = { columnIndex: 1, - direction: 'asc' + direction: 'asc', }; const vis = new OneRangeVis({ sort: sortObj }); initController(vis); @@ -181,7 +186,6 @@ describe('Table Vis - Controller', async function () { }); it('passes partialRows:true to tabify based on the vis params', function () { - const vis = new OneRangeVis({ showPartialRows: true }); initController(vis); @@ -189,7 +193,6 @@ describe('Table Vis - Controller', async function () { }); it('passes partialRows:false to tabify based on the vis params', function () { - const vis = new OneRangeVis({ showPartialRows: false }); initController(vis); diff --git a/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table.js b/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table.js index b0476ae224866..8521ee729f313 100644 --- a/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table.js +++ b/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table.js @@ -31,10 +31,9 @@ import { round } from 'lodash'; import { VisFactoryProvider } from 'ui/vis/vis_factory'; import { createTableVisTypeDefinition } from '../../table_vis_type'; -import { visualizations } from '../../../../visualizations/public'; +import { setup } from '../../../../visualizations/public/np_ready/public/legacy'; describe('Table Vis - AggTable Directive', function () { - let $rootScope; let $compile; let Vis; @@ -51,19 +50,21 @@ describe('Table Vis - AggTable Directive', function () { const vis2 = new Vis(indexPattern, { type: 'table', params: { - showMetricsAtAllLevels: true + showMetricsAtAllLevels: true, }, aggs: [ { type: 'avg', schema: 'metric', params: { field: 'bytes' } }, { type: 'terms', schema: 'bucket', params: { field: 'extension' } }, { type: 'terms', schema: 'bucket', params: { field: 'geo.src' } }, - { type: 'terms', schema: 'bucket', params: { field: 'machine.os' } } - ] + { type: 'terms', schema: 'bucket', params: { field: 'machine.os' } }, + ], }); vis2.aggs.aggs.forEach(function (agg, i) { agg.id = 'agg_' + (i + 1); }); - tabifiedData.threeTermBuckets = tabifyAggResponse(vis2.aggs, fixtures.threeTermBuckets, { metricsAtAllLevels: true }); + tabifiedData.threeTermBuckets = tabifyAggResponse(vis2.aggs, fixtures.threeTermBuckets, { + metricsAtAllLevels: true, + }); const vis3 = new Vis(indexPattern, { type: 'table', @@ -71,41 +72,54 @@ describe('Table Vis - AggTable Directive', function () { { type: 'avg', schema: 'metric', params: { field: 'bytes' } }, { type: 'min', schema: 'metric', params: { field: '@timestamp' } }, { type: 'terms', schema: 'bucket', params: { field: 'extension' } }, - { type: 'date_histogram', schema: 'bucket', params: { field: '@timestamp', interval: 'd' } }, - { type: 'derivative', schema: 'metric', - params: { metricAgg: 'custom', customMetric: { id: '5-orderAgg', type: 'count' } } }, - { type: 'top_hits', schema: 'metric', params: { field: 'bytes', aggregate: { val: 'min' }, size: 1 } } - ] + { + type: 'date_histogram', + schema: 'bucket', + params: { field: '@timestamp', interval: 'd' }, + }, + { + type: 'derivative', + schema: 'metric', + params: { metricAgg: 'custom', customMetric: { id: '5-orderAgg', type: 'count' } }, + }, + { + type: 'top_hits', + schema: 'metric', + params: { field: 'bytes', aggregate: { val: 'min' }, size: 1 }, + }, + ], }); vis3.aggs.aggs.forEach(function (agg, i) { agg.id = 'agg_' + (i + 1); }); - tabifiedData.oneTermOneHistogramBucketWithTwoMetricsOneTopHitOneDerivative = - tabifyAggResponse(vis3.aggs, fixtures.oneTermOneHistogramBucketWithTwoMetricsOneTopHitOneDerivative); + tabifiedData.oneTermOneHistogramBucketWithTwoMetricsOneTopHitOneDerivative = tabifyAggResponse( + vis3.aggs, + fixtures.oneTermOneHistogramBucketWithTwoMetricsOneTopHitOneDerivative + ); }; beforeEach(ngMock.module('kibana')); - beforeEach(ngMock.inject(function ($injector, Private, config) { - legacyDependencies = { - // eslint-disable-next-line new-cap - createAngularVisualization: VisFactoryProvider(Private).createAngularVisualization - }; + beforeEach( + ngMock.inject(function ($injector, Private, config) { + legacyDependencies = { + // eslint-disable-next-line new-cap + createAngularVisualization: VisFactoryProvider(Private).createAngularVisualization, + }; - visualizations.types.VisTypesRegistryProvider.register(() => - createTableVisTypeDefinition(legacyDependencies) - ); + setup.types.registerVisualization(() => createTableVisTypeDefinition(legacyDependencies)); - tableAggResponse = legacyResponseHandlerProvider().handler; - indexPattern = Private(FixturesStubbedLogstashIndexPatternProvider); - Vis = Private(VisProvider); - settings = config; + tableAggResponse = legacyResponseHandlerProvider().handler; + indexPattern = Private(FixturesStubbedLogstashIndexPatternProvider); + Vis = Private(VisProvider); + settings = config; - $rootScope = $injector.get('$rootScope'); - $compile = $injector.get('$compile'); + $rootScope = $injector.get('$rootScope'); + $compile = $injector.get('$compile'); - init(); - })); + init(); + }) + ); let $scope; beforeEach(function () { @@ -115,12 +129,16 @@ describe('Table Vis - AggTable Directive', function () { $scope.$destroy(); }); - it('renders a simple response properly', async function () { - $scope.dimensions = { metrics: [{ accessor: 0, format: { id: 'number' }, params: {} }], buckets: [] }; + $scope.dimensions = { + metrics: [{ accessor: 0, format: { id: 'number' }, params: {} }], + buckets: [], + }; $scope.table = (await tableAggResponse(tabifiedData.metricOnly, $scope.dimensions)).tables[0]; - const $el = $compile('')($scope); + const $el = $compile('')( + $scope + ); $scope.$digest(); expect($el.find('tbody').length).to.be(1); @@ -131,7 +149,9 @@ describe('Table Vis - AggTable Directive', function () { it('renders nothing if the table is empty', function () { $scope.dimensions = {}; $scope.table = null; - const $el = $compile('')($scope); + const $el = $compile('')( + $scope + ); $scope.$digest(); expect($el.find('tbody').length).to.be(0); @@ -139,10 +159,21 @@ describe('Table Vis - AggTable Directive', function () { it('renders a complex response properly', async function () { $scope.dimensions = { - buckets: [{ accessor: 0, params: {} }, { accessor: 2, params: {} }, { accessor: 4, params: {} }], - metrics: [{ accessor: 1, params: {} }, { accessor: 3, params: {} }, { accessor: 5, params: {} }] + buckets: [ + { accessor: 0, params: {} }, + { accessor: 2, params: {} }, + { accessor: 4, params: {} }, + ], + metrics: [ + { accessor: 1, params: {} }, + { accessor: 3, params: {} }, + { accessor: 5, params: {} }, + ], }; - $scope.table = (await tableAggResponse(tabifiedData.threeTermBuckets, $scope.dimensions)).tables[0]; + $scope.table = (await tableAggResponse( + tabifiedData.threeTermBuckets, + $scope.dimensions + )).tables[0]; const $el = $(''); $compile($el)($scope); $scope.$digest(); @@ -165,7 +196,9 @@ describe('Table Vis - AggTable Directive', function () { expect($cells.length).to.be(6); const txts = $cells.map(function () { - return $(this).text().trim(); + return $(this) + .text() + .trim(); }); // two character country code @@ -184,7 +217,6 @@ describe('Table Vis - AggTable Directive', function () { describe('renders totals row', function () { async function totalsRowTest(totalFunc, expected) { - function setDefaultTimezone() { moment.tz.setDefault(settings.get('dateFormat:tz')); } @@ -197,15 +229,18 @@ describe('Table Vis - AggTable Directive', function () { buckets: [ { accessor: 0, params: {} }, { accessor: 1, format: { id: 'date', params: { pattern: 'YYYY-MM-DD' } } }, - ], metrics: [ + ], + metrics: [ { accessor: 2, format: { id: 'number' } }, { accessor: 3, format: { id: 'date' } }, { accessor: 4, format: { id: 'number' } }, { accessor: 5, format: { id: 'number' } }, - ] + ], }; const response = await tableAggResponse( - tabifiedData.oneTermOneHistogramBucketWithTwoMetricsOneTopHitOneDerivative, $scope.dimensions); + tabifiedData.oneTermOneHistogramBucketWithTwoMetricsOneTopHitOneDerivative, + $scope.dimensions + ); $scope.table = response.tables[0]; $scope.showTotal = true; $scope.totalFunc = totalFunc; @@ -226,7 +261,11 @@ describe('Table Vis - AggTable Directive', function () { expect($cells.length).to.be(6); for (let i = 0; i < 6; i++) { - expect($($cells[i]).text().trim()).to.be(expected[i]); + expect( + $($cells[i]) + .text() + .trim() + ).to.be(expected[i]); } settings.set('dateFormat:tz', oldTimezoneSetting); off(); @@ -241,7 +280,7 @@ describe('Table Vis - AggTable Directive', function () { '9,283', 'Sep 28, 2014 @ 00:00:00.000', '1', - '11' + '11', ]); }); it('as max', async function () { @@ -251,34 +290,22 @@ describe('Table Vis - AggTable Directive', function () { '220,943', 'Oct 3, 2014 @ 00:00:00.000', '239', - '837' + '837', ]); }); it('as avg', async function () { - await totalsRowTest('avg', [ - '', - '', - '87,221.5', - '', - '64.667', - '206.833' - ]); + await totalsRowTest('avg', ['', '', '87,221.5', '', '64.667', '206.833']); }); it('as sum', async function () { - await totalsRowTest('sum', [ - '', - '', - '1,569,987', - '', - '1,164', - '3,723' - ]); + await totalsRowTest('sum', ['', '', '1,569,987', '', '1,164', '3,723']); }); }); describe('aggTable.toCsv()', function () { it('escapes rows and columns properly', function () { - const $el = $compile('')($scope); + const $el = $compile('')( + $scope + ); $scope.$digest(); const $tableScope = $el.isolateScope(); @@ -289,25 +316,35 @@ describe('Table Vis - AggTable Directive', function () { { id: 'b', name: 'two' }, { id: 'c', name: 'with double-quotes(")' }, ], - rows: [ - { a: 1, b: 2, c: '"foobar"' }, - ], + rows: [{ a: 1, b: 2, c: '"foobar"' }], }; expect(aggTable.toCsv()).to.be( - 'one,two,"with double-quotes("")"' + '\r\n' + - '1,2,"""foobar"""' + '\r\n' + 'one,two,"with double-quotes("")"' + '\r\n' + '1,2,"""foobar"""' + '\r\n' ); }); it('exports rows and columns properly', async function () { $scope.dimensions = { - buckets: [{ accessor: 0, params: {} }, { accessor: 2, params: {} }, { accessor: 4, params: {} }], - metrics: [{ accessor: 1, params: {} }, { accessor: 3, params: {} }, { accessor: 5, params: {} }] + buckets: [ + { accessor: 0, params: {} }, + { accessor: 2, params: {} }, + { accessor: 4, params: {} }, + ], + metrics: [ + { accessor: 1, params: {} }, + { accessor: 3, params: {} }, + { accessor: 5, params: {} }, + ], }; - $scope.table = (await tableAggResponse(tabifiedData.threeTermBuckets, $scope.dimensions)).tables[0]; + $scope.table = (await tableAggResponse( + tabifiedData.threeTermBuckets, + $scope.dimensions + )).tables[0]; - const $el = $compile('')($scope); + const $el = $compile('')( + $scope + ); $scope.$digest(); const $tableScope = $el.isolateScope(); @@ -316,30 +353,56 @@ describe('Table Vis - AggTable Directive', function () { const raw = aggTable.toCsv(false); expect(raw).to.be( - '"extension: Descending","Average bytes","geo.src: Descending","Average bytes","machine.os: Descending","Average bytes"' + '\r\n' + - 'png,IT,win,412032,9299,0' + '\r\n' + - 'png,IT,mac,412032,9299,9299' + '\r\n' + - 'png,US,linux,412032,8293,3992' + '\r\n' + - 'png,US,mac,412032,8293,3029' + '\r\n' + - 'css,MX,win,412032,9299,4992' + '\r\n' + - 'css,MX,mac,412032,9299,5892' + '\r\n' + - 'css,US,linux,412032,8293,3992' + '\r\n' + - 'css,US,mac,412032,8293,3029' + '\r\n' + - 'html,CN,win,412032,9299,4992' + '\r\n' + - 'html,CN,mac,412032,9299,5892' + '\r\n' + - 'html,FR,win,412032,8293,3992' + '\r\n' + - 'html,FR,mac,412032,8293,3029' + '\r\n' + '"extension: Descending","Average bytes","geo.src: Descending","Average bytes","machine.os: Descending","Average bytes"' + + '\r\n' + + 'png,IT,win,412032,9299,0' + + '\r\n' + + 'png,IT,mac,412032,9299,9299' + + '\r\n' + + 'png,US,linux,412032,8293,3992' + + '\r\n' + + 'png,US,mac,412032,8293,3029' + + '\r\n' + + 'css,MX,win,412032,9299,4992' + + '\r\n' + + 'css,MX,mac,412032,9299,5892' + + '\r\n' + + 'css,US,linux,412032,8293,3992' + + '\r\n' + + 'css,US,mac,412032,8293,3029' + + '\r\n' + + 'html,CN,win,412032,9299,4992' + + '\r\n' + + 'html,CN,mac,412032,9299,5892' + + '\r\n' + + 'html,FR,win,412032,8293,3992' + + '\r\n' + + 'html,FR,mac,412032,8293,3029' + + '\r\n' ); }); it('exports formatted rows and columns properly', async function () { $scope.dimensions = { - buckets: [{ accessor: 0, params: {} }, { accessor: 2, params: {} }, { accessor: 4, params: {} }], - metrics: [{ accessor: 1, params: {} }, { accessor: 3, params: {} }, { accessor: 5, params: {} }] + buckets: [ + { accessor: 0, params: {} }, + { accessor: 2, params: {} }, + { accessor: 4, params: {} }, + ], + metrics: [ + { accessor: 1, params: {} }, + { accessor: 3, params: {} }, + { accessor: 5, params: {} }, + ], }; - $scope.table = (await tableAggResponse(tabifiedData.threeTermBuckets, $scope.dimensions)).tables[0]; + $scope.table = (await tableAggResponse( + tabifiedData.threeTermBuckets, + $scope.dimensions + )).tables[0]; - const $el = $compile('')($scope); + const $el = $compile('')( + $scope + ); $scope.$digest(); const $tableScope = $el.isolateScope(); @@ -351,19 +414,32 @@ describe('Table Vis - AggTable Directive', function () { const formatted = aggTable.toCsv(true); expect(formatted).to.be( - '"extension: Descending","Average bytes","geo.src: Descending","Average bytes","machine.os: Descending","Average bytes"' + '\r\n' + - '"png_formatted",IT,win,412032,9299,0' + '\r\n' + - '"png_formatted",IT,mac,412032,9299,9299' + '\r\n' + - '"png_formatted",US,linux,412032,8293,3992' + '\r\n' + - '"png_formatted",US,mac,412032,8293,3029' + '\r\n' + - '"css_formatted",MX,win,412032,9299,4992' + '\r\n' + - '"css_formatted",MX,mac,412032,9299,5892' + '\r\n' + - '"css_formatted",US,linux,412032,8293,3992' + '\r\n' + - '"css_formatted",US,mac,412032,8293,3029' + '\r\n' + - '"html_formatted",CN,win,412032,9299,4992' + '\r\n' + - '"html_formatted",CN,mac,412032,9299,5892' + '\r\n' + - '"html_formatted",FR,win,412032,8293,3992' + '\r\n' + - '"html_formatted",FR,mac,412032,8293,3029' + '\r\n' + '"extension: Descending","Average bytes","geo.src: Descending","Average bytes","machine.os: Descending","Average bytes"' + + '\r\n' + + '"png_formatted",IT,win,412032,9299,0' + + '\r\n' + + '"png_formatted",IT,mac,412032,9299,9299' + + '\r\n' + + '"png_formatted",US,linux,412032,8293,3992' + + '\r\n' + + '"png_formatted",US,mac,412032,8293,3029' + + '\r\n' + + '"css_formatted",MX,win,412032,9299,4992' + + '\r\n' + + '"css_formatted",MX,mac,412032,9299,5892' + + '\r\n' + + '"css_formatted",US,linux,412032,8293,3992' + + '\r\n' + + '"css_formatted",US,mac,412032,8293,3029' + + '\r\n' + + '"html_formatted",CN,win,412032,9299,4992' + + '\r\n' + + '"html_formatted",CN,mac,412032,9299,5892' + + '\r\n' + + '"html_formatted",FR,win,412032,8293,3992' + + '\r\n' + + '"html_formatted",FR,mac,412032,8293,3029' + + '\r\n' ); }); }); @@ -452,9 +528,7 @@ describe('Table Vis - AggTable Directive', function () { { id: 'b', name: 'two' }, { id: 'c', name: 'with double-quotes(")' }, ], - rows: [ - { a: 1, b: 2, c: '"foobar"' }, - ], + rows: [{ a: 1, b: 2, c: '"foobar"' }], }; aggTable.csv.filename = 'somefilename.csv'; @@ -464,25 +538,26 @@ describe('Table Vis - AggTable Directive', function () { const call = saveAs.getCall(0); expect(call.args[0]).to.be.a(FakeBlob); expect(call.args[0].slices).to.eql([ - 'one,two,"with double-quotes("")"' + '\r\n' + - '1,2,"""foobar"""' + '\r\n' + 'one,two,"with double-quotes("")"' + '\r\n' + '1,2,"""foobar"""' + '\r\n', ]); expect(call.args[0].opts).to.eql({ - type: 'text/plain;charset=utf-8' + type: 'text/plain;charset=utf-8', }); expect(call.args[1]).to.be('somefilename.csv'); }); it('should use the export-title attribute', function () { const expected = 'export file name'; - const $el = $compile(``)($scope); + const $el = $compile( + `` + )($scope); $scope.$digest(); const $tableScope = $el.isolateScope(); const aggTable = $tableScope.aggTable; $tableScope.table = { columns: [], - rows: [] + rows: [], }; $tableScope.exportTitle = expected; $scope.$digest(); diff --git a/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table_group.js b/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table_group.js index 5b9974d6ff4d5..7998a92a4759f 100644 --- a/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table_group.js +++ b/src/legacy/core_plugins/vis_type_table/public/agg_table/__tests__/agg_table_group.js @@ -28,7 +28,7 @@ import { tabifyAggResponse } from 'ui/agg_response/tabify'; import { VisFactoryProvider } from 'ui/vis/vis_factory'; import { createTableVisTypeDefinition } from '../../table_vis_type'; -import { visualizations } from '../../../../visualizations/public'; +import { setup } from '../../../../visualizations/public/np_ready/public/legacy'; describe('Table Vis - AggTableGroup Directive', function () { let $rootScope; @@ -49,8 +49,8 @@ describe('Table Vis - AggTableGroup Directive', function () { { type: 'avg', schema: 'metric', params: { field: 'bytes' } }, { type: 'terms', schema: 'split', params: { field: 'extension' } }, { type: 'terms', schema: 'segment', params: { field: 'geo.src' } }, - { type: 'terms', schema: 'segment', params: { field: 'machine.os' } } - ] + { type: 'terms', schema: 'segment', params: { field: 'machine.os' } }, + ], }); vis2.aggs.aggs.forEach(function (agg, i) { agg.id = 'agg_' + (i + 1); @@ -59,25 +59,25 @@ describe('Table Vis - AggTableGroup Directive', function () { }; beforeEach(ngMock.module('kibana')); - beforeEach(ngMock.inject(function ($injector, Private) { - legacyDependencies = { - // eslint-disable-next-line new-cap - createAngularVisualization: VisFactoryProvider(Private).createAngularVisualization - }; + beforeEach( + ngMock.inject(function ($injector, Private) { + legacyDependencies = { + // eslint-disable-next-line new-cap + createAngularVisualization: VisFactoryProvider(Private).createAngularVisualization, + }; - visualizations.types.VisTypesRegistryProvider.register(() => - createTableVisTypeDefinition(legacyDependencies) - ); + setup.types.registerVisualization(() => createTableVisTypeDefinition(legacyDependencies)); - tableAggResponse = legacyResponseHandlerProvider().handler; - indexPattern = Private(FixturesStubbedLogstashIndexPatternProvider); - Vis = Private(VisProvider); + tableAggResponse = legacyResponseHandlerProvider().handler; + indexPattern = Private(FixturesStubbedLogstashIndexPatternProvider); + Vis = Private(VisProvider); - $rootScope = $injector.get('$rootScope'); - $compile = $injector.get('$compile'); + $rootScope = $injector.get('$rootScope'); + $compile = $injector.get('$compile'); - init(); - })); + init(); + }) + ); let $scope; beforeEach(function () { @@ -88,13 +88,18 @@ describe('Table Vis - AggTableGroup Directive', function () { }); it('renders a simple split response properly', async function () { - $scope.dimensions = { metrics: [{ accessor: 0, format: { id: 'number' }, params: {} }], buckets: [] }; + $scope.dimensions = { + metrics: [{ accessor: 0, format: { id: 'number' }, params: {} }], + buckets: [], + }; $scope.group = await tableAggResponse(tabifiedData.metricOnly, $scope.dimensions); $scope.sort = { columnIndex: null, - direction: null + direction: null, }; - const $el = $(''); + const $el = $( + '' + ); $compile($el)($scope); $scope.$digest(); @@ -104,10 +109,12 @@ describe('Table Vis - AggTableGroup Directive', function () { }); it('renders nothing if the table list is empty', function () { - const $el = $(''); + const $el = $( + '' + ); $scope.group = { - tables: [] + tables: [], }; $compile($el)($scope); @@ -121,10 +128,19 @@ describe('Table Vis - AggTableGroup Directive', function () { $scope.dimensions = { splitRow: [{ accessor: 0, params: {} }], buckets: [{ accessor: 2, params: {} }, { accessor: 4, params: {} }], - metrics: [{ accessor: 1, params: {} }, { accessor: 3, params: {} }, { accessor: 5, params: {} }] + metrics: [ + { accessor: 1, params: {} }, + { accessor: 3, params: {} }, + { accessor: 5, params: {} }, + ], }; - const group = $scope.group = await tableAggResponse(tabifiedData.threeTermBuckets, $scope.dimensions); - const $el = $(''); + const group = ($scope.group = await tableAggResponse( + tabifiedData.threeTermBuckets, + $scope.dimensions + )); + const $el = $( + '' + ); $compile($el)($scope); $scope.$digest(); diff --git a/src/legacy/core_plugins/vis_type_table/public/legacy.ts b/src/legacy/core_plugins/vis_type_table/public/legacy.ts index fded5690a362d..8139a70552c48 100644 --- a/src/legacy/core_plugins/vis_type_table/public/legacy.ts +++ b/src/legacy/core_plugins/vis_type_table/public/legacy.ts @@ -22,11 +22,11 @@ import { npSetup, npStart } from 'ui/new_platform'; import { plugin } from '.'; import { TablePluginSetupDependencies } from './plugin'; -import { visualizations } from '../../visualizations/public'; +import { setup as setupVisualizations } from '../../visualizations/public/np_ready/public/legacy'; import { LegacyDependenciesPlugin } from './shim'; const plugins: Readonly = { - visualizations, + visualizations: setupVisualizations, data: npSetup.plugins.data, // Temporary solution diff --git a/src/legacy/core_plugins/vis_type_table/public/plugin.ts b/src/legacy/core_plugins/vis_type_table/public/plugin.ts index 21b6e21d6d639..6a39e8079a9fd 100644 --- a/src/legacy/core_plugins/vis_type_table/public/plugin.ts +++ b/src/legacy/core_plugins/vis_type_table/public/plugin.ts @@ -16,7 +16,7 @@ * specific language governing permissions and limitations * under the License. */ -import { VisualizationsSetup } from '../../visualizations/public'; +import { VisualizationsSetup } from '../../visualizations/public/np_ready/public'; import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public'; import { @@ -63,7 +63,7 @@ export class TableVisPlugin implements Plugin, void> { data.expressions.registerFunction(createTableVisFn); - visualizations.types.VisTypesRegistryProvider.register(() => + visualizations.types.registerVisualization(() => createTableVisTypeDefinition(visualizationDependencies) ); } diff --git a/src/legacy/core_plugins/vis_type_tagcloud/public/legacy.ts b/src/legacy/core_plugins/vis_type_tagcloud/public/legacy.ts index 01b2d99ce509c..6a5e06b6e6978 100644 --- a/src/legacy/core_plugins/vis_type_tagcloud/public/legacy.ts +++ b/src/legacy/core_plugins/vis_type_tagcloud/public/legacy.ts @@ -20,12 +20,12 @@ import { PluginInitializerContext } from 'kibana/public'; import { npSetup, npStart } from 'ui/new_platform'; -import { visualizations } from '../../visualizations/public'; +import { setup as setupVisualizations } from '../../visualizations/public/np_ready/public/legacy'; import { TagCloudPluginSetupDependencies } from './plugin'; import { plugin } from '.'; const plugins: Readonly = { - visualizations, + visualizations: setupVisualizations, data: npSetup.plugins.data, }; diff --git a/src/legacy/core_plugins/vis_type_tagcloud/public/plugin.ts b/src/legacy/core_plugins/vis_type_tagcloud/public/plugin.ts index e7f633b4af377..e13e9896e3940 100644 --- a/src/legacy/core_plugins/vis_type_tagcloud/public/plugin.ts +++ b/src/legacy/core_plugins/vis_type_tagcloud/public/plugin.ts @@ -19,7 +19,7 @@ import { PluginInitializerContext, CoreSetup, CoreStart, Plugin } from '../../../../core/public'; import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public'; -import { VisualizationsSetup } from '../../visualizations/public'; +import { VisualizationsSetup } from '../../visualizations/public/np_ready/public'; import { createTagCloudFn } from './tag_cloud_fn'; import { createTagCloudTypeDefinition } from './tag_cloud_type'; @@ -40,7 +40,7 @@ export class TagCloudPlugin implements Plugin { public setup(core: CoreSetup, { data, visualizations }: TagCloudPluginSetupDependencies) { data.expressions.registerFunction(createTagCloudFn); - visualizations.types.VisTypesRegistryProvider.register(createTagCloudTypeDefinition); + visualizations.types.registerVisualization(createTagCloudTypeDefinition); } public start(core: CoreStart) { diff --git a/src/legacy/core_plugins/vis_type_tagcloud/public/tag_cloud_type.ts b/src/legacy/core_plugins/vis_type_tagcloud/public/tag_cloud_type.ts index 0b4d90522cc44..421821d93b045 100644 --- a/src/legacy/core_plugins/vis_type_tagcloud/public/tag_cloud_type.ts +++ b/src/legacy/core_plugins/vis_type_tagcloud/public/tag_cloud_type.ts @@ -23,7 +23,7 @@ import { Status } from 'ui/vis/update_status'; import { Schemas } from 'ui/vis/editors/default/schemas'; import { TagCloudOptions } from './components/tag_cloud_options'; -import { visFactory } from '../../visualizations/public'; +import { visFactory } from '../../visualizations/public/np_ready/public'; // @ts-ignore import { TagCloudVisualization } from './components/tag_cloud_visualization'; diff --git a/src/legacy/core_plugins/vis_type_vega/public/__tests__/vega_visualization.js b/src/legacy/core_plugins/vis_type_vega/public/__tests__/vega_visualization.js index 681f4486a02d7..012f144983e98 100644 --- a/src/legacy/core_plugins/vis_type_vega/public/__tests__/vega_visualization.js +++ b/src/legacy/core_plugins/vis_type_vega/public/__tests__/vega_visualization.js @@ -41,10 +41,10 @@ import vegaMapImage256 from './vega_map_image_256.png'; import { VegaParser } from '../data_model/vega_parser'; import { SearchCache } from '../data_model/search_cache'; -import { visualizations } from '../../../visualizations/public'; +import { setup } from '../../../visualizations/public/np_ready/public/legacy'; import { createVegaTypeDefinition } from '../vega_type'; -const THRESHOLD = 0.10; +const THRESHOLD = 0.1; const PIXEL_DIFF = 30; describe('VegaVisualizations', () => { @@ -57,22 +57,24 @@ describe('VegaVisualizations', () => { let vegaVisualizationDependencies; beforeEach(ngMock.module('kibana')); - beforeEach(ngMock.inject((Private, $injector) => { - vegaVisualizationDependencies = { - es: $injector.get('es'), - serviceSettings: $injector.get('serviceSettings'), - uiSettings: $injector.get('config'), - }; + beforeEach( + ngMock.inject((Private, $injector) => { + vegaVisualizationDependencies = { + es: $injector.get('es'), + serviceSettings: $injector.get('serviceSettings'), + uiSettings: $injector.get('config'), + }; - visualizations.types.VisTypesRegistryProvider.register(() => - createVegaTypeDefinition(vegaVisualizationDependencies) - ); + setup.types.registerVisualization(() => + createVegaTypeDefinition(vegaVisualizationDependencies) + ); - Vis = Private(visModule.VisProvider); + Vis = Private(visModule.VisProvider); - VegaVisualization = createVegaVisualization(vegaVisualizationDependencies); - indexPattern = Private(LogstashIndexPatternStubProvider); - })); + VegaVisualization = createVegaVisualization(vegaVisualizationDependencies); + indexPattern = Private(LogstashIndexPatternStubProvider); + }) + ); describe('VegaVisualization - basics', () => { beforeEach(async function () { @@ -105,15 +107,12 @@ describe('VegaVisualizations', () => { await vegaVis.render(vegaParser, vis.params, { resize: true }); const mismatchedPixels2 = await compareImage(vegaliteImage256); expect(mismatchedPixels2).to.be.lessThan(PIXEL_DIFF); - } finally { vegaVis.destroy(); } - }); it('should show vega graph', async function () { - let vegaVis; try { vegaVis = new VegaVisualization(domNode, vis); @@ -127,20 +126,16 @@ describe('VegaVisualizations', () => { } finally { vegaVis.destroy(); } - }); it('should show vegatooltip on mouseover over a vega graph', async () => { - let vegaVis; try { - vegaVis = new VegaVisualization(domNode, vis); const vegaParser = new VegaParser(vegaTooltipGraph, new SearchCache()); await vegaParser.parseAsync(); await vegaVis.render(vegaParser, vis.params, { data: true }); - const $el = $(domNode); const offset = $el.offset(); @@ -160,27 +155,24 @@ describe('VegaVisualizations', () => { expect(tooltip).to.be.ok(); expect(tooltip.innerHTML).to.be( '

This is a long title

' + - '' + - '' + - '' + - '
fieldA:value of fld1
fld2:42
'); + '' + + '' + + '' + + '
fieldA:value of fld1
fld2:42
' + ); vegaVis.destroy(); tooltip = document.getElementById('vega-kibana-tooltip'); expect(tooltip).to.not.be.ok(); - } finally { vegaVis.destroy(); } - }); it('should show vega blank rectangle on top of a map (vegamap)', async () => { - let vegaVis; try { - vegaVis = new VegaVisualization(domNode, vis); const vegaParser = new VegaParser(vegaMapGraph, new SearchCache()); await vegaParser.parseAsync(); @@ -191,19 +183,17 @@ describe('VegaVisualizations', () => { await vegaVis.render(vegaParser, vis.params, { data: true }); const mismatchedPixels = await compareImage(vegaMapImage256); expect(mismatchedPixels).to.be.lessThan(PIXEL_DIFF); - } finally { vegaVis.destroy(); } - }); it('should add a small subpixel value to the height of the canvas to avoid getting it set to 0', async () => { let vegaVis; try { - vegaVis = new VegaVisualization(domNode, vis); - const vegaParser = new VegaParser(`{ + const vegaParser = new VegaParser( + `{ "$schema": "https://vega.github.io/schema/vega/v3.json", "marks": [ { @@ -222,7 +212,9 @@ describe('VegaVisualizations', () => { } } ] - }`, new SearchCache()); + }`, + new SearchCache() + ); await vegaParser.parseAsync(); domNode.style.width = '256px'; @@ -240,10 +232,8 @@ describe('VegaVisualizations', () => { vegaVis.destroy(); } }); - }); - async function compareImage(expectedImageSource) { const elementList = domNode.querySelectorAll('canvas'); expect(elementList.length).to.equal(1); @@ -267,5 +257,4 @@ describe('VegaVisualizations', () => { domNode.innerHTML = ''; document.body.removeChild(domNode); } - }); diff --git a/src/legacy/core_plugins/vis_type_vega/public/legacy.ts b/src/legacy/core_plugins/vis_type_vega/public/legacy.ts index 5136046b31a97..15cf97beb5717 100644 --- a/src/legacy/core_plugins/vis_type_vega/public/legacy.ts +++ b/src/legacy/core_plugins/vis_type_vega/public/legacy.ts @@ -20,13 +20,13 @@ import { PluginInitializerContext } from 'kibana/public'; import { npSetup, npStart } from 'ui/new_platform'; -import { visualizations } from '../../visualizations/public'; +import { setup as setupVisualizations } from '../../visualizations/public/np_ready/public/legacy'; import { VegaPluginSetupDependencies } from './plugin'; import { LegacyDependenciesPlugin } from './shim'; import { plugin } from '.'; const plugins: Readonly = { - visualizations, + visualizations: setupVisualizations, data: npSetup.plugins.data, // Temporary solution diff --git a/src/legacy/core_plugins/vis_type_vega/public/plugin.ts b/src/legacy/core_plugins/vis_type_vega/public/plugin.ts index 039ef49cb2289..b2a6fade883ca 100644 --- a/src/legacy/core_plugins/vis_type_vega/public/plugin.ts +++ b/src/legacy/core_plugins/vis_type_vega/public/plugin.ts @@ -25,7 +25,7 @@ import { } from '../../../../core/public'; import { LegacyDependenciesPlugin, LegacyDependenciesPluginSetup } from './shim'; import { Plugin as DataPublicPlugin } from '../../../../plugins/data/public'; -import { VisualizationsSetup } from '../../visualizations/public'; +import { VisualizationsSetup } from '../../visualizations/public/np_ready/public'; import { createVegaFn } from './vega_fn'; import { createVegaTypeDefinition } from './vega_type'; @@ -61,7 +61,7 @@ export class VegaPlugin implements Plugin, void> { data.expressions.registerFunction(() => createVegaFn(visualizationDependencies)); - visualizations.types.VisTypesRegistryProvider.register(() => + visualizations.types.registerVisualization(() => createVegaTypeDefinition(visualizationDependencies) ); } diff --git a/src/legacy/core_plugins/vis_type_vega/public/vega_type.ts b/src/legacy/core_plugins/vis_type_vega/public/vega_type.ts index 6ffcd8867ffea..d1f04c794e3c6 100644 --- a/src/legacy/core_plugins/vis_type_vega/public/vega_type.ts +++ b/src/legacy/core_plugins/vis_type_vega/public/vega_type.ts @@ -25,7 +25,7 @@ import { DefaultEditorSize } from 'ui/vis/editor_size'; import { defaultFeedbackMessage } from 'ui/vis/default_feedback_message'; import vegaEditorTemplate from './vega_editor_template.html'; -import { visFactory } from '../../visualizations/public'; +import { visFactory } from '../../visualizations/public/np_ready/public'; import { VegaVisualizationDependencies } from './plugin'; import { createVegaRequestHandler } from './vega_request_handler'; diff --git a/src/legacy/core_plugins/visualizations/index.ts b/src/legacy/core_plugins/visualizations/index.ts index bb9ef1588bdc2..3642071667f48 100644 --- a/src/legacy/core_plugins/visualizations/index.ts +++ b/src/legacy/core_plugins/visualizations/index.ts @@ -25,7 +25,7 @@ export default function VisualizationsPlugin(kibana: any) { const config: Legacy.PluginSpecOptions = { id: 'visualizations', require: ['data'], - publicDir: resolve(__dirname, 'public'), + publicDir: resolve(__dirname, 'public/np_ready/public'), config: (Joi: any) => { return Joi.object({ enabled: Joi.boolean().default(true), diff --git a/src/legacy/core_plugins/visualizations/public/np_ready/kibana.json b/src/legacy/core_plugins/visualizations/public/np_ready/kibana.json new file mode 100644 index 0000000000000..8ecf3dfce6e94 --- /dev/null +++ b/src/legacy/core_plugins/visualizations/public/np_ready/kibana.json @@ -0,0 +1,9 @@ +{ + "id": "visualizations", + "version": "kibana", + "requiredPlugins": [ + ], + "server": false, + "ui": true + } + \ No newline at end of file diff --git a/src/legacy/core_plugins/visualizations/public/filters/filters_service.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/filters/filters_service.ts similarity index 87% rename from src/legacy/core_plugins/visualizations/public/filters/filters_service.ts rename to src/legacy/core_plugins/visualizations/public/np_ready/public/filters/filters_service.ts index 60c26d7cbdc1d..51709f365dbbd 100644 --- a/src/legacy/core_plugins/visualizations/public/filters/filters_service.ts +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/filters/filters_service.ts @@ -17,8 +17,10 @@ * under the License. */ -// @ts-ignore -import { VisFiltersProvider, createFilter } from 'ui/vis/vis_filters'; +interface SetupDependecies { + VisFiltersProvider: any; + createFilter: any; +} /** * Vis Filters Service @@ -26,7 +28,7 @@ import { VisFiltersProvider, createFilter } from 'ui/vis/vis_filters'; * @internal */ export class FiltersService { - public setup() { + public setup({ VisFiltersProvider, createFilter }: SetupDependecies) { return { VisFiltersProvider, createFilter, diff --git a/src/legacy/core_plugins/visualizations/public/filters/index.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/filters/index.ts similarity index 100% rename from src/legacy/core_plugins/visualizations/public/filters/index.ts rename to src/legacy/core_plugins/visualizations/public/np_ready/public/filters/index.ts diff --git a/src/legacy/core_plugins/visualizations/public/index.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/index.ts similarity index 53% rename from src/legacy/core_plugins/visualizations/public/index.ts rename to src/legacy/core_plugins/visualizations/public/np_ready/public/index.ts index 10fef3112335b..d38acaa3cf3f2 100644 --- a/src/legacy/core_plugins/visualizations/public/index.ts +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/index.ts @@ -17,43 +17,11 @@ * under the License. */ -import { FiltersService, FiltersSetup } from './filters'; -import { TypesService, TypesSetup } from './types'; - -class VisualizationsPlugin { - private readonly filters: FiltersService; - private readonly types: TypesService; - - constructor() { - this.filters = new FiltersService(); - this.types = new TypesService(); - } - - public setup() { - return { - filters: this.filters.setup(), - types: this.types.setup(), - }; - } - - public stop() { - this.filters.stop(); - this.types.stop(); - } -} - -/** - * We export visualizations here so that users importing from 'plugins/visualizations' - * will automatically receive the response value of the `setup` contract, mimicking - * the data that will eventually be injected by the new platform. - */ -export const visualizations = new VisualizationsPlugin().setup(); +import { PluginInitializerContext } from 'src/core/public'; +import { VisualizationsPublicPlugin, Setup } from './plugin'; /** @public */ -export interface VisualizationsSetup { - filters: FiltersSetup; - types: TypesSetup; -} +export type VisualizationsSetup = Setup; /** @public types */ export { @@ -69,3 +37,9 @@ export { VisTypesRegistry, Status, } from './types'; + +export function plugin(initializerContext: PluginInitializerContext) { + return new VisualizationsPublicPlugin(initializerContext); +} + +export { VisualizationsPublicPlugin as Plugin }; diff --git a/src/legacy/core_plugins/visualizations/public/np_ready/public/legacy.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/legacy.ts new file mode 100644 index 0000000000000..04a49294bd0c6 --- /dev/null +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/legacy.ts @@ -0,0 +1,50 @@ +/* + * 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. + */ +/* eslint-disable @kbn/eslint/no-restricted-paths */ +import { npSetup, npStart } from 'ui/new_platform'; +// @ts-ignore +import { VisFiltersProvider, createFilter } from 'ui/vis/vis_filters'; +// @ts-ignore +import { defaultFeedbackMessage } from 'ui/vis/default_feedback_message'; +// @ts-ignore +import { VisProvider as Vis } from 'ui/vis/index.js'; +// @ts-ignore +import { VisFactoryProvider } from 'ui/vis/vis_factory'; +import { VisTypesRegistryProvider } from 'ui/registry/vis_types'; +/* eslint-enable @kbn/eslint/no-restricted-paths */ + +import { visTypeAliasRegistry } from './types/vis_type_alias_registry'; + +import { plugin } from '.'; + +const pluginInstance = plugin({} as any); + +export const setup = pluginInstance.setup(npSetup.core, { + __LEGACY: { + VisFiltersProvider, + createFilter, + + Vis, + VisFactoryProvider, + VisTypesRegistryProvider, + defaultFeedbackMessage, + visTypeAliasRegistry, + }, +}); +export const start = pluginInstance.start(npStart.core); 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 new file mode 100644 index 0000000000000..df5e4d25dedcc --- /dev/null +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/mocks.ts @@ -0,0 +1,92 @@ +/* + * 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. + */ + +/* eslint-disable @kbn/eslint/no-restricted-paths */ +jest.mock('ui/vis/vis_filters'); +jest.mock('ui/vis/default_feedback_message'); +jest.mock('ui/vis/index.js'); +jest.mock('ui/vis/vis_factory'); +jest.mock('ui/registry/vis_types'); +// @ts-ignore +import { VisFiltersProvider, createFilter } from 'ui/vis/vis_filters'; +// @ts-ignore +import { defaultFeedbackMessage } from 'ui/vis/default_feedback_message'; +// @ts-ignore +import { VisProvider as Vis } from 'ui/vis/index.js'; +// @ts-ignore +import { VisFactoryProvider } from 'ui/vis/vis_factory'; +import { VisTypesRegistryProvider } from 'ui/registry/vis_types'; +/* eslint-enable @kbn/eslint/no-restricted-paths */ +jest.mock('./types/vis_type_alias_registry'); +import { visTypeAliasRegistry } from './types/vis_type_alias_registry'; + +import { Plugin } from '.'; +import { coreMock } from '../../../../../../core/public/mocks'; + +export type Setup = jest.Mocked>; +export type Start = jest.Mocked>; + +const createSetupContract = (): Setup => ({ + filters: { + VisFiltersProvider: jest.fn(), + createFilter: jest.fn(), + }, + types: { + Vis, + VisFactoryProvider: jest.fn(), + registerVisualization: jest.fn(), + defaultFeedbackMessage, + visTypeAliasRegistry: { + add: jest.fn(), + get: jest.fn(), + }, + }, +}); + +const createStartContract = (): Start => {}; + +const createInstance = () => { + const plugin = new Plugin({} as any); + + const setup = plugin.setup(coreMock.createSetup(), { + __LEGACY: { + VisFiltersProvider, + createFilter, + + Vis, + VisFactoryProvider, + VisTypesRegistryProvider, + defaultFeedbackMessage, + visTypeAliasRegistry, + }, + }); + const doStart = () => plugin.start(coreMock.createStart()); + + return { + plugin, + setup, + doStart, + }; +}; + +export const visualizationsPluginMock = { + createSetupContract, + createStartContract, + createInstance, +}; 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 new file mode 100644 index 0000000000000..abf5974b77532 --- /dev/null +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/plugin.ts @@ -0,0 +1,88 @@ +/* + * 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 { PluginInitializerContext, CoreSetup, CoreStart, Plugin } from 'src/core/public'; + +import { FiltersService, FiltersSetup } from './filters'; +import { TypesService, TypesSetup } from './types'; +import { VisTypeAliasRegistry } from './types/vis_type_alias_registry'; + +interface SetupDependencies { + __LEGACY: { + VisFiltersProvider: any; + createFilter: any; + + Vis: any; + VisFactoryProvider: any; + VisTypesRegistryProvider: any; + defaultFeedbackMessage: any; + visTypeAliasRegistry: VisTypeAliasRegistry; + }; +} + +export interface Setup { + filters: FiltersSetup; + types: TypesSetup; +} + +export type Start = void; + +export class VisualizationsPublicPlugin implements Plugin { + private readonly filters: FiltersService; + private readonly types: TypesService; + + constructor(initializerContext: PluginInitializerContext) { + this.filters = new FiltersService(); + this.types = new TypesService(); + } + + public setup(core: CoreSetup, { __LEGACY }: SetupDependencies) { + const { + VisFiltersProvider, + createFilter, + Vis, + VisFactoryProvider, + VisTypesRegistryProvider, + defaultFeedbackMessage, + visTypeAliasRegistry, + } = __LEGACY; + + return { + filters: this.filters.setup({ + VisFiltersProvider, + createFilter, + }), + types: this.types.setup({ + Vis, + VisFactoryProvider, + VisTypesRegistryProvider, + defaultFeedbackMessage, + visTypeAliasRegistry, + }), + }; + } + + public start(core: CoreStart) { + // Do nothing yet... + } + + public stop() { + this.filters.stop(); + this.types.stop(); + } +} diff --git a/src/legacy/core_plugins/visualizations/public/types/index.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/types/index.ts similarity index 100% rename from src/legacy/core_plugins/visualizations/public/types/index.ts rename to src/legacy/core_plugins/visualizations/public/np_ready/public/types/index.ts diff --git a/src/legacy/core_plugins/visualizations/public/types/types_service.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/types/types_service.ts similarity index 72% rename from src/legacy/core_plugins/visualizations/public/types/types_service.ts rename to src/legacy/core_plugins/visualizations/public/np_ready/public/types/types_service.ts index cb5328812b406..28574917ba1bb 100644 --- a/src/legacy/core_plugins/visualizations/public/types/types_service.ts +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/types/types_service.ts @@ -17,18 +17,23 @@ * under the License. */ +/* eslint-disable @kbn/eslint/no-restricted-paths */ // @ts-ignore -import { defaultFeedbackMessage } from 'ui/vis/default_feedback_message'; -// @ts-ignore -import { VisProvider as Vis } from 'ui/vis/index.js'; -// @ts-ignore -import { VisFactoryProvider, visFactory } from 'ui/vis/vis_factory'; +import { visFactory } from 'ui/vis/vis_factory'; // @ts-ignore import { DefaultEditorSize } from 'ui/vis/editor_size'; -import { VisTypesRegistryProvider } from 'ui/registry/vis_types'; import * as types from 'ui/vis/vis'; +/* eslint-enable @kbn/eslint/no-restricted-paths */ -import { visTypeAliasRegistry, VisTypeAlias } from './vis_type_alias_registry'; +import { VisTypeAliasRegistry, VisTypeAlias } from './vis_type_alias_registry'; + +interface SetupDependencies { + Vis: any; + VisFactoryProvider: any; + VisTypesRegistryProvider: any; + defaultFeedbackMessage: any; + visTypeAliasRegistry: VisTypeAliasRegistry; +} /** * Vis Types Service @@ -36,11 +41,19 @@ import { visTypeAliasRegistry, VisTypeAlias } from './vis_type_alias_registry'; * @internal */ export class TypesService { - public setup() { + public setup({ + Vis, + VisFactoryProvider, + VisTypesRegistryProvider, + defaultFeedbackMessage, + visTypeAliasRegistry, + }: SetupDependencies) { return { Vis, VisFactoryProvider, - VisTypesRegistryProvider, + registerVisualization: (registerFn: () => any) => { + VisTypesRegistryProvider.register(registerFn); + }, defaultFeedbackMessage, // make default in base vis type, or move? visTypeAliasRegistry, }; diff --git a/src/legacy/core_plugins/visualizations/public/types/vis_type_alias_registry.ts b/src/legacy/core_plugins/visualizations/public/np_ready/public/types/vis_type_alias_registry.ts similarity index 90% rename from src/legacy/core_plugins/visualizations/public/types/vis_type_alias_registry.ts rename to src/legacy/core_plugins/visualizations/public/np_ready/public/types/vis_type_alias_registry.ts index 91040cf966567..eb84f93a0d3ba 100644 --- a/src/legacy/core_plugins/visualizations/public/types/vis_type_alias_registry.ts +++ b/src/legacy/core_plugins/visualizations/public/np_ready/public/types/vis_type_alias_registry.ts @@ -52,7 +52,12 @@ export interface VisTypeAlias { const registry: VisTypeAlias[] = []; -export const visTypeAliasRegistry = { +export interface VisTypeAliasRegistry { + get: () => VisTypeAlias[]; + add: (newVisTypeAlias: VisTypeAlias) => void; +} + +export const visTypeAliasRegistry: VisTypeAliasRegistry = { get: () => [...registry], add: (newVisTypeAlias: VisTypeAlias) => { if (registry.find(visTypeAlias => visTypeAlias.name === newVisTypeAlias.name)) { diff --git a/x-pack/legacy/plugins/maps/public/register_vis_type_alias.js b/x-pack/legacy/plugins/maps/public/register_vis_type_alias.js index 726d1ef260106..0799e59bbb011 100644 --- a/x-pack/legacy/plugins/maps/public/register_vis_type_alias.js +++ b/x-pack/legacy/plugins/maps/public/register_vis_type_alias.js @@ -4,21 +4,20 @@ * you may not use this file except in compliance with the Elastic License. */ -import { visualizations } from 'plugins/visualizations'; +import { setup } from '../../../../../src/legacy/core_plugins/visualizations/public/np_ready/public/legacy'; import { i18n } from '@kbn/i18n'; import { APP_ID, APP_ICON, MAP_BASE_URL } from '../common/constants'; -visualizations.types.visTypeAliasRegistry.add({ +setup.types.visTypeAliasRegistry.add({ aliasUrl: MAP_BASE_URL, name: APP_ID, title: i18n.translate('xpack.maps.visTypeAlias.title', { - defaultMessage: 'Maps' + defaultMessage: 'Maps', }), description: i18n.translate('xpack.maps.visTypeAlias.description', { defaultMessage: `Create and style maps with multiple layers and indices. Use the Maps app instead of Coordinate Map and Region Map. -The Maps app offers more functionality and is easier to use.` +The Maps app offers more functionality and is easier to use.`, }), icon: APP_ICON, }); -