GeezerVison is showing github.com — ROX-39434: show base image save success in a toast by Vincent056 · Pull Request #24045 · stackrox/stackrox
Conversation
Description
After adding a base image (or editing its tag pattern), reopening the dialog showed the stale "Base image successfully added" / "Base image tag pattern successfully updated" alert above the empty form.
Cause: BaseImagesModal rendered an inline success alert while activeMutation.isSuccess. BaseImagesPage closes the modal from onSuccess, which skips the modal's handleModalClose (the only place that reset the mutation), and keeps the modal mounted while closed.
Fix:
BaseImagesModal: no inline success alert; on success it resets the add/update mutation and calls onSuccess(successMessage). Error alerts stay inline (the dialog stays open to fix the input).
BaseImagesPage: reports the message as a toast with the existing useToasts + AlertGroup isToast pattern (as in Collections, Integrations, vulnerability reports).
Alternatives considered:
- Mount the modal only while open: also clears stale state, but changes the page and leaves the modal wrong for hosts that keep it mounted.
- Reset in a
useEffect on isOpen: syncs state in an effect.
- Let the page pick the message from
baseImageToEdit: the modal already knows which save succeeded.
User-facing documentation
Testing and quality
- the change is production ready: the change is GA, or otherwise the functionality is gated by a feature flag
- CI results are inspected
Automated testing
- added unit tests
- added e2e tests
- added regression tests
- added compatibility tests
- modified existing tests
How I validated my change
BaseImagesModal.cy.jsx: the success test now asserts the onSuccess message and no inline alert; new add and edit tests reopen the modal from a host that closes it like the page does and expect no success alert. On the old code the reopen tests fail (stale banner in add and edit); with the fix all 10 pass headless, repeated runs.
- Local page-level component check (not committed): toast after add and edit, reopened dialogs clean, errors stay inline without a toast, toast close works.
npm run tsc, ESLint and Prettier on src/Containers/BaseImages/, Vitest src/Containers/BaseImages/: pass.
- Not run locally: e2e
baseImages.test.ts (needs a deployed Central; it does not assert the success text).
🤖 Generated with Claude Code
Sorry, something went wrong.
Uh oh!
There was an error while loading. Please reload this page.
BaseImagesModal showed an inline success alert while its add or update
mutation was in the success state. BaseImagesPage closes the modal from
onSuccess, which skips the modal's handleModalClose (the only place that
reset the mutation), and keeps the modal mounted while closed. The next
open therefore showed "Base image successfully added" (or "Base image
tag pattern successfully updated") above the empty form.
The modal now passes its success message to onSuccess and resets the
mutation on the success path too. The page reports the message with the
existing useToasts hook and an AlertGroup toast, as other pages do.
Error alerts stay inline because the dialog stays open to fix the input.
Alternatives considered: mounting the modal only while open (drops all
stale state, but changes the page and leaves the modal wrong for hosts
that keep it mounted); resetting in a useEffect on isOpen (state sync in
an effect); choosing the message in the page from baseImageToEdit (the
modal already knows which save succeeded).
Component tests: the success test now asserts the onSuccess message and
no inline alert; new add and edit tests reopen the modal from a host
that closes it like the page does and expect no success alert.
Request: ROX-39434 fix (report base image add/edit success with a toast,
no stale success banner on reopen), reviewed by the stackrox UI
maintainers.
This change was partially generated with AI assistance.
Co-Authored-By: Claude Opus 4.8 <[email protected]>
|
Skipping CI for Draft Pull Request.
If you want CI signal for your change, please convert it to an actual PR.
You can still manually trigger a test run with /test all
|
Sorry, something went wrong.
Uh oh!
There was an error while loading. Please reload this page.
coderabbitai
Bot
commented
Nov 12, 2026
•
edited
Loading
Uh oh!
There was an error while loading. Please reload this page.
|
No actionable comments were generated in the recent review.
Summary
-
Summary by CodeRabbit
- New Features
- Successful base image additions and edits now display dismissible toast notifications.
- Reopening the modal after a successful save shows the form without an inline success alert. Error alerts remain unchanged.
Base image saves now pass success messages from the modal to the page. The page closes the modal, displays the message as a toast, and refetches base images. The modal resets mutation state and no longer renders its own success alert.
Changes: Base image success notification flow
| Layer / File(s) |
Summary |
Modal success handoff and reset ui/apps/platform/src/Containers/BaseImages/BaseImagesModal.tsx |
The success callback now accepts a message. Successful add and edit operations reset mutation state and pass a mode-specific message to the parent. The modal no longer renders a success alert. |
Page toast flow and modal tests ui/apps/platform/src/Containers/BaseImages/BaseImagesPage.tsx, ui/apps/platform/src/Containers/BaseImages/BaseImagesModal.cy.jsx |
The page closes the modal, queues the success message as a toast, and refetches base images. Tests verify the callback message and confirm the form is available after reopening without an inline success alert. |
Estimated code review effort: 2 (Simple) | ~10 minutes
Change: Bug fix
Sequence Diagram(s)
sequenceDiagram
actor User
participant BaseImagesModal
participant BaseImagesPage
participant AlertGroup
User->>BaseImagesModal: Save base image
BaseImagesModal->>BaseImagesPage: onSuccess(successMessage)
BaseImagesPage->>BaseImagesPage: Close modal, queue toast, refetch base images
BaseImagesPage->>AlertGroup: Render queued toast
User->>AlertGroup: Dismiss toast
AlertGroup->>BaseImagesPage: Remove toast
Loading
Suggested reviewers: alanonthegit
Merge Risk: Minimal · up to 86b4e
-
Base image add and edit successes now appear as toasts instead of a stale inline alert after reopening the modal. No actionable merge-blocking risk remains.
Pre-merge checks: 4
-
| Check name |
Status |
Explanation |
| Title check |
 |
The title names the ticket and the main change: base image save success is now shown as a toast instead of an inline alert in the modal. It matches the changeset, which removes the inline success aler… |
| Description check |
 |
The description follows the repository template. It explains the root cause (a stale inline success alert shown after reopening the dialog), the fix in BaseImagesModal and BaseImagesPage, and alternat… |
| Linked Issues check |
 |
Check skipped because no linked issues were found for this pull request. |
| Out of Scope Changes check |
 |
Check skipped because no linked issues were found for this pull request. |
Full details: Title check
-
Explanation
The title names the ticket and the main change: base image save success is now shown as a toast instead of an inline alert in the modal. It matches the changeset, which removes the inline success alert from BaseImagesModal, passes the message to BaseImagesPage through onSuccess, and renders it as a toast. The title is specific and concise.
Full details: Description check
-
Explanation
The description follows the repository template. It explains the root cause (a stale inline success alert shown after reopening the dialog), the fix in BaseImagesModal and BaseImagesPage, and alternatives considered. It also includes the user-facing documentation and testing checklists, and it describes concrete validation: the Cypress test changes, the local page-level check, and the tsc, ESLint, Prettier, and Vitest runs. Several template items remain unchecked: CI results are not inspected, and unit tests and e2e tests are not marked as added. The e2e test was not run locally. The 'change me!' placeholders were replaced. The description is mostly complete, so the check passes.
Recent review info
-
Run configuration
-
- Source mode: Auto
- Repository: Unavailable
- Branch: Unavailable
- File: No configuration file from this repository applied
- Commit: Unavailable
- Layers: Central YAML (base), Organization UI (inherited)
- Review profile: CHILL
- Plan: Advanced
- Run ID:
6e08cffd-9c8f-4fca-bd90-0fc66278c890
Commits
-
Reviewing files that changed from the base of the PR and between 34e955b and 86b4eea.
Files selected for processing: 3
-
ui/apps/platform/src/Containers/BaseImages/BaseImagesModal.cy.jsx
ui/apps/platform/src/Containers/BaseImages/BaseImagesModal.tsx
ui/apps/platform/src/Containers/BaseImages/BaseImagesPage.tsx
Included review availability: This review used your included allowance. Your plan provides up to 4 included reviews per hour; 3 remain after this review.
|
Sorry, something went wrong.
Uh oh!
There was an error while loading. Please reload this page.
|
✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 52.86%. Comparing base (34e955b) to head (86b4eea).
Additional details and impacted files
@@ Coverage Diff @@
## master #24045 +/- ##
==========================================
- Coverage 52.90% 52.86% -0.05%
==========================================
Files 2755 2755
Lines 175277 175277
==========================================
- Hits 92732 92654 -78
- Misses 74479 74537 +58
- Partials 8066 8086 +20
Flags with carried forward coverage won't be shown. Click here to find out more.
☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.
🚀 New features to boost your workflow:
- 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.
|
Sorry, something went wrong.
Uh oh!
There was an error while loading. Please reload this page.
🚀 Build Images Ready
Images are ready for commit 86b4eea. To use with deploy scripts:
export MAIN_IMAGE_TAG=5.1.x-569-g86b4eea142
|
Sorry, something went wrong.
Uh oh!
There was an error while loading. Please reload this page.
This branch has not been deployed
No deployments
Uh oh!
There was an error while loading. Please reload this page.
Assignees
No one assigned
Milestone
No milestone
Development
Successfully merging this pull request may close these issues.
Uh oh!
There was an error while loading. Please reload this page.
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
|