PLT-7468 Moved more error pages to use predefined error types (#7378)
* PLT-7468 Moved more errors to use error types * PLT-7468 Moved 404 error page to use error types * Made helper function for rendering external links on error page
Этот коммит содержится в:
Harrison Healey
коммит произвёл
Joram Wilander
Joram Wilander
родитель
6ca443a255
Коммит
e30e4cfe3d
@@ -8,7 +8,6 @@ import {FormattedMessage} from 'react-intl';
|
||||
import {Link} from 'react-router/es6';
|
||||
|
||||
import {ErrorPageTypes} from 'utils/constants.jsx';
|
||||
import * as TextFormatting from 'utils/text_formatting.jsx';
|
||||
import * as Utils from 'utils/utils.jsx';
|
||||
|
||||
export default class ErrorPage extends React.Component {
|
||||
@@ -16,14 +15,6 @@ export default class ErrorPage extends React.Component {
|
||||
location: PropTypes.object.isRequired
|
||||
};
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.renderTitle = this.renderTitle.bind(this);
|
||||
this.renderMessage = this.renderMessage.bind(this);
|
||||
this.renderLink = this.renderLink.bind(this);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
$('body').attr('class', 'sticky error');
|
||||
}
|
||||
@@ -32,18 +23,29 @@ export default class ErrorPage extends React.Component {
|
||||
$('body').attr('class', '');
|
||||
}
|
||||
|
||||
linkFilter(link) {
|
||||
return link.startsWith('https://docs.mattermost.com') || link.startsWith('https://forum.mattermost.org');
|
||||
}
|
||||
|
||||
renderTitle() {
|
||||
if (this.props.location.query.type === ErrorPageTypes.LOCAL_STORAGE) {
|
||||
renderTitle = () => {
|
||||
switch (this.props.location.query.type) {
|
||||
case ErrorPageTypes.LOCAL_STORAGE:
|
||||
return (
|
||||
<FormattedMessage
|
||||
id='error.local_storage.title'
|
||||
defaultMessage='Cannot Load Mattermost'
|
||||
/>
|
||||
);
|
||||
case ErrorPageTypes.PERMALINK_NOT_FOUND:
|
||||
return (
|
||||
<FormattedMessage
|
||||
id='permalink.error.title'
|
||||
defaultMessage='Message Not Found'
|
||||
/>
|
||||
);
|
||||
case ErrorPageTypes.PAGE_NOT_FOUND:
|
||||
return (
|
||||
<FormattedMessage
|
||||
id='error.not_found.title'
|
||||
defaultMessage='Message Not Found'
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
if (this.props.location.query.title) {
|
||||
@@ -53,8 +55,9 @@ export default class ErrorPage extends React.Component {
|
||||
return Utils.localizeMessage('error.generic.title', 'Error');
|
||||
}
|
||||
|
||||
renderMessage() {
|
||||
if (this.props.location.query.type === ErrorPageTypes.LOCAL_STORAGE) {
|
||||
renderMessage = () => {
|
||||
switch (this.props.location.query.type) {
|
||||
case ErrorPageTypes.LOCAL_STORAGE:
|
||||
return (
|
||||
<div>
|
||||
<FormattedMessage
|
||||
@@ -83,45 +86,108 @@ export default class ErrorPage extends React.Component {
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
case ErrorPageTypes.PERMALINK_NOT_FOUND:
|
||||
return (
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='permalink.error.access'
|
||||
defaultMessage='Permalink belongs to a deleted message or to a channel to which you do not have access.'
|
||||
/>
|
||||
</p>
|
||||
);
|
||||
case ErrorPageTypes.OAUTH_MISSING_CODE:
|
||||
return (
|
||||
<div>
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='error.oauth_missing_code'
|
||||
defaultMessage='The service provider {service} did not provide an authorization code in the redirect URL.'
|
||||
values={{
|
||||
service: this.props.location.query.service
|
||||
}}
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='error.oauth_missing_code.google'
|
||||
defaultMessage='For {link} make sure your administrator enabled the Google+ API.'
|
||||
values={{
|
||||
link: this.renderLink('https://docs.mattermost.com/deployment/sso-google.html', 'error.oauth_missing_code.google.link', 'Google Apps')
|
||||
}}
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='error.oauth_missing_code.office365'
|
||||
defaultMessage='For {link} make sure the administrator of your Microsoft organization has enabled the Mattermost app.'
|
||||
values={{
|
||||
link: this.renderLink('https://docs.mattermost.com/deployment/sso-office.html', 'error.oauth_missing_code.office365.link', 'Office 365')
|
||||
}}
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='error.oauth_missing_code.gitlab'
|
||||
defaultMessage='For {link} please make sure you followed the setup instructions.'
|
||||
values={{
|
||||
link: this.renderLink('https://docs.mattermost.com/deployment/sso-gitlab.html', 'error.oauth_missing_code.gitlab.link', 'GitLab')
|
||||
}}
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='error.oauth_missing_code.forum'
|
||||
defaultMessage="If you reviewed the above and are still having trouble with configuration, you may post in our {link} where we'll be happy to help with issues during setup."
|
||||
values={{
|
||||
link: this.renderLink('https://forum.mattermost.org/c/trouble-shoot', 'error.oauth_missing_code.forum.link', 'Troubleshooting forum')
|
||||
}}
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
case ErrorPageTypes.PAGE_NOT_FOUND:
|
||||
return (
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='error.not_found.message'
|
||||
defaultMessage='The page you were trying to reach does not exist'
|
||||
/>
|
||||
</p>
|
||||
);
|
||||
}
|
||||
|
||||
let message = this.props.location.query.message;
|
||||
if (!message) {
|
||||
message = Utils.localizeMessage('error.generic.message', 'An error has occoured.');
|
||||
}
|
||||
|
||||
return <div dangerouslySetInnerHTML={{__html: TextFormatting.formatText(message, {linkFilter: this.linkFilter})}}/>;
|
||||
}
|
||||
|
||||
renderLink() {
|
||||
let link = this.props.location.query.link;
|
||||
if (link) {
|
||||
link = link.trim();
|
||||
} else {
|
||||
link = '/';
|
||||
}
|
||||
|
||||
if (!link.startsWith('/')) {
|
||||
// Only allow relative links
|
||||
link = '/';
|
||||
}
|
||||
|
||||
let linkMessage = this.props.location.query.linkmessage;
|
||||
if (!linkMessage) {
|
||||
linkMessage = Utils.localizeMessage('error.generic.link_message', 'Back to Mattermost');
|
||||
if (this.props.location.query.message) {
|
||||
return <p>{this.props.location.query.message}</p>;
|
||||
}
|
||||
|
||||
return (
|
||||
<Link to={link}>
|
||||
{linkMessage}
|
||||
</Link>
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='error.generic.message'
|
||||
defaultMessage='An error has occurred.'
|
||||
/>
|
||||
</p>
|
||||
);
|
||||
}
|
||||
|
||||
renderLink = (url, id, defaultMessage) => {
|
||||
return (
|
||||
<a
|
||||
href={url}
|
||||
rel='noopener noreferrer'
|
||||
target='_blank'
|
||||
>
|
||||
<FormattedMessage
|
||||
id={id}
|
||||
defaultMessage={defaultMessage}
|
||||
/>
|
||||
</a>
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
const title = this.renderTitle();
|
||||
const message = this.renderMessage();
|
||||
const link = this.renderLink();
|
||||
|
||||
return (
|
||||
<div className='container-fluid'>
|
||||
@@ -129,9 +195,16 @@ export default class ErrorPage extends React.Component {
|
||||
<div className='error__icon'>
|
||||
<i className='fa fa-exclamation-triangle'/>
|
||||
</div>
|
||||
<h2>{title}</h2>
|
||||
<h2>
|
||||
{title}
|
||||
</h2>
|
||||
{message}
|
||||
{link}
|
||||
<Link to='/'>
|
||||
<FormattedMessage
|
||||
id='error.generic.link'
|
||||
defaultMessage='Back to Mattermost'
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
Ссылка в новой задаче
Block a user