add is empty function

solarwinds · Jul 22, 2024 · 09b2aab · 09b2aab
1 parent 1dc6b1e
commit 09b2aab
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 11 deletions.
diff --git a/packages/dashboards/src/lib/components/kpi-widget/kpi.component.html b/packages/dashboards/src/lib/components/kpi-widget/kpi.component.html
@@ -3,11 +3,7 @@
         <a class="nui-kpi-indicator" [href]="widgetData.link">
             <ng-container [ngTemplateOutlet]="kpiContent">
                 <div
-                    *ngIf="
-                        !widgetData?.value &&
-                        !widgetData?.label &&
-                        !widgetData?.units
-                    "
+                    *ngIf="isEmpty()"
                     class="is-empty"
                 >
                     <nui-image image="no-data-to-show"></nui-image>
@@ -20,11 +16,7 @@
         <div class="nui-kpi-indicator" (click)="onInteraction()">
             <ng-container [ngTemplateOutlet]="kpiContent">
                 <div
-                    *ngIf="
-                        !widgetData?.value &&
-                        !widgetData?.label &&
-                        !widgetData?.units
-                    "
+                    *ngIf="isEmpty()"
                     class="is-empty"
                 >
                     <nui-image image="no-data-to-show"></nui-image>
@@ -36,7 +28,7 @@
 
 <ng-template #kpiContent>
     <div
-        *ngIf="widgetData?.value || widgetData?.label || widgetData?.units"
+        *ngIf="!isEmpty()"
         class="nui-kpi-indicator__background"
         [class.nui-kpi-indicator--interactive]="interactive"
         [ngStyle]="{

diff --git a/packages/dashboards/src/lib/components/kpi-widget/kpi.component.ts b/packages/dashboards/src/lib/components/kpi-widget/kpi.component.ts
@@ -134,6 +134,12 @@ export class KpiComponent implements IHasChangeDetector, OnChanges {
         }
     }
 
+    public isEmpty(): boolean {
+        return (!this.widgetData?.value) || (
+                (Array.isArray(this.widgetData?.value) && this.widgetData?.value.length === 0)
+        );
+    }
+
     /**
      * Iterates over formatters and maps their properties from the data
      *