Skip to content

[WIP] CONSOLE-4447: Remove deprecated modal components and CSS#16126

Open
rhamilto wants to merge 5 commits intoopenshift:mainfrom
rhamilto:CONSOLE-4447-legacy-removal
Open

[WIP] CONSOLE-4447: Remove deprecated modal components and CSS#16126
rhamilto wants to merge 5 commits intoopenshift:mainfrom
rhamilto:CONSOLE-4447-legacy-removal

Conversation

@rhamilto
Copy link
Member

@rhamilto rhamilto commented Mar 10, 2026

Summary

This PR completes the migration to PatternFly v6 modals by removing deprecated modal components and cleaning up legacy CSS:

  • Removed deprecated modal components (ModalTitle, ModalSubmitFooter, ModalWrapper) from @console/internal/components/factory/modal
  • Moved ModalComponentProps type to @console/shared/src/types/modal and updated 32 imports
  • Completely removed public/components/modals/_modals.scss and all orphaned CSS classes
  • Removed react-modal dependency
  • Documented breaking changes in SDK changelog for plugin developers

Note: this PR should merge last for this story.

Breaking Changes

For dynamic plugin developers:

  • CSS classes removed: .co-overlay, .modal-footer, .modal-paragraph, .modal-header, .modal-body, .modal-body-border, .modal-body-content, .modal-content, .modal-dialog, .co-modal-table, .modal__inline-resource-link
  • Plugins referencing these classes should migrate to PatternFly v6 modal selectors (e.g., .pf-v6-c-modal-box__body) or data-test attributes

Test Plan

  • Build succeeds with no errors
  • All modal migrations verified in dependent PRs
  • SDK changelog updated with breaking changes

Related PRs

Part of the CONSOLE-4447 modal migration series:

🤖 Generated with Claude Code

@openshift-ci-robot openshift-ci-robot added the jira/valid-reference Indicates that this PR references a valid Jira ticket of any type. label Mar 10, 2026
@openshift-ci-robot
Copy link
Contributor

openshift-ci-robot commented Mar 10, 2026

@rhamilto: This pull request references CONSOLE-4447 which is a valid jira issue.

Warning: The referenced jira issue has an invalid target version for the target branch this PR targets: expected the story to target the "4.22.0" version, but no target version was set.

Details

In response to this:

Summary

This PR completes the migration to PatternFly v6 modals by removing deprecated modal components and cleaning up legacy CSS:

  • Removed deprecated modal components (ModalTitle, ModalSubmitFooter, ModalWrapper) from @console/internal/components/factory/modal
  • Moved ModalComponentProps type to @console/shared/src/types/modal and updated 32 imports
  • Completely removed public/components/modals/_modals.scss and all orphaned CSS classes
  • Removed react-modal dependency
  • Documented breaking changes in SDK changelog for plugin developers
  • Added comprehensive documentation for integration test updates needed in follow-up PRs

Breaking Changes

For dynamic plugin developers:

  • CSS classes removed: .co-overlay, .modal-footer, .modal-paragraph, .modal-header, .modal-body, .modal-body-border, .modal-body-content, .modal-content, .modal-dialog, .co-modal-table, .modal__inline-resource-link
  • Plugins referencing these classes should migrate to PatternFly v6 modal selectors (e.g., .pf-v6-c-modal-box__body) or data-test attributes
  • See CHANGELOG-core.md for full details

Documentation

  • MODAL_CSS_USAGE_REPORT.md - Documents removed CSS classes and their previous usage
  • MODAL_CSS_INTEGRATION_TEST_UPDATES.md - Lists integration test updates needed in follow-up PRs, organized by package

Test Plan

Related PRs

Part of the CONSOLE-4447 modal migration series:

🤖 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-ci 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 10, 2026
@openshift-ci-robot
Copy link
Contributor

openshift-ci-robot commented Mar 10, 2026

@rhamilto: This pull request references CONSOLE-4447 which is a valid jira issue.

Warning: The referenced jira issue has an invalid target version for the target branch this PR targets: expected the story to target the "4.22.0" version, but no target version was set.

Details

In response to this:

Summary

This PR completes the migration to PatternFly v6 modals by removing deprecated modal components and cleaning up legacy CSS:

  • Removed deprecated modal components (ModalTitle, ModalSubmitFooter, ModalWrapper) from @console/internal/components/factory/modal
  • Moved ModalComponentProps type to @console/shared/src/types/modal and updated 32 imports
  • Completely removed public/components/modals/_modals.scss and all orphaned CSS classes
  • Removed react-modal dependency
  • Documented breaking changes in SDK changelog for plugin developers
  • Added comprehensive documentation for integration test updates needed in follow-up PRs

Breaking Changes

For dynamic plugin developers:

  • CSS classes removed: .co-overlay, .modal-footer, .modal-paragraph, .modal-header, .modal-body, .modal-body-border, .modal-body-content, .modal-content, .modal-dialog, .co-modal-table, .modal__inline-resource-link
  • Plugins referencing these classes should migrate to PatternFly v6 modal selectors (e.g., .pf-v6-c-modal-box__body) or data-test attributes
  • See CHANGELOG-core.md for full details

Documentation

  • MODAL_CSS_USAGE_REPORT.md - Documents removed CSS classes and their previous usage
  • MODAL_CSS_INTEGRATION_TEST_UPDATES.md - Lists integration test updates needed in follow-up PRs, organized by package

Test Plan

Related PRs

Part of the CONSOLE-4447 modal migration series:

🤖 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-ci openshift-ci bot requested review from Leo6Leo and jhadvig March 10, 2026 17:45
@openshift-ci
Copy link
Contributor

openshift-ci bot commented Mar 10, 2026

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: rhamilto

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:

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

@openshift-ci openshift-ci bot added approved Indicates a PR has been approved by an approver from all required OWNERS files. component/core Related to console core functionality component/dashboard Related to dashboard component/dev-console Related to dev-console component/helm Related to helm-plugin component/knative Related to knative-plugin component/metal3 Related to metal3-plugin component/olm Related to OLM component/sdk Related to console-plugin-sdk labels Mar 10, 2026
@openshift-merge-robot openshift-merge-robot added the needs-rebase Indicates a PR cannot be merged because it has merge conflicts with HEAD. label Mar 10, 2026
@openshift-ci openshift-ci bot added component/shared Related to console-shared component/topology Related to topology kind/i18n Indicates issue or PR relates to internationalization or has content that needs to be translated plugin-api-changed Categorizes a PR as containing plugin API changes labels Mar 10, 2026
@rhamilto rhamilto force-pushed the CONSOLE-4447-legacy-removal branch 2 times, most recently from 245f6d2 to e145baf Compare March 10, 2026 18:31
@openshift-merge-robot openshift-merge-robot removed the needs-rebase Indicates a PR cannot be merged because it has merge conflicts with HEAD. label Mar 10, 2026
@rhamilto rhamilto force-pushed the CONSOLE-4447-legacy-removal branch from e145baf to 29c4fdf Compare March 10, 2026 18:48
@rhamilto
Copy link
Member Author

/retest

@rhamilto rhamilto force-pushed the CONSOLE-4447-legacy-removal branch 3 times, most recently from aa75aed to 6c64d2b Compare March 15, 2026 14:20
@rhamilto
Copy link
Member Author

/test e2e-gcp-console

@rhamilto rhamilto force-pushed the CONSOLE-4447-legacy-removal branch 5 times, most recently from eca80a1 to 41c945f Compare March 15, 2026 14:58
@openshift-merge-robot openshift-merge-robot added the needs-rebase Indicates a PR cannot be merged because it has merge conflicts with HEAD. label Mar 15, 2026
@rhamilto rhamilto force-pushed the CONSOLE-4447-legacy-removal branch from 41c945f to eabc43f Compare March 15, 2026 23:16
@openshift-merge-robot openshift-merge-robot removed the needs-rebase Indicates a PR cannot be merged because it has merge conflicts with HEAD. label Mar 15, 2026
@yapei
Copy link
Contributor

yapei commented Mar 16, 2026

performed some regression testing about several impacted modals, no regression/breaking changes found

/verified by @yapei

@openshift-ci-robot openshift-ci-robot added the verified Signifies that the PR passed pre-merge verification criteria label Mar 16, 2026
@openshift-ci-robot
Copy link
Contributor

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

Details

In response to this:

performed some regression testing about several impacted modals, no regression/breaking changes found

/verified by @yapei

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.

@yapei
Copy link
Contributor

yapei commented Mar 16, 2026

Not sure why it is failing, the cypress selector looks good
Screenshot 2026-03-16 at 2 08 27 PM

Delete Helm Release through Context Menu: HR-01-TC03: Helm Release Delete Helm Release through Context Menu: HR-01-TC03 expand_less 	55s
{Timed out retrying after 40000ms: Expected to find element: `[data-test-id="modal-title"]`, but never found it. AssertionError AssertionError: Timed out retrying after 40000ms: Expected to find element: `[data-test-id="modal-title"]`, but never found it.
    at Context.eval (webpack://@helm-plugin/integration-tests/./support/pages/helm/helm-details-page.ts:27:39)}

@yapei
Copy link
Contributor

yapei commented Mar 16, 2026

/retest-required

@rhamilto rhamilto force-pushed the CONSOLE-4447-legacy-removal branch from eabc43f to 5f44c59 Compare March 16, 2026 14:08
@openshift-ci-robot openshift-ci-robot removed the verified Signifies that the PR passed pre-merge verification criteria label Mar 16, 2026
rhamilto and others added 2 commits March 16, 2026 10:09
Migrates DeleteHPAModal, ConsolePluginModal, and DeleteResourceModal
from deprecated factory modal components to modern PatternFly v6 Modal.

Changes:
- Replace ModalWrapper with Modal component with state management
- Replace ModalTitle with ModalHeader
- Replace ModalSubmitFooter with ModalFooterWithAlerts
- Replace HTML form with PatternFly Form component
- Use modern Button components with consistent loading/disabled states
- Maintain Formik integration in DeleteResourceModal

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
…ndency

Remove all deprecated modal components (ModalWrapper, ModalTitle, ModalBody,
ModalFooter, ModalSubmitFooter) from the modal factory as they have been fully
migrated to PatternFly v6 Modal components.

Changes:
- Remove deprecated modal component implementations from modal.tsx
- Keep only ModalComponentProps type for backward compatibility
- Remove react-modal package dependency from package.json
- Remove react-modal initialization code from app.tsx

All modals have been migrated to use PatternFly v6 Modal components with the
useOverlay hook pattern.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@openshift-merge-robot openshift-merge-robot added the needs-rebase Indicates a PR cannot be merged because it has merge conflicts with HEAD. label Mar 16, 2026
rhamilto and others added 3 commits March 16, 2026 10:10
…factory/modal.tsx

Relocates the ModalComponentProps type definition to a proper shared location and removes the deprecated factory/modal.tsx file entirely. This completes the removal of all deprecated modal components.

Changes:
- Create new file packages/console-shared/src/types/modal.ts with ModalComponentProps type
- Update all imports across the codebase to use @console/shared/src/types/modal
- Remove public/components/factory/modal.tsx
- Remove modal export from public/components/factory/index.tsx

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Remove CSS classes that were orphaned after migrating modals to PatternFly v6.

This commit:
- Deletes _modals.scss and _modal-wrapper.scss files
- Removes className="co-modal-table" from Table components in modals
- Updates style imports and references

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@rhamilto rhamilto force-pushed the CONSOLE-4447-legacy-removal branch from 5f44c59 to c4c4f60 Compare March 16, 2026 14:10
@openshift-merge-robot openshift-merge-robot removed the needs-rebase Indicates a PR cannot be merged because it has merge conflicts with HEAD. label Mar 16, 2026
@openshift-ci
Copy link
Contributor

openshift-ci bot commented Mar 16, 2026

@rhamilto: The following tests 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/e2e-gcp-console 5f44c59 link true /test e2e-gcp-console
ci/prow/images 5f44c59 link true /test images
ci/prow/analyze 5f44c59 link true /test analyze
ci/prow/backend 5f44c59 link true /test backend
ci/prow/frontend 5f44c59 link true /test frontend

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.

@rhamilto
Copy link
Member Author

Not sure why it is failing, the cypress selector looks good

Should be fixed. Note this change is in #16079, but is also included here since this PR is dependent on it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

approved Indicates a PR has been approved by an approver from all required OWNERS files. component/core Related to console core functionality component/dashboard Related to dashboard component/dev-console Related to dev-console component/helm Related to helm-plugin component/knative Related to knative-plugin component/metal3 Related to metal3-plugin component/olm Related to OLM component/sdk Related to console-plugin-sdk component/shared Related to console-shared component/topology Related to topology do-not-merge/work-in-progress Indicates that a PR should not merge because it is a work in progress. jira/valid-reference Indicates that this PR references a valid Jira ticket of any type. kind/i18n Indicates issue or PR relates to internationalization or has content that needs to be translated plugin-api-changed Categorizes a PR as containing plugin API changes

Projects

None yet

Development

Successfully merging this pull request may close these issues.

8 participants