From d7bae779a301ca30df106152afd2e9d0fe0f64e8 Mon Sep 17 00:00:00 2001 From: Hailong Cui Date: Wed, 14 Jun 2023 14:53:13 +0800 Subject: [PATCH 01/12] navigation changes and overview page Signed-off-by: Hailong Cui --- src/core/types/index.ts | 1 + src/core/types/plugin_pages.ts | 10 ++ .../dev_tools/opensearch_dashboards.json | 2 +- src/plugins/dev_tools/public/plugin.ts | 30 ++++- .../management/opensearch_dashboards.json | 4 +- .../public/components/landing/landing.tsx | 4 +- src/plugins/management/public/plugin.ts | 56 +++++---- .../management_overview/common/constants.ts | 6 + .../opensearch_dashboards.json | 8 ++ .../public/application.tsx | 67 ++++++++++ .../__snapshots__/overview_card.test.tsx.snap | 114 ++++++++++++++++++ .../public/components/overview_card/index.ts | 6 + .../overview_card/overview_card.test.tsx | 62 ++++++++++ .../overview_card/overview_card.tsx | 57 +++++++++ .../management_overview/public/index.ts | 11 ++ .../public/overview_app.ts | 13 ++ .../management_overview/public/plugin.ts | 98 +++++++++++++++ 17 files changed, 520 insertions(+), 29 deletions(-) create mode 100644 src/core/types/plugin_pages.ts create mode 100644 src/plugins/management_overview/common/constants.ts create mode 100644 src/plugins/management_overview/opensearch_dashboards.json create mode 100644 src/plugins/management_overview/public/application.tsx create mode 100644 src/plugins/management_overview/public/components/overview_card/__snapshots__/overview_card.test.tsx.snap create mode 100644 src/plugins/management_overview/public/components/overview_card/index.ts create mode 100644 src/plugins/management_overview/public/components/overview_card/overview_card.test.tsx create mode 100644 src/plugins/management_overview/public/components/overview_card/overview_card.tsx create mode 100644 src/plugins/management_overview/public/index.ts create mode 100644 src/plugins/management_overview/public/overview_app.ts create mode 100644 src/plugins/management_overview/public/plugin.ts diff --git a/src/core/types/index.ts b/src/core/types/index.ts index 9f620273e3b2..781ee122a6ed 100644 --- a/src/core/types/index.ts +++ b/src/core/types/index.ts @@ -39,3 +39,4 @@ export * from './ui_settings'; export * from './saved_objects'; export * from './serializable'; export * from './custom_branding'; +export * from './plugin_pages'; diff --git a/src/core/types/plugin_pages.ts b/src/core/types/plugin_pages.ts new file mode 100644 index 000000000000..361461743491 --- /dev/null +++ b/src/core/types/plugin_pages.ts @@ -0,0 +1,10 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +export interface PluginPages { + title: string; + url: string; + order: number; +} diff --git a/src/plugins/dev_tools/opensearch_dashboards.json b/src/plugins/dev_tools/opensearch_dashboards.json index 11fd6c3b62c7..97dbe29f3001 100644 --- a/src/plugins/dev_tools/opensearch_dashboards.json +++ b/src/plugins/dev_tools/opensearch_dashboards.json @@ -3,7 +3,7 @@ "version": "opensearchDashboards", "server": false, "ui": true, - "optionalPlugins": ["dataSource"], + "optionalPlugins": ["dataSource", "managementOverview"], "requiredPlugins": ["urlForwarding"], "requiredBundles": ["dataSourceManagement"] } diff --git a/src/plugins/dev_tools/public/plugin.ts b/src/plugins/dev_tools/public/plugin.ts index 02663da57686..686be8e8ca3d 100644 --- a/src/plugins/dev_tools/public/plugin.ts +++ b/src/plugins/dev_tools/public/plugin.ts @@ -29,7 +29,7 @@ */ import { BehaviorSubject } from 'rxjs'; -import { Plugin, CoreSetup, AppMountParameters } from 'src/core/public'; +import { Plugin, CoreSetup, AppMountParameters, CoreStart } from 'src/core/public'; import { AppUpdater } from 'opensearch-dashboards/public'; import { i18n } from '@osd/i18n'; import { sortBy } from 'lodash'; @@ -40,10 +40,17 @@ import { UrlForwardingSetup } from '../../url_forwarding/public'; import { CreateDevToolArgs, DevToolApp, createDevToolApp } from './dev_tool'; import './index.scss'; +import { PluginPages } from '../../../core/types'; +import { ManagementOverViewPluginStart } from '../../management_overview/public'; export interface DevToolsSetupDependencies { dataSource?: DataSourcePluginStart; } + +export interface DevToolsStartDependencies { + managementOverview?: ManagementOverViewPluginStart; +} + export interface DevToolsSetup { /** * Register a developer tool. It will be available @@ -79,7 +86,7 @@ export class DevToolsPlugin implements Plugin { }), updater$: this.appStateUpdater, icon: '/plugins/home/public/assets/logos/opensearch_mark_default.svg', - order: 9010, + order: 9070, category: DEFAULT_APP_CATEGORIES.management, mount: async (params: AppMountParameters) => { const { element, history } = params; @@ -109,9 +116,26 @@ export class DevToolsPlugin implements Plugin { }; } - public start() { + public start(core: CoreStart, { managementOverview }: DevToolsStartDependencies) { if (this.getSortedDevTools().length === 0) { this.appStateUpdater.next(() => ({ navLinkStatus: AppNavLinkStatus.hidden })); + } else { + const features: PluginPages[] = this.getSortedDevTools().map((devApp) => { + return { + title: devApp.title, + url: `#/${devApp.id}`, + order: devApp.order, + }; + }); + + managementOverview?.register({ + id: 'dev_tools', + title: i18n.translate('devTools.devToolsTitle', { + defaultMessage: 'Dev Tools', + }), + order: 9070, + pages: features, + }); } } diff --git a/src/plugins/management/opensearch_dashboards.json b/src/plugins/management/opensearch_dashboards.json index 5f08e79223ec..cf7d7d781f16 100644 --- a/src/plugins/management/opensearch_dashboards.json +++ b/src/plugins/management/opensearch_dashboards.json @@ -3,6 +3,6 @@ "version": "opensearchDashboards", "server": true, "ui": true, - "optionalPlugins": ["home"], - "requiredBundles": ["opensearchDashboardsReact", "opensearchDashboardsUtils", "home"] + "optionalPlugins": ["home", "managementOverview"], + "requiredBundles": ["opensearchDashboardsReact", "opensearchDashboardsUtils"] } diff --git a/src/plugins/management/public/components/landing/landing.tsx b/src/plugins/management/public/components/landing/landing.tsx index 8c44f014d8e8..467c0feeb56f 100644 --- a/src/plugins/management/public/components/landing/landing.tsx +++ b/src/plugins/management/public/components/landing/landing.tsx @@ -61,7 +61,7 @@ export const ManagementLandingPage = ({ version, setBreadcrumbs }: ManagementLan

@@ -69,7 +69,7 @@ export const ManagementLandingPage = ({ version, setBreadcrumbs }: ManagementLan diff --git a/src/plugins/management/public/plugin.ts b/src/plugins/management/public/plugin.ts index b50b2dba2477..19ea3b05aad4 100644 --- a/src/plugins/management/public/plugin.ts +++ b/src/plugins/management/public/plugin.ts @@ -31,7 +31,7 @@ import { i18n } from '@osd/i18n'; import { BehaviorSubject } from 'rxjs'; import { ManagementSetup, ManagementStart } from './types'; -import { FeatureCatalogueCategory, HomePublicPluginSetup } from '../../home/public'; +import { HomePublicPluginSetup } from '../../home/public'; import { CoreSetup, CoreStart, @@ -49,11 +49,17 @@ import { ManagementSectionsService, getSectionsServiceStartPrivate, } from './management_sections_service'; +import { PluginPages } from '../../../core/types'; +import { ManagementOverViewPluginStart } from '../../management_overview/public'; interface ManagementSetupDependencies { home?: HomePublicPluginSetup; } +interface ManagementStartDependencies { + managementOverview?: ManagementOverViewPluginStart; +} + export class ManagementPlugin implements Plugin { private readonly managementSections = new ManagementSectionsService(); @@ -66,29 +72,12 @@ export class ManagementPlugin implements Plugin this.hasAnyEnabledApps, - }); - } - core.application.register({ id: MANAGEMENT_APP_ID, title: i18n.translate('management.stackManagement.title', { - defaultMessage: 'Stack Management', + defaultMessage: 'Dashboard Management', }), - order: 9040, + order: 9030, icon: '/plugins/home/assets/logos/opensearch_mark_default.svg', category: DEFAULT_APP_CATEGORIES.management, updater$: this.appUpdater, @@ -109,7 +98,7 @@ export class ManagementPlugin implements Plugin section.apps) + .flat() + .map((app) => { + return { + title: app.title, + url: app.basePath, + order: app.order, + }; + }); + + if (pluginPages) { + managementOverview.register({ + id: MANAGEMENT_APP_ID, + title: i18n.translate('management.stackManagement.title', { + defaultMessage: 'Dashboard Management', + }), + order: 9030, + pages: pluginPages, + }); + } + } + return {}; } } diff --git a/src/plugins/management_overview/common/constants.ts b/src/plugins/management_overview/common/constants.ts new file mode 100644 index 000000000000..a6734c4e34bc --- /dev/null +++ b/src/plugins/management_overview/common/constants.ts @@ -0,0 +1,6 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +export const MANAGEMENT_OVERVIEW_PLUGIN_ID = 'opensearch_management_overview'; diff --git a/src/plugins/management_overview/opensearch_dashboards.json b/src/plugins/management_overview/opensearch_dashboards.json new file mode 100644 index 000000000000..aaa68f64940b --- /dev/null +++ b/src/plugins/management_overview/opensearch_dashboards.json @@ -0,0 +1,8 @@ +{ + "id": "managementOverview", + "version": "opensearchDashboards", + "ui": true, + "server": false, + "requiredPlugins": ["navigation", "home"], + "optionalPlugins": [] +} diff --git a/src/plugins/management_overview/public/application.tsx b/src/plugins/management_overview/public/application.tsx new file mode 100644 index 000000000000..fa5baef09947 --- /dev/null +++ b/src/plugins/management_overview/public/application.tsx @@ -0,0 +1,67 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import ReactDOM from 'react-dom'; +import { I18nProvider } from '@osd/i18n/react'; +import React from 'react'; +import { EuiFlexGrid, EuiFlexItem, EuiPanel, EuiSpacer, EuiTitle } from '@elastic/eui'; +import { i18n } from '@osd/i18n'; +import { ApplicationStart, CoreStart } from '../../../core/public'; +import { OverviewApp } from './overview_app'; +import { OverviewCard } from './components/overview_card'; + +export interface ManagementOverviewProps { + application: ApplicationStart; + overviewApps?: OverviewApp[]; +} + +function ManagementOverviewWrapper(props: ManagementOverviewProps) { + const { application, overviewApps } = props; + + const onClick = (appId: string) => { + return (url: string) => { + const pageUrl = application.getUrlForApp(appId, { path: url }); + application.navigateToUrl(pageUrl); + }; + }; + + const title = i18n.translate('core.ui.managementNavList.label', { + defaultMessage: 'Management', + }); + + return ( + + +

{title}

+ + + + {overviewApps?.map((app) => ( + + + + ))} + + + ); +} + +export function renderApp( + { application, chrome }: CoreStart, + overviewApps: OverviewApp[], + element: HTMLElement +) { + ReactDOM.render( + + + , + element + ); + + return () => { + chrome.docTitle.reset(); + ReactDOM.unmountComponentAtNode(element); + }; +} diff --git a/src/plugins/management_overview/public/components/overview_card/__snapshots__/overview_card.test.tsx.snap b/src/plugins/management_overview/public/components/overview_card/__snapshots__/overview_card.test.tsx.snap new file mode 100644 index 000000000000..bbba78a80037 --- /dev/null +++ b/src/plugins/management_overview/public/components/overview_card/__snapshots__/overview_card.test.tsx.snap @@ -0,0 +1,114 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`OverviewCard should render normally 1`] = ` +
+
+ Dev Tools +
+
+
    +
  • + +
    • +
+
+`; + +exports[`OverviewCard should render normally for more than 4 pages 1`] = ` +
+
+ Dev Tools +
+
+
    +
  • + +
    • +
  • + +
    • +
  • + +
    • +
  • + +
    • +
+
+`; diff --git a/src/plugins/management_overview/public/components/overview_card/index.ts b/src/plugins/management_overview/public/components/overview_card/index.ts new file mode 100644 index 000000000000..d56e99bdac96 --- /dev/null +++ b/src/plugins/management_overview/public/components/overview_card/index.ts @@ -0,0 +1,6 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +export { OverviewCard, OverviewCardProps } from './overview_card'; diff --git a/src/plugins/management_overview/public/components/overview_card/overview_card.test.tsx b/src/plugins/management_overview/public/components/overview_card/overview_card.test.tsx new file mode 100644 index 000000000000..8659084cb9da --- /dev/null +++ b/src/plugins/management_overview/public/components/overview_card/overview_card.test.tsx @@ -0,0 +1,62 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ +import { render } from '@testing-library/react'; +import { OverviewCard } from './overview_card'; +import React from 'react'; +import { PluginPages } from 'src/core/types'; + +function renderOverviewCard(pages: PluginPages[]) { + return render(); +} + +describe('OverviewCard', () => { + const singlePage: PluginPages[] = [ + { + title: 'Dev tools', + order: 100, + url: '#/console', + }, + ]; + + const multiplePages: PluginPages[] = [ + { + title: 'Dev tools-1', + order: 100, + url: '#/page1', + }, + { + title: 'Dev tools-2', + order: 200, + url: '#/page2', + }, + { + title: 'Dev tools-3', + order: 300, + url: '#/page3', + }, + { + title: 'Dev tools-4', + order: 400, + url: '#/page1', + }, + { + title: 'Dev tools-5', + order: 500, + url: '#/page5', + }, + ]; + + it('should render normally', () => { + const { container, queryByText } = renderOverviewCard(singlePage); + expect(container.firstChild).toMatchSnapshot(); + expect(queryByText('View more...')).toBeNull(); + }); + + it('should render normally for more than 4 pages', () => { + const { container, queryByText } = renderOverviewCard(multiplePages); + expect(container.firstChild).toMatchSnapshot(); + expect(queryByText('View more...')).not.toBeNull(); + }); +}); diff --git a/src/plugins/management_overview/public/components/overview_card/overview_card.tsx b/src/plugins/management_overview/public/components/overview_card/overview_card.tsx new file mode 100644 index 000000000000..144d363d2738 --- /dev/null +++ b/src/plugins/management_overview/public/components/overview_card/overview_card.tsx @@ -0,0 +1,57 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { + EuiHorizontalRule, + EuiListGroup, + EuiListGroupItem, + EuiPanel, + EuiTitle, +} from '@elastic/eui'; +import React from 'react'; +import { PluginPages } from 'src/core/types/plugin_pages'; + +export interface OverviewCardProps { + title: string; + pages: PluginPages[]; + onClick: (url: string) => void; +} + +const MAX_ITEM = 4; + +export function OverviewCard(props: OverviewCardProps) { + const { title, pages, onClick } = props; + + const showViewMore = pages && pages.length > MAX_ITEM; + let pagesToShow = pages; + if (showViewMore) { + pagesToShow = pages.slice(0, MAX_ITEM - 1); + pagesToShow.push({ + title: 'View more...', + url: '', + order: 1000, + }); + } + + return ( + + +
{title}
+ + + + {pagesToShow.map((page) => ( + onClick(page.url)} + label={page.title} + color="primary" + size="s" + /> + ))} + + + ); +} diff --git a/src/plugins/management_overview/public/index.ts b/src/plugins/management_overview/public/index.ts new file mode 100644 index 000000000000..28eadd8c2f33 --- /dev/null +++ b/src/plugins/management_overview/public/index.ts @@ -0,0 +1,11 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { ManagementOverViewPlugin } from './plugin'; + +export { OverviewApp } from './overview_app'; +export { ManagementOverViewPluginSetup, ManagementOverViewPluginStart } from './plugin'; + +export const plugin = () => new ManagementOverViewPlugin(); diff --git a/src/plugins/management_overview/public/overview_app.ts b/src/plugins/management_overview/public/overview_app.ts new file mode 100644 index 000000000000..17ff53bd662d --- /dev/null +++ b/src/plugins/management_overview/public/overview_app.ts @@ -0,0 +1,13 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { PluginPages } from '../../../core/types'; + +export interface OverviewApp { + id: string; + title: string; + order: number; + pages: PluginPages[]; +} diff --git a/src/plugins/management_overview/public/plugin.ts b/src/plugins/management_overview/public/plugin.ts new file mode 100644 index 000000000000..93a32f3b59d0 --- /dev/null +++ b/src/plugins/management_overview/public/plugin.ts @@ -0,0 +1,98 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { i18n } from '@osd/i18n'; +import { + AppMountParameters, + CoreSetup, + Plugin, + DEFAULT_APP_CATEGORIES, + CoreStart, +} from '../../../core/public'; +import { FeatureCatalogueCategory, HomePublicPluginSetup } from '../../home/public'; +import { MANAGEMENT_OVERVIEW_PLUGIN_ID } from '../common/constants'; +import { OverviewApp } from './overview_app'; + +interface ManagementOverviewSetupDeps { + home?: HomePublicPluginSetup; +} + +export interface ManagementOverViewPluginSetup { + register: (overviewApp: OverviewApp) => void; +} + +export type ManagementOverViewPluginStart = ManagementOverViewPluginSetup; + +/** @public */ +export class ManagementOverViewPlugin + implements Plugin { + private readonly overviewApps = new Map(); + + private getSortedOverviewApps(): OverviewApp[] { + return [...this.overviewApps.values()].sort((a, b) => a.order - b.order); + } + + private getRegister() { + return (app: OverviewApp) => { + if (this.overviewApps.has(app.id)) { + throw new Error( + `Management overview App tool with id [${app.id}] has already been registered. Use a unique id.` + ); + } + this.overviewApps.set(app.id, app); + }; + } + + public setup( + coreSetup: CoreSetup, + { home }: ManagementOverviewSetupDeps + ): ManagementOverViewPluginSetup { + const { application, getStartServices } = coreSetup; + + if (home) { + home.featureCatalogue.register({ + id: MANAGEMENT_OVERVIEW_PLUGIN_ID, + title: i18n.translate('management.stackManagement.managementLabel', { + defaultMessage: 'Management', + }), + description: i18n.translate('management.stackManagement.managementDescription', { + defaultMessage: 'Your center location for managing the OpenSearch Stack.', + }), + icon: 'managementApp', + path: `/app/${MANAGEMENT_OVERVIEW_PLUGIN_ID}`, + showOnHomePage: false, + category: FeatureCatalogueCategory.ADMIN, + }); + } + + application.register({ + id: MANAGEMENT_OVERVIEW_PLUGIN_ID, + title: i18n.translate('management.overviewTitle', { + defaultMessage: 'Overview', + }), + icon: '/plugins/home/public/assets/logos/opensearch_mark_default.svg', + order: 9000, + category: DEFAULT_APP_CATEGORIES.management, + mount: async (params: AppMountParameters) => { + const { element } = params; + const [core] = await getStartServices(); + const overviewApps = this.getSortedOverviewApps(); + + const { renderApp } = await import('./application'); + return renderApp(core, overviewApps, element); + }, + }); + + return { + register: this.getRegister(), + }; + } + + public start(core: CoreStart): ManagementOverViewPluginStart { + return { + register: this.getRegister(), + }; + } +} From 1ef839ed70b69fdef03a19749e8e724542cd51cd Mon Sep 17 00:00:00 2001 From: Hailong Cui Date: Wed, 14 Jun 2023 15:17:49 +0800 Subject: [PATCH 02/12] Add changelog Signed-off-by: Hailong Cui --- CHANGELOG.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 04dc5d82b498..5f9fa1500ec9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -56,6 +56,12 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/) ### 🔩 Tests +## [2.9.0 - TBD] + +### 📈 Features/Enhancements + +- New management overview page and rename stack management to dashboard management ([#4287](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4287)) + ## [2.8.0 - 2023-06-06](https://github.com/opensearch-project/OpenSearch-Dashboards/releases/tag/2.8.0) ### Deprecations From caca46d16eed9e56ee43c40636f5d63a6e0ece06 Mon Sep 17 00:00:00 2001 From: Hailong Cui Date: Thu, 15 Jun 2023 11:18:07 +0800 Subject: [PATCH 03/12] Rename stack management to dashboard management Signed-off-by: Hailong Cui --- src/plugins/management/public/utils/breadcrumbs.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/plugins/management/public/utils/breadcrumbs.ts b/src/plugins/management/public/utils/breadcrumbs.ts index f2c572b60932..4e96cb353a5b 100644 --- a/src/plugins/management/public/utils/breadcrumbs.ts +++ b/src/plugins/management/public/utils/breadcrumbs.ts @@ -32,7 +32,7 @@ import { i18n } from '@osd/i18n'; export const MANAGEMENT_BREADCRUMB = { text: i18n.translate('management.breadcrumb', { - defaultMessage: 'Stack Management', + defaultMessage: 'Dashboard Management', }), href: '/', }; From 74faff7080a3b2f2ebf930b8dcf0aed492af96cf Mon Sep 17 00:00:00 2001 From: Hailong Cui Date: Fri, 16 Jun 2023 14:37:00 +0800 Subject: [PATCH 04/12] management overviw page align with app directory page Signed-off-by: Hailong Cui --- src/core/types/index.ts | 1 - src/core/types/plugin_pages.ts | 10 -- src/plugins/dev_tools/public/plugin.ts | 24 ++-- .../public/components/landing/landing.tsx | 5 +- src/plugins/management/public/plugin.ts | 42 +++--- .../public/application.tsx | 53 ++++---- .../__snapshots__/overview_card.test.tsx.snap | 120 +++--------------- .../overview_card/overview_card.test.tsx | 59 ++------- .../overview_card/overview_card.tsx | 55 ++------ .../public/overview_app.ts | 7 +- 10 files changed, 100 insertions(+), 276 deletions(-) delete mode 100644 src/core/types/plugin_pages.ts diff --git a/src/core/types/index.ts b/src/core/types/index.ts index 781ee122a6ed..9f620273e3b2 100644 --- a/src/core/types/index.ts +++ b/src/core/types/index.ts @@ -39,4 +39,3 @@ export * from './ui_settings'; export * from './saved_objects'; export * from './serializable'; export * from './custom_branding'; -export * from './plugin_pages'; diff --git a/src/core/types/plugin_pages.ts b/src/core/types/plugin_pages.ts deleted file mode 100644 index 361461743491..000000000000 --- a/src/core/types/plugin_pages.ts +++ /dev/null @@ -1,10 +0,0 @@ -/* - * Copyright OpenSearch Contributors - * SPDX-License-Identifier: Apache-2.0 - */ - -export interface PluginPages { - title: string; - url: string; - order: number; -} diff --git a/src/plugins/dev_tools/public/plugin.ts b/src/plugins/dev_tools/public/plugin.ts index 686be8e8ca3d..b80e48479af3 100644 --- a/src/plugins/dev_tools/public/plugin.ts +++ b/src/plugins/dev_tools/public/plugin.ts @@ -40,7 +40,6 @@ import { UrlForwardingSetup } from '../../url_forwarding/public'; import { CreateDevToolArgs, DevToolApp, createDevToolApp } from './dev_tool'; import './index.scss'; -import { PluginPages } from '../../../core/types'; import { ManagementOverViewPluginStart } from '../../management_overview/public'; export interface DevToolsSetupDependencies { @@ -73,6 +72,10 @@ export class DevToolsPlugin implements Plugin { return sortBy([...this.devTools.values()], 'order'); } + private title = i18n.translate('devTools.devToolsTitle', { + defaultMessage: 'Dev Tools', + }); + public setup( coreSetup: CoreSetup, { urlForwarding }: { urlForwarding: UrlForwardingSetup } @@ -81,9 +84,7 @@ export class DevToolsPlugin implements Plugin { applicationSetup.register({ id: 'dev_tools', - title: i18n.translate('devTools.devToolsTitle', { - defaultMessage: 'Dev Tools', - }), + title: this.title, updater$: this.appStateUpdater, icon: '/plugins/home/public/assets/logos/opensearch_mark_default.svg', order: 9070, @@ -120,21 +121,14 @@ export class DevToolsPlugin implements Plugin { if (this.getSortedDevTools().length === 0) { this.appStateUpdater.next(() => ({ navLinkStatus: AppNavLinkStatus.hidden })); } else { - const features: PluginPages[] = this.getSortedDevTools().map((devApp) => { - return { - title: devApp.title, - url: `#/${devApp.id}`, - order: devApp.order, - }; - }); - managementOverview?.register({ id: 'dev_tools', - title: i18n.translate('devTools.devToolsTitle', { - defaultMessage: 'Dev Tools', + title: this.title, + description: i18n.translate('devTools.devToolsDescription', { + defaultMessage: + 'Use the console to set up and troubleshoot your OpenSearch environment with REST API.', }), order: 9070, - pages: features, }); } } diff --git a/src/plugins/management/public/components/landing/landing.tsx b/src/plugins/management/public/components/landing/landing.tsx index 467c0feeb56f..afaabc69da08 100644 --- a/src/plugins/management/public/components/landing/landing.tsx +++ b/src/plugins/management/public/components/landing/landing.tsx @@ -46,7 +46,7 @@ interface ManagementLandingPageProps { setBreadcrumbs: () => void; } -export const ManagementLandingPage = ({ version, setBreadcrumbs }: ManagementLandingPageProps) => { +export const ManagementLandingPage = ({ setBreadcrumbs }: ManagementLandingPageProps) => { useMount(() => { setBreadcrumbs(); }); @@ -61,8 +61,7 @@ export const ManagementLandingPage = ({ version, setBreadcrumbs }: ManagementLan

diff --git a/src/plugins/management/public/plugin.ts b/src/plugins/management/public/plugin.ts index 19ea3b05aad4..8844f9f385d7 100644 --- a/src/plugins/management/public/plugin.ts +++ b/src/plugins/management/public/plugin.ts @@ -49,7 +49,6 @@ import { ManagementSectionsService, getSectionsServiceStartPrivate, } from './management_sections_service'; -import { PluginPages } from '../../../core/types'; import { ManagementOverViewPluginStart } from '../../management_overview/public'; interface ManagementSetupDependencies { @@ -69,14 +68,16 @@ export class ManagementPlugin implements Plugin section.apps) - .flat() - .map((app) => { - return { - title: app.title, - url: app.basePath, - order: app.order, - }; - }); - - if (pluginPages) { - managementOverview.register({ - id: MANAGEMENT_APP_ID, - title: i18n.translate('management.stackManagement.title', { - defaultMessage: 'Dashboard Management', - }), - order: 9030, - pages: pluginPages, - }); - } + if (managementOverview && this.hasAnyEnabledApps) { + managementOverview.register({ + id: MANAGEMENT_APP_ID, + title: this.title, + description: i18n.translate('management.dashboardManagement.description', { + defaultMessage: + 'Manage Dashboards saved objects and data source connections.You can also modify advanced settings for Dashboards.', + }), + order: 9030, + }); } return {}; diff --git a/src/plugins/management_overview/public/application.tsx b/src/plugins/management_overview/public/application.tsx index fa5baef09947..4c9998674c8f 100644 --- a/src/plugins/management_overview/public/application.tsx +++ b/src/plugins/management_overview/public/application.tsx @@ -4,12 +4,11 @@ */ import ReactDOM from 'react-dom'; -import { I18nProvider } from '@osd/i18n/react'; +import { I18nProvider, FormattedMessage } from '@osd/i18n/react'; import React from 'react'; -import { EuiFlexGrid, EuiFlexItem, EuiPanel, EuiSpacer, EuiTitle } from '@elastic/eui'; -import { i18n } from '@osd/i18n'; +import { EuiFlexGrid, EuiFlexItem, EuiPage, EuiPageBody, EuiSpacer, EuiTitle } from '@elastic/eui'; import { ApplicationStart, CoreStart } from '../../../core/public'; -import { OverviewApp } from './overview_app'; +import { OverviewApp } from '.'; import { OverviewCard } from './components/overview_card'; export interface ManagementOverviewProps { @@ -20,31 +19,29 @@ export interface ManagementOverviewProps { function ManagementOverviewWrapper(props: ManagementOverviewProps) { const { application, overviewApps } = props; - const onClick = (appId: string) => { - return (url: string) => { - const pageUrl = application.getUrlForApp(appId, { path: url }); - application.navigateToUrl(pageUrl); - }; - }; - - const title = i18n.translate('core.ui.managementNavList.label', { - defaultMessage: 'Management', - }); - return ( - - -

{title}

- - - - {overviewApps?.map((app) => ( - - - - ))} - - + + + +

+ +

+ + + + {overviewApps?.map((app) => ( + + { + application.navigateToApp(app.id); + }} + /> + + ))} + + + ); } diff --git a/src/plugins/management_overview/public/components/overview_card/__snapshots__/overview_card.test.tsx.snap b/src/plugins/management_overview/public/components/overview_card/__snapshots__/overview_card.test.tsx.snap index bbba78a80037..ed6b9eb5dc11 100644 --- a/src/plugins/management_overview/public/components/overview_card/__snapshots__/overview_card.test.tsx.snap +++ b/src/plugins/management_overview/public/components/overview_card/__snapshots__/overview_card.test.tsx.snap @@ -2,113 +2,31 @@ exports[`OverviewCard should render normally 1`] = `
-
- Dev Tools -
-
-
    -
  • - -
    • -
-
-`; - -exports[`OverviewCard should render normally for more than 4 pages 1`] = ` -
-
- Dev Tools -
-
-
    -
  • -
    • -
  • +
    - -
    • -
  • - -
    • -
  • - -
    • -
+

+ Dev tools description +

+
+ `; diff --git a/src/plugins/management_overview/public/components/overview_card/overview_card.test.tsx b/src/plugins/management_overview/public/components/overview_card/overview_card.test.tsx index 8659084cb9da..6534fbca85f5 100644 --- a/src/plugins/management_overview/public/components/overview_card/overview_card.test.tsx +++ b/src/plugins/management_overview/public/components/overview_card/overview_card.test.tsx @@ -2,61 +2,26 @@ * Copyright OpenSearch Contributors * SPDX-License-Identifier: Apache-2.0 */ + import { render } from '@testing-library/react'; import { OverviewCard } from './overview_card'; import React from 'react'; -import { PluginPages } from 'src/core/types'; -function renderOverviewCard(pages: PluginPages[]) { - return render(); +function renderOverviewCard() { + return render( + + ); } describe('OverviewCard', () => { - const singlePage: PluginPages[] = [ - { - title: 'Dev tools', - order: 100, - url: '#/console', - }, - ]; - - const multiplePages: PluginPages[] = [ - { - title: 'Dev tools-1', - order: 100, - url: '#/page1', - }, - { - title: 'Dev tools-2', - order: 200, - url: '#/page2', - }, - { - title: 'Dev tools-3', - order: 300, - url: '#/page3', - }, - { - title: 'Dev tools-4', - order: 400, - url: '#/page1', - }, - { - title: 'Dev tools-5', - order: 500, - url: '#/page5', - }, - ]; - it('should render normally', () => { - const { container, queryByText } = renderOverviewCard(singlePage); - expect(container.firstChild).toMatchSnapshot(); - expect(queryByText('View more...')).toBeNull(); - }); - - it('should render normally for more than 4 pages', () => { - const { container, queryByText } = renderOverviewCard(multiplePages); + const { container, queryByText } = renderOverviewCard(); expect(container.firstChild).toMatchSnapshot(); - expect(queryByText('View more...')).not.toBeNull(); + expect(queryByText('Dev Tools')).not.toBeNull(); }); }); diff --git a/src/plugins/management_overview/public/components/overview_card/overview_card.tsx b/src/plugins/management_overview/public/components/overview_card/overview_card.tsx index 144d363d2738..dad91bc1e79b 100644 --- a/src/plugins/management_overview/public/components/overview_card/overview_card.tsx +++ b/src/plugins/management_overview/public/components/overview_card/overview_card.tsx @@ -3,55 +3,28 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { - EuiHorizontalRule, - EuiListGroup, - EuiListGroupItem, - EuiPanel, - EuiTitle, -} from '@elastic/eui'; +import { EuiCard } from '@elastic/eui'; import React from 'react'; -import { PluginPages } from 'src/core/types/plugin_pages'; export interface OverviewCardProps { + id: string; title: string; - pages: PluginPages[]; - onClick: (url: string) => void; + description: string; + onClick: () => void; } -const MAX_ITEM = 4; - export function OverviewCard(props: OverviewCardProps) { - const { title, pages, onClick } = props; - - const showViewMore = pages && pages.length > MAX_ITEM; - let pagesToShow = pages; - if (showViewMore) { - pagesToShow = pages.slice(0, MAX_ITEM - 1); - pagesToShow.push({ - title: 'View more...', - url: '', - order: 1000, - }); - } + const { id, title, description, onClick } = props; return ( - - -
{title}
- - - - {pagesToShow.map((page) => ( - onClick(page.url)} - label={page.title} - color="primary" - size="s" - /> - ))} - - + ); } diff --git a/src/plugins/management_overview/public/overview_app.ts b/src/plugins/management_overview/public/overview_app.ts index 17ff53bd662d..dfb85e8c3275 100644 --- a/src/plugins/management_overview/public/overview_app.ts +++ b/src/plugins/management_overview/public/overview_app.ts @@ -3,11 +3,12 @@ * SPDX-License-Identifier: Apache-2.0 */ -import { PluginPages } from '../../../core/types'; - export interface OverviewApp { + /** id of plugin app */ id: string; + /** Title of plugin displayed to the user. */ title: string; + /** One-line description of feature displayed to the user. */ + description: string; order: number; - pages: PluginPages[]; } From d7716ce7bd23e5e77468a2daa83cb8f136ea4b6f Mon Sep 17 00:00:00 2001 From: Hailong Cui Date: Mon, 19 Jun 2023 11:08:56 +0800 Subject: [PATCH 05/12] wording changes for dashboards management Signed-off-by: Hailong Cui --- src/plugins/management/public/components/landing/landing.tsx | 2 +- .../management/public/components/management_sections.tsx | 2 +- .../management_sidebar_nav/management_sidebar_nav.scss | 2 +- src/plugins/management/public/plugin.ts | 2 +- src/plugins/management/public/utils/breadcrumbs.ts | 2 +- 5 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/plugins/management/public/components/landing/landing.tsx b/src/plugins/management/public/components/landing/landing.tsx index afaabc69da08..5557eb7e9019 100644 --- a/src/plugins/management/public/components/landing/landing.tsx +++ b/src/plugins/management/public/components/landing/landing.tsx @@ -61,7 +61,7 @@ export const ManagementLandingPage = ({ setBreadcrumbs }: ManagementLandingPageP

diff --git a/src/plugins/management/public/components/management_sections.tsx b/src/plugins/management/public/components/management_sections.tsx index 8360c4be8902..0e2c7a7975bd 100644 --- a/src/plugins/management/public/components/management_sections.tsx +++ b/src/plugins/management/public/components/management_sections.tsx @@ -64,7 +64,7 @@ const sectionTip = i18n.translate('management.sections.section.tip', { }); const opensearchDashboardsTitle = i18n.translate('management.sections.opensearchDashboardsTitle', { - defaultMessage: 'OpenSearch Dashboards', + defaultMessage: 'Dashboards Management', }); const opensearchDashboardsTip = i18n.translate('management.sections.opensearchDashboardsTip', { diff --git a/src/plugins/management/public/components/management_sidebar_nav/management_sidebar_nav.scss b/src/plugins/management/public/components/management_sidebar_nav/management_sidebar_nav.scss index f9e5a74d4f35..9303dbbf4c30 100644 --- a/src/plugins/management/public/components/management_sidebar_nav/management_sidebar_nav.scss +++ b/src/plugins/management/public/components/management_sidebar_nav/management_sidebar_nav.scss @@ -1,5 +1,5 @@ .mgtSideBarNav { - width: 210px; + width: 220px; margin-right: $euiSize; } diff --git a/src/plugins/management/public/plugin.ts b/src/plugins/management/public/plugin.ts index 8844f9f385d7..1abf6ec77f0d 100644 --- a/src/plugins/management/public/plugin.ts +++ b/src/plugins/management/public/plugin.ts @@ -69,7 +69,7 @@ export class ManagementPlugin implements Plugin Date: Tue, 20 Jun 2023 11:27:30 +0800 Subject: [PATCH 06/12] wording changes Signed-off-by: Hailong Cui --- .../public/management_app/mount_management_section.tsx | 2 +- src/plugins/advanced_settings/public/plugin.ts | 2 +- src/plugins/data_source_management/common/index.ts | 2 +- .../public/components/breadcrumbs.test.ts | 2 +- .../data_source_management/public/components/breadcrumbs.ts | 2 +- src/plugins/index_pattern_management/public/plugin.ts | 2 +- src/plugins/saved_objects_management/public/plugin.ts | 2 +- 7 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/plugins/advanced_settings/public/management_app/mount_management_section.tsx b/src/plugins/advanced_settings/public/management_app/mount_management_section.tsx index a8e4595b2cff..7fa0b9ddd2c0 100644 --- a/src/plugins/advanced_settings/public/management_app/mount_management_section.tsx +++ b/src/plugins/advanced_settings/public/management_app/mount_management_section.tsx @@ -43,7 +43,7 @@ import { ComponentRegistry } from '../types'; import './index.scss'; const title = i18n.translate('advancedSettings.advancedSettingsLabel', { - defaultMessage: 'Advanced Settings', + defaultMessage: 'Advanced settings', }); const crumb = [{ text: title }]; diff --git a/src/plugins/advanced_settings/public/plugin.ts b/src/plugins/advanced_settings/public/plugin.ts index 43e959e88557..608bfc6a25e7 100644 --- a/src/plugins/advanced_settings/public/plugin.ts +++ b/src/plugins/advanced_settings/public/plugin.ts @@ -37,7 +37,7 @@ import { AdvancedSettingsSetup, AdvancedSettingsStart, AdvancedSettingsPluginSet const component = new ComponentRegistry(); const title = i18n.translate('advancedSettings.advancedSettingsLabel', { - defaultMessage: 'Advanced Settings', + defaultMessage: 'Advanced settings', }); export class AdvancedSettingsPlugin diff --git a/src/plugins/data_source_management/common/index.ts b/src/plugins/data_source_management/common/index.ts index e42b0c3fc514..3ba84084699a 100644 --- a/src/plugins/data_source_management/common/index.ts +++ b/src/plugins/data_source_management/common/index.ts @@ -4,4 +4,4 @@ */ export const PLUGIN_ID = 'dataSourceManagement'; -export const PLUGIN_NAME = 'Data Sources'; +export const PLUGIN_NAME = 'Data sources'; diff --git a/src/plugins/data_source_management/public/components/breadcrumbs.test.ts b/src/plugins/data_source_management/public/components/breadcrumbs.test.ts index a99cabc4596d..fbf1c62bb7dc 100644 --- a/src/plugins/data_source_management/public/components/breadcrumbs.test.ts +++ b/src/plugins/data_source_management/public/components/breadcrumbs.test.ts @@ -9,7 +9,7 @@ import { mockDataSourceAttributesWithAuth } from '../mocks'; describe('DataSourceManagement: breadcrumbs.ts', () => { test('get listing breadcrumb', () => { const bc = getListBreadcrumbs(); - expect(bc[0].text).toBe('Data Sources'); + expect(bc[0].text).toBe('Data sources'); expect(bc[0].href).toBe('/'); }); diff --git a/src/plugins/data_source_management/public/components/breadcrumbs.ts b/src/plugins/data_source_management/public/components/breadcrumbs.ts index 8287ea1e7384..ad1b470c89d4 100644 --- a/src/plugins/data_source_management/public/components/breadcrumbs.ts +++ b/src/plugins/data_source_management/public/components/breadcrumbs.ts @@ -10,7 +10,7 @@ export function getListBreadcrumbs() { return [ { text: i18n.translate('dataSourcesManagement.dataSources.listBreadcrumb', { - defaultMessage: 'Data Sources', + defaultMessage: 'Data sources', }), href: `/`, }, diff --git a/src/plugins/index_pattern_management/public/plugin.ts b/src/plugins/index_pattern_management/public/plugin.ts index c1fbeab54f26..cf68e043b76c 100644 --- a/src/plugins/index_pattern_management/public/plugin.ts +++ b/src/plugins/index_pattern_management/public/plugin.ts @@ -56,7 +56,7 @@ export type IndexPatternManagementSetup = IndexPatternManagementServiceSetup; export type IndexPatternManagementStart = IndexPatternManagementServiceStart; const sectionsHeader = i18n.translate('indexPatternManagement.indexPattern.sectionsHeader', { - defaultMessage: 'Index Patterns', + defaultMessage: 'Index patterns', }); const IPM_APP_ID = 'indexPatterns'; diff --git a/src/plugins/saved_objects_management/public/plugin.ts b/src/plugins/saved_objects_management/public/plugin.ts index ec7d64ed700c..df9b39a1ebb7 100644 --- a/src/plugins/saved_objects_management/public/plugin.ts +++ b/src/plugins/saved_objects_management/public/plugin.ts @@ -121,7 +121,7 @@ export class SavedObjectsManagementPlugin opensearchDashboardsSection.registerApp({ id: 'objects', title: i18n.translate('savedObjectsManagement.managementSectionLabel', { - defaultMessage: 'Saved Objects', + defaultMessage: 'Saved objects', }), order: 1, mount: async (mountParams) => { From 144c415ad85c7b60a380e0beb32aeda4629d0848 Mon Sep 17 00:00:00 2001 From: Hailong Cui Date: Fri, 23 Jun 2023 10:11:00 +0800 Subject: [PATCH 07/12] wording update Signed-off-by: Hailong Cui --- src/plugins/dev_tools/public/plugin.ts | 2 +- src/plugins/management/public/plugin.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/plugins/dev_tools/public/plugin.ts b/src/plugins/dev_tools/public/plugin.ts index b80e48479af3..1f92bd87cb3e 100644 --- a/src/plugins/dev_tools/public/plugin.ts +++ b/src/plugins/dev_tools/public/plugin.ts @@ -126,7 +126,7 @@ export class DevToolsPlugin implements Plugin { title: this.title, description: i18n.translate('devTools.devToolsDescription', { defaultMessage: - 'Use the console to set up and troubleshoot your OpenSearch environment with REST API.', + 'Use the console to set up and troubleshoot your OpenSearch environment with the REST API.', }), order: 9070, }); diff --git a/src/plugins/management/public/plugin.ts b/src/plugins/management/public/plugin.ts index 1abf6ec77f0d..6d933b3b5098 100644 --- a/src/plugins/management/public/plugin.ts +++ b/src/plugins/management/public/plugin.ts @@ -120,7 +120,7 @@ export class ManagementPlugin implements Plugin Date: Sat, 24 Jun 2023 15:55:13 +0800 Subject: [PATCH 08/12] i18n title fix Signed-off-by: Hailong Cui --- src/plugins/management_overview/public/application.tsx | 2 +- src/plugins/management_overview/public/plugin.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/plugins/management_overview/public/application.tsx b/src/plugins/management_overview/public/application.tsx index 4c9998674c8f..3deb036d04df 100644 --- a/src/plugins/management_overview/public/application.tsx +++ b/src/plugins/management_overview/public/application.tsx @@ -24,7 +24,7 @@ function ManagementOverviewWrapper(props: ManagementOverviewProps) {

- +

diff --git a/src/plugins/management_overview/public/plugin.ts b/src/plugins/management_overview/public/plugin.ts index 93a32f3b59d0..04081a47eb19 100644 --- a/src/plugins/management_overview/public/plugin.ts +++ b/src/plugins/management_overview/public/plugin.ts @@ -69,7 +69,7 @@ export class ManagementOverViewPlugin application.register({ id: MANAGEMENT_OVERVIEW_PLUGIN_ID, - title: i18n.translate('management.overviewTitle', { + title: i18n.translate('management.overview.overviewTitle', { defaultMessage: 'Overview', }), icon: '/plugins/home/public/assets/logos/opensearch_mark_default.svg', From 01d8ea61dea0deb831c0510a83d772bea9db28f4 Mon Sep 17 00:00:00 2001 From: Hailong Cui Date: Thu, 6 Jul 2023 08:46:50 +0800 Subject: [PATCH 09/12] remove overview register setup in start phase Signed-off-by: Hailong Cui --- CHANGELOG.md | 8 +--- src/plugins/dev_tools/public/plugin.ts | 48 +++++++++---------- src/plugins/management/public/plugin.ts | 33 ++++++------- .../public/application.tsx | 21 ++++++-- .../management_overview/public/plugin.ts | 32 ++++--------- 5 files changed, 65 insertions(+), 77 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index c7beb7ae26a0..06cbd20da7d2 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -31,6 +31,8 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/) - Bump OUI to `1.1.2` to make `anomalyDetection` icon available ([#4408](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4408)) - Add `color-scheme` to the root styling ([#4477](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4477)) - [Multiple DataSource] Frontend support for adding sample data ([#4412](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4412)) +- New management overview page and rename stack management to dashboard management ([#4287](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4287)) + ### 🐛 Bug Fixes @@ -84,12 +86,6 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/) ### 🔩 Tests -## [2.9.0 - TBD] - -### 📈 Features/Enhancements - -- New management overview page and rename stack management to dashboard management ([#4287](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/4287)) - ## [2.8.0 - 2023-06-06](https://github.com/opensearch-project/OpenSearch-Dashboards/releases/tag/2.8.0) ### Deprecations diff --git a/src/plugins/dev_tools/public/plugin.ts b/src/plugins/dev_tools/public/plugin.ts index 1f92bd87cb3e..571e31ef5669 100644 --- a/src/plugins/dev_tools/public/plugin.ts +++ b/src/plugins/dev_tools/public/plugin.ts @@ -29,25 +29,23 @@ */ import { BehaviorSubject } from 'rxjs'; -import { Plugin, CoreSetup, AppMountParameters, CoreStart } from 'src/core/public'; +import { Plugin, CoreSetup, AppMountParameters } from 'src/core/public'; import { AppUpdater } from 'opensearch-dashboards/public'; import { i18n } from '@osd/i18n'; import { sortBy } from 'lodash'; -import { DataSourcePluginStart } from 'src/plugins/data_source/public'; +import { DataSourcePluginSetup } from 'src/plugins/data_source/public'; import { AppNavLinkStatus, DEFAULT_APP_CATEGORIES } from '../../../core/public'; import { UrlForwardingSetup } from '../../url_forwarding/public'; import { CreateDevToolArgs, DevToolApp, createDevToolApp } from './dev_tool'; import './index.scss'; -import { ManagementOverViewPluginStart } from '../../management_overview/public'; +import { ManagementOverViewPluginSetup } from '../../management_overview/public'; export interface DevToolsSetupDependencies { - dataSource?: DataSourcePluginStart; -} - -export interface DevToolsStartDependencies { - managementOverview?: ManagementOverViewPluginStart; + dataSource?: DataSourcePluginSetup; + urlForwarding: UrlForwardingSetup; + managementOverview?: ManagementOverViewPluginSetup; } export interface DevToolsSetup { @@ -64,7 +62,7 @@ export interface DevToolsSetup { register: (devTool: CreateDevToolArgs) => DevToolApp; } -export class DevToolsPlugin implements Plugin { +export class DevToolsPlugin implements Plugin { private readonly devTools = new Map(); private appStateUpdater = new BehaviorSubject(() => ({})); @@ -76,11 +74,9 @@ export class DevToolsPlugin implements Plugin { defaultMessage: 'Dev Tools', }); - public setup( - coreSetup: CoreSetup, - { urlForwarding }: { urlForwarding: UrlForwardingSetup } - ) { + public setup(coreSetup: CoreSetup, deps: DevToolsSetupDependencies) { const { application: applicationSetup, getStartServices } = coreSetup; + const { urlForwarding, managementOverview } = deps; applicationSetup.register({ id: 'dev_tools', @@ -93,13 +89,23 @@ export class DevToolsPlugin implements Plugin { const { element, history } = params; element.classList.add('devAppWrapper'); - const [core, devSetup] = await getStartServices(); + const [core] = await getStartServices(); const { renderApp } = await import('./application'); - return renderApp(core, element, history, this.getSortedDevTools(), devSetup); + return renderApp(core, element, history, this.getSortedDevTools(), deps); }, }); + managementOverview?.register({ + id: 'dev_tools', + title: this.title, + description: i18n.translate('devTools.devToolsDescription', { + defaultMessage: + 'Use the console to set up and troubleshoot your OpenSearch environment with the REST API.', + }), + order: 9070, + }); + urlForwarding.forwardApp('dev_tools', 'dev_tools'); return { @@ -117,19 +123,9 @@ export class DevToolsPlugin implements Plugin { }; } - public start(core: CoreStart, { managementOverview }: DevToolsStartDependencies) { + public start() { if (this.getSortedDevTools().length === 0) { this.appStateUpdater.next(() => ({ navLinkStatus: AppNavLinkStatus.hidden })); - } else { - managementOverview?.register({ - id: 'dev_tools', - title: this.title, - description: i18n.translate('devTools.devToolsDescription', { - defaultMessage: - 'Use the console to set up and troubleshoot your OpenSearch environment with the REST API.', - }), - order: 9070, - }); } } diff --git a/src/plugins/management/public/plugin.ts b/src/plugins/management/public/plugin.ts index 6d933b3b5098..4cc1c4aa7f8f 100644 --- a/src/plugins/management/public/plugin.ts +++ b/src/plugins/management/public/plugin.ts @@ -49,14 +49,11 @@ import { ManagementSectionsService, getSectionsServiceStartPrivate, } from './management_sections_service'; -import { ManagementOverViewPluginStart } from '../../management_overview/public'; +import { ManagementOverViewPluginSetup } from '../../management_overview/public'; interface ManagementSetupDependencies { home?: HomePublicPluginSetup; -} - -interface ManagementStartDependencies { - managementOverview?: ManagementOverViewPluginStart; + managementOverview?: ManagementOverViewPluginSetup; } export class ManagementPlugin implements Plugin { @@ -72,7 +69,7 @@ export class ManagementPlugin implements Plugin link.hidden) + .map((link) => link.id) || []; + + const availableApps = overviewApps?.filter((app) => hiddenAppIds.indexOf(app.id) === -1); return ( @@ -29,7 +38,7 @@ function ManagementOverviewWrapper(props: ManagementOverviewProps) { - {overviewApps?.map((app) => ( + {availableApps?.map((app) => ( - + , element ); diff --git a/src/plugins/management_overview/public/plugin.ts b/src/plugins/management_overview/public/plugin.ts index 04081a47eb19..b588d50e23da 100644 --- a/src/plugins/management_overview/public/plugin.ts +++ b/src/plugins/management_overview/public/plugin.ts @@ -22,29 +22,14 @@ interface ManagementOverviewSetupDeps { export interface ManagementOverViewPluginSetup { register: (overviewApp: OverviewApp) => void; } - -export type ManagementOverViewPluginStart = ManagementOverViewPluginSetup; - /** @public */ -export class ManagementOverViewPlugin - implements Plugin { +export class ManagementOverViewPlugin implements Plugin { private readonly overviewApps = new Map(); private getSortedOverviewApps(): OverviewApp[] { return [...this.overviewApps.values()].sort((a, b) => a.order - b.order); } - private getRegister() { - return (app: OverviewApp) => { - if (this.overviewApps.has(app.id)) { - throw new Error( - `Management overview App tool with id [${app.id}] has already been registered. Use a unique id.` - ); - } - this.overviewApps.set(app.id, app); - }; - } - public setup( coreSetup: CoreSetup, { home }: ManagementOverviewSetupDeps @@ -86,13 +71,16 @@ export class ManagementOverViewPlugin }); return { - register: this.getRegister(), + register: (app: OverviewApp) => { + if (this.overviewApps.has(app.id)) { + throw new Error( + `Management overview App tool with id [${app.id}] has already been registered. Use a unique id.` + ); + } + this.overviewApps.set(app.id, app); + }, }; } - public start(core: CoreStart): ManagementOverViewPluginStart { - return { - register: this.getRegister(), - }; - } + public start(core: CoreStart): void {} } From 833179c71c60c25c6b9eef0f8b667abfe8c43486 Mon Sep 17 00:00:00 2001 From: Hailong Cui Date: Thu, 6 Jul 2023 11:35:24 +0800 Subject: [PATCH 10/12] Add comment for dev tools order change Signed-off-by: Hailong Cui --- src/plugins/dev_tools/public/plugin.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/plugins/dev_tools/public/plugin.ts b/src/plugins/dev_tools/public/plugin.ts index 571e31ef5669..c23431799ead 100644 --- a/src/plugins/dev_tools/public/plugin.ts +++ b/src/plugins/dev_tools/public/plugin.ts @@ -83,6 +83,7 @@ export class DevToolsPlugin implements Plugin { title: this.title, updater$: this.appStateUpdater, icon: '/plugins/home/public/assets/logos/opensearch_mark_default.svg', + /* the order of dev tools, it shows as last item of management section */ order: 9070, category: DEFAULT_APP_CATEGORIES.management, mount: async (params: AppMountParameters) => { From 9472de03861a5c64ef27acb713e786b444a0d4fa Mon Sep 17 00:00:00 2001 From: Hailong Cui Date: Thu, 6 Jul 2023 11:43:01 +0800 Subject: [PATCH 11/12] Make home plugin optional for managemnet overview Signed-off-by: Hailong Cui --- src/plugins/management_overview/opensearch_dashboards.json | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/plugins/management_overview/opensearch_dashboards.json b/src/plugins/management_overview/opensearch_dashboards.json index aaa68f64940b..8dec91b15e5e 100644 --- a/src/plugins/management_overview/opensearch_dashboards.json +++ b/src/plugins/management_overview/opensearch_dashboards.json @@ -3,6 +3,7 @@ "version": "opensearchDashboards", "ui": true, "server": false, - "requiredPlugins": ["navigation", "home"], - "optionalPlugins": [] + "requiredPlugins": ["navigation"], + "optionalPlugins": ["home"], + "requiredBundles": ["home"] } From 66f286eb5931c0a6c872ba0a0ebd5613f4b023ed Mon Sep 17 00:00:00 2001 From: Hailong Cui Date: Fri, 7 Jul 2023 08:22:16 +0800 Subject: [PATCH 12/12] Fix failed functional test due to wording change Signed-off-by: Hailong Cui --- test/functional/page_objects/header_page.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/functional/page_objects/header_page.ts b/test/functional/page_objects/header_page.ts index aa05dd12d8dc..f9a873c49ced 100644 --- a/test/functional/page_objects/header_page.ts +++ b/test/functional/page_objects/header_page.ts @@ -73,7 +73,7 @@ export function HeaderPageProvider({ getService, getPageObjects }: FtrProviderCo } public async clickStackManagement() { - await appsMenu.clickLink('Stack Management', { category: 'management' }); + await appsMenu.clickLink('Dashboards Management', { category: 'management' }); await this.awaitGlobalLoadingIndicatorHidden(); }