[navigation-next] Fix issues. (#7356) (#7377)

* [navigation-next] fix: redirect to standard index pattern applications while nav group is enabled (#7305) * feat: fix the incorrect jumping logic for Index pattern management * Changeset file for PR #7305 created/updated * feat: update * feat: update with comment * feat: update order and remove reset logic * feat: update * feat: update * feat: update snapshot * feat: some category change * feat: update category --------- * fix: bugs found in integration test * Changeset file for PR #7356 created/updated * feat: show workspace detail in all use case * fix: unit test error * feat: revert back detect category --------- (cherry picked from commit 8b46c44) 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: opensearch-changeset-bot[bot] <154024398+opensearch-changeset-bot[bot]@users.noreply.github.com>
opensearch-project · Jul 23, 2024 · 6551af7 · 6551af7
1 parent 3587291
commit 6551af7
Show file tree

Hide file tree

Showing 11 changed files with 103 additions and 20 deletions.
diff --git a/changelogs/fragments/7356.yml b/changelogs/fragments/7356.yml
@@ -0,0 +1,2 @@
+fix:
+- [navigation-next] Fix issues. ([#7356](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/7356))
diff --git a/src/core/public/chrome/ui/header/__snapshots__/collapsible_nav_group_enabled.test.tsx.snap b/src/core/public/chrome/ui/header/__snapshots__/collapsible_nav_group_enabled.test.tsx.snap
diff --git a/src/core/public/chrome/ui/header/collapsible_nav_group_enabled.tsx b/src/core/public/chrome/ui/header/collapsible_nav_group_enabled.tsx
@@ -177,7 +177,7 @@ export function CollapsibleNavGroupEnabled({
  basePath,
  id,
  isLocked,
- isNavOpen,
+ isNavOpen: isNavOpenProps,
  storage = window.localStorage,
  onIsLockedUpdate,
  closeNav,
@@ -263,6 +263,18 @@ export function CollapsibleNavGroupEnabled({
  return fulfillRegistrationLinksToChromeNavLinks(navLinksForAll, navLinks);
  }, [navLinks, navGroupsMap, currentNavGroup]);
 
+ const isNavOpen = useMemo(() => {
+ // For now, only home page need to always collapse left navigation
+ // when workspace is enabled.
+ // If there are more pages need to collapse left navigation in the future
+ // need to come up with a mechanism to register.
+ if (capabilities.workspaces.enabled && appId === 'home') {
+ return false;
+ }
+
+ return isNavOpenProps;
+ }, [isNavOpenProps, capabilities.workspaces.enabled, appId]);
+
  const width = useMemo(() => {
  if (!isNavOpen) {
  return 50;
@@ -271,14 +283,6 @@ export function CollapsibleNavGroupEnabled({
  return 270;
  }, [isNavOpen]);
 
- // For now, only home page need to hide left navigation
- // when workspace is enabled.
- // If there are more pages need to hide left navigation in the future
- // need to come up with a mechanism to register.
- if (capabilities.workspaces.enabled && appId === 'home') {
- return null;
- }
-
  const onGroupClick = (
  e: React.MouseEvent<HTMLButtonElement, MouseEvent>,
  group: NavGroupItemInMap

diff --git a/src/core/utils/default_app_categories.ts b/src/core/utils/default_app_categories.ts
@@ -102,13 +102,12 @@ export const DEFAULT_APP_CATEGORIES: Record<string, AppCategory> = Object.freeze
  }),
  order: 4000,
  },
- // TODO remove this default category
  detect: {
- id: 'configure',
- label: i18n.translate('core.ui.configure.label', {
- defaultMessage: 'Configure',
+ id: 'detect',
+ label: i18n.translate('core.ui.detect.label', {
+ defaultMessage: 'Detect',
  }),
- order: 2000,
+ order: 3000,
  },
  configure: {
  id: 'configure',

diff --git a/src/core/utils/default_nav_groups.ts b/src/core/utils/default_nav_groups.ts
@@ -37,7 +37,7 @@ const defaultNavGroups = {
  defaultMessage: 'All use case',
  }),
  description: i18n.translate('core.ui.group.all.description', {
- defaultMessage: 'This is a usse case contains all the features.',
+ defaultMessage: 'This is a use case contains all the features.',
  }),
  order: 3000,
  type: NavGroupType.SYSTEM,

diff --git a/src/plugins/advanced_settings/public/plugin.ts b/src/plugins/advanced_settings/public/plugin.ts
@@ -34,7 +34,7 @@ import { FeatureCatalogueCategory } from '../../home/public';
 import { ComponentRegistry } from './component_registry';
 import { AdvancedSettingsSetup, AdvancedSettingsStart, AdvancedSettingsPluginSetup } from './types';
 import { setupTopNavThemeButton } from './register_nav_control';
-import { DEFAULT_NAV_GROUPS, AppNavLinkStatus } from '../../../core/public';
+import { DEFAULT_NAV_GROUPS, AppNavLinkStatus, WorkspaceAvailability } from '../../../core/public';
 
 const component = new ComponentRegistry();
 
@@ -69,6 +69,7 @@ export class AdvancedSettingsPlugin
  navLinkStatus: core.chrome.navGroup.getNavGroupEnabled()
  ? AppNavLinkStatus.visible
  : AppNavLinkStatus.hidden,
+ workspaceAvailability: WorkspaceAvailability.outsideWorkspace,
  mount: async (params: AppMountParameters) => {
  const { mountManagementSection } = await import(
  './management_app/mount_management_section'

diff --git a/src/plugins/dev_tools/public/plugin.ts b/src/plugins/dev_tools/public/plugin.ts
@@ -49,6 +49,7 @@ import './index.scss';
 import { ManagementOverViewPluginSetup } from '../../management_overview/public';
 import { toMountPoint } from '../../opensearch_dashboards_react/public';
 import { DevToolsIcon } from './dev_tools_icon';
+import { WorkspaceAvailability } from '../../../core/public';
 
 export interface DevToolsSetupDependencies {
  urlForwarding: UrlForwardingSetup;
@@ -97,6 +98,7 @@ export class DevToolsPlugin implements Plugin<DevToolsSetup> {
  /* the order of dev tools, it shows as last item of management section */
  order: 9070,
  category: DEFAULT_APP_CATEGORIES.management,
+ workspaceAvailability: WorkspaceAvailability.outsideWorkspace,
  mount: async (params: AppMountParameters) => {
  const { element, history } = params;
  element.classList.add('devAppWrapper');

diff --git a/src/plugins/management/public/plugin.ts b/src/plugins/management/public/plugin.ts
@@ -45,6 +45,7 @@ import {
  AppStatus,
  AppNavLinkStatus,
  DEFAULT_NAV_GROUPS,
+ WorkspaceAvailability,
 } from '../../../core/public';
 
 import { MANAGEMENT_APP_ID } from '../common/contants';
@@ -124,6 +125,7 @@ export class ManagementPlugin implements Plugin<ManagementSetup, ManagementStart
  navLinkStatus: core.chrome.navGroup.getNavGroupEnabled()
  ? AppNavLinkStatus.visible
  : AppNavLinkStatus.hidden,
+ workspaceAvailability: WorkspaceAvailability.outsideWorkspace,
  mount: async (params: AppMountParameters) => {
  const { renderApp } = await import('./landing_page_application');
  const [coreStart] = await core.getStartServices();
@@ -156,6 +158,7 @@ export class ManagementPlugin implements Plugin<ManagementSetup, ManagementStart
  navLinkStatus: core.chrome.navGroup.getNavGroupEnabled()
  ? AppNavLinkStatus.visible
  : AppNavLinkStatus.hidden,
+ workspaceAvailability: WorkspaceAvailability.outsideWorkspace,
  mount: async (params: AppMountParameters) => {
  const { renderApp } = await import('./landing_page_application');
  const [coreStart] = await core.getStartServices();

diff --git a/src/plugins/workspace/public/components/workspace_menu/workspace_menu.tsx b/src/plugins/workspace/public/components/workspace_menu/workspace_menu.tsx
@@ -106,7 +106,7 @@ export const WorkspaceMenu = ({ coreStart, registeredUseCases$ }: Props) => {
  };
 
  const currentWorkspaceButton = currentWorkspace ? (
- <EuiButtonEmpty flush="left" onClick={openPopover} data-test-subj="current-workspace-button">
+ <EuiButtonEmpty onClick={openPopover} data-test-subj="current-workspace-button">
  <EuiAvatar
  size="s"
  type="space"

diff --git a/src/plugins/workspace/public/plugin.test.ts b/src/plugins/workspace/public/plugin.test.ts
@@ -177,6 +177,31 @@ describe('Workspace plugin', () => {
  );
  });
 
+ it('#setup should register workspace detail with a visible application and register to all nav group', async () => {
+ const setupMock = coreMock.createSetup();
+ setupMock.chrome.navGroup.getNavGroupEnabled.mockReturnValue(true);
+ const workspacePlugin = new WorkspacePlugin();
+ await workspacePlugin.setup(setupMock, {});
+
+ expect(setupMock.application.register).toHaveBeenCalledWith(
+ expect.objectContaining({
+ id: 'workspace_detail',
+ navLinkStatus: AppNavLinkStatus.visible,
+ })
+ );
+
+ expect(setupMock.chrome.navGroup.addNavLinksToGroup).toHaveBeenCalledWith(
+ DEFAULT_NAV_GROUPS.all,
+ expect.arrayContaining([
+ {
+ id: 'workspace_detail',
+ title: 'Overview',
+ order: 100,
+ },
+ ])
+ );
+ });
+
  it('#start add workspace detail page to breadcrumbs when start', async () => {
  const startMock = coreMock.createStart();
  const workspaceObject = {
@@ -264,6 +289,7 @@ describe('Workspace plugin', () => {
  title: 'Foo',
  features: ['system-feature'],
  systematic: true,
+ description: '',
  },
  ]);
  jest.spyOn(UseCaseService.prototype, 'start').mockImplementationOnce(() => ({
@@ -286,7 +312,7 @@ describe('Workspace plugin', () => {
 
  const appUpdater = await appUpdater$.pipe(first()).toPromise();
 
- expect(appUpdater({ id: 'system-feature' })).toBeUndefined();
+ expect(appUpdater({ id: 'system-feature', title: '', mount: () => () => {} })).toBeUndefined();
  });
 
  it('#start should update nav group status after currentWorkspace set', async () => {
@@ -334,6 +360,7 @@ describe('Workspace plugin', () => {
  title: 'Foo',
  features: ['system-feature'],
  systematic: true,
+ description: '',
  },
  ]);
  jest.spyOn(UseCaseService.prototype, 'start').mockImplementationOnce(() => ({

diff --git a/src/plugins/workspace/public/plugin.ts b/src/plugins/workspace/public/plugin.ts
@@ -107,7 +107,13 @@ export class WorkspacePlugin
  this.registeredUseCases$,
  ]).subscribe(([currentWorkspace, registeredUseCases]) => {
  if (currentWorkspace) {
+ const isAllUseCase =
+ getFirstUseCaseOfFeatureConfigs(currentWorkspace.features || []) === ALL_USE_CASE_ID;
  this.appUpdater$.next((app) => {
+ // When in all workspace, the home should be replaced by workspace detail page
+ if (app.id === 'home' && isAllUseCase) {
+ return { navLinkStatus: AppNavLinkStatus.hidden };
+ }
  if (isAppAccessibleInWorkspace(app, currentWorkspace, registeredUseCases)) {
  return;
  }
@@ -327,7 +333,9 @@ export class WorkspacePlugin
  title: i18n.translate('workspace.settings.workspaceDetail', {
  defaultMessage: 'Workspace Detail',
  }),
- navLinkStatus: AppNavLinkStatus.hidden,
+ navLinkStatus: core.chrome.navGroup.getNavGroupEnabled()
+ ? AppNavLinkStatus.visible
+ : AppNavLinkStatus.hidden,
  async mount(params: AppMountParameters) {
  const { renderDetailApp } = await import('./application');
  return mountWorkspaceApp(params, renderDetailApp);
@@ -353,6 +361,16 @@ export class WorkspacePlugin
  workspaceAvailability: WorkspaceAvailability.outsideWorkspace,
  });
 
+ core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.all, [
+ {
+ id: WORKSPACE_DETAIL_APP_ID,
+ order: 100,
+ title: i18n.translate('workspace.nav.workspaceDetail.title', {
+ defaultMessage: 'Overview',
+ }),
+ },
+ ]);
+
  core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.settingsAndSetup, [
  {
  id: WORKSPACE_LIST_APP_ID,