refactor desktop utility menu links into rails helper/partial

app/helpers/navigation_helper.rb

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+module NavigationHelper
+
+    def utility_menu_link_desktop(image_path, href, alt, button_label)
+        render :partial => "navigation/utility_menu_link_desktop", :locals => {image_path: image_path, href: href, alt: alt, button_label: button_label}
+    end   
+end

app/views/layouts/_utility_menu.erb

@@ -1,47 +1,17 @@
 <!-- Desktop Utility Menu -->
 <div class="bg-primary-darker w-full display-none desktop:display-flex flex-justify-end padding-1 font-body-2xs text-white">
-    <div class="display-flex flex-align-center margin-x-1">
-        <%= image_tag('images/usa-icons/grid_view.svg', class: "usa-icon--size-3 icon-white margin-top-1 margin-right-1", alt: "Dashboard") %>
-        <a href="/dashboard" class="text-white margin-top-1">
-        Dashboard
-        </a>
-    </div>
+    <%= utility_menu_link_desktop('grid_view', 'dashboard', 'dashboard', 'Dashboard') %>
     <% if current_user.role == "challenge_manager" %>
-        <div class="display-flex flex-align-center margin-x-3">
-        <%= image_tag('images/usa-icons/emoji_events.svg', class: "usa-icon--size-3 icon-white margin-top-1 margin-right-1", alt: "Challenges") %>    
-        <a href="/user-guide" class="usa-nav-link text-white margin-top-1">
-            Challenges
-        </a>
-        </div>
+        <%= utility_menu_link_desktop('emoji_events', 'user_guide', 'challenges', 'Challenges') %>
     <% end %>
     <% if current_user.role == "challenge_manager" || current_user.role == "solver" %>
-        <div class="display-flex flex-align-center margin-x-1">
-        <%= image_tag('images/usa-icons/folder_open.svg', class: "usa-icon--size-3 icon-white margin-top-1 margin-right-1", alt: "Submissions") %>    
-        <a href="/submissions" class="usa-nav-link text-white margin-top-1">
-            Submissions
-        </a>
-        </div>
+        <%= utility_menu_link_desktop('folder_open', 'submissions', 'submissions', 'Submissions') %>
     <% end %>
     <% if current_user.role == "challenge_manager" || current_user.role == "evaluator" %>
-        <div class="display-flex flex-align-center margin-x-1">
-        <%= image_tag('images/usa-icons/content_copy.svg', class: "usa-icon--size-3 icon-white margin-top-1 margin-right-1", alt: "Evaluations") %>    
-        <a href="/user-guide" class="usa-nav-link text-white margin-top-1">
-            Evaluations
-        </a>
-        </div>
+        <%= utility_menu_link_desktop('content_copy', 'user-guide', 'evaluations', 'Evaluations') %>
     <% end %>  
-    <div class="display-flex flex-align-center margin-x-1">
-        <%= image_tag('images/usa-icons/map.svg', class: "usa-icon--size-3 icon-white margin-top-1 margin-right-1", alt: "User Guides") %>    
-        <a href="/user-guide" class="usa-nav-link text-white margin-top-1">
-        User Guides
-        </a>
-    </div>
-    <div class="display-flex flex-align-center margin-x-1">
-        <%= image_tag('images/usa-icons/support_agent.svg', class: "usa-icon--size-3 icon-white margin-top-1 margin-right-1", alt: "Help") %>    
-        <a href="/federal-agency-faqs" class="usa-nav-link text-white margin-top-1">
-        Help
-        </a>
-    </div>
+    <%= utility_menu_link_desktop('map', 'user_guide', 'user guides', 'User Guides') %>
+    <%= utility_menu_link_desktop('support_agent', 'federal-agency-faqs', 'help', 'Help') %>
     <div class="display-flex flex-align-center margin-x-1 margin-top-1">
         |
         <%= image_tag('images/usa-icons/account_circle.svg', class: "usa-icon--size-3 icon-white margin-x-2", alt: "Help") %>    

app/views/navigation/_utility_menu_link_desktop.html.erb

@@ -0,0 +1,6 @@
+<a href=<%= "/#{href}" %> class="display-flex flex-align-center margin-x-3 text-white">
+    <%= image_tag("images/usa-icons/#{image_path}.svg", class: "usa-icon--size-3 icon-white margin-top-1 margin-right-1", alt: alt) %>
+    <span class="margin-top-1">
+        <%= button_label %>
+    </span>
+</a>