Load main menu lazily with a turbo frame

app/controllers/my/menus_controller.rb

@@ -0,0 +1,6 @@
+class My::MenusController < ApplicationController
+  include FilterScoped
+
+  def show
+  end
+end

app/views/filters/_menu.html.erb

@@ -1,43 +1,13 @@
-<% cache user_filtering do %>
-  <nav data-controller="dialog" data-action="keydown.esc->dialog#close click@document->dialog#closeOnClickOutside">
-    <%= render "filters/menu/button" %>
+<nav data-controller="dialog" data-action="keydown.esc->dialog#close click@document->dialog#closeOnClickOutside">
+  <%= render "filters/menu/button" %>
 
-    <%= tag.dialog class: "fizzy-menu filter popup popup--animated panel margin-block-start-half",
-          data: {
-                action: "turbo:before-cache@document->dialog#close keydown->navigable-list#navigate filter:changed->navigable-list#reset toggle->filter#filter",
-                controller: "filter navigable-list",
-                dialog_target: "dialog",
-                navigable_list_focus_on_selection_value: false,
-                navigable_list_actionable_items_value: true } do %>
-      <div class="flex gap">
-        <%= text_field_tag :search, nil,
-              type: "search",
-              role: "combobox",
-              placeholder: "Filter…",
-              class: "input input--transparent txt-small",
-              autofocus: true,
-              autocorrect: "off",
-              autocomplete: "off",
-              aria: { activedescendant: "" },
-              data: {
-                    "1p-ignore": "true",
-                    filter_target: "input",
-                    navigable_list_target: "input",
-                    action: "input->filter#filter" } %>
-        <button class="fizzy-menu__close btn borderless txt-small" data-action="dialog#close">
-          <%= icon_tag "close" %>
-          <span class="for-screen-reader">Close menu</span>
-        </button>
-      </div>
-
-      <%= render "filters/menu/hotkeys" %>
-      <%= render "filters/menu/custom", user_filtering: user_filtering %>
-      <%= render "filters/menu/collections", user_filtering: user_filtering %>
-      <%= render "filters/menu/tags", user_filtering: user_filtering %>
-      <%= render "filters/menu/users", user_filtering: user_filtering %>
-      <%= render "filters/menu/places", user_filtering: user_filtering %>
-
-      <%= render "filters/menu/shortcut_notice" %>
-    <% end %>
-  </nav>
-<% end %>
+  <%= tag.dialog class: "fizzy-menu filter popup popup--animated panel margin-block-start-half",
+        data: {
+              action: "turbo:before-cache@document->dialog#close keydown->navigable-list#navigate filter:changed->navigable-list#reset toggle->filter#filter",
+              controller: "filter navigable-list",
+              dialog_target: "dialog",
+              navigable_list_focus_on_selection_value: false,
+              navigable_list_actionable_items_value: true } do %>
+    <%= turbo_frame_tag "my_menu", src: my_menu_path, target: "_top" %>
+  <% end %>
+</nav>

app/views/my/menus/show.html.erb

@@ -0,0 +1,31 @@
+<%= turbo_frame_tag "my_menu", target: "_top" do %>
+  <div class="flex gap">
+    <%= text_field_tag :search, nil,
+          type: "search",
+          role: "combobox",
+          placeholder: "Filter…",
+          class: "input input--transparent txt-small",
+          autofocus: true,
+          autocorrect: "off",
+          autocomplete: "off",
+          aria: { activedescendant: "" },
+          data: {
+                "1p-ignore": "true",
+                filter_target: "input",
+                navigable_list_target: "input",
+                action: "input->filter#filter" } %>
+    <button class="fizzy-menu__close btn borderless txt-small" data-action="dialog#close">
+      <%= icon_tag "close" %>
+      <span class="for-screen-reader">Close menu</span>
+    </button>
+  </div>
+
+  <%= render "filters/menu/hotkeys" %>
+  <%= render "filters/menu/custom", user_filtering: @user_filtering %>
+  <%= render "filters/menu/collections", user_filtering: @user_filtering %>
+  <%= render "filters/menu/tags", user_filtering: @user_filtering %>
+  <%= render "filters/menu/users", user_filtering: @user_filtering %>
+  <%= render "filters/menu/places", user_filtering: @user_filtering %>
+
+  <%= render "filters/menu/shortcut_notice" %>
+<% end %>

config/routes.rb

@@ -124,6 +124,7 @@ Rails.application.routes.draw do
   namespace :my do
     resources :pins
     resource :timezone
+    resource :menu
   end
 
   namespace :prompts do