FIX: Make permalink search work even when there're 100+ permalinks (#31354)

Permalink search regressed in
https://github.com/discourse/discourse/pull/30633 where the search
implementation was changed from server side to client side. Prior to
that change, we included a `filter` param in the request to make the
server find permalinks that matched the given filter and return the
results limited to 100 records. However, with that change, we stopped
sending the `filter` param with the request, which made the server
always return the same 100 records which would then be filtered on the
client side. That means if a site has more than 100 records, any records
that don't make it in the first 100 will never be found using search.

Meta topic:
https://meta.discourse.org/t/permalinks-no-longer-has-a-way-to-search-or-show-all-permalinks/351922?u=osama

app/assets/javascripts/admin/addon/components/admin-permalink-form.gjs

@@ -87,9 +87,7 @@ export default class AdminFlagsForm extends Component {
         permalink_type: data.permalinkType,
         permalink_type_value: this.valueForPermalinkType(data),
       });
-      this.adminPermalinks.model.allLinks.unshift(
-        Permalink.create(result.payload)
-      );
+      this.adminPermalinks.model.unshift(Permalink.create(result.payload));
       this.router.transitionTo("adminPermalinks");
     } catch (error) {
       popupAjaxError(error);
@@ -108,12 +106,10 @@ export default class AdminFlagsForm extends Component {
           permalink_type_value: this.valueForPermalinkType(data),
         }
       );
-      const index = this.adminPermalinks.model.allLinks.findIndex(
+      const index = this.adminPermalinks.model.findIndex(
         (permalink) => permalink.id === this.args.permalink.id
       );
-      this.adminPermalinks.model.allLinks[index] = Permalink.create(
-        result.payload
-      );
+      this.adminPermalinks.model[index] = Permalink.create(result.payload);
       this.router.transitionTo("adminPermalinks");
     } catch (error) {
       popupAjaxError(error);

app/assets/javascripts/admin/addon/controllers/admin-permalinks-index.js

@@ -49,7 +49,7 @@ export default class AdminPermalinksIndexController extends Controller {
       didConfirm: async () => {
         try {
           await this.store.destroyRecord("permalink", permalink);
-          this.model.allLinks.removeObject(permalink);
+          this.model.removeObject(permalink);
         } catch {
           this.dialog.alert(i18n("generic_error"));
         }

app/assets/javascripts/admin/addon/models/permalink.js

@@ -5,18 +5,9 @@ import Category from "discourse/models/category";
 import RestModel from "discourse/models/rest";
 
 export default class Permalink extends RestModel {
-  static findAll(filter) {
-    return ajax("/admin/permalinks.json").then(function (permalinks) {
-      let allLinks = permalinks.map((p) => Permalink.create(p));
-
-      let filteredLinks = filter
-        ? allLinks.filter(
-            (p) => p.url.includes(filter) || p.external_url?.includes(filter)
-          )
-        : allLinks;
-
-      return { allLinks, filteredLinks };
-    });
+  static async findAll(filter) {
+    const data = await ajax("/admin/permalinks.json", { data: { filter } });
+    return data.map((p) => Permalink.create(p));
   }
 
   @discourseComputed("category_id")

app/assets/javascripts/admin/addon/routes/admin-permalinks-index.js

@@ -0,0 +1,8 @@
+import DiscourseRoute from "discourse/routes/discourse";
+
+export default class AdminPermalinksIndexRoute extends DiscourseRoute {
+  setupController(controller, model) {
+    super.setupController(...arguments);
+    controller.set("hasPermalinks", model.length > 0);
+  }
+}

app/assets/javascripts/admin/addon/templates/permalinks-index.hbs

@@ -1,5 +1,5 @@
 <ConditionalLoadingSpinner @condition={{this.loading}}>
-  {{#if this.model.allLinks.length}}
+  {{#if this.hasPermalinks}}
     <div class="d-admin-filter">
       <div class="admin-filter__input-container permalink-search">
         <TextField
@@ -14,14 +14,14 @@
   {{/if}}
 
   <div class="permalink-results">
-    {{#if this.model.filteredLinks.length}}
+    {{#if this.model.length}}
       <table class="d-admin-table permalinks">
         <thead>
           <th>{{i18n "admin.permalink.url"}}</th>
           <th>{{i18n "admin.permalink.destination"}}</th>
         </thead>
         <tbody>
-          {{#each this.model.filteredLinks as |pl|}}
+          {{#each this.model as |pl|}}
             <tr
               class={{concat-class
                 "admin-permalink-item d-admin-row__content"

app/assets/javascripts/discourse/tests/acceptance/admin-permalink-test.js

@@ -26,14 +26,18 @@ acceptance("Admin - Permalinks", function (needs) {
 
   needs.user();
   needs.pretender((server, helper) => {
-    server.get("/admin/permalinks.json", () => {
-      return helper.response(200, startingData);
+    server.get("/admin/permalinks.json", (request) => {
+      const filter = request.queryParams.filter;
+      const result = filter && filter !== "feature" ? [] : startingData;
+
+      return helper.response(200, result);
     });
   });
 
   test("search permalinks with result", async function (assert) {
     await visit("/admin/config/permalinks");
     await fillIn(".permalink-search input", "feature");
+
     assert
       .dom(".permalink-results span[title='c/feature/announcements']")
       .exists("permalink is found after search");