From 48e16ed8aeb0603b3d9ba8e510c8ea51abc511e8 Mon Sep 17 00:00:00 2001 From: "ThetaLog(n)" Date: Sun, 25 Jan 2026 01:16:40 +0100 Subject: [PATCH 1/3] refactor: replace deprecated matchMedia listeners with addEventListener --- frontend/src/hooks/useIsMobile.ts | 14 +++++--------- 1 file changed, 5 insertions(+), 9 deletions(-) diff --git a/frontend/src/hooks/useIsMobile.ts b/frontend/src/hooks/useIsMobile.ts index 520c94c6e4..dff1f1c792 100644 --- a/frontend/src/hooks/useIsMobile.ts +++ b/frontend/src/hooks/useIsMobile.ts @@ -15,16 +15,12 @@ export const useIsMobile = () => { } handleChange(mediaQuery) - - if (mediaQuery.addEventListener) { - mediaQuery.addEventListener('change', handleChange) - return () => mediaQuery.removeEventListener('change', handleChange) - } else { - // Safari browser < 14 fallback - mediaQuery.addListener(handleChange) - return () => mediaQuery.removeListener(handleChange) + + mediaQuery.addEventListener('change', handleChange) + return () => { + mediaQuery.removeEventListener('change', handleChange) } }, []) return isMobile -} +} \ No newline at end of file From c7e2d7fb573c5ff81d0130a05f152cc3fe1e6425 Mon Sep 17 00:00:00 2001 From: "ThetaLog(n)" Date: Sun, 25 Jan 2026 11:10:23 +0100 Subject: [PATCH 2/3] refactor: modernize useIsMobile hook and fix styling --- frontend/src/hooks/useIsMobile.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/src/hooks/useIsMobile.ts b/frontend/src/hooks/useIsMobile.ts index dff1f1c792..2b543cc46e 100644 --- a/frontend/src/hooks/useIsMobile.ts +++ b/frontend/src/hooks/useIsMobile.ts @@ -15,7 +15,7 @@ export const useIsMobile = () => { } handleChange(mediaQuery) - + mediaQuery.addEventListener('change', handleChange) return () => { mediaQuery.removeEventListener('change', handleChange) @@ -23,4 +23,4 @@ export const useIsMobile = () => { }, []) return isMobile -} \ No newline at end of file +} From 451f06f7aa239f5727574e25670ac2a54d7466e6 Mon Sep 17 00:00:00 2001 From: Arkadii Yakovets Date: Sun, 25 Jan 2026 12:53:36 -0800 Subject: [PATCH 3/3] Update code --- frontend/src/hooks/useIsMobile.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/hooks/useIsMobile.ts b/frontend/src/hooks/useIsMobile.ts index 2b543cc46e..29608c92ff 100644 --- a/frontend/src/hooks/useIsMobile.ts +++ b/frontend/src/hooks/useIsMobile.ts @@ -5,7 +5,7 @@ export const useIsMobile = () => { const [isMobile, setIsMobile] = useState(false) useEffect(() => { - // check whether the browser supports matchMedia API + // Check whether the browser supports matchMedia API. if (typeof globalThis.matchMedia !== 'function') return const mediaQuery = globalThis.matchMedia(`(max-width: ${desktopViewMinWidth - 1}px)`)