diff --git a/client/coral-admin/src/actions/auth.js b/client/coral-admin/src/actions/auth.js index c7643cc08..c5a03132f 100644 --- a/client/coral-admin/src/actions/auth.js +++ b/client/coral-admin/src/actions/auth.js @@ -4,13 +4,16 @@ import {base, handleResp, getInit} from '../helpers/response'; // Check Login const checkLoginRequest = () => ({type: actions.CHECK_LOGIN_REQUEST}); -const checkLoginSuccess = user => ({type: actions.CHECK_LOGIN_SUCCESS, user}); +const checkLoginSuccess = (user, isAdmin) => ({type: actions.CHECK_LOGIN_SUCCESS, user, isAdmin}); const checkLoginFailure = error => ({type: actions.CHECK_LOGIN_FAILURE, error}); export const checkLogin = () => dispatch => { dispatch(checkLoginRequest()); fetch(`${base}/auth`, getInit('GET')) .then(handleResp) - .then(user => dispatch(checkLoginSuccess(user))) + .then(user => { + const isAdmin = !!user.roles.filter(i => i === 'admin').length; + dispatch(checkLoginSuccess(user, isAdmin)); + }) .catch(error => dispatch(checkLoginFailure(error))); }; diff --git a/client/coral-admin/src/components/NotFound.css b/client/coral-admin/src/components/NotFound.css new file mode 100644 index 000000000..fc9aedc6b --- /dev/null +++ b/client/coral-admin/src/components/NotFound.css @@ -0,0 +1,12 @@ +.layout { + max-width: 800px; + margin: 0 auto; +} + +.layout h1 { + font-size: 40px; +} + +.layout img { + width: 100%; +} diff --git a/client/coral-admin/src/components/NotFound.js b/client/coral-admin/src/components/NotFound.js new file mode 100644 index 000000000..fc9089ba3 --- /dev/null +++ b/client/coral-admin/src/components/NotFound.js @@ -0,0 +1,13 @@ +import React from 'react'; +import {Layout} from 'react-mdl'; +import styles from './NotFound.css'; + +export const NotFound = () => ( + +
+

Page Not Found

+

The communicorn feels your pain.

+ Communicorn +
+
+); diff --git a/client/coral-admin/src/components/PermissionRequired.js b/client/coral-admin/src/components/PermissionRequired.js new file mode 100644 index 000000000..c61ab1cef --- /dev/null +++ b/client/coral-admin/src/components/PermissionRequired.js @@ -0,0 +1,13 @@ +import React from 'react'; +import {Layout} from 'react-mdl'; +import styles from './NotFound.css'; + +export const PermissionRequired = () => ( + +
+

Permission Required

+

We’re sorry, but you don’t have access to that page.

+ Communicorn +
+
+); diff --git a/client/coral-admin/src/containers/LayoutContainer.js b/client/coral-admin/src/containers/LayoutContainer.js index 429f2cc4d..5f3cb0cff 100644 --- a/client/coral-admin/src/containers/LayoutContainer.js +++ b/client/coral-admin/src/containers/LayoutContainer.js @@ -1,13 +1,25 @@ import React, {Component} from 'react'; import {connect} from 'react-redux'; import {Layout} from '../components/ui/Layout'; -import {checkLogin} from 'coral-framework/actions/auth'; +import {checkLogin} from '../actions/auth'; +import {NotFound} from '../components/NotFound'; +import {PermissionRequired} from '../components/PermissionRequired'; class LayoutContainer extends Component { componentWillMount () { this.props.checkLogin(); } render () { + const {isAdmin, loggedIn} = this.props.auth; + + if (!loggedIn) { + return ; + } + + if (!isAdmin && loggedIn) { + return ; + } + return ; } } diff --git a/client/coral-admin/src/containers/ModerationQueue.css b/client/coral-admin/src/containers/ModerationQueue.css index 02f9eb9e9..6d40b5935 100644 --- a/client/coral-admin/src/containers/ModerationQueue.css +++ b/client/coral-admin/src/containers/ModerationQueue.css @@ -1,4 +1,3 @@ - @custom-media --big-viewport (min-width: 780px); .listContainer { @@ -6,8 +5,13 @@ margin: 0 auto; } +.tabBar { + background: #9E9E9E; +} + .tab { flex: 1; + color: white; } @media (--big-viewport) { diff --git a/client/coral-admin/src/containers/ModerationQueue.js b/client/coral-admin/src/containers/ModerationQueue.js index 7a30b8487..88150012a 100644 --- a/client/coral-admin/src/containers/ModerationQueue.js +++ b/client/coral-admin/src/containers/ModerationQueue.js @@ -61,9 +61,9 @@ class ModerationQueue extends React.Component { return (
-
+
this.onTabClick('pending')} - className={`mdl-tabs__tab is-active ${styles.tab}`}>{lang.t('modqueue.pending')} + className={`mdl-tabs__tab ${styles.tab}`}>{lang.t('modqueue.pending')} this.onTabClick('rejected')} className={`mdl-tabs__tab ${styles.tab}`}>{lang.t('modqueue.rejected')} this.onTabClick('flagged')} diff --git a/client/coral-admin/src/helpers/response.js b/client/coral-admin/src/helpers/response.js index 439ba5a8a..bccfc5a04 100644 --- a/client/coral-admin/src/helpers/response.js +++ b/client/coral-admin/src/helpers/response.js @@ -1,12 +1,15 @@ export const base = '/api/v1'; export const getInit = (method, body) => { - const headers = new Headers({ - 'Content-Type': 'application/json', - 'Accept': 'application/json' - }); + let init = { + method, + headers: new Headers({ + 'Content-Type': 'application/json', + 'Accept': 'application/json' + }), + credentials: 'same-origin' + }; - const init = {method, headers}; if (method.toLowerCase() !== 'get') { init.body = JSON.stringify(body); } diff --git a/client/coral-admin/src/reducers/auth.js b/client/coral-admin/src/reducers/auth.js index bdb2bb074..59dccac5e 100644 --- a/client/coral-admin/src/reducers/auth.js +++ b/client/coral-admin/src/reducers/auth.js @@ -3,7 +3,8 @@ import * as actions from '../constants/auth'; const initialState = Map({ loggedIn: false, - user: null + user: null, + isAdmin: false }); export default function auth (state = initialState, action) { @@ -15,6 +16,7 @@ export default function auth (state = initialState, action) { case actions.CHECK_LOGIN_SUCCESS: return state .set('loggedIn', true) + .set('isAdmin', action.isAdmin) .set('user', action.user); case actions.LOGOUT_SUCCESS: return state diff --git a/routes/api/auth/index.js b/routes/api/auth/index.js index 87ffb62c8..ae6fba01c 100644 --- a/routes/api/auth/index.js +++ b/routes/api/auth/index.js @@ -8,7 +8,7 @@ const router = express.Router(); * This returns the user if they are logged in. */ router.get('/', authorization.needed(), (req, res) => { - res.json(req.user); + res.json(req.user.toObject()); }); /**