From 61029fd0e0fa70bddfb9936aac087c96334c716b Mon Sep 17 00:00:00 2001
From: Igor Kulikov <ikulikov@thingsboard.io>
Date: Mon, 14 Oct 2024 11:11:27 +0300
Subject: [PATCH] Fix overlapping widgets when changing layout columns count

---
 .../core/services/dashboard-utils.service.ts    | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 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 ef51868fa9..f0341410bc 100644
--- a/ui-ngx/src/app/core/services/dashboard-utils.service.ts
+++ b/ui-ngx/src/app/core/services/dashboard-utils.service.ts
@@ -749,17 +749,24 @@ export class DashboardUtilsService {
         widget.sizeY = 1;
       }
     }
+    const widgets: WidgetLayout[] = [];
     for (const w of Object.keys(layout.widgets)) {
       const widget = layout.widgets[w];
       widget.row = Math.round(widget.row * ratio);
       widget.col = Math.round(widget.col * ratio);
       widget.sizeX = Math.max(1, Math.round(widget.sizeX * ratio));
       widget.sizeY = Math.max(1, Math.round(widget.sizeY * ratio));
+      widgets.push(widget);
     }
-    for (const w of Object.keys(layout.widgets)) {
-      const widget = layout.widgets[w];
-      for (const w2 of Object.keys(layout.widgets)) {
-        const widget2 = layout.widgets[w2];
+    widgets.sort((w1, w2) => {
+      let res = w1.col - w2.col;
+      if (res === 0) {
+        res = w1.row - w2.row;
+      }
+      return res;
+    });
+    for (const widget of widgets) {
+      for (const widget2 of widgets) {
         if (widget !== widget2) {
           const left = widget.col;
           const right = widget.col + widget.sizeX;
@@ -770,7 +777,7 @@ export class DashboardUtilsService {
           const top2 = widget2.row;
           const bottom2 = widget2.row + widget2.sizeY;
           if (left < right2 && right > left2 &&
-            top > bottom2 && bottom < top2 ) {
+            top < bottom2 && bottom > top2 ) {
             let horizontalOverlapFixed = false;
             if (right - left2 === 1) {
               if (widget.sizeX > 1) {