import { useMediaQuery } from 'react-responsive';

import { mediaQuery } from './useResponsiveQuery';

export const useIsMobileDevice = (): boolean =>
  useMediaQuery({ query: mediaQuery.mobileDeviceOnly });

export const useIsTabletDevice = (): boolean =>
  useMediaQuery({ query: mediaQuery.tabletDeviceOnly });

export const useIsTabletDeviceAndDown = (): boolean =>
  useMediaQuery({ query: mediaQuery.tabletDeviceAndDown });

export const useIsSmallDesktopDeviceAndUp = (): boolean =>
  useMediaQuery({ query: mediaQuery.smallDesktopDeviceAndUp });

export const useIsSmallDesktopDevice = (): boolean =>
  useMediaQuery({ query: mediaQuery.smallDesktopDeviceOnly });

export const useIsLargeDesktopDevice = (): boolean =>
  useMediaQuery({ query: mediaQuery.largeDesktopDeviceOnly });

export const useIsDesktopDevice = (): boolean =>
  useMediaQuery({ query: mediaQuery.desktopDeviceOnly });