Fix regex special character filter match bug and revert Query Editor autocomplete filter

ui/src/alerts/components/AlertsTable.js

@@ -34,15 +34,16 @@ const AlertsTable = React.createClass({
 
   filterAlerts(searchTerm, newAlerts) {
     const alerts = newAlerts || this.props.alerts
+    const filterText = searchTerm.toLowerCase()
     const filteredAlerts = alerts.filter(h => {
       if (h.host === null || h.name === null || h.level === null) {
         return false
       }
 
       return (
-        h.name.toLowerCase().search(searchTerm.toLowerCase()) !== -1 ||
-        h.host.toLowerCase().search(searchTerm.toLowerCase()) !== -1 ||
-        h.level.toLowerCase().search(searchTerm.toLowerCase()) !== -1
+        h.name.toLowerCase().includes(filterText) ||
+        h.host.toLowerCase().includes(filterText) ||
+        h.level.toLowerCase().includes(filterText)
       )
     })
     this.setState({searchTerm, filteredAlerts})

ui/src/data_explorer/components/MeasurementList.js

@@ -115,8 +115,9 @@ const MeasurementList = React.createClass({
       )
     }
 
+    const filterText = this.state.filterText.toLowerCase()
     const measurements = this.state.measurements.filter(m =>
-      m.match(this.state.filterText)
+      m.toLowerCase().includes(filterText)
     )
 
     return (

ui/src/data_explorer/components/QueryEditor.js

@@ -162,9 +162,12 @@ class QueryEditor extends Component {
     if (matched && !_.isEmpty(templates)) {
       // maintain cursor poition
       const start = this.editor.selectionStart
+
       const end = this.editor.selectionEnd
+      const filterText = matched[0].substr(1).toLowerCase()
+
       const filteredTemplates = templates.filter(t =>
-        t.tempVar.startsWith(matched[0])
+        t.tempVar.toLowerCase().includes(filterText)
       )
 
       const found = filteredTemplates.find(

ui/src/data_explorer/components/TagListItem.js

@@ -52,7 +52,8 @@ const TagListItem = React.createClass({
       return <div>no tag values</div>
     }
 
-    const filtered = tagValues.filter(v => v.match(this.state.filterText))
+    const filterText = this.state.filterText.toLowerCase()
+    const filtered = tagValues.filter(v => v.toLowerCase().includes(filterText))
 
     return (
       <div className="query-builder--sub-list">

ui/src/hosts/components/HostsTable.js

@@ -35,20 +35,21 @@ const HostsTable = React.createClass({
   },
 
   filter(allHosts, searchTerm) {
+    const filterText = searchTerm.toLowerCase()
     return allHosts.filter(h => {
       const apps = h.apps ? h.apps.join(', ') : ''
       // search each tag for the presence of the search term
       let tagResult = false
       if (h.tags) {
         tagResult = Object.keys(h.tags).reduce((acc, key) => {
-          return acc || h.tags[key].search(searchTerm) !== -1
+          return acc || h.tags[key].toLowerCase().includes(filterText)
         }, false)
       } else {
         tagResult = false
       }
       return (
-        h.name.search(searchTerm) !== -1 ||
-        apps.search(searchTerm) !== -1 ||
+        h.name.toLowerCase().includes(filterText) ||
+        apps.toLowerCase().includes(filterText) ||
         tagResult
       )
     })

ui/src/shared/components/Dropdown.js

@@ -120,11 +120,11 @@ class Dropdown extends Component {
 
   applyFilter(searchTerm) {
     const {items} = this.props
-    const matchingItems = items.filter(item => {
-      if (item.text === null) {
-        return false
-      }
-      return item.text.toLowerCase().search(searchTerm.toLowerCase()) !== -1
+    const filterText = searchTerm.toLowerCase()
+    const matchingItems = items.filter(item =>
+      item.text.toLowerCase().includes(filterText)
+    )
+
     })
     this.setState({filteredItems: matchingItems})
     this.setState({highlightedItemIndex: 0})