[8.x] [Spaces Management] Ensure current badge can only appear for si…

…ngle entry (#193195) (#193370)

# Backport

This will backport the following commits from `main` to `8.x`:
- [[Spaces Management] Ensure current badge can only appear for single
entry (#193195)](#193195)

<!--- Backport version: 8.9.8 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Tim
Sullivan","email":"[email protected]"},"sourceCommit":{"committedDate":"2024-09-18T15:19:05Z","message":"[Spaces
Management] Ensure current badge can only appear for single entry
(#193195)\n\n## Summary\r\n\r\nCloses #192811\r\n\r\n###
Checklist\r\n\r\nDelete any items that are not applicable to this
PR.\r\n\r\n- [X] [Unit or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated
or","sha":"5bf4501f5f39f05c3586083e867679d9952eda9d","branchLabelMapping":{"^v9.0.0$":"main","^v8.16.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Team:Security","release_note:skip","backport:skip","v9.0.0","v8.16.0","backport:version"],"number":193195,"url":"https://github.com/elastic/kibana/pull/193195","mergeCommit":{"message":"[Spaces
Management] Ensure current badge can only appear for single entry
(#193195)\n\n## Summary\r\n\r\nCloses #192811\r\n\r\n###
Checklist\r\n\r\nDelete any items that are not applicable to this
PR.\r\n\r\n- [X] [Unit or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated
or","sha":"5bf4501f5f39f05c3586083e867679d9952eda9d"}},"sourceBranch":"main","suggestedTargetBranches":["8.x"],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","labelRegex":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/193195","number":193195,"mergeCommit":{"message":"[Spaces
Management] Ensure current badge can only appear for single entry
(#193195)\n\n## Summary\r\n\r\nCloses #192811\r\n\r\n###
Checklist\r\n\r\nDelete any items that are not applicable to this
PR.\r\n\r\n- [X] [Unit or
functional\r\ntests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)\r\nwere
updated
or","sha":"5bf4501f5f39f05c3586083e867679d9952eda9d"}},{"branch":"8.x","label":"v8.16.0","labelRegex":"^v8.16.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: Elastic Machine <[email protected]>

x-pack/plugins/spaces/public/management/spaces_grid/spaces_grid_page.test.tsx

@@ -19,7 +19,6 @@ import { mountWithIntl, shallowWithIntl } from '@kbn/test-jest-helpers';
 
 import { SpacesGridPage } from './spaces_grid_page';
 import { SpaceAvatarInternal } from '../../space_avatar/space_avatar_internal';
-import type { SpacesManager } from '../../spaces_manager';
 import { spacesManagerMock } from '../../spaces_manager/mocks';
 
 const spaces = [
@@ -73,7 +72,7 @@ describe('SpacesGridPage', () => {
 
     const wrapper = shallowWithIntl(
       <SpacesGridPage
-        spacesManager={spacesManager as unknown as SpacesManager}
+        spacesManager={spacesManager}
         getFeatures={featuresStart.getFeatures}
         notifications={notificationServiceMock.createStartContract()}
         getUrlForApp={getUrlForApp}
@@ -133,7 +132,7 @@ describe('SpacesGridPage', () => {
 
     const wrapper = shallowWithIntl(
       <SpacesGridPage
-        spacesManager={spacesManager as unknown as SpacesManager}
+        spacesManager={spacesManager}
         getFeatures={featuresStart.getFeatures}
         notifications={notificationServiceMock.createStartContract()}
         getUrlForApp={getUrlForApp}
@@ -163,13 +162,21 @@ describe('SpacesGridPage', () => {
   });
 
   it('renders a "current" badge for the current space', async () => {
-    spacesManager.getActiveSpace.mockResolvedValue(spaces[2]);
-    const current = await spacesManager.getActiveSpace();
-    expect(current.id).toBe('custom-2');
+    const spacesWithCurrent = [
+      { id: 'default', name: 'Default', disabledFeatures: [], _reserved: true },
+      { id: 'test-1', name: 'Test', disabledFeatures: [] },
+      { id: 'test-2', name: 'Test', disabledFeatures: [] },
+    ];
+    const spacesManagerWithCurrent = spacesManagerMock.create();
+    spacesManagerWithCurrent.getSpaces = jest.fn().mockResolvedValue(spacesWithCurrent);
+    spacesManagerWithCurrent.getActiveSpace.mockResolvedValue(spacesWithCurrent[2]);
+
+    const current = await spacesManagerWithCurrent.getActiveSpace();
+    expect(current.id).toBe('test-2');
 
     const wrapper = mountWithIntl(
       <SpacesGridPage
-        spacesManager={spacesManager as unknown as SpacesManager}
+        spacesManager={spacesManagerWithCurrent}
         getFeatures={featuresStart.getFeatures}
         notifications={notificationServiceMock.createStartContract()}
         getUrlForApp={getUrlForApp}
@@ -189,10 +196,20 @@ describe('SpacesGridPage', () => {
     await act(async () => {});
     wrapper.update();
 
-    const activeRow = wrapper.find('[data-test-subj="spacesListTableRow-custom-2"]');
+    const activeRow = wrapper.find('[data-test-subj="spacesListTableRow-test-2"]');
     const nameCell = activeRow.find('[data-test-subj="spacesListTableRowNameCell"]');
     const activeBadge = nameCell.find('EuiBadge');
     expect(activeBadge.text()).toBe('current');
+
+    // ensure that current badge appears only once
+    const currentBadges = wrapper.findWhere((node) => {
+      return (
+        node.type() === 'span' &&
+        node.prop('data-test-subj') &&
+        node.prop('data-test-subj').includes('spacesListCurrentBadge')
+      );
+    });
+    expect(currentBadges.length).toBe(1);
   });
 
   it('renders a non-clickable "switch" action for the current space', async () => {
@@ -202,7 +219,7 @@ describe('SpacesGridPage', () => {
 
     const wrapper = mountWithIntl(
       <SpacesGridPage
-        spacesManager={spacesManager as unknown as SpacesManager}
+        spacesManager={spacesManager}
         getFeatures={featuresStart.getFeatures}
         notifications={notificationServiceMock.createStartContract()}
         getUrlForApp={getUrlForApp}
@@ -234,7 +251,7 @@ describe('SpacesGridPage', () => {
 
     const wrapper = mountWithIntl(
       <SpacesGridPage
-        spacesManager={spacesManager as unknown as SpacesManager}
+        spacesManager={spacesManager}
         getFeatures={featuresStart.getFeatures}
         notifications={notificationServiceMock.createStartContract()}
         getUrlForApp={getUrlForApp}
@@ -265,7 +282,7 @@ describe('SpacesGridPage', () => {
 
     const wrapper = mountWithIntl(
       <SpacesGridPage
-        spacesManager={spacesManager as unknown as SpacesManager}
+        spacesManager={spacesManager}
         getFeatures={featuresStart.getFeatures}
         notifications={notificationServiceMock.createStartContract()}
         getUrlForApp={getUrlForApp}
@@ -295,7 +312,7 @@ describe('SpacesGridPage', () => {
 
     const wrapper = mountWithIntl(
       <SpacesGridPage
-        spacesManager={spacesManager as unknown as SpacesManager}
+        spacesManager={spacesManager}
         getFeatures={featuresStart.getFeatures}
         notifications={notificationServiceMock.createStartContract()}
         getUrlForApp={getUrlForApp}
@@ -331,7 +348,7 @@ describe('SpacesGridPage', () => {
 
     const wrapper = shallowWithIntl(
       <SpacesGridPage
-        spacesManager={spacesManager as unknown as SpacesManager}
+        spacesManager={spacesManager}
         getFeatures={featuresStart.getFeatures}
         notifications={notifications}
         getUrlForApp={getUrlForApp}
@@ -367,7 +384,7 @@ describe('SpacesGridPage', () => {
 
     const wrapper = shallowWithIntl(
       <SpacesGridPage
-        spacesManager={spacesManager as unknown as SpacesManager}
+        spacesManager={spacesManager}
         getFeatures={() => Promise.reject(error)}
         notifications={notifications}
         getUrlForApp={getUrlForApp}

x-pack/plugins/spaces/public/management/spaces_grid/spaces_grid_page.tsx

@@ -284,7 +284,7 @@ export class SpacesGridPage extends Component<Props, State> {
                 {value}
               </EuiLink>
             </EuiFlexItem>
-            {this.state.activeSpace?.name === rowRecord.name && (
+            {this.state.activeSpace?.id === rowRecord.id && (
               <EuiFlexItem grow={false}>
                 <EuiBadge color="primary" data-test-subj={`spacesListCurrentBadge-${rowRecord.id}`}>
                   {i18n.translate('xpack.spaces.management.spacesGridPage.currentSpaceMarkerText', {