trace-system/frontend
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: improve Android orientation detection in signature overlay

Browse Source
This commit is contained in:
Frudrax Cheng
2026-05-28 09:42:31 +08:00
parent 04b4ed5884
commit 8b930ff44d
1 changed files with 17 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/SignatureOverlay.tsx
+17 -4
View File
@@ -11,7 +11,8 @@ interface SignatureOverlayProps {
}
const isLandscapeNow = () =>
typeof window !== 'undefined' && window.matchMedia('(orientation: landscape)').matches;
typeof window !== 'undefined' &&
(window.matchMedia('(orientation: landscape)').matches || window.innerWidth > window.innerHeight);
function SignatureOverlay({ open, onCancel, onConfirm }: SignatureOverlayProps) {
const padRef = useRef<SignaturePadHandle>(null);
@@ -22,9 +23,15 @@ function SignatureOverlay({ open, onCancel, onConfirm }: SignatureOverlayProps)
if (!open) return;
const mq = window.matchMedia('(orientation: landscape)');
const update = () => setLandscape(mq.matches);
const update = () => setLandscape(mq.matches || window.innerWidth > window.innerHeight);
update();
mq.addEventListener('change', update);
if (typeof mq.addEventListener === 'function') {
mq.addEventListener('change', update);
} else {
mq.addListener(update);
}
window.addEventListener('resize', update);
window.addEventListener('orientationchange', update);
const orientation = (screen as Screen & {
orientation?: { lock?: (o: string) => Promise<void>; unlock?: () => void };
@@ -39,7 +46,13 @@ function SignatureOverlay({ open, onCancel, onConfirm }: SignatureOverlayProps)
document.body.style.overflow = 'hidden';
return () => {
mq.removeEventListener('change', update);
if (typeof mq.removeEventListener === 'function') {
mq.removeEventListener('change', update);
} else {
mq.removeListener(update);
}
window.removeEventListener('resize', update);
window.removeEventListener('orientationchange', update);
document.body.style.overflow = prevOverflow;
orientation?.unlock?.();
};