From e7de10ed07dec344dc64e87797237c3681020bce Mon Sep 17 00:00:00 2001
From: alphaeusmote <41258468-alphaeusmote@users.noreply.replit.com>
Date: Thu, 10 Apr 2025 03:55:42 +0000
Subject: [PATCH] Improve dynamic group condition builder drag-and-drop
 functionality.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 705f2157-ef97-4fbd-89e4-8c7f2ecaea90
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/7ed01c5f-a82d-405a-b728-b2e3d127c60c/0afec5d6-14a7-4a75-a992-77626cc2d610.jpg
---
 .../components/dynamic-groups/condition-builder.tsx  | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/client/src/components/dynamic-groups/condition-builder.tsx b/client/src/components/dynamic-groups/condition-builder.tsx
index 2ef1d18..17ca43a 100644
--- a/client/src/components/dynamic-groups/condition-builder.tsx
+++ b/client/src/components/dynamic-groups/condition-builder.tsx
@@ -325,7 +325,7 @@ const ConditionBuilder: React.FC<ConditionBuilderProps> = ({
                 const originalIndex = conditions.findIndex(c => c === child);
                 return child.isGroup 
                   ? renderConditionGroup(child, originalIndex, level + 1) 
-                  : renderCondition(child, originalIndex, level + 1);
+                  : <SortableItem condition={child} index={originalIndex} level={level + 1} />;
               })
             )}
           </div>
@@ -394,8 +394,14 @@ const ConditionBuilder: React.FC<ConditionBuilderProps> = ({
   ) => {
     return (
       <div 
-        className="grid grid-cols-12 gap-2 items-center mb-2 border border-transparent hover:border-border p-2 rounded-md"
+        className="grid grid-cols-13 gap-2 items-center mb-2 border border-transparent hover:border-border p-2 rounded-md"
       >
+        <div 
+          className="col-span-1 cursor-grab flex items-center justify-center" 
+          {...listeners}
+        >
+          <Move className="h-4 w-4 text-muted-foreground" />
+        </div>
         {index > 0 && !condition.isGroup && condition.parentId === conditions[index-1].parentId && (
           <div className="col-span-1">
             <Select
@@ -529,7 +535,7 @@ const ConditionBuilder: React.FC<ConditionBuilderProps> = ({
                   condition.parentId === null || condition.parentId === undefined ? (
                     condition.isGroup ? 
                       renderConditionGroup(condition, index) : 
-                      renderCondition(condition, index)
+                      <SortableItem condition={condition} index={index} />
                   ) : null
                 ))}
               </div>