From 21457d6623afff2b7b1275fef7da547894f5e6ab Mon Sep 17 00:00:00 2001
From: "github-actions[bot]" <github-actions[bot]@users.noreply.github.com>
Date: Thu, 14 Mar 2024 12:33:40 +0000
Subject: [PATCH] loading spinner added; fixed copied popup (#904)

Signed-off-by: Amardeepsingh Siglani <amardeep7194@gmail.com>
(cherry picked from commit 23d8542160f5f0708028765fa34256df028b3093)
Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .../components/CorrelationsTable/CorrelationsTable.tsx | 10 +++++-----
 .../pages/Findings/components/FindingDetailsFlyout.tsx |  9 ++++++---
 2 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/public/pages/Findings/components/CorrelationsTable/CorrelationsTable.tsx b/public/pages/Findings/components/CorrelationsTable/CorrelationsTable.tsx
index c94a7e819..903598a9c 100644
--- a/public/pages/Findings/components/CorrelationsTable/CorrelationsTable.tsx
+++ b/public/pages/Findings/components/CorrelationsTable/CorrelationsTable.tsx
@@ -47,7 +47,7 @@ export const CorrelationsTable: React.FC<CorrelationsTableProps> = ({
   const [itemIdToExpandedRowMap, setItemIdToExpandedRowMap] = useState<{
     [key: string]: JSX.Element;
   }>({});
-  const [findingIdCopied, setFindingIdCopied] = useState(false);
+  const [copiedFindingId, setCopiedFindingId] = useState('');
   const [copyPopoverTimeout, setCopyPopoverTimeout] = useState<number | undefined>(undefined);
 
   const toggleCorrelationDetails = (item: CorrelationFinding) => {
@@ -112,11 +112,11 @@ export const CorrelationsTable: React.FC<CorrelationsTableProps> = ({
     const copyFindingIdToClipboard = (findingId: string) => {
       try {
         window.navigator.clipboard.writeText(findingId);
-        setFindingIdCopied(true);
+        setCopiedFindingId(findingId);
         window.clearTimeout(copyPopoverTimeout);
         setCopyPopoverTimeout(
           window.setTimeout(() => {
-            setFindingIdCopied(false);
+            setCopiedFindingId('');
           }, 1000)
         );
       } catch (error: any) {
@@ -134,8 +134,8 @@ export const CorrelationsTable: React.FC<CorrelationsTableProps> = ({
               iconType="copy"
             />
           }
-          isOpen={findingIdCopied}
-          closePopover={() => setFindingIdCopied(false)}
+          isOpen={copiedFindingId === item.id}
+          closePopover={() => setCopiedFindingId('')}
           anchorPosition="upCenter"
         >
           <EuiText>Finding id copied</EuiText>
diff --git a/public/pages/Findings/components/FindingDetailsFlyout.tsx b/public/pages/Findings/components/FindingDetailsFlyout.tsx
index 1d2950f23..6c65e8a19 100644
--- a/public/pages/Findings/components/FindingDetailsFlyout.tsx
+++ b/public/pages/Findings/components/FindingDetailsFlyout.tsx
@@ -32,6 +32,7 @@ import {
   EuiTab,
   EuiLoadingContent,
   EuiEmptyPrompt,
+  EuiLoadingSpinner,
 } from '@elastic/eui';
 import { capitalizeFirstLetter, renderTime } from '../../../utils/helpers';
 import { DEFAULT_EMPTY_DATA, ROUTES } from '../../../utils/constants';
@@ -581,9 +582,11 @@ export default class FindingDetailsFlyout extends Component<
                   {tab.id === 'Correlations' ? (
                     <>
                       {tab.name} (
-                      {this.state.areCorrelationsLoading
-                        ? DEFAULT_EMPTY_DATA
-                        : this.state.correlatedFindings.length}
+                      {this.state.areCorrelationsLoading ? (
+                        <EuiLoadingSpinner size="s" />
+                      ) : (
+                        this.state.correlatedFindings.length
+                      )}
                       )
                     </>
                   ) : (