Merge pull request #80 from jorilallo/jori/collection-children

Collection backend refactor

frontend/models/Collection.js

@@ -14,7 +14,7 @@ class Collection {
   id: string;
   name: string;
   type: 'atlas' | 'journal';
-  navigationTree: NavigationNode;
+  documents: Array<NavigationNode>;
   updatedAt: string;
   url: string;
 

frontend/scenes/Collection/Collection.js

@@ -40,7 +40,7 @@ type State = {
           throw new Error('TODO code up non-atlas collections');
 
         this.setState({
-          redirectUrl: collection.navigationTree.url,
+          redirectUrl: collection.documents[0].url,
         });
       })
       .catch(() => {

frontend/scenes/Document/Document.js

@@ -117,11 +117,7 @@ type Props = {
               />
             : <a onClick={this.onEdit}>Edit</a>}
         </HeaderAction>
-        <Menu
-          store={this.store}
-          document={this.store.document}
-          collectionTree={this.store.collectionTree}
-        />
+        <Menu store={this.store} document={this.store.document} />
       </Flex>
     );
 

frontend/scenes/Document/DocumentStore.js

@@ -1,5 +1,5 @@
 // @flow
-import { observable, action, computed, toJS } from 'mobx';
+import { observable, action, computed } from 'mobx';
 import get from 'lodash/get';
 import invariant from 'invariant';
 import { client } from 'utils/ApiClient';
@@ -49,42 +49,22 @@ class DocumentStore {
     return !!this.document && this.document.collection.type === 'atlas';
   }
 
-  @computed get collectionTree(): ?Object {
-    if (
-      this.document &&
-      this.document.collection &&
-      this.document.collection.type === 'atlas'
-    ) {
-      const tree = this.document.collection.navigationTree;
-      const collapseNodes = node => {
-        node.collapsed = this.collapsedNodes.includes(node.id);
-        node.children = node.children.map(childNode => {
-          return collapseNodes(childNode);
-        });
-
-        return node;
-      };
-
-      return collapseNodes(toJS(tree));
-    }
-  }
-
   @computed get pathToDocument(): Array<NavigationNode> {
     let path;
-    const traveler = (node, previousPath) => {
-      if (this.document && node.id === this.document.id) {
-        path = previousPath;
-        return;
-      } else {
-        node.children.forEach(childNode => {
-          const newPath = [...previousPath, node];
+    const traveler = (nodes, previousPath) => {
+      nodes.forEach(childNode => {
+        const newPath = [...previousPath, childNode];
+        if (childNode.id === this.document.id) {
+          path = previousPath;
+          return;
+        } else {
           return traveler(childNode, newPath);
-        });
-      }
+        }
+      });
     };
 
-    if (this.document && this.collectionTree) {
-      traveler(this.collectionTree, []);
+    if (this.document && this.document.collection.documents) {
+      traveler(this.document.collection.documents, []);
       invariant(path, 'Path is not available for collection, abort');
       return path.splice(1);
     }

frontend/scenes/Document/components/Menu.js

@@ -11,7 +11,6 @@ import DocumentStore from '../DocumentStore';
 type Props = {
   history: Object,
   document: DocumentType,
-  collectionTree: ?Object,
   store: DocumentStore,
 };
 
@@ -19,8 +18,9 @@ type Props = {
   props: Props;
 
   onCreateDocument = () => {
-    invariant(this.props.collectionTree, 'collectionTree is not available');
-    this.props.history.push(`${this.props.collectionTree.url}/new`);
+    // Disabled until created a better API
+    // invariant(this.props.collectionTree, 'collectionTree is not available');
+    // this.props.history.push(`${this.props.collectionTree.url}/new`);
   };
 
   onCreateChild = () => {
@@ -55,24 +55,29 @@ type Props = {
 
   render() {
     const document = get(this.props, 'document');
-    const collection = get(document, 'collection.type') === 'atlas';
-    const allowDelete =
-      collection &&
-      document.id !== get(document, 'collection.navigationTree.id');
+    if (document) {
+      const collection = document.collection;
+      const allowDelete =
+        collection &&
+        collection.type === 'atlas' &&
+        collection.documents &&
+        collection.documents.length > 1;
 
-    return (
-      <DropdownMenu label={<MoreIcon />}>
-        {collection &&
-          <div>
-            <MenuItem onClick={this.onCreateDocument}>
-              New document
-            </MenuItem>
-            <MenuItem onClick={this.onCreateChild}>New child</MenuItem>
-          </div>}
-        <MenuItem onClick={this.onExport}>Export</MenuItem>
-        {allowDelete && <MenuItem onClick={this.onDelete}>Delete</MenuItem>}
-      </DropdownMenu>
-    );
+      return (
+        <DropdownMenu label={<MoreIcon />}>
+          {collection &&
+            <div>
+              <MenuItem onClick={this.onCreateDocument}>
+                New document
+              </MenuItem>
+              <MenuItem onClick={this.onCreateChild}>New child</MenuItem>
+            </div>}
+          <MenuItem onClick={this.onExport}>Export</MenuItem>
+          {allowDelete && <MenuItem onClick={this.onDelete}>Delete</MenuItem>}
+        </DropdownMenu>
+      );
+    }
+    return null;
   }
 }
 

frontend/types/index.js

@@ -15,7 +15,6 @@ export type NavigationNode = {
   id: string,
   title: string,
   url: string,
-  collapsed: boolean,
   children: Array<NavigationNode>,
 };