small refactor, lint and fixes

frontend/components/Input/Input.js

@@ -55,7 +55,7 @@ const LabelText = styled.div`
 
 export type Props = {
   type: string,
-  value: string,
+  value?: string,
   label?: string,
   className?: string,
 };

frontend/components/Layout/components/SidebarCollection/SidebarCollection.js

@@ -43,7 +43,7 @@ const activeStyle = {
           {!canDropToImport &&
             <SidebarLink to={doc.url}>{doc.title}</SidebarLink>}
 
-          {(document.pathToDocument.includes(doc.id) ||
+          {(document.pathToDocument.map(entry => entry.id).includes(doc.id) ||
             document.id === doc.id) &&
             <Children column>
               {doc.children && this.renderDocuments(doc.children, depth + 1)}

frontend/models/Document.js

@@ -186,6 +186,7 @@ class Document extends BaseModel {
         id: this.id,
         parentDocument: parentDocumentId,
       });
+      invariant(res && res.data, 'Data not available');
       this.updateData(res.data);
       this.emit('documents.move', {
         id: this.id,

frontend/scenes/Document/Document.js

@@ -8,7 +8,12 @@ import { withRouter, Prompt } from 'react-router';
 import keydown from 'react-keydown';
 import Flex from 'components/Flex';
 import { color, layout } from 'styles/constants';
-import { collectionUrl, updateDocumentUrl } from 'utils/routeHelpers';
+import {
+  collectionUrl,
+  updateDocumentUrl,
+  matchDocumentEdit,
+  matchDocumentMove,
+} from 'utils/routeHelpers';
 
 import Document from 'models/Document';
 import DocumentMove from './components/DocumentMove';
@@ -25,8 +30,6 @@ import CenteredContent from 'components/CenteredContent';
 import PageTitle from 'components/PageTitle';
 import Search from 'scenes/Search';
 
-import { matchDocumentEdit, matchDocumentMove } from 'utils/routeHelpers';
-
 const DISCARD_CHANGES = `
 You have unsaved changes.
 Are you sure you want to discard them?
@@ -80,7 +83,7 @@ type Props = {
   @keydown('m')
   goToMove(event) {
     event.preventDefault();
-    this.props.history.push(`${this.document.url}/move`);
+    if (this.document) this.props.history.push(`${this.document.url}/move`);
   }
 
   loadDocument = async props => {

frontend/scenes/Document/components/DocumentMove/DocumentMove.js

@@ -1,13 +1,11 @@
 // @flow
 import React, { Component } from 'react';
 import ReactDOM from 'react-dom';
-import { observable, runInAction, action } from 'mobx';
+import { observable, action } from 'mobx';
 import { observer, inject } from 'mobx-react';
 import { withRouter } from 'react-router';
 import ArrowKeyNavigation from 'boundless-arrow-key-navigation';
 import _ from 'lodash';
-import invariant from 'invariant';
-import { client } from 'utils/ApiClient';
 import styled from 'styled-components';
 import { size } from 'styles/constants';
 
@@ -81,18 +79,7 @@ type Props = {
 
     if (this.searchTerm) {
       try {
-        const res = await client.get('/documents.search', {
+        this.resultIds = await this.props.documents.search(this.searchTerm);
-          query: this.searchTerm,
-        });
-        invariant(res && res.data, 'res or res.data missing');
-        const { data } = res;
-        runInAction('search document', () => {
-          // Fill documents store
-          data.forEach(documentData =>
-            this.props.documents.add(new Document(documentData))
-          );
-          this.resultIds = data.map(documentData => documentData.id);
-        });
       } catch (e) {
         console.error('Something went wrong');
       }

frontend/scenes/Document/components/DocumentMove/components/PathToDocument.js

@@ -12,6 +12,30 @@ import ChevronIcon from 'components/Icon/ChevronIcon';
 import Document from 'models/Document';
 import DocumentsStore from 'stores/DocumentsStore';
 
+const ResultWrapper = styled.div`
+display: flex;
+margin-bottom: 10px;
+
+color: ${color.text};
+cursor: default;
+`;
+
+const ResultWrapperLink = ResultWrapper.withComponent('a').extend`
+padding-top: 3px;
+padding-left: 5px;
+
+&:hover,
+&:active,
+&:focus {
+  margin-left: 0px;
+  border-radius: 2px;
+  background: ${color.black};
+  color: ${color.smokeLight};
+  outline: none;
+  cursor: pointer;
+}
+`;
+
 type Props = {
   documentId?: string,
   onSuccess?: Function,
@@ -58,7 +82,7 @@ type Props = {
             <ChevronIcon />
             {' '}
             {this.resultDocument.pathToDocument
-              .map(doc => <span>{doc.title}</span>)
+              .map(doc => <span key={doc.id}>{doc.title}</span>)
               .reduce((prev, curr) => [prev, <ChevronIcon />, curr])}
           </Flex>}
         {document &&
@@ -72,28 +96,4 @@ type Props = {
   }
 }
 
-const ResultWrapper = styled.div`
-  display: flex;
-  margin-bottom: 10px;
-
-  color: ${color.text};
-  cursor: default;
-`;
-
-const ResultWrapperLink = ResultWrapper.withComponent('a').extend`
-  padding-top: 3px;
-  padding-left: 5px;
-
-  &:hover,
-  &:active,
-  &:focus {
-    margin-left: 0px;
-    border-radius: 2px;
-    background: ${color.black};
-    color: ${color.smokeLight};
-    outline: none;
-    cursor: pointer;
-  }
-`;
-
 export default PathToDocument;

frontend/scenes/Search/Search.js

@@ -2,12 +2,9 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import keydown from 'react-keydown';
-import { observable, action, runInAction } from 'mobx';
+import { observable, action } from 'mobx';
 import { observer, inject } from 'mobx-react';
 import _ from 'lodash';
-import invariant from 'invariant';
-import { client } from 'utils/ApiClient';
-import Document from 'models/Document';
 import DocumentsStore from 'stores/DocumentsStore';
 
 import { withRouter } from 'react-router';
@@ -59,7 +56,6 @@ const StyledArrowKeyNavigation = styled(ArrowKeyNavigation)`
 @observer class Search extends React.Component {
   firstDocument: HTMLElement;
   props: Props;
-  store: SearchStore;
 
   @observable resultIds: Array<string> = []; // Document IDs
   @observable searchTerm: ?string = null;
@@ -108,16 +104,7 @@ const StyledArrowKeyNavigation = styled(ArrowKeyNavigation)`
 
     if (query) {
       try {
-        const res = await client.get('/documents.search', { query });
+        this.resultIds = await this.props.documents.search(query);
-        invariant(res && res.data, 'res or res.data missing');
-        const { data } = res;
-        runInAction('search document', () => {
-          // Fill documents store
-          data.forEach(documentData =>
-            this.props.documents.add(new Document(documentData))
-          );
-          this.resultIds = data.map(documentData => documentData.id);
-        });
       } catch (e) {
         console.error('Something went wrong');
       }

frontend/stores/DocumentsStore.js

@@ -104,6 +104,14 @@ class DocumentsStore extends BaseStore {
     await this.fetchAll('starred');
   };
 
+  @action search = async (query: string): Promise<*> => {
+    const res = await client.get('/documents.search', { query });
+    invariant(res && res.data, 'res or res.data missing');
+    const { data } = res;
+    data.forEach(documentData => this.add(new Document(documentData)));
+    return data.map(documentData => documentData.id);
+  };
+
   @action fetch = async (id: string): Promise<*> => {
     this.isFetching = true;