[Security Solution][Exceptions] Adds autocomplete workaround for .text fields

x-pack/plugins/security_solution/public/common/components/autocomplete/field_value_match.test.tsx

@@ -232,7 +232,6 @@ describe('AutocompleteFieldMatchComponent', () => {
         fields,
       },
       value: 'value 1',
-      signal: new AbortController().signal,
     });
   });
 });

x-pack/plugins/security_solution/public/common/components/autocomplete/field_value_match.tsx

@@ -72,14 +72,13 @@ export const AutocompleteFieldMatchComponent: React.FC<AutocompleteFieldMatchPro
   };
 
   const onSearchChange = (searchVal: string): void => {
-    const signal = new AbortController().signal;
-
-    updateSuggestions({
-      fieldSelected: selectedField,
-      value: `${searchVal}`,
-      patterns: indexPattern,
-      signal,
-    });
+    if (updateSuggestions != null) {
+      updateSuggestions({
+        fieldSelected: selectedField,
+        value: searchVal,
+        patterns: indexPattern,
+      });
+    }
   };
 
   const isValid = useMemo(

x-pack/plugins/security_solution/public/common/components/autocomplete/field_value_match_any.test.tsx

@@ -232,7 +232,6 @@ describe('AutocompleteFieldMatchAnyComponent', () => {
         fields,
       },
       value: 'value 1',
-      signal: new AbortController().signal,
     });
   });
 });

x-pack/plugins/security_solution/public/common/components/autocomplete/field_value_match_any.tsx

@@ -65,14 +65,13 @@ export const AutocompleteFieldMatchAnyComponent: React.FC<AutocompleteFieldMatch
   };
 
   const onSearchChange = (searchVal: string) => {
-    const signal = new AbortController().signal;
-
-    updateSuggestions({
-      fieldSelected: selectedField,
-      value: `${searchVal}`,
-      patterns: indexPattern,
-      signal,
-    });
+    if (updateSuggestions != null) {
+      updateSuggestions({
+        fieldSelected: selectedField,
+        value: searchVal,
+        patterns: indexPattern,
+      });
+    }
   };
 
   const onCreateOption = (option: string) => onChange([...(selectedValue || []), option]);

x-pack/plugins/security_solution/public/common/components/autocomplete/hooks/use_field_value_autocomplete.test.ts

@@ -199,12 +199,17 @@ describe('useFieldValueAutocomplete', () => {
       await waitForNextUpdate();
       await waitForNextUpdate();
 
-      result.current[2]({
-        fieldSelected: getField('@tags'),
-        value: 'hello',
-        patterns: stubIndexPatternWithFields,
-        signal: new AbortController().signal,
-      });
+      expect(result.current[2]).not.toBeNull();
+
+      // Added check for typescripts sake, if null,
+      // would not reach below logic as test would stop above
+      if (result.current[2] != null) {
+        result.current[2]({
+          fieldSelected: getField('@tags'),
+          value: 'hello',
+          patterns: stubIndexPatternWithFields,
+        });
+      }
 
       await waitForNextUpdate();
 

x-pack/plugins/security_solution/public/common/components/autocomplete/hooks/use_field_value_autocomplete.ts

@@ -11,16 +11,13 @@ import { IFieldType, IIndexPattern } from '../../../../../../../../src/plugins/d
 import { useKibana } from '../../../../common/lib/kibana';
 import { OperatorTypeEnum } from '../../../../lists_plugin_deps';
 
-export type UseFieldValueAutocompleteReturn = [
-  boolean,
-  string[],
-  (args: {
-    fieldSelected: IFieldType | undefined;
-    value: string | string[] | undefined;
-    patterns: IIndexPattern | undefined;
-    signal: AbortSignal;
-  }) => void
-];
+type Func = (args: {
+  fieldSelected: IFieldType | undefined;
+  value: string | string[] | undefined;
+  patterns: IIndexPattern | undefined;
+}) => void;
+
+export type UseFieldValueAutocompleteReturn = [boolean, string[], Func | null];
 
 export interface UseFieldValueAutocompleteProps {
   selectedField: IFieldType | undefined;
@@ -41,62 +38,77 @@ export const useFieldValueAutocomplete = ({
   const { services } = useKibana();
   const [isLoading, setIsLoading] = useState(false);
   const [suggestions, setSuggestions] = useState<string[]>([]);
-  const updateSuggestions = useRef(
-    debounce(
+  const updateSuggestions = useRef<Func | null>(null);
+
+  useEffect(() => {
+    let isSubscribed = true;
+    const abortCtrl = new AbortController();
+
+    const fetchSuggestions = debounce(
       async ({
         fieldSelected,
         value,
         patterns,
-        signal,
       }: {
         fieldSelected: IFieldType | undefined;
         value: string | string[] | undefined;
         patterns: IIndexPattern | undefined;
-        signal: AbortSignal;
       }) => {
-        if (fieldSelected == null || patterns == null) {
-          return;
-        }
+        const inputValue: string | string[] = value ?? '';
+        const userSuggestion: string = Array.isArray(inputValue)
+          ? inputValue[inputValue.length - 1] ?? ''
+          : inputValue;
 
-        setIsLoading(true);
+        try {
+          if (isSubscribed) {
+            if (fieldSelected == null || patterns == null) {
+              return;
+            }
 
-        // Fields of type boolean should only display two options
-        if (fieldSelected.type === 'boolean') {
-          setIsLoading(false);
-          setSuggestions(['true', 'false']);
-          return;
-        }
+            setIsLoading(true);
 
-        const newSuggestions = await services.data.autocomplete.getValueSuggestions({
-          indexPattern: patterns,
-          field: fieldSelected,
-          query: '',
-          signal,
-        });
+            // Fields of type boolean should only display two options
+            if (fieldSelected.type === 'boolean') {
+              setIsLoading(false);
+              setSuggestions(['true', 'false']);
+              return;
+            }
 
-        setIsLoading(false);
-        setSuggestions(newSuggestions);
+            const newSuggestions = await services.data.autocomplete.getValueSuggestions({
+              indexPattern: patterns,
+              field: fieldSelected,
+              query: userSuggestion.trim(),
+              signal: abortCtrl.signal,
+            });
+
+            setIsLoading(false);
+            setSuggestions([...newSuggestions]);
+          }
+        } catch (error) {
+          if (isSubscribed) {
+            setSuggestions([]);
+            setIsLoading(false);
+          }
+        }
       },
       500
-    )
-  );
-
-  useEffect(() => {
-    const abortCtrl = new AbortController();
+    );
 
     if (operatorType !== OperatorTypeEnum.EXISTS) {
-      updateSuggestions.current({
+      fetchSuggestions({
         fieldSelected: selectedField,
         value: fieldValue,
         patterns: indexPattern,
-        signal: abortCtrl.signal,
       });
     }
 
+    updateSuggestions.current = fetchSuggestions;
+
     return (): void => {
+      isSubscribed = false;
       abortCtrl.abort();
     };
-  }, [updateSuggestions, selectedField, operatorType, fieldValue, indexPattern]);
+  }, [services.data.autocomplete, selectedField, operatorType, fieldValue, indexPattern]);
 
   return [isLoading, suggestions, updateSuggestions.current];
 };

x-pack/plugins/security_solution/public/common/components/exceptions/builder/builder_entry_item.test.tsx

@@ -55,6 +55,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',
@@ -81,6 +82,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',
@@ -111,6 +113,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',
@@ -143,6 +146,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',
@@ -175,6 +179,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',
@@ -207,6 +212,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',
@@ -239,6 +245,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',
@@ -271,6 +278,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',
@@ -306,6 +314,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',
@@ -331,6 +340,62 @@ describe('BuilderEntryItem', () => {
     ).toBeTruthy();
   });
 
+  test('it uses "correspondingKeywordField" if it exists', () => {
+    const wrapper = mount(
+      <BuilderEntryItem
+        entry={{
+          field: {
+            name: 'extension.text',
+            type: 'string',
+            esTypes: ['text'],
+            count: 0,
+            scripted: false,
+            searchable: false,
+            aggregatable: false,
+            readFromDocValues: true,
+          },
+          operator: isOneOfOperator,
+          value: ['1234'],
+          nested: undefined,
+          parent: undefined,
+          entryIndex: 0,
+          correspondingKeywordField: {
+            name: 'extension',
+            type: 'string',
+            esTypes: ['keyword'],
+            count: 0,
+            scripted: false,
+            searchable: true,
+            aggregatable: true,
+            readFromDocValues: true,
+          },
+        }}
+        indexPattern={{
+          id: '1234',
+          title: 'logstash-*',
+          fields,
+        }}
+        showLabel={false}
+        listType="detection"
+        addNested={false}
+        onChange={jest.fn()}
+      />
+    );
+
+    expect(
+      wrapper.find('[data-test-subj="exceptionBuilderEntryFieldMatchAny"]').prop('selectedField')
+    ).toEqual({
+      name: 'extension',
+      type: 'string',
+      esTypes: ['keyword'],
+      count: 0,
+      scripted: false,
+      searchable: true,
+      aggregatable: true,
+      readFromDocValues: true,
+    });
+  });
+
   test('it invokes "onChange" when new field is selected and resets operator and value fields', () => {
     const mockOnChange = jest.fn();
     const wrapper = mount(
@@ -342,6 +407,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',
@@ -376,6 +442,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',
@@ -410,6 +477,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',
@@ -444,6 +512,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',
@@ -478,6 +547,7 @@ describe('BuilderEntryItem', () => {
           nested: undefined,
           parent: undefined,
           entryIndex: 0,
+          correspondingKeywordField: undefined,
         }}
         indexPattern={{
           id: '1234',