IlyaSobolev/DocSpace-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed Bug 57352: Added event listener on page resize for MainButtonMobile component, fixed calcualting default height

Browse Source
This commit is contained in:
Ilya Oleshko 2022-05-27 15:40:51 +03:00
parent 881a70a540
commit 475802a0e2
1 changed files with 19 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
packages/asc-web-components/main-button-mobile/index.js
View File

@ -1,4 +1,4 @@
import React, { useState, useRef, useEffect } from "react";
import React, { useState, useRef, useEffect, useCallback } from "react";
import PropTypes from "prop-types";
import {
StyledFloatingButton,
@ -108,10 +108,14 @@ const MainButtonMobile = (props) => {
const [isOpen, setIsOpen] = useState(opened);
const [isUploading, setIsUploading] = useState(false);
const [height, setHeight] = useState("calc(100% - 48px)");
const [height, setHeight] = useState(window.innerHeight - 48 + "px");
const divRef = useRef();
const ref = useRef();
const dropDownRef = useRef();
useEffect(() => {
if (opened !== isOpen) {
setIsOpen(opened);
@ -119,17 +123,24 @@ const MainButtonMobile = (props) => {
}, [opened]);
useEffect(() => {
recalculateHeight();
}, [isOpen, isOpenButton, window.innerHeight, isUploading]);
useEffect(() => {
window.addEventListener("resize", recalculateHeight);
return () => {
window.removeEventListener("resize", recalculateHeight);
};
}, [recalculateHeight]);
const recalculateHeight = () => {
let height =
divRef?.current?.getBoundingClientRect()?.height || window.innerHeight;
height >= window.innerHeight
? setHeight("calc(100% - 48px)")
? setHeight(window.innerHeight - 48 + "px")
: setHeight(height + "px");
}, [isOpen, isOpenButton, window.innerHeight, isUploading]);
const ref = useRef();
const dropDownRef = useRef();
};
const toggle = (isOpen) => {
if (isOpenButton && onClose) {