diff --git a/client/coral-embed-stream/src/CommentStream.js b/client/coral-embed-stream/src/CommentStream.js
index 31457787a..3fa989dcc 100644
--- a/client/coral-embed-stream/src/CommentStream.js
+++ b/client/coral-embed-stream/src/CommentStream.js
@@ -16,10 +16,11 @@ import Pym from 'pym.js';
import FlagButton from '../../coral-plugin-flags/FlagButton';
import PermalinkButton from '../../coral-plugin-permalinks/PermalinkButton';
import SignInContainer from '../../coral-sign-in/containers/SignInContainer';
+import UserBox from '../../coral-sign-in/components/UserBox';
const {addItem, updateItem, postItem, getStream, postAction, appendItemArray} = itemActions;
const {addNotification, clearNotification} = notificationActions;
-const {setLoggedInUser} = authActions;
+const {logout} = authActions;
const mapStateToProps = (state) => {
return {
@@ -30,37 +31,19 @@ const mapStateToProps = (state) => {
};
};
-const mapDispatchToProps = (dispatch) => {
- return {
- addItem: (item, itemType) => {
- return dispatch(addItem(item, itemType));
- },
- updateItem: (id, property, value, itemType) => {
- return dispatch(updateItem(id, property, value, itemType));
- },
- postItem: (data, type, id) => {
- return dispatch(postItem(data, type, id));
- },
- getStream: (rootId) => {
- return dispatch(getStream(rootId));
- },
- addNotification: (type, text) => {
- return dispatch(addNotification(type, text));
- },
- clearNotification: () => {
- return dispatch(clearNotification());
- },
- setLoggedInUser: (user_id) => {
- return dispatch(setLoggedInUser(user_id));
- },
- postAction: (item, action, user, itemType) => {
- return dispatch(postAction(item, action, user, itemType));
- },
- appendItemArray: (item, property, value, addToFront, itemType) => {
- return dispatch(appendItemArray(item, property, value, addToFront, itemType));
- }
- };
-};
+const mapDispatchToProps = (dispatch) => ({
+ addItem: (item, itemType) => dispatch(addItem(item, itemType)),
+ updateItem: (id, property, value, itemType) => dispatch(updateItem(id, property, value, itemType)),
+ postItem: (data, type, id) => dispatch(postItem(data, type, id)),
+ getStream: (rootId) => dispatch(getStream(rootId)),
+ addNotification: (type, text) => dispatch(addNotification(type, text)),
+ clearNotification: () => dispatch(clearNotification()),
+ setLoggedInUser: (user_id) => dispatch(setLoggedInUser(user_id)),
+ postAction: (item, action, user, itemType) => dispatch(postAction(item, action, user, itemType)),
+ appendItemArray: (item, property, value, addToFront, itemType) =>
+ dispatch(appendItemArray(item, property, value, addToFront, itemType)),
+ logout: () => dispatch(logout())
+});
class CommentStream extends Component {
@@ -96,6 +79,7 @@ class CommentStream extends Component {
const rootItemId = 'assetTest';
const rootItem = this.props.items.assets && this.props.items.assets[rootItemId];
+ const {loggedIn, user} = this.props.auth;
return
{
rootItem
@@ -104,6 +88,7 @@ class CommentStream extends Component {
+ {loggedIn && }
-
+ reply={false}
+ canPost={loggedIn}
+ />
+ {!loggedIn && }
{
rootItem.comments.map((commentId) => {
diff --git a/client/coral-framework/actions/auth.js b/client/coral-framework/actions/auth.js
index 184f6b1d6..3981d8021 100644
--- a/client/coral-framework/actions/auth.js
+++ b/client/coral-framework/actions/auth.js
@@ -30,8 +30,8 @@ export const fetchSignIn = () => dispatch => {
// Sign In - Facebook
const signInFacebookRequest = () => ({type: actions.FETCH_SIGNIN_FACEBOOK_REQUEST});
-const signInFacebookSuccess = () => ({type: actions.FETCH_SIGNIN_FACEBOOK_SUCCESS});
-const signInFacebookFailure = () => ({type: actions.FETCH_SIGNIN_FACEBOOK_FAILURE});
+const signInFacebookSuccess = (user) => ({type: actions.FETCH_SIGNIN_FACEBOOK_SUCCESS, user});
+const signInFacebookFailure = (error) => ({type: actions.FETCH_SIGNIN_FACEBOOK_FAILURE, error});
export const fetchSignInFacebook = () => dispatch => {
dispatch(signInFacebookRequest());
@@ -83,13 +83,17 @@ export const fetchForgotPassword = () => dispatch => {
.catch(error => dispatch(forgotPassowordFailure(error)));
};
-// LogOut
+// LogOut Actions
+
+const logOutRequest = () => ({type: actions.LOGOUT_REQUEST});
+const logOutSuccess = () => ({type: actions.LOGOUT_SUCCESS});
+const logOutFailure = () => ({type: actions.LOGOUT_FAILURE});
export const logout = () => dispatch => {
- dispatch(signInRequest());
+ dispatch(logOutRequest());
fetch(`${base}/auth`, getInit('DELETE'))
.then(handleResp)
- .then(() => dispatch(signInSuccess()))
- .catch(error => dispatch(signInFailure(error)));
+ .then(() => dispatch(logOutSuccess()))
+ .catch(error => dispatch(logOutFailure(error)));
};
diff --git a/client/coral-framework/constants/auth.js b/client/coral-framework/constants/auth.js
index c48894cc5..06558d513 100644
--- a/client/coral-framework/constants/auth.js
+++ b/client/coral-framework/constants/auth.js
@@ -19,3 +19,7 @@ export const FETCH_SIGNIN_FACEBOOK_SUCCESS = 'FETCH_SIGNIN_FACEBOOK_SUCCESS';
export const FETCH_FORGOT_PASSWORD_REQUEST = 'FETCH_FORGOT_PASSWORD_REQUEST';
export const FETCH_FORGOT_PASSWORD_SUCCESS = 'FETCH_FORGOT_PASSWORD_SUCCESS';
export const FETCH_FORGOT_PASSWORD_FAILURE = 'FETCH_FORGOT_PASSWORD_FAILURE';
+
+export const LOGOUT_REQUEST = 'LOGOUT_REQUEST';
+export const LOGOUT_SUCCESS = 'LOGOUT_SUCCESS';
+export const LOGOUT_FAILURE = 'LOGOUT_FAILURE';
diff --git a/client/coral-framework/reducers/auth.js b/client/coral-framework/reducers/auth.js
index 5e54d70b6..89e7c8012 100644
--- a/client/coral-framework/reducers/auth.js
+++ b/client/coral-framework/reducers/auth.js
@@ -7,7 +7,10 @@ import {
CLEAN_STATE,
FETCH_SIGNIN_REQUEST,
FETCH_SIGNIN_FAILURE,
- FETCH_SIGNIN_SUCCESS
+ FETCH_SIGNIN_SUCCESS,
+ FETCH_SIGNIN_FACEBOOK_SUCCESS,
+ FETCH_SIGNIN_FACEBOOK_FAILURE,
+ LOGOUT_SUCCESS
} from '../constants/auth';
const initialState = Map({
@@ -15,7 +18,7 @@ const initialState = Map({
isLoading: false,
loggedIn: false,
error: '',
- user: {},
+ user: null,
showSignInDialog: false,
view: 'SIGNIN'
});
@@ -43,6 +46,19 @@ export default function auth (state = initialState, action) {
case FETCH_SIGNIN_SUCCESS:
return state
.set('isLoading', false);
+ case FETCH_SIGNIN_FACEBOOK_SUCCESS:
+ return state
+ .set('user', action.user)
+ .set('loggedIn', true)
+ .set('showSignInDialog', false);
+ case FETCH_SIGNIN_FACEBOOK_FAILURE:
+ return state
+ .set('error', action.error)
+ .set('user', null);
+ case LOGOUT_SUCCESS:
+ return state
+ .set('loggedIn', false)
+ .set('user', null);
default :
return state;
}
diff --git a/client/coral-plugin-commentbox/CommentBox.js b/client/coral-plugin-commentbox/CommentBox.js
index 9032ad328..9f1ea39c6 100644
--- a/client/coral-plugin-commentbox/CommentBox.js
+++ b/client/coral-plugin-commentbox/CommentBox.js
@@ -11,7 +11,8 @@ class CommentBox extends Component {
updateItem: PropTypes.func,
id: PropTypes.string,
comments: PropTypes.array,
- reply: PropTypes.bool
+ reply: PropTypes.bool,
+ canPost: PropTypes.bool
}
state = {
@@ -51,7 +52,7 @@ class CommentBox extends Component {
}
render () {
- const {styles, reply} = this.props;
+ const {styles, reply, canPost} = this.props;
// How to handle language in plugins? Should we have a dependency on our central translation file?
return
@@ -81,12 +82,15 @@ class CommentBox extends Component {
rows={3}/>
-
+ { canPost && (
+
+ )
+ }
;
}
diff --git a/client/coral-sign-in/components/UserBox.js b/client/coral-sign-in/components/UserBox.js
new file mode 100644
index 000000000..17c8453fb
--- /dev/null
+++ b/client/coral-sign-in/components/UserBox.js
@@ -0,0 +1,13 @@
+import React from 'react';
+import styles from './styles.css';
+
+const UserBox = ({className, user, logout, ...props}) => (
+
+);
+
+export default UserBox;
diff --git a/client/coral-sign-in/components/styles.css b/client/coral-sign-in/components/styles.css
index 3800f53e1..3a83d0985 100644
--- a/client/coral-sign-in/components/styles.css
+++ b/client/coral-sign-in/components/styles.css
@@ -99,4 +99,10 @@ input.error{
border: solid 1px #f44336;
background: #F1A097;
color: #741818;
+}
+
+.userBox a {
+ color: #2c69b6;
+ cursor: pointer;
+ margin: 0 5px;
}
\ No newline at end of file