From 90759708c40712ce77e2af43ce373187f7eefe90 Mon Sep 17 00:00:00 2001
From: EMaksy <emaksymenko@suse.com>
Date: Mon, 15 May 2023 14:50:48 +0200
Subject: [PATCH] Add WIP for fix

---
 .../ExecutionResults/ExecutionResults.jsx     | 10 +++++++++
 .../ExecutionResults/ExecutionResultsPage.jsx |  3 ++-
 .../ExecutionResults/checksUtils.js           | 21 ++++++++++++-------
 assets/js/state/selectors/lastExecutions.js   |  1 +
 4 files changed, 27 insertions(+), 8 deletions(-)

diff --git a/assets/js/components/ExecutionResults/ExecutionResults.jsx b/assets/js/components/ExecutionResults/ExecutionResults.jsx
index 68899ecaff..3069370a20 100644
--- a/assets/js/components/ExecutionResults/ExecutionResults.jsx
+++ b/assets/js/components/ExecutionResults/ExecutionResults.jsx
@@ -7,6 +7,7 @@ import HealthIcon from '@components/Health';
 import Modal from '@components/Modal';
 import PremiumPill from '@components/PremiumPill';
 import Table from '@components/Table';
+import LoadingBox from '@components/LoadingBox';
 import {
   getCatalogCategoryList,
   getCheckResults,
@@ -116,6 +117,15 @@ function ExecutionResults({
       onLastExecutionUpdate();
     }
   };
+  console.log(
+    'catalog length',
+    catalog.length,
+    'catalog loading',
+    catalogLoading
+  );
+  if (catalogLoading) {
+    return <LoadingBox text="Loading checks catalog" />;
+  }
 
   const checksResults = getCheckResults(executionData);
   const catalogCategoryList = getCatalogCategoryList(catalog, checksResults);
diff --git a/assets/js/components/ExecutionResults/ExecutionResultsPage.jsx b/assets/js/components/ExecutionResults/ExecutionResultsPage.jsx
index 282876def7..84ec77e1d8 100644
--- a/assets/js/components/ExecutionResults/ExecutionResultsPage.jsx
+++ b/assets/js/components/ExecutionResults/ExecutionResultsPage.jsx
@@ -12,6 +12,7 @@ import {
   RUNNING_STATES,
 } from '@state/lastExecutions';
 import ExecutionResults from './ExecutionResults';
+import LoadingBox from '../LoadingBox';
 
 function ExecutionResultsPage() {
   const { clusterID } = useParams();
@@ -40,7 +41,7 @@ function ExecutionResultsPage() {
   }, [cloudProvider]);
 
   if (!cluster) {
-    return <div>Loading...</div>;
+    return <LoadingBox text="Loading ..." />;
   }
 
   return (
diff --git a/assets/js/components/ExecutionResults/checksUtils.js b/assets/js/components/ExecutionResults/checksUtils.js
index 1d7a1f48f9..c6e37577bc 100644
--- a/assets/js/components/ExecutionResults/checksUtils.js
+++ b/assets/js/components/ExecutionResults/checksUtils.js
@@ -42,13 +42,20 @@ export const getCatalogCategoryList = (catalog, checksResults = []) => {
   if (!catalog || catalog.length === 0 || !checksResults) {
     return [];
   }
-  return [
-    ...new Set(
-      checksResults.map(
-        ({ check_id }) => catalog.find((check) => check.id === check_id).group
-      )
-    ),
-  ].sort();
+  console.log(
+    'getCatalogCategoryList catalog ',
+    catalog,
+    'checksResults ',
+    checksResults
+  );
+  const uniqueGroups = checksResults
+    .map(({ check_id }) => {
+      const check = catalog.find((check) => check.id === check_id);
+      return check ? check.group : undefined;
+    })
+    .filter(Boolean);
+
+  return [...new Set(uniqueGroups)].sort();
 };
 
 export const getCheckDescription = (catalog, checkID) => {
diff --git a/assets/js/state/selectors/lastExecutions.js b/assets/js/state/selectors/lastExecutions.js
index 281b73fe56..b330bb504a 100644
--- a/assets/js/state/selectors/lastExecutions.js
+++ b/assets/js/state/selectors/lastExecutions.js
@@ -39,6 +39,7 @@ export const getLastExecutionData = (groupID) => (state) => {
   const clusterHosts = getClusterHosts(groupID)(state);
   const cluster = getCluster(groupID)(state);
   const catalog = getCatalog()(state);
+  console.log('catalog', catalog, 'catalog loading', catalog.loading);
   const lastExecution = getLastExecution(groupID)(state) || null;
 
   const enrichedExecution = lastExecution