DEV: Close search menu after advanced search is clicked (#26108)

app/assets/javascripts/discourse/app/components/search-menu.hbs

@@ -46,7 +46,9 @@
         {{#if this.search.activeGlobalSearchTerm}}
           <SearchMenu::ClearButton @clearSearch={{this.clearSearch}} />
         {{/if}}
-        <SearchMenu::AdvancedButton @href={{this.advancedSearchButtonHref}} />
+        <SearchMenu::AdvancedButton
+          @openAdvancedSearch={{this.openAdvancedSearch}}
+        />
       </div>
     {{/if}}
   </div>

app/assets/javascripts/discourse/app/components/search-menu.js

@@ -146,8 +146,10 @@ export default class SearchMenu extends Component {
     return getURL(url);
   }
 
-  get advancedSearchButtonHref() {
-    return this.fullSearchUrl({ expanded: true });
+  @action
+  openAdvancedSearch() {
+    this.fullSearch();
+    this.close();
   }
 
   get displayMenuPanelResults() {

app/assets/javascripts/discourse/app/components/search-menu/advanced-button.hbs

@@ -1,7 +1,6 @@
-<a
+<DButton
   class="show-advanced-search"
   title={{i18n "search.open_advanced"}}
-  href={{@href}}
->
-  {{d-icon "sliders-h"}}
-</a>
+  @action={{@openAdvancedSearch}}
+  @icon="sliders-h"
+/>

app/assets/javascripts/discourse/tests/acceptance/search-test.js

@@ -90,6 +90,10 @@ acceptance("Search - Anonymous", function (needs) {
       "it goes to full search page and preserves the search term"
     );
 
+    assert
+      .dom(".search-menu .search-menu-panel")
+      .doesNotExist("closes search menu after clicking advanced search button");
+
     assert.ok(
       exists(".search-advanced-options"),
       "advanced search is expanded"

app/assets/stylesheets/common/base/search-menu.scss

@@ -350,7 +350,7 @@ $search-pad-horizontal: 0.5em;
       margin-top: 2px;
     }
 
-    a.show-advanced-search,
+    .show-advanced-search,
     a.clear-search {
       padding: 0px 3px;
       display: inline-block;