Move top nav to NP (#52877) (#53114)

* Move top nav to NP

* TopNavMenu karma mock

* Fixed lens test mocking
Removed old plugin code

* readme

* Code review fixes

* lint

* ts

.i18nrc.json

@@ -4,7 +4,10 @@
  "console": "src/legacy/core_plugins/console",
  "core": "src/core",
  "dashboardEmbeddableContainer": "src/plugins/dashboard_embeddable_container",
- "data": ["src/legacy/core_plugins/data", "src/plugins/data"],
+ "data": [
+ "src/legacy/core_plugins/data",
+ "src/plugins/data"
+ ],
  "embeddableApi": "src/plugins/embeddable",
  "share": "src/plugins/share",
  "esUi": "src/plugins/es_ui_shared",
@@ -21,7 +24,7 @@
  "kibana_react": "src/legacy/core_plugins/kibana_react",
  "kibana-react": "src/plugins/kibana_react",
  "kibana_utils": "src/plugins/kibana_utils",
- "navigation": "src/legacy/core_plugins/navigation",
+ "navigation": "src/plugins/navigation",
  "newsfeed": "src/plugins/newsfeed",
  "regionMap": "src/legacy/core_plugins/region_map",
  "server": "src/legacy/server",
@@ -36,8 +39,13 @@
  "visTypeTagCloud": "src/legacy/core_plugins/vis_type_tagcloud",
  "visTypeTimeseries": "src/legacy/core_plugins/vis_type_timeseries",
  "visTypeVega": "src/legacy/core_plugins/vis_type_vega",
- "visualizations": ["src/plugins/visualizations", "src/legacy/core_plugins/visualizations"]
+ "visualizations": [
+ "src/plugins/visualizations",
+ "src/legacy/core_plugins/visualizations"
+ ]
  },
- "exclude": ["src/legacy/ui/ui_render/ui_render_mixin.js"],
+ "exclude": [
+ "src/legacy/ui/ui_render/ui_render_mixin.js"
+ ],
  "translations": []
-}
+}

src/legacy/core_plugins/kibana/public/dashboard/application.ts

@@ -48,7 +48,7 @@ import {
 // @ts-ignore
 import { initDashboardApp } from './legacy_app';
 import { IEmbeddableStart } from '../../../../../plugins/embeddable/public';
-import { NavigationStart } from '../../../navigation/public';
+import { NavigationPublicPluginStart as NavigationStart } from '../../../../../plugins/navigation/public';
 import { DataPublicPluginStart as NpDataStart } from '../../../../../plugins/data/public';
 import { SharePluginStart } from '../../../../../plugins/share/public';
 

src/legacy/core_plugins/kibana/public/dashboard/index.ts

@@ -27,7 +27,6 @@ import {
 import { DashboardPlugin, LegacyAngularInjectedDependencies } from './plugin';
 import { start as data } from '../../../data/public/legacy';
 import { start as embeddables } from '../../../embeddable_api/public/np_ready/public/legacy';
-import { start as navigation } from '../../../navigation/public/legacy';
 import './saved_dashboard/saved_dashboards';
 import './dashboard_config';
 
@@ -62,6 +61,6 @@ async function getAngularDependencies(): Promise<LegacyAngularInjectedDependenci
  data,
  npData: npStart.plugins.data,
  embeddables,
- navigation,
+ navigation: npStart.plugins.navigation,
  });
 })();

src/legacy/core_plugins/kibana/public/dashboard/plugin.ts

@@ -31,7 +31,7 @@ import { DataStart } from '../../../data/public';
 import { DataPublicPluginStart as NpDataStart } from '../../../../../plugins/data/public';
 import { IEmbeddableStart } from '../../../../../plugins/embeddable/public';
 import { Storage } from '../../../../../plugins/kibana_utils/public';
-import { NavigationStart } from '../../../navigation/public';
+import { NavigationPublicPluginStart as NavigationStart } from '../../../../../plugins/navigation/public';
 import { DashboardConstants } from './dashboard_constants';
 import { SharePluginStart } from '../../../../../plugins/share/public';
 import {

src/legacy/core_plugins/kibana/public/discover/get_inner_angular.ts

@@ -68,7 +68,7 @@ import { createTopNavDirective, createTopNavHelper } from 'ui/kbn_top_nav/kbn_to
 import { configureAppAngularModule } from 'ui/legacy_compat';
 import { IndexPatterns } from '../../../../../plugins/data/public';
 import { Storage } from '../../../../../plugins/kibana_utils/public';
-import { NavigationStart } from '../../../navigation/public';
+import { NavigationPublicPluginStart as NavigationStart } from '../../../../../plugins/navigation/public';
 import { createDocTableDirective } from './angular/doc_table/doc_table';
 import { createTableHeaderDirective } from './angular/doc_table/components/table_header';
 import {

src/legacy/core_plugins/kibana/public/discover/index.ts

@@ -20,7 +20,6 @@ import { PluginInitializer, PluginInitializerContext } from 'kibana/public';
 import { npSetup, npStart } from 'ui/new_platform';
 import { SavedObjectRegistryProvider } from 'ui/saved_objects';
 import { DiscoverPlugin, DiscoverSetup, DiscoverStart } from './plugin';
-import { start as navigation } from '../../../navigation/public/legacy';
 
 // Core will be looking for this when loading our plugin in the new platform
 export const plugin: PluginInitializer<DiscoverSetup, DiscoverStart> = (
@@ -33,7 +32,7 @@ export const plugin: PluginInitializer<DiscoverSetup, DiscoverStart> = (
 export const pluginInstance = plugin({} as PluginInitializerContext);
 (async () => {
  pluginInstance.setup(npSetup.core, npSetup.plugins);
- pluginInstance.start(npStart.core, { ...npStart.plugins, navigation });
+ pluginInstance.start(npStart.core, npStart.plugins);
 })();
 
 SavedObjectRegistryProvider.register((savedSearches: any) => {

src/legacy/core_plugins/kibana/public/discover/plugin.ts

@@ -25,7 +25,7 @@ import './kibana_services';
 import { IEmbeddableStart, IEmbeddableSetup } from '../../../../../plugins/embeddable/public';
 import { getInnerAngularModule, getInnerAngularModuleEmbeddable } from './get_inner_angular';
 import { setAngularModule, setServices } from './kibana_services';
-import { NavigationStart } from '../../../navigation/public';
+import { NavigationPublicPluginStart as NavigationStart } from '../../../../../plugins/navigation/public';
 import { EuiUtilsStart } from '../../../../../plugins/eui_utils/public';
 import { buildServices } from './helpers/build_services';
 import { SharePluginStart } from '../../../../../plugins/share/public';

src/legacy/core_plugins/kibana/public/visualize/application.ts

@@ -39,7 +39,7 @@ import {
  PromiseServiceCreator,
  StateManagementConfigProvider,
 } from './legacy_imports';
-import { NavigationStart } from '../../../navigation/public';
+import { NavigationPublicPluginStart as NavigationStart } from '../../../../../plugins/navigation/public';
 
 // @ts-ignore
 import { initVisualizeApp } from './legacy_app';

src/legacy/core_plugins/kibana/public/visualize/index.ts

@@ -30,7 +30,6 @@ import {
 } from './legacy_imports';
 import { VisualizePlugin, LegacyAngularInjectedDependencies } from './plugin';
 import { start as embeddables } from '../../../embeddable_api/public/np_ready/public/legacy';
-import { start as navigation } from '../../../navigation/public/legacy';
 import { start as visualizations } from '../../../visualizations/public/np_ready/public/legacy';
 
 /**
@@ -64,7 +63,6 @@ async function getAngularDependencies(): Promise<LegacyAngularInjectedDependenci
  instance.start(npStart.core, {
  ...npStart.plugins,
  embeddables,
- navigation,
  visualizations,
  });
 })();

src/legacy/core_plugins/kibana/public/visualize/kibana_services.ts

@@ -25,7 +25,7 @@ import {
  IUiSettingsClient,
 } from 'kibana/public';
 
-import { NavigationStart } from '../../../navigation/public';
+import { NavigationPublicPluginStart as NavigationStart } from '../../../../../plugins/navigation/public';
 import { Storage } from '../../../../../plugins/kibana_utils/public';
 import { IEmbeddableStart } from '../../../../../plugins/embeddable/public';
 import { SharePluginStart } from '../../../../../plugins/share/public';

src/legacy/core_plugins/kibana/public/visualize/plugin.ts

@@ -30,7 +30,7 @@ import {
 import { Storage } from '../../../../../plugins/kibana_utils/public';
 import { DataPublicPluginStart } from '../../../../../plugins/data/public';
 import { IEmbeddableStart } from '../../../../../plugins/embeddable/public';
-import { NavigationStart } from '../../../navigation/public';
+import { NavigationPublicPluginStart as NavigationStart } from '../../../../../plugins/navigation/public';
 import { SharePluginStart } from '../../../../../plugins/share/public';
 import { KibanaLegacySetup } from '../../../../../plugins/kibana_legacy/public';
 import { VisualizationsStart } from '../../../visualizations/public';

src/legacy/core_plugins/navigation/public/index.scss

@@ -1,3 +1,3 @@
 @import 'src/legacy/ui/public/styles/styling_constants';
 
-@import './top_nav_menu/index';
+@import '../../../../plugins/navigation/public/top_nav_menu/index';

src/legacy/core_plugins/navigation/public/index.ts

@@ -21,12 +21,3 @@
 // Once the new platform is ready, they can get removed
 // and handled by the platform itself in the setup method
 // of the ExpressionExectorService
-
-/** @public types */
-export { TopNavMenu, TopNavMenuData } from './top_nav_menu';
-export { NavigationSetup, NavigationStart } from './plugin';
-
-import { NavigationPlugin as Plugin } from './plugin';
-export function plugin() {
- return new Plugin();
-}

src/legacy/ui/public/kbn_top_nav/kbn_top_nav.js

@@ -20,7 +20,7 @@
 import 'ngreact';
 import { wrapInI18nContext } from 'ui/i18n';
 import { uiModules } from 'ui/modules';
-import { start as navigation } from '../../../core_plugins/navigation/public/legacy';
+import { npStart } from 'ui/new_platform';
 
 const module = uiModules.get('kibana');
 
@@ -116,4 +116,4 @@ export const createTopNavHelper = ({ TopNavMenu }) => reactDirective => {
  ]);
 };
 
-module.directive('kbnTopNavHelper', createTopNavHelper(navigation.ui));
+module.directive('kbnTopNavHelper', createTopNavHelper(npStart.plugins.navigation.ui));

src/legacy/ui/public/new_platform/__mocks__/helpers.ts

@@ -21,6 +21,7 @@
 import { coreMock } from '../../../../../core/public/mocks';
 import { dataPluginMock } from '../../../../../plugins/data/public/mocks';
 import { embeddablePluginMock } from '../../../../../plugins/embeddable/public/mocks';
+import { navigationPluginMock } from '../../../../../plugins/navigation/public/mocks';
 import { expressionsPluginMock } from '../../../../../plugins/expressions/public/mocks';
 import { inspectorPluginMock } from '../../../../../plugins/inspector/public/mocks';
 import { uiActionsPluginMock } from '../../../../../plugins/ui_actions/public/mocks';
@@ -30,6 +31,7 @@ import { usageCollectionPluginMock } from '../../../../../plugins/usage_collecti
 export const pluginsMock = {
  createSetup: () => ({
  data: dataPluginMock.createSetupContract(),
+ navigation: navigationPluginMock.createSetupContract(),
  embeddable: embeddablePluginMock.createSetupContract(),
  inspector: inspectorPluginMock.createSetupContract(),
  expressions: expressionsPluginMock.createSetupContract(),
@@ -38,6 +40,7 @@ export const pluginsMock = {
  }),
  createStart: () => ({
  data: dataPluginMock.createStartContract(),
+ navigation: navigationPluginMock.createStartContract(),
  embeddable: embeddablePluginMock.createStartContract(),
  inspector: inspectorPluginMock.createStartContract(),
  expressions: expressionsPluginMock.createStartContract(),

src/legacy/ui/public/new_platform/new_platform.karma_mock.js

@@ -244,6 +244,11 @@ export const npStart = {
  register: sinon.fake(),
  },
  },
+ navigation: {
+ ui: {
+ TopNavMenu: mockComponent,
+ },
+ },
  },
 };
 

src/legacy/ui/public/new_platform/new_platform.ts

@@ -34,6 +34,10 @@ import { HomePublicPluginSetup, HomePublicPluginStart } from '../../../../plugin
 import { SharePluginSetup, SharePluginStart } from '../../../../plugins/share/public';
 import { BfetchPublicSetup, BfetchPublicStart } from '../../../../plugins/bfetch/public';
 import { UsageCollectionSetup } from '../../../../plugins/usage_collection/public';
+import {
+ NavigationPublicPluginSetup,
+ NavigationPublicPluginStart,
+} from '../../../../plugins/navigation/public';
 
 export interface PluginsSetup {
  bfetch: BfetchPublicSetup;
@@ -43,6 +47,7 @@ export interface PluginsSetup {
  home: HomePublicPluginSetup;
  inspector: InspectorSetup;
  uiActions: IUiActionsSetup;
+ navigation: NavigationPublicPluginSetup;
  dev_tools: DevToolsSetup;
  kibana_legacy: KibanaLegacySetup;
  share: SharePluginSetup;
@@ -58,6 +63,7 @@ export interface PluginsStart {
  home: HomePublicPluginStart;
  inspector: InspectorStart;
  uiActions: IUiActionsStart;
+ navigation: NavigationPublicPluginStart;
  dev_tools: DevToolsStart;
  kibana_legacy: KibanaLegacyStart;
  share: SharePluginStart;

src/plugins/navigation/README.md

@@ -0,0 +1,5 @@
+# navigation
+
+The navigation plugins exports the `TopNavMenu` component.
+It also provides a stateful version of it on the `start` contract.
+

src/plugins/navigation/kibana.json

@@ -0,0 +1,7 @@
+{
+ "id": "navigation",
+ "version": "kibana",
+ "server": false,
+ "ui": true,
+ "requiredPlugins": ["data"]
+}

src/plugins/navigation/public/index.ts

@@ -0,0 +1,31 @@
+/*
+ * 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 } from '../../../core/public';
+export function plugin(initializerContext: PluginInitializerContext) {
+ return new NavigationPublicPlugin(initializerContext);
+}
+
+export { TopNavMenuData, TopNavMenu } from './top_nav_menu';
+
+export { NavigationPublicPluginSetup, NavigationPublicPluginStart } from './types';
+
+// Export plugin after all other imports
+import { NavigationPublicPlugin } from './plugin';
+export { NavigationPublicPlugin as Plugin };

src/plugins/navigation/public/mocks.ts

@@ -0,0 +1,44 @@
+/*
+ * 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 { Plugin } from '.';
+
+export type Setup = jest.Mocked<ReturnType<Plugin['setup']>>;
+export type Start = jest.Mocked<ReturnType<Plugin['start']>>;
+
+const createSetupContract = (): jest.Mocked<Setup> => {
+ const setupContract = {
+ registerMenuItem: jest.fn(),
+ };
+
+ return setupContract;
+};
+
+const createStartContract = (): jest.Mocked<Start> => {
+ const startContract = {
+ ui: {
+ TopNavMenu: jest.fn(),
+ },
+ };
+ return startContract;
+};
+
+export const navigationPluginMock = {
+ createSetupContract,
+ createStartContract,
+};