Merge pull request #4527 from cpradio/category-selector

FIX: Advanced Search to utilize Category Selector so it can distingui…

app/assets/javascripts/discourse/components/search-advanced-options.js.es6

@@ -60,7 +60,7 @@ export default Em.Component.extend({
     this.setProperties({
       searchedTerms: {
         username: '',
-        category: null,
+        category: '',
         group: [],
         badge: [],
         tags: [],
@@ -167,21 +167,21 @@ export default Em.Component.extend({
         const userInput = Discourse.Category.findBySlug(subcategories[1], subcategories[0]);
         if ((!existingInput && userInput)
           || (existingInput && userInput && existingInput.id !== userInput.id))
-          this.set('searchedTerms.category', userInput.id);
+          this.set('searchedTerms.category', [userInput]);
       } else
       if (isNaN(subcategories)) {
         const userInput = Discourse.Category.findSingleBySlug(subcategories[0]);
         if ((!existingInput && userInput)
           || (existingInput && userInput && existingInput.id !== userInput.id))
-          this.set('searchedTerms.category', userInput.id);
+          this.set('searchedTerms.category', [userInput]);
       } else {
         const userInput = Discourse.Category.findById(subcategories[0]);
         if ((!existingInput && userInput)
           || (existingInput && userInput && existingInput.id !== userInput.id))
-          this.set('searchedTerms.category', userInput.id);
+          this.set('searchedTerms.category', [userInput]);
       }
     } else
-      this.set('searchedTerms.category', null);
+      this.set('searchedTerms.category', '');
   },
 
   setSearchedTermValueForGroup() {
@@ -278,16 +278,16 @@ export default Em.Component.extend({
   @observes('searchedTerms.category')
   updateSearchTermForCategory() {
     const match = this.filterBlocks(REGEXP_CATEGORY_PREFIX);
-    const categoryFilter = Discourse.Category.findById(this.get('searchedTerms.category'));
+    const categoryFilter = this.get('searchedTerms.category');
     let searchTerm = this.get('searchTerm') || '';
 
     const slugCategoryMatches = (match.length !== 0) ? match[0].match(REGEXP_CATEGORY_SLUG) : null;
     const idCategoryMatches = (match.length !== 0) ? match[0].match(REGEXP_CATEGORY_ID) : null;
-    if (categoryFilter && categoryFilter.length !== 0) {
+    if (categoryFilter && categoryFilter[0]) {
-      const id = categoryFilter.id;
+      const id = categoryFilter[0].id;
-      const slug = categoryFilter.slug;
+      const slug = categoryFilter[0].slug;
-      if (categoryFilter && categoryFilter.parentCategory) {
+      if (categoryFilter[0].parentCategory) {
-        const parentSlug = categoryFilter.parentCategory.slug;
+        const parentSlug = categoryFilter[0].parentCategory.slug;
         if (slugCategoryMatches)
           searchTerm = searchTerm.replace(slugCategoryMatches[0], `#${parentSlug}:${slug}`);
         else if (idCategoryMatches)
@@ -296,7 +296,7 @@ export default Em.Component.extend({
           searchTerm += ` #${parentSlug}:${slug}`;
 
         this.set('searchTerm', searchTerm.trim());
-      } else if (categoryFilter) {
+      } else {
         if (slugCategoryMatches)
           searchTerm = searchTerm.replace(slugCategoryMatches[0], `#${slug}`);
         else if (idCategoryMatches)

app/assets/javascripts/discourse/templates/components/search-advanced-options.hbs

@@ -13,7 +13,7 @@
   <div class="control-group pull-left">
     <label class="control-label" for="search-in-category">{{i18n "search.advanced.in_category.label"}}</label>
     <div class="controls">
-      {{category-chooser value=searchedTerms.category}}
+      {{category-selector categories=searchedTerms.category single="true"}}
     </div>
   </div>
 </div>

test/javascripts/acceptance/search-full-test.js.es6

@@ -76,7 +76,7 @@ test("validate population of advanced search", assert => {
 
   andThen(() => {
     assert.ok(exists('.search-advanced-options span:contains("admin")'), 'has "admin" pre-populated');
-    assert.ok(exists('.search-advanced-options .category-combobox .select2-choice .select2-chosen:contains("bug")'), 'has "bug" pre-populated');
+    assert.ok(exists('.search-advanced-options .badge-category:contains("bug")'), 'has "bug" pre-populated');
     //assert.ok(exists('.search-advanced-options span:contains("moderators")'), 'has "moderators" pre-populated');
     //assert.ok(exists('.search-advanced-options span:contains("Reader")'), 'has "Reader" pre-populated');
     assert.ok(exists('.search-advanced-options .tag-chooser .tag-monkey'), 'has "monkey" pre-populated');
@@ -118,11 +118,13 @@ test("update category through advanced search ui", assert => {
   visit("/search");
   fillIn('.search input.full-page-search', 'none');
   click('.search-advanced-btn');
-  selectDropdown('.search-advanced-options .category-combobox', 4);
+  fillIn('.search-advanced-options .category-selector', 'faq');
-  click('.search-advanced-options'); // need to click off the combobox for the search-term to get updated
+  click('.search-advanced-options .category-selector');
+  keyEvent('.search-advanced-options .category-selector', 'keydown', 8);
+  keyEvent('.search-advanced-options .category-selector', 'keydown', 9);
 
   andThen(() => {
-    assert.ok(exists('.search-advanced-options .category-combobox .select2-choice .select2-chosen:contains("faq")'), 'has "faq" populated');
+    assert.ok(exists('.search-advanced-options .badge-category:contains("faq")'), 'has "faq" populated');
     assert.equal(find('.search input.full-page-search').val(), "none #faq", 'has updated search term to "none #faq"');
   });
 });