use-media-query subscribes to media queries.
It receives a media query as an argument and returns
true if the given media query matches the current state.
The hook relies on
and will return
false if the API is not available, unless an initial value is provided in the second argument.
Resize browser window to trigger
During server side rendering the hook will always return
window.matchMedia api is not available,
if that is not a desired behavior, you can override the initial value: