diff --git a/client/modules/Sketch/pages/SketchListView.js b/client/modules/Sketch/pages/SketchListView.js
index caea9d76..fec25baf 100644
--- a/client/modules/Sketch/pages/SketchListView.js
+++ b/client/modules/Sketch/pages/SketchListView.js
@@ -1,6 +1,8 @@
import React, { PropTypes } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
+import moment from 'moment';
+import { Link } from 'react-router';
import Nav from '../../../components/Nav';
import * as SketchActions from '../actions';
import * as ProjectActions from '../../IDE/actions/project';
@@ -18,11 +20,22 @@ class SketchListView extends React.Component {
createProject={this.props.createProject}
saveProject={this.props.saveProject}
/>
-
- {this.props.sketches.map(sketch =>
- {sketch.name}
- )}
-
+
+
+ Name
+ Created
+ Last Updated
+
+
+ {this.props.sketches.map(sketch =>
+
+ {sketch.name}
+ {moment(sketch.createdAt).format('MMM D, YYYY')}
+ {moment(sketch.updatedAt).format('MMM D, YYYY')}
+
+ )}
+
+
);
}
diff --git a/client/styles/base/_base.scss b/client/styles/base/_base.scss
index 6a66bf88..f11b8d96 100644
--- a/client/styles/base/_base.scss
+++ b/client/styles/base/_base.scss
@@ -45,4 +45,8 @@ h2 {
h3 {
font-weight: normal;
+}
+
+thead {
+ text-align: left;
}
\ No newline at end of file
diff --git a/client/styles/base/_reset.scss b/client/styles/base/_reset.scss
index c36505ce..33cf3b32 100644
--- a/client/styles/base/_reset.scss
+++ b/client/styles/base/_reset.scss
@@ -14,4 +14,8 @@ ul, p {
h2, h3 {
margin: 0;
+}
+
+ul {
+ list-style: none;
}
\ No newline at end of file
diff --git a/client/styles/components/_sketch-list.scss b/client/styles/components/_sketch-list.scss
new file mode 100644
index 00000000..9ef6a786
--- /dev/null
+++ b/client/styles/components/_sketch-list.scss
@@ -0,0 +1,9 @@
+.sketches-table {
+ width: 100%;
+ padding: #{10 / $base-font-size}rem 0;
+ padding-left: #{170 / $base-font-size}rem;
+}
+
+.sketches-table__row {
+ margin: #{10 / $base-font-size}rem;
+}
\ No newline at end of file
diff --git a/client/styles/layout/_sketch-list.scss b/client/styles/layout/_sketch-list.scss
new file mode 100644
index 00000000..979c48d4
--- /dev/null
+++ b/client/styles/layout/_sketch-list.scss
@@ -0,0 +1,6 @@
+.sketch-list {
+ display: flex;
+ flex-wrap: wrap;
+ height: 100%;
+ flex-flow: column;
+}
\ No newline at end of file
diff --git a/client/styles/main.scss b/client/styles/main.scss
index 1e23ae9d..74e48bc4 100644
--- a/client/styles/main.scss
+++ b/client/styles/main.scss
@@ -13,5 +13,7 @@
@import 'components/preferences';
@import 'components/signup';
@import 'components/login';
+@import 'components/sketch-list';
@import 'layout/ide';
+@import 'layout/sketch-list';
diff --git a/package.json b/package.json
index 168f71b7..53f5d57d 100644
--- a/package.json
+++ b/package.json
@@ -68,6 +68,7 @@
"eslint-loader": "^1.3.0",
"express": "^4.13.4",
"express-session": "^1.13.0",
+ "moment": "^2.14.1",
"mongoose": "^4.4.16",
"passport": "^0.3.2",
"passport-github": "^1.1.0",
diff --git a/server/controllers/project.controller.js b/server/controllers/project.controller.js
index 5afb8ca2..bc621ed1 100644
--- a/server/controllers/project.controller.js
+++ b/server/controllers/project.controller.js
@@ -59,7 +59,7 @@ export function getProjects(req, res) {
if (req.user) {
Project.find({user: req.user._id}) // eslint-disable-line no-underscore-dangle
.sort('-createdAt')
- .select('name file _id')
+ .select('name file _id createdAt updatedAt')
.exec((err, projects) => {
res.json(projects);
});
diff --git a/server/routes/server.routes.js b/server/routes/server.routes.js
index ccff0582..90dda69d 100644
--- a/server/routes/server.routes.js
+++ b/server/routes/server.routes.js
@@ -21,4 +21,8 @@ router.route('/login').get((req, res) => {
res.sendFile(path.resolve(`${__dirname}/../../index.html`));
});
+router.route('/sketches').get((req, res) => {
+ res.sendFile(path.resolve(`${__dirname}/../../index.html`));
+});
+
export default router;