From b81d6b184b0016ebdde5ac77dc897d1b57d4cbda Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A1s=20J=C3=A1ky?= <ajaky@cisco.com>
Date: Thu, 8 Aug 2024 15:12:17 +0200
Subject: [PATCH] perf(ui): improve UI queries to reduce load time
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: András Jáky <ajaky@cisco.com>
---
 ui/src/layout/AssetScans/AssetScanDetails.jsx      |  2 +-
 ui/src/layout/Dashboard/CounterDisplay/index.jsx   |  2 +-
 ui/src/layout/Dashboard/index.jsx                  |  6 ++++--
 ui/src/layout/Findings/Exploits/ExploitsTable.jsx  |  1 +
 ui/src/layout/Findings/FindingsDetailsPage.jsx     |  2 +-
 ui/src/layout/Findings/FindingsTablePage.jsx       |  2 ++
 ui/src/layout/Findings/Malware/MalwareTable.jsx    |  1 +
 .../Misconfigurations/MisconfigurationTable.jsx    |  1 +
 ui/src/layout/Findings/Packages/PackagesTable.jsx  |  1 +
 ui/src/layout/Findings/Rootkits/RootkitsTable.jsx  |  1 +
 ui/src/layout/Findings/Secrets/SecretsTable.jsx    |  1 +
 .../Vulnerabilities/VulnerabilitiesTable.jsx       |  1 +
 .../ConfigurationDetails/TabConfiguration.jsx      |  2 +-
 ui/src/layout/Scans/Scans/ScansTable.jsx           |  1 +
 ui/src/layout/Scans/index.jsx                      | 14 +++++++++++---
 .../AssetDetails/AssetScansDisplay.jsx             |  2 +-
 16 files changed, 30 insertions(+), 10 deletions(-)

diff --git a/ui/src/layout/AssetScans/AssetScanDetails.jsx b/ui/src/layout/AssetScans/AssetScanDetails.jsx
index 946f1b2ab..a77b177b6 100644
--- a/ui/src/layout/AssetScans/AssetScanDetails.jsx
+++ b/ui/src/layout/AssetScans/AssetScanDetails.jsx
@@ -49,7 +49,7 @@ const AssetScanDetails = () => (
   <DetailsPageWrapper
     backTitle="Asset scans"
     url={APIS.ASSET_SCANS}
-    select="id,scan,asset,summary,status,stats,sbom,vulnerabilities,exploits,misconfigurations,secrets,malware,rootkits"
+    select="id,scan,asset,summary,status,stats,sbom/status,vulnerabilities/status,exploits/status,misconfigurations/status,secrets/status,malware/status,rootkits/status"
     expand="scan($select=id,name,startTime,endTime),asset($select=id,assetInfo),status,stats"
     getTitleData={({ scan, asset }) => {
       const { startTime, name } = scan || {};
diff --git a/ui/src/layout/Dashboard/CounterDisplay/index.jsx b/ui/src/layout/Dashboard/CounterDisplay/index.jsx
index 1bfbc5b3e..7039f14b3 100644
--- a/ui/src/layout/Dashboard/CounterDisplay/index.jsx
+++ b/ui/src/layout/Dashboard/CounterDisplay/index.jsx
@@ -12,7 +12,7 @@ export const ScanCounterDisplay = () => {
     queryParams: {
       $count: true,
       $top: 1,
-      $select: "id",
+      $select: "count",
       $filter:
         "status/state eq 'Aborted' or status/state eq 'Failed' or status/state eq 'Done'",
     },
diff --git a/ui/src/layout/Dashboard/index.jsx b/ui/src/layout/Dashboard/index.jsx
index 32a465d6f..f683273ed 100644
--- a/ui/src/layout/Dashboard/index.jsx
+++ b/ui/src/layout/Dashboard/index.jsx
@@ -27,7 +27,9 @@ const COUNTERS_CONFIG = [
 ];
 
 const Dashboard = () => {
-  const [{ data, error, loading }] = useFetch(APIS.SCANS);
+  const [{ data, error, loading }] = useFetch(APIS.SCANS, {
+    queryParams: { $count: true, $select: "count" },
+  });
 
   if (loading) {
     return <Loader />;
@@ -37,7 +39,7 @@ const Dashboard = () => {
     return null;
   }
 
-  if (data.length === 0) {
+  if (data.count === 0) {
     return <EmptyScansDisplay />;
   }
 
diff --git a/ui/src/layout/Findings/Exploits/ExploitsTable.jsx b/ui/src/layout/Findings/Exploits/ExploitsTable.jsx
index bec0633ba..62a27af3e 100644
--- a/ui/src/layout/Findings/Exploits/ExploitsTable.jsx
+++ b/ui/src/layout/Findings/Exploits/ExploitsTable.jsx
@@ -34,6 +34,7 @@ const ExploitsTable = () => {
   return (
     <FindingsTablePage
       columns={columns}
+      select="id,findingInfo,firstSeen,lastSeen"
       filterType={FILTER_TYPES.FINDINGS_EXPLOITS}
       filtersConfig={[
         {
diff --git a/ui/src/layout/Findings/FindingsDetailsPage.jsx b/ui/src/layout/Findings/FindingsDetailsPage.jsx
index 316a0829b..b5003a658 100644
--- a/ui/src/layout/Findings/FindingsDetailsPage.jsx
+++ b/ui/src/layout/Findings/FindingsDetailsPage.jsx
@@ -10,7 +10,7 @@ const FindingsDetailsPage = ({
   <DetailsPageWrapper
     backTitle={backTitle}
     url={APIS.FINDINGS}
-    select="id,findingInfo,firstSeen,lastSeen,summary"
+    select="id,findingInfo,firstSeen,lastSeen"
     getTitleData={getTitleData}
     detailsContent={(props) => <DetailsContent {...props} />}
   />
diff --git a/ui/src/layout/Findings/FindingsTablePage.jsx b/ui/src/layout/Findings/FindingsTablePage.jsx
index e312ac522..6cf927a25 100644
--- a/ui/src/layout/Findings/FindingsTablePage.jsx
+++ b/ui/src/layout/Findings/FindingsTablePage.jsx
@@ -19,6 +19,7 @@ const FindingsTablePage = ({
   columns,
   filterType,
   filtersConfig,
+  select,
 }) => {
   const filtersDispatch = useFilterDispatch();
   const filtersState = useFilterState();
@@ -73,6 +74,7 @@ const FindingsTablePage = ({
       <TablePage
         columns={columns}
         url={APIS.FINDINGS}
+        select={select}
         tableTitle={tableTitle}
         filterType={filterType}
         filtersConfig={[
diff --git a/ui/src/layout/Findings/Malware/MalwareTable.jsx b/ui/src/layout/Findings/Malware/MalwareTable.jsx
index 5b8fc5437..525bc44d8 100644
--- a/ui/src/layout/Findings/Malware/MalwareTable.jsx
+++ b/ui/src/layout/Findings/Malware/MalwareTable.jsx
@@ -35,6 +35,7 @@ const MalwareTable = () => {
   return (
     <FindingsTablePage
       columns={columns}
+      select="id,findingInfo,firstSeen,lastSeen"
       filterType={FILTER_TYPES.FINDINGS_MALWARE}
       filtersConfig={[
         {
diff --git a/ui/src/layout/Findings/Misconfigurations/MisconfigurationTable.jsx b/ui/src/layout/Findings/Misconfigurations/MisconfigurationTable.jsx
index 8fff25601..eb865fd4e 100644
--- a/ui/src/layout/Findings/Misconfigurations/MisconfigurationTable.jsx
+++ b/ui/src/layout/Findings/Misconfigurations/MisconfigurationTable.jsx
@@ -43,6 +43,7 @@ const MisconfigurationsTable = () => {
   return (
     <FindingsTablePage
       columns={columns}
+      select="id,findingInfo,firstSeen,lastSeen"
       filterType={FILTER_TYPES.FINDINGS_MISCONFIGURATIONS}
       filtersConfig={[
         {
diff --git a/ui/src/layout/Findings/Packages/PackagesTable.jsx b/ui/src/layout/Findings/Packages/PackagesTable.jsx
index aa781581c..5e75f9b6f 100644
--- a/ui/src/layout/Findings/Packages/PackagesTable.jsx
+++ b/ui/src/layout/Findings/Packages/PackagesTable.jsx
@@ -49,6 +49,7 @@ const PackagesTable = () => {
   return (
     <FindingsTablePage
       columns={columns}
+      select="id,findingInfo,firstSeen,lastSeen"
       filterType={FILTER_TYPES.FINDINGS_PACKAGES}
       filtersConfig={[
         {
diff --git a/ui/src/layout/Findings/Rootkits/RootkitsTable.jsx b/ui/src/layout/Findings/Rootkits/RootkitsTable.jsx
index f08e091cd..ef3b0d128 100644
--- a/ui/src/layout/Findings/Rootkits/RootkitsTable.jsx
+++ b/ui/src/layout/Findings/Rootkits/RootkitsTable.jsx
@@ -27,6 +27,7 @@ const RootkitsTable = () => {
   return (
     <FindingsTablePage
       columns={columns}
+      select="id,findingInfo,firstSeen,lastSeen"
       filterType={FILTER_TYPES.FINDINGS_ROOTKITS}
       filtersConfig={[
         {
diff --git a/ui/src/layout/Findings/Secrets/SecretsTable.jsx b/ui/src/layout/Findings/Secrets/SecretsTable.jsx
index 77578142b..f6f959d0b 100644
--- a/ui/src/layout/Findings/Secrets/SecretsTable.jsx
+++ b/ui/src/layout/Findings/Secrets/SecretsTable.jsx
@@ -35,6 +35,7 @@ const SecretsTable = () => {
   return (
     <FindingsTablePage
       columns={columns}
+      select="id,findingInfo,firstSeen,lastSeen"
       filterType={FILTER_TYPES.FINDINGS_SECRETS}
       filtersConfig={[
         {
diff --git a/ui/src/layout/Findings/Vulnerabilities/VulnerabilitiesTable.jsx b/ui/src/layout/Findings/Vulnerabilities/VulnerabilitiesTable.jsx
index 1a5d68f53..07205543c 100644
--- a/ui/src/layout/Findings/Vulnerabilities/VulnerabilitiesTable.jsx
+++ b/ui/src/layout/Findings/Vulnerabilities/VulnerabilitiesTable.jsx
@@ -73,6 +73,7 @@ const VulnerabilitiesTable = () => {
   return (
     <FindingsTablePage
       columns={columns}
+      select="id,findingInfo,firstSeen,lastSeen"
       filterType={FILTER_TYPES.FINDINGS_VULNERABILITIES}
       filtersConfig={[
         {
diff --git a/ui/src/layout/Scans/Configurations/ConfigurationDetails/TabConfiguration.jsx b/ui/src/layout/Scans/Configurations/ConfigurationDetails/TabConfiguration.jsx
index fa679e363..d5eebc4b5 100644
--- a/ui/src/layout/Scans/Configurations/ConfigurationDetails/TabConfiguration.jsx
+++ b/ui/src/layout/Scans/Configurations/ConfigurationDetails/TabConfiguration.jsx
@@ -38,7 +38,7 @@ const ConfigurationScansDisplay = ({ configId, configName }) => {
   };
 
   const [{ loading, data, error }] = useFetch(APIS.SCANS, {
-    queryParams: { $filter: scansFilter, $count: true },
+    queryParams: { $filter: scansFilter, $count: true, $select: "count" },
   });
 
   if (error) {
diff --git a/ui/src/layout/Scans/Scans/ScansTable.jsx b/ui/src/layout/Scans/Scans/ScansTable.jsx
index 75c414aa4..f2276a570 100644
--- a/ui/src/layout/Scans/Scans/ScansTable.jsx
+++ b/ui/src/layout/Scans/Scans/ScansTable.jsx
@@ -113,6 +113,7 @@ const ScansTable = () => {
     <TablePage
       columns={columns}
       url={APIS.SCANS}
+      select="id,name,startTime,endTime,scope,status,summary"
       tableTitle={TABLE_TITLE}
       filterType={FILTER_TYPES.SCANS}
       filtersConfig={[
diff --git a/ui/src/layout/Scans/index.jsx b/ui/src/layout/Scans/index.jsx
index c83f58170..f2d6ee167 100644
--- a/ui/src/layout/Scans/index.jsx
+++ b/ui/src/layout/Scans/index.jsx
@@ -47,8 +47,16 @@ const ScansTabbedPage = () => {
   }, [prevOpenConfigForm, openConfigForm, openDisplayModal]);
 
   const [{ data, error, loading }, fetchData] = useMountMultiFetch([
-    { key: "scans", url: APIS.SCANS },
-    { key: "scanConfigs", url: APIS.SCAN_CONFIGS },
+    {
+      key: "scans",
+      url: APIS.SCANS,
+      queryParams: { $count: true, $select: "count" },
+    },
+    {
+      key: "scanConfigs",
+      url: APIS.SCAN_CONFIGS,
+      queryParams: { $count: true, $select: "count" },
+    },
   ]);
 
   if (loading) {
@@ -63,7 +71,7 @@ const ScansTabbedPage = () => {
 
   return (
     <>
-      {scans?.length === 0 && scanConfigs?.total === 0 ? (
+      {scans?.count === 0 && scanConfigs?.count === 0 ? (
         <EmptyDisplay
           message={
             <>
diff --git a/ui/src/layout/detail-displays/AssetDetails/AssetScansDisplay.jsx b/ui/src/layout/detail-displays/AssetDetails/AssetScansDisplay.jsx
index 308e4fa85..adee34f6b 100644
--- a/ui/src/layout/detail-displays/AssetDetails/AssetScansDisplay.jsx
+++ b/ui/src/layout/detail-displays/AssetDetails/AssetScansDisplay.jsx
@@ -33,7 +33,7 @@ export const AssetScansDisplay = ({ assetName, assetId }) => {
     queryParams: {
       $filter: filter,
       $count: true,
-      $select: "id,asset,summary,scan",
+      $select: "count",
     },
   });