diff --git a/frontend/components/Layout/components/SidebarCollections.js b/frontend/components/Layout/components/SidebarCollections.js index a1cf5aa2d..3d71e41ad 100644 --- a/frontend/components/Layout/components/SidebarCollections.js +++ b/frontend/components/Layout/components/SidebarCollections.js @@ -14,6 +14,7 @@ import CollectionMenu from 'menus/CollectionMenu'; import CollectionsStore from 'stores/CollectionsStore'; import UiStore from 'stores/UiStore'; import Document from 'models/Document'; +import DocumentsStore from 'stores/DocumentsStore'; import { type NavigationNode } from 'types'; type Props = { @@ -123,6 +124,7 @@ type Props = { } type DocumentLinkProps = { + documents: DocumentsStore, document: NavigationNode, history: Object, activeDocument: ?Document, @@ -130,58 +132,69 @@ type DocumentLinkProps = { depth: number, }; -const DocumentLink = observer( - ({ - document, - activeDocument, - activeDocumentRef, - depth, - }: DocumentLinkProps) => { - const isActiveDocument = - activeDocument && activeDocument.id === document.id; - const showChildren = - activeDocument && - (activeDocument.pathToDocument - .map(entry => entry.id) - .includes(document.id) || - isActiveDocument); +const DocumentLink = inject('documents')( + observer( + ({ + documents, + document, + activeDocument, + activeDocumentRef, + depth, + }: DocumentLinkProps) => { + const isActiveDocument = + activeDocument && activeDocument.id === document.id; + const showChildren = + activeDocument && + (activeDocument.pathToDocument + .map(entry => entry.id) + .includes(document.id) || + isActiveDocument); - return ( - - { + event.stopPropagation(); + event.preventDefault(); + documents.prefetchDocument(document.id); + }; + + return ( + - 0} - expanded={showChildren} + - {document.title} - - + 0} + expanded={showChildren} + > + {document.title} + + - {showChildren && - - {document.children && - document.children.map(childDocument => ( - - ))} - } - - ); - } + {showChildren && + + {document.children && + document.children.map(childDocument => ( + + ))} + } + + ); + } + ) ); const CollectionAction = styled.a` diff --git a/frontend/stores/DocumentsStore.js b/frontend/stores/DocumentsStore.js index 9ddf8925f..9d30926a9 100644 --- a/frontend/stores/DocumentsStore.js +++ b/frontend/stores/DocumentsStore.js @@ -111,8 +111,12 @@ class DocumentsStore extends BaseStore { return data.map(documentData => documentData.id); }; - @action fetch = async (id: string): Promise<*> => { - this.isFetching = true; + @action prefetchDocument = async (id: string) => { + if (!this.getById(id)) this.fetch(id, true); + }; + + @action fetch = async (id: string, prefetch: boolean): Promise<*> => { + if (!prefetch) this.isFetching = true; try { const res = await client.post('/documents.info', { id });