Merge master

frontend/scenes/Document/Document.js

@@ -6,6 +6,7 @@ import { observer, inject } from 'mobx-react';
 import { withRouter, Prompt } from 'react-router';
 import Flex from 'components/Flex';
 import { color, layout } from 'styles/constants';
+import { collectionUrl } from 'utils/routeHelpers';
 
 import Document from 'models/Document';
 import UiStore from 'stores/UiStore';
@@ -19,6 +20,7 @@ import LoadingIndicator from 'components/LoadingIndicator';
 import Collaborators from 'components/Collaborators';
 import CenteredContent from 'components/CenteredContent';
 import PageTitle from 'components/PageTitle';
+import Search from 'scenes/Search';
 
 const DISCARD_CHANGES = `
 You have unsaved changes.
@@ -46,6 +48,7 @@ type Props = {
     isSaving: false,
     newDocument: undefined,
     showAsSaved: false,
+    notFound: false,
   };
 
   componentDidMount() {
@@ -57,6 +60,7 @@ type Props = {
       nextProps.match.params.documentSlug !==
       this.props.match.params.documentSlug
     ) {
+      this.setState({ notFound: false });
       this.loadDocument(nextProps);
     }
   }
@@ -86,6 +90,9 @@ type Props = {
       if (document) {
         this.props.ui.setActiveDocument(document);
         document.view();
+      } else {
+        // Render 404 with search
+        this.setState({ notFound: true });
       }
     }
   };
@@ -146,7 +153,13 @@ type Props = {
   };
 
   onCancel = () => {
-    this.props.history.goBack();
+    let url;
+    if (this.document && this.document.url) {
+      url = this.document.url;
+    } else {
+      url = collectionUrl(this.props.match.params.id);
+    }
+    this.props.history.push(url);
   };
 
   onStartDragging = () => {
@@ -157,6 +170,10 @@ type Props = {
     this.setState({ isDragging: false });
   };
 
+  renderNotFound() {
+    return <Search notFound />;
+  }
+
   render() {
     const isNew = this.props.newDocument;
     const isEditing = !!this.props.match.params.edit || isNew;
@@ -164,6 +181,10 @@ type Props = {
     const titleText = get(this.document, 'title', '');
     const document = this.document;
 
+    if (this.state.notFound) {
+      return this.renderNotFound();
+    }
+
     return (
       <Container column auto>
         {this.state.isDragging &&