Merge pull request #20 from techops-services/revert-15-KEEP-1149-minikube-deployment

Revert "KEEP-1149 minikube local deployment option"

Author: eskp

README.md

@@ -79,7 +79,6 @@ Visit [http://localhost:3000](http://localhost:3000) to get started.
 ### Action Nodes
 
 <!-- PLUGINS:START - Do not remove. Auto-generated by discover-plugins -->
-- **Clerk**: Get User, Create User, Update User, Delete User
 - **Resend**: Send Email
 - **Slack**: Send Slack Message
 - **v0**: Create Chat, Send Message

app/globals.css

@@ -211,20 +211,14 @@
   z-index: 20 !important;
 }
 
-/* Invisible hit area for desktop */
-.react-flow__handle::after {
-  content: "" !important;
-  position: absolute !important;
-  top: 50% !important;
-  left: 50% !important;
-  transform: translate(-50%, -50%) !important;
-  width: 24px !important;
-  height: 24px !important;
-}
-
-/* Invisible hit area for mobile with WCAG minimum target size */
+/* Increase hit area on mobile without changing visual size */
 @media (max-width: 768px) {
   .react-flow__handle::after {
+    content: "" !important;
+    position: absolute !important;
+    top: 50% !important;
+    left: 50% !important;
+    transform: translate(-50%, -50%) !important;
     width: 44px !important;
     height: 44px !important;
   }

components/workflow/workflow-canvas.tsx

@@ -101,7 +101,6 @@ export function WorkflowCanvas() {
     useReactFlow();
 
   const connectingNodeId = useRef<string | null>(null);
-  const connectingHandleType = useRef<"source" | "target" | null>(null);
   const justCreatedNodeFromConnection = useRef(false);
   const viewportInitialized = useRef(false);
   const [isCanvasReady, setIsCanvasReady] = useState(false);
@@ -228,27 +227,6 @@ export function WorkflowCanvas() {
     []
   );
 
-  const nodeHasHandle = useCallback(
-    (nodeId: string, handleType: "source" | "target") => {
-      const node = nodes.find((n) => n.id === nodeId);
-
-      if (!node) {
-        return false;
-      }
-
-      if (node.type === "add") {
-        return false;
-      }
-
-      if (handleType === "target") {
-        return node.type !== "trigger";
-      }
-
-      return true;
-    },
-    [nodes]
-  );
-
   const isValidConnection = useCallback(
     (connection: XYFlowConnection | XYFlowEdge) => {
       // Ensure we have both source and target
@@ -294,7 +272,6 @@ export function WorkflowCanvas() {
   const onConnectStart = useCallback(
     (_event: MouseEvent | TouchEvent, params: OnConnectStartParams) => {
       connectingNodeId.current = params.nodeId;
-      connectingHandleType.current = params.handleType;
     },
     []
   );
@@ -329,125 +306,6 @@ export function WorkflowCanvas() {
     []
   );
 
-  const handleConnectionToExistingNode = useCallback(
-    (nodeElement: Element) => {
-      const targetNodeId = nodeElement.getAttribute("data-id");
-      const fromSource = connectingHandleType.current === "source";
-      const requiredHandle = fromSource ? "target" : "source";
-      const connectingId = connectingNodeId.current;
-
-      if (
-        targetNodeId &&
-        connectingId &&
-        targetNodeId !== connectingId &&
-        nodeHasHandle(targetNodeId, requiredHandle)
-      ) {
-        const sourceId = fromSource ? connectingId : targetNodeId;
-        const targetId = fromSource ? targetNodeId : connectingId;
-        onConnect({
-          source: sourceId,
-          target: targetId,
-          sourceHandle: null,
-          targetHandle: null,
-        });
-      }
-    },
-    [nodeHasHandle, onConnect]
-  );
-
-  const handleConnectionToNewNode = useCallback(
-    (event: MouseEvent | TouchEvent, clientX: number, clientY: number) => {
-      const sourceNodeId = connectingNodeId.current;
-      if (!sourceNodeId) {
-        return;
-      }
-
-      const { adjustedX, adjustedY } = calculateMenuPosition(
-        event,
-        clientX,
-        clientY
-      );
-
-      // Get the action template
-      const actionTemplate = nodeTemplates.find((t) => t.type === "action");
-      if (!actionTemplate) {
-        return;
-      }
-
-      // Get the position in the flow coordinate system
-      const position = screenToFlowPosition({
-        x: adjustedX,
-        y: adjustedY,
-      });
-
-      // Center the node vertically at the cursor position
-      // Node height is 192px (h-48 in Tailwind)
-      const nodeHeight = 192;
-      position.y -= nodeHeight / 2;
-
-      const newNode: WorkflowNode = {
-        id: nanoid(),
-        type: actionTemplate.type,
-        position,
-        data: {
-          label: actionTemplate.label,
-          description: actionTemplate.description,
-          type: actionTemplate.type,
-          config: actionTemplate.defaultConfig,
-          status: "idle",
-        },
-        selected: true,
-      };
-
-      addNode(newNode);
-      setSelectedNode(newNode.id);
-      setActiveTab("properties");
-
-      // Deselect all other nodes and select only the new node
-      // Need to do this after a delay because panOnDrag will clear selection
-      setTimeout(() => {
-        setNodes((currentNodes) =>
-          currentNodes.map((n) => ({
-            ...n,
-            selected: n.id === newNode.id,
-          }))
-        );
-      }, 50);
-
-      // Create connection from the source node to the new node
-      const fromSource = connectingHandleType.current === "source";
-
-      const newEdge = {
-        id: nanoid(),
-        source: fromSource ? sourceNodeId : newNode.id,
-        target: fromSource ? newNode.id : sourceNodeId,
-        type: "animated",
-      };
-      setEdges([...edges, newEdge]);
-      setHasUnsavedChanges(true);
-      // Trigger immediate autosave for the new edge
-      triggerAutosave({ immediate: true });
-
-      // Set flag to prevent immediate deselection
-      justCreatedNodeFromConnection.current = true;
-      setTimeout(() => {
-        justCreatedNodeFromConnection.current = false;
-      }, 100);
-    },
-    [
-      calculateMenuPosition,
-      screenToFlowPosition,
-      addNode,
-      edges,
-      setEdges,
-      setNodes,
-      setSelectedNode,
-      setActiveTab,
-      setHasUnsavedChanges,
-      triggerAutosave,
-    ]
-  );
-
   const onConnectEnd = useCallback(
     (event: MouseEvent | TouchEvent) => {
       if (!connectingNodeId.current) {
@@ -469,28 +327,96 @@ export function WorkflowCanvas() {
         return;
       }
 
-      const nodeElement = target.closest(".react-flow__node");
+      const isNode = target.closest(".react-flow__node");
       const isHandle = target.closest(".react-flow__handle");
 
-      // Create connection on edge dragged over node release
-      if (nodeElement && !isHandle && connectingHandleType.current) {
-        handleConnectionToExistingNode(nodeElement);
-        connectingNodeId.current = null;
-        connectingHandleType.current = null;
-        return;
-      }
+      if (!(isNode || isHandle)) {
+        const { adjustedX, adjustedY } = calculateMenuPosition(
+          event,
+          clientX,
+          clientY
+        );
 
-      if (!(nodeElement || isHandle)) {
-        handleConnectionToNewNode(event, clientX, clientY);
+        // Get the action template
+        const actionTemplate = nodeTemplates.find((t) => t.type === "action");
+        if (!actionTemplate) {
+          return;
+        }
+
+        // Get the position in the flow coordinate system
+        const position = screenToFlowPosition({
+          x: adjustedX,
+          y: adjustedY,
+        });
+
+        // Center the node vertically at the cursor position
+        // Node height is 192px (h-48 in Tailwind)
+        const nodeHeight = 192;
+        position.y -= nodeHeight / 2;
+
+        // Create new action node
+        const newNode: WorkflowNode = {
+          id: nanoid(),
+          type: actionTemplate.type,
+          position,
+          data: {
+            label: actionTemplate.label,
+            description: actionTemplate.description,
+            type: actionTemplate.type,
+            config: actionTemplate.defaultConfig,
+            status: "idle",
+          },
+          selected: true,
+        };
+
+        addNode(newNode);
+        setSelectedNode(newNode.id);
+        setActiveTab("properties");
+
+        // Deselect all other nodes and select only the new node
+        // Need to do this after a delay because panOnDrag will clear selection
+        setTimeout(() => {
+          setNodes((currentNodes) =>
+            currentNodes.map((n) => ({
+              ...n,
+              selected: n.id === newNode.id,
+            }))
+          );
+        }, 50);
+
+        // Create connection from the source node to the new node
+        const newEdge = {
+          id: nanoid(),
+          source: connectingNodeId.current,
+          target: newNode.id,
+          type: "animated",
+        };
+        setEdges([...edges, newEdge]);
+        setHasUnsavedChanges(true);
+        // Trigger immediate autosave for the new edge
+        triggerAutosave({ immediate: true });
+
+        // Set flag to prevent immediate deselection
+        justCreatedNodeFromConnection.current = true;
+        setTimeout(() => {
+          justCreatedNodeFromConnection.current = false;
+        }, 100);
       }
 
       connectingNodeId.current = null;
-      connectingHandleType.current = null;
     },
     [
       getClientPosition,
-      handleConnectionToExistingNode,
-      handleConnectionToNewNode,
+      calculateMenuPosition,
+      screenToFlowPosition,
+      addNode,
+      edges,
+      setEdges,
+      setNodes,
+      setSelectedNode,
+      setActiveTab,
+      setHasUnsavedChanges,
+      triggerAutosave,
     ]
   );