CONSOLE-4484: Remove co-m-horizontal-nav

openshift · Feb 12, 2025 · 50c670d · 50c670d
1 parent 85d3b1b
commit 50c670d
Show file tree

Hide file tree

Showing 12 changed files with 15 additions and 104 deletions.
diff --git a/...es/dev-console/integration-tests/support/step-definitions/monitoring/dashboard-display.ts b/...es/dev-console/integration-tests/support/step-definitions/monitoring/dashboard-display.ts
@@ -272,7 +272,7 @@ When('user clicks on Inspect on {string} chart', (chartTitle: string) => {
 });
 
 Then('user will see Metrics tab in Observe page', () => {
-  cy.get('.co-m-horizontal-nav-item--active').find(monitoringPO.tabs.metrics).should('be.visible');
+  cy.get('.pf-v6-c-tabs__item.pf-m-current').find(monitoringPO.tabs.metrics).should('be.visible');
 });
 
 Then('{string} option selected by default', (metric) => {

diff --git a/...console/integration-tests/support/step-definitions/monitoring/topology-sidebar-actions.ts b/...console/integration-tests/support/step-definitions/monitoring/topology-sidebar-actions.ts
@@ -46,7 +46,7 @@ When('user clicks on Memory usage chart', () => {
 
 Then('page redirected to the Observe Metrics page for the chart', () => {
   detailsPage.titleShouldContain('Observe');
-  cy.get('.co-m-horizontal-nav-item--active').find(monitoringPO.tabs.metrics).should('be.visible');
+  cy.get('.pf-v6-c-tabs__item.pf-m-current').find(monitoringPO.tabs.metrics).should('be.visible');
 });
 
 When('user selects {string} from Context Menu', (menuOption: string) => {
@@ -84,9 +84,7 @@ Then('page redirected to the Observe page', () => {
 
 Then('page redirected to the Dashboard tab of Observe page', () => {
   detailsPage.titleShouldContain('Observe');
-  cy.get('.co-m-horizontal-nav-item--active')
-    .find(monitoringPO.tabs.dashboard)
-    .should('be.visible');
+  cy.get('.pf-v6-c-tabs__item.pf-m-current').find(monitoringPO.tabs.dashboard).should('be.visible');
 });
 
 Then('user will see the {string} selected in the Dashboard dropdown', (dashboardName: string) => {

diff --git a/frontend/packages/helm-plugin/integration-tests/support/pages/helm/helm-details-page.ts b/frontend/packages/helm-plugin/integration-tests/support/pages/helm/helm-details-page.ts
@@ -46,8 +46,8 @@ export const helmDetailsPage = {
   selectedHelmTab: (name: string) => {
     cy.byLegacyTestID(`horizontal-link-${name}`)
       .should('exist')
-      .parent('li')
-      .should('have.class', 'co-m-horizontal-nav-item--active');
+      .parent('.pf-v6-c-tabs__item')
+      .should('have.class', 'pf-m-current');
   },
   verifyHelmActionsDropdown: () => cy.byLegacyTestID('dropdown-button').should('be.visible'),
   clickHelmActionButton: () => cy.byLegacyTestID('dropdown-button').click(),

diff --git a/frontend/packages/integration-tests-cypress/views/details-page.ts b/frontend/packages/integration-tests-cypress/views/details-page.ts
@@ -22,5 +22,5 @@ export namespace DetailsPageSelector {
   export const namespace = 'dd[data-test-selector="details-item-value__Namespace"] a';
   export const sectionHeadings = '[data-test-section-heading]';
   export const itemLabels = 'dt';
-  export const horizontalNavTabs = '.co-m-horizontal-nav__menu-item';
+  export const horizontalNavTabs = '.pf-v6-c-tabs__item';
 }
diff --git a/frontend/packages/knative-plugin/integration-tests/support/pageObjects/global-po.ts b/frontend/packages/knative-plugin/integration-tests/support/pageObjects/global-po.ts
@@ -108,7 +108,7 @@ export const eventingPO = {
     editAnnotations: '[data-test="edit-annotations"]',
     keyAnnotations: '[placeholder="Key"]',
     valueAnnotations: '[placeholder="Value"]',
-    sidebarTab: '.co-m-horizontal-nav__menu-item',
+    sidebarTab: '.pf-v6-c-tabs__item',
     sidebarClose: '[data-test-id="sidebar-close-button"]',
     applicationItem: '[data-test=dropdown-menu-item-link]',
     subscriberInput: '[id="form-ns-dropdown-spec-subscriber-ref-name-field"]',
@@ -151,7 +151,7 @@ export const eventingPO = {
       labels: '[data-test="Labels"]',
       annotations: '[data-test="Annotations"]',
       heading: '.sidebar__section-heading',
-      navBar: '.co-m-horizontal-nav__menu-item',
+      navBar: '.pf-v6-c-tabs__item',
       dropdownMenu: '.pf-v6-c-dropdown__menu-item',
       resource: '.co-resource-item__resource-name',
       close: '[data-test-id="sidebar-close-button"]',

diff --git a/...end/packages/pipelines-plugin/integration-tests/support/pages/pipelines/pipelines-page.ts b/...end/packages/pipelines-plugin/integration-tests/support/pages/pipelines/pipelines-page.ts
@@ -51,7 +51,7 @@ export const pipelinesPage = {
   },
 
   verifySelectedTab: (tabName: pipelineTabs) => {
-    cy.get('.co-m-horizontal-nav__menu-item.co-m-horizontal-nav-item--active > a').should(
+    cy.get('.pf-v6-c-tabs__item.pf-m-current .pf-v6-c-tabs__item-text').should(
       'have.text',
       tabName,
     );

diff --git a/...elines-plugin/integration-tests/support/step-definitions/pipelines/pipeline-navigation.ts b/...elines-plugin/integration-tests/support/step-definitions/pipelines/pipeline-navigation.ts
@@ -19,7 +19,7 @@ When('user enters git access token as {string}', (token: string) => {
 });
 
 Then('user will be redirected to the repositories page', () => {
-  cy.get('.co-m-horizontal-nav__menu-item.co-m-horizontal-nav-item--active > a').should(
+  cy.get('.pf-v6-c-tabs__item.pf-m-current .pf-v6-c-tabs__item-text').should(
     'have.text',
     'Repositories',
   );
@@ -54,7 +54,7 @@ Then('user clicks on close button', () => {
 });
 
 Then('user will be redirected to PipelineRuns tab', () => {
-  cy.get('.co-m-horizontal-nav__menu-item.co-m-horizontal-nav-item--active > a').should(
+  cy.get('.pf-v6-c-tabs__item.pf-m-current .pf-v6-c-tabs__item-text').should(
     'have.text',
     'PipelineRuns',
   );

diff --git a/frontend/packages/topology/integration-tests/support/page-objects/topology-po.ts b/frontend/packages/topology/integration-tests/support/page-objects/topology-po.ts
@@ -93,7 +93,7 @@ export const topologyPO = {
     podText: 'text.pod-ring__center-text',
     applicationGroupingsTitle: '.overview__sidebar-pane-head.resource-overview__heading',
     applicationGroupingsSidepane: 'overview__sidebar-pane resource-overview',
-    resourcesTabApplicationGroupings: '.co-m-horizontal-nav__menu-item',
+    resourcesTabApplicationGroupings: '.pf-v6-c-tabs__item',
     pipelineRunsDetails: '.sidebar__section-heading',
     pipelineRunsLogSnippet: '.ocs-log-snippet__log-snippet',
     pipelineRunsStatus: '.ocs-log-snippet__status-message',

diff --git a/...end/packages/topology/integration-tests/support/pages/topology/topology-side-pane-page.ts b/...end/packages/topology/integration-tests/support/pages/topology/topology-side-pane-page.ts
@@ -10,8 +10,8 @@ export const topologySidePane = {
     cy
       .get(topologyPO.sidePane.tabName)
       .contains(tabName)
-      .parent('li')
-      .should('have.class', 'co-m-horizontal-nav-item--active'),
+      .parent('.pf-v6-c-tabs__item')
+      .should('have.class', 'pf-m-current'),
   verifyTab: (tabName: string) =>
     cy.get(topologyPO.sidePane.tabName).contains(tabName).should('be.visible'),
   verifyTabNotVisible: (tabName: string) =>

diff --git a/frontend/public/components/_horizontal-nav.scss b/frontend/public/components/_horizontal-nav.scss
diff --git a/frontend/public/components/utils/horizontal-nav.tsx b/frontend/public/components/utils/horizontal-nav.tsx
@@ -376,7 +376,7 @@ export const HorizontalNav = React.memo((props: HorizontalNavProps) => {
 
   return (
     <div className={classNames('co-m-page__body', props.className)}>
-      <div className="co-m-horizontal-nav">{!props.hideNav && <NavBar pages={pages} />}</div>
+      {!props.hideNav && <NavBar pages={pages} />}
       {renderContent(routes)}
     </div>
   );

diff --git a/frontend/public/style.scss b/frontend/public/style.scss
@@ -75,7 +75,6 @@
 @import 'components/sysevent-stream';
 @import 'components/icon-and-text';
 @import 'components/toggle-play';
-@import 'components/horizontal-nav';
 @import 'components/edit-yaml';
 @import 'components/sidebars/resource-sidebar';
 @import 'components/graphs/graphs';