diff --git a/.gitignore b/.gitignore index c2942f4..a116eef 100644 --- a/.gitignore +++ b/.gitignore @@ -88,3 +88,5 @@ npm-debug.log* yarn-debug.log* yarn-error.log* yarn.lock + +.vscode diff --git a/src/Components/NetworkTable/NetworkTableBody.jsx b/src/Components/NetworkTable/NetworkTableBody.jsx index 3bf6e13..781aa85 100644 --- a/src/Components/NetworkTable/NetworkTableBody.jsx +++ b/src/Components/NetworkTable/NetworkTableBody.jsx @@ -58,13 +58,13 @@ const NetworkTableBody = ({ height }) => { }, [elementDims]); useEffect(() => { - if (enableAutoScroll && listRef?.current?._outerRef) { - const outerRef = listRef?.current?._outerRef; - const needToScroll = outerRef.scrollTop + - outerRef.offsetHeight + - (numberOfNewEntries * TABLE_ENTRY_HEIGHT) >= outerRef.scrollHeight; + if (enableAutoScroll && listRef?.current) { + const { offsetHeight, scrollHeight } = listRef.current; + let { scrollTop } = listRef.current; + const needToScroll = scrollTop + offsetHeight + + (numberOfNewEntries * TABLE_ENTRY_HEIGHT) >= scrollHeight; if (needToScroll) { - listRef.current._outerRef.scrollTop = outerRef.scrollHeight; + scrollTop = scrollHeight; } } }, [data, listRef]); @@ -100,7 +100,6 @@ const NetworkTableBody = ({ height }) => { return ( <> { selectedReqIndex, }} itemSize={TABLE_ENTRY_HEIGHT} + outerRef={listRef} > {virtualizedTableRow} diff --git a/src/hooks/useResizeObserver.js b/src/hooks/useResizeObserver.js index d0c211d..bf1da4e 100644 --- a/src/hooks/useResizeObserver.js +++ b/src/hooks/useResizeObserver.js @@ -19,7 +19,7 @@ export const useResizeObserver = (elementRef) => { }); useEffect(() => { - const ref = elementRef?.current?._outerRef || elementRef?.current; + const ref = elementRef?.current; const onResize = debounce(() => { if (ref) { setElementDims({ @@ -40,7 +40,7 @@ export const useResizeObserver = (elementRef) => { resizeObserver.unobserve(ref); } }; - }, [elementRef?.current]); + }, [elementRef]); return { elementDims }; };