diff --git a/app/components/CenteredContent/CenteredContent.js b/app/components/CenteredContent/CenteredContent.js index bcfaedb8f..b3736f6c8 100644 --- a/app/components/CenteredContent/CenteredContent.js +++ b/app/components/CenteredContent/CenteredContent.js @@ -8,7 +8,7 @@ type Props = { const Container = styled.div` width: 100%; - margin: 60px; + padding: 60px; `; const Content = styled.div` diff --git a/app/components/ErrorBoundary/ErrorBoundary.js b/app/components/ErrorBoundary/ErrorBoundary.js index 7577017a9..f34df8fac 100644 --- a/app/components/ErrorBoundary/ErrorBoundary.js +++ b/app/components/ErrorBoundary/ErrorBoundary.js @@ -5,8 +5,13 @@ import { observable } from 'mobx'; import CenteredContent from 'components/CenteredContent'; import PageTitle from 'components/PageTitle'; +type Props = { + children?: ?React.Element, +}; + @observer class ErrorBoundary extends Component { + props: Props; @observable error: boolean = false; componentDidCatch(error: Error, info: Object) { @@ -27,9 +32,10 @@ class ErrorBoundary extends Component { return ( -

Something went wrong

+

🛸 Something unexpected happened

- An unrecoverable error occurred. Please try{' '} + An unrecoverable error occurred{window.Bugsnag || + (true && ' and our engineers have been notified')}. Please try{' '} reloading.

diff --git a/app/scenes/Document/Document.js b/app/scenes/Document/Document.js index 7aa08b9cb..084d96f68 100644 --- a/app/scenes/Document/Document.js +++ b/app/scenes/Document/Document.js @@ -33,6 +33,7 @@ import CenteredContent from 'components/CenteredContent'; import PageTitle from 'components/PageTitle'; import NewDocumentIcon from 'components/Icon/NewDocumentIcon'; import Actions, { Action, Separator } from 'components/Actions'; +import ErrorBoundary from 'components/ErrorBoundary'; import Search from 'scenes/Search'; const DISCARD_CHANGES = ` @@ -216,75 +217,77 @@ class DocumentScene extends Component { return ( - {isMoving && document && } - {titleText && } - {(this.isLoading || this.isSaving) && } - {isFetching && ( - - - - )} - {!isFetching && - document && ( - - - - - {!isNew && - !this.isEditing && } - - {this.isEditing ? ( - - ) : ( - Edit - )} - - {this.isEditing && ( - - Discard - - )} - {!this.isEditing && ( - - - - )} - {!this.isEditing && } - - {!this.isEditing && ( - - - - )} - - - + + {isMoving && document && } + {titleText && } + {(this.isLoading || this.isSaving) && } + {isFetching && ( + + + )} + {!isFetching && + document && ( + + + + + {!isNew && + !this.isEditing && } + + {this.isEditing ? ( + + ) : ( + Edit + )} + + {this.isEditing && ( + + Discard + + )} + {!this.isEditing && ( + + + + )} + {!this.isEditing && } + + {!this.isEditing && ( + + + + )} + + + + )} + ); }