From b563ea1d10e24bc21f35af69cfec4fb98fed382e Mon Sep 17 00:00:00 2001
From: Botzy <bodim93@gmail.com>
Date: Tue, 25 Feb 2025 11:45:48 +0200
Subject: [PATCH] fix(BottomSheet): hide BottomSheet when screen is resized

---
 src/components/BottomSheet/BottomSheet.tsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/components/BottomSheet/BottomSheet.tsx b/src/components/BottomSheet/BottomSheet.tsx
index 7ebfb79d8..28e2f631a 100644
--- a/src/components/BottomSheet/BottomSheet.tsx
+++ b/src/components/BottomSheet/BottomSheet.tsx
@@ -4,6 +4,7 @@ import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { createPortal } from 'react-dom';
 import classNames from 'classnames';
 import useBinaryState from 'stremio/common/useBinaryState';
+import useWindowSize from 'stremio/common/useWindowSize';
 import styles from './BottomSheet.less';
 
 const CLOSE_THRESHOLD = 100;
@@ -17,6 +18,7 @@ type Props = {
 
 const BottomSheet = ({ children, title, show, onClose }: Props) => {
     const containerRef = useRef<HTMLDivElement>(null);
+    const { width: windowWidth, height: windowHeight } = useWindowSize();
     const [startOffset, setStartOffset] = useState(0);
     const [offset, setOffset] = useState(0);
 
@@ -58,6 +60,10 @@ const BottomSheet = ({ children, title, show, onClose }: Props) => {
         !opened && onClose();
     }, [opened]);
 
+    useEffect(() => {
+        opened && close();
+    }, [windowWidth, windowHeight]);
+
     return opened && createPortal((
         <div className={styles['bottom-sheet']}>
             <div className={styles['backdrop']} onClick={onCloseRequest} />