navigates to use case overview page (#7748) (#7814)

click on workspace name navigates to use case overview page

Changeset file for PR #7748 created/updated

support customized width

style adjustment

update test snapshot



(cherry picked from commit a550601)

Signed-off-by: Hailong Cui <[email protected]>
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: Yulong Ruan <[email protected]>

changelogs/fragments/7748.yml

@@ -0,0 +1,2 @@
+feat:
+- [Workspace]Fix click on workspace name not navigates to use case overview page ([#7748](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/7748))

src/plugins/workspace/public/components/service_card/workspace_list_card.test.tsx

@@ -8,16 +8,40 @@ import { coreMock } from '../../../../../core/public/mocks';
 import { fireEvent, render, waitFor } from '@testing-library/react';
 import { WorkspaceListCard } from './workspace_list_card';
 import { recentWorkspaceManager } from '../../recent_workspace_manager';
+import { BehaviorSubject } from 'rxjs';
+import { NavGroupItemInMap } from 'opensearch-dashboards/public';
 
 describe('workspace list card render normally', () => {
-  const coreStart = coreMock.createStart();
+  const navGroupMap: Record<string, NavGroupItemInMap> = {
+    group1: {
+      id: 'group1',
+      title: 'title',
+      description: 'desc',
+      navLinks: [
+        {
+          id: 'link1',
+        },
+      ],
+    },
+  };
+  const coreStart = {
+    ...coreMock.createStart(),
+    chrome: {
+      ...coreMock.createStart().chrome,
+      navGroup: {
+        ...coreMock.createStart().chrome.navGroup,
+        getNavGroupsMap$: () => new BehaviorSubject(navGroupMap),
+      },
+    },
+  };
 
   beforeAll(() => {
     const workspaceList = [
       {
         id: 'ws-1',
         name: 'foo',
         lastUpdatedTime: new Date().toISOString(),
+        features: ['use-case-group1'],
       },
       {
         id: 'ws-2',
@@ -38,7 +62,11 @@ describe('workspace list card render normally', () => {
     expect(getByTestId('workspace_filter')).toHaveDisplayValue('Recently viewed');
 
     // empty statue for recently viewed
-    expect(getByText('Workspaces you have recently viewed will appear here.')).toBeInTheDocument();
+    expect(
+      getByText(
+        'Contact your administrator to create a workspace or to be added to an existing one.'
+      )
+    ).toBeInTheDocument();
   });
 
   it('should show default filter as recently viewed', () => {
@@ -64,6 +92,21 @@ describe('workspace list card render normally', () => {
     expect(getByText('bar')).toBeInTheDocument();
   });
 
+  it('should navigate to workspace use case overview page when click on workspace name', () => {
+    const { getByTestId, getByText } = render(<WorkspaceListCard core={coreStart} />);
+    const filterSelector = getByTestId('workspace_filter');
+    fireEvent.change(filterSelector, { target: { value: 'updated' } });
+    expect(getByTestId('workspace_filter')).toHaveDisplayValue('Recently updated');
+
+    // workspace list
+    expect(getByText('foo')).toBeInTheDocument();
+
+    fireEvent.click(getByText('foo'));
+    expect(coreStart.application.getUrlForApp).toHaveBeenLastCalledWith('link1', {
+      absolute: true,
+    });
+  });
+
   it('should render create workspace button when is dashboard admin and navigate to create new workspace page when clicking on plus button', () => {
     coreStart.application.capabilities = {
       ...coreStart.application.capabilities,
@@ -79,7 +122,10 @@ describe('workspace list card render normally', () => {
   });
 
   it('should navigate to workspace list page when click on View all button', () => {
-    const { getByText } = render(<WorkspaceListCard core={coreStart} />);
+    const { getByText, getByTestId } = render(<WorkspaceListCard core={coreStart} />);
+    const filterSelector = getByTestId('workspace_filter');
+    fireEvent.change(filterSelector, { target: { value: 'updated' } });
+    expect(getByTestId('workspace_filter')).toHaveDisplayValue('Recently updated');
     const mockButton = getByText('View all');
     fireEvent.click(mockButton);
     expect(coreStart.application.navigateToApp).toHaveBeenCalledWith('workspace_list');