Escaping regex characters

[aai/sparky-fe.git] / src / generic-components / autoCompleteSearchBar / AutoCompleteSearchBar.jsx

diff --git a/src/generic-components/autoCompleteSearchBar/AutoCompleteSearchBar.jsx b/src/generic-components/autoCompleteSearchBar/AutoCompleteSearchBar.jsx
index 4dddcbe..47cdc9a 100644 (file)
--- a/src/generic-components/autoCompleteSearchBar/AutoCompleteSearchBar.jsx
+++ b/src/generic-components/autoCompleteSearchBar/AutoCompleteSearchBar.jsx
@@ -1,29 +1,25 @@
 /*
- * ============LICENSE_START===================================================
- * SPARKY (AAI UI service)
- * ============================================================================
- * Copyright © 2017 AT&T Intellectual Property.
- * Copyright © 2017 Amdocs
- * All rights reserved.
- * ============================================================================
+ * ============LICENSE_START=======================================================
+ * org.onap.aai
+ * ================================================================================
+ * Copyright © 2017-2018 AT&T Intellectual Property. All rights reserved.
+ * Copyright © 2017-2018 Amdocs
+ * ================================================================================
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
  *
- *      http://www.apache.org/licenses/LICENSE-2.0
+ *       http://www.apache.org/licenses/LICENSE-2.0
  *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
- * ============LICENSE_END=====================================================
- *
- * ECOMP and OpenECOMP are trademarks
- * and service marks of AT&T Intellectual Property.
+ * ============LICENSE_END=========================================================
  */
-
 import React, {Component} from 'react';
+import { PropTypes } from 'prop-types';
 import {Button} from 'react-bootstrap';
 import AutoSuggest from 'react-autosuggest';
 import Highlighter from 'react-highlight-words';
@@ -43,10 +39,10 @@ import {
 
 export default class AutoCompleteSearchBar extends Component {
   static propTypes = {
-    value: React.PropTypes.string,
-    suggestions: React.PropTypes.array,
-    cachedSuggestions: React.PropTypes.array,
-    suggestionName: React.PropTypes.string
+    value: PropTypes.string,
+    suggestions: PropTypes.array,
+    cachedSuggestions: PropTypes.array,
+    suggestionName: PropTypes.string
   };
 
   componentWillMount() {
@@ -98,13 +94,13 @@ export default class AutoCompleteSearchBar extends Component {
 
   render() {
     const {
-            value, suggestions,
-            suggestionName, cachedSuggestions,
-            onInputChange, onInvalidSearch,
-            onClearSuggestionsTextFieldRequested,
-            onSuggestionsClearRequested,
-            dispatchAnalytics
-          } = this.props;
+      value, suggestions,
+      suggestionName, cachedSuggestions,
+      onInputChange, onInvalidSearch,
+      onClearSuggestionsTextFieldRequested,
+      onSuggestionsClearRequested,
+      dispatchAnalytics
+    } = this.props;
     const inputProps = {
       placeholder: SEARCH_PLACEHOLDER_TEXT,
       value,
@@ -123,6 +119,7 @@ export default class AutoCompleteSearchBar extends Component {
           onSuggestionsClearRequested={onSuggestionsClearRequested}
           onSuggestionSelected={(event, {suggestion}) => {
             this.newSearchSelected(suggestion, onInvalidSearch, dispatchAnalytics, value);
+            this.props.onClearSuggestionsTextFieldRequested();
           }}
           renderSuggestion={this.renderSuggestion}
           inputProps={inputProps}
@@ -137,6 +134,7 @@ export default class AutoCompleteSearchBar extends Component {
           <Button type='submit' className='auto-complete-search-button' onClick={() => {
             this.newSearchSelected(this.getSelectedSuggestionObj(value, cachedSuggestions),
               onInvalidSearch, dispatchAnalytics, value);
+            this.props.onSuggestionsClearRequested();
           }}>
             <i className={ICON_CLASS_SEARCH} aria-hidden='true'/>
           </Button>
@@ -166,7 +164,8 @@ export default class AutoCompleteSearchBar extends Component {
                     <Highlighter key={arrayIndex + 'high'}
                                  highlightClassName='highlight'
                                  searchWords={toHighLightArray}
-                                 textToHighlight={suggestionTextArray[arrayIndex]}/>
+                                 textToHighlight={suggestionTextArray[arrayIndex]}
+                                 autoEscape={true}/>
                     { ++arrayIndex ? ' ' : ' '}
                  </span>);
 
@@ -187,7 +186,8 @@ export default class AutoCompleteSearchBar extends Component {
                       <Highlighter key={arrayIndex + 'high'}
                                    highlightClassName='highlight'
                                    searchWords={toHighLightArray}
-                                   textToHighlight={suggestionTextArray[arrayIndex]}/>
+                                   textToHighlight={suggestionTextArray[arrayIndex]}
+                                   autoEscape={true}/>
                       { ++arrayIndex ? ' ' : ' '}
                    </span>);
 
@@ -203,7 +203,7 @@ export default class AutoCompleteSearchBar extends Component {
       rest.className = 'react-autosuggest__suggestions-containerCopy';
     }
     return (
-      <div {...rest}>
+      <div {...rest.containerProps} {...rest}>
         {children}
       </div>
     );