feat: viewport-aware debugger polling for all editor languages

src/renderer/components/_features/[workspace]/editor/graphical/ladder/index.tsx

@@ -25,7 +25,7 @@ import { ladderSelectors } from '@root/renderer/hooks'
 import { openPLCStoreBase, useOpenPLCStore } from '@root/renderer/store'
 import { RungLadderState, zodLadderFlowSchema } from '@root/renderer/store/slices'
 import { cn } from '@root/utils'
-import { useEffect, useRef, useState } from 'react'
+import { useCallback, useEffect, useRef, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { v4 as uuidv4 } from 'uuid'
 
@@ -50,6 +50,7 @@ export default function LadderEditor() {
     snapshotActions: { addSnapshot },
     libraries: { user: userLibraries },
     workspace: { isDebuggerVisible },
+    workspaceActions: { setDebugViewportVarNames },
   } = useOpenPLCStore()
 
   const updateModelLadder = ladderSelectors.useUpdateModelLadder()
@@ -244,6 +245,76 @@ export default function LadderEditor() {
     }
   }, [scrollableRef.current, editor.meta.name])
 
+  // Collect variable names from ladder rung nodes (contacts, coils, blocks)
+  const collectVarNamesFromRungs = useCallback((visibleRungs: RungLadderState[]) => {
+    const names = new Set<string>()
+    for (const rung of visibleRungs) {
+      for (const node of rung.nodes) {
+        if (node.type === 'contact' || node.type === 'coil') {
+          const varName = (node.data as { variable?: { name?: string } }).variable?.name
+          if (varName) names.add(varName)
+        }
+        if (node.type === 'block') {
+          const blockData = node.data as { variant?: { type: string }; numericId?: string }
+          if (blockData.numericId) names.add(blockData.numericId)
+        }
+      }
+    }
+    return names
+  }, [])
+
+  // Push visible viewport variable names to store (debounced 1s) during debug
+  const debugTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null)
+  useEffect(() => {
+    if (!isDebuggerVisible || !scrollableRef.current) {
+      return
+    }
+
+    const computeVisibleVars = () => {
+      const container = scrollableRef.current
+      if (!container) return
+
+      const scrollTop = container.scrollTop
+      const viewportHeight = container.clientHeight
+      const viewportBottom = scrollTop + viewportHeight
+
+      // Find visible rungs by checking rung element positions (each rung div has id={rung.id})
+      const visibleRungIds = new Set<string>()
+
+      for (const rung of rungs) {
+        const el = document.getElementById(rung.id)
+        if (!el) continue
+        const top = el.offsetTop
+        const bottom = top + el.offsetHeight
+        // Rung overlaps with viewport
+        if (bottom > scrollTop && top < viewportBottom) {
+          visibleRungIds.add(rung.id)
+        }
+      }
+
+      const visibleRungs = rungs.filter((r) => visibleRungIds.has(r.id))
+      const varNames = collectVarNamesFromRungs(visibleRungs.length > 0 ? visibleRungs : rungs)
+      setDebugViewportVarNames(varNames)
+    }
+
+    // Compute immediately
+    computeVisibleVars()
+
+    // Debounced scroll handler
+    const handleScroll = () => {
+      if (debugTimerRef.current) clearTimeout(debugTimerRef.current)
+      debugTimerRef.current = setTimeout(computeVisibleVars, 1000)
+    }
+
+    const container = scrollableRef.current
+    container.addEventListener('scroll', handleScroll)
+
+    return () => {
+      container.removeEventListener('scroll', handleScroll)
+      if (debugTimerRef.current) clearTimeout(debugTimerRef.current)
+    }
+  }, [isDebuggerVisible, rungs, collectVarNamesFromRungs, setDebugViewportVarNames])
+
   function getLibraryDivergences() {
     if (!flow) return []
 

src/renderer/components/_features/[workspace]/editor/monaco/index.tsx

@@ -3,6 +3,8 @@ import './configs'
 import { Editor as PrimitiveEditor } from '@monaco-editor/react'
 import { Modal, ModalContent, ModalTitle } from '@process:renderer/components/_molecules/modal'
 import { openPLCStoreBase, useOpenPLCStore } from '@process:renderer/store'
+import { collectSTVariableNames } from '@root/renderer/utils/debug/collect-st-variables'
+import { type BlockCommentState, stripLineComments } from '@root/renderer/utils/debug/strip-line-comments'
 import { PLCVariable } from '@root/types/PLC'
 import { baseTypeSchema, type PLCPou } from '@root/types/PLC/open-plc'
 import { getExtensionFromLanguage, getFolderFromPouType } from '@root/utils/PLC/pou-file-extensions'
@@ -65,50 +67,6 @@ const bridge = window.bridge as unknown as {
   onFileExternalChange: (handler: (event: IpcRendererEvent, data: { filePath: string }) => void) => () => void
 }
 
-// Replaces comment regions with spaces so column positions are preserved.
-// Tracks block comment state across lines: (*..*), /*..*/, and // line comments.
-type BlockCommentState = false | 'paren' | 'slash'
-function stripLineComments(line: string, state: BlockCommentState): { stripped: string; state: BlockCommentState } {
-  const chars = [...line]
-  let i = 0
-  let s = state
-
-  while (i < chars.length) {
-    if (s) {
-      const endMarker = s === 'paren' ? ')' : '/'
-      if (chars[i] === '*' && chars[i + 1] === endMarker) {
-        chars[i] = ' '
-        chars[i + 1] = ' '
-        i += 2
-        s = false
-      } else {
-        chars[i] = ' '
-        i++
-      }
-    } else {
-      if (chars[i] === '/' && chars[i + 1] === '/') {
-        for (let j = i; j < chars.length; j++) chars[j] = ' '
-        break
-      }
-      if (chars[i] === '(' && chars[i + 1] === '*') {
-        chars[i] = ' '
-        chars[i + 1] = ' '
-        i += 2
-        s = 'paren'
-      } else if (chars[i] === '/' && chars[i + 1] === '*') {
-        chars[i] = ' '
-        chars[i + 1] = ' '
-        i += 2
-        s = 'slash'
-      } else {
-        i++
-      }
-    }
-  }
-
-  return { stripped: chars.join(''), state: s }
-}
-
 const MonacoEditor = (props: monacoEditorProps): ReturnType<typeof PrimitiveEditor> => {
   const { language, path, name } = props
   const editorRef = useRef<null | monaco.editor.IStandaloneCodeEditor>(null)
@@ -146,6 +104,7 @@ const MonacoEditor = (props: monacoEditorProps): ReturnType<typeof PrimitiveEdit
     projectActions: { updatePou, createVariable },
     sharedWorkspaceActions: { handleFileAndWorkspaceSavedState },
     snapshotActions: { addSnapshot },
+    workspaceActions: { setDebugViewportVarNames },
   } = useOpenPLCStore()
 
   // Create a unique Monaco path by combining project path with relative path
@@ -288,6 +247,46 @@ const MonacoEditor = (props: monacoEditorProps): ReturnType<typeof PrimitiveEdit
     editorRef.current?.updateOptions({ readOnly: isDebuggerVisible })
   }, [isDebuggerVisible])
 
+  // Push visible variable names to store for ST/IL debugger polling (debounced 1s on scroll)
+  useEffect(() => {
+    if (!isDebuggerVisible || !editorRef.current || (language !== 'st' && language !== 'il')) return
+
+    const editor = editorRef.current
+    const model = editor.getModel()
+    if (!model) return
+
+    const varNames = pou?.data.variables.map((v) => v.name).filter((n) => n && n.trim() !== '') || []
+    if (varNames.length === 0) return
+
+    const computeVisibleVars = () => {
+      const ranges = editor.getVisibleRanges()
+      const visibleLines: string[] = []
+      for (const range of ranges) {
+        for (let line = range.startLineNumber; line <= range.endLineNumber; line++) {
+          visibleLines.push(model.getLineContent(line))
+        }
+      }
+      const sourceText = visibleLines.join('\n')
+      const visibleVarNames = collectSTVariableNames(sourceText, varNames)
+      setDebugViewportVarNames(visibleVarNames)
+    }
+
+    // Compute immediately
+    computeVisibleVars()
+
+    // Debounce on scroll
+    let timer: ReturnType<typeof setTimeout>
+    const disposable = editor.onDidScrollChange(() => {
+      clearTimeout(timer)
+      timer = setTimeout(computeVisibleVars, 1000)
+    })
+
+    return () => {
+      disposable.dispose()
+      clearTimeout(timer)
+    }
+  }, [isDebuggerVisible, editorMounted, name, language, pou?.data.variables, setDebugViewportVarNames])
+
   // Resolve FB instance context for composite key building
   const fbInstanceContext = useMemo(() => {
     if (!pou || pou.type !== 'function-block') return null

src/renderer/components/_molecules/graphical-editor/fbd/index.tsx

@@ -49,6 +49,7 @@ export const FBDBody = ({ rung, nodeDivergences = [], isDebuggerActive = false }
     modalActions: { closeModal, openModal },
     snapshotActions: { addSnapshot },
     workspace: { isDebuggerVisible, debugVariableValues, debugForcedVariables },
+    workspaceActions: { setDebugViewportVarNames },
   } = useOpenPLCStore()
   const getCompositeKey = useDebugCompositeKey()
 
@@ -697,6 +698,60 @@ export const FBDBody = ({ rung, nodeDivergences = [], isDebuggerActive = false }
     openModal(modalToOpen, node)
   }
 
+  // Compute visible variable names from FBD nodes within viewport bounds (debounced 1s)
+  const debugViewportTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null)
+
+  const computeFbdVisibleVars = useCallback(() => {
+    if (!isDebuggerVisible || !reactFlowInstance || !reactFlowViewportRef.current) return
+
+    const vp = reactFlowInstance.getViewport()
+    const containerRect = reactFlowViewportRef.current.getBoundingClientRect()
+    const visibleBounds = {
+      minX: -vp.x / vp.zoom,
+      maxX: (-vp.x + containerRect.width) / vp.zoom,
+      minY: -vp.y / vp.zoom,
+      maxY: (-vp.y + containerRect.height) / vp.zoom,
+    }
+
+    const varNames = new Set<string>()
+    for (const node of rung.nodes) {
+      // Check if node overlaps with visible bounds
+      const nodeRight = node.position.x + (node.measured?.width ?? node.width ?? 150)
+      const nodeBottom = node.position.y + (node.measured?.height ?? node.height ?? 50)
+      if (nodeRight < visibleBounds.minX || node.position.x > visibleBounds.maxX) continue
+      if (nodeBottom < visibleBounds.minY || node.position.y > visibleBounds.maxY) continue
+
+      if (node.type === 'input-variable' || node.type === 'output-variable' || node.type === 'inout-variable') {
+        const varName = (node.data as { variable?: { name?: string } }).variable?.name
+        if (varName) varNames.add(varName)
+      }
+      if (node.type === 'block') {
+        const blockData = node.data as { variant?: { type: string }; numericId?: string }
+        if (blockData.numericId) varNames.add(blockData.numericId)
+      }
+    }
+
+    setDebugViewportVarNames(varNames)
+  }, [isDebuggerVisible, reactFlowInstance, rung.nodes, setDebugViewportVarNames])
+
+  // Compute on debug start and on viewport move (debounced)
+  useEffect(() => {
+    if (!isDebuggerVisible) return
+    computeFbdVisibleVars()
+  }, [isDebuggerVisible, computeFbdVisibleVars])
+
+  const handleDebugViewportMove = useCallback(() => {
+    if (!isDebuggerVisible) return
+    if (debugViewportTimerRef.current) clearTimeout(debugViewportTimerRef.current)
+    debugViewportTimerRef.current = setTimeout(computeFbdVisibleVars, 1000)
+  }, [isDebuggerVisible, computeFbdVisibleVars])
+
+  useEffect(() => {
+    return () => {
+      if (debugViewportTimerRef.current) clearTimeout(debugViewportTimerRef.current)
+    }
+  }, [])
+
   /**
    * Handle the close of the modal
    */
@@ -769,6 +824,8 @@ export const FBDBody = ({ rung, nodeDivergences = [], isDebuggerActive = false }
           onNodeDragStart: isDebuggerActive ? undefined : onNodeDragStart,
           onNodeDragStop: isDebuggerActive ? undefined : onNodeDragStop,
 
+          onMoveEnd: handleDebugViewportMove,
+
           preventScrolling: canZoom,
           panOnDrag: canPan,