DEV: Soft load topic results after closing then opening search menu (#25504)

# Context

Meta report: https://meta.discourse.org/t/dropdown-search-box-results-now-cleared-after-clicking-on-1-result/291240/1

# Demo

https://github.com/discourse/discourse/assets/50783505/3b258b2c-b346-4c81-a7b9-0c1bb6bd4b28

# Plugin Test Fix
- https://github.com/discourse/discourse-encrypt/pull/304

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

@@ -55,7 +55,6 @@
     <SearchMenu::Results
       @loading={{this.loading}}
       @noResults={{this.noResults}}
-      @results={{this.results}}
       @invalidTerm={{this.invalidTerm}}
       @suggestionKeyword={{this.suggestionKeyword}}
       @suggestionResults={{this.suggestionResults}}
@@ -72,7 +71,6 @@
       <SearchMenu::Results
         @loading={{this.loading}}
         @noResults={{this.noResults}}
-        @results={{this.results}}
         @invalidTerm={{this.invalidTerm}}
         @suggestionKeyword={{this.suggestionKeyword}}
         @suggestionResults={{this.suggestionResults}}

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

@@ -36,7 +36,6 @@ export default class SearchMenu extends Component {
   @service appEvents;
 
   @tracked loading = false;
-  @tracked results = {};
   @tracked noResults = false;
   @tracked
   inPMInboxContext = this.search.searchContext?.type === "private_messages";
@@ -93,7 +92,10 @@ export default class SearchMenu extends Component {
   }
 
   get includesTopics() {
-    return this.typeFilter !== DEFAULT_TYPE_FILTER;
+    return (
+      !!this.search.results?.topics?.length ||
+      this.typeFilter !== DEFAULT_TYPE_FILTER
+    );
   }
 
   get searchContext() {
@@ -214,7 +216,7 @@ export default class SearchMenu extends Component {
     const matchSuggestions = this.matchesSuggestions();
     if (matchSuggestions) {
       this.noResults = true;
-      this.results = {};
+      this.search.results = {};
       this.loading = false;
       this.suggestionResults = [];
 
@@ -265,14 +267,14 @@ export default class SearchMenu extends Component {
 
     if (!this.search.activeGlobalSearchTerm) {
       this.noResults = false;
-      this.results = {};
+      this.search.results = {};
       this.loading = false;
       this.invalidTerm = false;
     } else if (
       !isValidSearchTerm(this.search.activeGlobalSearchTerm, this.siteSettings)
     ) {
       this.noResults = true;
-      this.results = {};
+      this.search.results = {};
       this.loading = false;
       this.invalidTerm = true;
     } else {
@@ -297,7 +299,7 @@ export default class SearchMenu extends Component {
             }
 
             this.noResults = results.resultTypes.length === 0;
-            this.results = results;
+            this.search.results = results;
           }
         })
         .catch(popupAjaxError)

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

@@ -37,7 +37,7 @@ export default class Results extends Component {
 
   get resultTypesWithComponent() {
     let content = [];
-    this.args.results.resultTypes?.map((resultType) => {
+    this.search.results.resultTypes?.map((resultType) => {
       content.push({
         ...resultType,
         component: SEARCH_RESULTS_COMPONENT_TYPE[resultType.componentName],

app/assets/javascripts/discourse/app/services/search.js

@@ -13,6 +13,7 @@ export default class Search extends Service {
   @tracked highlightTerm;
   @tracked inTopicContext = false;
   @tracked visible = false;
+  @tracked results = {};
 
   // only relative for the widget search menu
   searchContextEnabled = false; // checkbox to scope search

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

@@ -440,7 +440,16 @@ acceptance("Search - Glimmer - Authenticated", function (needs) {
 
   needs.pretender((server, helper) => {
     server.get("/search/query", (request) => {
-      if (request.queryParams.term.includes("empty")) {
+      if (request.queryParams.type_filter === DEFAULT_TYPE_FILTER) {
+        // posts/topics are not present in the payload by default
+        return helper.response({
+          users: searchFixtures["search/query"]["users"],
+          categories: searchFixtures["search/query"]["categories"],
+          groups: searchFixtures["search/query"]["groups"],
+          grouped_search_result:
+            searchFixtures["search/query"]["grouped_search_result"],
+        });
+      } else if (request.queryParams.term.includes("empty")) {
         return helper.response({
           posts: [],
           users: [],
@@ -464,9 +473,9 @@ acceptance("Search - Glimmer - Authenticated", function (needs) {
             group_ids: [],
           },
         });
+      } else {
+        return helper.response(searchFixtures["search/query"]);
       }
-
-      return helper.response(searchFixtures["search/query"]);
     });
 
     server.get("/inline-onebox", () =>
@@ -736,6 +745,20 @@ acceptance("Search - Glimmer - with tagging enabled", function (needs) {
   needs.user();
   needs.settings({ tagging_enabled: true });
   needs.pretender((server, helper) => {
+    server.get("/search/query", (request) => {
+      if (request.queryParams.type_filter === DEFAULT_TYPE_FILTER) {
+        // posts/topics are not present in the payload by default
+        return helper.response({
+          users: searchFixtures["search/query"]["users"],
+          categories: searchFixtures["search/query"]["categories"],
+          groups: searchFixtures["search/query"]["groups"],
+          grouped_search_result:
+            searchFixtures["search/query"]["grouped_search_result"],
+        });
+      }
+      return helper.response(searchFixtures["search/query"]);
+    });
+
     server.get("/tag/dev/notifications", () => {
       return helper.response({
         tag_notification: { id: "dev", notification_level: 2 },
@@ -903,6 +926,9 @@ acceptance("Search - Glimmer - with tagging enabled", function (needs) {
 acceptance("Search - Glimmer - assistant", function (needs) {
   needs.user();
   needs.pretender((server, helper) => {
+    server.get("/t/2179.json", () => {
+      return helper.response({});
+    });
     server.get("/search/query", (request) => {
       if (request.queryParams["search_context[type]"] === "private_messages") {
         // return only one result for PM search
@@ -1185,4 +1211,18 @@ acceptance("Search - Glimmer - assistant", function (needs) {
       `sam #${firstCategoryName}`
     );
   });
+
+  test("topic results - soft loads the topic results after closing then  search menu", async function (assert) {
+    await visit("/");
+    await click("#search-button");
+    await fillIn("#search-term", "Development mode");
+
+    // navigate to topic and close search menu
+    const firstTopicResult = ".search-menu .results .search-result-topic a";
+    await click(firstTopicResult);
+
+    // reopen search menu and previous search results are present
+    await click("#search-button");
+    assert.dom(firstTopicResult).exists();
+  });
 });

app/assets/javascripts/discourse/tests/integration/components/search-menu-test.gjs

@@ -1,7 +1,11 @@
 import { click, fillIn, render, triggerKeyEvent } from "@ember/test-helpers";
 import { module, test } from "qunit";
-import SearchMenu from "discourse/components/search-menu";
+import SearchMenu, {
+  DEFAULT_TYPE_FILTER,
+} from "discourse/components/search-menu";
+import searchFixtures from "discourse/tests/fixtures/search-fixtures";
 import { setupRenderingTest } from "discourse/tests/helpers/component-test";
+import pretender, { response } from "discourse/tests/helpers/create-pretender";
 import { exists, query } from "discourse/tests/helpers/qunit-helpers";
 import I18n from "discourse-i18n";
 
@@ -12,6 +16,20 @@ module("Integration | Component | search-menu", function (hooks) {
   setupRenderingTest(hooks);
 
   test("rendering standalone", async function (assert) {
+    pretender.get("/search/query", (request) => {
+      if (request.queryParams.type_filter === DEFAULT_TYPE_FILTER) {
+        // posts/topics are not present in the payload by default
+        return response({
+          users: searchFixtures["search/query"]["users"],
+          categories: searchFixtures["search/query"]["categories"],
+          groups: searchFixtures["search/query"]["groups"],
+          grouped_search_result:
+            searchFixtures["search/query"]["grouped_search_result"],
+        });
+      }
+      return response(searchFixtures["search/query"]);
+    });
+
     await render(<template><SearchMenu /></template>);
 
     assert.ok(