ROX-31362: Migrate AdvancedFlowsFilter to PF v5 Select

[sachaudh]

Description

Migrated AdvancedFlowsFilter from the deprecated PatternFly Select component.

Key Changes:

• Implemented inline port filtering instead of a nested Select

User-facing documentation

• CHANGELOG.md is updated OR update is not needed
• documentation PR is created and is linked above OR is not needed

Testing and quality

• the change is production ready: the change is GA, or otherwise the functionality is gated by a feature flag
• CI results are inspected

Automated testing

• added unit tests
• added e2e tests
• added regression tests
• added compatibility tests
• modified existing tests

How I validated my change

Before

before-changes.mov

After

after-changes.mov

[openshift-ci]

Skipping CI for Draft Pull Request.
If you want CI signal for your change, please convert it to an actual PR.
You can still manually trigger a test run with /test all

[rhacs-bot]

Images are ready for the commit at f50c97c.

To use with deploy scripts, first export MAIN_IMAGE_TAG=4.10.x-183-gf50c97c08e.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 48.72%. Comparing base (0039688) to head (f50c97c).
⚠️ Report is 1 commits behind head on master.

Additional details and impacted files

@@           Coverage Diff           @@
##           master   #17511   +/-   ##
=======================================
  Coverage   48.71%   48.72%           
=======================================
  Files        2724     2724           
  Lines      202980   202980           
=======================================
+ Hits        98891    98898    +7     
+ Misses      96335    96330    -5     
+ Partials     7754     7752    -2     

Flag	Coverage Δ
go-unit-tests	48.72% <ø> (+<0.01%)	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[dvail]

Minor suggestions but otherwise LGTM.

Overall I think the new port selection UI is probably better than the dropdown-within-a-dropdown pattern. How does it handle a large number of items though? Does the individual port section scroll?

Also, unrelated to this PR, but IMO we should sort the port numbers ascending in a follow up.

[sachaudh]

Overall I think the new port selection UI is probably better than the dropdown-within-a-dropdown pattern. How does it handle a large number of items though? Does the individual port section scroll?

I mocked it to see. This is how it's scrolling with a large number of ports

after-changes.mov

Also, unrelated to this PR, but IMO we should sort the port numbers ascending in a follow up.

I think that's reasonable to do in this PR too 👍🏼

[openshift-ci]

@sachaudh: The following test failed, say /retest to rerun all failed tests or /retest-required to rerun all mandatory failed tests:

Test name	Commit	Details	Required	Rerun command
ci/prow/ocp-4-12-nongroovy-e2e-tests	f50c97c	link	false	/test ocp-4-12-nongroovy-e2e-tests

Full PR test history. Your PR dashboard.

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.