Proyectos de Subversion LeadersLinked - SPA

import { useLayoutEffect, useState } from 'react';

export function useMediaQuery(query, options = { defaultValue: false, initializeWithValue: true }) {

  const getMatches = (query) => {

    return window.matchMedia(query).matches;

  };

  const [matches, setMatches] = useState(() => {

    if (options.initializeWithValue) {

      return getMatches(query);

    }

    return options.defaultValue;

  });

  // Handles the change event of the media query.

  function handleChange() {

    setMatches(getMatches(query));

  }

  useLayoutEffect(() => {

    const matchMedia = window.matchMedia(query);

    handleChange();

    matchMedia.addEventListener('change', handleChange);

    return () => {

      matchMedia.removeEventListener('change', handleChange);

    };

  }, [query]);

  return matches;

}