From d5672730c17907fd5edba7e8d85d65ed688571da Mon Sep 17 00:00:00 2001
From: Kavin Venkatachalam <kavin.saratha@gmail.com>
Date: Thu, 18 Jan 2024 12:34:39 +0530
Subject: [PATCH] Placed components inside the listView if it is dropped
 outside the first row

---
 frontend/src/Editor/SubContainer.jsx | 34 +++++++++++++++++++++++++++-
 1 file changed, 33 insertions(+), 1 deletion(-)

diff --git a/frontend/src/Editor/SubContainer.jsx b/frontend/src/Editor/SubContainer.jsx
index 45b110408b..df462db1da 100644
--- a/frontend/src/Editor/SubContainer.jsx
+++ b/frontend/src/Editor/SubContainer.jsx
@@ -158,6 +158,34 @@ export const SubContainer = ({
 
   const containerWidth = getContainerCanvasWidth();
 
+  const placeComponentInsideListView = (newComponent, canvasBoundingRect) => {
+    const layout = newComponent?.layout?.desktop;
+    if (layout && canvasBoundingRect.height <= layout.top) {
+      let newTop = canvasBoundingRect.height - layout.height,
+        newHeight = layout.height;
+      if (newTop < 0) {
+        newTop = 0;
+        newHeight = canvasBoundingRect.height;
+      }
+      return {
+        ...newComponent,
+        layout: {
+          desktop: {
+            ...layout,
+            top: newTop,
+            height: newHeight,
+          },
+          mobile: {
+            ...layout,
+            top: newTop,
+            height: newHeight,
+          },
+        },
+      };
+    }
+    return newComponent;
+  };
+
   useEffect(() => {
     setSubContainerWidths(parent, containerWidth / noOfGrids);
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -367,7 +395,7 @@ export const SubContainer = ({
               : 'Kanban_card'
             : parentComponent.component;
         if (!restrictedWidgetsObj[parentComp].includes(componentMeta?.component)) {
-          const newComponent = addNewWidgetToTheEditor(
+          let newComponent = addNewWidgetToTheEditor(
             componentMeta,
             monitor,
             boxes,
@@ -378,6 +406,10 @@ export const SubContainer = ({
             true
           );
 
+          if (parentComp === 'Listview') {
+            newComponent = placeComponentInsideListView(newComponent, canvasBoundingRect);
+          }
+
           setBoxes({
             ...boxes,
             [newComponent.id]: {