From b2ce603fc5278cf3371ecaca84a0c1007ded33ff Mon Sep 17 00:00:00 2001
From: devaskim <dev.devaskim@gmail.com>
Date: Sun, 20 Nov 2022 00:32:32 +0500
Subject: [PATCH] Make possible to hide widget in desktop mod.

---
 .../src/app/core/services/dashboard-utils.service.ts |  3 ++-
 .../dashboard-page/add-widget-dialog.component.ts    |  1 +
 .../components/widget/widget-config.component.html   |  3 +++
 .../components/widget/widget-config.component.ts     |  9 ++++++---
 .../home/models/dashboard-component.models.ts        | 12 ++++++++++--
 ui-ngx/src/app/shared/models/dashboard.models.ts     |  1 +
 ui-ngx/src/app/shared/models/widget.models.ts        |  1 +
 ui-ngx/src/assets/locale/locale.constant-en_US.json  |  1 +
 8 files changed, 25 insertions(+), 6 deletions(-)

diff --git a/ui-ngx/src/app/core/services/dashboard-utils.service.ts b/ui-ngx/src/app/core/services/dashboard-utils.service.ts
index 90238ebaba..ccb7de73b1 100644
--- a/ui-ngx/src/app/core/services/dashboard-utils.service.ts
+++ b/ui-ngx/src/app/core/services/dashboard-utils.service.ts
@@ -395,7 +395,8 @@ export class DashboardUtilsService {
       sizeY: originalSize ? originalSize.sizeY : widget.sizeY,
       mobileOrder: widget.config.mobileOrder,
       mobileHeight: widget.config.mobileHeight,
-      mobileHide: widget.config.mobileHide
+      mobileHide: widget.config.mobileHide,
+      desktopHide: widget.config.desktopHide
     };
     if (isUndefined(originalColumns)) {
       originalColumns = 24;
diff --git a/ui-ngx/src/app/modules/home/components/dashboard-page/add-widget-dialog.component.ts b/ui-ngx/src/app/modules/home/components/dashboard-page/add-widget-dialog.component.ts
index e8fdde15c2..e147866df9 100644
--- a/ui-ngx/src/app/modules/home/components/dashboard-page/add-widget-dialog.component.ts
+++ b/ui-ngx/src/app/modules/home/components/dashboard-page/add-widget-dialog.component.ts
@@ -140,6 +140,7 @@ export class AddWidgetDialogComponent extends DialogComponent<AddWidgetDialogCom
     this.widget.config.mobileOrder = widgetConfig.layout.mobileOrder;
     this.widget.config.mobileHeight = widgetConfig.layout.mobileHeight;
     this.widget.config.mobileHide = widgetConfig.layout.mobileHide;
+    this.widget.config.desktopHide = widgetConfig.layout.desktopHide;
     this.dialogRef.close(this.widget);
   }
 }
diff --git a/ui-ngx/src/app/modules/home/components/widget/widget-config.component.html b/ui-ngx/src/app/modules/home/components/widget/widget-config.component.html
index 70c8586ccd..8ba8cda461 100644
--- a/ui-ngx/src/app/modules/home/components/widget/widget-config.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/widget-config.component.html
@@ -492,6 +492,9 @@
                 <mat-slide-toggle formControlName="mobileHide" (click)="$event.stopPropagation()" fxLayoutAlign="center">
                   {{ 'widget-config.mobile-hide' | translate }}
                 </mat-slide-toggle>
+                <mat-slide-toggle formControlName="desktopHide" (click)="$event.stopPropagation()" fxLayoutAlign="center">
+                  {{ 'widget-config.desktop-hide' | translate }}
+                </mat-slide-toggle>
               </mat-panel-title>
               <mat-panel-description fxLayoutAlign="end center" fxHide.xs translate>
                 widget-config.advanced-settings
diff --git a/ui-ngx/src/app/modules/home/components/widget/widget-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/widget-config.component.ts
index 4661f523c8..b8683741e3 100644
--- a/ui-ngx/src/app/modules/home/components/widget/widget-config.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/widget-config.component.ts
@@ -255,7 +255,8 @@ export class WidgetConfigComponent extends PageComponent implements OnInit, Cont
     this.layoutSettings = this.fb.group({
       mobileOrder: [null, [Validators.pattern(/^-?[0-9]+$/)]],
       mobileHeight: [null, [Validators.min(1), Validators.max(10), Validators.pattern(/^\d*$/)]],
-      mobileHide: [false]
+      mobileHide: [false],
+      desktopHide: [false]
     });
     this.actionsSettings = this.fb.group({
       actionsData: [null, []]
@@ -554,7 +555,8 @@ export class WidgetConfigComponent extends PageComponent implements OnInit, Cont
             {
               mobileOrder: layout.mobileOrder,
               mobileHeight: layout.mobileHeight,
-              mobileHide: layout.mobileHide
+              mobileHide: layout.mobileHide,
+              desktopHide: layout.desktopHide
             },
             {emitEvent: false}
           );
@@ -563,7 +565,8 @@ export class WidgetConfigComponent extends PageComponent implements OnInit, Cont
             {
               mobileOrder: null,
               mobileHeight: null,
-              mobileHide: false
+              mobileHide: false,
+              desktopHide: false
             },
             {emitEvent: false}
           );
diff --git a/ui-ngx/src/app/modules/home/models/dashboard-component.models.ts b/ui-ngx/src/app/modules/home/models/dashboard-component.models.ts
index 33fa5111c5..934fca9278 100644
--- a/ui-ngx/src/app/modules/home/models/dashboard-component.models.ts
+++ b/ui-ngx/src/app/modules/home/models/dashboard-component.models.ts
@@ -116,8 +116,12 @@ export class DashboardWidgets implements Iterable<DashboardWidget> {
   }
 
   get activeDashboardWidgets(): Array<DashboardWidget> {
-    if (this.dashboard.isMobileSize && !this.dashboard.isEdit) {
-      return this.dashboardWidgets.filter(w => !w.mobileHide);
+    if (!this.dashboard.isEdit) {
+      if (this.dashboard.isMobileSize) {
+        return this.dashboardWidgets.filter(w => !w.mobileHide);
+      } else {
+        return this.dashboardWidgets.filter(w => !w.desktopHide);
+      }
     }
     return this.dashboardWidgets;
   }
@@ -358,6 +362,10 @@ export class DashboardWidget implements GridsterItem, IDashboardWidget {
     return this.widgetLayout ? this.widgetLayout.mobileHide === true : false;
   }
 
+  get desktopHide(): boolean {
+    return this.widgetLayout ? this.widgetLayout.desktopHide === true : false;
+  }
+
   set gridsterItemComponent(item: GridsterItemComponentInterface) {
     this.gridsterItemComponentValue = item;
     this.gridsterItemComponentSubject.next(this.gridsterItemComponentValue);
diff --git a/ui-ngx/src/app/shared/models/dashboard.models.ts b/ui-ngx/src/app/shared/models/dashboard.models.ts
index 1869420c56..bf71997e35 100644
--- a/ui-ngx/src/app/shared/models/dashboard.models.ts
+++ b/ui-ngx/src/app/shared/models/dashboard.models.ts
@@ -36,6 +36,7 @@ export interface DashboardInfo extends BaseData<DashboardId>, ExportableEntity<D
 export interface WidgetLayout {
   sizeX?: number;
   sizeY?: number;
+  desktopHide?: boolean;
   mobileHide?: boolean;
   mobileHeight?: number;
   mobileOrder?: number;
diff --git a/ui-ngx/src/app/shared/models/widget.models.ts b/ui-ngx/src/app/shared/models/widget.models.ts
index 92b977e346..72d11626cb 100644
--- a/ui-ngx/src/app/shared/models/widget.models.ts
+++ b/ui-ngx/src/app/shared/models/widget.models.ts
@@ -606,6 +606,7 @@ export interface WidgetConfig {
   showLegend?: boolean;
   legendConfig?: LegendConfig;
   timewindow?: Timewindow;
+  desktopHide?: boolean;
   mobileHide?: boolean;
   mobileHeight?: number;
   mobileOrder?: number;
diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json
index 3f3f70860f..0e6b053886 100644
--- a/ui-ngx/src/assets/locale/locale.constant-en_US.json
+++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json
@@ -3685,6 +3685,7 @@
         "order": "Order",
         "height": "Height",
         "mobile-hide": "Hide widget in mobile mode",
+        "desktop-hide": "Hide widget in desktop mode",
         "units": "Special symbol to show next to value",
         "decimals": "Number of digits after floating point",
         "timewindow": "Timewindow",