Add advanced editor toggle and banner
What does this MR do and why?
This merge request adds an experimental "advanced editor" feature to the security policy editor interface. The changes introduce:
- A promotional banner that appears to inform users about the new advanced editor option, with buttons to try it or dismiss the notification permanently.
- A toggle switch that allows users to switch between the standard editor and the new advanced editor mode, along with a feedback link when the advanced mode is active.
- Local storage integration to remember user preferences - whether they've dismissed the banner and which editor mode they prefer.
- Feature flag integration that controls when these new UI elements are shown, allowing the feature to be gradually rolled out.
- Prop passing throughout the component hierarchy to ensure all editor components know whether advanced mode is enabled.
The advanced editor appears to provide a "split view" interface that's more intuitive than the current editor. The implementation is designed as an experiment, allowing users to opt-in while keeping the standard editor as the default. User choices are saved locally so their preferences persist across sessions. The feature includes proper internationalization support for multiple languages.
References
Screenshots or screen recordings
| Description | UI |
|---|---|
| Banner and experiment toggle | editor.mov |
How to set up and validate locally
-
Enable feature flag:
Feature.enable(:security_policies_split_view) -
Go to Secure -> Policies
-
New policy (any type)
-
Try to enable experiment from banner
-
Dismiss the banner
-
Use toggle in header to change experiment state
MR acceptance checklist
Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Related to #545145 (closed)