Add managed field in Cluster resources

assets/js/lib/test-utils/data/clusters.js

@@ -76,13 +76,15 @@ export default [
               role: 'Started',
               status: 'Active',
               type: 'stonith:external/sbd',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_SAPHanaTopology_HDD_HDB10',
               role: 'Started',
               status: 'Active',
               type: 'ocf::suse:SAPHanaTopology',
+              managed: true,
             },
           ],
           site: 'NBG',
@@ -111,27 +113,31 @@ export default [
               role: 'Master',
               status: 'Active',
               type: 'ocf::suse:SAPHana',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_SAPHanaTopology_HDD_HDB10',
               role: 'Started',
               status: 'Active',
               type: 'ocf::suse:SAPHanaTopology',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_ip_HDD_HDB10',
               role: 'Started',
               status: 'Active',
               type: 'ocf::heartbeat:IPaddr2',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_socat_HDD_HDB10',
               role: 'Started',
               status: 'Active',
               type: 'ocf::heartbeat:azure-lb',
+              managed: true,
             },
           ],
           site: 'WDF',
@@ -200,34 +206,39 @@ export default [
               role: 'Started',
               status: 'Active',
               type: 'stonith:external/sbd',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_SAPHana_HDQ_HDB10',
               role: 'Master',
               status: 'Active',
               type: 'ocf::suse:SAPHana',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_SAPHanaTopology_HDQ_HDB10',
               role: 'Started',
               status: 'Active',
               type: 'ocf::suse:SAPHanaTopology',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_ip_HDQ_HDB10',
               role: 'Started',
               status: 'Active',
               type: 'ocf::heartbeat:IPaddr2',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_socat_HDQ_HDB10',
               role: 'Started',
               status: 'Active',
               type: 'ocf::heartbeat:azure-lb',
+              managed: true,
             },
           ],
           site: 'NBG',
@@ -256,13 +267,15 @@ export default [
               role: 'Slave',
               status: 'Active',
               type: 'ocf::suse:SAPHana',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_SAPHanaTopology_HDQ_HDB10',
               role: 'Started',
               status: 'Active',
               type: 'ocf::suse:SAPHanaTopology',
+              managed: true,
             },
           ],
           site: 'WDF',
@@ -322,34 +335,39 @@ export default [
               role: 'Started',
               status: 'Active',
               type: 'stonith:external/sbd',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_SAPHana_HDP_HDB10',
               role: 'Master',
               status: 'Active',
               type: 'ocf::suse:SAPHana',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_SAPHanaTopology_HDP_HDB10',
               role: 'Started',
               status: 'Active',
               type: 'ocf::suse:SAPHanaTopology',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_ip_HDP_HDB10',
               role: 'Started',
               status: 'Active',
               type: 'ocf::heartbeat:IPaddr2',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_socat_HDP_HDB10',
               role: 'Started',
               status: 'Active',
               type: 'ocf::heartbeat:azure-lb',
+              managed: true,
             },
           ],
           site: 'NBG',
@@ -378,13 +396,15 @@ export default [
               role: 'Slave',
               status: 'Active',
               type: 'ocf::suse:SAPHana',
+              managed: true,
             },
             {
               fail_count: 0,
               id: 'rsc_SAPHanaTopology_HDP_HDB10',
               role: 'Started',
               status: 'Active',
               type: 'ocf::suse:SAPHanaTopology',
+              managed: true,
             },
           ],
           site: 'WDF',

assets/js/lib/test-utils/factories/clusters.js

@@ -24,9 +24,10 @@ export const sbdDevicesFactory = Factory.define(() => ({
 
 export const clusterResourceFactory = Factory.define(() => ({
   id: faker.string.uuid(),
-  role: faker.animal.bear(),
-  status: faker.animal.bird(),
-  type: faker.animal.cat(),
+  role: faker.location.country(),
+  status: faker.vehicle.bicycle(),
+  type: faker.color.human(),
+  managed: faker.datatype.boolean(),
   fail_count: faker.number.int(),
 }));
 

assets/js/pages/ClusterDetails/AscsErsClusterDetails.jsx

@@ -30,8 +30,8 @@ const nodeDetailsConfig = {
     {
       title: 'Hostname',
       key: '',
-      render: (_, { id, name, status }) => (
-        <ClusterNodeName hostId={id} status={status}>
+      render: (_, { id, name, status, resources }) => (
+        <ClusterNodeName hostId={id} status={status} resources={resources}>
           {name}
         </ClusterNodeName>
       ),

assets/js/pages/ClusterDetails/AscsErsClusterDetails.test.jsx

@@ -249,7 +249,7 @@ describe('ClusterDetails AscsErsClusterDetails component', () => {
     const sapSystems = buildSapSystemsFromAscsErsClusterDetails(details);
 
     const {
-      nodes: [{ attributes, resources }],
+      nodes: [{ attributes }],
     } = details.sap_systems[0];
 
     renderWithRouter(
@@ -269,13 +269,6 @@ describe('ClusterDetails AscsErsClusterDetails component', () => {
     expect(screen.getByText('Attributes')).toBeInTheDocument();
     expect(screen.getByText('Resources')).toBeInTheDocument();
 
-    Object.keys(resources[0]).forEach((key) => {
-      expect(screen.getByText(key)).toBeInTheDocument();
-      screen.getAllByText(resources[0][key]).forEach((element) => {
-        expect(element).toBeInTheDocument();
-      });
-    });
-
     Object.keys(attributes).forEach((key) => {
       screen.getAllByText(key).forEach((element) => {
         expect(element).toBeInTheDocument();

assets/js/pages/ClusterDetails/AttributesDetails.jsx

@@ -1,12 +1,13 @@
 import React, { useState } from 'react';
 
+import { capitalize } from 'lodash';
+
 import Button from '@common/Button';
 import Modal from '@common/Modal';
 import Table from '@common/Table';
 
 function AttributesDetails({ attributes, resources, title }) {
   const [modalOpen, setModalOpen] = useState(false);
-
   const attributesTableConfig = {
     usePadding: false,
     columns: [
@@ -19,12 +20,38 @@ function AttributesDetails({ attributes, resources, title }) {
     resources.length > 0
       ? {
           usePadding: false,
-          columns: Object.keys(resources[0]).map((key) => ({
-            title: key,
-            key,
-          })),
+          columns: [
+            {
+              title: 'fail count',
+              key: 'fail_count',
+            },
+            {
+              title: 'id',
+              key: 'id',
+            },
+            {
+              title: 'role',
+              key: 'role',
+            },
+            {
+              title: 'status',
+              key: 'status',
+            },
+            {
+              title: 'managed',
+              key: 'managed',
+              render: (content) => capitalize(`${content}`),
+            },
+            {
+              title: 'type',
+              key: 'type',
+            },
+          ],
         }
-      : { usePadding: false, columns: [] };
+      : {
+          usePadding: false,
+          columns: [],
+        };
 
   return (
     <>

assets/js/pages/ClusterDetails/AttributesDetails.test.jsx

@@ -0,0 +1,120 @@
+import React from 'react';
+
+import { screen, render } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import '@testing-library/jest-dom';
+import { faker } from '@faker-js/faker';
+import { capitalize } from 'lodash';
+
+import { clusterResourceFactory } from '@lib/test-utils/factories';
+
+import AttributesDetails from './AttributesDetails';
+
+describe('AttributesDetails', () => {
+  it('should show empty attributes table', async () => {
+    const resources = clusterResourceFactory.buildList(1);
+    const attributes = [];
+    const pageTitle = faker.person.firstName();
+
+    render(
+      <AttributesDetails
+        attributes={attributes}
+        resources={resources}
+        title={pageTitle}
+      />
+    );
+
+    const detailsButton = screen.getByText('Details');
+    await userEvent.click(detailsButton);
+
+    expect(screen.getByText(pageTitle)).toBeInTheDocument();
+    expect(screen.getByText('No data available')).toBeInTheDocument();
+  });
+
+  it('should show empty resources table', async () => {
+    const resources = [];
+    const attributes = { key1: 'value1', key2: 'value2' };
+    const pageTitle = faker.person.firstName();
+
+    render(
+      <AttributesDetails
+        attributes={attributes}
+        resources={resources}
+        title={pageTitle}
+      />
+    );
+
+    const detailsButton = screen.getByText('Details');
+    await userEvent.click(detailsButton);
+
+    expect(screen.getByText(pageTitle)).toBeInTheDocument();
+
+    expect(screen.getByText('No data available')).toBeInTheDocument();
+    expect(screen.queryByText('fail count')).not.toBeInTheDocument();
+  });
+
+  it('should show attributes', async () => {
+    const resources = [];
+    const attributes = { key1: 'value1', key2: 'value2' };
+    const pageTitle = faker.person.firstName();
+
+    render(
+      <AttributesDetails
+        attributes={attributes}
+        resources={resources}
+        title={pageTitle}
+      />
+    );
+
+    const detailsButton = screen.getByText('Details');
+    await userEvent.click(detailsButton);
+
+    expect(screen.getByText(pageTitle)).toBeInTheDocument();
+    const attributesTable = screen.getAllByRole('table')[0];
+    expect(
+      attributesTable.querySelectorAll('tbody > tr > td').item(0)
+    ).toHaveTextContent('key1');
+    expect(
+      attributesTable.querySelectorAll('tbody > tr > td').item(1)
+    ).toHaveTextContent('value1');
+  });
+
+  it('should show resources', async () => {
+    const resources = clusterResourceFactory.buildList(1);
+    const { id, role, status, type, managed, fail_count } = resources[0];
+    const attributes = {};
+    const pageTitle = faker.person.firstName();
+
+    render(
+      <AttributesDetails
+        attributes={attributes}
+        resources={resources}
+        title={pageTitle}
+      />
+    );
+
+    const detailsButton = screen.getByText('Details');
+    await userEvent.click(detailsButton);
+
+    expect(screen.getByText(pageTitle)).toBeInTheDocument();
+    const resourceTable = screen.getAllByRole('table')[1];
+    expect(
+      resourceTable.querySelectorAll('tbody > tr > td').item(0)
+    ).toHaveTextContent(fail_count);
+    expect(
+      resourceTable.querySelectorAll('tbody > tr > td').item(1)
+    ).toHaveTextContent(id);
+    expect(
+      resourceTable.querySelectorAll('tbody > tr > td').item(2)
+    ).toHaveTextContent(role);
+    expect(
+      resourceTable.querySelectorAll('tbody > tr > td').item(3)
+    ).toHaveTextContent(status);
+    expect(
+      resourceTable.querySelectorAll('tbody > tr > td').item(4)
+    ).toHaveTextContent(capitalize(`${managed}`));
+    expect(
+      resourceTable.querySelectorAll('tbody > tr > td').item(5)
+    ).toHaveTextContent(type);
+  });
+});