djkato/saleor-dashboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Show arrow before scrolling

Browse source
This commit is contained in:
dominik-zeglen 2019-10-15 14:33:35 +02:00
parent d295804778
commit 1de5f7435d
2 changed files with 8 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/components/SingleAutocompleteSelectField/SingleAutocompleteSelectFieldContent.tsx
View file

@ -233,7 +233,9 @@ const SingleAutocompleteSelectFieldContent: React.FC<
<div className={classes.arrowContainer}> <div className={classes.arrowContainer}>
<div <div
className={classNames(classes.arrowInnerContainer, { className={classNames(classes.arrowInnerContainer, {
[classes.hide]: scrolledToBottom && choices.length > 0 // Needs to be explicitely compared to false because
// scrolledToBottom can be either true, false or undefined
[classes.hide]: scrolledToBottom !== false
})} })}
> >
<SVG src={chevronDown} /> <SVG src={chevronDown} />

6
src/hooks/useElementScroll.ts
View file

@ -21,7 +21,7 @@ export function isScrolledToBottom(
return !!anchor.current && position return !!anchor.current && position
? position.y + anchor.current.clientHeight + offset >= ? position.y + anchor.current.clientHeight + offset >=
anchor.current.scrollHeight anchor.current.scrollHeight
: false; : undefined;
} }
function useElementScroll(anchor: MutableRefObject<HTMLElement>): Position { function useElementScroll(anchor: MutableRefObject<HTMLElement>): Position {
@ -39,6 +39,10 @@ function useElementScroll(anchor: MutableRefObject<HTMLElement>): Position {
} }
}, [anchor.current]); }, [anchor.current]);
useEffect(() => {
setTimeout(() => setScroll(getPosition(anchor.current)), 100);
}, []);
return scroll; return scroll;
} }
export default useElementScroll; export default useElementScroll;