diff --git a/src/api/app/components/workflow_run_filter_link_component.html.haml b/src/api/app/components/workflow_run_filter_link_component.html.haml
index 2b6c2007850..0db992d9b89 100644
--- a/src/api/app/components/workflow_run_filter_link_component.html.haml
+++ b/src/api/app/components/workflow_run_filter_link_component.html.haml
@@ -1,8 +1,7 @@
 = link_to(token_workflow_runs_path(@token, @filter_item),
           class: "list-group-item list-group-item-action #{css_for_link} d-flex justify-content-between") do
   %span
-    - if @icon != ''
-      %i.me-1{ class: "#{@icon} #{css_for_icon}" }
+    = icon_tag
     = @text
   - if @amount.positive?
     %span= @amount
diff --git a/src/api/app/components/workflow_run_filter_link_component.rb b/src/api/app/components/workflow_run_filter_link_component.rb
index fd4f6c11bf0..59fbe81a8ff 100644
--- a/src/api/app/components/workflow_run_filter_link_component.rb
+++ b/src/api/app/components/workflow_run_filter_link_component.rb
@@ -14,8 +14,8 @@ def css_for_link
     workflow_run_filter_matches? ? 'active' : ''
   end
 
-  def css_for_icon
-    workflow_run_filter_matches? ? 'text-light' : ''
+  def icon_tag
+    tag.i(class: ['me-1', @icon, ('text-light' if workflow_run_filter_matches?)]) if @icon != ''
   end
 
   private