Configured alert manager and api explorer to use ResourceDataView

Author: krishagarwal278

frontend/packages/integration-tests-cypress/tests/cluster-settings/alertmanager/alertmanager.cy.ts

@@ -75,10 +75,10 @@ describe('Alertmanager', () => {
     cy.byTestID('label-0').type(label);
     alertmanager.save();
     alertmanager.validateCreation(receiverName, receiverType, label);
-    listPage.rows.clickKebabAction(receiverName, 'Delete Receiver');
+    listPage.dvRows.clickKebabAction(receiverName, 'Delete Receiver');
     warningModal.confirm('AlertmanagerDeleteReceiverConfirmation');
     warningModal.shouldBeClosed('AlertmanagerDeleteReceiverConfirmation');
-    listPage.rows.shouldNotExist(receiverName);
+    listPage.dvRows.shouldNotExist(receiverName);
   });
 
   it('prevents deletion and form edit of a receiver with sub-route', () => {
@@ -100,7 +100,7 @@ receivers:
     yamlEditor.clickSaveCreateButton();
     cy.byTestID('alert-success').should('exist');
     detailsPage.selectTab('Details');
-    cy.get('[data-test-rows="resource-row"]')
+    cy.get('[data-test="data-view-table"]')
       .contains('team-X-pager')
       .parents('tr')
       .within(() => {
@@ -180,7 +180,7 @@ route:
     yamlEditor.clickSaveCreateButton();
     cy.get('.yaml-editor__buttons .pf-m-success').should('exist');
     detailsPage.selectTab('Details');
-    listPage.rows.shouldExist(receiverName);
+    listPage.dvRows.shouldExist(receiverName);
     alertmanager.visitEditPage(receiverName);
     cy.byTestID('label-0').should('have.value', matcher1);
     cy.byTestID('label-1').should('have.value', matcher2);

frontend/packages/integration-tests-cypress/tests/cluster-settings/alertmanager/receivers/pagerduty.cy.ts

@@ -53,7 +53,7 @@ describe('Alertmanager: PagerDuty Receiver Form', () => {
     alertmanager.validateCreation(receiverName, receiverType, label);
 
     cy.log('update pagerduty_url');
-    listPage.rows.clickKebabAction(receiverName, 'Edit Receiver');
+    listPage.dvRows.clickKebabAction(receiverName, 'Edit Receiver');
     // Save as default checkbox disabled when url equals global url
     cy.byTestID('save-as-default').should('be.disabled');
     // changing url enables Save as default checkbox, should save pagerduty_url with Receiver

frontend/packages/integration-tests-cypress/tests/crud/other-routes.cy.ts

@@ -41,7 +41,7 @@ describe('Visiting other routes', () => {
     },
     {
       path: '/api-explorer',
-      waitFor: () => cy.get('[data-ouia-component-type$="TableRow"]').should('be.visible'),
+      waitFor: () => cy.get('[data-test="data-view-table"]').should('be.visible'),
     },
     {
       path: '/api-resource/ns/default/core~v1~Pod',
@@ -59,7 +59,7 @@ describe('Visiting other routes', () => {
       ? [
           {
             path: '/api-resource/ns/default/core~v1~Pod/access',
-            waitFor: () => cy.get('[data-ouia-component-type$="TableRow"]').should('be.visible'),
+            waitFor: () => cy.get('[data-test="data-view-table"]').should('be.visible'),
           },
           {
             path: '/k8s/cluster/user.openshift.io~v1~User',

frontend/packages/integration-tests-cypress/views/alertmanager.ts

@@ -73,9 +73,9 @@ export const alertmanager = {
   validateCreation: (receiverName: string, type: string, label: string) => {
     cy.byLegacyTestID('item-filter').clear();
     cy.byLegacyTestID('item-filter').type(receiverName);
-    listPage.rows.shouldExist(receiverName);
-    listPage.rows.shouldExist(type);
-    listPage.rows.shouldExist(label);
+    listPage.dvRows.shouldExist(receiverName);
+    listPage.dvRows.shouldExist(type);
+    listPage.dvRows.shouldExist(label);
   },
   visitAlertmanagerPage: () => {
     cy.visit('/settings/cluster/alertmanagerconfig');

frontend/packages/integration-tests-cypress/views/list-page.ts

@@ -104,6 +104,12 @@ export const listPage = {
     shouldBeLoaded: () => {
       cy.get(`[data-test="data-view-table"]`).should('be.visible');
     },
+    shouldExist: (resourceName: string) =>
+      cy.get(`[data-test="data-view-cell-${resourceName}-name"]`).contains(resourceName),
+    shouldNotExist: (resourceName: string) =>
+      cy
+        .get(`[data-test="data-view-cell-${resourceName}-name"]`, { timeout: 90000 })
+        .should('not.exist'),
     clickKebabAction: (resourceName: string, actionName: string) => {
       cy.get(`[data-test="data-view-cell-${resourceName}-name"]`)
         .contains(resourceName)

frontend/public/components/alert-manager.tsx

@@ -146,12 +146,20 @@ const getDataViewRows: GetDataViewRows<K8sResourceKind, undefined> = (data, colu
       },
       [tableColumnInfo[2].id]: {
         cell: <LabelList kind={AlertmanagerModel.kind} labels={metadata.labels} />,
+        props: {
+          modifier: 'nowrap',
+          width: 20,
+        },
       },
       [tableColumnInfo[3].id]: {
         cell: spec.version || '-',
       },
       [tableColumnInfo[4].id]: {
         cell: <Selector selector={spec.nodeSelector} kind="Node" />,
+        props: {
+          modifier: 'nowrap',
+          width: 20,
+        },
       },
       [tableColumnInfo[5].id]: {
         cell: <LazyActionMenu context={context} />,