25 lines
874 B
JavaScript
25 lines
874 B
JavaScript
import { useEffect, useState } from 'react';
|
|
|
|
import { breakpoints } from '@edx/paragon';
|
|
|
|
/**
|
|
* A react hook used to determine if the current window is mobile or not.
|
|
* returns true if the window is of mobile size.
|
|
* Code source: https://github.com/edx/prospectus/blob/master/src/utils/useMobileResponsive.js
|
|
*/
|
|
const useMobileResponsive = (breakpoint) => {
|
|
const [isMobileWindow, setIsMobileWindow] = useState();
|
|
const checkForMobile = () => {
|
|
setIsMobileWindow(window.matchMedia(`(max-width: ${breakpoint || breakpoints.small.maxWidth}px)`).matches);
|
|
};
|
|
useEffect(() => {
|
|
checkForMobile();
|
|
window.addEventListener('resize', checkForMobile);
|
|
// return this function here to clean up the event listener
|
|
return () => window.removeEventListener('resize', checkForMobile);
|
|
});
|
|
return isMobileWindow;
|
|
};
|
|
|
|
export default useMobileResponsive;
|