add /:username/sketches links to username sketches

client/modules/IDE/actions/projects.js

@@ -4,9 +4,15 @@ import axios from 'axios';
 
 const ROOT_URL = location.href.indexOf('localhost') > 0 ? 'http://localhost:8000/api' : '/api';
 
-export function getProjects() {
+export function getProjects(username) {
   return (dispatch) => {
-    axios.get(`${ROOT_URL}/projects`, { withCredentials: true })
+    let url;
+    if (username) {
+      url = `${ROOT_URL}/${username}/projects`;
+    } else {
+      url = `${ROOT_URL}/projects`;
+    }
+    axios.get(url, { withCredentials: true })
       .then(response => {
         dispatch({
           type: ActionTypes.SET_PROJECTS,

client/modules/IDE/components/SketchList.js

@@ -10,7 +10,7 @@ const exitUrl = require('../../../images/exit.svg');
 
 class SketchList extends React.Component {
   componentDidMount() {
-    this.props.getProjects();
+    this.props.getProjects(this.props.username);
   }
 
   render() {
@@ -51,7 +51,8 @@ SketchList.propTypes = {
   user: PropTypes.object.isRequired,
   getProjects: PropTypes.func.isRequired,
   sketches: PropTypes.array.isRequired,
-  closeSketchList: PropTypes.func.isRequired
+  closeSketchList: PropTypes.func.isRequired,
+  username: PropTypes.string
 };
 
 function mapStateToProps(state) {

client/modules/IDE/pages/IDEView.js

@@ -235,10 +235,10 @@ class IDEView extends React.Component {
           return '';
         })()}
         {(() => { // eslint-disable-line
-          if (this.props.location.pathname === '/sketches') {
+          if (this.props.location.pathname.match(/sketches$/)) {
             return (
               <Overlay>
-                <SketchList />
+                <SketchList username={this.props.params.username} />
               </Overlay>
             );
           }
@@ -251,7 +251,8 @@ class IDEView extends React.Component {
 
 IDEView.propTypes = {
   params: PropTypes.shape({
-    project_id: PropTypes.string
+    project_id: PropTypes.string,
+    username: PropTypes.string
   }),
   location: PropTypes.shape({
     pathname: PropTypes.string

client/routes.js

@@ -19,6 +19,7 @@ const routes = (store) =>
     <Route path="/signup" component={SignupView} />
     <Route path="/projects/:project_id" component={IDEView} />
     <Route path="/sketches" component={IDEView} />
+    <Route path="/:username/sketches" component={IDEView} />
   </Route>
   );
 

client/styles/components/_sketch-list.scss

@@ -13,7 +13,7 @@
   width: 100%;
   padding: #{10 / $base-font-size}rem 0;
   padding-left: #{20 / $base-font-size}rem;
-  height: 100%;
+  max-height: 100%;
 }
 
 .sketches-table__row {

server/controllers/project.controller.js

@@ -1,4 +1,5 @@
 import Project from '../models/project';
+import User from '../models/user';
 
 export function createProject(req, res) {
   let projectValues = {
@@ -56,3 +57,19 @@ export function getProjects(req, res) {
   }
 
 }
+
+export function getProjectsForUser(req, res) {
+  if (req.params.username) {
+    User.findOne({ username: req.params.username }, (err, user) => {
+      Project.find({user: user._id}) // eslint-disable-line no-underscore-dangle
+        .sort('-createdAt')
+        .select('name files id createdAt updatedAt')
+        .exec((err, projects) => {
+          res.json(projects);
+        });
+    });
+  } else {
+    // could just move this to client side
+    return res.json([]);
+  }
+}

server/routes/project.routes.js

@@ -11,4 +11,6 @@ router.route('/projects/:project_id').get(ProjectController.getProject);
 
 router.route('/projects').get(ProjectController.getProjects);
 
+router.route('/:username/projects').get(ProjectController.getProjectsForUser);
+
 export default router;

server/routes/server.routes.js

@@ -25,4 +25,8 @@ router.route('/sketches').get((req, res) => {
   res.sendFile(path.resolve(`${__dirname}/../../index.html`));
 });
 
+router.route('/:username/sketches').get((req, res) => {
+  res.sendFile(path.resolve(`${__dirname}/../../index.html`));
+});
+
 export default router;