fix: resolve FBD editor infinite render loop causing high CPU

src/renderer/components/_atoms/graphical-editor/fbd/autocomplete/index.tsx

@@ -104,7 +104,7 @@ const FBDBlockAutoComplete = forwardRef<HTMLDivElement, FBDBlockAutoCompleteProp
             (variable) =>
               variable.name.toLowerCase().includes(valueToSearch.toLowerCase()) &&
               (variableRestrictions.values === undefined ||
-                variableRestrictions.values.includes(variable.type.value.toLowerCase())),
+                variableRestrictions.values.map((v) => v.toLowerCase()).includes(variable.type.value.toLowerCase())),
           )
           .sort((a, b) => {
             const aNumber = extractNumberAtEnd(a.name).number

src/renderer/components/_atoms/graphical-editor/ladder/autocomplete/index.tsx

@@ -83,7 +83,12 @@ const VariablesBlockAutoComplete = forwardRef<HTMLDivElement, VariablesBlockAuto
                 variable.name.toLowerCase().includes(valueToSearch.toLowerCase()) &&
                 // Variable type restrictions
                 (variableRestrictions.values === undefined ||
-                  variableRestrictions.values.includes(variable.type.value.toLowerCase())) &&
+                  (Array.isArray(variableRestrictions.values)
+                    ? variableRestrictions.values
+                    : [variableRestrictions.values]
+                  )
+                    .map((v) => v.toLowerCase())
+                    .includes(variable.type.value.toLowerCase())) &&
                 (variableRestrictions.limitations === undefined ||
                   !variableRestrictions.limitations.includes(variable.type.definition)),
             )

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

@@ -3,48 +3,24 @@ import { BlockVariant } from '@root/renderer/components/_atoms/graphical-editor/
 import { FBDBody } from '@root/renderer/components/_molecules/graphical-editor/fbd'
 import { useOpenPLCStore } from '@root/renderer/store'
 import { zodFBDFlowSchema } from '@root/renderer/store/slices'
-import { useEffect } from 'react'
+import { useEffect, useMemo } from 'react'
 
 export default function FbdEditor() {
-  const {
-    editor,
-    fbdFlows,
-    project: {
-      data: { pous },
-    },
-    libraries: { user: userLibraries },
-    fbdFlowActions,
-    projectActions: { updatePou },
-    sharedWorkspaceActions: { handleFileAndWorkspaceSavedState },
-    workspace: { isDebuggerVisible },
-  } = useOpenPLCStore()
+  const editor = useOpenPLCStore((state) => state.editor)
+  const fbdFlows = useOpenPLCStore((state) => state.fbdFlows)
+  const pous = useOpenPLCStore((state) => state.project.data.pous)
+  const userLibraries = useOpenPLCStore((state) => state.libraries.user)
+  const fbdFlowActions = useOpenPLCStore((state) => state.fbdFlowActions)
+  const updatePou = useOpenPLCStore((state) => state.projectActions.updatePou)
+  const handleFileAndWorkspaceSavedState = useOpenPLCStore(
+    (state) => state.sharedWorkspaceActions.handleFileAndWorkspaceSavedState,
+  )
+  const isDebuggerVisible = useOpenPLCStore((state) => state.workspace.isDebuggerVisible)
 
   const flow = fbdFlows.find((flow) => flow.name === editor.meta.name)
   const flowUpdated = flow?.updated || false
-  const nodeDivergences = getLibraryDivergences()
-
-  /**
-   * Update the flow state to project JSON
-   */
-  useEffect(() => {
-    if (!flowUpdated) return
-
-    const flowSchema = zodFBDFlowSchema.safeParse(flow)
-    if (!flowSchema.success) return
-
-    updatePou({
-      name: editor.meta.name,
-      content: {
-        language: 'fbd',
-        value: flowSchema.data,
-      },
-    })
-
-    fbdFlowActions.setFlowUpdated({ editorName: editor.meta.name, updated: false })
-    handleFileAndWorkspaceSavedState(editor.meta.name)
-  }, [flowUpdated])
 
-  function getLibraryDivergences() {
+  const nodeDivergences = useMemo(() => {
     if (!flow) return []
 
     const divergences = []
@@ -96,7 +72,28 @@ export default function FbdEditor() {
     }
 
     return divergences
-  }
+  }, [flow?.rung.nodes, userLibraries, pous])
+
+  /**
+   * Update the flow state to project JSON
+   */
+  useEffect(() => {
+    if (!flowUpdated) return
+
+    const flowSchema = zodFBDFlowSchema.safeParse(flow)
+    if (!flowSchema.success) return
+
+    updatePou({
+      name: editor.meta.name,
+      content: {
+        language: 'fbd',
+        value: flowSchema.data,
+      },
+    })
+
+    fbdFlowActions.setFlowUpdated({ editorName: editor.meta.name, updated: false })
+    handleFileAndWorkspaceSavedState(editor.meta.name)
+  }, [flowUpdated])
 
   return (
     <div className='h-full w-full'>

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

@@ -221,8 +221,8 @@ export const FBDBody = ({ rung, nodeDivergences = [], isDebuggerActive = false }
     debugVariableValues,
     debugForcedVariables,
     editor.meta.name,
-    project,
-    getCompositeKey,
+    pouRef?.data.variables,
+    project.data.configuration.resource.instances,
   ])
 
   const styledNodes = useMemo(() => {
@@ -263,25 +263,32 @@ export const FBDBody = ({ rung, nodeDivergences = [], isDebuggerActive = false }
   }
 
   const updateRungState = () => {
+    const stripDivergence = (node: FlowNode) => {
+      const { hasDivergence: _hd, ...cleanData } = node.data
+      return { ...node, data: cleanData }
+    }
+
     const rungLocalCopy = {
       ...rungLocal,
-      nodes: rungLocal.nodes.map((node) => {
-        const localObjectData = { ...node.data }
-        return { ...node, data: localObjectData }
-      }),
+      nodes: rungLocal.nodes.map(stripDivergence),
+    }
+
+    const rungClean = {
+      ...rung,
+      nodes: rung.nodes.map(stripDivergence),
     }
 
     // Make node data mirror be the rung and not the rungLocal
     // This is made because the rungLocal is a local copy and may not reflect the latest changes in the store
     // And the store saves all the block data updates
     const isSelectedNodeDataEqual =
-      rung.selectedNodes.length > 0
-        ? rung.selectedNodes.every((node) => {
+      rungClean.selectedNodes.length > 0
+        ? rungClean.selectedNodes.every((node) => {
             const localNode = rungLocalCopy.nodes.find((n) => n.id === node.id)
             return localNode ? isEqual(localNode.data, node.data) : false
           })
         : true
-    const skipUpdate = (dragging || isEqual(rungLocalCopy, rung)) && isSelectedNodeDataEqual
+    const skipUpdate = (dragging || isEqual(rungLocalCopy, rungClean)) && isSelectedNodeDataEqual
 
     if (skipUpdate) {
       return