clean up api and services so we can better mirror api and server side data fetching

Author: stevenkaspar

gulpfile.js

@@ -17,7 +17,7 @@ const paths = {
 		'routes/**/*',
 		'keystone.js',
 		'package.json',
-    '!routes/redux-render/**/*.js'
+    '!routes/redux-render/**/*.jsx'
 	],
 	/**
 	 * gulp-sass configuration
@@ -41,8 +41,7 @@ const paths = {
 	'webpack-server': {
 		config: 'webpack-server.config.js',
 		watch_files: [
-			'public/js/src/**/*',
-			'routes/redux-render/index.jsx',
+			'routes/redux-render/**/*.jsx',
 			'webpack-server.config.js'
 		]
 	},

public/js/dist/home.js

@@ -2,59 +2,24 @@
 import React from 'react'
 import ReactDOM from 'react-dom'
 
-import { createStore, applyMiddleware, compose } from 'redux'
-import { Provider } from 'react-redux'
-import { BrowserRouter as Router, Route, Switch, Link } from 'react-router-dom'
-import reducer from '../reducers'
-import thunk from 'redux-thunk'
-import { createLogger } from 'redux-logger'
-
-import dataServices from '../actions'
+import { Route } from 'react-router-dom'
 
 import NavigationBar from './NavigationBar'
 import Home from './Home'
 import Admin from './Admin'
 
-import style from '../../../styles/src/site.scss'
-
-// Grab the state from a global variable injected into the server-generated HTML
-const preloaded_state = window.__PRELOADED_STATE__
-
-// Allow the passed state to be garbage-collected
-delete window.__PRELOADED_STATE__
-
 export default class App extends React.Component {
   constructor(){
     super()
-
-
-    const middleware = [ thunk, ...dataServices ]
-    // if (process.env.NODE_ENV !== 'production') {
-      // middleware.push(createLogger())
-    // }
-
-    this.store = createStore(
-      reducer,
-      preloaded_state,
-      applyMiddleware(...middleware)
-    )
-
-    this.store.dispatch({type: 'REQUEST_DOCUMENTS'})
-    this.store.dispatch({type: 'REQUEST_USER'})
-    this.store.dispatch({type: 'REQUEST_USERS'})
   }
 
   render(){
     return (
-      <Provider store={this.store}>
-        <Router>
-          <div>
-            <NavigationBar store={this.store}/>
-            <Route exact={true} path="/app" component={Home} />
-            <Route path="/app/admin" component={Admin} />
-          </div>
-        </Router>
-      </Provider>
+      <div>
+        <NavigationBar store={this.props.store}/>
+        <Route exact={true} path="/app" component={Home} />
+        <Route path="/app/admin" component={Admin} />
+      </div>
     )
   }
 }

public/js/dist/reset-password.js

@@ -3,16 +3,51 @@ import React from 'react'
 import { hydrate } from 'react-dom'
 import { AppContainer } from 'react-hot-loader'
 
+import { createStore, applyMiddleware, compose } from 'redux'
+import { Provider } from 'react-redux'
+import reducer from './reducers'
+import thunk from 'redux-thunk'
+import { createLogger } from 'redux-logger'
+import { BrowserRouter as Router, Route } from 'react-router-dom'
+
+import dataServices from './actions'
+
 import App from './containers/App'
 
-const home_elem = document.getElementById('Home')
+import style from '../../styles/src/site.scss'
+
+// Grab the state from a global variable injected into the server-generated HTML
+const preloaded_state = window.__PRELOADED_STATE__
+
+// Allow the passed state to be garbage-collected
+delete window.__PRELOADED_STATE__
+
+const middleware = [ thunk, ...dataServices ]
+// if (process.env.NODE_ENV !== 'production') {
+  // middleware.push(createLogger())
+// }
+
+const store = createStore(
+  reducer,
+  preloaded_state,
+  applyMiddleware(...middleware)
+)
+
+// This is how you would trigger Ajax calls to fetch redux data
+// store.dispatch({type: 'REQUEST_DOCUMENTS'})
+// store.dispatch({type: 'REQUEST_USER'})
+// store.dispatch({type: 'REQUEST_USERS'})
 
 const render = Component => {
   const NextApp = require('./containers/App').default
   hydrate(
     <AppContainer>
-      <NextApp />
-    </AppContainer>, home_elem
+      <Provider store={store}>
+        <Router>
+          <NextApp store={store}/>
+        </Router>
+      </Provider>
+    </AppContainer>, document.getElementById('Home')
   )
 }
 

public/js/dist/signin.js

@@ -6,45 +6,34 @@ const s3 = new S3({
   region: process.env.S3_REGION
 })
 
-let getLoggedInUsers = (req, res, next) => {
-  keystone.list('Document').model.find({
-    users: req.user.id
-  }).populate('investment').exec((err, documents) => {
-    if(err){
-      return res.status(500).jsonp({
-        error: err.message,
-        success: false,
-        data: {}
-      })
-    }
-    res.jsonp({
-      error:  '',
-      success: true,
-      data: {
-        documents
-      }
-    })
-  })
+const {documents} = require('../services/documents')
+
+const { authErrResponse, errResponse, successResponse } = require('./helpers')
+
+let getLoggedInUsers = async (req, res, next) => {
+  if(!req.user) return authErrResponse({res})
+
+  try {
+    let documents = await documents.getLoggedInUsers(req, res, next)
+    successResponse({res, data: { documents }})
+  }
+  catch(err){
+    errResponse({err, res})
+  }
 }
 
 let getDocumentsFileContents = (req, res, next) => {
+  if(!req.user) return authErrResponse({res})
+
   keystone.list('Document').model.find({
     users: req.user.id,
     _id:   req.params.document_id
   }).exec((err, documents) => {
     if(err){
-      return res.status(500).jsonp({
-        error: err.message,
-        success: false,
-        data: {}
-      })
+      return errResponse({err, res})
     }
     else if(documents.length === 0){
-      return res.status(500).jsonp({
-        error: 'File not found',
-        success: false,
-        data: {}
-      })
+      return errResponse({err: new Error('File not found'), res})
     }
     const document = documents[0]
     const params = {

public/js/src/containers/App.js

@@ -0,0 +1,30 @@
+let authErrResponse = ({res, status = 404, data = {}}) => (
+  res.status(status).jsonp({
+    error:   'You must be signed in to do that',
+    success: false,
+    data
+  })
+)
+
+let errResponse = ({err, res, status = 500, data = {}}) => {
+
+  console.log(err)
+
+  return res.status(status).jsonp({
+    error:   err.message,
+    success: false,
+    data
+  })
+}
+
+let successResponse = ({res, data, status = 200}) => (
+  res.status(status).jsonp({
+    error:   '',
+    success: true,
+    data
+  })
+)
+
+module.exports.authErrResponse = authErrResponse
+module.exports.errResponse     = errResponse
+module.exports.successResponse = successResponse