Address ssr error in use-mobile hook

This addresses the error:

SSR ERROR  window is not defined
Source: hooks/use-mobile.ts:5:13

Author: nerlichman

app/frontend/hooks/use-mobile.ts

@@ -2,20 +2,27 @@ import { useSyncExternalStore } from "react"
 
 const MOBILE_BREAKPOINT = 768
 
-const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`)
+const mql =
+  typeof window !== "undefined"
+    ? window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`)
+    : null
 
 function mediaQueryListener(callback: (event: MediaQueryListEvent) => void) {
-  mql.addEventListener("change", callback)
+  mql?.addEventListener("change", callback)
 
   return () => {
-    mql.removeEventListener("change", callback)
+    mql?.removeEventListener("change", callback)
   }
 }
 
 function isSmallerThanBreakpoint() {
-  return mql.matches
+  return mql!.matches
 }
 
 export function useIsMobile() {
-  return useSyncExternalStore(mediaQueryListener, isSmallerThanBreakpoint)
+  return useSyncExternalStore(
+    mediaQueryListener,
+    isSmallerThanBreakpoint,
+    () => false,
+  )
 }