CONSOLE-5049: Migrate modals from createModalLauncher to useOverlay by sg00dwin · Pull Request #15935 · openshift/console

sg00dwin · 2026-01-20T18:58:08Z

Remove createModalLauncher usage from DeleteHPAModal and ConsolePluginModal to eliminate React Router wrapper conflicts. Both modals now use the useOverlay pattern with OverlayComponent wrappers. This change is part of CONSOLE-5012 to unblock the React Router v7 upgrade.

Modals Migrated

DeleteHPAModal (packages/console-shared/src/components/hpa/DeleteHPAModal.tsx)
- Migrated to DeleteHPAModalOverlay: OverlayComponent
- Consumer updated: packages/console-app/src/actions/creators/hpa-factory.ts
ConsolePluginModal (packages/console-shared/src/components/modals/ConsolePluginModal.tsx)
- Migrated to ConsolePluginModalOverlay: OverlayComponent
- Backwards-compatible wrapper: consolePluginModal() function in index.ts
- Consumer updated: packages/console-app/src/components/console-operator/ConsoleOperatorConfig.tsx

Changes

Exported modal overlays as OverlayComponent using the *ModalOverlay naming convention
Wrapped modal components with ModalWrapper and connected to overlay lifecycle (closeOverlay)
Updated consumers to use useOverlay hook with launchModal() instead of direct modal calls
Added backwards-compatible consolePluginModal() wrapper for gradual migration

Scope Note

Consumer in clusterserviceversion.tsx intentionally excluded:

The ConsolePluginModal usage in packages/operator-lifecycle-manager/src/components/clusterserviceversion.tsx uses the backwards-compatible consolePluginModal() wrapper
OLM consumer updates are being handled separately in PR #15968 to avoid conflicts
The backwards-compatible wrapper internally calls the new ConsolePluginModalOverlay pattern, so the migration is still functional

Assisted by: Claude Code

openshift-ci-robot · 2026-01-20T22:31:45Z

@sg00dwin: This pull request references CONSOLE-5049 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 sub-task to target the "4.22.0" version, but no target version was set.

Details

In response to this:

Remove createModalLauncher usage from DeleteHPAModal and ConsolePluginModal to eliminate React Router wrapper conflicts. Both modals now use the useOverlay pattern with Provider wrappers. This change is part of CONSOLE-5012 to unblock the React Router v7 upgrade.

Assisted by: 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.

sg00dwin · 2026-01-20T22:32:40Z

/jira refresh

openshift-ci-robot · 2026-01-20T22:32:44Z

@sg00dwin: This pull request references CONSOLE-5049 which is a valid jira issue.

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

Nice work, @sg00dwin. Just one observation.

frontend/packages/console-shared/src/components/hpa/DeleteHPAModal.tsx

frontend/packages/console-shared/src/components/modals/ConsolePluginModal.tsx

openshift-ci-robot · 2026-01-21T15:10:32Z

@sg00dwin: This pull request references CONSOLE-5049 which is a valid jira issue.

Details

In response to this:

Remove createModalLauncher usage from DeleteHPAModal and ConsolePluginModal to eliminate React Router wrapper conflicts. Both modals now use the useOverlay pattern with Provider wrappers. This change is part of CONSOLE-5012 to unblock the React Router v7 upgrade.

Modals refactored
DeleteHPAModal.tsx
ConsolePluginModal.tsx

Assisted by: 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

One thing Claude caught as I was working on other migrations

frontend/packages/console-app/src/actions/creators/hpa-factory.ts

openshift-ci-robot · 2026-01-21T20:07:12Z

@sg00dwin: This pull request references CONSOLE-5049 which is a valid jira issue.

Details

In response to this:

Remove createModalLauncher usage from DeleteHPAModal and ConsolePluginModal to eliminate React Router wrapper conflicts. Both modals now use the useOverlay pattern with Provider wrappers. This change is part of CONSOLE-5012 to unblock the React Router v7 upgrade.

Modals refactored
DeleteHPAModal.tsx
ConsolePluginModal.tsx

Assisted by: Claude Code

Summary by CodeRabbit

Refactor

Updated modal handling for HPA deletion and console plugin configuration to use a consistent overlay-based presentation pattern, improving internal consistency across modal interactions.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

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.

coderabbitai · 2026-01-21T20:14:52Z

📝 Walkthrough

Walkthrough

This PR refactors modal invocation patterns across multiple console packages, transitioning from direct modal launcher functions to an overlay-based architecture using the useOverlay hook and OverlayComponent providers. Affected areas include HPA (Horizontal Pod Autoscaler) action management, Console Plugin configuration modals, and cluster service version components. The changes replace createModalLauncher exports with provider components that wrap modal logic within ModalWrapper, while components now acquire overlay launchers through useOverlay() hooks to trigger modal display. Public exports and component signatures are updated accordingly to reflect the new pattern.

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'CONSOLE-5049: Migrate modals from createModalLauncher to useOverlay' accurately and specifically summarizes the main change across all modified files—replacing the createModalLauncher pattern with the useOverlay hook-based pattern for modal invocations.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

coderabbitai

Actionable comments posted: 2

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

frontend/packages/operator-lifecycle-manager/src/components/clusterserviceversion.tsx (1)

243-283: Pass csvPluginsCount into the modal launch.
Line 278 opens the modal without csvPluginsCount, so ConsolePluginModal falls back to the single-plugin copy path. Since csvPluginsCount is computed at Line 257, forward it to preserve the operator-scoped messaging.

🛠️ Suggested fix

-                    launchOverlay(ConsolePluginModalProvider, {
-                      consoleOperatorConfig,
-                      pluginName,
-                      trusted,
-                    })
+                    launchOverlay(ConsolePluginModalProvider, {
+                      consoleOperatorConfig,
+                      csvPluginsCount,
+                      pluginName,
+                      trusted,
+                    })

🤖 Fix all issues with AI agents

In `@frontend/packages/console-app/src/actions/creators/hpa-factory.ts`:
- Around line 116-117: The eslint-disable comment incorrectly references
launchModal while the hook variable is named launchOverlay, causing a
stale/confusing comment; update the comment to reference launchOverlay (or
remove the disable if you can re-enable react-hooks/exhaustive-deps) near the
place where launchOverlay is used (the hook/variable named launchOverlay in
hpa-factory.ts) so the dependency comment accurately reflects the actual
dependency and prevents confusion for future maintainers.
- Around line 102-107: The delete CTA currently always passes only
relatedHPAs[0] to DeleteHPAModalProvider, which prevents deleting additional
HPAs; modify the cta in hpa-factory.ts to check relatedHPAs.length and when >1
either open a selector (e.g., launch a small picker overlay listing relatedHPAs
so the user can choose which HPA to delete) or pass the entire relatedHPAs array
to a revised DeleteHPAModalProvider that shows a list with delete actions, and
when length === 1 continue to pass relatedHPAs[0]; update references to
relatedHPAs, launchOverlay, and DeleteHPAModalProvider accordingly.

coderabbitai · 2026-01-21T20:14:55Z

frontend/packages/console-app/src/actions/creators/hpa-factory.ts

+        cta: () => {
+          launchOverlay(DeleteHPAModalProvider, {
+            workload: resource,
+            hpa: relatedHPAs[0],
+          });
+        },


⚠️ Potential issue | 🟠 Major

🧩 Analysis chain

🏁 Script executed:

# Search for DeleteHPAModal usage and related patterns rg -n -C5 'deleteHPAModal|DeleteHPAModal' --type=ts --type=tsx

Repository: openshift/console

Length of output: 88

🏁 Script executed:

# Look at the hpa-factory.ts file to understand the relatedHPAs population cat -n frontend/packages/console-app/src/actions/creators/hpa-factory.ts | head -150

Repository: openshift/console

Length of output: 5067

🏁 Script executed:

# Check for any comments or tests about multiple HPA scenarios rg -n -C3 'relatedHPAs|multiple.*HPA|HPA.*multiple' --type=ts --type=tsx

Repository: openshift/console

Length of output: 88

🏁 Script executed:

# Find and examine the doesHpaMatch function rg -n -C10 'export.*doesHpaMatch|function.*doesHpaMatch' --type=ts

Repository: openshift/console

Length of output: 1237

🏁 Script executed:

# Look at the DeleteHPAModal component find . -name 'DeleteHPAModal*' -type f | head -5

Repository: openshift/console

Length of output: 133

🏁 Script executed:

# Search for any tests or comments about multiple HPAs rg -n 'multiple.*HPA|HPA.*multiple|relatedHPAs.*length|relatedHPAs\[' --type=ts | head -20

Repository: openshift/console

Length of output: 586

🏁 Script executed:

# Check if there are any related issues or TODOs rg -n 'TODO|FIXME|BUG' frontend/packages/console-app/src/actions/creators/hpa-factory.ts

Repository: openshift/console

Length of output: 43

🏁 Script executed:

# Read the DeleteHPAModal component cat -n ./frontend/packages/console-shared/src/components/hpa/DeleteHPAModal.tsx

Repository: openshift/console

Length of output: 4439

🏁 Script executed:

# Search for test files related to HPA fd -e test.ts -e spec.ts hpa | head -20

Repository: openshift/console

Length of output: 208

🏁 Script executed:

# Check for tests in hpa-factory.ts rg -n 'test|describe|it(' frontend/packages/console-app/src/actions/creators/ | grep -i hpa

Repository: openshift/console

Length of output: 145

🏁 Script executed:

# Check the HPA utils tests cat -n frontend/packages/console-shared/src/utils/__tests__/hpa-utils.spec.ts

Repository: openshift/console

Length of output: 728

🏁 Script executed:

# Also check the dev-console HPA tests cat -n frontend/packages/dev-console/src/components/hpa/__tests__/hpa-utils.spec.ts | head -100

Repository: openshift/console

Length of output: 5392

🏁 Script executed:

# Search for any architectural decisions or comments about multiple HPAs rg -n 'multiple|single|one.*HPA|HPA.*one' frontend/packages/console-shared/src/utils/hpa-utils.ts frontend/packages/console-shared/src/components/hpa/DeleteHPAModal.tsx

Repository: openshift/console

Length of output: 350

Handle multiple HPAs targeting the same workload in the delete action.

The delete action passes relatedHPAs[0] to the DeleteHPAModal without checking if multiple HPAs target the workload. While Kubernetes discourages it, the API allows multiple HPAs per workload. When this occurs, only the first HPA can be deleted through the UI—users with multiple HPAs won't be able to remove the others. Either add a selection mechanism when multiple HPAs are present, warn the user, or document this as an unsupported edge case.

🤖 Prompt for AI Agents

In `@frontend/packages/console-app/src/actions/creators/hpa-factory.ts` around lines 102 - 107, The delete CTA currently always passes only relatedHPAs[0] to DeleteHPAModalProvider, which prevents deleting additional HPAs; modify the cta in hpa-factory.ts to check relatedHPAs.length and when >1 either open a selector (e.g., launch a small picker overlay listing relatedHPAs so the user can choose which HPA to delete) or pass the entire relatedHPAs array to a revised DeleteHPAModalProvider that shows a list with delete actions, and when length === 1 continue to pass relatedHPAs[0]; update references to relatedHPAs, launchOverlay, and DeleteHPAModalProvider accordingly.

frontend/packages/console-app/src/actions/creators/hpa-factory.ts

rhamilto

Couple of suggestions that came from the review of #15932

frontend/packages/console-app/src/components/console-operator/ConsoleOperatorConfig.tsx

frontend/packages/console-shared/src/components/modals/index.ts

sg00dwin · 2026-02-03T01:54:41Z

/test e2e-gcp-console

sg00dwin · 2026-02-03T15:15:30Z

/test e2e-gcp-console

frontend/packages/console-app/src/actions/creators/hpa-factory.ts

frontend/packages/console-app/src/components/console-operator/ConsoleOperatorConfig.tsx

sg00dwin · 2026-02-24T15:51:18Z

/retest-required

rhamilto · 2026-02-24T17:32:32Z

/lgtm

rhamilto · 2026-02-24T19:47:36Z

@sg00dwin, looks like you have a linter error.

sg00dwin · 2026-02-26T15:50:27Z

@rhamilto pushed fixes for the lint issues. Please retag thanks

rhamilto · 2026-02-26T15:51:49Z

/lgtm

openshift-ci · 2026-02-26T15:54:44Z

[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

rhamilto · 2026-02-26T18:43:50Z

/retest

rhamilto · 2026-02-27T13:28:10Z

/retest

sg00dwin · 2026-03-02T14:20:40Z

/test e2e-gcp-console

sg00dwin · 2026-03-02T14:23:34Z

/assign yanpzhan for verification

openshift-ci · 2026-03-02T14:23:52Z

@sg00dwin: GitHub didn't allow me to assign the following users: verification, for.

Note that only openshift members with read permissions, repo collaborators and people who have commented on this issue/PR can be assigned. Additionally, issues/PRs can only have 10 assignees at the same time.
For more information please see the contributor guide

Details

In response to this:

/assign yanpzhan for verification

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.

yapei · 2026-03-04T02:22:03Z

/assign @XiyunZhao
for verification

XiyunZhao · 2026-03-04T09:00:24Z

/verified by @XiyunZhao
Do regression test on HPA, consoleplugin and related page, no issue was found

openshift-ci-robot · 2026-03-04T09:00:42Z

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

Details

In response to this:

/verified by @XiyunZhao
Do regression test on HPA, consoleplugin and related page, no issue was found

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.

jhadvig · 2026-03-04T10:26:21Z

/retest

sg00dwin · 2026-03-04T18:10:10Z

/test e2e-gcp-console

openshift-ci · 2026-03-05T00:57:10Z

@sg00dwin: 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.

jhadvig · 2026-03-05T13:41:29Z

/override ci/prow/e2e-gcp-console

openshift-ci · 2026-03-05T13:53:35Z

@jhadvig: Overrode contexts on behalf of jhadvig: ci/prow/e2e-gcp-console

Details

In response to this:

/override ci/prow/e2e-gcp-console

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.

sg00dwin · 2026-03-05T22:11:15Z

/retest-required

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 Jan 20, 2026

openshift-ci bot requested review from rhamilto and spadgett January 20, 2026 18:58

openshift-ci bot added component/core Related to console core functionality component/olm Related to OLM component/shared Related to console-shared labels Jan 20, 2026

sg00dwin changed the title ~~[WIP] Migrate modals from createModalLauncher to useOverlay~~ [WIP] CONSOLE-5049: Migrate modals from createModalLauncher to useOverlay Jan 20, 2026

openshift-ci-robot added the jira/valid-reference Indicates that this PR references a valid Jira ticket of any type. label Jan 20, 2026

rhamilto reviewed Jan 21, 2026

View reviewed changes

frontend/packages/console-shared/src/components/hpa/DeleteHPAModal.tsx Outdated Show resolved Hide resolved

frontend/packages/console-shared/src/components/modals/ConsolePluginModal.tsx Outdated Show resolved Hide resolved

sg00dwin force-pushed the CONSOLE-5049-migration-from-createModalLauncher branch from f2fb0b5 to 3517ef6 Compare January 21, 2026 17:44

sg00dwin changed the title ~~[WIP] CONSOLE-5049: Migrate modals from createModalLauncher to useOverlay~~ CONSOLE-5049: Migrate modals from createModalLauncher to useOverlay Jan 21, 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 Jan 21, 2026

rhamilto reviewed Jan 21, 2026

View reviewed changes

frontend/packages/console-app/src/actions/creators/hpa-factory.ts Outdated Show resolved Hide resolved

sg00dwin force-pushed the CONSOLE-5049-migration-from-createModalLauncher branch from 3517ef6 to 582b790 Compare January 21, 2026 20:03

coderabbitai bot reviewed Jan 21, 2026

View reviewed changes

rhamilto reviewed Jan 29, 2026

View reviewed changes

frontend/packages/console-app/src/components/console-operator/ConsoleOperatorConfig.tsx Outdated Show resolved Hide resolved

frontend/packages/console-shared/src/components/modals/index.ts Outdated Show resolved Hide resolved

sg00dwin mentioned this pull request Jan 30, 2026

CONSOLE-5049: Migrate OLM modals to overlay pattern #15968

Open

sg00dwin force-pushed the CONSOLE-5049-migration-from-createModalLauncher branch from 582b790 to 0eb2387 Compare January 30, 2026 22:24

rhamilto reviewed Feb 3, 2026

View reviewed changes

frontend/packages/console-app/src/actions/creators/hpa-factory.ts Outdated Show resolved Hide resolved

rhamilto reviewed Feb 3, 2026

View reviewed changes

frontend/packages/console-app/src/actions/creators/hpa-factory.ts Outdated Show resolved Hide resolved

rhamilto reviewed Feb 3, 2026

View reviewed changes

frontend/packages/console-app/src/actions/creators/hpa-factory.ts Outdated Show resolved Hide resolved

rhamilto reviewed Feb 4, 2026

View reviewed changes

frontend/packages/console-app/src/components/console-operator/ConsoleOperatorConfig.tsx Outdated Show resolved Hide resolved

Fix rebase error

e4f6d16

openshift-ci bot removed the lgtm Indicates that a PR is ready to be merged. label Feb 24, 2026

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

sg00dwin mentioned this pull request Feb 25, 2026

[WIP] CONSOLE-5068: Remove createModalLauncher from modal factory #16066

Open

5 tasks

Fix lint issues

eeb71b8

openshift-ci bot removed the lgtm Indicates that a PR is ready to be merged. label Feb 26, 2026

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

openshift-ci bot assigned XiyunZhao Mar 4, 2026

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

openshift-merge-bot bot merged commit 2ccde34 into openshift:main Mar 5, 2026
7 of 8 checks passed

Conversation

sg00dwin commented Jan 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Modals Migrated

Changes

Scope Note

Uh oh!

openshift-ci-robot commented Jan 20, 2026 • edited by openshift-ci bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

sg00dwin commented Jan 20, 2026

Uh oh!

openshift-ci-robot commented Jan 20, 2026 • edited by openshift-ci bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

rhamilto left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

openshift-ci-robot commented Jan 21, 2026 • edited by openshift-ci bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

rhamilto left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

openshift-ci-robot commented Jan 21, 2026 • edited by openshift-ci bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

coderabbitai bot commented Jan 21, 2026 • edited by openshift-ci bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

coderabbitai bot Jan 21, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

rhamilto left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

sg00dwin commented Feb 3, 2026

Uh oh!

sg00dwin commented Feb 3, 2026

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

sg00dwin commented Feb 24, 2026

Uh oh!

rhamilto commented Feb 24, 2026

Uh oh!

rhamilto commented Feb 24, 2026

Uh oh!

sg00dwin commented Feb 26, 2026

Uh oh!

rhamilto commented Feb 26, 2026

Uh oh!

openshift-ci bot commented Feb 26, 2026

Uh oh!

rhamilto commented Feb 26, 2026

Uh oh!

rhamilto commented Feb 27, 2026

Uh oh!

sg00dwin commented Mar 2, 2026

Uh oh!

sg00dwin commented Mar 2, 2026

Uh oh!

openshift-ci bot commented Mar 2, 2026

Uh oh!

yapei commented Mar 4, 2026

Uh oh!

XiyunZhao commented Mar 4, 2026

sg00dwin commented Jan 20, 2026 •

edited

Loading

openshift-ci-robot commented Jan 20, 2026 •

edited by openshift-ci bot

Loading

openshift-ci-robot commented Jan 20, 2026 •

edited by openshift-ci bot

Loading

openshift-ci-robot commented Jan 21, 2026 •

edited by openshift-ci bot

Loading

openshift-ci-robot commented Jan 21, 2026 •

edited by openshift-ci bot

Loading

coderabbitai bot commented Jan 21, 2026 •

edited by openshift-ci bot

Loading