Draft: Render pipelines link as a toast action
What does this MR do and why?
This refactors the A new Auto DevOps pipeline has been created
toast.
When this toast was initially implemented, we were still using vue-toasted
under the hood, which allowed HTML to be rendered inside toasts' body.
Since then, we have switched over to BootsrapVue's toast component, which only renders plain text in toasts' messages. This is an improvement in terms of security as previous toasts could potentially have been exploited for XSS attacks. But this breaks this particular toast as it contains a link to the pipelines page that doesn't render properly anymore.
In #343096 (closed), we have discussed a couple possible fixes. In the end, we have decided to move the pipelines link to the toast's action. This required that we add the ability to render actions as links in GlToast
, which can then be used here to populate the toast's options with the link's text and URL.
Screenshots or screen recordings
Before | After |
---|---|
How to set up and validate locally
This toast normally shows up when an Auto DevOps pipeline is triggered from a project's CI/CD settings page. I'm not sure how to properly set a project up to reproduce the actual interaction that should trigger the toast. Instead, I've changed CiCdController
to force the toast to show up when the settings page loads:
- Apply the following patch by copying the whole code block and running
pbpaste | git apply
:
diff --git a/app/controllers/projects/settings/ci_cd_controller.rb b/app/controllers/projects/settings/ci_cd_controller.rb
index 750708071c3..588516c713e 100644
--- a/app/controllers/projects/settings/ci_cd_controller.rb
+++ b/app/controllers/projects/settings/ci_cd_controller.rb
@@ -20,6 +20,11 @@ class CiCdController < Projects::ApplicationController
feature_category :continuous_integration
def show
+ flash[:toast] = {
+ "message": _("A new Auto DevOps pipeline has been created"),
+ "action_text": _("View pipelines"),
+ "action_href": project_pipelines_path(@project)
+ }
if Feature.enabled?(:ci_pipeline_triggers_settings_vue_ui, @project)
@triggers_json = ::Ci::TriggerSerializer.new.represent(
@project.triggers, current_user: current_user, project: @project
- Visit a project's CI/CD settings page at
/:namespace/:project/-/settings/ci_cd
.
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.
Related to #343096 (closed)