Bugfix/oo 31815 empty widget (#705)

* update proportional widget * Update kpi.component.html * kpi show empty if is empty * update proportional widget * prettier code * Update .editorconfig to fix prettier new lines lf -> crlf * commit signed with gpg key of different account * Update .editorconfig * Ensure all text files use platform-native line endings * Delete .editorconfig * Update .gitattributes * Update .gitattributes * return editorconfig to its previous version * Update pull_request_template.md * Update CHANGELOG.md * Update pull_request_template.md
solarwinds · Jul 18, 2024 · 19977ba · 19977ba
1 parent 84f2f60
commit 19977ba
Show file tree

Hide file tree

Showing 7 changed files with 44 additions and 9 deletions.
diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
@@ -4,10 +4,10 @@
 
 ## Checklist
 
-- [ ] My code follows the [style guidelines](https://github.com/solarwinds/nova/blob/2415fa06f8242b9024beee04e2456055d31ab118/docs/STYLE_GUIDE.md) of this project
+- [ ] My code follows the [style guidelines](https://github.com/solarwinds/nova/blob/main/docs/STYLE_GUIDE.md) of this project
 - [ ] I have performed a self-review of my code
-- [ ] I have updated [change log](https://github.com/solarwinds/nova/blob/2415fa06f8242b9024beee04e2456055d31ab118/docs/CHANGELOG.md#L4)
-- [ ] I have been following [Definition of done](https://github.com/solarwinds/nova/blob/2415fa06f8242b9024beee04e2456055d31ab118/docs/DEFINITION_OF_DONE.md)
+- [ ] I have updated [change log](https://github.com/solarwinds/nova/blob/main/docs/CHANGELOG.md)
+- [ ] I have been following [Definition of done](https://github.com/solarwinds/nova/blob/main/docs/DEFINITION_OF_DONE.md)
 - [ ] I have commented my code, particularly in hard-to-understand areas
 - [ ] My changes generate no new lint warnings
 - [ ] New and existing unit tests pass locally and on CI with my changes

diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md
@@ -1,12 +1,13 @@
 # Changelog
 
-## [15.0.8] 2024-06-03
+## [15.0.8] 📅 2024-06-03
 
 ### Bugfix
 
 - `@nova-ui/dashboards` | Added missing empty image for _nuiListWidgetComponent_ with no data.
+- `@nova-ui/dashboards` | Added missing empty image for all Empty widgets.
 
-## [15.0.6] 2024-05-13
+## [15.0.6] 📅 2024-05-13
 
 ### Bugfix
 

diff --git a/packages/dashboards/.editorconfig b/packages/dashboards/.editorconfig
diff --git a/packages/dashboards/src/lib/components/kpi-widget/kpi.component.html b/packages/dashboards/src/lib/components/kpi-widget/kpi.component.html
@@ -1,19 +1,42 @@
 <div class="w-100 h-100" nui-busy [busy]="busy">
     <ng-container *ngIf="widgetData?.link">
         <a class="nui-kpi-indicator" [href]="widgetData.link">
-            <ng-container [ngTemplateOutlet]="kpiContent"></ng-container>
+            <ng-container [ngTemplateOutlet]="kpiContent">
+                <div
+                    *ngIf="
+                        !widgetData?.value &&
+                        !widgetData?.label &&
+                        !widgetData?.units
+                    "
+                    class="is-empty"
+                >
+                    <nui-image image="no-data-to-show"></nui-image>
+                </div>
+            </ng-container>
         </a>
     </ng-container>
 
     <ng-container *ngIf="!widgetData?.link">
         <div class="nui-kpi-indicator" (click)="onInteraction()">
-            <ng-container [ngTemplateOutlet]="kpiContent"></ng-container>
+            <ng-container [ngTemplateOutlet]="kpiContent">
+                <div
+                    *ngIf="
+                        !widgetData?.value &&
+                        !widgetData?.label &&
+                        !widgetData?.units
+                    "
+                    class="is-empty"
+                >
+                    <nui-image image="no-data-to-show"></nui-image>
+                </div>
+            </ng-container>
         </div>
     </ng-container>
 </div>
 
 <ng-template #kpiContent>
     <div
+        *ngIf="widgetData?.value || widgetData?.label || widgetData?.units"
         class="nui-kpi-indicator__background"
         [class.nui-kpi-indicator--interactive]="interactive"
         [ngStyle]="{

diff --git a/packages/dashboards/src/lib/components/kpi-widget/kpi.component.less b/packages/dashboards/src/lib/components/kpi-widget/kpi.component.less
@@ -95,3 +95,9 @@
         }
     }
 }
+
+.is-empty {
+    display: grid;
+    place-content: center;
+    height: 100%;
+}
diff --git a/...ages/dashboards/src/lib/components/proportional-widget/proportional-widget.component.html b/...ages/dashboards/src/lib/components/proportional-widget/proportional-widget.component.html
@@ -173,7 +173,7 @@
     </div>
     <div
         *ngIf="!widgetData || widgetData.length === 0 || !chartAssist"
-        class="mb-3 mt-3 d-flex align-items-center justify-content-center"
+        class="is-empty"
     >
         <nui-image image="no-data-to-show"></nui-image>
     </div>

diff --git a/...ages/dashboards/src/lib/components/proportional-widget/proportional-widget.component.less b/...ages/dashboards/src/lib/components/proportional-widget/proportional-widget.component.less
@@ -72,3 +72,9 @@
         }
     }
 }
+
+.is-empty {
+    display: grid;
+    place-content: center;
+    height: 100%;
+}