[9.2] [ResponseOps][MaintenanceWindow] Add filter button of DSL filter throws error on create/edit MWs (#259517)

src/platform/plugins/shared/unified_search/public/filter_badge/filter_badge.tsx

@@ -38,10 +38,6 @@ export function FilterBadge({
 }: FilterBadgeProps) {
   const { euiTheme } = useEuiTheme();
 
-  if (!dataViews.length) {
-    return null;
-  }
-
   const prefixText = filter.meta.negate ? ` ${strings.getNotLabel()}` : '';
 
   const prefix =

src/platform/plugins/shared/unified_search/public/filter_bar/filter_editor/filter_editor.test.tsx

@@ -12,6 +12,7 @@ import type { UseEuiTheme, EuiThemeComputed } from '@elastic/eui';
 import type { TestBed } from '@kbn/test-jest-helpers';
 import { registerTestBed } from '@kbn/test-jest-helpers';
 import { coreMock } from '@kbn/core/public/mocks';
+import { FilterStateStore } from '@kbn/es-query';
 import type { FilterEditorProps } from '.';
 import { FilterEditor } from '.';
 import { dataViewMockList } from '../../dataview_picker/mocks/dataview';
@@ -83,6 +84,51 @@ describe('<FilterEditor />', () => {
       expect(find('saveFilter').props().disabled).toBe(false);
     });
   });
+  describe('submitting query dsl with no index patterns', () => {
+    it('should create filter when no index patterns are available', async () => {
+      const onSubmit = jest.fn();
+      const defaultProps: Omit<FilterEditorProps, 'intl'> = {
+        theme: {
+          euiTheme: {} as unknown as EuiThemeComputed<{}>,
+          colorMode: 'DARK',
+          modifications: [],
+          highContrastMode: false,
+        } as UseEuiTheme<{}>,
+        filter: {
+          meta: {
+            type: 'custom',
+          } as any,
+          $state: {
+            store: FilterStateStore.APP_STATE,
+          },
+        },
+        indexPatterns: [],
+        onCancel: jest.fn(),
+        onSubmit,
+        docLinks: coreMock.createStart().docLinks,
+        dataViews: dataMock.dataViews,
+      };
+      const testBed: TestBed = await registerTestBed(FilterEditor, { defaultProps })();
+      const { find } = testBed;
+
+      find('customEditorInput').simulate('change', {
+        target: { value: '{ "wildcard": { "kibana.alert.rule.name": "test*" } }' },
+      });
+
+      find('saveFilter').simulate('click');
+      expect(onSubmit).toHaveBeenCalledWith(
+        expect.objectContaining({
+          wildcard: { 'kibana.alert.rule.name': 'test*' },
+          meta: expect.objectContaining({
+            type: 'custom',
+            disabled: false,
+            negate: false,
+          }),
+        })
+      );
+    });
+  });
+
   describe('handling data view fallback', () => {
     let testBed: TestBed;
 

src/platform/plugins/shared/unified_search/public/filter_bar/filter_editor/filter_editor.tsx

@@ -354,7 +354,9 @@ class FilterEditorComponent extends Component<FilterEditorProps, State> {
             placeholder={strings.getSelectDataView()}
             options={this.state.indexPatterns}
             selectedOptions={selectedDataView ? [selectedDataView] : []}
-            getLabel={(indexPattern) => indexPattern?.getName()}
+            getLabel={(indexPattern) =>
+              indexPattern?.getName?.() ?? indexPattern?.name ?? indexPattern?.title ?? ''
+            }
             onChange={this.onIndexPatternChange}
             isClearable={false}
             data-test-subj="filterIndexPatternsSelect"
@@ -576,7 +578,7 @@ class FilterEditorComponent extends Component<FilterEditorProps, State> {
       return;
     }
 
-    const newIndex = index || this.state.indexPatterns[0].id!;
+    const newIndex = index || this.state.indexPatterns[0]?.id || this.state.indexPatterns[0]?.title;
     try {
       const body = JSON.parse(queryDsl);
       return buildCustomFilter(newIndex, body, disabled, negate, customLabel || null, $state.store);

src/platform/plugins/shared/unified_search/public/search_bar/search_bar.test.tsx

@@ -166,6 +166,40 @@ describe('SearchBar', () => {
     });
   });
 
+  it('Should render filter bar when filters exist but no index patterns are provided', async () => {
+    const dslFilter = {
+      meta: {
+        key: 'query',
+        value: '{"wildcard":{"kibana.alert.rule.name":"example*"}}',
+        type: 'custom',
+        disabled: false,
+        negate: false,
+        alias: null,
+      },
+      query: {
+        wildcard: {
+          'kibana.alert.rule.name': 'example*',
+        },
+      },
+    };
+
+    render(
+      wrapSearchBarInContext({
+        indexPatterns: [],
+        showDatePicker: false,
+        showQueryInput: true,
+        showFilterBar: true,
+        onFiltersUpdated: noop,
+        filters: [dslFilter],
+      })
+    );
+
+    await waitFor(() => {
+      expect(screen.getByTestId('globalQueryBar')).toBeInTheDocument();
+      expect(screen.getByTestId('filter-items-group')).toBeInTheDocument();
+    });
+  });
+
   it('Should NOT render filter bar, if disabled', async () => {
     render(
       wrapSearchBarInContext({

src/platform/plugins/shared/unified_search/public/search_bar/search_bar.tsx

@@ -7,7 +7,6 @@
  * License v3.0 only", or the "Server Side Public License, v 1".
  */
 
-import { compact } from 'lodash';
 import type { InjectedIntl } from '@kbn/i18n-react';
 import { FormattedMessage, injectI18n } from '@kbn/i18n-react';
 import classNames from 'classnames';
@@ -337,15 +336,6 @@ export class SearchBarUI<QT extends (Query | AggregateQuery) | Query = Query> ex
     this.renderSavedQueryManagement.clear();
   }
 
-  private shouldRenderFilterBar() {
-    return (
-      this.props.showFilterBar &&
-      this.props.filters &&
-      this.props.indexPatterns &&
-      compact(this.props.indexPatterns).length > 0
-    );
-  }
-
   /*
    * This Function is here to show the toggle in saved query form
    * in case you the date range (from/to)
@@ -599,7 +589,7 @@ export class SearchBarUI<QT extends (Query | AggregateQuery) | Query = Query> ex
   };
 
   private shouldShowDatePickerAsBadge() {
-    return this.shouldRenderFilterBar() && !this.props.showQueryInput;
+    return this.props.showFilterBar && !this.props.showQueryInput;
   }
 
   public render() {
@@ -693,12 +683,12 @@ export class SearchBarUI<QT extends (Query | AggregateQuery) | Query = Query> ex
     ) : undefined;
 
     let filterBar;
-    if (this.shouldRenderFilterBar()) {
+    if (this.props.showFilterBar) {
       filterBar = this.shouldShowDatePickerAsBadge() ? (
         <FilterItems
-          filters={this.props.filters!}
+          filters={this.props.filters ?? []}
           onFiltersUpdated={this.props.onFiltersUpdated}
-          indexPatterns={this.props.indexPatterns!}
+          indexPatterns={this.props.indexPatterns ?? []}
           timeRangeForSuggestionsOverride={timeRangeForSuggestionsOverride}
           filtersForSuggestions={this.props.filtersForSuggestions}
           hiddenPanelOptions={this.props.hiddenFilterPanelOptions}
@@ -708,9 +698,9 @@ export class SearchBarUI<QT extends (Query | AggregateQuery) | Query = Query> ex
       ) : (
         <FilterBar
           afterQueryBar
-          filters={this.props.filters!}
+          filters={this.props.filters ?? []}
           onFiltersUpdated={this.props.onFiltersUpdated}
-          indexPatterns={this.props.indexPatterns!}
+          indexPatterns={this.props.indexPatterns ?? []}
           timeRangeForSuggestionsOverride={timeRangeForSuggestionsOverride}
           filtersForSuggestions={this.props.filtersForSuggestions}
           hiddenPanelOptions={this.props.hiddenFilterPanelOptions}