diff --git a/client/src/components/Draftail/EditorFallback/EditorFallback.js b/client/src/components/Draftail/EditorFallback/EditorFallback.js index 5b8360953..764359ced 100644 --- a/client/src/components/Draftail/EditorFallback/EditorFallback.js +++ b/client/src/components/Draftail/EditorFallback/EditorFallback.js @@ -4,6 +4,8 @@ import { convertFromRaw } from 'draft-js'; import { STRINGS } from '../../../config/wagtailConfig'; +const MAX_EDITOR_RELOADS = 3; + class EditorFallback extends PureComponent { constructor(props) { super(props); @@ -12,12 +14,14 @@ class EditorFallback extends PureComponent { this.state = { error: null, + reloads: 0, isContentShown: false, initialContent: field.value, }; this.renderError = this.renderError.bind(this); this.toggleContent = this.toggleContent.bind(this); + this.onReloadEditor = this.onReloadEditor.bind(this); } componentDidCatch(error) { @@ -29,6 +33,15 @@ class EditorFallback extends PureComponent { field.value = initialContent; } + onReloadEditor() { + const { reloads } = this.state; + + this.setState({ + error: null, + reloads: reloads + 1, + }); + } + toggleContent() { const { isContentShown } = this.state; this.setState({ isContentShown: !isContentShown }); @@ -36,19 +49,31 @@ class EditorFallback extends PureComponent { renderError() { const { field } = this.props; - const { isContentShown } = this.state; + const { reloads, isContentShown } = this.state; const content = field.rawContentState && convertFromRaw(field.rawContentState).getPlainText(); return (