fix(log): fixed scrolling issue

web/src/containers/Studio/internal/components/log/logChunk.tsx

@@ -23,6 +23,7 @@ interface LogChunkProps {
   logLineCount: number
   onClick: (evt: any, id: number) => void
   scrollToLogInstance?: LogInstance
+  updated: number
 }
 
 const LogChunk = (props: LogChunkProps) => {
@@ -39,6 +40,19 @@ const LogChunk = (props: LogChunkProps) => {
     setExpanded(props.expanded)
   }, [props.expanded])
 
+  useEffect(() => {
+    if (props.expanded !== expanded) {
+      setExpanded(props.expanded)
+    }
+
+    if (
+      props.scrollToLogInstance &&
+      props.scrollToLogInstance !== scrollToLogInstance
+    ) {
+      setScrollToLogInstance(props.scrollToLogInstance)
+    }
+  }, [props])
+
   useEffect(() => {
     if (expanded && scrollToLogInstance) {
       const { type, id } = scrollToLogInstance
@@ -49,18 +63,18 @@ const LogChunk = (props: LogChunkProps) => {
         document.querySelector(`#log_container`)
 
       if (line && logWrapper && logContainer) {
-        const initialColor = line.style.color
-
-        line.style.backgroundColor = '#f6e30599'
+        line.className = classes.HighlightedLine
 
         line.scrollIntoView({ behavior: 'smooth', block: 'start' })
 
         setTimeout(() => {
-          line.setAttribute('style', `color: ${initialColor};`)
+          line.classList.remove(classes.HighlightedLine)
+
+          setScrollToLogInstance(undefined)
         }, 3000)
       }
     }
-  }, [expanded, scrollToLogInstance])
+  }, [expanded, scrollToLogInstance, props])
 
   const { errors, warnings } = parseErrorsAndWarnings(text)
 

web/src/containers/Studio/internal/components/log/logComponent.tsx

@@ -189,6 +189,7 @@ const LogComponent = (props: LogComponentProps) => {
                   key={`log-chunk-${id}`}
                   logLineCount={logObject.linesCount}
                   scrollToLogInstance={scrollToLogInstance}
+                  updated={Date.now()}
                   onClick={(_, chunkNumber) => {
                     setLogChunksState((prevState) => {
                       const newState = [...prevState]