| name | configurable-banners |
| description | Adds or updates global configurable PatternFly alerts driven from src/config/banners.js—product scoping, conditions, locales, Redux messages, and tests. Use when the user asks for maintenance banners, global announcements, bannerMessages, useConfigBanners, or src/config/banners. |
Configurable banners
Global banners are config-driven (not hard-coded only in components). Introduced in feat: swatch-175 configurable banners (#1820).
Preconditions
Workflow
- Author banner entries in
src/config/banners.js. Each object supports id, title, message (often () => translate(...)), variant (AlertVariant from PatternFly), dataTest, optional productIds, optional condition, optional actions (links/buttons). See the JSDoc example at the top of that file and reference.md.
- Wire locales in
public/locales/en-US.json (and follow existing curiosity-banner.* key shapes). Do not ship English-only copy without team agreement on locale policy.
- Confirm runtime path:
bannersConfig is imported from config into productViewOnloadContext.js; useConfigBanners runs bannersConfig.forEach and calls setBannerMessages when productIds / condition allow.
- Redux: new banner payloads flow through existing
messagesReducer / banner context; avoid bypassing reducers unless you are fixing an established bug.
- Tests: update or add tests alongside
productViewOnloadContext.test.js and snapshots; run npm run test:lint / targeted tests per agent_testing.md.
Do not
- Add banners only in a product component when the requirement is global/config—extend
banners.js so behavior stays consistent across products.
- Skip
dataTest where the testing team relies on stable selectors; coordinate changes to data-test with QA when in doubt.
Reference
