From 394f2066098aca229b9601c8c60580362b15f7b3 Mon Sep 17 00:00:00 2001
From: Nakul Nagargade <nakul@tooljet.com>
Date: Tue, 18 Feb 2025 10:40:24 +0530
Subject: [PATCH] Add support for handle should still be displayed for hidden
 components in editor mode

---
 .../AppBuilder/AppCanvas/ConfigHandle/ConfigHandle.jsx | 10 ++++++++--
 frontend/src/AppBuilder/AppCanvas/WidgetWrapper.jsx    |  1 -
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/frontend/src/AppBuilder/AppCanvas/ConfigHandle/ConfigHandle.jsx b/frontend/src/AppBuilder/AppCanvas/ConfigHandle/ConfigHandle.jsx
index f0dd4266e4..e3e38999f3 100644
--- a/frontend/src/AppBuilder/AppCanvas/ConfigHandle/ConfigHandle.jsx
+++ b/frontend/src/AppBuilder/AppCanvas/ConfigHandle/ConfigHandle.jsx
@@ -50,7 +50,12 @@ export const ConfigHandle = ({
       className={`config-handle ${customClassName}`}
       widget-id={id}
       style={{
-        top: position === 'top' ? '-20px' : `${height - (CONFIG_HANDLE_HEIGHT + BUFFER_HEIGHT)}px`,
+        top:
+          componentType === 'Modal' && isModalOpen
+            ? '0px'
+            : position === 'top'
+            ? '-20px'
+            : `${height - (CONFIG_HANDLE_HEIGHT + BUFFER_HEIGHT)}px`,
         visibility: _showHandle ? 'visible' : 'hidden',
         left: '-1px',
       }}
@@ -65,7 +70,8 @@ export const ConfigHandle = ({
     >
       <span
         style={{
-          background: componentType === 'Modal' && isModalOpen ? '#c6cad0' : '#4D72FA',
+          background:
+            visibility === false ? '#c6cad0' : componentType === 'Modal' && isModalOpen ? '#c6cad0' : '#4D72FA',
           border: position === 'bottom' ? '1px solid white' : 'none',
         }}
         className="badge handle-content"
diff --git a/frontend/src/AppBuilder/AppCanvas/WidgetWrapper.jsx b/frontend/src/AppBuilder/AppCanvas/WidgetWrapper.jsx
index 9d9cade876..ff22963444 100644
--- a/frontend/src/AppBuilder/AppCanvas/WidgetWrapper.jsx
+++ b/frontend/src/AppBuilder/AppCanvas/WidgetWrapper.jsx
@@ -68,7 +68,6 @@ const WidgetWrapper = memo(
           id={id}
           widgetid={id}
           style={{
-            //   transform: `translate(332px, -134px)`,
             // zIndex: mode === 'view' && widget.component.component == 'Datepicker' ? 2 : null,
             ...styles,
           }}