From 71d4ddf03053b814668f4bc1d8cf5aa418231c99 Mon Sep 17 00:00:00 2001 From: Riley Davis Date: Wed, 23 Nov 2016 13:28:20 -0700 Subject: [PATCH 01/42] create comment history class --- .../CommentHistory.js | 20 +++++++++++++++++++ 1 file changed, 20 insertions(+) create mode 100644 client/coral-plugin-comment-history/CommentHistory.js diff --git a/client/coral-plugin-comment-history/CommentHistory.js b/client/coral-plugin-comment-history/CommentHistory.js new file mode 100644 index 000000000..492c1545b --- /dev/null +++ b/client/coral-plugin-comment-history/CommentHistory.js @@ -0,0 +1,20 @@ +import React from 'react'; +import {connect} from 'react-redux'; + +const mapStateToProps = state => { + return { + config: state.config.toJS(), + items: state.items.toJS(), + auth: state.auth.toJS() + }; +}; + +class CommentHistory extends React.Component { + render () { + return ( +
Comment History
+ ); + } +} + +export default connect(mapStateToProps)(CommentHistory); From 28520bfd4aec38692dac9422d5c1b328730f21d6 Mon Sep 17 00:00:00 2001 From: Riley Davis Date: Wed, 23 Nov 2016 17:14:51 -0700 Subject: [PATCH 02/42] add get comments by user endpoint. refactor getStream to be functional programming --- .../coral-embed-stream/src/CommentStream.js | 2 + client/coral-framework/actions/items.js | 59 +++++++++++++------ client/coral-framework/reducers/items.js | 4 +- .../CommentCount.js | 17 +++--- .../CommentHistory.js | 0 models/comment.js | 9 +++ routes/api/comments/index.js | 2 + 7 files changed, 67 insertions(+), 26 deletions(-) rename client/{coral-plugin-comment-history => coral-plugin-history}/CommentHistory.js (100%) diff --git a/client/coral-embed-stream/src/CommentStream.js b/client/coral-embed-stream/src/CommentStream.js index a0eaca044..6da2bd22b 100644 --- a/client/coral-embed-stream/src/CommentStream.js +++ b/client/coral-embed-stream/src/CommentStream.js @@ -19,6 +19,7 @@ import LikeButton from '../../coral-plugin-likes/LikeButton'; import PermalinkButton from '../../coral-plugin-permalinks/PermalinkButton'; import SignInContainer from '../../coral-sign-in/containers/SignInContainer'; import UserBox from '../../coral-sign-in/components/UserBox'; +import CommentHistory from '../../coral-plugin-history/CommentHistory'; const {addItem, updateItem, postItem, getStream, postAction, deleteAction, appendItemArray} = itemActions; const {addNotification, clearNotification} = notificationActions; @@ -87,6 +88,7 @@ class CommentStream extends Component { const {actions, users, comments} = this.props.items; const {loggedIn, user, showSignInDialog} = this.props.auth; return
+ { rootItem ?
diff --git a/client/coral-framework/actions/items.js b/client/coral-framework/actions/items.js index f922280c1..148dabbfa 100644 --- a/client/coral-framework/actions/items.js +++ b/client/coral-framework/actions/items.js @@ -1,5 +1,11 @@ +import sortBy from 'lodash/sortBy'; + /* Item Actions */ +export const REQUEST_COMMENTS_BY_USER = 'REQUEST_COMMENTS_BY_USER'; +export const RECEIVE_COMMENTS_BY_USER = 'RECEIVE_COMMENTS_BY_USER'; +export const FAILURE_COMMENTS_BY_USER = 'FAILURE_COMMENTS_BY_USER'; + /** * Action name constants */ @@ -84,6 +90,27 @@ export const appendItemArray = (id, property, value, add_to_front, item_type) => }; }; +/** + * + * Get a list of comments by a single user + * + * @param {string} user_id + * @returns Promise + */ +export const fetchCommentsByUserId = userId => { + return (dispatch) => { + dispatch({type: REQUEST_COMMENTS_BY_USER}); + return fetch(`/api/v1/comments?user_id=${userId}`, getInit('GET')) + .then(responseHandler) + .then(comments => { + dispatch({type: RECEIVE_COMMENTS_BY_USER, comments}); + }) + .catch(error => { + dispatch({type: FAILURE_COMMENTS_BY_USER, error}); + }); + }; +}; + /* * Get Items from Query * Gets a set of items from a predefined query @@ -104,25 +131,24 @@ export function getStream (assetUrl) { .then((json) => { /* Add items to the store */ - const itemTypes = Object.keys(json); - for (let i = 0; i < itemTypes.length; i++ ) { - if (itemTypes[i] === 'actions') { - for (let j = 0; j < json[itemTypes[i]].length; j++ ) { - let action = json[itemTypes[i]][j]; + Object.keys(json).forEach(type => { + if (type === 'actions') { + json[type].forEach(action => { action.id = `${action.action_type}_${action.item_id}`; dispatch(addItem(action, 'actions')); - } + }); } else { - for (let j = 0; j < json[itemTypes[i]].length; j++ ) { - dispatch(addItem(json[itemTypes[i]][j], itemTypes[i])); - } + json[type].forEach(item => { + dispatch(addItem(item, type)); + }); } - } + }); const assetId = json.assets[0].id; /* Sort comments by date*/ json.comments.sort((a, b) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime()); + const rels = json.comments.reduce((h, item) => { /* Check for root and child comments. */ if ( @@ -140,15 +166,14 @@ export function getStream (assetUrl) { dispatch(updateItem(assetId, 'comments', rels.rootComments, 'assets')); - const childKeys = Object.keys(rels.childComments); - for (let i = 0; i < childKeys.length; i++ ) { - dispatch(updateItem(childKeys[i], 'children', rels.childComments[childKeys[i]].reverse(), 'comments')); - } + Object.keys(rels.childComments).forEach(key => { + dispatch(updateItem(key, 'children', rels.childComments[key].reverse(), 'comments')); + }); /* Hydrate actions on comments */ - for (let i = 0; i < json.actions.length; i++ ) { - dispatch(updateItem(json.actions[i].item_id, json.actions[i].action_type, json.actions[i].id, 'comments')); - } + json.actions.forEach(action => { + dispatch(updateItem(action.item_id, action.action_type, action.id, 'comments')); + }); return (json); }); diff --git a/client/coral-framework/reducers/items.js b/client/coral-framework/reducers/items.js index 17569c545..fa14085f3 100644 --- a/client/coral-framework/reducers/items.js +++ b/client/coral-framework/reducers/items.js @@ -6,7 +6,7 @@ import * as actions from '../actions/items'; const initialState = fromJS({ comments: {}, users: {}, - actions: {} + actions: {} }); export default (state = initialState, action) => { @@ -17,7 +17,7 @@ export default (state = initialState, action) => { return state.setIn([action.item_type, action.id, action.property], fromJS(action.value)); case actions.APPEND_ITEM_ARRAY: return state.updateIn([action.item_type, action.id, action.property], (prop) => { - console.log(prop); + console.log(action, prop); if (action.add_to_front) { return prop ? prop.unshift(fromJS(action.value)) : fromJS([action.value]); } else { diff --git a/client/coral-plugin-comment-count/CommentCount.js b/client/coral-plugin-comment-count/CommentCount.js index 7a27c1982..87f656c22 100644 --- a/client/coral-plugin-comment-count/CommentCount.js +++ b/client/coral-plugin-comment-count/CommentCount.js @@ -1,20 +1,23 @@ import React from 'react'; import {I18n} from '../coral-framework'; import translations from './translations.json'; +import has from 'lodash/has'; +import reduce from 'lodash/reduce'; const name = 'coral-plugin-comment-count'; const CommentCount = ({items, id}) => { let count = 0; - if (items.assets[id] && items.assets[id].comments) { + if (has(items, `assets.${id}.comments`)) { count += items.assets[id].comments.length; } - const itemKeys = Object.keys(items.comments); - for (let i = 0; i < itemKeys.length; i++) { - const item = items.comments[itemKeys[i]]; - if (item.children) { - count += item.children.length; + + // lodash reduce works on {} + count += reduce(items.comments, (accum, comment) => { + if (comment.children) { + accum += comment.children.length; } - } + return accum; + }, 0); return
{`${count} ${count === 1 ? lang.t('comment') : lang.t('comment-plural')}`} diff --git a/client/coral-plugin-comment-history/CommentHistory.js b/client/coral-plugin-history/CommentHistory.js similarity index 100% rename from client/coral-plugin-comment-history/CommentHistory.js rename to client/coral-plugin-history/CommentHistory.js diff --git a/models/comment.js b/models/comment.js index 2ac130978..2aedefe62 100644 --- a/models/comment.js +++ b/models/comment.js @@ -210,6 +210,15 @@ CommentSchema.statics.all = () => { return Comment.find(); }; +/** + * Returns all the comments by user + * probably to be paginated at some point in the future + * @return {Promise} array resolves to an array of comments by that user + */ +CommentSchema.statics.findByUserId = function (author_id) { + return Comment.find({author_id}); +}; + // Comment model. const Comment = mongoose.model('Comment', CommentSchema); diff --git a/routes/api/comments/index.js b/routes/api/comments/index.js index d318857d6..3fdbca334 100644 --- a/routes/api/comments/index.js +++ b/routes/api/comments/index.js @@ -11,6 +11,8 @@ router.get('/', (req, res, next) => { query = Comment.findByStatus(req.query.status); } else if (req.query.action_type) { query = Comment.findByActionType(req.query.action_type); + } else if (req.query.user_id) { + query = Comment.findByUserId(req.query.user_id); } else { query = Comment.all(); } From d10870c6bbb73906357ca9efaf2ce2ce1743c497 Mon Sep 17 00:00:00 2001 From: Riley Davis Date: Mon, 28 Nov 2016 10:54:10 -0700 Subject: [PATCH 03/42] dispatch update for adding comemnts --- client/coral-framework/actions/items.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/client/coral-framework/actions/items.js b/client/coral-framework/actions/items.js index 148dabbfa..b4e832bd3 100644 --- a/client/coral-framework/actions/items.js +++ b/client/coral-framework/actions/items.js @@ -104,6 +104,11 @@ export const fetchCommentsByUserId = userId => { .then(responseHandler) .then(comments => { dispatch({type: RECEIVE_COMMENTS_BY_USER, comments}); + + comments.forEach(comment => { + dispatch(addItem(comment, 'comments')); + }); + }) .catch(error => { dispatch({type: FAILURE_COMMENTS_BY_USER, error}); From c9a8d448bab80a79d70714527d042fc4fe569d7e Mon Sep 17 00:00:00 2001 From: Riley Davis Date: Mon, 12 Dec 2016 12:20:38 -0700 Subject: [PATCH 04/42] use plugin CommentHistory component --- client/coral-framework/actions/items.js | 2 -- .../CommentHistory.css | 0 client/coral-plugin-history/CommentHistory.js | 20 +++++++++++-------- .../containers/SettingsContainer.js | 6 ++++-- 4 files changed, 16 insertions(+), 12 deletions(-) rename client/{coral-settings/components => coral-plugin-history}/CommentHistory.css (100%) diff --git a/client/coral-framework/actions/items.js b/client/coral-framework/actions/items.js index 6cdc1adeb..01327a324 100644 --- a/client/coral-framework/actions/items.js +++ b/client/coral-framework/actions/items.js @@ -13,8 +13,6 @@ export const ADD_ITEM = 'ADD_ITEM'; export const UPDATE_ITEM = 'UPDATE_ITEM'; export const APPEND_ITEM_ARRAY = 'APPEND_ITEM_ARRAY'; -/* Item Actions */ - /** * Action creators */ diff --git a/client/coral-settings/components/CommentHistory.css b/client/coral-plugin-history/CommentHistory.css similarity index 100% rename from client/coral-settings/components/CommentHistory.css rename to client/coral-plugin-history/CommentHistory.css diff --git a/client/coral-plugin-history/CommentHistory.js b/client/coral-plugin-history/CommentHistory.js index 492c1545b..ea8846373 100644 --- a/client/coral-plugin-history/CommentHistory.js +++ b/client/coral-plugin-history/CommentHistory.js @@ -1,6 +1,18 @@ import React from 'react'; import {connect} from 'react-redux'; +import styles from './CommentHistory.css'; + +class CommentHistory extends React.Component { + render () { + return ( +
+

Comment History

+
+ ); + } +} + const mapStateToProps = state => { return { config: state.config.toJS(), @@ -9,12 +21,4 @@ const mapStateToProps = state => { }; }; -class CommentHistory extends React.Component { - render () { - return ( -
Comment History
- ); - } -} - export default connect(mapStateToProps)(CommentHistory); diff --git a/client/coral-settings/containers/SettingsContainer.js b/client/coral-settings/containers/SettingsContainer.js index 96020a10c..916a85baf 100644 --- a/client/coral-settings/containers/SettingsContainer.js +++ b/client/coral-settings/containers/SettingsContainer.js @@ -6,10 +6,12 @@ import {saveBio} from 'coral-framework/actions/user'; import BioContainer from './BioContainer'; import NotLoggedIn from '../components/NotLoggedIn'; import {TabBar, Tab, TabContent} from '../../coral-ui'; -import CommentHistory from '../components/CommentHistory'; +import CommentHistory from 'coral-plugin-history/CommentHistory'; import SettingsHeader from '../components/SettingsHeader'; import RestrictedContent from 'coral-framework/components/RestrictedContent'; +import {fetchCommentsByUserId} from 'coral-framework/actions/items'; + class SignInContainer extends Component { constructor (props) { super(props); @@ -56,7 +58,7 @@ const mapStateToProps = () => ({ const mapDispatchToProps = dispatch => ({ saveBio: (user_id, formData) => dispatch(saveBio(user_id, formData)), - getHistory: () => dispatch(), + fetchCommentsByUserId: userId => dispatch(fetchCommentsByUserId(userId)) }); export default connect( From c999e1c1a9df8969c726014d614efba1dcc2d783 Mon Sep 17 00:00:00 2001 From: Riley Davis Date: Mon, 12 Dec 2016 12:28:10 -0700 Subject: [PATCH 05/42] use new coralApi fetch --- client/coral-framework/actions/items.js | 3 +-- client/coral-settings/containers/SettingsContainer.js | 2 ++ 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/client/coral-framework/actions/items.js b/client/coral-framework/actions/items.js index 01327a324..e2dfc1ee9 100644 --- a/client/coral-framework/actions/items.js +++ b/client/coral-framework/actions/items.js @@ -92,8 +92,7 @@ export const appendItemArray = (id, property, value, add_to_front, item_type) => export const fetchCommentsByUserId = userId => { return (dispatch) => { dispatch({type: REQUEST_COMMENTS_BY_USER}); - return fetch(`/api/v1/comments?user_id=${userId}`, getInit('GET')) - .then(responseHandler) + return coralApi(`/comments?user_id=${userId}`) .then(comments => { dispatch({type: RECEIVE_COMMENTS_BY_USER, comments}); diff --git a/client/coral-settings/containers/SettingsContainer.js b/client/coral-settings/containers/SettingsContainer.js index 916a85baf..913f5f62e 100644 --- a/client/coral-settings/containers/SettingsContainer.js +++ b/client/coral-settings/containers/SettingsContainer.js @@ -24,6 +24,8 @@ class SignInContainer extends Component { componentWillMount () { // Fetch commentHistory + console.log('userData', this.props.userData); + this.props.fetchCommentsByUserId(this.props.userData.id); } handleTabChange(tab) { From c016e29290835940fbc41e430363975ac3ccbb7c Mon Sep 17 00:00:00 2001 From: Riley Davis Date: Mon, 12 Dec 2016 13:00:39 -0700 Subject: [PATCH 06/42] separate route for loading comments per user --- client/coral-framework/actions/items.js | 6 ++++-- routes/api/comments/index.js | 12 ++++++++++++ 2 files changed, 16 insertions(+), 2 deletions(-) diff --git a/client/coral-framework/actions/items.js b/client/coral-framework/actions/items.js index e2dfc1ee9..f9f0157c7 100644 --- a/client/coral-framework/actions/items.js +++ b/client/coral-framework/actions/items.js @@ -92,16 +92,19 @@ export const appendItemArray = (id, property, value, add_to_front, item_type) => export const fetchCommentsByUserId = userId => { return (dispatch) => { dispatch({type: REQUEST_COMMENTS_BY_USER}); - return coralApi(`/comments?user_id=${userId}`) + return coralApi(`/comments/user/${userId}`) .then(comments => { dispatch({type: RECEIVE_COMMENTS_BY_USER, comments}); + console.log('comments?', comments); + comments.forEach(comment => { dispatch(addItem(comment, 'comments')); }); }) .catch(error => { + console.error('FAILURE_COMMENTS_BY_USER', error); dispatch({type: FAILURE_COMMENTS_BY_USER, error}); }); }; @@ -145,7 +148,6 @@ export function getStream (assetUrl) { /* Sort comments by date*/ json.comments.sort((a, b) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime()); - const rels = json.comments.reduce((h, item) => { /* Check for root and child comments. */ if ( diff --git a/routes/api/comments/index.js b/routes/api/comments/index.js index 168b89fc3..ec01c2984 100644 --- a/routes/api/comments/index.js +++ b/routes/api/comments/index.js @@ -116,6 +116,18 @@ router.post('/', wordlist.filter('body'), (req, res, next) => { }); }); +router.get('/user/:user_id', (req, res, next) => { + // how to only get YOUR comments? + Comment.findByUserId(req.params.user_id) + .then(comments => { + res.json(comments); + }) + .catch(error => { + error.status = 500; + next(error); + }); +}); + router.get('/:comment_id', authorization.needed('admin'), (req, res, next) => { Comment .findById(req.params.comment_id) From d43cd9caf9df3010ea262dff6363bca6b2d895e3 Mon Sep 17 00:00:00 2001 From: Riley Davis Date: Mon, 12 Dec 2016 16:26:02 -0700 Subject: [PATCH 07/42] list comments out --- client/coral-framework/actions/items.js | 31 ---------------- client/coral-framework/actions/user.js | 27 ++++++++++++++ client/coral-framework/constants/user.js | 3 ++ client/coral-framework/reducers/items.js | 1 - client/coral-framework/reducers/user.js | 7 ++-- client/coral-plugin-history/CommentHistory.js | 35 +++++++++---------- .../components/CommentHistory.js | 15 -------- .../containers/SettingsContainer.js | 12 +++---- 8 files changed, 57 insertions(+), 74 deletions(-) delete mode 100644 client/coral-settings/components/CommentHistory.js diff --git a/client/coral-framework/actions/items.js b/client/coral-framework/actions/items.js index f9f0157c7..cd798c6b9 100644 --- a/client/coral-framework/actions/items.js +++ b/client/coral-framework/actions/items.js @@ -6,9 +6,6 @@ import {UPDATE_CONFIG} from '../constants/config'; * Action name constants */ -export const REQUEST_COMMENTS_BY_USER = 'REQUEST_COMMENTS_BY_USER'; -export const RECEIVE_COMMENTS_BY_USER = 'RECEIVE_COMMENTS_BY_USER'; -export const FAILURE_COMMENTS_BY_USER = 'FAILURE_COMMENTS_BY_USER'; export const ADD_ITEM = 'ADD_ITEM'; export const UPDATE_ITEM = 'UPDATE_ITEM'; export const APPEND_ITEM_ARRAY = 'APPEND_ITEM_ARRAY'; @@ -82,34 +79,6 @@ export const appendItemArray = (id, property, value, add_to_front, item_type) => }; }; -/** - * - * Get a list of comments by a single user - * - * @param {string} user_id - * @returns Promise - */ -export const fetchCommentsByUserId = userId => { - return (dispatch) => { - dispatch({type: REQUEST_COMMENTS_BY_USER}); - return coralApi(`/comments/user/${userId}`) - .then(comments => { - dispatch({type: RECEIVE_COMMENTS_BY_USER, comments}); - - console.log('comments?', comments); - - comments.forEach(comment => { - dispatch(addItem(comment, 'comments')); - }); - - }) - .catch(error => { - console.error('FAILURE_COMMENTS_BY_USER', error); - dispatch({type: FAILURE_COMMENTS_BY_USER, error}); - }); - }; -}; - /* * Get Items from Query * Gets a set of items from a predefined query diff --git a/client/coral-framework/actions/user.js b/client/coral-framework/actions/user.js index cda2d765d..5cbd04792 100644 --- a/client/coral-framework/actions/user.js +++ b/client/coral-framework/actions/user.js @@ -1,5 +1,6 @@ import * as actions from '../constants/user'; import {addNotification} from '../actions/notification'; +import {addItem} from '../actions/items'; import coralApi from '../helpers/response'; import I18n from 'coral-framework/modules/i18n/i18n'; @@ -19,3 +20,29 @@ export const saveBio = (user_id, formData) => dispatch => { }) .catch(error => dispatch(saveBioFailure(error))); }; + +/** + * + * Get a list of comments by a single user + * + * @param {string} user_id + * @returns Promise + */ +export const fetchCommentsByUserId = userId => { + return (dispatch) => { + dispatch({type: actions.REQUEST_COMMENTS_BY_USER}); + return coralApi(`/comments/user/${userId}`) + .then(comments => { + comments.forEach(comment => { + dispatch(addItem(comment, 'comments')); + }); + + dispatch({type: actions.RECEIVE_COMMENTS_BY_USER, comments: comments.map(comment => comment.id)}); + }) + .catch(error => { + console.error(error.stack); + console.error('FAILURE_COMMENTS_BY_USER', error); + dispatch({type: actions.FAILURE_COMMENTS_BY_USER, error}); + }); + }; +}; diff --git a/client/coral-framework/constants/user.js b/client/coral-framework/constants/user.js index 0c316d48a..ce9af61a2 100644 --- a/client/coral-framework/constants/user.js +++ b/client/coral-framework/constants/user.js @@ -1,3 +1,6 @@ export const SAVE_BIO_REQUEST = 'SAVE_BIO_REQUEST'; export const SAVE_BIO_SUCCESS = 'SAVE_BIO_SUCCESS'; export const SAVE_BIO_FAILURE = 'SAVE_BIO_FAILURE'; +export const REQUEST_COMMENTS_BY_USER = 'REQUEST_COMMENTS_BY_USER'; +export const RECEIVE_COMMENTS_BY_USER = 'RECEIVE_COMMENTS_BY_USER'; +export const FAILURE_COMMENTS_BY_USER = 'FAILURE_COMMENTS_BY_USER'; diff --git a/client/coral-framework/reducers/items.js b/client/coral-framework/reducers/items.js index fa14085f3..93388c1ab 100644 --- a/client/coral-framework/reducers/items.js +++ b/client/coral-framework/reducers/items.js @@ -17,7 +17,6 @@ export default (state = initialState, action) => { return state.setIn([action.item_type, action.id, action.property], fromJS(action.value)); case actions.APPEND_ITEM_ARRAY: return state.updateIn([action.item_type, action.id, action.property], (prop) => { - console.log(action, prop); if (action.add_to_front) { return prop ? prop.unshift(fromJS(action.value)) : fromJS([action.value]); } else { diff --git a/client/coral-framework/reducers/user.js b/client/coral-framework/reducers/user.js index 11b57fc15..c7badf458 100644 --- a/client/coral-framework/reducers/user.js +++ b/client/coral-framework/reducers/user.js @@ -1,11 +1,12 @@ -import {Map} from 'immutable'; +import {Map, fromJS} from 'immutable'; import * as authActions from '../constants/auth'; import * as actions from '../constants/user'; const initialState = Map({ displayName: '', profiles: [], - settings: {} + settings: {}, + myComments: [] }); const purge = user => { @@ -30,6 +31,8 @@ export default function user (state = initialState, action) { case actions.SAVE_BIO_SUCCESS: return state .set('settings', action.settings); + case actions.RECEIVE_COMMENTS_BY_USER: + return state.set('myComments', fromJS(action.comments)); default : return state; } diff --git a/client/coral-plugin-history/CommentHistory.js b/client/coral-plugin-history/CommentHistory.js index ea8846373..de95ff2b2 100644 --- a/client/coral-plugin-history/CommentHistory.js +++ b/client/coral-plugin-history/CommentHistory.js @@ -1,24 +1,21 @@ -import React from 'react'; -import {connect} from 'react-redux'; +import React, {PropTypes} from 'react'; import styles from './CommentHistory.css'; -class CommentHistory extends React.Component { - render () { - return ( -
-

Comment History

-
- ); - } -} - -const mapStateToProps = state => { - return { - config: state.config.toJS(), - items: state.items.toJS(), - auth: state.auth.toJS() - }; +const CommentHistory = props => { + return ( +
+

Comment History

+ {props.comments.map((comment, i) => { + console.log('a comment', comment); + return

{comment.body}

; + })} +
+ ); }; -export default connect(mapStateToProps)(CommentHistory); +CommentHistory.propTypes = { + comments: PropTypes.arrayOf(PropTypes.object).isRequired +}; + +export default CommentHistory; diff --git a/client/coral-settings/components/CommentHistory.js b/client/coral-settings/components/CommentHistory.js deleted file mode 100644 index 3160c8a88..000000000 --- a/client/coral-settings/components/CommentHistory.js +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react'; -import styles from './CommentHistory.css'; - -export default ({comments = []}) => ( -
-

Comments

-
    - {comments.map(() => ( -
  • - {/* Comment Data*/} -
    • - ))} -
-
-); diff --git a/client/coral-settings/containers/SettingsContainer.js b/client/coral-settings/containers/SettingsContainer.js index 913f5f62e..9ad489816 100644 --- a/client/coral-settings/containers/SettingsContainer.js +++ b/client/coral-settings/containers/SettingsContainer.js @@ -1,7 +1,7 @@ import React, {Component} from 'react'; import {connect} from 'react-redux'; -import {saveBio} from 'coral-framework/actions/user'; +import {saveBio, fetchCommentsByUserId} from 'coral-framework/actions/user'; import BioContainer from './BioContainer'; import NotLoggedIn from '../components/NotLoggedIn'; @@ -10,8 +10,6 @@ import CommentHistory from 'coral-plugin-history/CommentHistory'; import SettingsHeader from '../components/SettingsHeader'; import RestrictedContent from 'coral-framework/components/RestrictedContent'; -import {fetchCommentsByUserId} from 'coral-framework/actions/items'; - class SignInContainer extends Component { constructor (props) { super(props); @@ -35,7 +33,7 @@ class SignInContainer extends Component { } render() { - const {loggedIn, userData, showSignInDialog} = this.props; + const {loggedIn, userData, showSignInDialog, items, user} = this.props; const {activeTab} = this.state; return ( }> @@ -45,7 +43,7 @@ class SignInContainer extends Component { Profile Settings - + items.comments[id])} /> @@ -55,7 +53,9 @@ class SignInContainer extends Component { } } -const mapStateToProps = () => ({ +const mapStateToProps = state => ({ + items: state.items.toJS(), + user: state.user.toJS() }); const mapDispatchToProps = dispatch => ({ From 44e397b86c17aa8f799902d3ba2f52f96b8e62b6 Mon Sep 17 00:00:00 2001 From: David Jay Date: Mon, 12 Dec 2016 19:36:32 -0500 Subject: [PATCH 08/42] Passing character count into commentbox. --- .../coral-embed-stream/src/CommentStream.js | 6 ++-- client/coral-plugin-commentbox/CommentBox.js | 29 +++++++++++++++++-- 2 files changed, 31 insertions(+), 4 deletions(-) diff --git a/client/coral-embed-stream/src/CommentStream.js b/client/coral-embed-stream/src/CommentStream.js index b53832ce5..c052e5aa1 100644 --- a/client/coral-embed-stream/src/CommentStream.js +++ b/client/coral-embed-stream/src/CommentStream.js @@ -90,7 +90,7 @@ class CommentStream extends Component { const rootItemId = this.props.items.assets && Object.keys(this.props.items.assets)[0]; const rootItem = this.props.items.assets && this.props.items.assets[rootItemId]; const {actions, users, comments} = this.props.items; - const {status, moderation, closedMessage} = this.props.config; + const {status, moderation, closedMessage, charCount, charCountEnable} = this.props.config; const {loggedIn, isAdmin, user, showSignInDialog, signInOffset} = this.props.auth; const {activeTab} = this.state; const banned = (this.props.userData.status === 'banned'); @@ -128,7 +128,7 @@ class CommentStream extends Component { currentUser={this.props.auth.user} banned={banned} author={user} - /> + charCount={charCountEnable && charCount}/>
:

{closedMessage}

@@ -198,6 +198,7 @@ class CommentStream extends Component { parent_id={commentId} premod={moderation} currentUser={user} + charCount={charCountEnable && charCount} showReply={comment.showReply}/> { comment.children && @@ -257,6 +258,7 @@ class CommentStream extends Component { premod={moderation} banned={banned} currentUser={user} + charCount={charCountEnable && charCount} showReply={reply.showReply}/>
; }) diff --git a/client/coral-plugin-commentbox/CommentBox.js b/client/coral-plugin-commentbox/CommentBox.js index 0167d517f..078aba201 100644 --- a/client/coral-plugin-commentbox/CommentBox.js +++ b/client/coral-plugin-commentbox/CommentBox.js @@ -23,7 +23,18 @@ class CommentBox extends Component { } postComment = () => { - const {postItem, updateItem, id, parent_id, child_id, addNotification, appendItemArray, premod, author} = this.props; + const { + postItem, + updateItem, + id, + parent_id, + child_id, + addNotification, + appendItemArray, + premod, + author + } = this.props; + let comment = { body: this.state.body, asset_id: id, @@ -59,8 +70,16 @@ class CommentBox extends Component { this.setState({body: ''}); } + onUpdateComment = (e) => { + const body = e.target.value; + if (!this.props.charCount || body.length > this.props.charCount) { + this.setState({body}); + } + } + render () { - const {styles, reply, author} = this.props; + const {styles, reply, author, charCount} = this.props; + const length = this.state.body.length; // How to handle language in plugins? Should we have a dependency on our central translation file? return
this.setState({body: e.target.value})} rows={3}/>
+
charCount && `${name}-char-max`}`}> + { + charCount && + `${length}/${charCount}` + } +
{ author && (