chore: Flatten left nav in preparation to refactor drag to reorder (#1689)

* flatten hierarchy
* fix drop to import positioning on collections

app/components/Sidebar/components/CollectionLink.js

@@ -2,13 +2,11 @@
 import { observable } from "mobx";
 import { observer } from "mobx-react";
 import * as React from "react";
-import DocumentsStore from "stores/DocumentsStore";
 import UiStore from "stores/UiStore";
 import Collection from "models/Collection";
 import Document from "models/Document";
 import CollectionIcon from "components/CollectionIcon";
 import DropToImport from "components/DropToImport";
-import Flex from "components/Flex";
 import DocumentLink from "./DocumentLink";
 import EditableTitle from "./EditableTitle";
 import SidebarLink from "./SidebarLink";
@@ -18,7 +16,6 @@ type Props = {|
   collection: Collection,
   ui: UiStore,
   canUpdate: boolean,
-  documents: DocumentsStore,
   activeDocument: ?Document,
   prefetchDocument: (id: string) => Promise<void>,
 |};
@@ -34,61 +31,62 @@ class CollectionLink extends React.Component<Props> {
   render() {
     const {
       collection,
-      documents,
       activeDocument,
       prefetchDocument,
       canUpdate,
       ui,
     } = this.props;
+
     const expanded = collection.id === ui.activeCollectionId;
 
     return (
-      <DropToImport
-        key={collection.id}
-        collectionId={collection.id}
-        activeClassName="activeDropZone"
-      >
-        <SidebarLink
+      <>
+        <DropToImport
           key={collection.id}
-          to={collection.url}
-          icon={<CollectionIcon collection={collection} expanded={expanded} />}
-          iconColor={collection.color}
-          expanded={expanded}
-          hideDisclosure
-          menuOpen={this.menuOpen}
-          label={
-            <EditableTitle
-              title={collection.name}
-              onSubmit={this.handleTitleChange}
-              canUpdate={canUpdate}
-            />
-          }
-          exact={false}
-          menu={
-            <CollectionMenu
-              position="right"
-              collection={collection}
-              onOpen={() => (this.menuOpen = true)}
-              onClose={() => (this.menuOpen = false)}
-            />
-          }
+          collectionId={collection.id}
+          activeClassName="activeDropZone"
         >
-          <Flex column>
-            {collection.documents.map((node) => (
-              <DocumentLink
-                key={node.id}
-                node={node}
-                documents={documents}
-                collection={collection}
-                activeDocument={activeDocument}
-                prefetchDocument={prefetchDocument}
+          <SidebarLink
+            key={collection.id}
+            to={collection.url}
+            icon={
+              <CollectionIcon collection={collection} expanded={expanded} />
+            }
+            iconColor={collection.color}
+            expanded={expanded}
+            menuOpen={this.menuOpen}
+            label={
+              <EditableTitle
+                title={collection.name}
+                onSubmit={this.handleTitleChange}
                 canUpdate={canUpdate}
-                depth={1.5}
               />
-            ))}
-          </Flex>
-        </SidebarLink>
-      </DropToImport>
+            }
+            exact={false}
+            menu={
+              <CollectionMenu
+                position="right"
+                collection={collection}
+                onOpen={() => (this.menuOpen = true)}
+                onClose={() => (this.menuOpen = false)}
+              />
+            }
+          ></SidebarLink>
+        </DropToImport>
+
+        {expanded &&
+          collection.documents.map((node) => (
+            <DocumentLink
+              key={node.id}
+              node={node}
+              collection={collection}
+              activeDocument={activeDocument}
+              prefetchDocument={prefetchDocument}
+              canUpdate={canUpdate}
+              depth={1.5}
+            />
+          ))}
+      </>
     );
   }
 }