Migrated document preview into its own component

src/components/AtlasPreview/AtlasPreview.js

@@ -1,7 +1,8 @@
 import React from 'react';
-import moment from 'moment';
 import Link from 'react-router/lib/Link';
 
+import DocumentPreview from 'components/DocumentPreview';
+
 import styles from './AtlasPreview.scss';
 import classNames from 'classnames/bind';
 const cx = classNames.bind(styles);
@@ -20,10 +21,7 @@ class AtlasPreview extends React.Component {
         { data.recentDocuments.length > 0 ?
           data.recentDocuments.map(document => {
             return (
-              <Link to={ `/documents/${document.id}` } className={ styles.documentPreview }>
-                <h3>{ document.title }</h3>
-                <span>{ moment(document.updatedAt).fromNow() }</span>
-              </Link>)
+              <DocumentPreview document={ document } />)
           })
         : (
           <div className={ styles.description }>No documents. Why not <Link to={ `/atlas/${data.id}/new` }>create one</Link>?</div>

src/components/AtlasPreview/AtlasPreview.scss

@@ -17,25 +17,3 @@
 .description {
   color: #aaa;
 }
-
-.documentPreview {
-  display: flex;
-  flex: 1;
-  justify-content: space-between;
-
-  margin-bottom: 20px;
-  text-decoration: none;
-
-  h3 {
-    font-weight: normal;
-    font-size: 15px;
-    color: $textColor;
-
-    margin: 0;
-  }
-
-  span {
-    font-size: 13px;
-    color: #ccc;
-  }
-}