Merge branch 'master' of https://github.com/ONLYOFFICE/AppServer

web/ASC.Web.Common/package.json

@@ -1,6 +1,6 @@
 {
   "name": "asc-web-common",
-  "version": "1.0.52",
+  "version": "1.0.53",
   "description": "Ascensio System SIA common components and solutions library",
   "license": "AGPL-3.0",
   "files": [

web/ASC.Web.Common/src/pages/errors/401/index.js

@@ -11,7 +11,7 @@ const Error404Container = ({language}) => {
     i18n.changeLanguage(language);
   }, [language]);
 
-  return <ErrorContainer>{t("Error401Text")}</ErrorContainer>;
+  return <ErrorContainer headerText={t("Error401Text")} />;
 };
 
 function mapStateToProps(state) {

web/ASC.Web.Common/src/pages/errors/404/index.js

@@ -11,7 +11,7 @@ const Error404Container = ({language}) => {
     i18n.changeLanguage(language);
   }, [language]);
 
-  return <ErrorContainer>{t("Error404Text")}</ErrorContainer>;
+  return <ErrorContainer headerText={t("Error404Text")} />;
 };
 
 function mapStateToProps(state) {

web/ASC.Web.Common/src/pages/errors/offline/index.js

@@ -11,7 +11,7 @@ const ErrorOfflineContainer = ({language}) => {
     i18n.changeLanguage(language);
   }, [language]);
 
-  return <ErrorContainer>{t("ErrorOfflineText")}</ErrorContainer>;
+  return <ErrorContainer headerText={t("ErrorOfflineText")} />;
 };
 
 function mapStateToProps(state) {

web/ASC.Web.Components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "asc-web-components",
-  "version": "1.0.326",
+  "version": "1.0.327",
   "description": "Ascensio System SIA component library",
   "license": "AGPL-3.0",
   "main": "dist/asc-web-components.js",

web/ASC.Web.Components/src/components/error-container/error-container.stories.js

@@ -3,16 +3,16 @@ import { storiesOf } from '@storybook/react'
 import withReadme from 'storybook-readme/with-readme'
 import Readme from './README.md'
 import { withKnobs, text } from '@storybook/addon-knobs/react';
-import Text from '../text';
-import Heading from '../heading';
 import ErrorContainer from '.';
 
 storiesOf('Components| ErrorContainer', module)
     .addDecorator(withKnobs)
     .addDecorator(withReadme(Readme))
     .add('base', () => (
-        <ErrorContainer>
-            <Heading level={2} size='medium' isInline>{text("Headline text", "Some error has happened")}</Heading>
-            <Text as="span">{text("Body text", "Try again later")}</Text>
-        </ErrorContainer>
+        <ErrorContainer 
+            headerText={text("headerText", "Error 404. Page not found")}
+            bodyText={text("bodyText", "This page was removed, renamed or doesn’t exist anymore.")}
+            returnText={text("buttonText", "Return to homepage")}
+            returnUrl={text("buttonUrl", "/")}
+        />
     ));

web/ASC.Web.Components/src/components/error-container/error-container.test.js

@@ -5,12 +5,28 @@ import ErrorContainer from '.';
 describe('<ErrorContainer />', () => {
   it('renders without error', () => {
     const wrapper = mount(
-      <ErrorContainer>Some error has happened</ErrorContainer>
+      <ErrorContainer />
     );
 
     expect(wrapper).toExist();
   });
 
+  it('renders with props', () => {
+    const wrapper = mount(
+      <ErrorContainer  
+        headerText="Some error has happened"
+        bodyText="Try again later"
+        buttonText="Go back"
+        buttonUrl="/page" />
+    );
+
+    expect(wrapper).toExist();
+    expect(wrapper.prop('headerText')).toEqual('Some error has happened');
+    expect(wrapper.prop('bodyText')).toEqual('Try again later');
+    expect(wrapper.prop('buttonText')).toEqual('Go back');
+    expect(wrapper.prop('buttonUrl')).toEqual('/page');
+  });
+
   it('accepts id', () => {
     const wrapper = mount(
       <ErrorContainer id="testId" />

web/ASC.Web.Components/src/components/help-button/index.js

@@ -11,7 +11,13 @@ import Heading from "../heading";
 import throttle from "lodash/throttle";
 import styled from "styled-components";
 
-const HelpContainer = styled.div``;
+const HelpContainer = styled.div`
+  * {
+    white-space: unset;
+    overflow: unset;
+    text-overflow: unset;
+  }
+`;
 
 const Content = styled.div`
   box-sizing: border-box;