Fix issue #187

Author: elfman

src/shared/components/challenge-listing/Filters/FiltersPanel/index.jsx

@@ -53,6 +53,17 @@ export default function FiltersPanel({
 
   const mapOps = item => ({ label: item, value: item });
 
+  let filterStateTags = null;
+  if (filterState.tags) {
+    filterStateTags = Array.isArray(filterState.tags) ? filterState.tags.join(',') :
+      Object.keys(filterState.tags).map(key => filterState.tags[key]).join(',');
+  }
+  let filterStateSubtracks = null;
+  if (filterState.subtracks) {
+    filterStateSubtracks = Array.isArray(filterState.subtracks) ? filterState.subtracks.join(',') :
+      Object.keys(filterState.subtracks).map(key => filterState.subtracks[key]).join(',');
+  }
+
   return (
     <div styleName={className}>
       <div styleName="header">
@@ -74,7 +85,7 @@ export default function FiltersPanel({
               }}
               options={validKeywords.map(mapOps)}
               simpleValue
-              value={filterState.tags ? filterState.tags.join(',') : null}
+              value={filterStateTags}
             />
           </div>
           <div styleName="filter community">
@@ -100,9 +111,7 @@ export default function FiltersPanel({
               }}
               options={validSubtracks.map(mapOps)}
               simpleValue
-              value={
-                filterState.subtracks ? filterState.subtracks.join(',') : null
-              }
+              value={filterStateSubtracks}
             />
           </div>
           <div styleName="filter dates">

src/shared/utils/challenge-listing/filter.js

@@ -113,7 +113,9 @@ function filterBySubtracks(challenge, state) {
    * it probably does not work in all cases. It should be double-checked,
    * why challenge subtracks in challenge objects are different from those
    * return from the API as the list of possible subtracks. */
-  const filterSubtracks = state.subtracks.map(item =>
+  const subtracks = Array.isArray(state.subtracks) ? state.subtracks :
+    Object.keys(state.subtracks).map(key => state.subtracks[key]);
+  const filterSubtracks = subtracks.map(item =>
     item.toLowerCase().replace(/ /g, ''));
   const challengeSubtrack = challenge.subTrack.toLowerCase().replace(/_/g, '');
   return filterSubtracks.includes(challengeSubtrack);
@@ -123,7 +125,9 @@ function filterByTags(challenge, state) {
   if (!state.tags) return true;
   const str = `${challenge.name} ${challenge.platforms} ${
     challenge.technologies}`.toLowerCase();
-  return state.tags.some(tag => str.includes(tag.toLowerCase()));
+  const tags = Array.isArray(state.tags) ? state.tags :
+    Object.keys(state.tags).map(key => state.tags[key]);
+  return tags.some(tag => str.includes(tag.toLowerCase()));
 }
 
 function filterByText(challenge, state) {