From 96bfc3f8f9141e777f1a1053ffacfdb5968f4ee8 Mon Sep 17 00:00:00 2001
From: Artem Tarasov <artem.tarasov@onlyoffice.com>
Date: Thu, 3 Dec 2020 11:02:19 +0300
Subject: [PATCH] Web: Common: Layout: refactoring

---
 .../src/components/Layout/MobileLayout.js              |  8 +++-----
 web/ASC.Web.Common/src/components/Layout/index.js      | 10 ++++------
 2 files changed, 7 insertions(+), 11 deletions(-)

diff --git a/web/ASC.Web.Common/src/components/Layout/MobileLayout.js b/web/ASC.Web.Common/src/components/Layout/MobileLayout.js
index 4f31b79d11..133eb6a2cf 100644
--- a/web/ASC.Web.Common/src/components/Layout/MobileLayout.js
+++ b/web/ASC.Web.Common/src/components/Layout/MobileLayout.js
@@ -1,7 +1,7 @@
 import React, { Component, createRef } from "react";
 import { Scrollbar, utils } from "asc-web-components";
 import { LayoutContextProvider } from "./context";
-import { isMobile, isSafari, isIOS, isChrome } from "react-device-detect";
+import { isMobile, isSafari, isIOS } from "react-device-detect";
 
 const { isTouchDevice } = utils.device;
 class MobileLayout extends Component {
@@ -44,12 +44,10 @@ class MobileLayout extends Component {
         ? this.documentElement.scrollTop
         : window.pageYOffset;
 
-    let isVisible;
-
     if (visibleContent && isMobile && !isTouchDevice) {
       return;
     }
-    if (window.pageYOffset !== 0) {
+    if (!isIOS && window.pageYOffset !== 0) {
       window.scroll(0, 0);
       return;
     }
@@ -65,7 +63,7 @@ class MobileLayout extends Component {
       }
     }
 
-    isVisible = prevScrollPosition >= currentScrollPosition;
+    let isVisible = prevScrollPosition >= currentScrollPosition;
 
     if (
       (isSafari || isIOS) &&
diff --git a/web/ASC.Web.Common/src/components/Layout/index.js b/web/ASC.Web.Common/src/components/Layout/index.js
index 19ca244a15..ce4d948350 100644
--- a/web/ASC.Web.Common/src/components/Layout/index.js
+++ b/web/ASC.Web.Common/src/components/Layout/index.js
@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
 import styled from "styled-components";
 import MobileLayout from "./MobileLayout";
 import { utils } from "asc-web-components";
-import { isIOS, isFirefox, isChrome, isMobile } from "react-device-detect";
+import { isIOS, isFirefox } from "react-device-detect";
 
 const { size } = utils.device;
 
@@ -29,14 +29,13 @@ const Layout = (props) => {
   }, []);
 
   useEffect(() => {
-    if (isMobile) {
+    if (isIOS && !isFirefox) {
       window.addEventListener("resize", resizeHandler);
-
       resizeHandler();
     }
 
     return () => {
-      if (isMobile) {
+      if (isIOS && !isFirefox) {
         window.removeEventListener("resize", resizeHandler);
       }
     };
@@ -44,7 +43,7 @@ const Layout = (props) => {
 
   const resizeHandler = () => {
     const intervalTime = 100;
-    const endTimeout = 500;
+    const endTimeout = 300;
 
     let interval, timeout, lastInnerHeight, noChangeCount;
 
@@ -56,7 +55,6 @@ const Layout = (props) => {
       timeout = null;
 
       const vh = (window.innerHeight - 57) * 0.01;
-
       document.documentElement.style.setProperty("--vh", `${vh}px`);
     };
     interval = setInterval(() => {