[Backport workspace] patch with retire dashboard management and add u…

…nit test for mountWrapper (#224) * feat: add unit test for mountWrapper (#223) Signed-off-by: SuZhou-Joe <suzhou@amazon.com> (cherry picked from commit 0906bf4) Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> * feat: add patch Signed-off-by: SuZhou-Joe <suzhou@amazon.com> * feat: some update Signed-off-by: SuZhou-Joe <suzhou@amazon.com> * feat: update snapshot Signed-off-by: SuZhou-Joe <suzhou@amazon.com> --------- Signed-off-by: SuZhou-Joe <suzhou@amazon.com> Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: tygao <tygao@amazon.com> Co-authored-by: SuZhou-Joe <suzhou@amazon.com>
ruanyl · Oct 12, 2023 · e36a7b6 · e36a7b6
1 parent b22111a
commit e36a7b6
Show file tree

Hide file tree

Showing 20 changed files with 262 additions and 117 deletions.
diff --git a/...gs/public/management_app/components/page_wrapper/__snapshots__/page_wrapper.test.tsx.snap b/...gs/public/management_app/components/page_wrapper/__snapshots__/page_wrapper.test.tsx.snap
diff --git a/...ins/advanced_settings/public/management_app/components/page_wrapper/page_wrapper.test.tsx b/...ins/advanced_settings/public/management_app/components/page_wrapper/page_wrapper.test.tsx
@@ -0,0 +1,16 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { render } from '@testing-library/react';
+import { PageWrapper } from './page_wrapper';
+
+describe('PageWrapper', () => {
+  it('should render normally', async () => {
+    const { findByText, container } = render(<PageWrapper>Foo</PageWrapper>);
+    await findByText('Foo');
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/src/plugins/advanced_settings/public/management_app/components/page_wrapper/page_wrapper.tsx b/src/plugins/advanced_settings/public/management_app/components/page_wrapper/page_wrapper.tsx
@@ -6,10 +6,10 @@
 import { EuiPageContent } from '@elastic/eui';
 import React from 'react';
 
-export const PageWrapper = (props: { fullWidth?: boolean; children?: React.ReactChild }) => {
+export const PageWrapper = (props: { children?: React.ReactChild }) => {
   return (
     <EuiPageContent
-      style={props.fullWidth ? {} : { maxWidth: '75%', marginTop: '20px' }}
+      style={{ maxWidth: '75%', marginTop: '20px' }}
       hasShadow={false}
       hasBorder={false}
       panelPaddingSize="none"

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
@@ -34,12 +34,7 @@ import { Router, Switch, Route } from 'react-router-dom';
 
 import { i18n } from '@osd/i18n';
 import { I18nProvider } from '@osd/i18n/react';
-import {
-  AppMountParameters,
-  ChromeBreadcrumb,
-  ScopedHistory,
-  StartServicesAccessor,
-} from 'src/core/public';
+import { AppMountParameters, ChromeBreadcrumb, StartServicesAccessor } from 'src/core/public';
 
 import { AdvancedSettings } from './advanced_settings';
 import { ComponentRegistry } from '../types';
@@ -51,7 +46,7 @@ import './index.scss';
 const title = i18n.translate('advancedSettings.advancedSettingsLabel', {
   defaultMessage: 'Advanced settings',
 });
-const crumb = [{ text: title }];
+const crumb: ChromeBreadcrumb[] = [{ text: title }];
 
 const readOnlyBadge = {
   text: i18n.translate('advancedSettings.badge.readOnly.text', {
@@ -69,15 +64,12 @@ export async function mountAdvancedSettingsManagementSection(
   componentRegistry: ComponentRegistry['start']
 ) {
   const [{ uiSettings, notifications, docLinks, application, chrome }] = await getStartServices();
-  const setBreadcrumbsScoped = (crumbs: ChromeBreadcrumb[] = []) => {
-    const wrapBreadcrumb = (item: ChromeBreadcrumb, scopedHistory: ScopedHistory) => ({
+  chrome.setBreadcrumbs([
+    ...crumb.map((item) => ({
       ...item,
-      ...(item.href ? reactRouterNavigate(scopedHistory, item.href) : {}),
-    });
-
-    chrome.setBreadcrumbs([...crumbs.map((item) => wrapBreadcrumb(item, params.history))]);
-  };
-  setBreadcrumbsScoped(crumb);
+      ...(item.href ? reactRouterNavigate(params.history, item.href) : {}),
+    })),
+  ]);
 
   const canSave = application.capabilities.advancedSettings.save as boolean;
 

diff --git a/...source_management/public/components/page_wrapper/__snapshots__/page_wrapper.test.tsx.snap b/...source_management/public/components/page_wrapper/__snapshots__/page_wrapper.test.tsx.snap
diff --git a/src/plugins/data_source_management/public/components/page_wrapper/page_wrapper.test.tsx b/src/plugins/data_source_management/public/components/page_wrapper/page_wrapper.test.tsx
@@ -0,0 +1,16 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { render } from '@testing-library/react';
+import { PageWrapper } from './page_wrapper';
+
+describe('PageWrapper', () => {
+  it('should render normally', async () => {
+    const { findByText, container } = render(<PageWrapper>Foo</PageWrapper>);
+    await findByText('Foo');
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/src/plugins/data_source_management/public/components/page_wrapper/page_wrapper.tsx b/src/plugins/data_source_management/public/components/page_wrapper/page_wrapper.tsx
@@ -6,10 +6,10 @@
 import { EuiPageContent } from '@elastic/eui';
 import React from 'react';
 
-export const PageWrapper = (props: { fullWidth?: boolean; children?: React.ReactChild }) => {
+export const PageWrapper = (props: { children?: React.ReactChild }) => {
   return (
     <EuiPageContent
-      style={props.fullWidth ? {} : { maxWidth: '75%', marginTop: '20px' }}
+      style={{ maxWidth: '75%', marginTop: '20px' }}
       hasShadow={false}
       hasBorder={false}
       panelPaddingSize="none"

diff --git a/src/plugins/home/public/application/components/new_theme_modal.tsx b/src/plugins/home/public/application/components/new_theme_modal.tsx
@@ -56,9 +56,7 @@ export const NewThemeModal: FC<Props> = ({ addBasePath, onClose }) => {
             modes. You or your administrator can change to the previous theme by visiting {advancedSettingsLink}."
               values={{
                 advancedSettingsLink: (
-                  <EuiLink
-                    href={addBasePath('/app/management/opensearch-dashboards/settings#appearance')}
-                  >
+                  <EuiLink href={addBasePath('/app/settings#appearance')}>
                     <FormattedMessage
                       id="home.newThemeModal.previewDescription.advancedSettingsLinkText"
                       defaultMessage="Advanced Settings"

diff --git a/src/plugins/index_pattern_management/opensearch_dashboards.json b/src/plugins/index_pattern_management/opensearch_dashboards.json
@@ -4,6 +4,6 @@
   "server": true,
   "ui": true,
   "optionalPlugins": ["dataSource"],
-  "requiredPlugins": ["management", "data", "urlForwarding"],
+  "requiredPlugins": ["data", "urlForwarding"],
   "requiredBundles": ["opensearchDashboardsReact", "opensearchDashboardsUtils"]
 }
diff --git a/src/plugins/index_pattern_management/public/management_app/mount_management_section.tsx b/src/plugins/index_pattern_management/public/management_app/mount_management_section.tsx
@@ -34,11 +34,18 @@ import { Router, Switch, Route } from 'react-router-dom';
 
 import { i18n } from '@osd/i18n';
 import { I18nProvider } from '@osd/i18n/react';
-import { StartServicesAccessor } from 'src/core/public';
+import {
+  AppMountParameters,
+  ChromeBreadcrumb,
+  ScopedHistory,
+  StartServicesAccessor,
+} from 'src/core/public';
 
 import { EuiPage, EuiPageBody } from '@elastic/eui';
-import { OpenSearchDashboardsContextProvider } from '../../../opensearch_dashboards_react/public';
-import { ManagementAppMountParams } from '../../../management/public';
+import {
+  OpenSearchDashboardsContextProvider,
+  reactRouterNavigate,
+} from '../../../opensearch_dashboards_react/public';
 import {
   IndexPatternTableWithRouter,
   EditIndexPatternContainer,
@@ -60,7 +67,7 @@ const readOnlyBadge = {
 
 export async function mountManagementSection(
   getStartServices: StartServicesAccessor<IndexPatternManagementStartDependencies>,
-  params: ManagementAppMountParams,
+  params: AppMountParameters,
   getMlCardState: () => MlCardState
 ) {
   const [
@@ -75,6 +82,17 @@ export async function mountManagementSection(
     chrome.setBadge(readOnlyBadge);
   }
 
+  const setBreadcrumbsScope = (crumbs: ChromeBreadcrumb[] = [], appHistory?: ScopedHistory) => {
+    const wrapBreadcrumb = (item: ChromeBreadcrumb, scopedHistory: ScopedHistory) => ({
+      ...item,
+      ...(item.href ? reactRouterNavigate(scopedHistory, item.href) : {}),
+    });
+
+    chrome.setBreadcrumbs([
+      ...crumbs.map((item) => wrapBreadcrumb(item, appHistory || params.history)),
+    ]);
+  };
+
   const deps: IndexPatternManagmentContext = {
     chrome,
     application,
@@ -86,40 +104,36 @@ export async function mountManagementSection(
     docLinks,
     data,
     indexPatternManagementStart: indexPatternManagementStart as IndexPatternManagementStart,
-    setBreadcrumbs: params.setBreadcrumbs,
+    setBreadcrumbs: setBreadcrumbsScope,
     getMlCardState,
     dataSourceEnabled,
   };
 
-  const router = (
-    <Router history={params.history}>
-      <Switch>
-        <Route path={['/create']}>
-          <CreateIndexPatternWizardWithRouter />
-        </Route>
-        <Route path={['/patterns/:id/field/:fieldName', '/patterns/:id/create-field/']}>
-          <CreateEditFieldContainer />
-        </Route>
-        <Route path={['/patterns/:id']}>
-          <EditIndexPatternContainer />
-        </Route>
-        <Route path={['/']}>
-          <IndexPatternTableWithRouter canSave={canSave} />
-        </Route>
-      </Switch>
-    </Router>
-  );
-
-  const content = (
-    <EuiPage restrictWidth="1200px">
-      <EuiPageBody component="main">{router}</EuiPageBody>
-    </EuiPage>
-  );
-
   ReactDOM.render(
-    <OpenSearchDashboardsContextProvider services={deps}>
-      <I18nProvider>{content}</I18nProvider>
-    </OpenSearchDashboardsContextProvider>,
+    <EuiPage restrictWidth="1200px">
+      <EuiPageBody component="main">
+        <OpenSearchDashboardsContextProvider services={deps}>
+          <I18nProvider>
+            <Router history={params.history}>
+              <Switch>
+                <Route path={['/create']}>
+                  <CreateIndexPatternWizardWithRouter />
+                </Route>
+                <Route path={['/patterns/:id/field/:fieldName', '/patterns/:id/create-field/']}>
+                  <CreateEditFieldContainer />
+                </Route>
+                <Route path={['/patterns/:id']}>
+                  <EditIndexPatternContainer />
+                </Route>
+                <Route path={['/']}>
+                  <IndexPatternTableWithRouter canSave={canSave} />
+                </Route>
+              </Switch>
+            </Router>
+          </I18nProvider>
+        </OpenSearchDashboardsContextProvider>
+      </EuiPageBody>
+    </EuiPage>,
     params.element
   );
 

diff --git a/src/plugins/index_pattern_management/public/plugin.ts b/src/plugins/index_pattern_management/public/plugin.ts
@@ -47,12 +47,11 @@ import {
   IndexPatternManagementServiceStart,
 } from './service';
 
-import { ManagementAppMountParams, ManagementSetup } from '../../management/public';
+import { ManagementAppMountParams } from '../../management/public';
 import { DEFAULT_APP_CATEGORIES } from '../../../core/public';
 import { reactRouterNavigate } from '../../opensearch_dashboards_react/public';
 
 export interface IndexPatternManagementSetupDependencies {
-  management: ManagementSetup;
   urlForwarding: UrlForwardingSetup;
 }
 
@@ -85,14 +84,8 @@ export class IndexPatternManagementPlugin
 
   public setup(
     core: CoreSetup<IndexPatternManagementStartDependencies, IndexPatternManagementStart>,
-    { management, urlForwarding }: IndexPatternManagementSetupDependencies
+    { urlForwarding }: IndexPatternManagementSetupDependencies
   ) {
-    const opensearchDashboardsSection = management.sections.section.opensearchDashboards;
-
-    if (!opensearchDashboardsSection) {
-      throw new Error('`opensearchDashboards` management section not found.');
-    }
-
     const newAppPath = IPM_APP_ID;
     const legacyPatternsPath = 'management/opensearch-dashboards/index_patterns';