big refactor of frontend to be awesome

api/.gitignore

@@ -0,0 +1,12 @@
+.DS_Store
+node_modules
+coverage
+build
+.DS_Store
+.env
+*.log
+npm-debug.log*
+.mongo-db
+.e2e
+cypress/videos
+dist

client/.gitignore

@@ -0,0 +1,12 @@
+.DS_Store
+node_modules
+coverage
+build
+.DS_Store
+.env
+*.log
+npm-debug.log*
+.mongo-db
+.e2e
+cypress/videos
+dist

client/package-scripts.js

@@ -1,7 +1,7 @@
-const {series, rimraf, commonTags} = require('nps-utils')
+const {series, rimraf, commonTags, crossEnv} = require('nps-utils')
 module.exports = {
   scripts: {
-    dev: 'react-scripts start',
+    dev: crossEnv('PORT=8080 react-scripts start'),
     build: 'react-scripts build',
     default: 'pushstate-server build',
     test: {

client/package.json

@@ -10,7 +10,7 @@
     "nps": "^5.0.4",
     "nps-utils": "^1.2.0",
     "pushstate-server": "^2.2.1",
-    "react-scripts": "^0.9.0"
+    "react-scripts": "^0.9.4"
   },
   "license": "MIT",
   "repository": "[email protected]:kentcdodds/testing-workshop.git",

client/src/index.js

@@ -1,22 +1,32 @@
 import ReactDOM from 'react-dom'
 import {Provider} from 'react-redux'
 import React from 'react'
-import {Router, Route, IndexRoute, browserHistory} from 'react-router'
-import store from './store'
+import {
+  Router,
+  Route,
+  IndexRoute,
+  browserHistory,
+  hashHistory,
+} from 'react-router'
 
-import App from './components/App'
-import Article from './components/Article'
-import Editor from './components/Editor'
-import Home from './components/Home'
-import Login from './components/Login'
-import ConnectedProfile from './components/Profile'
-import ProfileFavorites from './components/ProfileFavorites'
-import Register from './components/Register'
-import Settings from './components/Settings'
+import store from './store'
+import App from './screens/app'
+import Article from './screens/article'
+import Editor from './screens/editor'
+import Home from './screens/home'
+import Login from './screens/login'
+import ConnectedProfile from './screens/profile'
+import ProfileFavorites from './screens/profile-favorites'
+import Register from './screens/register'
+import Settings from './screens/settings'
 
 ReactDOM.render(
   <Provider store={store}>
-    <Router history={browserHistory}>
+    <Router
+      history={
+        process.env.NODE_ENV === 'production' ? browserHistory : hashHistory
+      }
+    >
       <Route path="/" component={App}>
         <IndexRoute component={Home} />
         <Route path="login" component={Login} />

client/src/middleware.js

@@ -1,4 +1,4 @@
-import agent from './agent'
+import agent from './shared/agent'
 
 const promiseMiddleware = store => next => action => {
   if (isPromise(action.payload)) {

client/src/reducer.js

@@ -1,12 +1,12 @@
 import {combineReducers} from 'redux'
 import article from './reducers/article'
-import articleList from './reducers/articleList'
+import articleList from './reducers/article-list'
 import auth from './reducers/auth'
 import common from './reducers/common'
 import editor from './reducers/editor'
 import home from './reducers/home'
 import profile from './reducers/profile'
-import profileFavorites from './reducers/profileFavorites'
+import profileFavorites from './reducers/profile-favorites'
 import settings from './reducers/settings'
 
 export default combineReducers({

client/src/components/App.js → client/src/screens/app.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import {connect} from 'react-redux'
-import agent from '../agent'
-import Header from './Header'
+import agent from '../shared/agent'
+import Header from '../shared/components/header'
 
 const mapStateToProps = state => ({
   appLoaded: state.common.appLoaded,

client/src/components/Article/ArticleActions.js → client/src/screens/article/article-actions.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import {Link} from 'react-router'
 import {connect} from 'react-redux'
-import agent from '../../agent'
+import agent from '../../shared/agent'
 
 const mapDispatchToProps = dispatch => ({
   onClickDelete: payload => dispatch({type: 'DELETE_ARTICLE', payload}),

client/src/components/Article/ArticleMeta.js → client/src/screens/article/article-meta.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import {Link} from 'react-router'
-import ArticleActions from './ArticleActions'
+import ArticleActions from './article-actions'
 
 const ArticleMeta = props => {
   const article = props.article

client/src/components/Article/CommentContainer.js → client/src/screens/article/comment-container.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import {Link} from 'react-router'
-import CommentInput from './CommentInput'
-import CommentList from './CommentList'
+import CommentInput from './comment-input'
+import CommentList from './comment-list'
 
 const CommentContainer = props => {
   if (props.currentUser) {

client/src/components/Article/CommentInput.js → client/src/screens/article/comment-input.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import {connect} from 'react-redux'
-import agent from '../../agent'
+import agent from '../../shared/agent'
 
 const mapDispatchToProps = dispatch => ({
   onSubmit: payload => dispatch({type: 'ADD_COMMENT', payload}),

client/src/components/Article/CommentList.js → client/src/screens/article/comment-list.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import Comment from './Comment'
+import Comment from './comment'
 
 const CommentList = props => {
   return (

client/src/components/Article/Comment.js → client/src/screens/article/comment.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import {Link} from 'react-router'
-import DeleteButton from './DeleteButton'
+import DeleteButton from './delete-button'
 
 const Comment = props => {
   const comment = props.comment