1import {useRef, useState} from 'react';
 2import useEventListener from './useEventListener';
 3
 4const useMinimizedFab = () => {
 5  const [isFabMinimized, setIsFabMinimized] = useState(false);
 6  const element = useRef(
 7    typeof document !== 'undefined'
 8      ? document.getElementById('event-content')
 9      : null
10  );
11
12  useEventListener(
13    'scroll',
14    event => {
15      if (typeof document != 'undefined') {
16        const positionFromTop = event.target.scrollTop;
17        const positionFromBottom =
18          event.target.scrollHeight -
19          event.target.offsetHeight -
20          event.target.scrollTop;
21
22        if (
23          (positionFromTop < 20 || positionFromBottom < 20) &&
24          isFabMinimized
25        ) {
26          setIsFabMinimized(false);
27        } else if (
28          !isFabMinimized &&
29          positionFromTop > 20 &&
30          positionFromBottom > 20
31        ) {
32          setIsFabMinimized(true);
33        }
34      }
35    },
36    element
37  );
38
39  return isFabMinimized;
40};
41
42export default useMinimizedFab;