[Workspace]Hide create workspace button for non dashboard admin

changelogs/fragments/7357.yml

@@ -0,0 +1,2 @@
+feat:
+- [Workspace]Hide create workspace button for non dashboard admin ([#7357](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/7357))

src/plugins/workspace/public/components/workspace_list/index.test.tsx

@@ -28,9 +28,16 @@ function getWrapWorkspaceListInContext(
     { id: 'id1', name: 'name1', features: ['use-case-all'] },
     { id: 'id2', name: 'name2' },
     { id: 'id3', name: 'name3', features: ['use-case-observability'] },
-  ]
+  ],
+  isDashboardAdmin = true
 ) {
   const coreStartMock = coreMock.createStart();
+  coreStartMock.application.capabilities = {
+    ...coreStartMock.application.capabilities,
+    dashboards: {
+      isDashboardAdmin,
+    },
+  };
 
   const services = {
     ...coreStartMock,
@@ -135,4 +142,16 @@ describe('WorkspaceList', () => {
     expect(queryByText('name1')).not.toBeInTheDocument();
     expect(getByText('name6')).toBeInTheDocument();
   });
+
+  it('should display create workspace button for dashboard admin', async () => {
+    const { getByText } = render(getWrapWorkspaceListInContext([], true));
+
+    expect(getByText('Create workspace')).toBeInTheDocument();
+  });
+
+  it('should hide create workspace button for non dashboard admin', async () => {
+    const { queryByText } = render(getWrapWorkspaceListInContext([], false));
+
+    expect(queryByText('Create workspace')).toBeNull();
+  });
 });

src/plugins/workspace/public/components/workspace_list/index.tsx

@@ -26,7 +26,7 @@ import { WORKSPACE_CREATE_APP_ID } from '../../../common/constants';
 
 import { cleanWorkspaceId } from '../../../../../core/public';
 import { DeleteWorkspaceModal } from '../delete_workspace_modal';
-import { getFirstUseCaseOfFeatureConfigs, getUseCaseFromFeatureConfig } from '../../utils';
+import { getFirstUseCaseOfFeatureConfigs } from '../../utils';
 import { WorkspaceUseCase } from '../../types';
 
 const WORKSPACE_LIST_PAGE_DESCRIPTION = i18n.translate('workspace.list.description', {
@@ -43,6 +43,7 @@ export const WorkspaceList = ({ registeredUseCases$ }: WorkspaceListProps) => {
     services: { workspaces, application, http },
   } = useOpenSearchDashboards();
   const registeredUseCases = useObservable(registeredUseCases$);
+  const isDashboardAdmin = application?.capabilities?.dashboards?.isDashboardAdmin;
 
   const initialSortField = 'name';
   const initialSortDirection = 'asc';
@@ -172,13 +173,19 @@ export const WorkspaceList = ({ registeredUseCases$ }: WorkspaceListProps) => {
       incremental: true,
     },
     toolsRight: [
-      <EuiSmallButton
-        href={workspaceCreateUrl}
-        key="create_workspace"
-        data-test-subj="workspaceList-create-workspace"
-      >
-        Create workspace
-      </EuiSmallButton>,
+      ...(isDashboardAdmin
+        ? [
+            <EuiSmallButton
+              href={workspaceCreateUrl}
+              key="create_workspace"
+              data-test-subj="workspaceList-create-workspace"
+            >
+              {i18n.translate('workspace.workspaceList.buttons.createWorkspace', {
+                defaultMessage: 'Create workspace',
+              })}
+            </EuiSmallButton>,
+          ]
+        : []),
     ],
   };
 

src/plugins/workspace/public/components/workspace_menu/workspace_menu.test.tsx

@@ -62,7 +62,7 @@ describe('<WorkspaceMenu />', () => {
   it('should display a list of workspaces in the dropdown', () => {
     coreStartMock.workspaces.workspaceList$.next([
       { id: 'workspace-1', name: 'workspace 1', features: [] },
-      { id: 'workspace-2', name: 'workspace 2', features: [] },
+      { id: 'workspace-2', name: 'workspace 2' },
     ]);
 
     render(<WorkspaceMenuCreatorComponent />);
@@ -170,4 +170,19 @@ describe('<WorkspaceMenu />', () => {
     fireEvent.click(screen.getByText(/View all/i));
     expect(coreStartMock.application.navigateToApp).toHaveBeenCalledWith('workspace_list');
   });
+
+  it('should hide create workspace button for non dashboard admin', () => {
+    coreStartMock.application.capabilities = {
+      ...coreStartMock.application.capabilities,
+      dashboards: {
+        ...coreStartMock.application.capabilities.dashboards,
+        isDashboardAdmin: false,
+      },
+    };
+    render(<WorkspaceMenuCreatorComponent />);
+
+    fireEvent.click(screen.getByTestId('workspace-select-button'));
+    expect(screen.getByText(/View all/i)).toBeInTheDocument();
+    expect(screen.queryByText(/create workspaces/i)).toBeNull();
+  });
 });

src/plugins/workspace/public/components/workspace_menu/workspace_menu.tsx

@@ -72,7 +72,7 @@ export const WorkspaceMenu = ({ coreStart, registeredUseCases$ }: Props) => {
   const [isPopoverOpen, setPopover] = useState(false);
   const currentWorkspace = useObservable(coreStart.workspaces.currentWorkspace$, null);
   const workspaceList = useObservable(coreStart.workspaces.workspaceList$, []);
-  const isDashboardAdmin = !!coreStart.application.capabilities.dashboards;
+  const isDashboardAdmin = coreStart.application.capabilities?.dashboards?.isDashboardAdmin;
   const availableUseCases = useObservable(registeredUseCases$, []);
 
   const filteredWorkspaceList = useMemo(() => {
@@ -90,7 +90,10 @@ export const WorkspaceMenu = ({ coreStart, registeredUseCases$ }: Props) => {
   const currentWorkspaceName = currentWorkspace?.name ?? defaultHeaderName;
 
   const getUseCase = (workspace: WorkspaceObject) => {
-    const useCaseId = getFirstUseCaseOfFeatureConfigs(workspace?.features!);
+    if (!workspace.features) {
+      return;
+    }
+    const useCaseId = getFirstUseCaseOfFeatureConfigs(workspace.features);
     return availableUseCases.find((useCase) => useCase.id === useCaseId);
   };