Move Cluster Operation Mode from domain page metadata component to helper (#1009)

Move Cluster Operation Mode from domain page metadata component to helper, so that it can also be reused in the domain page header.

Author: adhityamamallan

src/views/domain-page/config/domain-page-header-info-items.config.ts

@@ -3,6 +3,7 @@ import {
   type DomainHeaderInfoItemContentProps,
   type DomainPageHeaderInfoItemsConfig,
 } from '../domain-page-header-info/domain-page-header-info.types';
+import getClusterOperationMode from '../helpers/get-cluster-operation-mode';
 
 const domainPageHeaderInfoItemsConfig = [
   {
@@ -11,9 +12,9 @@ const domainPageHeaderInfoItemsConfig = [
     placeholderSize: '120px',
   },
   {
-    title: 'Global/Local',
+    title: 'Mode',
     getLabel: (props: DomainHeaderInfoItemContentProps) =>
-      props.domainDescription.isGlobalDomain ? 'Global' : 'Local',
+      getClusterOperationMode(props.domainDescription),
     placeholderSize: '64px',
   },
   {

src/views/domain-page/config/domain-page-metadata-extended-table.config.ts

@@ -3,9 +3,9 @@ import { createElement } from 'react';
 import DomainPageMetadataClusters from '../domain-page-metadata-clusters/domain-page-metadata-clusters';
 import DomainPageMetadataDescription from '../domain-page-metadata-description/domain-page-metadata-description';
 import DomainPageMetadataFailoverVersion from '../domain-page-metadata-failover-version/domain-page-metadata-failover-version';
-import DomainPageMetadataMode from '../domain-page-metadata-mode/domain-page-metadata-mode';
 import { type MetadataItem } from '../domain-page-metadata-table/domain-page-metadata-table.types';
 import DomainPageMetadataViewJson from '../domain-page-metadata-view-json/domain-page-metadata-view-json';
+import getClusterOperationMode from '../helpers/get-cluster-operation-mode';
 
 const domainPageMetadataExtendedTableConfig = [
   {
@@ -47,7 +47,7 @@ const domainPageMetadataExtendedTableConfig = [
     description: 'Domain operation mode in multi-cluster setup',
     kind: 'simple',
     getValue: ({ domainDescription }) =>
-      createElement(DomainPageMetadataMode, domainDescription),
+      getClusterOperationMode(domainDescription),
   },
   {
     key: 'failoverVersion',

src/views/domain-page/config/domain-page-metadata-table.config.ts

@@ -2,8 +2,8 @@ import type { ListTableItem } from '@/components/list-table/list-table.types';
 
 import DomainPageMetadataClusters from '../domain-page-metadata-clusters/domain-page-metadata-clusters';
 import DomainPageMetadataFailoverVersion from '../domain-page-metadata-failover-version/domain-page-metadata-failover-version';
-import DomainPageMetadataMode from '../domain-page-metadata-mode/domain-page-metadata-mode';
 import { type DomainDescription } from '../domain-page.types';
+import getClusterOperationMode from '../helpers/get-cluster-operation-mode';
 
 const domainPageMetadataTableConfig: Array<ListTableItem<DomainDescription>> = [
   {
@@ -25,7 +25,8 @@ const domainPageMetadataTableConfig: Array<ListTableItem<DomainDescription>> = [
   {
     key: 'mode',
     label: 'Mode',
-    renderValue: DomainPageMetadataMode,
+    renderValue: (domainDescription: DomainDescription) =>
+      getClusterOperationMode(domainDescription),
   },
   {
     key: 'failoverVersion',

src/views/domain-page/domain-page-header-info/__tests__/domain-page-header-info.test.tsx

@@ -72,7 +72,7 @@ describe(DomainPageHeaderInfo.name, () => {
     expect(
       screen.getByTestId('mock-domain-cluster-selector')
     ).toBeInTheDocument();
-    expect(screen.getByText('Global')).toBeInTheDocument();
+    expect(screen.getByText('Active-Passive')).toBeInTheDocument();
     expect(screen.getByText('mock-domain-staging-uuid')).toBeInTheDocument();
   });
 });

src/views/domain-page/domain-page-metadata-mode/__tests__/domain-page-metadata-mode.test.tsx

@@ -0,0 +1,32 @@
+import { mockActiveActiveDomain } from '@/views/shared/active-active/__fixtures__/active-active-domain';
+
+import {
+  mockDomainDescription,
+  mockDomainDescriptionSingleCluster,
+} from '../../__fixtures__/domain-description';
+import getClusterOperationMode from '../get-cluster-operation-mode';
+
+jest.mock('@/views/shared/active-active/helpers/is-active-active-domain');
+
+describe(getClusterOperationMode.name, () => {
+  it('returns Active-Active when domain is active-active', () => {
+    expect(getClusterOperationMode(mockActiveActiveDomain)).toBe(
+      'Active-Active'
+    );
+  });
+
+  it('returns Active-Passive when domain is global but not active-active', () => {
+    expect(getClusterOperationMode(mockDomainDescription)).toBe(
+      'Active-Passive'
+    );
+  });
+
+  it('returns Local when domain is not global', () => {
+    const nonGlobalDomain = {
+      ...mockDomainDescriptionSingleCluster,
+      isGlobalDomain: false,
+    };
+
+    expect(getClusterOperationMode(nonGlobalDomain)).toBe('Local');
+  });
+});

src/views/domain-page/helpers/__tests__/get-cluster-operation-mode.test.ts

@@ -2,9 +2,9 @@ import isActiveActiveDomain from '@/views/shared/active-active/helpers/is-active
 
 import { type DomainDescription } from '../domain-page.types';
 
-export default function DomainPageMetadataMode(
+export default function getClusterOperationMode(
   domainDescription: DomainDescription
-) {
+): string {
   if (isActiveActiveDomain(domainDescription)) {
     return 'Active-Active';
   }