diff --git a/.eslintrc.json b/.eslintrc.json index 5df3444a6..23bdea410 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -55,6 +55,7 @@ "no-var": [2], "no-lonely-if": [2], "curly": [2], + "no-unused-vars": ["error", { "argsIgnorePattern": "next" }], "no-multiple-empty-lines": [ "error", {"max": 1} diff --git a/app.js b/app.js index d4041c93a..29817c970 100644 --- a/app.js +++ b/app.js @@ -11,14 +11,57 @@ app.use(bodyParser.json()); app.set('views', path.join(__dirname, 'views')); app.set('view engine', 'ejs'); -// API Routes. +// Routes. app.use('/api/v1', require('./routes/api')); +app.use('/client', express.static(path.join(__dirname, 'dist'))); +app.use('/admin', require('./routes/admin')); -// Static Routes. -app.use('/client/', express.static(path.join(__dirname, 'dist'))); +//============================================================================== +// ERROR HANDLING +//============================================================================== -app.get('/admin*', (req, res) => { - res.render('admin', {basePath: '/client/coral-admin'}); +const ErrNotFound = new Error('Not Found'); +ErrNotFound.status = 404; + +// Catch 404 and forward to error handler. +app.use((req, res, next) => { + next(ErrNotFound); +}); + +// General error handler. Respond with the message and error if we have it while +// returning a status code that makes sense. +if (app.get('env') === 'development') { + app.use('/api', (err, req, res, next) => { + res.status(err.status || 500); + res.json({ + message: err.message, + error: err + }); + }); + + app.use('/', (err, req, res, next) => { + res.status(err.status || 500); + res.render('error', { + message: err.message, + error: err + }); + }); +} + +app.use('/api', (err, req, res, next) => { + res.status(err.status || 500); + res.json({ + message: err.message, + error: {} + }); +}); + +app.use('/', (err, req, res, next) => { + res.status(err.status || 500); + res.render('error', { + message: err.message, + error: {} + }); }); module.exports = app; diff --git a/client/coral-admin/src/AppRouter.js b/client/coral-admin/src/AppRouter.js new file mode 100644 index 000000000..40465bd19 --- /dev/null +++ b/client/coral-admin/src/AppRouter.js @@ -0,0 +1,23 @@ +import React from 'react' +import { Router, Route, Redirect, IndexRoute, browserHistory } from 'react-router' + +import ModerationQueue from 'containers/ModerationQueue' +import CommentStream from 'containers/CommentStream' +import EmbedLink from 'components/EmbedLink' +import Configure from 'containers/Configure' +import CommunityContainer from 'containers/CommunityContainer' +import LayoutContainer from 'containers/LayoutContainer' + +const routes = ( + + + + + + + +) + +const AppRouter = () => + +export default AppRouter diff --git a/client/coral-admin/src/components/App.js b/client/coral-admin/src/components/App.js index 81eea850f..1fbbe1448 100644 --- a/client/coral-admin/src/components/App.js +++ b/client/coral-admin/src/components/App.js @@ -1,24 +1,16 @@ - import React from 'react' import { Provider } from 'react-redux' import 'material-design-lite' -import { Router, Route, browserHistory } from 'react-router' -import ModerationQueue from 'containers/ModerationQueue' +import { Layout } from 'react-mdl' import store from 'services/store' -import CommentStream from 'containers/CommentStream' -import EmbedLink from 'components/EmbedLink' -import Configure from 'containers/Configure' + +import AppRouter from '../AppRouter' export default class App extends React.Component { render (props) { return ( - - - - - - + ) } diff --git a/client/coral-admin/src/components/Header.js b/client/coral-admin/src/components/Header.js deleted file mode 100644 index ea268108e..000000000 --- a/client/coral-admin/src/components/Header.js +++ /dev/null @@ -1,24 +0,0 @@ -import React from 'react' -import { Layout, Navigation, Drawer, Header } from 'react-mdl' -import { Link } from 'react-router' -import styles from './Header.css' -import config from 'services/config' - -// App header. If we add a navbar it should be here -export default (props) => ( - -
- - Moderate - Configure - -
- - - Moderate - Configure - - - {props.children} -
-) diff --git a/client/coral-admin/src/components/Page.js b/client/coral-admin/src/components/Page.js deleted file mode 100644 index 733cec677..000000000 --- a/client/coral-admin/src/components/Page.js +++ /dev/null @@ -1,12 +0,0 @@ -import React from 'react' -import {Layout} from 'react-mdl' -import 'material-design-lite' -import Header from 'components/Header' - -export default (props) => ( - -
- {props.children} -
-
-) diff --git a/client/coral-admin/src/components/ui/Drawer.js b/client/coral-admin/src/components/ui/Drawer.js new file mode 100644 index 000000000..b1c87baaf --- /dev/null +++ b/client/coral-admin/src/components/ui/Drawer.js @@ -0,0 +1,14 @@ +import React from 'react' +import { Navigation, Drawer } from 'react-mdl' +import { Link } from 'react-router' +import styles from './Header.css' + +export default () => ( + + + Moderate + Community + Configure + + +) diff --git a/client/coral-admin/src/components/Header.css b/client/coral-admin/src/components/ui/Header.css similarity index 100% rename from client/coral-admin/src/components/Header.css rename to client/coral-admin/src/components/ui/Header.css diff --git a/client/coral-admin/src/components/ui/Header.js b/client/coral-admin/src/components/ui/Header.js new file mode 100644 index 000000000..1455721d8 --- /dev/null +++ b/client/coral-admin/src/components/ui/Header.js @@ -0,0 +1,14 @@ +import React from 'react' +import { Navigation, Header } from 'react-mdl' +import { Link } from 'react-router' +import styles from './Header.css' + +export default () => ( +
+ + Moderate + Community + Configure + +
+) diff --git a/client/coral-admin/src/components/ui/Layout.js b/client/coral-admin/src/components/ui/Layout.js new file mode 100644 index 000000000..fd963b667 --- /dev/null +++ b/client/coral-admin/src/components/ui/Layout.js @@ -0,0 +1,12 @@ +import React from 'react' +import { Layout as LayoutMDL} from 'react-mdl' +import Header from './Header' +import Drawer from './Drawer' + +export const Layout = ({ children }) => ( + +
+ + {children} + +) \ No newline at end of file diff --git a/client/coral-admin/src/containers/CommentStream.js b/client/coral-admin/src/containers/CommentStream.js index 4f0a03698..33963f422 100644 --- a/client/coral-admin/src/containers/CommentStream.js +++ b/client/coral-admin/src/containers/CommentStream.js @@ -6,7 +6,6 @@ import { connect } from 'react-redux' import { createComment, flagComment } from 'actions/comments' import CommentList from 'components/CommentList' import CommentBox from 'components/CommentBox' -import Page from 'components/Page' /** * Renders a comment stream using a CommentList component @@ -44,19 +43,17 @@ class CommentStream extends React.Component { // Render the comment box along with the CommentList render ({ comments }, { snackbar, snackbarMsg }) { return ( - -
- - - {snackbarMsg} -
-
+
+ + + {snackbarMsg} +
) } } diff --git a/client/coral-admin/src/containers/CommunityContainer.js b/client/coral-admin/src/containers/CommunityContainer.js new file mode 100644 index 000000000..bd13ca04b --- /dev/null +++ b/client/coral-admin/src/containers/CommunityContainer.js @@ -0,0 +1,14 @@ +import React, { Component } from 'react' +import { connect } from 'react-redux' +import I18n from 'coral-framework/i18n/i18n' +import translations from '../translations' + +export default class CommunityContainer extends Component { + render() { + return ( +
+

Community

+
+ ) + } +} \ No newline at end of file diff --git a/client/coral-admin/src/containers/Configure.js b/client/coral-admin/src/containers/Configure.js index f90e8c747..5c86019c8 100644 --- a/client/coral-admin/src/containers/Configure.js +++ b/client/coral-admin/src/containers/Configure.js @@ -10,7 +10,6 @@ import { Button, Icon } from 'react-mdl' -import Page from 'components/Page' import styles from './Configure.css' import I18n from 'coral-framework/i18n/i18n' import translations from '../translations' @@ -78,7 +77,6 @@ class Configure extends React.Component { : 'Embed Comment Stream' return ( -
@@ -106,7 +104,6 @@ class Configure extends React.Component { }
-
) } } diff --git a/client/coral-admin/src/containers/LayoutContainer.js b/client/coral-admin/src/containers/LayoutContainer.js new file mode 100644 index 000000000..7373c30c2 --- /dev/null +++ b/client/coral-admin/src/containers/LayoutContainer.js @@ -0,0 +1,19 @@ +import React, { Component }from 'react' +import { connect } from 'react-redux' + +import { Layout } from '../components/ui/Layout' + +class LayoutContainer extends Component { + render () { + return + } +} + +LayoutContainer.propTypes = {} + +const mapStateToProps = state => ({ data: {} }) + +const mapDispatchToProps = (dispatch, ownProps) => ({ dispatch }) + +export default connect(mapStateToProps, mapDispatchToProps)(LayoutContainer) + diff --git a/client/coral-admin/src/containers/ModerationQueue.js b/client/coral-admin/src/containers/ModerationQueue.js index 061786543..d051e5639 100644 --- a/client/coral-admin/src/containers/ModerationQueue.js +++ b/client/coral-admin/src/containers/ModerationQueue.js @@ -2,7 +2,6 @@ import React from 'react' import { connect } from 'react-redux' import ModerationKeysModal from 'components/ModerationKeysModal' -import Page from 'components/Page' import CommentList from 'components/CommentList' import { updateStatus } from 'actions/comments' import styles from './ModerationQueue.css' @@ -20,8 +19,6 @@ class ModerationQueue extends React.Component { constructor (props) { super(props) - console.log('ModerationQueue', props) - this.state = { activeTab: 'pending', singleView: false, modalOpen: false } } @@ -60,10 +57,9 @@ class ModerationQueue extends React.Component { render () { const { comments } = this.props const { activeTab, singleView, modalOpen } = this.state - console.log('moderation queue', styles) return ( - +
) } } diff --git a/package.json b/package.json index 02bd7bbe7..979475b5b 100644 --- a/package.json +++ b/package.json @@ -43,7 +43,6 @@ }, "homepage": "https://github.com/coralproject/talk#readme", "dependencies": { - "autoprefixer": "^6.5.2", "body-parser": "^1.15.2", "debug": "^2.2.0", "ejs": "^2.5.2", @@ -53,21 +52,20 @@ "uuid": "^2.0.3" }, "devDependencies": { - "autoprefixer": "6.5.0", - "babel-core": "^6.14.0", - "babel-jest": "^15.0.0", - "babel-loader": "^6.2.5", - "babel-plugin-transform-async-to-generator": "^6.8.0", + "autoprefixer": "^6.5.0", + "babel-core": "^6.18.2", + "babel-loader": "^6.2.7", + "babel-plugin-transform-async-to-generator": "^6.16.0", "babel-plugin-transform-decorators-legacy": "^1.3.4", "babel-plugin-transform-object-assign": "^6.8.0", "babel-plugin-transform-react-jsx": "^6.8.0", - "babel-polyfill": "^6.13.0", - "babel-preset-es2015": "6.13.0", + "babel-polyfill": "^6.16.0", + "babel-preset-es2015": "^6.18.0", "babel-preset-es2015-minimal": "^2.1.0", "babel-preset-stage-0": "^6.16.0", "chai": "^3.5.0", "chai-http": "^3.0.0", - "copy-webpack-plugin": "^3.0.1", + "copy-webpack-plugin": "^4.0.0", "css-loader": "^0.25.0", "eslint": "^3.9.1", "exports-loader": "^0.6.3", @@ -79,8 +77,9 @@ "material-design-lite": "^1.2.1", "mocha": "^3.1.2", "mocha-junit-reporter": "^1.12.1", - "postcss-loader": "^0.13.0", - "postcss-modules": "0.5.2", + "postcss-loader": "^1.1.0", + "postcss-modules": "^0.5.2", + "postcss-smart-import": "^0.5.1", "pre-git": "^3.10.0", "precss": "^1.4.0", "pym.js": "^1.1.1", @@ -95,11 +94,7 @@ "style-loader": "^0.13.1", "supertest": "^2.0.1", "timeago.js": "^2.0.3", - "webpack": "^1.13.2", - "webpack-dashboard": "^0.2.0", - "webpack-dev-middleware": "^1.8.3", - "webpack-hot-middleware": "^2.12.2", - "webpack-module-hot-accept": "^1.0.4", + "webpack": "^1.13.3", "whatwg-fetch": "^1.0.0" }, "engines": { diff --git a/postcss.config.js b/postcss.config.js new file mode 100644 index 000000000..79fae36cb --- /dev/null +++ b/postcss.config.js @@ -0,0 +1,7 @@ +module.exports = { + plugins: [ + require('postcss-smart-import')({ /* ...options */ }), + require('precss')({ /* ...options */ }), + require('autoprefixer')({ /* ...options */ }) + ] +}; diff --git a/routes/admin/index.js b/routes/admin/index.js new file mode 100644 index 000000000..52957f54a --- /dev/null +++ b/routes/admin/index.js @@ -0,0 +1,13 @@ +const express = require('express'); + +const router = express.Router(); + +router.get('/embed/stream/preview', (req, res) => { + res.render('embed-stream', {basePath: '/client/embed/stream'}); +}); + +router.get('*', (req, res) => { + res.render('admin', {basePath: '/client/coral-admin'}); +}); + +module.exports = router; diff --git a/views/admin.ejs b/views/admin.ejs index 9b5fe84bf..038fb58d7 100644 --- a/views/admin.ejs +++ b/views/admin.ejs @@ -10,8 +10,8 @@ body, #root { width: 100%; height: 100%; - margin: 0; - background: #fff; + margin: 0; + background: #fff; } diff --git a/views/admin.ejs~HEAD b/views/admin.ejs~HEAD new file mode 100644 index 000000000..038fb58d7 --- /dev/null +++ b/views/admin.ejs~HEAD @@ -0,0 +1,22 @@ + + + + + + Talk - Coral Admin + + + + + +
+ + + diff --git a/views/embed-stream.ejs b/views/embed-stream.ejs new file mode 100644 index 000000000..47bda6bee --- /dev/null +++ b/views/embed-stream.ejs @@ -0,0 +1,23 @@ + + + + + + Talk - Coral Admin + + + + + + +
+ + + diff --git a/views/error.ejs b/views/error.ejs new file mode 100644 index 000000000..18d70b831 --- /dev/null +++ b/views/error.ejs @@ -0,0 +1,20 @@ + + + + + + + Error + + + + +
+ +
<%= message %>
+ +
<%= error.stack %>
+ +
+ + diff --git a/webpack.config.dev.js b/webpack.config.dev.js index 73662d409..e2c92b396 100644 --- a/webpack.config.dev.js +++ b/webpack.config.dev.js @@ -52,7 +52,11 @@ module.exports = { exclude: /node_modules/ }, { - loaders: ['style-loader', 'css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]', 'postcss-loader'], + loaders: [ + 'style-loader', + 'css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]', + 'postcss-loader' + ], test: /.css$/, }, { @@ -86,5 +90,6 @@ module.exports = { ...buildTargets.map(target => path.join(__dirname, 'client', target, 'src')), ...buildEmbeds.map(embed => path.join(__dirname, 'client', `coral-embed-${embed}`, 'src')) ] - } + }, + postcss: require('./postcss.config.js') }; diff --git a/webpack.config.js b/webpack.config.js index d28ca9d14..434da160d 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -7,7 +7,8 @@ devConfig.devtool = null; devConfig.plugins = devConfig.plugins.concat([ new webpack.DefinePlugin({ 'process.env': { - 'NODE_ENV': JSON.stringify('production') + 'NODE_ENV': `"${'production'}"`, + 'VERSION': `"${require('./package.json')}"` } }), new webpack.optimize.UglifyJsPlugin({