react-logviewer
react-logviewer copied to clipboard
highlight not updated when the property is changed
Hi, It seems that changing highlight property doesn't update the component. I have a react code like below to scroll AND highlight to the specific line.
const [lineNumber, setLineNumber] = useState(1);
<LazyLog
text={mlirData?.content}
scrollToLine={lineNumber}
highlight={lineNumber}
/>
When the lineNumber is updated, LazyLog is scrolled to the line number as expected. But the highlight is not updated. Do you have any idea?
I think your issue is similar to this one: https://github.com/melloware/react-logviewer/issues/37
It seems wiht React Virtual Window is scrolling to the end of the first virtual frame or something.
I just released 5.2.1 can you try it and report back i think its fixed.
Hi melloware! Thanks for your attention. I updated to the 5.2.1 release, but highlight is still not working. It seems that highlight state is not updated. If I add onHighlight, then onHighlight function is triggered when I change the lineNumber, but the value printed from console.log(line) is always the initial value, not mutated at all.
const [lineNumber, setLineNumber] = useState(1);
<LazyLog
text={mlirData?.content}
scrollToLine={lineNumber}
highlight={lineNumber}
onHighlight={(line)=>console.log(line)}
/>
yep i see that too with a stackblitz: https://stackblitz.com/edit/vitejs-vite-lesej7?file=package.json,src%2FApp.tsx&terminal=dev
I see why.
highlight:
previousHighlight === Range(0, 0)
? getHighlightRange(highlight)
: previousHighlight || getHighlightRange(previousHighlight),
The old code intentionally only set the Highlight on initialization but after that it was controlled by your mouse clicks. I wonder if this is so highlighting would not be lost between re-renders?