Removed unneeded min-height. Using throttle for resize function.
Hristo Kanchev committed
Apr 7, 2019 at 11:48 UTC
2620050abfce392f53c19bec170d1501a25e49eb
2 files changed
+2
-9
src/devtools/views/Components/OwnersStack.css
-1
@@ -60,7 +60,6 @@
60
position: absolute;
61
top: calc(100% + 5px);
62
left: 0;
63
- min-height: 200px;
63
background-color: var(--color-background);
64
border: 1px solid var(--color-selected-border);
65
overflow-y: auto;
src/devtools/views/Components/OwnersStack.js
+2
-8
@@ -7,6 +7,7 @@ import React, {
7
createRef,
8
forwardRef,
9
} from 'react';
10
+import throttle from 'lodash.throttle';
11
import classNames from 'classnames';
12
import Button from '../Button';
13
import ButtonIcon from '../ButtonIcon';
@@ -175,14 +176,10 @@ function useElementsBarOverflowing(
176
}, [elementsBarRef, elementsTotalWidth]);
177
178
useEffect(() => {
178
- let timeoutID = null;
179
const handleResize = () => {
180
callback(isElementsBarOverflowing());
181
};
182
- const debounceHandleResize = () => {
183
- clearTimeout(((timeoutID: any): TimeoutID));
184
- timeoutID = setTimeout(handleResize, 100);
185
- };
182
+ const debounceHandleResize = throttle(handleResize, 100);
183
184
handleResize();
185
// It's important to listen to the ownerDocument.defaultView to support the browser extension.
@@ -192,9 +189,6 @@ function useElementsBarOverflowing(
189
ownerWindow.addEventListener('resize', debounceHandleResize);
190
return () => {
191
ownerWindow.removeEventListener('resize', debounceHandleResize);
195
- if (timeoutID !== null) {
196
- clearTimeout(timeoutID);
197
- }
192
};
193
}, [elementsBarRef, isElementsBarOverflowing, callback]);
194
}