Web: Files: added banner store

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

@@ -1,28 +1,21 @@
 import React from "react";
 import { withRouter } from "react-router";
 import { withTranslation } from "react-i18next";
+import { inject, observer } from "mobx-react";
 import CampaignsBanner from "@appserver/components/campaigns-banner";
 import Loaders from "@appserver/common/components/Loaders";
 
-const PureBanner = ({ t, tReady }) => {
-  const bannerTypes = [
-    "Cloud",
-    "Desktop",
-    "Education",
-    "Enterprise",
-    "Integration",
-  ];
-
-  const type = bannerTypes[Math.floor(Math.random() * bannerTypes.length)];
+const PureBanner = ({ t, tReady, getBannerType }) => {
+  const bannerType = getBannerType();
 
   if (tReady)
     return (
       <CampaignsBanner
-        headerLabel={t(`CampaignPersonal${type}:Header`)}
-        subHeaderLabel={t(`CampaignPersonal${type}:SubHeader`)}
-        img={`/static/images/campaigns.${type}.png`}
-        btnLabel={t(`CampaignPersonal${type}:ButtonLabel`)}
-        link={t(`CampaignPersonal${type}:Link`)}
+        headerLabel={t(`CampaignPersonal${bannerType}:Header`)}
+        subHeaderLabel={t(`CampaignPersonal${bannerType}:SubHeader`)}
+        img={`/static/images/campaigns.${bannerType}.png`}
+        btnLabel={t(`CampaignPersonal${bannerType}:ButtonLabel`)}
+        link={t(`CampaignPersonal${bannerType}:Link`)}
       />
     );
   else return <Loaders.Rectangle />;
@@ -36,4 +29,8 @@ const Banner = withTranslation([
   "CampaignPersonalIntegration",
 ])(withRouter(PureBanner));
 
-export default Banner;
+export default inject(({ bannerStore }) => {
+  const { getBannerType } = bannerStore;
+
+  return { getBannerType };
+})(observer(Banner));

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

@@ -85,6 +85,7 @@ class ArticleBodyContent extends React.Component {
       selectedTreeNode,
       enableThirdParty,
       isVisitor,
+      firstLoad,
     } = this.props;
 
     return isEmpty(treeFolders) ? (

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

@@ -0,0 +1,17 @@
+import { makeAutoObservable } from "mobx";
+
+class BannerStore {
+  bannerTypes = ["Cloud", "Desktop", "Education", "Enterprise", "Integration"];
+
+  constructor() {
+    makeAutoObservable(this);
+  }
+
+  getBannerType = () => {
+    return this.bannerTypes[
+      Math.floor(Math.random() * this.bannerTypes.length)
+    ];
+  };
+}
+
+export default BannerStore;

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

@@ -17,6 +17,8 @@ import PrimaryProgressDataStore from "./PrimaryProgressDataStore";
 import VersionHistoryStore from "./VersionHistoryStore";
 import DialogsStore from "./DialogsStore";
 
+import BannerStore from "./BannerStore";
+
 import store from "studio/store";
 
 const formatsStore = new FormatsStore(
@@ -67,6 +69,8 @@ const filesActionsStore = new FilesActionsStore(
 
 const versionHistoryStore = new VersionHistoryStore(filesStore);
 
+const bannerStore = new BannerStore();
+
 const stores = {
   filesStore,
   settingsStore,
@@ -78,6 +82,7 @@ const stores = {
   treeFoldersStore,
   selectedFolderStore,
   filesActionsStore,
+  bannerStore,
 };
 
 export default stores;