From c100ab8f70dcd64c2cc550e68e779508b878081e Mon Sep 17 00:00:00 2001
From: kushagrasarathe <76868364+kushagrasarathe@users.noreply.github.com>
Date: Thu, 3 Jul 2025 15:44:38 +0200
Subject: [PATCH 1/4] fix: lock orienatation to protrait mode
---
src/app/layout.tsx | 2 +
.../Global/ScreenOrientationLocker.tsx | 39 +++++++++++++++++++
2 files changed, 41 insertions(+)
create mode 100644 src/components/Global/ScreenOrientationLocker.tsx
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 4339b58df..a45c9cc5c 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,3 +1,4 @@
+import { ScreenOrientationLocker } from '@/components/Global/ScreenOrientationLocker'
import { TranslationSafeWrapper } from '@/components/Global/TranslationSafeWrapper'
import { PeanutProvider } from '@/config'
import { ContextProvider } from '@/context'
@@ -61,6 +62,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
+
diff --git a/src/components/Global/ScreenOrientationLocker.tsx b/src/components/Global/ScreenOrientationLocker.tsx
new file mode 100644
index 000000000..958d5cdab
--- /dev/null
+++ b/src/components/Global/ScreenOrientationLocker.tsx
@@ -0,0 +1,39 @@
+'use client'
+
+import { useEffect } from 'react'
+import { captureException } from '@sentry/nextjs'
+
+export function ScreenOrientationLocker() {
+ useEffect(() => {
+ const lockOrientation = async () => {
+ if (screen.orientation && (screen.orientation as any).lock) {
+ try {
+ await (screen.orientation as any).lock('portrait-primary')
+ } catch (error) {
+ console.error('Failed to lock screen orientation:', error)
+ captureException(error)
+ }
+ }
+ }
+
+ lockOrientation()
+
+ const handleOrientationChange = () => {
+ // if the orientation is no longer portrait, try to lock it back.
+ if (!screen.orientation.type.startsWith('portrait')) {
+ lockOrientation()
+ }
+ }
+
+ // some browsers might not support addEventListener on screen.orientation
+ if (screen.orientation && screen.orientation.addEventListener) {
+ screen.orientation.addEventListener('change', handleOrientationChange)
+
+ return () => {
+ screen.orientation.removeEventListener('change', handleOrientationChange)
+ }
+ }
+ }, [])
+
+ return null
+}
\ No newline at end of file
From c561b0060affc221b008a732fbc34f5307728f49 Mon Sep 17 00:00:00 2001
From: kushagrasarathe <76868364+kushagrasarathe@users.noreply.github.com>
Date: Thu, 3 Jul 2025 15:48:39 +0200
Subject: [PATCH 2/4] style(fix): add new line
---
src/components/Global/ScreenOrientationLocker.tsx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/components/Global/ScreenOrientationLocker.tsx b/src/components/Global/ScreenOrientationLocker.tsx
index 958d5cdab..59cd560fd 100644
--- a/src/components/Global/ScreenOrientationLocker.tsx
+++ b/src/components/Global/ScreenOrientationLocker.tsx
@@ -36,4 +36,4 @@ export function ScreenOrientationLocker() {
}, [])
return null
-}
\ No newline at end of file
+}
From 764aec7c2a3e546f014b34763b59bcf55119e6cc Mon Sep 17 00:00:00 2001
From: kushagrasarathe <76868364+kushagrasarathe@users.noreply.github.com>
Date: Thu, 3 Jul 2025 15:51:08 +0200
Subject: [PATCH 3/4] style: format
---
src/components/Global/ScreenOrientationLocker.tsx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/components/Global/ScreenOrientationLocker.tsx b/src/components/Global/ScreenOrientationLocker.tsx
index 59cd560fd..e3df68f97 100644
--- a/src/components/Global/ScreenOrientationLocker.tsx
+++ b/src/components/Global/ScreenOrientationLocker.tsx
@@ -36,4 +36,4 @@ export function ScreenOrientationLocker() {
}, [])
return null
-}
+}
From 2a7e821db71440bc1d0b2854d72ac52b459da12c Mon Sep 17 00:00:00 2001
From: kushagrasarathe <76868364+kushagrasarathe@users.noreply.github.com>
Date: Thu, 3 Jul 2025 15:54:26 +0200
Subject: [PATCH 4/4] fix: if condition
---
src/components/Global/ScreenOrientationLocker.tsx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/components/Global/ScreenOrientationLocker.tsx b/src/components/Global/ScreenOrientationLocker.tsx
index e3df68f97..e200813fa 100644
--- a/src/components/Global/ScreenOrientationLocker.tsx
+++ b/src/components/Global/ScreenOrientationLocker.tsx
@@ -20,7 +20,7 @@ export function ScreenOrientationLocker() {
const handleOrientationChange = () => {
// if the orientation is no longer portrait, try to lock it back.
- if (!screen.orientation.type.startsWith('portrait')) {
+ if (screen.orientation && !screen.orientation.type.startsWith('portrait')) {
lockOrientation()
}
}