feat(dashboard): improve overview page (#8118)

2025-12-19 05:17:47 +00:00 · 2025-06-27 09:41:48 +02:00
parent cd804836a1
commit 2e97e37316
5 changed files with 110 additions and 36 deletions
--- a/dashboard/lib/cards.py
+++ b/dashboard/lib/cards.py
@@ -4,7 +4,10 @@ from dash import html


 def create_provider_card(
-    provider: str, provider_logo: str, account_type: str, filtered_data
+    provider: str,
+    provider_logo: str,
+    account_type: str,
+    filtered_data,
 ) -> List[html.Div]:
    """
    Card to display the provider's name and icon.
--- a/dashboard/lib/dropdowns.py
+++ b/dashboard/lib/dropdowns.py
@@ -245,6 +245,31 @@ def create_service_dropdown(services: list) -> html.Div:
    )


+def create_provider_dropdown(providers: list) -> html.Div:
+    """
+    Dropdown to select the provider.
+    Args:
+        providers (list): List of providers.
+    Returns:
+        html.Div: Dropdown to select the provider.
+    """
+    return html.Div(
+        [
+            html.Label(
+                "Provider:", className="text-prowler-stone-900 font-bold text-sm"
+            ),
+            dcc.Dropdown(
+                id="provider-filter",
+                options=[{"label": i, "value": i} for i in providers],
+                value=["All"],
+                clearable=False,
+                multi=True,
+                style={"color": "#000000"},
+            ),
+        ],
+    )
+
+
 def create_status_dropdown(status: list) -> html.Div:
    """
    Dropdown to select the status.
--- a/dashboard/lib/layouts.py
+++ b/dashboard/lib/layouts.py
@@ -9,9 +9,11 @@ def create_layout_overview(
    download_button_xlsx: html.Button,
    severity_dropdown: html.Div,
    service_dropdown: html.Div,
+    provider_dropdown: html.Div,
    table_row_dropdown: html.Div,
    status_dropdown: html.Div,
    table_div_header: html.Div,
+    amount_providers: int,
 ) -> html.Div:
    """
    Create the layout of the dashboard.
@@ -47,9 +49,10 @@ def create_layout_overview(
                [
                    html.Div([severity_dropdown], className=""),
                    html.Div([service_dropdown], className=""),
+                    html.Div([provider_dropdown], className=""),
                    html.Div([status_dropdown], className=""),
                ],
-                className="grid gap-x-4 mb-[30px] sm:grid-cols-2 lg:grid-cols-3",
+                className="grid gap-x-4 mb-[30px] sm:grid-cols-2 lg:grid-cols-4",
            ),
            html.Div(
                [
@@ -59,7 +62,7 @@ def create_layout_overview(
                    html.Div(className="flex", id="k8s_card", n_clicks=0),
                    html.Div(className="flex", id="m365_card", n_clicks=0),
                ],
-                className="grid gap-x-4 mb-[30px] sm:grid-cols-2 lg:grid-cols-5",
+                className=f"grid gap-x-4 mb-[30px] sm:grid-cols-2 lg:grid-cols-{amount_providers}",
            ),
            html.H4(
                "Count of Findings by severity",
--- a/dashboard/pages/overview.py
+++ b/dashboard/pages/overview.py
@@ -38,6 +38,7 @@ from dashboard.lib.cards import create_provider_card
 from dashboard.lib.dropdowns import (
    create_account_dropdown,
    create_date_dropdown,
+    create_provider_dropdown,
    create_region_dropdown,
    create_service_dropdown,
    create_severity_dropdown,
@@ -298,6 +299,13 @@ else:

    service_dropdown = create_service_dropdown(services)

+    # Provider Dropdown
+    providers = ["All"] + list(data["PROVIDER"].unique())
+    providers = [
+        x for x in providers if str(x) != "nan" and x.__class__.__name__ == "str"
+    ]
+    provider_dropdown = create_provider_dropdown(providers)
+
    # Create the download button
    download_button_csv = html.Button(
        "Download this table as CSV",
@@ -479,9 +487,11 @@ else:
        download_button_xlsx,
        severity_dropdown,
        service_dropdown,
+        provider_dropdown,
        table_row_dropdown,
        status_dropdown,
        table_div_header,
+        len(data["PROVIDER"].unique()),
    )


@@ -508,6 +518,8 @@ else:
        Output("severity-filter", "value"),
        Output("severity-filter", "options"),
        Output("service-filter", "value"),
+        Output("provider-filter", "value"),
+        Output("provider-filter", "options"),
        Output("service-filter", "options"),
        Output("table-rows", "value"),
        Output("table-rows", "options"),
@@ -526,6 +538,7 @@ else:
    Input("download_link_xlsx", "n_clicks"),
    Input("severity-filter", "value"),
    Input("service-filter", "value"),
+    Input("provider-filter", "value"),
    Input("table-rows", "value"),
    Input("status-filter", "value"),
    Input("search-input", "value"),
@@ -549,6 +562,7 @@ def filter_data(
    n_clicks_xlsx,
    severity_values,
    service_values,
+    provider_values,
    table_row_values,
    status_values,
    search_value,
@@ -874,6 +888,25 @@ def filter_data(
        filtered_data["SERVICE_NAME"].isin(updated_service_values)
    ]

+    provider_filter_options = ["All"] + list(filtered_data["PROVIDER"].unique())
+
+    # Filter Provider
+    if provider_values == ["All"]:
+        updated_provider_values = filtered_data["PROVIDER"].unique()
+    elif "All" in provider_values and len(provider_values) > 1:
+        # Remove 'All' from the list
+        provider_values.remove("All")
+        updated_provider_values = provider_values
+    elif len(provider_values) == 0:
+        updated_provider_values = filtered_data["PROVIDER"].unique()
+        provider_values = ["All"]
+    else:
+        updated_provider_values = provider_values
+
+    filtered_data = filtered_data[
+        filtered_data["PROVIDER"].isin(updated_provider_values)
+    ]
+
    # Filter Status
    if status_values == ["All"]:
        updated_status_values = filtered_data["STATUS"].unique()
@@ -1094,25 +1127,17 @@ def filter_data(

        table_row_options = []

-        # Take the values from the table_row_values
+        # Calculate table row options as percentages
+        percentages = [0.05, 0.10, 0.25, 0.50, 0.75, 1.0]
+        total_rows = len(filtered_data)
+        for pct in percentages:
+            value = max(1, int(total_rows * pct))
+            label = f"{int(pct * 100)}%"
+            table_row_options.append({"label": label, "value": value})
+
+        # Default to 25% if not set
        if table_row_values is None or table_row_values == -1:
-            if len(filtered_data) < 25:
-                table_row_values = len(filtered_data)
-            else:
-                table_row_values = 25
-
-        if len(filtered_data) < 25:
-            table_row_values = len(filtered_data)
-
-        if len(filtered_data) >= 25:
-            table_row_options.append(25)
-        if len(filtered_data) >= 50:
-            table_row_options.append(50)
-        if len(filtered_data) >= 75:
-            table_row_options.append(75)
-        if len(filtered_data) >= 100:
-            table_row_options.append(100)
-        table_row_options.append(len(filtered_data))
+            table_row_values = table_row_options[0]["value"]

        # For the values that are nan or none, replace them with ""
        filtered_data = filtered_data.replace({np.nan: ""})
@@ -1347,21 +1372,36 @@ def filter_data(
    ]

    # Create Provider Cards
-    aws_card = create_provider_card(
-        "aws", aws_provider_logo, "Accounts", full_filtered_data
-    )
-    azure_card = create_provider_card(
-        "azure", azure_provider_logo, "Subscriptions", full_filtered_data
-    )
-    gcp_card = create_provider_card(
-        "gcp", gcp_provider_logo, "Projects", full_filtered_data
-    )
-    k8s_card = create_provider_card(
-        "kubernetes", ks8_provider_logo, "Clusters", full_filtered_data
-    )
-    m365_card = create_provider_card(
-        "m365", m365_provider_logo, "Accounts", full_filtered_data
-    )
+    if "aws" in list(data["PROVIDER"].unique()):
+        aws_card = create_provider_card(
+            "aws", aws_provider_logo, "Accounts", full_filtered_data
+        )
+    else:
+        aws_card = None
+    if "azure" in list(data["PROVIDER"].unique()):
+        azure_card = create_provider_card(
+            "azure", azure_provider_logo, "Subscriptions", full_filtered_data
+        )
+    else:
+        azure_card = None
+    if "gcp" in list(data["PROVIDER"].unique()):
+        gcp_card = create_provider_card(
+            "gcp", gcp_provider_logo, "Projects", full_filtered_data
+        )
+    else:
+        gcp_card = None
+    if "kubernetes" in list(data["PROVIDER"].unique()):
+        k8s_card = create_provider_card(
+            "kubernetes", ks8_provider_logo, "Clusters", full_filtered_data
+        )
+    else:
+        k8s_card = None
+    if "m365" in list(data["PROVIDER"].unique()):
+        m365_card = create_provider_card(
+            "m365", m365_provider_logo, "Accounts", full_filtered_data
+        )
+    else:
+        m365_card = None

    # Subscribe to Prowler Cloud card
    subscribe_card = [
@@ -1445,6 +1485,8 @@ def filter_data(
            severity_values,
            severity_filter_options,
            service_values,
+            provider_values,
+            provider_filter_options,
            service_filter_options,
            table_row_values,
            table_row_options,
--- a/prowler/CHANGELOG.md
+++ b/prowler/CHANGELOG.md
@@ -37,6 +37,7 @@ All notable changes to the **Prowler SDK** are documented in this file.
 - Azure Databricks service integration for Azure provider, including the `databricks_workspace_vnet_injection_enabled` check [(#8008)](https://github.com/prowler-cloud/prowler/pull/8008)
 - Azure Databricks check `databricks_workspace_cmk_encryption_enabled` to ensure workspaces use customer-managed keys (CMK) for encryption at rest [(#8017)](https://github.com/prowler-cloud/prowler/pull/8017)
 - Add `storage_account_default_to_entra_authorization_enabled` check for Azure provider. [(#7981)](https://github.com/prowler-cloud/prowler/pull/7981)
+- Improve overview page from Prowler Dashboard [(#8118)](https://github.com/prowler-cloud/prowler/pull/8118)
 - `keyvault_ensure_public_network_access_disabled` check for Azure provider. [(#8072)](https://github.com/prowler-cloud/prowler/pull/8072)
 - New check `monitor_alert_service_health_exists` for Azure provider [(#8067)](https://github.com/prowler-cloud/prowler/pull/8067)
 - Replace `Domain.Read.All` with `Directory.Read.All` in Azure and M365 docs [(#8075)](https://github.com/prowler-cloud/prowler/pull/8075)