aboutsummaryrefslogtreecommitdiffstats
path: root/hooks/useMediaQuery.js
diff options
context:
space:
mode:
Diffstat (limited to 'hooks/useMediaQuery.js')
-rw-r--r--hooks/useMediaQuery.js19
1 files changed, 19 insertions, 0 deletions
diff --git a/hooks/useMediaQuery.js b/hooks/useMediaQuery.js
new file mode 100644
index 0000000..1adb499
--- /dev/null
+++ b/hooks/useMediaQuery.js
@@ -0,0 +1,19 @@
+import { useState, useEffect } from "react";
+
+const useMediaQuery = (query) => {
+ const [matches, setMatches] = useState(false);
+
+ useEffect(() => {
+ const media = window.matchMedia(query);
+ if (media.matches !== matches) {
+ setMatches(media.matches);
+ }
+ const listener = () => setMatches(media.matches);
+ window.addEventListener("resize", listener);
+ return () => window.removeEventListener("resize", listener);
+ }, [matches, query]);
+
+ return matches;
+}
+
+export default useMediaQuery;