Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-01-11 22:40:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

fix(BottomSheet): hide BottomSheet when screen is resized

Browse source
This commit is contained in:
Botzy 2025-02-25 11:45:48 +02:00
parent 2b5df90827
commit b563ea1d10
1 changed files with 6 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/components/BottomSheet/BottomSheet.tsx
View file

@ -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} />