From 7006caa8defbb73f14d0c9eb5c29356adfdb8e79 Mon Sep 17 00:00:00 2001
From: waleed <walif6@gmail.com>
Date: Wed, 7 Jan 2026 13:08:55 -0800
Subject: [PATCH] improvement(context-menu): added awareness for chat and
 variables being open, fixed select calcaulation to match heihgt calculation
 for selecting multiple blocks

---
 .../context-menu/pane-context-menu.tsx        | 14 +++++++------
 .../components/context-menu/types.ts          |  8 ++++++--
 .../workflow-block/workflow-block.tsx         |  2 +-
 .../[workspaceId]/w/[workflowId]/workflow.tsx | 20 +++++++++++++------
 4 files changed, 29 insertions(+), 15 deletions(-)

diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/context-menu/pane-context-menu.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/context-menu/pane-context-menu.tsx
index dde87e5a56..96b36e3bb0 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/context-menu/pane-context-menu.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/context-menu/pane-context-menu.tsx
@@ -24,9 +24,11 @@ export function PaneContextMenu({
   onAddBlock,
   onAutoLayout,
   onOpenLogs,
-  onOpenVariables,
-  onOpenChat,
+  onToggleVariables,
+  onToggleChat,
   onInvite,
+  isVariablesOpen = false,
+  isChatOpen = false,
   hasClipboard = false,
   disableEdit = false,
   disableAdmin = false,
@@ -125,19 +127,19 @@ export function PaneContextMenu({
         </PopoverItem>
         <PopoverItem
           onClick={() => {
-            onOpenVariables()
+            onToggleVariables()
             onClose()
           }}
         >
-          Variables
+          {isVariablesOpen ? 'Close Variables' : 'Open Variables'}
         </PopoverItem>
         <PopoverItem
           onClick={() => {
-            onOpenChat()
+            onToggleChat()
             onClose()
           }}
         >
-          Open Chat
+          {isChatOpen ? 'Close Chat' : 'Open Chat'}
         </PopoverItem>
 
         {/* Admin action */}
diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/context-menu/types.ts b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/context-menu/types.ts
index e607e0361e..53b5246cc4 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/context-menu/types.ts
+++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/context-menu/types.ts
@@ -77,9 +77,13 @@ export interface PaneContextMenuProps {
   onAddBlock: () => void
   onAutoLayout: () => void
   onOpenLogs: () => void
-  onOpenVariables: () => void
-  onOpenChat: () => void
+  onToggleVariables: () => void
+  onToggleChat: () => void
   onInvite: () => void
+  /** Whether the variables panel is currently open */
+  isVariablesOpen?: boolean
+  /** Whether the chat panel is currently open */
+  isChatOpen?: boolean
   /** Whether clipboard has content for pasting */
   hasClipboard?: boolean
   /** Whether edit actions are disabled (no permission) */
diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/workflow-block.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/workflow-block.tsx
index e77d956fdd..1d7ead5c53 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/workflow-block.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/workflow-block.tsx
@@ -911,7 +911,7 @@ export const WorkflowBlock = memo(function WorkflowBlock({
       type,
       config.category,
       displayTriggerMode,
-      subBlockRows.length,
+      subBlockRows.reduce((acc, row) => acc + row.length, 0),
       conditionRows.length,
       routerRows.length,
       horizontalHandles,
diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/workflow.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/workflow.tsx
index ecec650641..7e111a697c 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/workflow.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/workflow.tsx
@@ -257,6 +257,10 @@ const WorkflowContent = React.memo(() => {
 
   const snapToGridSize = useGeneralStore((state) => state.snapToGridSize)
   const snapToGrid = snapToGridSize > 0
+
+  // Panel open states for context menu
+  const isVariablesOpen = useVariablesStore((state) => state.isOpen)
+  const isChatOpen = useChatStore((state) => state.isChatOpen)
   const snapGrid: [number, number] = useMemo(
     () => [snapToGridSize, snapToGridSize],
     [snapToGridSize]
@@ -754,12 +758,14 @@ const WorkflowContent = React.memo(() => {
     router.push(`/workspace/${workspaceId}/logs?workflowIds=${workflowIdParam}`)
   }, [router, workspaceId, workflowIdParam])
 
-  const handleContextOpenVariables = useCallback(() => {
-    useVariablesStore.getState().setIsOpen(true)
+  const handleContextToggleVariables = useCallback(() => {
+    const { isOpen, setIsOpen } = useVariablesStore.getState()
+    setIsOpen(!isOpen)
   }, [])
 
-  const handleContextOpenChat = useCallback(() => {
-    useChatStore.getState().setIsChatOpen(true)
+  const handleContextToggleChat = useCallback(() => {
+    const { isChatOpen, setIsChatOpen } = useChatStore.getState()
+    setIsChatOpen(!isChatOpen)
   }, [])
 
   const handleContextInvite = useCallback(() => {
@@ -2919,9 +2925,11 @@ const WorkflowContent = React.memo(() => {
               onAddBlock={handleContextAddBlock}
               onAutoLayout={handleAutoLayout}
               onOpenLogs={handleContextOpenLogs}
-              onOpenVariables={handleContextOpenVariables}
-              onOpenChat={handleContextOpenChat}
+              onToggleVariables={handleContextToggleVariables}
+              onToggleChat={handleContextToggleChat}
               onInvite={handleContextInvite}
+              isVariablesOpen={isVariablesOpen}
+              isChatOpen={isChatOpen}
               hasClipboard={hasClipboard()}
               disableEdit={!effectivePermissions.canEdit}
               disableAdmin={!effectivePermissions.canAdmin}