OCPBUGS-78543: Hide filter category selector when only one filter exists by rhamilto · Pull Request #16153 · openshift/console

rhamilto · 2026-03-16T18:00:31Z

Summary

Hides the filter category dropdown selector when only one filter type is available in ConsoleDataView, improving UX by removing an unnecessary UI element.

After

Screen.Recording.2026-03-16.at.7.34.20.PM.mov

What this PR does

When ConsoleDataView has only a single filter type (e.g., just a text filter or just a select filter), the category selector dropdown becomes redundant. This PR adds CSS to hide it automatically.

Implementation

New file: ConsoleDataView.scss

Defines .co-console-data-view-single-filter class following Console's co- prefix naming convention
Targets the first child of .pf-v6-c-toolbar__group.pf-m-filter-group (the category selector)
Uses !important to ensure visibility override works across all responsive breakpoints

Updates to ConsoleDataView.tsx

Import the new stylesheet
Import css utility from @patternfly/react-styles
Apply class to DataView component when dataViewFilterNodes.length === 1

Cypress test coverage

New test: "ConsoleDataView filter toolbar should not display a filter select"
Tests both text filter scenario (1 toggle) and select filter scenario (2 toggles)
Reusable helper function verifySingleFilterCategoryHidden for DRY tests
Verifies category selector is not visible in both cases

Test Plan

Build succeeds
Cypress tests added and pass
Manual test: Visit /settings/cluster/alertmanagerconfig (text filter only) - verify category dropdown is hidden
Manual test: Visit /search/all-namespaces?kind=core~v1~Pod (select filter only) - verify category dropdown is hidden
Manual test: Test at mobile/tablet breakpoints to ensure CSS works responsively

Screenshots

Screenshots showing before/after behavior would be helpful for review

🤖 Generated with Claude Code

openshift-ci-robot · 2026-03-16T18:00:39Z

@rhamilto: This pull request references Jira Issue OCPBUGS-78543, which is invalid:

expected the bug to target the "4.22.0" version, but no target version was set

Comment /jira refresh to re-evaluate validity if changes to the Jira bug are made, or edit the title of this pull request to link to a different bug.

The bug has been updated to refer to the pull request using the external bug tracker.

Details

In response to this:

Summary

Adds CSS rule to hide the filter category selector dropdown when only one filter is available in ConsoleDataView

Creates custom DataViewTextFilter component to enable keyboard shortcuts and improve UX

Updates Cypress tests to verify the category selector is hidden on Search and AlertManager config pages

Fixes test helper to use correct aria-label for name filter

Context

PatternFly's DataViewFilters component always displays a category selector dropdown even when only one filter is available, creating unnecessary UI clutter on pages like Search and AlertManager config. This PR uses a CSS-only approach to hide the selector when there's only one filter, avoiding the need to fork or patch the upstream component.

Test plan

Verify category selector is hidden on /search/all-namespaces?kind=core~v1~Pod

Verify category selector is hidden on /settings/cluster/alertmanagerconfig

Verify category selector still appears when multiple filters are available

Run Cypress tests: yarn cypress run --spec tests/app/filtering-and-searching.cy.ts

Test keyboard shortcuts (Ctrl+F / Cmd+F) work with the new DataViewTextFilter

🤖 Generated with Claude Code

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

rhamilto · 2026-03-16T18:20:43Z

/jira refresh

openshift-ci-robot · 2026-03-16T18:20:51Z

@rhamilto: This pull request references Jira Issue OCPBUGS-78543, which is valid. The bug has been moved to the POST state.

3 validation(s) were run on this bug

bug is open, matching expected state (open)
bug target version (4.22.0) matches configured target version for branch (4.22.0)
bug is in the state ASSIGNED, which is one of the valid states (NEW, ASSIGNED, POST)

Details

In response to this:

/jira refresh

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

rhamilto · 2026-03-16T19:25:34Z

/cherry-pick release-4.21

openshift-cherrypick-robot · 2026-03-16T19:25:38Z

@rhamilto: once the present PR merges, I will cherry-pick it on top of release-4.21 in a new PR and assign it to you.

Details

In response to this:

/cherry-pick release-4.21

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository.

openshift-ci-robot · 2026-03-16T23:28:45Z

@rhamilto: This pull request references Jira Issue OCPBUGS-78543, which is valid.

3 validation(s) were run on this bug

bug is open, matching expected state (open)
bug target version (4.22.0) matches configured target version for branch (4.22.0)
bug is in the state POST, which is one of the valid states (NEW, ASSIGNED, POST)

Details

In response to this:

Summary

Fixes CSS class naming convention violations and improves test coverage for the single filter category selector hiding feature.

Changes

CSS naming: Renamed console-data-view--single-filter to co-console-data-view-single-filter following Console's co- prefix convention for custom styles

Class placement: Moved class application from DataViewFilters to parent DataView component for proper scoping

Responsive fix: Added !important to CSS rule to ensure the category selector is hidden at all screen resolutions (mobile and desktop)

Test improvements:

Created reusable verifySingleFilterCategoryHidden helper function

Added visibility checks for both single toggle (text filter) and multiple toggle (select filter) scenarios

Tests now verify category selector is hidden in both cases

Before
.console-data-view--single-filter .pf-v6-c-toolbar__group.pf-m-filter-group > *:first-child {
 display: none;
}
After
.co-console-data-view-single-filter .pf-v6-c-toolbar__group.pf-m-filter-group > *:first-child {
 display: none !important;
}
Test Plan

Build succeeds

Cypress tests pass

Verified class follows BEM and Console naming conventions

Manual testing at mobile resolutions to verify category selector is hidden

Manual testing on /settings/cluster/alertmanagerconfig (text filter)

Manual testing on /search/all-namespaces?kind=core~v1~Pod (select filter)

🤖 Generated with Claude Code

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

rhamilto · 2026-03-17T12:13:16Z

/retest

rhamilto · 2026-03-17T21:07:53Z

/retest

rhamilto · 2026-03-18T07:46:00Z

/retest

Adds CSS to hide the filter category dropdown selector when there's only one filter type available in ConsoleDataView, improving UX by removing unnecessary UI elements. Changes: - Create ConsoleDataView.scss with `.co-console-data-view-single-filter` class - Apply class to DataView component when single filter is present - Import CSS utilities and stylesheet in ConsoleDataView.tsx - Add Cypress test to verify category selector is hidden for both text and select filter types - Add reusable test helper `verifySingleFilterCategoryHidden` The CSS uses `!important` to ensure the rule works across all breakpoints and targets the first child of the filter group (the category selector). Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

rhamilto · 2026-03-18T18:48:03Z

/assign @yapei

rhamilto · 2026-03-18T20:41:28Z

/retest

yanpzhan · 2026-03-19T06:05:24Z

Checked on cluster launched against the pr, on /settings/cluster/alertmanagerconfig page, the filter input was by default 'Filter by name' without dropdown list; on pods page, checked filter by 'Status', there was dropdown list for selecting different statuses. And there was not dropdown list when filter by 'Name/Label'.
/verified by yanpzhan

openshift-ci-robot · 2026-03-19T06:05:36Z

@yanpzhan: This PR has been marked as verified by yanpzhan.

Details

In response to this:

Checked on cluster launched against the pr, on /settings/cluster/alertmanagerconfig page, the filter input was by default 'Filter by name' without dropdown list; on pods page, checked filter by 'Status', there was dropdown list for selecting different statuses. And there was not dropdown list when filter by 'Name/Label'.
/verified by yanpzhan

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

rhamilto · 2026-03-19T08:17:48Z

/retest

rhamilto · 2026-03-25T12:21:01Z

/retest

rhamilto · 2026-03-25T17:49:10Z

/retest

sg00dwin

/lgtm
/verified by @sg00dwin

openshift-ci · 2026-03-25T19:42:32Z

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: rhamilto, sg00dwin

The full list of commands accepted by this bot can be found here.

The pull request process is described here

Details

Needs approval from an approver in each of these files:

~~frontend/OWNERS~~ [rhamilto]

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

openshift-ci · 2026-03-26T07:54:40Z

@rhamilto: all tests passed!

Full PR test history. Your PR dashboard.

Details

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository. I understand the commands that are listed here.

openshift-ci-robot · 2026-03-26T07:58:35Z

@rhamilto: Jira Issue OCPBUGS-78543: Some pull requests linked via external trackers have merged:

The following pull request, linked via external tracker, has not merged:

openshift/console#15564 is closed

All associated pull requests must be merged or unlinked from the Jira bug in order for it to move to the next state. Once unlinked, request a bug refresh with /jira refresh.

Jira Issue OCPBUGS-78543 has not been moved to the MODIFIED state.

This PR is marked as verified. If the remaining PRs listed above are marked as verified before merging, the issue will automatically be moved to VERIFIED after all of the changes from the PRs are available in an accepted nightly payload.

Details

In response to this:

Summary

Hides the filter category dropdown selector when only one filter type is available in ConsoleDataView, improving UX by removing an unnecessary UI element.

After

Screen.Recording.2026-03-16.at.7.34.20.PM.mov

What this PR does

When ConsoleDataView has only a single filter type (e.g., just a text filter or just a select filter), the category selector dropdown becomes redundant. This PR adds CSS to hide it automatically.

Implementation

New file: ConsoleDataView.scss

Defines .co-console-data-view-single-filter class following Console's co- prefix naming convention

Targets the first child of .pf-v6-c-toolbar__group.pf-m-filter-group (the category selector)

Uses !important to ensure visibility override works across all responsive breakpoints

Updates to ConsoleDataView.tsx

Import the new stylesheet

Import css utility from @patternfly/react-styles

Apply class to DataView component when dataViewFilterNodes.length === 1

Cypress test coverage

New test: "ConsoleDataView filter toolbar should not display a filter select"

Tests both text filter scenario (1 toggle) and select filter scenario (2 toggles)

Reusable helper function verifySingleFilterCategoryHidden for DRY tests

Verifies category selector is not visible in both cases

Test Plan

Build succeeds

Cypress tests added and pass

Manual test: Visit /settings/cluster/alertmanagerconfig (text filter only) - verify category dropdown is hidden

Manual test: Visit /search/all-namespaces?kind=core~v1~Pod (select filter only) - verify category dropdown is hidden

Manual test: Test at mobile/tablet breakpoints to ensure CSS works responsively

Screenshots

Screenshots showing before/after behavior would be helpful for review

🤖 Generated with Claude Code

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

openshift-cherrypick-robot · 2026-03-26T07:59:44Z

@rhamilto: #16153 failed to apply on top of branch "release-4.21":

Applying: OCPBUGS-63391: enable keyboard shortcut for DataViewTextFilter
Using index info to reconstruct a base tree...
M	frontend/packages/console-app/src/components/data-view/ConsoleDataView.tsx
M	frontend/packages/console-app/src/components/data-view/DataViewLabelFilter.tsx
M	frontend/packages/integration-tests-cypress/views/list-page.ts
M	frontend/public/components/filter-toolbar.tsx
Falling back to patching base and 3-way merge...
Auto-merging frontend/public/components/filter-toolbar.tsx
Auto-merging frontend/packages/integration-tests-cypress/views/list-page.ts
Auto-merging frontend/packages/console-app/src/components/data-view/DataViewLabelFilter.tsx
Auto-merging frontend/packages/console-app/src/components/data-view/ConsoleDataView.tsx
CONFLICT (content): Merge conflict in frontend/packages/console-app/src/components/data-view/ConsoleDataView.tsx
error: Failed to merge in the changes.
hint: Use 'git am --show-current-patch=diff' to see the failed patch
hint: When you have resolved this problem, run "git am --continue".
hint: If you prefer to skip this patch, run "git am --skip" instead.
hint: To restore the original branch and stop patching, run "git am --abort".
hint: Disable this message with "git config set advice.mergeConflict false"
Patch failed at 0001 OCPBUGS-63391: enable keyboard shortcut for DataViewTextFilter

Details

In response to this:

/cherry-pick release-4.21

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository.

rhamilto · 2026-03-26T12:09:19Z

/jira refresh

openshift-ci-robot · 2026-03-26T12:09:26Z

@rhamilto: Jira Issue OCPBUGS-78543: Some pull requests linked via external trackers have merged:

The following pull request, linked via external tracker, has not merged:

openshift/console#15564 is closed

All associated pull requests must be merged or unlinked from the Jira bug in order for it to move to the next state. Once unlinked, request a bug refresh with /jira refresh.

Jira Issue OCPBUGS-78543 has not been moved to the MODIFIED state.

This PR is marked as verified. If the remaining PRs listed above are marked as verified before merging, the issue will automatically be moved to VERIFIED after all of the changes from the PRs are available in an accepted nightly payload.

Details

In response to this:

/jira refresh

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

rhamilto · 2026-03-26T12:15:25Z

/jira refresh

openshift-ci-robot · 2026-03-26T12:15:30Z

@rhamilto: Jira Issue Verification Checks: Jira Issue OCPBUGS-78543
✔️ This pull request was pre-merge verified.
✔️ All associated pull requests have merged.
✔️ All associated, merged pull requests were pre-merge verified.

Jira Issue OCPBUGS-78543 has been moved to the MODIFIED state and will move to the VERIFIED state when the change is available in an accepted nightly payload. 🕓

Details

In response to this:

/jira refresh

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

openshift-ci-robot added jira/valid-reference Indicates that this PR references a valid Jira ticket of any type. jira/invalid-bug Indicates that a referenced Jira bug is invalid for the branch this PR is targeting. labels Mar 16, 2026

rhamilto changed the title ~~OCPBUGS-78543: Hide filter category selector when only one filter exists~~ [WIP] OCPBUGS-78543: Hide filter category selector when only one filter exists Mar 16, 2026

openshift-ci bot added the do-not-merge/work-in-progress Indicates that a PR should not merge because it is a work in progress. label Mar 16, 2026

openshift-ci bot requested review from TheRealJon and sg00dwin March 16, 2026 18:01

openshift-ci bot added component/core Related to console core functionality kind/cypress Related to Cypress e2e integration testing approved Indicates a PR has been approved by an approver from all required OWNERS files. labels Mar 16, 2026

rhamilto force-pushed the OCPBUGS-78543 branch 3 times, most recently from 81b9ca8 to a5a4f6d Compare March 16, 2026 18:18

openshift-ci-robot added jira/valid-bug Indicates that a referenced Jira bug is valid for the branch this PR is targeting. and removed jira/invalid-bug Indicates that a referenced Jira bug is invalid for the branch this PR is targeting. labels Mar 16, 2026

openshift-ci bot added the component/helm Related to helm-plugin label Mar 16, 2026

rhamilto force-pushed the OCPBUGS-78543 branch from a5a4f6d to 7b8416e Compare March 16, 2026 23:28

rhamilto force-pushed the OCPBUGS-78543 branch from 7b8416e to 4dbd54c Compare March 16, 2026 23:30

OCPBUGS-63391: enable keyboard shortcut for DataViewTextFilter

7049a5d

rhamilto force-pushed the OCPBUGS-78543 branch from 4dbd54c to ab27a5b Compare March 17, 2026 15:58

rhamilto force-pushed the OCPBUGS-78543 branch from ab27a5b to b7167f2 Compare March 18, 2026 15:15

openshift-ci bot assigned yapei Mar 18, 2026

openshift-ci-robot added the verified Signifies that the PR passed pre-merge verification criteria label Mar 19, 2026

rhamilto changed the title ~~[WIP] OCPBUGS-78543: Hide filter category selector when only one filter exists~~ OCPBUGS-78543: Hide filter category selector when only one filter exists Mar 25, 2026

openshift-ci bot removed the do-not-merge/work-in-progress Indicates that a PR should not merge because it is a work in progress. label Mar 25, 2026

sg00dwin approved these changes Mar 25, 2026

View reviewed changes

openshift-ci bot assigned sg00dwin Mar 25, 2026

openshift-ci bot added the lgtm Indicates that a PR is ready to be merged. label Mar 25, 2026

openshift-merge-bot bot merged commit 2423c06 into openshift:main Mar 26, 2026
8 checks passed

rhamilto deleted the OCPBUGS-78543 branch March 26, 2026 11:59

Conversation

rhamilto commented Mar 16, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

After

What this PR does

Implementation

Test Plan

Screenshots

Uh oh!

openshift-ci-robot commented Mar 16, 2026

Summary

Context

Test plan

Uh oh!

rhamilto commented Mar 16, 2026

Uh oh!

openshift-ci-robot commented Mar 16, 2026

Uh oh!

rhamilto commented Mar 16, 2026

Uh oh!

openshift-cherrypick-robot commented Mar 16, 2026

Uh oh!

openshift-ci-robot commented Mar 16, 2026

Summary

Changes

Before

After

Test Plan

Uh oh!

rhamilto commented Mar 17, 2026

Uh oh!

rhamilto commented Mar 17, 2026

Uh oh!

rhamilto commented Mar 18, 2026

Uh oh!

rhamilto commented Mar 18, 2026

Uh oh!

rhamilto commented Mar 18, 2026

Uh oh!

yanpzhan commented Mar 19, 2026

Uh oh!

openshift-ci-robot commented Mar 19, 2026

Uh oh!

rhamilto commented Mar 19, 2026

Uh oh!

rhamilto commented Mar 25, 2026

Uh oh!

rhamilto commented Mar 25, 2026

Uh oh!

sg00dwin left a comment

Choose a reason for hiding this comment

Uh oh!

openshift-ci bot commented Mar 25, 2026

Uh oh!

openshift-ci bot commented Mar 26, 2026

Uh oh!

Uh oh!

openshift-ci-robot commented Mar 26, 2026

Summary

After

What this PR does

Implementation

Test Plan

Screenshots

Uh oh!

openshift-cherrypick-robot commented Mar 26, 2026

Uh oh!

rhamilto commented Mar 26, 2026

Uh oh!

openshift-ci-robot commented Mar 26, 2026

Uh oh!

rhamilto commented Mar 26, 2026

Uh oh!

openshift-ci-robot commented Mar 26, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

rhamilto commented Mar 16, 2026 •

edited

Loading