Fixed: Custom Filter improvements

frontend/src/Components/Filter/Builder/FilterBuilderRowValueConnector.js

@@ -3,16 +3,21 @@ import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 import sortByName from 'Utilities/Array/sortByName';
 import { filterBuilderTypes } from 'Helpers/Props';
+import * as filterTypes from 'Helpers/Props/filterTypes';
 import FilterBuilderRowValue from './FilterBuilderRowValue';
 
 function createTagListSelector() {
   return createSelector(
+    (state, { filterType }) => filterType,
     (state, { sectionItems }) => sectionItems,
     (state, { selectedFilterBuilderProp }) => selectedFilterBuilderProp,
-    (sectionItems, selectedFilterBuilderProp) => {
+    (filterType, sectionItems, selectedFilterBuilderProp) => {
       if (
-        selectedFilterBuilderProp.type === filterBuilderTypes.NUMBER ||
+        (selectedFilterBuilderProp.type === filterBuilderTypes.NUMBER ||
-        selectedFilterBuilderProp.type === filterBuilderTypes.STRING
+        selectedFilterBuilderProp.type === filterBuilderTypes.STRING) &&
+        filterType !== filterTypes.EQUAL &&
+        filterType !== filterBuilderTypes.NOT_EQUAL ||
+        !selectedFilterBuilderProp.optionsSelector
       ) {
         return [];
       }

frontend/src/Components/Filter/Builder/FilterBuilderRowValueTag.css

@@ -1,4 +1,6 @@
 .tag {
+  height: 21px;
+
   &.isLastTag {
     .or {
       display: none;

frontend/src/Components/Filter/CustomFilters/CustomFiltersModalContent.js

@@ -29,10 +29,10 @@ function CustomFiltersModalContent(props) {
 
       <ModalBody>
         {
-          customFilters.map((customFilter, index) => {
+          customFilters.map((customFilter) => {
             return (
               <CustomFilter
-                key={index}
+                key={customFilter.id}
                 id={customFilter.id}
                 label={customFilter.label}
                 filters={customFilter.filters}

frontend/src/Components/Form/AutoSuggestInput.css

@@ -37,6 +37,7 @@
 .suggestionsList {
   margin: 5px 0;
   padding-left: 0;
+  max-height: 200px;
   list-style-type: none;
 }
 

frontend/src/Components/Form/TagInput.css

@@ -14,10 +14,11 @@
 
 .internalInput {
   flex: 1 1 0%;
+  margin-top: -6px;
   margin-left: 3px;
   min-width: 20%;
   max-width: 100%;
   width: 0%;
-  height: 21px;
+  height: 31px;
   border: none;
 }

frontend/src/Components/Form/TagInputInput.css

@@ -6,5 +6,6 @@
   display: flex;
   flex-wrap: wrap;
   padding: 6px 16px;
+  height: 33px;
   cursor: default;
 }