lbry-desktop/ui/effects/use-screensize.js

37 lines
884 B
JavaScript
Raw Normal View History

2020-08-21 17:49:13 +02:00
// Widths are taken from "ui/scss/init/vars.scss"
import React from 'react';
function useWindowSize() {
const isWindowClient = typeof window === 'object';
const [windowSize, setWindowSize] = React.useState(isWindowClient ? window.innerWidth : undefined);
React.useEffect(() => {
function setSize() {
setWindowSize(window.innerWidth);
}
if (isWindowClient) {
window.addEventListener('resize', setSize);
return () => window.removeEventListener('resize', setSize);
}
}, [isWindowClient, setWindowSize]);
return windowSize;
}
2020-08-10 22:47:39 +02:00
export function useIsMobile() {
2020-08-21 17:49:13 +02:00
const windowSize = useWindowSize();
return windowSize < 901;
2020-08-10 22:47:39 +02:00
}
export function useIsMediumScreen() {
2020-08-21 17:49:13 +02:00
const windowSize = useWindowSize();
return windowSize < 1151;
}
export function useIsLargeScreen() {
const windowSize = useWindowSize();
return windowSize > 1600;
2020-08-10 22:47:39 +02:00
}