diff --git a/x-pack/plugins/observability/public/components/shared/alert_search_bar/alert_search_bar.test.tsx b/x-pack/plugins/observability/public/components/shared/alert_search_bar/alert_search_bar.test.tsx
index 874e70885ca75..87c94bd2a0be3 100644
--- a/x-pack/plugins/observability/public/components/shared/alert_search_bar/alert_search_bar.test.tsx
+++ b/x-pack/plugins/observability/public/components/shared/alert_search_bar/alert_search_bar.test.tsx
@@ -8,7 +8,7 @@
 import React from 'react';
 import { waitFor } from '@testing-library/react';
 import { timefilterServiceMock } from '@kbn/data-plugin/public/query/timefilter/timefilter_service.mock';
-import { ObservabilityAlertSearchBarProps } from './types';
+import { ObservabilityAlertSearchBarProps, Services } from './types';
 import { ObservabilityAlertSearchBar } from './alert_search_bar';
 import { observabilityAlertFeatureIds } from '../../../config/alert_feature_ids';
 import { render } from '../../../utils/test_helper';
@@ -17,7 +17,10 @@ const getAlertsSearchBarMock = jest.fn();
 const ALERT_SEARCH_BAR_DATA_TEST_SUBJ = 'alerts-search-bar';
 
 describe('ObservabilityAlertSearchBar', () => {
-  const renderComponent = (props: Partial<ObservabilityAlertSearchBarProps> = {}) => {
+  const renderComponent = (
+    props: Partial<ObservabilityAlertSearchBarProps> = {},
+    services: Partial<Services> = {}
+  ) => {
     const observabilityAlertSearchBarProps: ObservabilityAlertSearchBarProps = {
       appName: 'testAppName',
       kuery: '',
@@ -35,6 +38,7 @@ describe('ObservabilityAlertSearchBar', () => {
           <div data-test-subj={ALERT_SEARCH_BAR_DATA_TEST_SUBJ} />
         ),
         useToasts: jest.fn(),
+        ...services,
       },
       ...props,
     };
@@ -152,4 +156,26 @@ describe('ObservabilityAlertSearchBar', () => {
       },
     });
   });
+
+  it('should show error in a toast', async () => {
+    const error = new Error('something is wrong in esQueryChange');
+    const mockedOnEsQueryChange = jest.fn().mockImplementation(() => {
+      throw error;
+    });
+    const mockedAddError = jest.fn();
+    const mockedUseToast = jest.fn().mockImplementation(() => ({
+      addError: mockedAddError,
+    }));
+
+    renderComponent(
+      {
+        onEsQueryChange: mockedOnEsQueryChange,
+      },
+      {
+        useToasts: mockedUseToast,
+      }
+    );
+
+    expect(mockedAddError).toHaveBeenCalledWith(error, { title: 'Invalid query string' });
+  });
 });
diff --git a/x-pack/plugins/observability/public/components/shared/alert_search_bar/alert_search_bar.tsx b/x-pack/plugins/observability/public/components/shared/alert_search_bar/alert_search_bar.tsx
index 1442dbb9dbf91..620195a8779da 100644
--- a/x-pack/plugins/observability/public/components/shared/alert_search_bar/alert_search_bar.tsx
+++ b/x-pack/plugins/observability/public/components/shared/alert_search_bar/alert_search_bar.tsx
@@ -22,6 +22,9 @@ const getAlertStatusQuery = (status: string): Query[] => {
     ? [{ query: ALERT_STATUS_QUERY[status], language: 'kuery' }]
     : [];
 };
+const toastTitle = i18n.translate('xpack.observability.alerts.searchBar.invalidQueryTitle', {
+  defaultMessage: 'Invalid query string',
+});
 
 export function ObservabilityAlertSearchBar({
   appName,
@@ -41,18 +44,25 @@ export function ObservabilityAlertSearchBar({
 
   const onAlertStatusChange = useCallback(
     (alertStatus: AlertStatus) => {
-      onEsQueryChange(
-        buildEsQuery(
-          {
-            to: rangeTo,
-            from: rangeFrom,
-          },
-          kuery,
-          [...getAlertStatusQuery(alertStatus), ...defaultSearchQueries]
-        )
-      );
+      try {
+        onEsQueryChange(
+          buildEsQuery(
+            {
+              to: rangeTo,
+              from: rangeFrom,
+            },
+            kuery,
+            [...getAlertStatusQuery(alertStatus), ...defaultSearchQueries]
+          )
+        );
+      } catch (error) {
+        toasts.addError(error, {
+          title: toastTitle,
+        });
+        onKueryChange(DEFAULT_QUERY_STRING);
+      }
     },
-    [kuery, defaultSearchQueries, rangeFrom, rangeTo, onEsQueryChange]
+    [onEsQueryChange, rangeTo, rangeFrom, kuery, defaultSearchQueries, toasts, onKueryChange]
   );
 
   useEffect(() => {
@@ -83,9 +93,7 @@ export function ObservabilityAlertSearchBar({
         onEsQueryChange(esQuery);
       } catch (error) {
         toasts.addError(error, {
-          title: i18n.translate('xpack.observability.alerts.searchBar.invalidQueryTitle', {
-            defaultMessage: 'Invalid query string',
-          }),
+          title: toastTitle,
         });
         onKueryChange(DEFAULT_QUERY_STRING);
       }