Render alert when raw text search attempted in Issue Analytics

Renders an alert on the Issue Analytics page when users attempt a
raw text search in the filtered search bar – it isn't possible
on aggregated data.

Changelog: fixed
EE: true

ee/app/assets/javascripts/issues_analytics/components/issues_analytics.vue

@@ -6,7 +6,8 @@ import {
   getCurrentUtcDate,
   dateAtFirstDayOfMonth,
 } from '~/lib/utils/datetime_utility';
-import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
+import { s__ } from '~/locale';
+import { createAlert, VARIANT_WARNING } from '~/alert';
 import FilteredSearchIssueAnalytics from '../filtered_search_issues_analytics';
 import { RENAMED_FILTER_KEYS_CHART, DEFAULT_MONTHS_BACK } from '../constants';
 import { transformFilters } from '../utils';
@@ -20,7 +21,6 @@ export default {
     IssuesAnalyticsChart,
     TotalIssuesAnalyticsChart,
   },
-  mixins: [glFeatureFlagsMixin()],
   inject: {
     hasIssuesCompletedFeature: {
       default: false,
@@ -57,6 +57,19 @@ export default {
       return transformFilters(this.appliedFilters);
     },
   },
+  watch: {
+    appliedFilters: {
+      handler(filters) {
+        if (filters?.search) {
+          createAlert({
+            message: this.$options.i18n.rawTextSearchWarning,
+            variant: VARIANT_WARNING,
+          });
+        }
+      },
+      immediate: true,
+    },
+  },
   created() {
     const { hasIssuesCompletedFeature } = this;
 
@@ -71,6 +84,11 @@ export default {
       this.filterBlockEl.classList.add('hide');
     },
   },
+  i18n: {
+    rawTextSearchWarning: s__(
+      'IssuesAnalytics|Raw text search is not supported. Please use the available filters.',
+    ),
+  },
 };
 </script>
 <template>

ee/spec/frontend/issues_analytics/components/issues_analytics_spec.js

@@ -8,6 +8,7 @@ import TotalIssuesAnalyticsChart from 'ee/issues_analytics/components/total_issu
 import IssuesAnalyticsTable from 'ee/issues_analytics/components/issues_analytics_table.vue';
 import { createStore } from 'ee/issues_analytics/stores';
 import { useFakeDate } from 'helpers/fake_date';
+import { createAlert, VARIANT_WARNING } from '~/alert';
 
 const mockFilterManagerSetup = jest.fn();
 jest.mock('ee/issues_analytics/filtered_search_issues_analytics', () =>
@@ -15,6 +16,7 @@ jest.mock('ee/issues_analytics/filtered_search_issues_analytics', () =>
     setup: mockFilterManagerSetup,
   })),
 );
+jest.mock('~/alert');
 
 Vue.use(Vuex);
 
@@ -68,11 +70,15 @@ describe('IssuesAnalytics', () => {
   };
 
   describe('default', () => {
-    describe('table', () => {
-      beforeEach(() => {
-        createComponent();
-      });
+    beforeEach(() => {
+      createComponent();
+    });
 
+    it('does not render raw text search alert', () => {
+      expect(createAlert).not.toHaveBeenCalled();
+    });
+
+    describe('table', () => {
       it('renders the Issues Analytics table', () => {
         expect(findIssuesAnalyticsTable().props()).toEqual({
           endDate: TEST_END_DATE,
@@ -91,6 +97,20 @@ describe('IssuesAnalytics', () => {
         });
       });
     });
+
+    describe('when raw text search is attempted', () => {
+      beforeEach(async () => {
+        await store.dispatch('issueAnalytics/setFilters', { search: 'hello' });
+      });
+
+      it('should render an alert', () => {
+        expect(createAlert).toHaveBeenCalledTimes(1);
+        expect(createAlert).toHaveBeenCalledWith({
+          message: 'Raw text search is not supported. Please use the available filters.',
+          variant: VARIANT_WARNING,
+        });
+      });
+    });
   });
 
   describe('chart', () => {

locale/gitlab.pot

@@ -28362,6 +28362,9 @@ msgstr ""
 msgid "IssuesAnalytics|Overview"
 msgstr ""
+msgid "IssuesAnalytics|Raw text search is not supported. Please use the available filters."
+msgstr ""
+
 msgid "IssuesAnalytics|Sorry, your filter produced no results"
 msgstr ""