Change EditorFallback button order

This commit is contained in:
Thibaud Colas 2018-03-27 23:03:53 +03:00
parent 101b446749
commit 2e74f0fdcf
3 changed files with 32 additions and 30 deletions

View file

@ -61,11 +61,31 @@ class EditorFallback extends PureComponent {
renderError() {
const { field } = this.props;
const { error, info, reloads, showContent, showError } = this.state;
const content = field.rawContentState && convertFromRaw(field.rawContentState).getPlainText();
const content =
field.rawContentState &&
convertFromRaw(field.rawContentState).getPlainText();
return (
<div className="Draftail-Editor">
<div className="Draftail-Toolbar">
{content && (
<button
type="button"
className="Draftail-ToolbarButton"
onClick={this.toggleContent}
>
{STRINGS.SHOW_LATEST_CONTENT}
</button>
)}
<button
type="button"
className="Draftail-ToolbarButton"
onClick={this.toggleError}
>
{'Show error'}
</button>
{/* At first we propose reloading the editor. If it still crashes, reload the whole page. */}
{reloads < MAX_EDITOR_RELOADS ? (
<button
@ -84,24 +104,6 @@ class EditorFallback extends PureComponent {
{STRINGS.RELOAD_PAGE}
</button>
)}
<button
type="button"
className="Draftail-ToolbarButton"
onClick={this.toggleError}
>
{'Show error'}
</button>
{content && (
<button
type="button"
className="Draftail-ToolbarButton"
onClick={this.toggleContent}
>
{STRINGS.SHOW_LATEST_CONTENT}
</button>
)}
</div>
<div className="DraftEditor-root">
@ -120,7 +122,7 @@ class EditorFallback extends PureComponent {
{showError && (
<pre className="help-block help-critical">
<code className="EditorFallback__error">
{`${error.stack}\n${info.componentStack}`}
{`${error.stack}\n${info.componentStack}`}
</code>
</pre>
)}

View file

@ -61,7 +61,7 @@ describe('EditorFallback', () => {
error: new Error('test'),
})
.find('button')
.first()
.last()
.simulate('click');
expect(wrapper).toMatchSnapshot();
@ -82,7 +82,7 @@ describe('EditorFallback', () => {
reloads: 3,
})
.find('button')
.first()
.last()
.simulate('click');
expect(window.location.reload).toHaveBeenCalled();
@ -105,7 +105,7 @@ describe('EditorFallback', () => {
info: { componentStack: 'test' },
})
.find('button')
.last()
.first()
.simulate('click');
expect(wrapper).toMatchSnapshot();
@ -136,7 +136,7 @@ describe('EditorFallback', () => {
info: { componentStack: 'test' },
})
.find('button')
.slice(2, 3)
.first()
.simulate('click');
expect(wrapper).toMatchSnapshot();

View file

@ -12,7 +12,7 @@ exports[`EditorFallback #error #showContent 1`] = `
onClick={[Function]}
type="button"
>
Reload the editor
Show latest content
</button>
<button
className="Draftail-ToolbarButton"
@ -26,7 +26,7 @@ exports[`EditorFallback #error #showContent 1`] = `
onClick={[Function]}
type="button"
>
Show latest content
Reload the editor
</button>
</div>
<div
@ -58,14 +58,14 @@ exports[`EditorFallback #error #showError 1`] = `
onClick={[Function]}
type="button"
>
Reload the editor
Show error
</button>
<button
className="Draftail-ToolbarButton"
onClick={[Function]}
type="button"
>
Show error
Reload the editor
</button>
</div>
<div
@ -104,14 +104,14 @@ exports[`EditorFallback #error works 1`] = `
onClick={[Function]}
type="button"
>
Reload the editor
Show error
</button>
<button
className="Draftail-ToolbarButton"
onClick={[Function]}
type="button"
>
Show error
Reload the editor
</button>
</div>
<div