diff --git a/app/components/layout/admin_header_component.html.erb b/app/components/layout/admin_header_component.html.erb
index 903cc4541..f843abdf4 100644
--- a/app/components/layout/admin_header_component.html.erb
+++ b/app/components/layout/admin_header_component.html.erb
@@ -17,16 +17,9 @@
       </h1>
 
       <% if show_account_menu? %>
-        <div data-responsive-toggle="responsive_menu" data-hide-for="medium">
-          <button class="menu-button" type="button" data-toggle="responsive_menu">
-            <span class="menu-icon"></span>
-            <span><%= t("application.menu") %></span>
-          </button>
-        </div>
-
-        <div id="responsive_menu" class="responsive-menu">
+        <%= render Layout::ResponsiveMenuComponent.new do %>
           <%= render Layout::AccountMenuComponent.new(user) %>
-        </div>
+        <% end %>
       <% end %>
     </div>
   </div>
diff --git a/app/components/layout/responsive_menu_component.html.erb b/app/components/layout/responsive_menu_component.html.erb
new file mode 100644
index 000000000..3a0e6feab
--- /dev/null
+++ b/app/components/layout/responsive_menu_component.html.erb
@@ -0,0 +1,10 @@
+<span data-responsive-toggle="responsive_menu" data-hide-for="medium">
+  <button type="button" class="menu-button" data-toggle>
+    <span class="menu-icon"></span>
+    <%= t("application.menu") %>
+  </button>
+</span>
+
+<div id="responsive_menu" class="responsive-menu">
+  <%= content %>
+</div>
diff --git a/app/components/layout/responsive_menu_component.rb b/app/components/layout/responsive_menu_component.rb
new file mode 100644
index 000000000..baa98c998
--- /dev/null
+++ b/app/components/layout/responsive_menu_component.rb
@@ -0,0 +1,2 @@
+class Layout::ResponsiveMenuComponent < ApplicationComponent
+end
diff --git a/app/views/layouts/_header.html.erb b/app/views/layouts/_header.html.erb
index 24c200df7..bdbbf3dde 100644
--- a/app/views/layouts/_header.html.erb
+++ b/app/views/layouts/_header.html.erb
@@ -17,14 +17,7 @@
       <% end %>
     </h1>
 
-    <span data-responsive-toggle="responsive-menu" data-hide-for="medium">
-      <button type="button" class="menu-button" data-toggle>
-        <span class="menu-icon"></span>
-        <%= t("application.menu") %>
-      </button>
-    </span>
-
-    <div id="responsive-menu" class="responsive-menu">
+    <%= render Layout::ResponsiveMenuComponent.new do %>
       <%= render Layout::AccountMenuComponent.new(current_user) %>
 
       <div class="show-for-small-only">
@@ -33,7 +26,7 @@
           <%= render "shared/top_links" %>
         </div>
       </div>
-    </div>
+    <% end %>
   </div>
 
   <div id="navigation_bar" class="subnavigation">
diff --git a/spec/support/common_actions/users.rb b/spec/support/common_actions/users.rb
index 624b3854f..01caf46cf 100644
--- a/spec/support/common_actions/users.rb
+++ b/spec/support/common_actions/users.rb
@@ -75,11 +75,11 @@ module Users
   end
 
   def expect_to_be_signed_in
-    expect(find("#responsive-menu")).to have_content "My account"
+    expect(find("#responsive_menu")).to have_content "My account"
   end
 
   def expect_not_to_be_signed_in
-    expect(find("#responsive-menu")).not_to have_content "My account"
+    expect(find("#responsive_menu")).not_to have_content "My account"
   end
 
   def do_login_for(user, management:)