1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 21:06:42 +07:00

added experimental scroll helper

This commit is contained in:
Fedor Katurov 2022-01-10 16:47:29 +07:00
parent c2154e930c
commit 8d1e6989c2
8 changed files with 105 additions and 4 deletions

View file

@ -0,0 +1,35 @@
import { useEffect, useState } from 'react';
const getHeight = () => {
if (typeof document === 'undefined') {
return 0;
}
const body = document.body;
const html = document.documentElement;
return Math.max(
body.scrollHeight,
body.offsetHeight,
html.clientHeight,
html.scrollHeight,
html.offsetHeight
);
};
export const useScrollHeight = () => {
const [scrollHeight, setScrollHeight] = useState(getHeight());
useEffect(() => {
const measure = () => setScrollHeight(getHeight());
window.addEventListener('scroll', measure);
window.addEventListener('resize', measure);
return () => {
window.removeEventListener('scroll', measure);
window.removeEventListener('resize', measure);
};
}, []);
return scrollHeight;
};

View file

@ -0,0 +1,10 @@
import { useCallback } from 'react';
import { useScrollHeight } from '~/hooks/dom/useScrollHeight';
export const useScrollToBottom = () => {
const top = useScrollHeight();
return useCallback(() => {
window.scrollTo({ top });
}, [top]);
};

View file

@ -14,7 +14,6 @@ export const useScrollToTop = (deps?: any[]) => {
const bounds = targetElement.getBoundingClientRect();
window.scrollTo({
top: bounds.top - 100,
behavior: 'smooth',
});
},
deps && Array.isArray(deps) ? deps : []

View file

@ -1,7 +1,7 @@
import { useEffect, useState } from 'react';
export const useScrollTop = () => {
const [top, setTop] = useState(0);
const [top, setTop] = useState(typeof window !== 'undefined' ? window.scrollY : 0);
useEffect(() => {
const onScroll = () => {