Merge pull request #527 from Fewwy/RHINENG-20424-4

RHINENG-20424: fix clear filter bug with incident selected

Author: openshift-merge-bot[bot]

web/src/components/Incidents/IncidentsPage.tsx

@@ -62,6 +62,7 @@ import { Incident, IncidentsPageFiltersExpandedState } from './model';
 import { useAlertsPoller } from '../hooks/useAlertsPoller';
 import { Rule } from '@openshift-console/dynamic-plugin-sdk';
 import IncidentFilterToolbarItem, { severityOptions, stateOptions } from './ToolbarItemFilter';
+import { isEmpty } from 'lodash-es';
 
 const IncidentsPage = () => {
   const { t } = useTranslation(process.env.I18N_NAMESPACE);
@@ -221,7 +222,11 @@ const IncidentsPage = () => {
               alertsData: processAlerts(aggregatedData, incidentForAlertProcessing),
             }),
           );
-          dispatch(setAlertsAreLoading({ alertsAreLoading: false }));
+          if (!isEmpty(filteredData)) {
+            dispatch(setAlertsAreLoading({ alertsAreLoading: false }));
+          } else {
+            dispatch(setAlertsAreLoading({ alertsAreLoading: true }));
+          }
         })
         .catch((err) => {
           // eslint-disable-next-line no-console
@@ -317,6 +322,21 @@ const IncidentsPage = () => {
 
   const incidentIdFilterOptions = incidents ? getIncidentIdOptions(incidents) : [];
 
+  //loading states
+  useEffect(() => {
+    //force a loading state for the alerts chart and table if we filtered out all of the incidents
+    if (
+      (!isEmpty(incidentsActiveFilters.severity) || !isEmpty(incidentsActiveFilters.state)) &&
+      isEmpty(filteredData)
+    ) {
+      dispatch(setAlertsAreLoading({ alertsAreLoading: true }));
+    }
+
+    if (!isEmpty(filteredData) && !isEmpty(incidentsActiveFilters.groupId)) {
+      dispatch(setAlertsAreLoading({ alertsAreLoading: false }));
+    }
+  }, [incidentsActiveFilters, filteredData, dispatch]);
+
   return (
     <>
       <Helmet>

web/src/components/Incidents/ToolbarItemFilter.tsx

@@ -9,6 +9,7 @@ import {
   Badge,
 } from '@patternfly/react-core';
 import { getFilterKey } from './utils';
+import { setAlertsAreLoading } from '../../actions/observe';
 
 interface IncidentFilterToolbarItemProps {
   categoryName: string;
@@ -66,11 +67,17 @@ const IncidentFilterToolbarItem: React.FC<IncidentFilterToolbarItemProps> = ({
         deleteLabel={(category, chip) => {
           if (typeof category === 'string' && typeof chip === 'string') {
             onDeleteIncidentFilterChip(category, chip, incidentsActiveFilters, dispatch);
+            if (categoryName === 'Incident ID') {
+              dispatch(setAlertsAreLoading({ alertsAreLoading: true }));
+            }
+          }
+        }}
+        deleteLabelGroup={(category) => {
+          onDeleteGroupIncidentFilterChip(incidentsActiveFilters, dispatch, category);
+          if (categoryName === 'Incident ID') {
+            dispatch(setAlertsAreLoading({ alertsAreLoading: true }));
           }
         }}
-        deleteLabelGroup={(category) =>
-          onDeleteGroupIncidentFilterChip(incidentsActiveFilters, dispatch, category)
-        }
         categoryName={categoryName}
       >
         <Select