UX: show a message when more than 30 site settings matches the current filter

UX: show the counts when displaying only overridden settings
UX: show 30+ count when more than 30 site settings matches the current filter

app/assets/javascripts/admin/controllers/admin-site-settings-category.js.es6

@@ -1,16 +1,16 @@
+import computed from "ember-addons/ember-computed-decorators";
+
 export default Ember.Controller.extend({
   categoryNameKey: null,
   adminSiteSettings: Ember.inject.controller(),
 
-  filteredContent: function() {
+  @computed("adminSiteSettings.model", "categoryNameKey")
-    if (!this.get('categoryNameKey')) { return []; }
+  category(categories, nameKey) {
+    return (categories || []).findBy("nameKey", nameKey);
+  },
 
-    const category = (this.get('adminSiteSettings.model') || []).findBy('nameKey', this.get('categoryNameKey'));
+  @computed("category")
-    if (category) {
+  filteredContent(category) {
-      return category.siteSettings;
+    return category ? category.siteSettings : [];
-    } else {
-      return [];
   }
-  }.property('adminSiteSettings.model', 'categoryNameKey')
-
 });

app/assets/javascripts/admin/controllers/admin-site-settings.js.es6

@@ -3,7 +3,6 @@ import debounce from 'discourse/lib/debounce';
 export default Ember.Controller.extend({
   filter: null,
   onlyOverridden: false,
-  filtered: Ember.computed.notEmpty('filter'),
 
   filterContentNow(category) {
     // If we have no content, don't bother filtering anything
@@ -14,9 +13,9 @@ export default Ember.Controller.extend({
       filter = this.get('filter').toLowerCase();
     }
 
-    if ((filter === undefined || filter.length < 1) && !this.get('onlyOverridden')) {
+    if ((!filter || 0 === filter.length) && !this.get('onlyOverridden')) {
       this.set('model', this.get('allSiteSettings'));
-      this.transitionToRoute("adminSiteSettings");
+      this.transitionToRoute('adminSiteSettings');
       return;
     }
 
@@ -28,11 +27,11 @@ export default Ember.Controller.extend({
       const siteSettings = settingsCategory.siteSettings.filter(item => {
         if (this.get('onlyOverridden') && !item.get('overridden')) return false;
         if (filter) {
-          if (item.get('setting').toLowerCase().indexOf(filter) > -1) return true;
+          const setting = item.get('setting').toLowerCase();
-          if (item.get('setting').toLowerCase().replace(/_/g, ' ').indexOf(filter) > -1) return true;
+          return setting.includes(filter) ||
-          if (item.get('description').toLowerCase().indexOf(filter) > -1) return true;
+                 setting.replace(/_/g, ' ').includes(filter) ||
-          if ((item.get('value') || '').toLowerCase().indexOf(filter) > -1) return true;
+                 item.get('description').toLowerCase().includes(filter) ||
-          return false;
+                 (item.get('value') || '').toLowerCase().includes(filter);
         } else {
           return true;
         }
@@ -49,15 +48,16 @@ export default Ember.Controller.extend({
     });
 
     all.siteSettings.pushObjects(matches.slice(0, 30));
-    all.count = matches.length;
+    all.hasMore = matches.length > 30;
+    all.count = all.hasMore ? '30+' : matches.length;
 
     this.set('model', matchesGroupedByCategory);
-    this.transitionToRoute("adminSiteSettingsCategory", category || "all_results");
+    this.transitionToRoute('adminSiteSettingsCategory', category || 'all_results');
   },
 
   filterContent: debounce(function() {
-    if (this.get("_skipBounce")) {
+    if (this.get('_skipBounce')) {
-      this.set("_skipBounce", false);
+      this.set('_skipBounce', false);
     } else {
       this.filterContentNow();
     }

app/assets/javascripts/admin/templates/site-settings-category.hbs

@@ -3,6 +3,9 @@
     {{#each filteredContent as |setting|}}
       {{site-setting setting=setting}}
     {{/each}}
+    {{#if category.hasMore}}
+      <p class="warning">{{i18n 'admin.site_settings.more_than_30_results'}}</p>
+    {{/if}}
   {{/d-section}}
 {{else}}
   <br/>

app/assets/javascripts/admin/templates/site-settings.hbs

@@ -18,9 +18,7 @@
       <li class="{{category.nameKey}}">
         {{#link-to 'adminSiteSettingsCategory' category.nameKey class=category.nameKey}}
           {{category.name}}
-          {{#if filtered}}
           {{#if category.count}}<span class="count">({{category.count}})</span>{{/if}}
-          {{/if}}
         {{/link-to}}
       </li>
     {{/each}}

app/assets/stylesheets/common/admin/admin_base.scss

@@ -578,6 +578,10 @@ $mobile-breakpoint: 700px;
       background-color: $highlight-medium;
     }
   }
+
+  .warning {
+    color: $danger;
+  }
 }
 
 section.details {

config/locales/client.en.yml

@@ -3749,6 +3749,7 @@ en:
       site_settings:
         title: 'Settings'
         no_results: "No results found."
+        more_than_30_results: "There are more than 30 results. Please refine your search or select a category."
         clear_filter: "Clear"
         add_url: "add URL"
         add_host: "add host"