UX: replaces custom more menu by d-menu (#29090)

One of the big advantages is a nicer menu on mobile.

This commit also fixes a bug where the close modal action was called for any destroyed d-menu trigger, even if this specific menu was not expanding, which means it was closing a different modal than its own modal, given we can only have one modal at a time.

spec/system/page_objects/components/navigation_menu/sidebar.rb

@@ -34,14 +34,14 @@ module PageObjects
             I18n.t("js.sidebar.sections.community.edit_section.sidebar"),
           )
 
-          expect(community_section).to have_no_css(".sidebar-more-section-links-details")
+          expect(community_section).to have_no_css(".sidebar-more-section-content")
 
           PageObjects::Modals::SidebarSectionForm.new
         end
 
         def click_community_section_more_button
-          community_section.click_button(class: "sidebar-more-section-links-details-summary")
-          expect(community_section).to have_css(".sidebar-more-section-links-details")
+          community_section.click_button(class: "sidebar-more-section-trigger")
+          expect(community_section).to have_css(".sidebar-more-section-content")
           self
         end
 

spec/system/viewing_sidebar_spec.rb

@@ -61,6 +61,37 @@ describe "Viewing sidebar as logged in user", type: :system do
     end
   end
 
+  describe "when viewing the 'more' content in the Community sidebar section" do
+    let(:more_trigger_selector) do
+      ".sidebar-section[data-section-name='community'] .sidebar-more-section-trigger"
+    end
+    let(:more_links_selector) do
+      ".sidebar-section[data-section-name='community'] .sidebar-more-section-content"
+    end
+
+    it "toggles the more menu and handles click outside to close it" do
+      visit("/latest")
+
+      find(more_trigger_selector).click
+
+      expect(page).to have_selector(more_links_selector, visible: true)
+
+      expect(page).to have_selector("#{more_trigger_selector}[aria-expanded='true']")
+
+      find(more_trigger_selector).click
+
+      expect(page).not_to have_selector(more_links_selector)
+
+      expect(page).to have_selector("#{more_trigger_selector}[aria-expanded='false']")
+
+      find(more_trigger_selector).click
+
+      find(".d-header-wrap").click
+
+      expect(page).not_to have_selector(more_links_selector)
+    end
+  end
+
   describe "when viewing the tags section" do
     fab!(:tag1) do
       Fabricate(:tag, name: "tag 1", description: "tag 1 description <script>").tap do |tag|