Finished bug 1483

src/components/TextFields/AutoSuggestTextField/AutoSuggestTextField.js

@@ -2,6 +2,7 @@ import React, { useState } from "react";
 import PropTypes from "prop-types";
 import Autosuggest from "react-autosuggest";
 import { AutoSuggestTextFieldContainer } from "./AutoSuggestTextField.styled";
+import { useMemo } from "react";
 
 const escapeRegexCharacters = (str) =>
   str.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
@@ -10,6 +11,13 @@ const AutoSuggestTextField = (props) => {
   const [suggestions, setSuggestions] = useState([]);
   const data = [...props.data];
 
+  const hideSuggestions = useMemo(() => {
+    if (suggestions.length === 1) {
+      if (suggestions[0].isAddNew) return true;
+    }
+    return false;
+  })
+
   const getSuggestions = (value) => {
     const escapedValue = escapeRegexCharacters(value.trim());
 
@@ -48,10 +56,13 @@ const AutoSuggestTextField = (props) => {
     onChange: props.onChange,
   };
 
+  console.log(suggestions);
+
   return (
     <AutoSuggestTextFieldContainer
       editLocation={props.editLocation}
       error={props.error}
+      hideSuggestions={hideSuggestions}
     >
       <Autosuggest
         suggestions={suggestions}

src/components/TextFields/AutoSuggestTextField/AutoSuggestTextField.styled.js

@@ -46,6 +46,7 @@ export const AutoSuggestTextFieldContainer = styled(Box)`
     & div ul {
       border: 1px solid black;
       border-radius: 4px;
+      display: ${(props) => props.hideSuggestions && "none"};
 
       padding: 10px;
     }