fix(mentions): Address comments

box · Jun 24, 2020 · 8d1c35b · 8d1c35b
1 parent e7d1063
commit 8d1c35b
Showing 1 changed file with 8 additions and 16 deletions.
diff --git a/src/components/ItemList/ItemList.tsx b/src/components/ItemList/ItemList.tsx
@@ -20,30 +20,22 @@ const ItemList = <T extends { id: string }>({
     ...rest
 }: Props<T>): JSX.Element => {
     const listRef = React.useRef<HTMLUListElement>(null);
-    const listHeightRef = React.useRef<number | null>(null);
-
-    // cache list height, since it won't change
-    React.useEffect(() => {
-        const { current: listEl } = listRef;
-
-        if (listEl) {
-            listHeightRef.current = listEl.offsetHeight;
-        }
-    }, [listRef]);
 
     const activeRef = React.useCallback(
         (activeEl: ItemRowRef) => {
             const { current: listEl } = listRef;
-            const { current: listHeight } = listHeightRef;
 
-            if (!activeEl || !listEl || !listHeight) {
+            if (!activeEl || !listEl) {
                 return;
             }
 
-            if (listEl.scrollTop > activeEl.offsetTop) {
-                listEl.scrollTop -= activeEl.offsetHeight;
-            } else if (listEl.scrollTop + listHeight < activeEl.offsetTop + activeEl.offsetHeight) {
-                listEl.scrollTop += activeEl.offsetHeight;
+            const { offsetHeight: activeHeight, offsetTop: activeTop } = activeEl;
+            const { offsetHeight: listHeight, scrollTop: listTop } = listEl;
+
+            if (listTop > activeTop) {
+                listEl.scrollTop -= activeHeight;
+            } else if (listTop + listHeight < activeTop + activeHeight) {
+                listEl.scrollTop += activeHeight;
             }
         },
         [listRef],