Re-do document creation

frontend/scenes/DocumentScene/DocumentScene.js

@@ -88,9 +88,12 @@ class DocumentScene extends React.Component {
     browserHistory.push(url);
   }
 
-  onCreate = () => {
-    const url = `${this.store.document.url}/new`;
-    browserHistory.push(url);
+  onCreateDocument = () => {
+    browserHistory.push(`${this.store.collectionTree.url}/new`);
+  }
+
+  onCreateChild = () => {
+    browserHistory.push(`${this.store.document.url}/new`);
   }
 
   onDelete = () => {
@@ -142,8 +145,12 @@ class DocumentScene extends React.Component {
       actions = (
         <div className={ styles.actions }>
           <DropdownMenu label={ <MoreIcon /> }>
-            { this.store.isCollection &&
-              <MenuItem onClick={ this.onCreate }>New document</MenuItem> }
+            { this.store.isCollection && (
+              <div className={ styles.menuGroup }>
+                <MenuItem onClick={ this.onCreateDocument }>New document</MenuItem>
+                <MenuItem onClick={ this.onCreateChild }>New child</MenuItem>
+              </div>
+            ) }
             <MenuItem onClick={ this.onEdit }>Edit</MenuItem>
             <MenuItem onClick={ this.onExport }>Export</MenuItem>
             { allowDelete && <MenuItem onClick={ this.onDelete }>Delete</MenuItem> }

frontend/scenes/DocumentScene/DocumentScene.scss

@@ -7,3 +7,7 @@
   position: relative;
   overflow: scroll;
 }
+
+.menuGroup {
+  border-bottom: 1px solid #eee;
+}

frontend/scenes/DocumentScene/components/Sidebar/Sidebar.js

@@ -50,18 +50,18 @@ class Sidebar extends React.Component {
               />
             </Flex>
             <Flex auto className={ styles.actions }>
-              <Link
-                to={ `${this.props.navigationTree.url}/new` }
-                className={ cx(styles.action) }
-              >
-                Add document
-              </Link>
-              <Separator />
-              <a
-                href
+              { this.store.isEditing && (
+                <span className={ styles.action }>
+                  Drag & drop to organize <Separator />&nbsp;
+                </span>
+              ) }
+              <span
+                role="button"
                 onClick={ this.toggleEdit }
                 className={ cx(styles.action, { active: this.store.isEditing }) }
-              >Organize</a>
+              >
+                { !this.store.isEditing ? 'Organize documents' : 'Save' }
+              </span>
             </Flex>
           </Flex>
         ) }