FEATURE: Add search to user bookmark list (#10230)

User bookmarks can now be searched by name or post raw content. The q querystring param is hooked up from the Ember router as well.

app/assets/javascripts/discourse/app/controllers/user-activity-bookmarks.js

@@ -14,6 +14,10 @@ export default Controller.extend({
   content: null,
   loading: false,
   noResultsHelp: null,
+  searchTerm: null,
+  q: null,
+
+  queryParams: ["q"],
 
   loadItems() {
     this.setProperties({
@@ -22,8 +26,12 @@ export default Controller.extend({
       noResultsHelp: null
     });
 
+    if (this.q && !this.searchTerm) {
+      this.set("searchTerm", this.q);
+    }
+
     return this.model
-      .loadItems()
+      .loadItems({ q: this.searchTerm })
       .then(response => this._processLoadResponse(response))
       .catch(() => this._bookmarksListDenied())
       .finally(() =>
@@ -43,6 +51,12 @@ export default Controller.extend({
     this.content.removeObject(bookmark);
   },
 
+  @action
+  search() {
+    this.set("q", this.searchTerm);
+    this.loadItems();
+  },
+
   @action
   removeBookmark(bookmark) {
     const deleteBookmark = () => {
@@ -86,7 +100,7 @@ export default Controller.extend({
     this.set("loadingMore", true);
 
     return this.model
-      .loadMore()
+      .loadMore({ q: this.searchTerm })
       .then(response => this._processLoadResponse(response))
       .catch(() => this._bookmarksListDenied())
       .finally(() => this.set("loadingMore", false));

app/assets/javascripts/discourse/app/models/bookmark.js

@@ -120,11 +120,17 @@ const Bookmark = RestModel.extend({
     ).capitalize();
   },
 
-  loadItems() {
-    return ajax(`/u/${this.user.username}/bookmarks.json`, { cache: "false" });
+  loadItems(params) {
+    let url = `/u/${this.user.username}/bookmarks.json`;
+
+    if (params) {
+      url += "?" + $.param(params);
+    }
+
+    return ajax(url, { cache: "false" });
   },
 
-  loadMore() {
+  loadMore(additionalParams) {
     if (!this.more_bookmarks_url) {
       return Promise.resolve();
     }
@@ -136,7 +142,15 @@ const Bookmark = RestModel.extend({
       if (params) {
         moreUrl += "?" + params;
       }
+      if (additionalParams) {
+        if (moreUrl.includes("?")) {
+          moreUrl += "&" + $.param(additionalParams);
+        } else {
+          moreUrl += "?" + $.param(additionalParams);
+        }
+      }
     }
+
     return ajax({ url: moreUrl });
   },
 

app/assets/javascripts/discourse/app/routes/user-activity-bookmarks-with-reminders.js

@@ -1,6 +1,10 @@
 import DiscourseRoute from "discourse/routes/discourse";
 
 export default DiscourseRoute.extend({
+  queryParams: {
+    q: { replace: true }
+  },
+
   redirect() {
     this.transitionTo("userActivity.bookmarks");
   }

app/assets/javascripts/discourse/app/templates/user/bookmarks.hbs

@@ -1,3 +1,15 @@
+<div class="form-horizontal" style="margin-bottom: 1em">
+  {{input type="text"
+          value=searchTerm
+          placeholder=(i18n "bookmarks.search_placeholder")
+          enter=(action "search")
+          id="bookmark-search" autocomplete="discourse"}}
+  {{d-button
+      class="btn-primary"
+      action=(action "search")
+      type="button"
+      label="bookmarks.search"}}
+</div>
 {{#if noContent}}
   <div class="alert alert-info">{{noResultsHelp}}</div>
 {{else}}