Skip to content

Conversation

@rhamilto
Copy link
Member

@rhamilto rhamilto commented Jan 21, 2026

Summary

This PR migrates several modals from the legacy createModalLauncher pattern to the new OverlayComponent pattern, improving code consistency and maintainability. All modals follow the *ModalOverlay naming convention to clearly distinguish from the deprecated ModalProvider pattern.

Note: This PR builds on #15932, which should merge first.

Changes

This PR includes the following modal migrations:

  1. configure-update-strategy-modal - Migrated to overlay pattern with ConfigureUpdateStrategyModalOverlay component
  2. configure-ns-pull-secret-modal - Migrated to overlay pattern with ConfigureNamespacePullSecretModalOverlay component
  3. configure-cluster-upstream-modal - Migrated to overlay pattern with ConfigureClusterUpstreamModalOverlay component
  4. managed-resource-save-modal - Migrated to overlay pattern with ManagedResourceSaveModalOverlay component
  5. remove-user-modal - Removed orphaned modal registration (no longer in use)

Naming Convention

All modal overlay components and exports follow the *ModalOverlay naming pattern:

  • Component exports: ConfigureUpdateStrategyModalOverlay, ConfigureNamespacePullSecretModalOverlay, etc.
  • Lazy exports: LazyConfigureUpdateStrategyModalOverlay, LazyConfigureNamespacePullSecretModalOverlay, etc.

This naming convention:

Migration Pattern

Each migration follows a consistent pattern:

  • Export modal overlay as OverlayComponent using the *ModalOverlay naming convention
  • Wrap modal component with ModalWrapper and connect to overlay lifecycle (closeOverlay)
  • Update modal index to lazy-load the overlay using React.lazy() with matching naming
  • Update consuming components to use useOverlay hook with launchModal() instead of direct modal calls
  • Ensure proper prop spreading: {...props} before explicit cancel and close props

Technical Details

  • All modals properly implement the ModalComponentProps interface
  • Props are spread correctly to ensure overrides work properly
  • Lazy loading implemented with proper webpack chunk names for code splitting
  • Global react-modal app element setup handled in App component (from CONSOLE-5012: Migrate delete modals and PVC modals to overlay pattern #15932)
  • Consistent *ModalOverlay naming across all exports and references

Example

// Modal file
export const ConfigureUpdateStrategyModalOverlay: OverlayComponent<ConfigureUpdateStrategyModalProps> = (
  props,
) => {
  return (
    <ModalWrapper blocking onClose={props.closeOverlay}>
      <ConfigureUpdateStrategyModal
        {...props}
        cancel={props.closeOverlay}
        close={props.closeOverlay}
      />
    </ModalWrapper>
  );
};
// index.ts
export const LazyConfigureUpdateStrategyModalOverlay = lazy(() =>
  import('./configure-update-strategy-modal').then((m) => ({
    default: m.ConfigureUpdateStrategyModalOverlay,
  })),
);
// Usage in action hook
const launchModal = useOverlay();
cta: () => launchModal(LazyConfigureUpdateStrategyModalOverlay, { deployment: resource })

Test Plan

  • Verify configure-update-strategy-modal opens and functions correctly from deployment actions
  • Verify configure-ns-pull-secret-modal opens and functions correctly from namespace actions
  • Verify configure-cluster-upstream-modal opens and functions correctly from cluster version details
  • Verify managed-resource-save-modal opens and functions correctly when editing YAML
  • Verify no console errors or warnings related to modals
  • Verify lazy loading works (check Network tab for chunk loading)
  • Verify naming consistency: all exports use *ModalOverlay pattern

Benefits

🤖 Generated with Claude Code

@openshift-ci-robot
Copy link
Contributor

@rhamilto: No Jira issue with key CONSOLE-5212 exists in the tracker at https://issues.redhat.com/.
Once a valid jira issue is referenced in the title of this pull request, request a refresh with /jira refresh.

Details

In response to this:

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

@rhamilto: No Jira issue with key CONSOLE-5212 exists in the tracker at https://issues.redhat.com/.
Once a valid jira issue is referenced in the title of this pull request, request a refresh with /jira refresh.

Details

In response to this:

Includes changes from #15932, which should merge first.

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 cajieh and spadgett January 21, 2026 16:22
@openshift-ci openshift-ci bot added component/core Related to console core functionality approved Indicates a PR has been approved by an approver from all required OWNERS files. component/dev-console Related to dev-console component/knative Related to knative-plugin component/sdk Related to console-plugin-sdk labels Jan 21, 2026
@openshift-ci-robot
Copy link
Contributor

openshift-ci-robot commented Jan 21, 2026

@rhamilto: No Jira issue with key CONSOLE-5212 exists in the tracker at https://issues.redhat.com/.
Once a valid jira issue is referenced in the title of this pull request, request a refresh with /jira refresh.

Details

In response to this:

Summary

This PR continues the migration of legacy modals from the createModalLauncher pattern to the new OverlayComponent pattern using the useOverlay hook.

Note: This PR builds on #15932, which should merge first.

Changes Included

Modal Migrations

  1. configure-update-strategy-modal (aa2e2d3)
  • Migrated to OverlayComponent pattern
  • Updated usages in Deployment and DaemonSet actions
  1. configure-ns-pull-secret-modal (a9ab259)
  • Migrated to OverlayComponent pattern
  • Updated usage in namespace actions
  1. configure-cluster-upstream-modal (1359e50)
  • Migrated to OverlayComponent pattern
  • Updated usage in ClusterVersion details page
  • Fixed react-modal accessibility warnings
  1. managed-resource-save-modal (b468570)
  • Migrated to OverlayComponent pattern
  • Updated usage in edit-yaml.tsx to use useOverlay hook
  1. rollback-modal (aebae95)
  • Migrated to OverlayComponent pattern
  • Updated useReplicationControllerActions hook
  • Updated useReplicaSetActions hook

Cleanup

  1. remove-user-modal (a3bc91d)
  • Removed orphaned modal (functionality replaced by useWarningModal in group.tsx)

Pattern Used

All migrations follow the same pattern:

  • Export [ModalName]Provider as an OverlayComponent
  • Add lazy-loaded export in modals/index.ts as Lazy[ModalName]Provider
  • Update all usages to call launchModal(Lazy[ModalName]Provider, props) instead of the old modal launcher
  • Remove createModalLauncher usage

Testing

Each modal can be tested via:

  • configure-update-strategy-modal: Deployment/DaemonSet actions → "Edit update strategy"
  • configure-ns-pull-secret-modal: Namespace actions → "Edit pull secret"
  • configure-cluster-upstream-modal: ClusterVersion details page → "Channel" pencil icon
  • managed-resource-save-modal: Edit YAML of operator-managed resource → Save
  • rollback-modal: ReplicaSet/ReplicationController actions → "Rollback"

Related

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.

1 similar comment
@openshift-ci-robot
Copy link
Contributor

@rhamilto: No Jira issue with key CONSOLE-5212 exists in the tracker at https://issues.redhat.com/.
Once a valid jira issue is referenced in the title of this pull request, request a refresh with /jira refresh.

Details

In response to this:

Summary

This PR continues the migration of legacy modals from the createModalLauncher pattern to the new OverlayComponent pattern using the useOverlay hook.

Note: This PR builds on #15932, which should merge first.

Changes Included

Modal Migrations

  1. configure-update-strategy-modal (aa2e2d3)
  • Migrated to OverlayComponent pattern
  • Updated usages in Deployment and DaemonSet actions
  1. configure-ns-pull-secret-modal (a9ab259)
  • Migrated to OverlayComponent pattern
  • Updated usage in namespace actions
  1. configure-cluster-upstream-modal (1359e50)
  • Migrated to OverlayComponent pattern
  • Updated usage in ClusterVersion details page
  • Fixed react-modal accessibility warnings
  1. managed-resource-save-modal (b468570)
  • Migrated to OverlayComponent pattern
  • Updated usage in edit-yaml.tsx to use useOverlay hook
  1. rollback-modal (aebae95)
  • Migrated to OverlayComponent pattern
  • Updated useReplicationControllerActions hook
  • Updated useReplicaSetActions hook

Cleanup

  1. remove-user-modal (a3bc91d)
  • Removed orphaned modal (functionality replaced by useWarningModal in group.tsx)

Pattern Used

All migrations follow the same pattern:

  • Export [ModalName]Provider as an OverlayComponent
  • Add lazy-loaded export in modals/index.ts as Lazy[ModalName]Provider
  • Update all usages to call launchModal(Lazy[ModalName]Provider, props) instead of the old modal launcher
  • Remove createModalLauncher usage

Testing

Each modal can be tested via:

  • configure-update-strategy-modal: Deployment/DaemonSet actions → "Edit update strategy"
  • configure-ns-pull-secret-modal: Namespace actions → "Edit pull secret"
  • configure-cluster-upstream-modal: ClusterVersion details page → "Channel" pencil icon
  • managed-resource-save-modal: Edit YAML of operator-managed resource → Save
  • rollback-modal: ReplicaSet/ReplicationController actions → "Rollback"

Related

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 rhamilto changed the title [WIP] CONSOLE-5212: Migrate modals to overlay pattern [WIP] CONSOLE-5012: Migrate modals to overlay pattern Jan 21, 2026
@openshift-ci-robot openshift-ci-robot added the jira/valid-reference Indicates that this PR references a valid Jira ticket of any type. label Jan 21, 2026
@openshift-ci-robot
Copy link
Contributor

openshift-ci-robot commented Jan 21, 2026

@rhamilto: This pull request references CONSOLE-5012 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 continues the migration of legacy modals from the createModalLauncher pattern to the new OverlayComponent pattern using the useOverlay hook.

Note: This PR builds on #15932, which should merge first.

Changes Included

Modal Migrations

  1. configure-update-strategy-modal (aa2e2d3)
  • Migrated to OverlayComponent pattern
  • Updated usages in Deployment and DaemonSet actions
  1. configure-ns-pull-secret-modal (a9ab259)
  • Migrated to OverlayComponent pattern
  • Updated usage in namespace actions
  1. configure-cluster-upstream-modal (1359e50)
  • Migrated to OverlayComponent pattern
  • Updated usage in ClusterVersion details page
  • Fixed react-modal accessibility warnings
  1. managed-resource-save-modal (b468570)
  • Migrated to OverlayComponent pattern
  • Updated usage in edit-yaml.tsx to use useOverlay hook
  1. rollback-modal (aebae95)
  • Migrated to OverlayComponent pattern
  • Updated useReplicationControllerActions hook
  • Updated useReplicaSetActions hook

Cleanup

  1. remove-user-modal (a3bc91d)
  • Removed orphaned modal (functionality replaced by useWarningModal in group.tsx)

Pattern Used

All migrations follow the same pattern:

  • Export [ModalName]Provider as an OverlayComponent
  • Add lazy-loaded export in modals/index.ts as Lazy[ModalName]Provider
  • Update all usages to call launchModal(Lazy[ModalName]Provider, props) instead of the old modal launcher
  • Remove createModalLauncher usage

Testing

Each modal can be tested via:

  • configure-update-strategy-modal: Deployment/DaemonSet actions → "Edit update strategy"
  • configure-ns-pull-secret-modal: Namespace actions → "Edit pull secret"
  • configure-cluster-upstream-modal: ClusterVersion details page → "Channel" pencil icon
  • managed-resource-save-modal: Edit YAML of operator-managed resource → Save
  • rollback-modal: ReplicaSet/ReplicationController actions → "Rollback"

Related

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
Copy link
Contributor

openshift-ci-robot commented Jan 21, 2026

@rhamilto: This pull request references CONSOLE-5012 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 continues the migration of modals from the legacy createModalLauncher pattern to the new OverlayComponent pattern using the useOverlay hook.

Note: This PR builds on #15932 (PVC modals, delete-modal, configure-update-strategy-modal, configure-ns-pull-secret-modal, configure-cluster-upstream-modal).

This PR includes the following changes:

Modals Migrated (2)

  1. managed-resource-save-modal - Used when editing YAML of managed resources
  • Updated: public/components/modals/managed-resource-save-modal.tsx
  • Updated: public/components/edit-yaml.tsx
  1. remove-user-modal - Removed as orphaned code
  • Deleted: public/components/modals/remove-user-modal.tsx
  • This modal was already replaced by useWarningModal in group.tsx

Additional Fixes

  1. Fixed launchModal dependency issues in existing action hooks
  • The launchModal function from useOverlay() returns a new reference on every render
  • Including it in dependency arrays causes infinite re-render loops
  • Added eslint-disable comments with explanations in:
    • useRetryRolloutAction.ts
    • build-config-provider.ts
    • machine-config-pool-provider.ts
    • edit-yaml.tsx (from managed-resource-save-modal migration)

Changes Made

For each modal:

  • Removed createModalLauncher usage
  • Added OverlayComponent and ModalWrapper imports
  • Exported modal as [Name]Provider wrapping content in ModalWrapper
  • Updated index files to use React.lazy() for code splitting
  • Updated usages to use useOverlay() hook with launchModal()
  • Added appropriate ESLint disable comments for launchModal dependencies to prevent infinite loops

🤖 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-robot
Copy link
Contributor

openshift-ci-robot commented Jan 21, 2026

@rhamilto: This pull request references CONSOLE-5012 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 continues the migration of modals from the legacy createModalLauncher pattern to the new OverlayComponent pattern using the useOverlay hook.

Note: This PR builds on #15932. The commits from #15932 are included at the base of this PR.

Commits from PR #15932 (base - 3 commits)

  1. CONSOLE-5012: Migrate PVC modals to overlay pattern
  2. CONSOLE-5012: Migrate delete-modal and actions to overlay pattern
  3. CONSOLE-5012: Fix launchModal dependency in existing action hooks

New Commits in This PR (5 commits)

  1. CONSOLE-5012: Migrate configure-update-strategy-modal to overlay pattern
  • Updated: packages/console-app/src/actions/hooks/useDeploymentActions.ts
  • Updated: public/components/modals/configure-update-strategy-modal.tsx
  1. CONSOLE-5012: Migrate configure-ns-pull-secret-modal to overlay pattern
  • Updated: public/components/modals/configure-ns-pull-secret-modal.tsx
  1. CONSOLE-5012: Migrate configure-cluster-upstream-modal to overlay pattern
  • Updated: public/components/modals/configure-cluster-upstream-modal.tsx
  1. CONSOLE-5012: Migrate managed-resource-save-modal to overlay pattern
  • Updated: public/components/modals/managed-resource-save-modal.tsx
  • Updated: public/components/edit-yaml.tsx
  • Added eslint-disable comment for launchModal dependency
  1. CONSOLE-5012: Remove orphaned remove-user-modal
  • Deleted: public/components/modals/remove-user-modal.tsx
  • This modal was already replaced by useWarningModal in group.tsx

Summary of Changes

For each migrated modal:

  • Removed createModalLauncher usage
  • Added OverlayComponent and ModalWrapper imports
  • Exported modal as [Name]Provider wrapping content in ModalWrapper
  • Updated index files to use React.lazy() for code splitting
  • Updated usages to use useOverlay() hook with launchModal()
  • Added appropriate ESLint disable comments for launchModal dependencies where needed

launchModal Dependency Issue

The launchModal function from useOverlay() returns a new reference on every render (similar to setState from useState). Including it in dependency arrays causes infinite re-render loops. All affected files now have eslint-disable comments documenting this intentional exclusion.

🤖 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.

1 similar comment
@openshift-ci-robot
Copy link
Contributor

openshift-ci-robot commented Jan 21, 2026

@rhamilto: This pull request references CONSOLE-5012 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 continues the migration of modals from the legacy createModalLauncher pattern to the new OverlayComponent pattern using the useOverlay hook.

Note: This PR builds on #15932. The commits from #15932 are included at the base of this PR.

Commits from PR #15932 (base - 3 commits)

  1. CONSOLE-5012: Migrate PVC modals to overlay pattern
  2. CONSOLE-5012: Migrate delete-modal and actions to overlay pattern
  3. CONSOLE-5012: Fix launchModal dependency in existing action hooks

New Commits in This PR (5 commits)

  1. CONSOLE-5012: Migrate configure-update-strategy-modal to overlay pattern
  • Updated: packages/console-app/src/actions/hooks/useDeploymentActions.ts
  • Updated: public/components/modals/configure-update-strategy-modal.tsx
  1. CONSOLE-5012: Migrate configure-ns-pull-secret-modal to overlay pattern
  • Updated: public/components/modals/configure-ns-pull-secret-modal.tsx
  1. CONSOLE-5012: Migrate configure-cluster-upstream-modal to overlay pattern
  • Updated: public/components/modals/configure-cluster-upstream-modal.tsx
  1. CONSOLE-5012: Migrate managed-resource-save-modal to overlay pattern
  • Updated: public/components/modals/managed-resource-save-modal.tsx
  • Updated: public/components/edit-yaml.tsx
  • Added eslint-disable comment for launchModal dependency
  1. CONSOLE-5012: Remove orphaned remove-user-modal
  • Deleted: public/components/modals/remove-user-modal.tsx
  • This modal was already replaced by useWarningModal in group.tsx

Summary of Changes

For each migrated modal:

  • Removed createModalLauncher usage
  • Added OverlayComponent and ModalWrapper imports
  • Exported modal as [Name]Provider wrapping content in ModalWrapper
  • Updated index files to use React.lazy() for code splitting
  • Updated usages to use useOverlay() hook with launchModal()
  • Added appropriate ESLint disable comments for launchModal dependencies where needed

launchModal Dependency Issue

The launchModal function from useOverlay() returns a new reference on every render (similar to setState from useState). Including it in dependency arrays causes infinite re-render loops. All affected files now have eslint-disable comments documenting this intentional exclusion.

🤖 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
Copy link
Member Author

@CodeRabbit review

@coderabbitai
Copy link

coderabbitai bot commented Jan 21, 2026

✅ Actions performed

Review triggered.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

@openshift-ci-robot
Copy link
Contributor

openshift-ci-robot commented Jan 21, 2026

@rhamilto: This pull request references CONSOLE-5012 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 continues the migration of modals from the legacy createModalLauncher pattern to the new OverlayComponent pattern using the useOverlay hook.

Note: This PR builds on #15932. The commits from #15932 are included at the base of this PR.

Commits from PR #15932 (base - 3 commits)

  1. CONSOLE-5012: Migrate PVC modals to overlay pattern
  2. CONSOLE-5012: Migrate delete-modal and actions to overlay pattern
  3. CONSOLE-5012: Fix launchModal dependency in existing action hooks

New Commits in This PR (5 commits)

  1. CONSOLE-5012: Migrate configure-update-strategy-modal to overlay pattern
  • Updated: packages/console-app/src/actions/hooks/useDeploymentActions.ts
  • Updated: public/components/modals/configure-update-strategy-modal.tsx
  1. CONSOLE-5012: Migrate configure-ns-pull-secret-modal to overlay pattern
  • Updated: public/components/modals/configure-ns-pull-secret-modal.tsx
  1. CONSOLE-5012: Migrate configure-cluster-upstream-modal to overlay pattern
  • Updated: public/components/modals/configure-cluster-upstream-modal.tsx
  1. CONSOLE-5012: Migrate managed-resource-save-modal to overlay pattern
  • Updated: public/components/modals/managed-resource-save-modal.tsx
  • Updated: public/components/edit-yaml.tsx
  • Added eslint-disable comment for launchModal dependency
  1. CONSOLE-5012: Remove orphaned remove-user-modal
  • Deleted: public/components/modals/remove-user-modal.tsx
  • This modal was already replaced by useWarningModal in group.tsx

Summary of Changes

For each migrated modal:

  • Removed createModalLauncher usage
  • Added OverlayComponent and ModalWrapper imports
  • Exported modal as [Name]Provider wrapping content in ModalWrapper
  • Updated index files to use React.lazy() for code splitting
  • Updated usages to use useOverlay() hook with launchModal()
  • Added appropriate ESLint disable comments for launchModal dependencies where needed

launchModal Dependency Issue

The launchModal function from useOverlay() returns a new reference on every render (similar to setState from useState). Including it in dependency arrays causes infinite re-render loops. All affected files now have eslint-disable comments documenting this intentional exclusion.

🤖 Generated with Claude Code

Summary by CodeRabbit

  • New Features

  • Improved modal accessibility configuration for screen readers and assistive technologies.

  • Enabled lazy-loading of modal dialogs for better performance and reduced initial bundle size.

  • Bug Fixes

  • Enhanced modal rendering reliability through Suspense boundaries.

  • Refactor

  • Modernized modal system architecture from direct function calls to provider-based overlay pattern for improved maintainability.

✏️ 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
Copy link

coderabbitai bot commented Jan 21, 2026

📝 Walkthrough

Walkthrough

This pull request refactors the modal invocation system from direct function calls to an overlay-based provider pattern. Modal components are wrapped in new OverlayComponent<Props> providers and launched dynamically via a useOverlay() hook returning launchModal. Action creators are converted to React hooks using useMemo for memoized returns. Modal modules are lazy-loaded via React.lazy() with corresponding lazy provider exports. Suspense boundaries wrap each lazy overlay render. Modal accessibility setup is moved to the App component. Direct modal invocations in action creators, hooks, and components are replaced with launchModal(LazyProviderName, props) calls. The RemoveUserModal component is removed entirely.

🚥 Pre-merge checks | ✅ 3
✅ Passed checks (3 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly identifies the main change: migrating modals from createModalLauncher pattern to OverlayComponent pattern, which is the core focus of this PR across multiple files.
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

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

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 4

🤖 Fix all issues with AI agents
In `@frontend/packages/dev-console/src/actions/context-menu.ts`:
- Around line 1-6: Guard against application.resources being undefined by
defaulting to an empty array before iterating: replace direct calls like
application.resources.forEach(...) with (application.resources ??
[]).forEach(...) (or Array.isArray check) in the delete action and any cleanup
loops that touch application.resources (e.g., the delete modal / cleanup logic
using application.resources), and apply the same change to all other occurrences
in this file where application.resources is iterated.

In `@frontend/packages/knative-plugin/src/actions/creators.ts`:
- Around line 120-153: The useMemo in useDeleteKnativeServiceResource is
including the launchModal value from useOverlay in its dependency array which
forces the memo to recreate on every render; remove launchModal from the
dependencies and leave [kind, obj, serviceTypeValue, serviceCreatedFromWebFlag]
instead, and add the same explanatory comment used elsewhere: "missing
launchModal dependency, that causes max depth exceeded error."; apply the same
change/comment pattern to SecretKeySelector's hook where launchModal is
currently included.

In `@frontend/public/components/modals/configure-cluster-upstream-modal.tsx`:
- Around line 169-178: The provider currently spreads {...props} after passing
cancel/close to ConfigureClusterUpstreamModal so caller-supplied cancel/close
can override the provider's closeOverlay; update
ConfigureClusterUpstreamModalProvider to pass {...props} first and then
explicitly set cancel={props.closeOverlay} and close={props.closeOverlay} (or
otherwise ensure the provider's closeOverlay wins) so the ModalWrapper/provider
always controls closing; refer to ConfigureClusterUpstreamModalProvider,
ConfigureClusterUpstreamModal, props, and closeOverlay when making the change.

In `@frontend/public/components/modals/index.ts`:
- Around line 97-102: The lazy import for LazyClonePVCModalProvider should use
the module default export to match the pattern used by
LazyExpandPVCModalProvider and LazyConfigureClusterUpstreamModalProvider; update
the .then handler to return { default: m.default } (or simply use m.default)
instead of { default: m.ClonePVCModalProvider } so it consistently consumes the
component via the module's default export (the component is exported both named
and default as ClonePVCModalProvider).
🧹 Nitpick comments (6)
frontend/packages/console-dynamic-plugin-sdk/src/app/modal-support/OverlayProvider.tsx (1)

55-57: Suspense addition is appropriate for lazy-loaded modal providers.

The fallback={null} is the right choice here—you don't want a loading spinner flashing before the modal materializes. This cleanly supports the lazy provider pattern (React.lazy()) being rolled out across the modal migrations.

One consideration: if a lazy chunk fails to load (network hiccup, 404'd chunk after a deployment), the error will propagate upward with no local catch. You might want to wrap this in an ErrorBoundary to gracefully handle chunk loading failures without potentially unmounting the entire overlay context tree.

💡 Optional: Add ErrorBoundary for chunk loading resilience
+import ErrorBoundary from '@console/shared/src/components/error/ErrorBoundary';
+// Or implement a minimal local ErrorBoundary if preferred
 
 // Inside the render:
       {_.map(componentsMap, (c, id) => (
-        <Suspense key={id} fallback={null}>
-          <c.Component {...c.props} closeOverlay={() => closeOverlay(id)} />
-        </Suspense>
+        <ErrorBoundary key={id} FallbackComponent={() => null}>
+          <Suspense fallback={null}>
+            <c.Component {...c.props} closeOverlay={() => closeOverlay(id)} />
+          </Suspense>
+        </ErrorBoundary>
       ))}

This ensures a failed lazy import doesn't take down the entire overlay system—graceful degradation for production resilience.

frontend/packages/console-app/src/actions/hooks/useRetryRolloutAction.ts (1)

98-100: Avoid stale launchModal by stabilizing it instead of suppressing deps.

Suppressing exhaustive-deps can capture a stale overlay context if the provider remounts; use a ref to keep the latest launchModal and drop the eslint disable.

♻️ Proposed refactor
-import { useMemo } from 'react';
+import { useEffect, useMemo, useRef } from 'react';
@@
   const { t } = useTranslation();
   const launchModal = useOverlay();
+  const launchModalRef = useRef(launchModal);
+  useEffect(() => {
+    launchModalRef.current = launchModal;
+  }, [launchModal]);
@@
-      cta: () =>
-        retryRollout(rcModel, rc).catch((err) => launchModal(ErrorModal, { error: err.message })),
+      cta: () =>
+        retryRollout(rcModel, rc).catch((err) =>
+          launchModalRef.current(ErrorModal, { error: err.message }),
+        ),
@@
-    // missing launchModal dependency, that causes max depth exceeded error
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [t, dcModel, rcModel, rc, canRetry, resource],
frontend/packages/console-app/src/components/modals/clone/clone-pvc-modal.tsx (1)

279-285: Guard against callers overriding closeOverlay.
Because ...props comes last, any passed cancel/close would override the overlay close handler. Prefer spreading first, then explicitly wiring closeOverlay to enforce correct dismissal.

♻️ Suggested tweak
-export const ClonePVCModalProvider: OverlayComponent<ClonePVCModalProps> = (props) => {
+export const ClonePVCModalProvider: OverlayComponent<ClonePVCModalProps> = ({
+  closeOverlay,
+  ...rest
+}) => {
   return (
-    <ModalWrapper blocking onClose={props.closeOverlay}>
-      <ClonePVCModal cancel={props.closeOverlay} close={props.closeOverlay} {...props} />
+    <ModalWrapper blocking onClose={closeOverlay}>
+      <ClonePVCModal {...rest} cancel={closeOverlay} close={closeOverlay} />
     </ModalWrapper>
   );
 };

Also applies to: 287-288

frontend/public/components/modals/expand-pvc-modal.tsx (1)

99-105: Provider implementation follows the established pattern.

The ModalWrapper correctly receives blocking and onClose. Wiring closeOverlay to both cancel and close ensures the modal dismisses properly on either action.

One minor note: {...props} spreads closeOverlay into ExpandPVCModal, but ExpandPVCModal destructures only resource, kind, close, and cancel. The extra prop is harmless but slightly redundant. Consider destructuring explicitly if you want cleaner prop forwarding:

♻️ Optional cleanup
-export const ExpandPVCModalProvider: OverlayComponent<ExpandPVCModalProps> = (props) => {
+export const ExpandPVCModalProvider: OverlayComponent<ExpandPVCModalProps> = ({
+  closeOverlay,
+  ...rest
+}) => {
   return (
-    <ModalWrapper blocking onClose={props.closeOverlay}>
-      <ExpandPVCModal cancel={props.closeOverlay} close={props.closeOverlay} {...props} />
+    <ModalWrapper blocking onClose={closeOverlay}>
+      <ExpandPVCModal cancel={closeOverlay} close={closeOverlay} {...rest} />
     </ModalWrapper>
   );
 };
frontend/packages/console-app/src/actions/hooks/useDeploymentActions.ts (1)

170-178: Note: resourceLimitsModal still uses legacy pattern.

The EditResourceLimits action still invokes resourceLimitsModal directly rather than through launchModal. Given the PR title indicates WIP, this is presumably planned for a future commit. Just flagging for tracking purposes.

frontend/public/components/modals/configure-update-strategy-modal.tsx (1)

241-253: LGTM - Clean provider implementation following the overlay pattern.

The migration correctly wraps ConfigureUpdateStrategyModal inside ModalWrapper with blocking behavior and wires closeOverlay to both cancel and close handlers. The backward-compatible default export maintains API stability.

Minor observation: The spread {...props} passes closeOverlay to the inner modal which doesn't use it. This is harmless but consider destructuring to keep props clean:

✨ Optional cleanup
-export const ConfigureUpdateStrategyModalProvider: OverlayComponent<ConfigureUpdateStrategyModalProps> = (
-  props,
-) => {
+export const ConfigureUpdateStrategyModalProvider: OverlayComponent<ConfigureUpdateStrategyModalProps> = ({
+  closeOverlay,
+  ...rest
+}) => {
   return (
-    <ModalWrapper blocking onClose={props.closeOverlay}>
+    <ModalWrapper blocking onClose={closeOverlay}>
       <ConfigureUpdateStrategyModal
-        cancel={props.closeOverlay}
-        close={props.closeOverlay}
-        {...props}
+        cancel={closeOverlay}
+        close={closeOverlay}
+        {...rest}
       />
     </ModalWrapper>
   );
 };

@openshift-merge-robot openshift-merge-robot added the needs-rebase Indicates a PR cannot be merged because it has merge conflicts with HEAD. label Jan 21, 2026
@openshift-ci openshift-ci bot added component/shared Related to console-shared component/topology Related to topology kind/cypress Related to Cypress e2e integration testing labels Jan 21, 2026
rhamilto added a commit to rhamilto/console that referenced this pull request Jan 26, 2026
This commit migrates all instances of confirmModal to use the modern
overlay pattern with useWarningModal, completing the modal migration
effort started in previous PRs.

Changes:
- Removed deprecated confirmModal launcher and confirm-modal.tsx file
- Migrated topology moveNodeToGroup to use useWarningModal with proper
  cancel handling via global handler pattern
- Updated StopNodeMaintenanceModal to remove deprecated imperative API
  and keep only the useStopNodeMaintenanceModal hook
- Fixed useWarningModal to properly call closeOverlay() and filter it
  from props spread to prevent React DOM warnings
- Added try-catch in topology drag-drop to prevent optimistic update
  when user cancels the move operation
- Updated all metal3-plugin maintenance components to use the hook-based
  approach

This PR builds upon and depends on:
- openshift#15932 (ResourceLimitsModal migration)
- openshift#15939 (DeletePDBModal migration)
- openshift#15940 (ConfigureUnschedulableModal migration)
- openshift#15946 (Global error modal utility)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@openshift-ci-robot
Copy link
Contributor

openshift-ci-robot commented Jan 27, 2026

@rhamilto: This pull request references CONSOLE-5012 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 migrates several modals from the legacy createModalLauncher pattern to the new OverlayComponent pattern, improving code consistency and maintainability.

Changes

This PR includes the following modal migrations:

  1. configure-update-strategy-modal - Migrated to overlay pattern with lazy loading support
  2. configure-ns-pull-secret-modal - Migrated to overlay pattern with lazy loading
  3. configure-cluster-upstream-modal - Migrated to overlay pattern with lazy loading
  4. managed-resource-save-modal - Migrated to overlay pattern with lazy loading
  5. remove-user-modal - Removed orphaned modal registration (no longer in use)

Each migration follows the same pattern:

  • Export modal provider as OverlayComponent
  • Update modal index to lazy-load the provider
  • Update consuming components to use useOverlay hook instead of direct modal calls
  • Remove deprecated modal launcher registrations

Test Plan

  • Verify configure-update-strategy-modal opens and functions correctly
  • Verify configure-ns-pull-secret-modal opens and functions correctly
  • Verify configure-cluster-upstream-modal opens and functions correctly
  • Verify managed-resource-save-modal opens and functions correctly
  • Verify no console errors or warnings related to modals

🤖 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-robot
Copy link
Contributor

openshift-ci-robot commented Jan 27, 2026

@rhamilto: This pull request references CONSOLE-5012 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 migrates several modals from the legacy createModalLauncher pattern to the new OverlayComponent pattern, improving code consistency and maintainability.

Note this PR builds on #15932

Changes

This PR includes the following modal migrations:

  1. configure-update-strategy-modal - Migrated to overlay pattern with lazy loading support
  2. configure-ns-pull-secret-modal - Migrated to overlay pattern with lazy loading
  3. configure-cluster-upstream-modal - Migrated to overlay pattern with lazy loading
  4. managed-resource-save-modal - Migrated to overlay pattern with lazy loading
  5. remove-user-modal - Removed orphaned modal registration (no longer in use)

Each migration follows the same pattern:

  • Export modal provider as OverlayComponent
  • Update modal index to lazy-load the provider
  • Update consuming components to use useOverlay hook instead of direct modal calls
  • Remove deprecated modal launcher registrations

Test Plan

  • Verify configure-update-strategy-modal opens and functions correctly
  • Verify configure-ns-pull-secret-modal opens and functions correctly
  • Verify configure-cluster-upstream-modal opens and functions correctly
  • Verify managed-resource-save-modal opens and functions correctly
  • Verify no console errors or warnings related to modals

🤖 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
Copy link
Member Author

@coderabbitai review

@coderabbitai
Copy link

coderabbitai bot commented Jan 27, 2026

✅ Actions performed

Review triggered.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

@openshift-ci-robot
Copy link
Contributor

openshift-ci-robot commented Jan 27, 2026

@rhamilto: This pull request references CONSOLE-5012 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 migrates several modals from the legacy createModalLauncher pattern to the new OverlayComponent pattern, improving code consistency and maintainability.

Note this PR builds on #15932

Changes

This PR includes the following modal migrations:

  1. configure-update-strategy-modal - Migrated to overlay pattern with lazy loading support
  2. configure-ns-pull-secret-modal - Migrated to overlay pattern with lazy loading
  3. configure-cluster-upstream-modal - Migrated to overlay pattern with lazy loading
  4. managed-resource-save-modal - Migrated to overlay pattern with lazy loading
  5. remove-user-modal - Removed orphaned modal registration (no longer in use)

Each migration follows the same pattern:

  • Export modal provider as OverlayComponent
  • Update modal index to lazy-load the provider
  • Update consuming components to use useOverlay hook instead of direct modal calls
  • Remove deprecated modal launcher registrations

Test Plan

  • Verify configure-update-strategy-modal opens and functions correctly
  • Verify configure-ns-pull-secret-modal opens and functions correctly
  • Verify configure-cluster-upstream-modal opens and functions correctly
  • Verify managed-resource-save-modal opens and functions correctly
  • Verify no console errors or warnings related to modals

🤖 Generated with Claude Code

Summary by CodeRabbit

  • Performance Improvements

  • Modal components now load on-demand, reducing initial application size and improving startup performance.

  • Improvements

  • Enhanced modal rendering with better handling of asynchronous component loading.

  • Improved state management for delete and configuration modals across resources.

✏️ 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.

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 5

Caution

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

⚠️ Outside diff range comments (1)
frontend/packages/knative-plugin/src/actions/providers.ts (1)

119-119: Potential logic issue: || should likely be && for readiness check.

Using || means isReady is true if either set of actions is ready. If commonActionsReady is true but deploymentActionsReady is false, you'll build the actions array with potentially stale/undefined deploymentActions.EditResourceLimits. This can cause runtime errors or incorrect UI state.

🔧 Proposed fix
-  const isReady = commonActionsReady || deploymentActionsReady;
+  const isReady = commonActionsReady && deploymentActionsReady;
🤖 Fix all issues with AI agents
In `@frontend/packages/dev-console/src/actions/context-menu.ts`:
- Around line 42-60: The useMemo in useDeleteResourceAction incorrectly includes
the launchModal reference (returned from useOverlay) in its dependency array,
which breaks memoization because useOverlay returns a new function each render;
remove launchModal from the dependency array so the memoized Action stays
referentially stable. Locate useDeleteResourceAction and update the useMemo
dependencies to [t, kind, obj] (keeping asAccessReview and
LazyDeleteModalProvider usage unchanged); if lint rules complain, add a brief
eslint-disable-next-line comment scoped to that dependency line explaining that
launchModal is intentionally excluded because useOverlay returns a new
reference.

In `@frontend/public/components/modals/configure-ns-pull-secret-modal.tsx`:
- Around line 317-326: The prop spread {...props} is placed after the explicit
cancel and close props so caller-supplied cancel/close can override
props.closeOverlay; in ConfigureNamespacePullSecretModalProvider move the spread
to before the explicit assignments so ConfigureNamespacePullSecret receives
{...props} first and then cancel={props.closeOverlay} close={props.closeOverlay}
to ensure the modal always uses props.closeOverlay for both handlers.

In `@frontend/public/components/modals/configure-update-strategy-modal.tsx`:
- Around line 241-250: The modal provider is being exported incorrectly and its
close handlers can be overridden; ensure the module's public export is the
provider component ConfigureUpdateStrategyModalProvider (not the inner
ConfigureUpdateStrategy form) so the ModalWrapper and overlay behavior are
preserved, and inside ConfigureUpdateStrategyModalProvider pass {...props}
before explicitly setting cancel={props.closeOverlay} and
close={props.closeOverlay} when rendering ConfigureUpdateStrategyModal so
caller-provided handlers cannot override the provider's close control; update
the index.ts export to export ConfigureUpdateStrategyModalProvider as the
lazy-loaded component and keep ModalWrapper wrapping
ConfigureUpdateStrategyModal unchanged.

In `@frontend/public/components/modals/index.ts`:
- Around line 48-55: The lazy import currently maps to m.ConfigureUpdateStrategy
(a plain FC) but should map to the overlay provider export; update the promise
resolution in LazyConfigureUpdateStrategyModalProvider to return default:
m.ConfigureUpdateStrategyModalProvider so the lazy-loaded component is the
OverlayComponent<ConfigureUpdateStrategyModalProps> provider rather than the
plain modal component; ensure the exported name
LazyConfigureUpdateStrategyModalProvider remains unchanged and that the import
string './configure-update-strategy-modal' stays the same.

In `@frontend/public/components/modals/managed-resource-save-modal.tsx`:
- Around line 49-55: In ManagedResourceSaveModalProvider, the current prop order
passes close={props.closeOverlay} before {...props}, allowing a caller-supplied
close in {...props} to override the provider's handler; change the JSX to spread
{...props} first and then explicitly set close={props.closeOverlay} on the
ManagedResourceSaveModal (within the ModalWrapper) so the provider-controlled
close handler cannot be overridden.
🧹 Nitpick comments (3)
frontend/packages/console-app/src/components/modals/clone/clone-pvc-modal.tsx (1)

278-288: Provider implementation looks solid.

The ClonePVCModalProvider correctly:

  • Types as OverlayComponent<ClonePVCModalProps> matching the SDK contract
  • Uses blocking on ModalWrapper to prevent accidental dismissal during form interaction
  • Wires closeOverlay to both cancel and close, ensuring consistent teardown

One minor observation: {...props} spreads closeOverlay into ClonePVCModal, but the inner component only destructures close, cancel, and resource, so this is harmless. If you want to be explicit and avoid passing extra props to the DOM, you could destructure and omit closeOverlay:

♻️ Optional: explicit prop handling
-export const ClonePVCModalProvider: OverlayComponent<ClonePVCModalProps> = (props) => {
+export const ClonePVCModalProvider: OverlayComponent<ClonePVCModalProps> = ({
+  closeOverlay,
+  ...restProps
+}) => {
   return (
-    <ModalWrapper blocking onClose={props.closeOverlay}>
-      <ClonePVCModal {...props} cancel={props.closeOverlay} close={props.closeOverlay} />
+    <ModalWrapper blocking onClose={closeOverlay}>
+      <ClonePVCModal {...restProps} cancel={closeOverlay} close={closeOverlay} />
     </ModalWrapper>
   );
 };
frontend/packages/console-app/src/actions/hooks/useVolumeSnapshotActions.ts (1)

4-55: Stabilize launchModal to preserve memoization.
Given launchModal is documented as unstable per render, including it in the deps makes factory and actions re-create every render, which can ripple into unnecessary re-renders downstream. Prefer omitting it with an eslint comment (as done elsewhere) or wrapping via a stable ref/callback.

♻️ Suggested adjustment (minimal)
-  const factory = useMemo(
+  // eslint-disable-next-line react-hooks/exhaustive-deps -- launchModal is unstable per render
+  const factory = useMemo(
     () => ({
       [VolumeSnapshotActionCreator.RestorePVC]: () => ({
         id: 'clone-pvc',
         label: t('console-app~Restore as new PVC'),
         disabled: !resource?.status?.readyToUse,
         tooltip: !resource?.status?.readyToUse ? t('console-app~Volume Snapshot is not Ready') : '',
         cta: () =>
           launchModal(LazyRestorePVCModalProvider, {
             resource,
           }),
         accessReview: asAccessReview(VolumeSnapshotModel, resource, 'create'),
       }),
     }),
-    [t, resource, launchModal],
+    [t, resource],
   );
frontend/public/components/factory/modal.tsx (1)

34-41: Guard against appElement being null.
document.querySelector can return null (tests, plugin contexts). A fallback (e.g., document.body) avoids react-modal warnings and preserves a11y behavior.

♻️ Suggested hardening
-  const appElement = document.querySelector('#app-content') || document.querySelector('#app');
+  const appElement =
+    document.querySelector('#app-content') ||
+    document.querySelector('#app') ||
+    document.body;

@openshift-ci-robot
Copy link
Contributor

openshift-ci-robot commented Jan 27, 2026

@rhamilto: This pull request references CONSOLE-5012 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 migrates several modals from the legacy createModalLauncher pattern to the new OverlayComponent pattern, improving code consistency and maintainability.

Note: This PR builds on #15932

Changes

This PR includes the following modal migrations:

  1. configure-update-strategy-modal - Migrated to overlay pattern with lazy loading support
  2. configure-ns-pull-secret-modal - Migrated to overlay pattern with lazy loading
  3. configure-cluster-upstream-modal - Migrated to overlay pattern with lazy loading
  4. managed-resource-save-modal - Migrated to overlay pattern with lazy loading
  5. remove-user-modal - Removed orphaned modal registration (no longer in use)

Migration Pattern

Each migration follows a consistent pattern:

  • Export modal provider as OverlayComponent with correct prop spreading order ({...props} before explicit props)
  • Update modal index to lazy-load the provider using React.lazy()
  • Update consuming components to use useOverlay hook with launchModal() instead of direct modal calls
  • Remove deprecated modal launcher registrations from index.ts

Technical Details

  • All modals properly implement the ModalComponentProps interface
  • Props are spread correctly: {...props} before explicit cancel and close props to ensure overrides work properly
  • Lazy loading implemented with proper webpack chunk names for code splitting
  • Global react-modal app element setup handled in App component

Test Plan

  • Verify configure-update-strategy-modal opens and functions correctly from deployment actions
  • Verify configure-ns-pull-secret-modal opens and functions correctly from namespace actions
  • Verify configure-cluster-upstream-modal opens and functions correctly from cluster version details
  • Verify managed-resource-save-modal opens and functions correctly when editing YAML
  • Verify no console errors or warnings related to modals
  • Verify lazy loading works (check Network tab for chunk loading)

🤖 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
Copy link
Member Author

Additional Improvements

Bug Fix: Undefined Kind Parameter Handling

Fixed a potential crash in delete action hooks when kindObj is undefined during initial loading (while inFlight is true):

Files Updated:

  • context-menu.ts - useDeleteResourceAction

    • Changed signature from kind: K8sModel to kind: K8sModel | undefined
    • Added safe access: kind.kindkind?.kind
  • creators.ts - useDeleteKnativeServiceResource

    • Changed signature from kind: K8sKind to kind: K8sKind | undefined
    • Added type assertion for asAccessReview

Why This Matters:

  • useK8sModel can return [undefined, true] during initial loading
  • Without this fix, accessing kind.kind would crash when the hook is called with undefined
  • Now mirrors the pattern used in useCommonActions and usePDBActions

Affected Callers (now safe):

  • deployment-provider.ts - passes kindObj which can be undefined
  • deploymentconfig-provider.ts - passes kindObj which can be undefined
  • knative-plugin/providers.ts - passes kindObj which can be undefined (2 calls)

Code Organization

Also improved code organization in configure-update-strategy-modal.tsx by moving the ConfigureUpdateStrategyModalProvider export to be positioned after the component but before type definitions, improving readability.

🤖 Generated with Claude Code

@openshift-ci-robot
Copy link
Contributor

openshift-ci-robot commented Jan 27, 2026

@rhamilto: This pull request references CONSOLE-5012 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 migrates several modals from the legacy createModalLauncher pattern to the new OverlayComponent pattern, improving code consistency and maintainability.

Note: This PR builds on #15932, which should merge first.

Changes

This PR includes the following modal migrations:

  1. configure-update-strategy-modal - Migrated to overlay pattern with lazy loading support
  2. configure-ns-pull-secret-modal - Migrated to overlay pattern with lazy loading
  3. configure-cluster-upstream-modal - Migrated to overlay pattern with lazy loading
  4. managed-resource-save-modal - Migrated to overlay pattern with lazy loading
  5. remove-user-modal - Removed orphaned modal registration (no longer in use)

Migration Pattern

Each migration follows a consistent pattern:

  • Export modal provider as OverlayComponent with correct prop spreading order ({...props} before explicit props)
  • Update modal index to lazy-load the provider using React.lazy()
  • Update consuming components to use useOverlay hook with launchModal() instead of direct modal calls
  • Remove deprecated modal launcher registrations from index.ts

Technical Details

  • All modals properly implement the ModalComponentProps interface
  • Props are spread correctly: {...props} before explicit cancel and close props to ensure overrides work properly
  • Lazy loading implemented with proper webpack chunk names for code splitting
  • Global react-modal app element setup handled in App component

Test Plan

  • Verify configure-update-strategy-modal opens and functions correctly from deployment actions
  • Verify configure-ns-pull-secret-modal opens and functions correctly from namespace actions
  • Verify configure-cluster-upstream-modal opens and functions correctly from cluster version details
  • Verify managed-resource-save-modal opens and functions correctly when editing YAML
  • Verify no console errors or warnings related to modals
  • Verify lazy loading works (check Network tab for chunk loading)

🤖 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
Copy link
Member Author

/retest

rhamilto added a commit to rhamilto/console that referenced this pull request Jan 27, 2026
This commit migrates all instances of confirmModal to use the modern
overlay pattern with useWarningModal, completing the modal migration
effort started in previous PRs.

Changes:
- Removed deprecated confirmModal launcher and confirm-modal.tsx file
- Migrated topology moveNodeToGroup to use useWarningModal with proper
  cancel handling via global handler pattern
- Updated StopNodeMaintenanceModal to remove deprecated imperative API
  and keep only the useStopNodeMaintenanceModal hook
- Fixed useWarningModal to properly call closeOverlay() and filter it
  from props spread to prevent React DOM warnings
- Added try-catch in topology drag-drop to prevent optimistic update
  when user cancels the move operation
- Updated all metal3-plugin maintenance components to use the hook-based
  approach

This PR builds upon and depends on:
- openshift#15932 (ResourceLimitsModal migration)
- openshift#15939 (DeletePDBModal migration)
- openshift#15940 (ConfigureUnschedulableModal migration)
- openshift#15946 (Global error modal utility)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
rhamilto and others added 7 commits January 28, 2026 10:37
This commit refactors configure-update-strategy-modal to use the
OverlayComponent pattern, eliminating createModalLauncher.

Changes:
- Refactored configure-update-strategy-modal.tsx to use OverlayComponent
- Added ConfigureUpdateStrategyModalProvider with ModalWrapper
- Added LazyConfigureUpdateStrategyModalProvider with React.lazy()
- Updated useDeploymentActions to use the new lazy provider
- Removed deprecated configureUpdateStrategyModal from index.ts

This change maintains backward compatibility through default exports
and preserves lazy loading functionality.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit migrates the configure namespace pull secret modal from the
legacy createModalLauncher pattern to the new OverlayComponent pattern.

Changes:
- Exported ConfigureNamespacePullSecretModalProvider as OverlayComponent
- Updated index.ts to lazy-load the modal provider
- Modified namespace.jsx to use useOverlay hook instead of direct modal call

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

This commit migrates the configure cluster upstream modal from the legacy
createModalLauncher pattern to the new OverlayComponent pattern and fixes
react-modal accessibility warnings.

Changes:
- Exported ConfigureClusterUpstreamModalProvider as OverlayComponent
- Updated index.ts to lazy-load the modal provider
- Modified details-page.tsx to use useOverlay hook instead of direct modal call
- Removed unnecessary TFunction prop from modal type definition
- Fixed react-modal warnings by using useLayoutEffect for global app element setup
- Added explicit appElement prop to ModalWrapper for robust timing handling

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit migrates the managed resource save modal from the legacy
createModalLauncher pattern to the new OverlayComponent pattern.

Changes:
- Exported ManagedResourceSaveModalProvider as OverlayComponent
- Updated index.ts to lazy-load the modal provider
- Modified edit-yaml.tsx to use useOverlay hook instead of direct modal call
- Removed unnecessary 'kind' prop from modal invocation
- Updated type definition to extend ModalComponentProps

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
The remove-user-modal was already replaced by useWarningModal in
group.tsx and is no longer used anywhere in the codebase.

Changes:
- Deleted remove-user-modal.tsx
- Removed LazyRemoveUserModalProvider export from index.ts

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@openshift-ci-robot
Copy link
Contributor

openshift-ci-robot commented Jan 28, 2026

@rhamilto: This pull request references CONSOLE-5012 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 migrates several modals from the legacy createModalLauncher pattern to the new OverlayComponent pattern, improving code consistency and maintainability. All modals follow the *ModalOverlay naming convention to clearly distinguish from the deprecated ModalProvider pattern.

Note: This PR builds on #15932, which should merge first.

Changes

This PR includes the following modal migrations:

  1. configure-update-strategy-modal - Migrated to overlay pattern with ConfigureUpdateStrategyModalOverlay component
  2. configure-ns-pull-secret-modal - Migrated to overlay pattern with ConfigureNamespacePullSecretModalOverlay component
  3. configure-cluster-upstream-modal - Migrated to overlay pattern with ConfigureClusterUpstreamModalOverlay component
  4. managed-resource-save-modal - Migrated to overlay pattern with ManagedResourceSaveModalOverlay component
  5. remove-user-modal - Removed orphaned modal registration (no longer in use)

Naming Convention

All modal overlay components and exports follow the *ModalOverlay naming pattern:

  • Component exports: ConfigureUpdateStrategyModalOverlay, ConfigureNamespacePullSecretModalOverlay, etc.
  • Lazy exports: LazyConfigureUpdateStrategyModalOverlay, LazyConfigureNamespacePullSecretModalOverlay, etc.

This naming convention:

Migration Pattern

Each migration follows a consistent pattern:

  • Export modal overlay as OverlayComponent using the *ModalOverlay naming convention
  • Wrap modal component with ModalWrapper and connect to overlay lifecycle (closeOverlay)
  • Update modal index to lazy-load the overlay using React.lazy() with matching naming
  • Update consuming components to use useOverlay hook with launchModal() instead of direct modal calls
  • Ensure proper prop spreading: {...props} before explicit cancel and close props

Technical Details

  • All modals properly implement the ModalComponentProps interface
  • Props are spread correctly to ensure overrides work properly
  • Lazy loading implemented with proper webpack chunk names for code splitting
  • Global react-modal app element setup handled in App component (from CONSOLE-5012: Migrate delete modals and PVC modals to overlay pattern #15932)
  • Consistent *ModalOverlay naming across all exports and references

Example

// Modal file
export const ConfigureUpdateStrategyModalOverlay: OverlayComponent<ConfigureUpdateStrategyModalProps> = (
 props,
) => {
 return (
   <ModalWrapper blocking onClose={props.closeOverlay}>
     <ConfigureUpdateStrategyModal
       {...props}
       cancel={props.closeOverlay}
       close={props.closeOverlay}
     />
   </ModalWrapper>
 );
};
// index.ts
export const LazyConfigureUpdateStrategyModalOverlay = lazy(() =>
 import('./configure-update-strategy-modal').then((m) => ({
   default: m.ConfigureUpdateStrategyModalOverlay,
 })),
);
// Usage in action hook
const launchModal = useOverlay();
cta: () => launchModal(LazyConfigureUpdateStrategyModalOverlay, { deployment: resource })

Test Plan

  • Verify configure-update-strategy-modal opens and functions correctly from deployment actions
  • Verify configure-ns-pull-secret-modal opens and functions correctly from namespace actions
  • Verify configure-cluster-upstream-modal opens and functions correctly from cluster version details
  • Verify managed-resource-save-modal opens and functions correctly when editing YAML
  • Verify no console errors or warnings related to modals
  • Verify lazy loading works (check Network tab for chunk loading)
  • Verify naming consistency: all exports use *ModalOverlay pattern

Benefits

🤖 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 added a commit to rhamilto/console that referenced this pull request Jan 28, 2026
This commit migrates all instances of confirmModal to use the modern
overlay pattern with useWarningModal, completing the modal migration
effort started in previous PRs.

Changes:
- Removed deprecated confirmModal launcher and confirm-modal.tsx file
- Migrated topology moveNodeToGroup to use useWarningModal with proper
  cancel handling via global handler pattern
- Updated StopNodeMaintenanceModal to remove deprecated imperative API
  and keep only the useStopNodeMaintenanceModal hook
- Fixed useWarningModal to properly call closeOverlay() and filter it
  from props spread to prevent React DOM warnings
- Added try-catch in topology drag-drop to prevent optimistic update
  when user cancels the move operation
- Updated all metal3-plugin maintenance components to use the hook-based
  approach

This PR builds upon and depends on:
- openshift#15932 (ResourceLimitsModal migration)
- openshift#15939 (DeletePDBModal migration)
- openshift#15940 (ConfigureUnschedulableModal migration)
- openshift#15946 (Global error modal utility)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@rhamilto
Copy link
Member Author

/retest

2 similar comments
@rhamilto
Copy link
Member Author

/retest

@rhamilto
Copy link
Member Author

/retest

@openshift-ci
Copy link
Contributor

openshift-ci bot commented Jan 29, 2026

@rhamilto: 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/e2e-gcp-console 78a4f2c link true /test e2e-gcp-console

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

/retest

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/dev-console Related to dev-console component/knative Related to knative-plugin 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/cypress Related to Cypress e2e integration testing

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants