Merge branch 'bugfix/v0.1.6' of https://github.com/ONLYOFFICE/AppServer into bugfix/v0.1.6

products/ASC.Files/Client/src/components/Article/Body/index.js

@@ -62,11 +62,11 @@ class ArticleBodyContent extends React.Component {
         fetchFiles(data[0], newFilter)
           .catch((err) => toastr.error(err))
           .finally(() => {
-            clickBackdrop();
+
             setIsLoading(false);
           });
       } else {
-        clickBackdrop();
+
         newFilter.startIndex = 0;
         const urlFilter = newFilter.toUrlParams();
         history.push(

products/ASC.Files/Client/src/components/pages/Home/Section/Body/FilesRow/FilesRowContainer.js

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { inject, observer } from "mobx-react";
 import RowContainer from "@appserver/components/row-container";
 import { Consumer } from "@appserver/components/utils/context";
@@ -6,9 +6,35 @@ import SimpleFilesRow from "./SimpleFilesRow";
 import Loaders from "@appserver/common/components/Loaders";
 import { isMobile } from "react-device-detect";
 
-const FilesRowContainer = (props) => {
-  const { isLoaded, isLoading } = props;
-  return !isLoaded || (isMobile && isLoading) ? (
+let loadTimeout = null;
+
+const FilesRowContainer = ({ isLoaded, isLoading, filesList }) => {
+  const [inLoad, setInLoad] = useState(false);
+
+  const cleanTimer = () => {
+    loadTimeout && clearTimeout(loadTimeout);
+    loadTimeout = null;
+  };
+
+  useEffect(() => {
+    if (isLoading) {
+      cleanTimer();
+      loadTimeout = setTimeout(() => {
+        console.log("inLoad", true);
+        setInLoad(true);
+      }, 500);
+    } else {
+      cleanTimer();
+      console.log("inLoad", false);
+      setInLoad(false);
+    }
+
+    return () => {
+      cleanTimer();
+    };
+  }, [isLoading]);
+
+  return !isLoaded || (isMobile && inLoad) ? (
     <Loaders.Rows />
   ) : (
     <Consumer>
@@ -18,7 +44,7 @@ const FilesRowContainer = (props) => {
           draggable
           useReactWindow={false}
         >
-          {props.filesList.map((item, index) => (
+          {filesList.map((item, index) => (
             <SimpleFilesRow
               key={`${item.id}_${index}`}
               item={item}

products/ASC.Files/Client/src/components/pages/Home/Section/Body/index.js

@@ -1,4 +1,4 @@
-import React, { useEffect } from "react";
+import React, { useEffect, useState } from "react";
 import { withRouter } from "react-router";
 import { withTranslation } from "react-i18next";
 import Loaders from "@appserver/common/components/Loaders";
@@ -10,6 +10,8 @@ import EmptyContainer from "./EmptyContainer";
 
 let currentDroppable = null;
 
+let loadTimeout = null;
+
 const SectionBodyContent = (props) => {
   const {
     t,
@@ -28,6 +30,31 @@ const SectionBodyContent = (props) => {
     moveDragItems,
   } = props;
 
+  const [inLoad, setInLoad] = useState(false);
+
+  const cleanTimer = () => {
+    loadTimeout && clearTimeout(loadTimeout);
+    loadTimeout = null;
+  };
+
+  useEffect(() => {
+    if (isLoading) {
+      cleanTimer();
+      loadTimeout = setTimeout(() => {
+        console.log("inLoad", true);
+        setInLoad(true);
+      }, 500);
+    } else {
+      cleanTimer();
+      console.log("inLoad", false);
+      setInLoad(false);
+    }
+
+    return () => {
+      cleanTimer();
+    };
+  }, [isLoading]);
+
   useEffect(() => {
     const customScrollElm = document.querySelector(
       "#customScrollBar > .scroll-body"
@@ -146,7 +173,7 @@ const SectionBodyContent = (props) => {
   //console.log("Files Home SectionBodyContent render", props);
 
   return (!fileActionId && isEmptyFilesList) || null ? (
-    firstLoad || (isMobile && isLoading) ? (
+    firstLoad || (isMobile && inLoad) ? (
       <Loaders.Rows />
     ) : (
       <EmptyContainer />

products/ASC.Files/Client/src/store/FilesStore.js

@@ -78,15 +78,7 @@ class FilesStore {
   };
 
   setIsLoading = (isLoading) => {
-    if (isLoading) {
-      this.loadTimeout && clearTimeout(this.loadTimeout);
-      this.loadTimeout = setTimeout(() => {
-        this.isLoading = isLoading;
-      }, 500);
-    } else {
-      this.loadTimeout && clearTimeout(this.loadTimeout);
-      this.isLoading = isLoading;
-    }
+    this.isLoading = isLoading;
   };
 
   setTooltipPosition = (tooltipPageX, tooltipPageY) => {

products/ASC.People/Client/src/components/Article/Body/index.js

@@ -171,7 +171,7 @@ class ArticleBodyContent extends React.Component {
     const { history, selectGroup } = this.props;
 
     this.changeTitleDocument(groupId);
-    clickBackdrop();
+
 
     if (window.location.pathname.indexOf("/people/filter") > 0) {
       selectGroup(groupId);

products/ASC.People/Client/src/pages/Home/Section/Body/index.js

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 import RowContainer from "@appserver/components/row-container";
 import { Consumer } from "@appserver/components/utils/context";
 //import toastr from "studio/toastr";
@@ -10,8 +10,35 @@ import SimpleUserRow from "./SimpleUserRow";
 import Dialogs from "./Dialogs";
 import { isMobile } from "react-device-detect";
 
+let loadTimeout = null;
+
 const SectionBodyContent = ({ isLoaded, peopleList, isLoading, isRefresh }) => {
-  return !isLoaded || (isMobile && isLoading) || isRefresh ? (
+  const [inLoad, setInLoad] = useState(false);
+
+  const cleanTimer = () => {
+    loadTimeout && clearTimeout(loadTimeout);
+    loadTimeout = null;
+  };
+
+  useEffect(() => {
+    if (isLoading) {
+      cleanTimer();
+      loadTimeout = setTimeout(() => {
+        console.log("inLoad", true);
+        setInLoad(true);
+      }, 500);
+    } else {
+      cleanTimer();
+      console.log("inLoad", false);
+      setInLoad(false);
+    }
+
+    return () => {
+      cleanTimer();
+    };
+  }, [isLoading]);
+
+  return !isLoaded || (isMobile && inLoad) || isRefresh ? (
     <Loaders.Rows isRectangle={false} />
   ) : peopleList.length > 0 ? (
     <>

products/ASC.People/Client/src/store/PeopleStore.js

@@ -79,15 +79,7 @@ class PeopleStore {
   };
 
   setIsLoading = (isLoading) => {
-    if (isLoading) {
-      this.loadTimeout && clearTimeout(this.loadTimeout);
-      this.loadTimeout = setTimeout(() => {
-        this.isLoading = isLoading;
-      }, 500);
-    } else {
-      this.loadTimeout && clearTimeout(this.loadTimeout);
-      this.isLoading = isLoading;
-    }
+    this.isLoading = isLoading;
   };
 
   setIsLoaded = (isLoaded) => {

web/ASC.Web.Client/src/components/pages/Settings/Layout/Article/Body/index.js

@@ -148,7 +148,7 @@ class ArticleBodyContent extends React.Component {
       return;
     }
 
-    clickBackdrop();
+
     this.setState({ selectedKeys: value });
   };