diff --git a/web/src/containers/Studio/editor.tsx b/web/src/containers/Studio/editor.tsx index 96c4a34..02964c1 100644 --- a/web/src/containers/Studio/editor.tsx +++ b/web/src/containers/Studio/editor.tsx @@ -114,10 +114,7 @@ const SASjsEditor = ({ // INFO: variable indicating if selected run type is SAS if there are any errors or warnings in the log const logWithErrorsOrWarnings = - selectedRunTime === RunTimeType.SAS && - log && - ((log as LogObject).errors?.length !== 0 || - (log as LogObject).warnings?.length !== 0) + selectedRunTime === RunTimeType.SAS && log && typeof log === 'object' return ( diff --git a/web/src/containers/Studio/internal/components/log/logChunk.tsx b/web/src/containers/Studio/internal/components/log/logChunk.tsx index a8f3313..22114f7 100644 --- a/web/src/containers/Studio/internal/components/log/logChunk.tsx +++ b/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) diff --git a/web/src/containers/Studio/internal/components/log/logComponent.tsx b/web/src/containers/Studio/internal/components/log/logComponent.tsx index 449b28a..ab38642 100644 --- a/web/src/containers/Studio/internal/components/log/logComponent.tsx +++ b/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]