From f8000cdc2a5e5352b5575d26a7fe3e1a7b33ab48 Mon Sep 17 00:00:00 2001
From: Tatiana Lopaeva <tatiana.lopaeva@onlyoffice.com>
Date: Fri, 3 Mar 2023 12:54:22 +0300
Subject: [PATCH] Web: PortalSettings: Backup: Fixed component display by
 direct url.

---
 .../data-management/backup/index.js           | 103 ------------------
 .../categories/data-management/index.js       | 100 ++++++++++++++---
 .../client/src/pages/PortalSettings/index.js  |   2 +-
 3 files changed, 88 insertions(+), 117 deletions(-)
 delete mode 100644 packages/client/src/pages/PortalSettings/categories/data-management/backup/index.js

diff --git a/packages/client/src/pages/PortalSettings/categories/data-management/backup/index.js b/packages/client/src/pages/PortalSettings/categories/data-management/backup/index.js
deleted file mode 100644
index 55e2ac0555..0000000000
--- a/packages/client/src/pages/PortalSettings/categories/data-management/backup/index.js
+++ /dev/null
@@ -1,103 +0,0 @@
-import HelpReactSvgUrl from "PUBLIC_DIR/images/help.react.svg?url";
-import React from "react";
-import { withTranslation, Trans } from "react-i18next";
-import Submenu from "@docspace/components/submenu";
-import Link from "@docspace/components/link";
-import HelpButton from "@docspace/components/help-button";
-import { combineUrl } from "@docspace/common/utils";
-import { inject, observer } from "mobx-react";
-import AutoBackup from "./auto-backup";
-import ManualBackup from "./manual-backup";
-import config from "PACKAGE_FILE";
-
-const Backup = ({
-  helpUrlCreatingBackup,
-  buttonSize,
-  t,
-  history,
-  isNotPaidPeriod,
-  currentColorScheme,
-}) => {
-  const renderTooltip = (helpInfo) => {
-    return (
-      <>
-        <HelpButton
-          place="bottom"
-          iconName={HelpReactSvgUrl}
-          tooltipContent={
-            <>
-              <Trans t={t} i18nKey={`${helpInfo}`} ns="Settings">
-                {helpInfo}
-              </Trans>
-              <div>
-                <Link
-                  as="a"
-                  href={helpUrlCreatingBackup}
-                  target="_blank"
-                  color={currentColorScheme.main.accent}
-                  isBold
-                  isHovered
-                >
-                  {t("Common:LearnMore")}
-                </Link>
-              </div>
-            </>
-          }
-        />
-      </>
-    );
-  };
-
-  const data = [
-    {
-      id: "data-backup",
-      name: t("DataBackup"),
-      content: (
-        <ManualBackup buttonSize={buttonSize} renderTooltip={renderTooltip} />
-      ),
-    },
-    {
-      id: "auto-backup",
-      name: t("AutoBackup"),
-      content: (
-        <AutoBackup buttonSize={buttonSize} renderTooltip={renderTooltip} />
-      ),
-    },
-  ];
-
-  const onSelect = (e) => {
-    history.push(
-      combineUrl(
-        window.DocSpaceConfig?.proxy?.url,
-        config.homepage,
-        `/portal-settings/backup/${e.id}`
-      )
-    );
-  };
-
-  return isNotPaidPeriod ? (
-    <ManualBackup buttonSize={buttonSize} renderTooltip={renderTooltip} />
-  ) : (
-    <Submenu data={data} startSelect={data[0]} onSelect={(e) => onSelect(e)} />
-  );
-};
-
-export default inject(({ auth }) => {
-  const { settingsStore, currentTariffStatusStore } = auth;
-  const { isNotPaidPeriod } = currentTariffStatusStore;
-
-  const {
-    helpUrlCreatingBackup,
-    isTabletView,
-    currentColorScheme,
-  } = settingsStore;
-
-  const buttonSize = isTabletView ? "normal" : "small";
-
-  return {
-    helpUrlCreatingBackup,
-    buttonSize,
-    isNotPaidPeriod,
-    currentColorScheme,
-  };
-})(observer(withTranslation(["Settings", "Common"])(Backup)));
diff --git a/packages/client/src/pages/PortalSettings/categories/data-management/index.js b/packages/client/src/pages/PortalSettings/categories/data-management/index.js
index b8d80d166d..239e9161ac 100644
--- a/packages/client/src/pages/PortalSettings/categories/data-management/index.js
+++ b/packages/client/src/pages/PortalSettings/categories/data-management/index.js
@@ -1,31 +1,85 @@
 import React, { useEffect, useState } from "react";
-import Submenu from "@docspace/components/submenu";
 import { withRouter } from "react-router";
-import { withTranslation } from "react-i18next";
+import { withTranslation, Trans } from "react-i18next";
 import { inject, observer } from "mobx-react";
-import { combineUrl } from "@docspace/common/utils";
-import config from "../../../../../../package.json";
 
-import Backup from "./backup";
+import HelpReactSvgUrl from "PUBLIC_DIR/images/help.react.svg?url";
+
+import Submenu from "@docspace/components/submenu";
+import Link from "@docspace/components/link";
+import HelpButton from "@docspace/components/help-button";
+import { combineUrl } from "@docspace/common/utils";
 import AppLoader from "@docspace/common/components/AppLoader";
 
+import config from "../../../../../package.json";
+import ManualBackup from "./backup/manual-backup";
+import AutoBackup from "./backup/auto-backup";
+
 const DataManagementWrapper = (props) => {
-  const { t, history } = props;
+  const {
+    helpUrlCreatingBackup,
+    buttonSize,
+    t,
+    history,
+    isNotPaidPeriod,
+    currentColorScheme,
+  } = props;
+
   const [currentTab, setCurrentTab] = useState(0);
   const [isLoading, setIsLoading] = useState(false);
+  const renderTooltip = (helpInfo) => {
+    return (
+      <>
+        <HelpButton
+          place="bottom"
+          iconName={HelpReactSvgUrl}
+          tooltipContent={
+            <>
+              <Trans t={t} i18nKey={`${helpInfo}`} ns="Settings">
+                {helpInfo}
+              </Trans>
+              <div>
+                <Link
+                  as="a"
+                  href={helpUrlCreatingBackup}
+                  target="_blank"
+                  color={currentColorScheme.main.accent}
+                  isBold
+                  isHovered
+                >
+                  {t("Common:LearnMore")}
+                </Link>
+              </div>
+            </>
+          }
+        />
+      </>
+    );
+  };
 
   const data = [
     {
-      id: "backup",
-      name: t("Backup"),
-      content: <Backup />,
+      id: "data-backup",
+      name: t("DataBackup"),
+      content: (
+        <ManualBackup buttonSize={buttonSize} renderTooltip={renderTooltip} />
+      ),
+    },
+    {
+      id: "auto-backup",
+      name: t("AutoBackup"),
+      content: (
+        <AutoBackup buttonSize={buttonSize} renderTooltip={renderTooltip} />
+      ),
     },
   ];
 
   useEffect(() => {
     const path = location.pathname;
+
     const currentTab = data.findIndex((item) => path.includes(item.id));
     if (currentTab !== -1) setCurrentTab(currentTab);
+
     setIsLoading(true);
   }, []);
 
@@ -34,13 +88,16 @@ const DataManagementWrapper = (props) => {
       combineUrl(
         window.DocSpaceConfig?.proxy?.url,
         config.homepage,
-        `/settings/datamanagement/${e.id}`
+        `/portal-settings/backup/${e.id}`
       )
     );
   };
 
   if (!isLoading) return <AppLoader />;
-  return (
+
+  return isNotPaidPeriod ? (
+    <ManualBackup buttonSize={buttonSize} renderTooltip={renderTooltip} />
+  ) : (
     <Submenu
       data={data}
       startSelect={currentTab}
@@ -49,12 +106,29 @@ const DataManagementWrapper = (props) => {
   );
 };
 
-export default inject(({ setup }) => {
+export default inject(({ auth, setup }) => {
   const { initSettings } = setup;
+  const { settingsStore, currentTariffStatusStore } = auth;
+  const { isNotPaidPeriod } = currentTariffStatusStore;
 
+  const {
+    helpUrlCreatingBackup,
+    isTabletView,
+    currentColorScheme,
+  } = settingsStore;
+
+  const buttonSize = isTabletView ? "normal" : "small";
   return {
     loadBaseInfo: async () => {
       await initSettings();
     },
+    helpUrlCreatingBackup,
+    buttonSize,
+    isNotPaidPeriod,
+    currentColorScheme,
   };
-})(withTranslation("Settings")(withRouter(observer(DataManagementWrapper))));
+})(
+  withTranslation(["Settings", "Common"])(
+    withRouter(observer(DataManagementWrapper))
+  )
+);
diff --git a/packages/client/src/pages/PortalSettings/index.js b/packages/client/src/pages/PortalSettings/index.js
index f04e947aaf..70ff4254d1 100644
--- a/packages/client/src/pages/PortalSettings/index.js
+++ b/packages/client/src/pages/PortalSettings/index.js
@@ -57,7 +57,7 @@ const SingleSignOn = lazy(() =>
   import("./categories/integration/SingleSignOn")
 );
 
-const Backup = lazy(() => import("./categories/data-management/backup"));
+const Backup = lazy(() => import("./categories/data-management/index"));
 
 const RestoreBackup = lazy(() =>
   import("./categories/data-management/backup/restore-backup/index")