Web: Client: fixed double api requests

web/ASC.Web.Client/src/Shell.jsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect } from "react";
 import { Router, Switch, Route, Redirect } from "react-router-dom";
 import { inject, observer } from "mobx-react";
 import NavMenu from "./components/NavMenu";
@@ -198,11 +198,8 @@ const Shell = ({ items = [], page = "home", ...rest }) => {
     roomsMode,
     setSnackbarExist,
     userTheme,
-    currentProductId,
   } = rest;
 
-  const [isDocuments, setIsDocuments] = useState(false);
-
   useEffect(() => {
     try {
       if (!window.AppServer) {
@@ -429,14 +426,6 @@ const Shell = ({ items = [], page = "home", ...rest }) => {
     if (userTheme) setTheme(userTheme);
   }, [userTheme]);
 
-  useEffect(() => {
-    if (window.location.pathname.toLowerCase().includes("files")) {
-      setIsDocuments(true);
-    } else {
-      setIsDocuments(false);
-    }
-  }, [currentProductId]);
-
   const pathname = window.location.pathname.toLowerCase();
   const isEditor = pathname.indexOf("doceditor") !== -1;
 
@@ -522,7 +511,7 @@ const Shell = ({ items = [], page = "home", ...rest }) => {
     <Layout>
       <Router history={history}>
         <>
-          {isDocuments ? <ReactSmartBanner t={t} ready={ready} /> : <></>}
+          <ReactSmartBanner t={t} ready={ready} />
           {isEditor ? <></> : <NavMenu />}
           <ScrollToTop />
           <Main isDesktop={isDesktop}>
@@ -585,7 +574,6 @@ const ShellWrapper = inject(({ auth, backup }) => {
     setSnackbarExist,
     socketHelper,
     setTheme,
-    currentProductId,
   } = settingsStore;
   const { setPreparationPortalDialogVisible } = backup;
 
@@ -614,7 +602,6 @@ const ShellWrapper = inject(({ auth, backup }) => {
     roomsMode,
     setSnackbarExist,
     userTheme: auth?.userStore?.user?.theme,
-    currentProductId,
   };
 })(observer(Shell));
 

web/ASC.Web.Client/src/components/SmartBanner/index.js

@@ -10,9 +10,17 @@ const Wrapper = styled.div`
 `;
 
 const ReactSmartBanner = (props) => {
-  const { t, ready, isBannerVisible, setIsBannerVisible } = props;
+  const {
+    t,
+    ready,
+    isBannerVisible,
+    setIsBannerVisible,
+    currentProductId,
+  } = props;
   const force = isIOS ? "ios" : "android";
 
+  const [isDocuments, setIsDocuments] = useState(false);
+
   const getCookie = (name) => {
     let matches = document.cookie.match(
       new RegExp(
@@ -34,6 +42,14 @@ const ReactSmartBanner = (props) => {
     if (cookieClosed || cookieInstalled) hideBanner();
   }, []);
 
+  useEffect(() => {
+    if (window.location.pathname.toLowerCase().includes("files")) {
+      setIsDocuments(true);
+    } else {
+      setIsDocuments(false);
+    }
+  }, [currentProductId]);
+
   const storeText = {
     ios: t("SmartBanner:AppStore"),
     android: t("SmartBanner:GooglePlay"),
@@ -60,7 +76,11 @@ const ReactSmartBanner = (props) => {
     navigator.maxTouchPoints > 0 ||
     navigator.msMaxTouchPoints > 0;
 
-  return isMobile && isBannerVisible && ready && isTouchDevice ? (
+  return isMobile &&
+    isBannerVisible &&
+    ready &&
+    isTouchDevice &&
+    isDocuments ? (
     <Wrapper>
       <SmartBanner
         title={t("SmartBanner:AppName")}
@@ -79,9 +99,10 @@ const ReactSmartBanner = (props) => {
   );
 };
 
-export default inject(({ bannerStore }) => {
+export default inject(({ auth, bannerStore }) => {
   return {
     isBannerVisible: bannerStore.isBannerVisible,
     setIsBannerVisible: bannerStore.setIsBannerVisible,
+    currentProductId: auth.settingsStore.currentProductId,
   };
 })(observer(ReactSmartBanner));