feat: Add CFS filter to sidebar filters in explore route. (#3144)

* feat: Add CFS filter to sidebar filters in explore route.
Reference: #3098

* Optimize code block in routes.

* fix build.

* code refactor and datatype fix.

* Fix bool and string type conversion in if condition.

* Reimplement the code with string datatype and boolean only for query param.

* refine if condition in explore for cfs filter.

* refactor code statement for cfsVal and lowercase cfs options.

* code refactor

* remove comparision with null

Author: Anupam-dagar

app/components/explore/side-bar.js

@@ -13,8 +13,8 @@ export default Component.extend({
   customEndDate : null,
   showFilters   : false,
 
-  hideClearFilters: computed('category', 'sub_category', 'event_type', 'startDate', 'endDate', 'location', 'ticket_type', function() {
-    return !(this.category || this.sub_category || this.event_type || this.startDate || this.endDate || this.location || this.ticket_type !== null);
+  hideClearFilters: computed('category', 'sub_category', 'event_type', 'startDate', 'endDate', 'location', 'ticket_type', 'cfs', function() {
+    return !(this.category || this.sub_category || this.event_type || this.startDate || this.endDate || this.location || this.ticket_type || this.cfs);
   }),
 
   showAllCategories: computed('category', 'sub_category', function() {
@@ -61,6 +61,10 @@ export default Component.extend({
       this.send('selectDateFilter', 'custom_dates');
     },
 
+    selectEventCfs(cfs) {
+      this.set('cfs', cfs === this.cfs ? null : cfs);
+    },
+
     selectDateFilter(dateType) {
       let newStartDate = null;
       let newEndDate = null;
@@ -128,7 +132,6 @@ export default Component.extend({
     },
     clearFilterTypes() {
       this.set('event_type', null);
-
     },
 
     clearFilters() {
@@ -140,15 +143,13 @@ export default Component.extend({
         sub_category : null,
         event_type   : null,
         location     : null,
-        ticket_type  : null
+        ticket_type  : null,
+        cfs          : null
       });
-
-
     },
 
     toggleFilters() {
       this.set('showFilters', !this.showFilters);
-
     }
   }
 });

app/controllers/explore.js

@@ -1,14 +1,15 @@
 import Controller from '@ember/controller';
 
 export default Controller.extend({
-  queryParams  : ['category', 'sub_category', 'event_type', 'start_date', 'end_date', 'location', 'ticket_type'],
+  queryParams  : ['category', 'sub_category', 'event_type', 'start_date', 'end_date', 'location', 'ticket_type', 'cfs'],
   category     : null,
   sub_category : null,
   event_type   : null,
   start_date   : null,
   end_date     : null,
   location     : null,
   ticket_type  : null,
+  cfs          : null,
 
   actions: {
     shareEvent(event) {
@@ -37,6 +38,9 @@ export default Controller.extend({
       if (filterType === 'ticket_type') {
         this.set('ticket_type', null);
       }
+      if (filterType === 'cfs') {
+        this.set('cfs', null);
+      }
     }
   }
 });

app/routes/explore.js

@@ -76,6 +76,13 @@ export default Route.extend({
         val  : `%${params.location}%`
       });
     }
+    if (params.cfs) {
+      filterOptions.push({
+        name : 'is_sessions_speakers_enabled',
+        op   : 'eq',
+        val  : params.cfs === 'open'
+      });
+    }
 
     if (params.start_date && params.end_date) {
       filterOptions.push({

app/templates/components/explore/side-bar.hbs

@@ -124,6 +124,26 @@
     {{/ui-accordion}}
   </div>
 {{/if}}
+<div class="item">
+  {{#ui-accordion}}
+    <span class="title">
+      <i class="dropdown icon"></i>
+      {{t 'Event Call For Speakers' }}
+    </span>
+    <div class="content menu">
+      <a href="#"
+        class="link item {{if (eq cfs 'open') 'active'}}"
+        {{action 'selectEventCfs' 'open'}}>
+        {{t 'Open'}}
+      </a>
+      <a href="#"
+        class="link item {{if (eq cfs 'closed') 'active'}}"
+        {{action 'selectEventCfs' 'closed'}}>
+        {{t 'Closed'}}
+      </a>
+    </div>
+  {{/ui-accordion}}
+</div>
 <div class="item">
   <button class="ui red button {{if hideClearFilters 'disabled'}}" {{action 'clearFilters'}}>{{t 'Clear Filters'}}</button>
   {{#if device.isMobile}}

app/templates/explore.hbs

@@ -1,6 +1,6 @@
 <div class="ui stackable grid">
   <div class="four wide column">
-    {{explore/side-bar model=model category=category sub_category=sub_category event_type=event_type startDate=start_date endDate=end_date location=location ticket_type=ticket_type}}
+    {{explore/side-bar model=model category=category sub_category=sub_category event_type=event_type startDate=start_date endDate=end_date location=location ticket_type=ticket_type cfs=cfs}}
   </div>
   <div class="twelve wide column">
     <h1 class="ui header">{{t 'Events'}}</h1>
@@ -41,6 +41,12 @@
           <a role="button" {{action 'clearFilter' 'ticket_type'}}><i class="icon close"></i></a>
         </div>
       {{/if}}
+      {{#if filters.cfs}}
+        <div class="ui mini label">
+          {{filters.cfs}}
+          <a role="button" {{action 'clearFilter' 'cfs'}}><i class="icon close"></i></a>
+        </div>
+      {{/if}}
     </div>
     {{#each filteredEvents as |event|}}
       {{event-card event=event isWide=true filterByTags=true category=category subCategory=sub_category eventType=event_type shareEvent=(action 'shareEvent')}}