Add recently viewed docs to dashboard

frontend/components/DocumentList/DocumentList.js

@@ -2,7 +2,6 @@
 import React from 'react';
 import type { Document } from 'types';
 import DocumentPreview from 'components/DocumentPreview';
-import Divider from 'components/Divider';
 
 class DocumentList extends React.Component {
   props: {
@@ -14,10 +13,7 @@ class DocumentList extends React.Component {
       <div>
         {this.props.documents &&
           this.props.documents.map(document => (
-            <div>
-              <DocumentPreview document={document} />
-              <Divider />
-            </div>
+            <DocumentPreview document={document} />
           ))}
       </div>
     );

frontend/components/DocumentPreview/DocumentPreview.js

@@ -1,21 +1,20 @@
 // @flow
 import React, { Component } from 'react';
-import { toJS } from 'mobx';
 import { Link } from 'react-router-dom';
 import type { Document } from 'types';
 import styled from 'styled-components';
 import { color } from 'styles/constants';
-import Markdown from 'components/Markdown';
 import PublishingInfo from 'components/PublishingInfo';
 
 type Props = {
   document: Document,
+  highlight?: string,
   innerRef?: Function,
 };
 
 const DocumentLink = styled(Link)`
   display: block;
-  margin: 16px -16px;
+  margin: 0 -16px;
   padding: 16px;
   border-radius: 8px;
   border: 2px solid transparent;
@@ -35,16 +34,11 @@ const DocumentLink = styled(Link)`
     border: 2px solid ${color.slateDark};
   }
 
-  h1 {
+  h3 {
     margin-top: 0;
   }
 `;
 
-// $FlowIssue
-const TruncatedMarkdown = styled(Markdown)`
-  pointer-events: none;
-`;
-
 class DocumentPreview extends Component {
   props: Props;
 
@@ -53,14 +47,13 @@ class DocumentPreview extends Component {
 
     return (
       <DocumentLink to={document.url} innerRef={innerRef} {...rest}>
+        <h3>{document.title}</h3>
         <PublishingInfo
           createdAt={document.createdAt}
           createdBy={document.createdBy}
           updatedAt={document.updatedAt}
           updatedBy={document.updatedBy}
-          collaborators={toJS(document.collaborators)}
         />
-        <TruncatedMarkdown text={document.text} limit={150} />
       </DocumentLink>
     );
   }

frontend/components/Layout/Layout.js

@@ -106,7 +106,7 @@ type Props = {
                   <SidebarLink to="/search">Search</SidebarLink>
                 </LinkSection>
                 <LinkSection>
-                  <SidebarLink to="/dashboard">Dashboard</SidebarLink>
+                  <SidebarLink to="/dashboard">Home</SidebarLink>
                   <SidebarLink to="/starred">Starred</SidebarLink>
                 </LinkSection>
                 <LinkSection>

frontend/components/PublishingInfo/PublishingInfo.js

@@ -7,7 +7,7 @@ import { Flex } from 'reflexbox';
 
 const Container = styled(Flex)`
   justify-content: space-between;
-  color: #ccc;
+  color: #bbb;
   font-size: 13px;
 `;
 
@@ -26,7 +26,7 @@ const Avatar = styled.img`
 
 class PublishingInfo extends Component {
   props: {
-    collaborators: Array<User>,
+    collaborators?: Array<User>,
     createdAt: string,
     createdBy: User,
     updatedAt: string,
@@ -35,13 +35,16 @@ class PublishingInfo extends Component {
   };
 
   render() {
+    const { collaborators } = this.props;
+
     return (
       <Container align="center">
-        <Avatars>
-          {this.props.collaborators.map(user => (
-            <Avatar key={user.id} src={user.avatarUrl} title={user.name} />
-          ))}
-        </Avatars>
+        {collaborators &&
+          <Avatars>
+            {collaborators.map(user => (
+              <Avatar key={user.id} src={user.avatarUrl} title={user.name} />
+            ))}
+          </Avatars>}
         <span>
           {this.props.createdBy.name}
           {' '}