From 76eb23de5a246d03e7ce9fb8238e61239e9b9e5f Mon Sep 17 00:00:00 2001
From: mdodgelooker <meredith.dodge@looker.com>
Date: Fri, 8 Jan 2021 21:19:03 +0000
Subject: [PATCH] Revert useWindow fix

---
 packages/components/src/Menu/MenuList.tsx   |  2 +-
 packages/components/src/utils/useWindow.tsx | 26 ++++++++++++++-------
 2 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/packages/components/src/Menu/MenuList.tsx b/packages/components/src/Menu/MenuList.tsx
index c05b38ea626..cca7a85e6d2 100644
--- a/packages/components/src/Menu/MenuList.tsx
+++ b/packages/components/src/Menu/MenuList.tsx
@@ -182,7 +182,7 @@ export const MenuListInternal = forwardRef(
       return (child: ReactChild) => getMenuGroupHeight(child, compact)
     }, [windowing, childArray, compact])
 
-    const { content, ref } = useWindow<HTMLUListElement>({
+    const { content, ref } = useWindow({
       childHeight: childHeight,
       children: children as JSX.Element | JSX.Element[],
       enabled: windowing !== 'none',
diff --git a/packages/components/src/utils/useWindow.tsx b/packages/components/src/utils/useWindow.tsx
index 972a7a79672..7847ae23dbc 100644
--- a/packages/components/src/utils/useWindow.tsx
+++ b/packages/components/src/utils/useWindow.tsx
@@ -55,18 +55,18 @@ interface WindowHeightPayloadObject {
 }
 
 interface WindowHeightAction {
-  type: 'CHANGE'
-  payload: WindowHeightPayloadObject
+  type: 'CHANGE' | 'RESET'
+  payload: number | WindowHeightPayloadObject
 }
 
-const initialState = {
+const initialState = (length: number) => ({
   afterHeight: 0,
   beforeHeight: 0,
-  end: 0,
+  end: length - 1,
   scrollBottom: 0,
   scrollTop: 0,
   start: 0,
-}
+})
 const bufferHeight = 1000
 
 // For windowing lists with variable item height, a reducer that derives
@@ -81,6 +81,11 @@ const reducer: Reducer<WindowHeightState, WindowHeightAction> = (
   state,
   action
 ) => {
+  // RESET (if disabled after being enabled)
+  if (typeof action.payload === 'number') {
+    return initialState(action.payload)
+  }
+
   let { beforeHeight, afterHeight, start, end } = state
   const {
     scrollPosition,
@@ -178,7 +183,10 @@ export const useWindow = <E extends HTMLElement = HTMLElement>({
   const scrollPosition = useScrollPosition(containerElement)
 
   // For variable childHeight
-  const [variable, dispatch] = useReducer(reducer, initialState)
+  const [variable, dispatch] = useReducer(
+    reducer,
+    initialState(childArray.length)
+  )
   useEffect(() => {
     // If using fixed childHeight, totalHeight will be 0
     if (totalHeight > 0) {
@@ -192,6 +200,8 @@ export const useWindow = <E extends HTMLElement = HTMLElement>({
           },
           type: 'CHANGE',
         })
+      } else {
+        dispatch({ payload: childHeightLadder.length, type: 'RESET' })
       }
     }
   }, [enabled, childHeightLadder, height, scrollPosition, totalHeight])
@@ -226,14 +236,12 @@ export const useWindow = <E extends HTMLElement = HTMLElement>({
 
   return {
     containerElement,
-    content: enabled ? (
+    content: (
       <>
         {before}
         {childArray.slice(start, end + 1)}
         {after}
       </>
-    ) : (
-      childArray
     ),
     ref: callbackRef,
   }