Web: Settings: Fixed crash on language undefined

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

@@ -4,7 +4,7 @@ import { PageLayout } from "asc-web-common";
 import { I18nextProvider } from "react-i18next";
 import { ArticleHeaderContent, ArticleBodyContent } from "./Article";
 import { SectionHeaderContent } from "./Section";
-import { store } from "asc-web-common";
+import { store, utils } from "asc-web-common";
 
 import { createI18N } from "../../../../helpers/i18n";
 
@@ -14,6 +14,7 @@ const i18n = createI18N({
 });
 
 const { setCurrentProductId } = store.auth.actions;
+const { changeLanguage } = utils;
 
 const Layout = ({
   currentProductId,
@@ -23,7 +24,7 @@ const Layout = ({
 }) => {
   useEffect(() => {
     currentProductId !== "settings" && setCurrentProductId("settings");
-    i18n.changeLanguage(language);
+    changeLanguage(i18n);
   }, [language, currentProductId, setCurrentProductId]);
 
   return (

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

@@ -3,8 +3,7 @@ import { connect } from "react-redux";
 import { withTranslation } from "react-i18next";
 import { Text, Loader, toastr, Link, Icons } from "asc-web-components";
 import styled from "styled-components";
-import { Trans } from "react-i18next";
+import { store, utils } from "asc-web-common";
-import { store, utils, api } from "asc-web-common";
 import {
   setLanguageAndTime,
   getPortalTimezones
@@ -103,8 +102,6 @@ class Customization extends React.Component {
 
     document.title = `${t("Customization")} – ${t("OrganizationName")}`;
 
-    changeLanguage(props.i18n);
-
     this.state = {
       isLoadedData: false,
       isLoading: false,
@@ -235,10 +232,11 @@ class Customization extends React.Component {
                 color="#333333"
               />
             </div>
+            {language && language.label && timezone && timezone.label && (
               <Text className="category-item-subheader" truncate={true}>
-              {" "}
+                {`${language.label} / ${timezone.label}`}
-              {language.label} / {timezone.label}{" "}
               </Text>
+            )}
             <Text className="category-item-description">
               {t("LanguageAndTimeZoneSettingsDescription")}
             </Text>
@@ -273,8 +271,8 @@ function mapStateToProps(state) {
   return {
     portalLanguage: state.auth.settings.culture,
     portalTimeZoneId: state.auth.settings.timezone,
-    language: state.auth.user.cultureName ||
+    language:
-      state.auth.settings.culture || { label: "en-US" },
+      state.auth.user.cultureName || state.auth.settings.culture || "en-US",
     rawTimezones: state.auth.settings.timezones,
     rawCultures: state.auth.settings.cultures,
     nameSchemaId: state.auth.settings.nameSchemaId

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

@@ -1,31 +0,0 @@
-import React, { lazy, Suspense } from "react";
-import { Route, Switch } from "react-router-dom";
-import { withRouter } from "react-router";
-import { Loader } from "asc-web-components";
-
-const CustomizationSettings = lazy(() => import("./customization"));
-// const WhiteLabel = lazy(() => import("./whitelabel"));
-
-const Common = ({ match }) => {
-  const basePath = '/settings/common';
-
-  return (
-    <Suspense fallback={<Loader className="pageLoader" type="rombs" size='40px' />}>
-      <Switch>
-        <Route
-          exact
-          path={[`${basePath}/customization`, '/common', match.path]}
-          component={CustomizationSettings}
-        />
-        {/* <Route
-          exact
-          path={`${basePath}/whitelabel`}
-          component={WhiteLabel}
-        /> */}
-      </Switch>
-    </Suspense>
-  );
-};
-
-
-export default withRouter(Common);

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

@@ -1,25 +1,36 @@
-import React, { lazy,Suspense } from "react";
+import React, { lazy, Suspense } from "react";
 import { Route, Switch, Redirect } from "react-router-dom";
 import { withRouter } from "react-router";
-import Layout from './Layout';
+import Layout from "./Layout";
 import { Loader } from "asc-web-components";
 
 const SecuritySettings = lazy(() => import("./categories/security"));
-const CustomizationSettings = lazy(() => import("./categories/common/customization"));
+const CustomizationSettings = lazy(() =>
-const LanguageAndTimeZoneSettings = lazy(() => import("./categories/common/language-and-time-zone"));
+  import("./categories/common/customization")
+);
+const LanguageAndTimeZoneSettings = lazy(() =>
+  import("./categories/common/language-and-time-zone")
+);
 const CustomTitles = lazy(() => import("./categories/common/custom-titles"));
 
+//const WhiteLabel = lazy(() => import("./categories/common/whitelabel"));
+
 const Settings = () => {
-  const basePath = '/settings';
+  const basePath = "/settings";
 
   return (
-    <Layout key='1'>
+    <Layout key="1">
-      <Suspense fallback={<Loader className="pageLoader" type="rombs" size='40px' />}>
+      <Suspense
+        fallback={<Loader className="pageLoader" type="rombs" size="40px" />}
+      >
         <Switch>
-         
           <Route
             exact
-            path={[`${basePath}/common/customization`, `${basePath}/common`, basePath]}
+            path={[
+              `${basePath}/common/customization`,
+              `${basePath}/common`,
+              basePath
+            ]}
             component={CustomizationSettings}
           />
           <Route
@@ -32,13 +43,15 @@ const Settings = () => {
             path={[`${basePath}/common/customization/custom-titles`]}
             component={CustomTitles}
           />
-          <Route
+          {/* <Route
-            path={`${basePath}/security`}
+            exact
-            component={SecuritySettings}
+            path={`${basePath}/common/whitelabel`}
-          />
+            component={WhiteLabel}
+          /> */}
+          <Route path={`${basePath}/security`} component={SecuritySettings} />
           <Redirect
             to={{
-              pathname: "/error/404",
+              pathname: "/error/404"
             }}
           />
         </Switch>