Web:Studio:Added Submenu.

web/ASC.Web.Client/src/components/pages/Settings/categories/common/SettingsPageLayout.js

@@ -68,7 +68,6 @@ const SettingsPageLayout = ({ children }) => {
     return () => window.removeEventListener("resize", checkInnerWidth);
   }, []);
 
-  //TODO: Add menu, hide along the route
   const isMobile = !!(isSmallTablet() && mobileView);
 
   console.log("isMobile", isMobile);

web/ASC.Web.Client/src/components/pages/Settings/categories/common/index.js

@@ -0,0 +1,61 @@
+import React, { useEffect, useState } from "react";
+import Submenu from "@appserver/components/submenu";
+import { withRouter } from "react-router";
+import { withTranslation } from "react-i18next";
+import { AppServerConfig } from "@appserver/common/constants";
+import { combineUrl } from "@appserver/common/utils";
+import config from "../../../../../../package.json";
+
+import Customization from "./customization";
+import WhiteLabel from "./whitelabel";
+import AppLoader from "@appserver/common/components/AppLoader";
+
+const SubmenuCommon = (props) => {
+  const { t, history } = props;
+  const [currentTab, setCurrentTab] = useState(0);
+  const [isLoading, setIsLoading] = useState(false);
+
+  const data = [
+    {
+      id: "customization",
+      name: t("Customization"),
+      content: <Customization />,
+    },
+    {
+      id: "whitelabel",
+      name: t("White label"),
+      content: <WhiteLabel />,
+    },
+  ];
+
+  useEffect(() => {
+    const path = location.pathname;
+    const currentTab = data.findIndex((item) => path.includes(item.id));
+    if (currentTab !== -1) {
+      setCurrentTab(currentTab);
+    }
+    setIsLoading(true);
+  }, []);
+
+  const onSelect = (e) => {
+    history.push(
+      combineUrl(
+        AppServerConfig.proxyURL,
+        config.homepage,
+        `/settings/common/${e.id}`
+      )
+    );
+  };
+
+  return !isLoading ? (
+    <AppLoader />
+  ) : (
+    <Submenu
+      data={data}
+      startSelect={currentTab}
+      onSelect={(e) => onSelect(e)}
+    />
+  );
+};
+
+export default withTranslation("Settings")(withRouter(SubmenuCommon));

web/ASC.Web.Client/src/components/pages/Settings/categories/common/whitelabel.js

@@ -244,7 +244,7 @@ class WhiteLabel extends React.Component {
     const { setWhiteLabelSettings } = this.props;
     const { logoText } = this.state;
 
-    // TODO: Для всех картинок написать логику
+    // TODO: Add logic to all pictures
     let fd = new FormData();
     fd.append("logoText", logoText);
 
@@ -268,7 +268,7 @@ class WhiteLabel extends React.Component {
   onChangeHandler = (e) => {
     const { setWhiteLabelSettings } = this.props;
 
-    // TODO: Добавить проверку на размер
+    // TODO: Add size check
 
     let file = e.target.files[0];
 

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

@@ -9,6 +9,8 @@ const SecuritySettings = lazy(() => import("./categories/security/index.js"));
 const Admins = lazy(() => import("./categories/security/access-rights/admins"));
 const TfaPage = lazy(() => import("./categories/security/access-portal/tfa"));
 
+const CommonSettings = lazy(() => import("./categories/common/index.js"));
+
 const CustomizationSettings = lazy(() =>
   import("./categories/common/customization")
 );
@@ -34,9 +36,16 @@ const ManualBackup = lazy(() =>
 const RestoreBackup = lazy(() =>
   import("./categories/data-management/backup/restore-backup")
 );
-//const WhiteLabel = lazy(() => import("./categories/common/whitelabel"));
+
+const WhiteLabel = lazy(() => import("./categories/common/whitelabel"));
+
 const PROXY_BASE_URL = combineUrl(AppServerConfig.proxyURL, "/settings");
 
+const COMMON_URLS = [
+  combineUrl(PROXY_BASE_URL, "/common/customization"),
+  combineUrl(PROXY_BASE_URL, "/common/whitelabel"),
+];
+
 const CUSTOMIZATION_URLS = [
   combineUrl(PROXY_BASE_URL, "/common/customization"),
   combineUrl(PROXY_BASE_URL, "/common"),
@@ -54,7 +63,7 @@ const TEAM_TEMPLATE_URL = combineUrl(
   PROXY_BASE_URL,
   "/common/customization/team-template"
 );
-//const WHITELABEL_URL = combineUrl(PROXY_BASE_URL, "/common/whitelabel");
+const WHITELABEL_URL = combineUrl(PROXY_BASE_URL, "/common/whitelabel");
 const SECURITY_URLS = [
   combineUrl(PROXY_BASE_URL, "/security/access-rights"),
   combineUrl(PROXY_BASE_URL, "/security/access-portal"),
@@ -78,23 +87,22 @@ const Settings = () => {
     <Layout key="1">
       <Suspense fallback={null}>
         <Switch>
-          <Route
+          <Route exact path={COMMON_URLS} component={CommonSettings} />
+
+          {/* <Route
             exact
             path={CUSTOMIZATION_URLS}
             component={CustomizationSettings}
-          />
+          /> */}
           <Route exact path={LTZ_URL} component={LanguageAndTimeZoneSettings} />
           <Route
             exact
             path={WELCOME_PAGE_SETTINGS_URL}
             component={WelcomePageSettings}
           />
+          <Route exact path={WHITELABEL_URL} component={WhiteLabel} />
           <Route exact path={TEAM_TEMPLATE_URL} component={TeamTemplate} />
-          {/* <Route
-            exact
-            path={WHITELABEL_URL}
-            component={WhiteLabel}
-          /> */}
+
           <Route exact path={SECURITY_URLS} component={SecuritySettings} />
           <Route path={ADMINS_URL} component={Admins} />
           <Route exact path={TFA_PAGE_URL} component={TfaPage} />