From 5f3cc93125c7c0e05cd3799434cbd04c874af41d Mon Sep 17 00:00:00 2001
From: Rudy Crespo <rcrespo@gitlab.com>
Date: Fri, 19 Apr 2024 16:10:34 +0000
Subject: [PATCH] Render alert when raw text search attempted in Issue
 Analytics
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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
---
 .../components/issues_analytics.vue           | 22 +++++++++++++--
 .../components/issues_analytics_spec.js       | 28 ++++++++++++++++---
 locale/gitlab.pot                             |  3 ++
 3 files changed, 47 insertions(+), 6 deletions(-)

diff --git a/ee/app/assets/javascripts/issues_analytics/components/issues_analytics.vue b/ee/app/assets/javascripts/issues_analytics/components/issues_analytics.vue
index 238d15967208..42269b8d6238 100644
--- a/ee/app/assets/javascripts/issues_analytics/components/issues_analytics.vue
+++ b/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>
diff --git a/ee/spec/frontend/issues_analytics/components/issues_analytics_spec.js b/ee/spec/frontend/issues_analytics/components/issues_analytics_spec.js
index 4d4cc4ed09aa..316cf4e4a2ea 100644
--- a/ee/spec/frontend/issues_analytics/components/issues_analytics_spec.js
+++ b/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', () => {
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index cb280e5ce8a8..a329214c10f4 100644
--- a/locale/gitlab.pot
+++ b/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 ""
 
-- 
GitLab