Add total certificates downloaded and info dialog about processing er…

…ror to discovery detail page (#814)
CZERTAINLY · Dec 9, 2024 · e942ad2 · e942ad2
1 parent 4d583c1
commit e942ad2
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 19 deletions.
diff --git a/src/components/_pages/discoveries/detail/DiscoveryCertificates.tsx b/src/components/_pages/discoveries/detail/DiscoveryCertificates.tsx
@@ -1,18 +1,21 @@
 import { TableDataRow, TableHeader } from 'components/CustomTable';
 
 import Widget from 'components/Widget';
+import Dialog from 'components/Dialog';
 
 import { actions, selectors } from 'ducks/discoveries';
 import { useCallback, useMemo, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { Link } from 'react-router-dom';
+import { Button } from 'reactstrap';
 
 import { TriggerHistorySummaryModel } from 'types/rules';
 import { dateFormatter } from 'utils/dateUtil';
 import PagedCustomTable from '../../../CustomTable/PagedCustomTable';
 import TabLayout from '../../../Layout/TabLayout';
 import TriggerHistorySummaryViewer from './TriggerHistorySummaryViewer';
 import styles from './discoveryCertificates.module.scss';
+
 interface Props {
     id: string;
     triggerHistorySummary?: TriggerHistorySummaryModel;
@@ -25,6 +28,8 @@ export default function DiscoveryCertificates({ id, triggerHistorySummary }: Pro
     const isFetchingDiscoveryCertificates = useSelector(selectors.isFetchingDiscoveryCertificates);
 
     const [newlyDiscovered, setNewlyDiscovered] = useState<boolean | undefined>(undefined);
+    const [showMessage, setShowMessage] = useState<boolean>(false);
+    const [message, setMessage] = useState<string>();
 
     const onReloadData = useCallback(
         (pageSize: number, pageNumber: number) => {
@@ -73,6 +78,10 @@ export default function DiscoveryCertificates({ id, triggerHistorySummary }: Pro
                 id: 'triggers',
                 content: 'Triggers',
             });
+            discoveryHeaders.push({
+                id: 'errorInfo',
+                content: '',
+            });
         }
 
         return discoveryHeaders;
@@ -100,6 +109,21 @@ export default function DiscoveryCertificates({ id, triggerHistorySummary }: Pro
                         ) : (
                             ''
                         ),
+                        r.processedError ? (
+                            <Button
+                                color="white"
+                                size="sm"
+                                className="p-1"
+                                onClick={() => {
+                                    setMessage(r.processedError ?? '');
+                                    setShowMessage(true);
+                                }}
+                            >
+                                <i className="fa fa-info-circle"></i>
+                            </Button>
+                        ) : (
+                            ''
+                        ),
                     );
                 }
                 return {
@@ -131,6 +155,14 @@ export default function DiscoveryCertificates({ id, triggerHistorySummary }: Pro
                 ]}
                 onlyActiveTabContent={true}
             />
+            <Dialog
+                isOpen={showMessage}
+                size={'lg'}
+                caption="Processing error"
+                body={message}
+                toggle={() => setShowMessage(false)}
+                buttons={[{ color: 'primary', onClick: () => setShowMessage(false), body: 'Close' }]}
+            />
         </Widget>
     );
 }
diff --git a/src/components/_pages/discoveries/detail/index.tsx b/src/components/_pages/discoveries/detail/index.tsx
@@ -45,11 +45,6 @@ export default function DiscoveryDetail() {
     const resourceTypeEnum = useSelector(enumSelectors.platformEnum(PlatformEnum.Resource));
     const triggerTypeEnum = useSelector(enumSelectors.platformEnum(PlatformEnum.TriggerType));
 
-    // useEffect(() => {
-    //     if (!id) return;
-    //     dispatch(rulesActions.getTriggerHistorySummary({ triggerObjectUuid: id }));
-    // }, [id, dispatch]);
-
     const getFreshTriggerHistorySummary = useCallback(() => {
         if (!id) return;
         dispatch(rulesActions.getTriggerHistorySummary({ triggerObjectUuid: id }));
@@ -169,7 +164,11 @@ export default function DiscoveryDetail() {
                       },
                       {
                           id: 'totalCertificatesDiscovered',
-                          columns: ['Total Certificates Discovered', discovery.totalCertificatesDiscovered?.toString() || '0'],
+                          columns: ['Total Certificates Discovered', discovery.connectorTotalCertificatesDiscovered?.toString() || '0'],
+                      },
+                      {
+                          id: 'totalCertificatesDownloaded',
+                          columns: ['Total Certificates Downloaded', discovery.totalCertificatesDiscovered?.toString() || '0'],
                       },
                       {
                           id: 'message',

diff --git a/src/utils/dateUtil.tsx b/src/utils/dateUtil.tsx
@@ -27,11 +27,12 @@ export function timeFormatter(date: any): string {
     try {
         const dateObj = new Date(date);
 
+        const days = Math.floor(dateObj.getTime() / (1000 * 60 * 60 * 24));
         const hours = leading0(dateObj.getUTCHours().toString(), 2);
         const minutes = leading0(dateObj.getMinutes().toString(), 2);
         const seconds = leading0(dateObj.getSeconds().toString(), 2);
 
-        return `${hours}:${minutes}:${seconds}`;
+        return days > 0 ? `${leading0(days.toString(), 2)}.${hours}:${minutes}:${seconds}` : `${hours}:${minutes}:${seconds}`;
     } catch (error) {
         console.debug('Unable to convert the given time to date object');
         return date;
@@ -50,17 +51,6 @@ export function dateFormatter(date: any): string {
         const seconds = leading0(dateObj.getSeconds().toString(), 2);
 
         return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
-
-        /*
-      return new Intl.DateTimeFormat("en-GB", {
-         year: "numeric",
-         month: "2-digit",
-         day: "2-digit",
-         hour: "numeric",
-         minute: "numeric",
-         second: "numeric",
-      }).format(new Date(date));
-      */
     } catch (error) {
         console.debug('Unable to convert the given date to date object');
         return date;
@@ -164,7 +154,6 @@ export function getFormattedDate(dateString: string): string {
     return formattedDate;
 }
 
-// type formatType = 'datetime' | 'date' | 'time';
 export function getFormattedUtc(type: AttributeContentType | FilterFieldType, dateString: string): string {
     if (type === 'datetime') {
         const date = new Date(dateString);