diff --git a/ui/CHANGELOG.md b/ui/CHANGELOG.md
index 31ea8a610a..3ecb4462ed 100644
--- a/ui/CHANGELOG.md
+++ b/ui/CHANGELOG.md
@@ -26,6 +26,7 @@ All notable changes to the **Prowler UI** are documented in this file.
- `Provider UID` filter to scans page [(#7820)](https://github.com/prowler-cloud/prowler/pull/7820)
- Aligned Next.js version to `v14.2.29` across Prowler and Cloud environments for consistency and improved maintainability [(#7962)](https://github.com/prowler-cloud/prowler/pull/7962)
- Refactor credentials forms with reusable components and error handling [(#7988)](https://github.com/prowler-cloud/prowler/pull/7988)
+- Updated the provider details section in Scan and Findings detail pages [(#7968)](https://github.com/prowler-cloud/prowler/pull/7968)
### 🐞 Fixed
diff --git a/ui/components/findings/table/finding-detail.tsx b/ui/components/findings/table/finding-detail.tsx
index e232b2a648..92c7bcb9e1 100644
--- a/ui/components/findings/table/finding-detail.tsx
+++ b/ui/components/findings/table/finding-detail.tsx
@@ -4,9 +4,8 @@ import { Snippet } from "@nextui-org/react";
import Link from "next/link";
import { CodeSnippet } from "@/components/ui/code-snippet/code-snippet";
-import { InfoField } from "@/components/ui/entities";
+import { EntityInfoShort, InfoField } from "@/components/ui/entities";
import { DateWithTime } from "@/components/ui/entities/date-with-time";
-import { getProviderLogo } from "@/components/ui/entities/get-provider-logo";
import { SeverityBadge } from "@/components/ui/table/severity-badge";
import { FindingProps, ProviderType } from "@/types";
@@ -56,7 +55,7 @@ export const FindingDetail = ({
const attributes = finding.attributes;
const resource = finding.relationships.resource.attributes;
const scan = finding.relationships.scan.attributes;
- const provider = finding.relationships.provider.attributes;
+ const providerDetails = finding.relationships.provider.attributes;
return (
@@ -87,11 +86,12 @@ export const FindingDetail = ({
{/* Check Metadata */}
-
- {getProviderLogo(
- attributes.check_metadata.provider as ProviderType,
- )}
-
+
{attributes.check_metadata.servicename}
@@ -259,7 +259,7 @@ export const FindingDetail = ({
{/* Add new Scan Details section */}
- {scan.name}
+ {scan.name || "N/A"}
{scan.unique_resource_count}
@@ -294,31 +294,6 @@ export const FindingDetail = ({
)}
-
- {/* Provider Details section */}
-
-
-
- {getProviderLogo(
- attributes.check_metadata.provider as ProviderType,
- )}
-
- {provider.uid}
-
-
-
- {provider.alias && (
- {provider.alias}
- )}
-
-
- {provider.connection.connected ? "Connected" : "Disconnected"}
-
-
-
-
);
};
diff --git a/ui/components/scans/table/scan-detail.tsx b/ui/components/scans/table/scan-detail.tsx
index f45662b9db..a2bf81c90d 100644
--- a/ui/components/scans/table/scan-detail.tsx
+++ b/ui/components/scans/table/scan-detail.tsx
@@ -2,15 +2,13 @@
import { Snippet } from "@nextui-org/react";
-import { ConnectionTrue } from "@/components/icons";
-import { ConnectionFalse } from "@/components/icons/Icons";
import {
DateWithTime,
EntityInfoShort,
InfoField,
} from "@/components/ui/entities";
import { StatusBadge } from "@/components/ui/table/status-badge";
-import { ProviderProps, ScanProps, TaskDetails } from "@/types";
+import { ProviderProps, ProviderType, ScanProps, TaskDetails } from "@/types";
const renderValue = (value: string | null | undefined) => {
return value && value.trim() !== "" ? value : "-";
@@ -50,6 +48,7 @@ export const ScanDetail = ({
}: {
scanDetails: ScanProps & {
taskDetails?: TaskDetails;
+ // TODO: Remove the "?" once we have a proper provider details type
providerDetails?: ProviderProps;
};
}) => {
@@ -60,12 +59,20 @@ export const ScanDetail = ({
return (
{/* Header */}
-
@@ -127,42 +134,6 @@ export const ScanDetail = ({
-
- {/* Provider Details */}
-
- {providerDetails ? (
-
-
-
- {providerDetails.connection.connected ? (
-
- ) : (
-
- )}
-
-
-
-
-
- ) : (
-
- No provider details available
-
- )}
-
);
};
diff --git a/ui/components/ui/entities/entity-info-short.tsx b/ui/components/ui/entities/entity-info-short.tsx
index 2b2ca7d6f0..6d0a266678 100644
--- a/ui/components/ui/entities/entity-info-short.tsx
+++ b/ui/components/ui/entities/entity-info-short.tsx
@@ -13,6 +13,7 @@ interface EntityInfoProps {
entityId?: string;
hideCopyButton?: boolean;
snippetWidth?: string;
+ showConnectionStatus?: boolean;
}
export const EntityInfoShort: React.FC = ({
@@ -20,11 +21,26 @@ export const EntityInfoShort: React.FC = ({
entityAlias,
entityId,
hideCopyButton = false,
+ showConnectionStatus = false,
}) => {
return (
-
{getProviderLogo(cloudProvider)}
+
+ {getProviderLogo(cloudProvider)}
+ {showConnectionStatus && (
+
+
+
+ )}
+
{entityAlias && (