Merge pull request #595 from topcoder-platform/issue-141

changes for #141

Author: callmekatootie

client/src/components/editFiltersPopup/index.js

@@ -52,7 +52,7 @@ export default function EditFiltersPopup({ onCancel, onDone }) {
   );
   const [filterGroups, setFilterGroups] = useState(initialFilters);
   const [selectedFilters, setSelectedFilters] = useState(initialSelection);
-  const [sections, setSections] = useState(initialSections, initialSections);
+  const [sections, setSections] = useState(initialSections);
 
   const handleCancel = () => {
     if (onCancel) {
@@ -108,27 +108,32 @@ export default function EditFiltersPopup({ onCancel, onDone }) {
       if (index === -1) {
         setSelectedFilters([filter, ...selectedFilters]);
         setSearchFilters({
-          ...search.filters,
-          [filter]: { ...search.filters[filter], active: true },
+          ...searchFilters,
+          [filter]: { ...searchFilters[filter], active: true },
         });
       }
     } else {
       if (index !== -1) {
         setSelectedFilters(selectedFilters.filter((_, i) => i !== index));
         setSearchFilters({
-          ...search.filters,
-          [filter]: { ...search.filters[filter], active: false },
+          ...searchFilters,
+          [filter]: { ...searchFilters[filter], active: false },
         });
       }
     }
   };
 
   const handleSearch = (q) => {
     if (q.length === 0) {
-      setFilterGroups(initialFilters);
+      const [filteredSections, filteredGroups] = getInitialFilters(
+        searchFilters,
+        () => true
+      );
+      setSections(filteredSections);
+      setFilterGroups(filteredGroups);
     } else if (q.length >= 3) {
       const [filteredSections, filteredGroups] = getInitialFilters(
-        { ...search.filters },
+        searchFilters,
         (f) => {
           return f.text.toLowerCase().includes(q.toLowerCase());
         }
@@ -236,10 +241,10 @@ function PopupSection({ title, filters, onFilterValueChange }) {
     <>
       <PopupSectionTitle text={title} />
       <div className={styles.popupSectionBody}>
-        {filters.map((filter, index) => {
+        {filters.map((filter) => {
           return (
             <PopupSectionRow
-              key={index}
+              key={filter.id}
               text={filter.name}
               filterActivated={filter.isActive}
               id={filter.id}