Adding author info to comments and author name display.

client/coral-embed-stream/src/CommentStream.js

@@ -85,6 +85,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 {loggedIn, user} = this.props.auth;
+    const {actions, users, comments} = this.props.items;
     return <div>
       {
         rootItem
@@ -105,7 +106,7 @@ class CommentStream extends Component {
               id={rootItemId}
               premod={this.props.config.moderation}
               reply={false}
-              authorId={user.id}
+              author={user}
             />
             {!loggedIn && <SignInContainer />}
           </div>
@@ -114,7 +115,7 @@ class CommentStream extends Component {
               const comment = this.props.items.comments[commentId];
               return <div className="comment" key={commentId}>
                 <hr aria-hidden={true}/>
-                <AuthorName name={comment.username}/>
+                <AuthorName author={users[comment.user_id]}/>
                 <PubDate created_at={comment.created_at}/>
                 <Content body={comment.body}/>
                 <div className="commentActionsLeft">
@@ -124,7 +125,7 @@ class CommentStream extends Component {
                   <LikeButton
                     addNotification={this.props.addNotification}
                     id={commentId}
-                    like={this.props.items.actions[comment.like]}
+                    like={actions[comment.like]}
                     postAction={this.props.postAction}
                     deleteAction={this.props.deleteAction}
                     addItem={this.props.addItem}
@@ -135,7 +136,7 @@ class CommentStream extends Component {
                   <FlagButton
                     addNotification={this.props.addNotification}
                     id={commentId}
-                    flag={this.props.items.actions[comment.flag]}
+                    flag={actions[comment.flag]}
                     postAction={this.props.postAction}
                     deleteAction={this.props.deleteAction}
                     addItem={this.props.addItem}
@@ -151,6 +152,7 @@ class CommentStream extends Component {
                     appendItemArray={this.props.appendItemArray}
                     updateItem={this.props.updateItem}
                     id={rootItemId}
+                    author={user}
                     parent_id={commentId}
                     premod={this.props.config.moderation}
                     showReply={comment.showReply}/>
@@ -160,7 +162,7 @@ class CommentStream extends Component {
                       let reply = this.props.items.comments[replyId];
                       return <div className="reply" key={replyId}>
                         <hr aria-hidden={true}/>
-                        <AuthorName name={reply.username}/>
+                        <AuthorName author={users[comment.user_id]}/>
                         <PubDate created_at={reply.created_at}/>
                         <Content body={reply.body}/>
                         <div className="replyActionsLeft">

client/coral-plugin-author-name/AuthorName.js

@@ -1,9 +1,9 @@
 import React from 'react';
 const packagename = 'coral-plugin-author-name';
 
-const AuthorName = ({name}) =>
+const AuthorName = ({author}) =>
 <div className={`${packagename}-text`}>
-  {name}
+  {author && author.displayName}
 </div>;
 
 export default AuthorName;

client/coral-plugin-commentbox/CommentBox.js

@@ -22,11 +22,11 @@ class CommentBox extends Component {
   }
 
   postComment = () => {
-    const {postItem, updateItem, id, parent_id, addNotification, appendItemArray, premod, authorId} = this.props;
+    const {postItem, updateItem, id, parent_id, addNotification, appendItemArray, premod, author} = this.props;
     let comment = {
       body: this.state.body,
       asset_id: id,
-      user_id: authorId.id
+      user_id: author.id
     };
     let related;
     let parent_type;
@@ -53,7 +53,7 @@ class CommentBox extends Component {
   }
 
   render () {
-    const {styles, reply, authorId} = this.props;
+    const {styles, reply, author} = this.props;
     // How to handle language in plugins? Should we have a dependency on our central translation file?
     return <div>
       <div
@@ -74,7 +74,7 @@ class CommentBox extends Component {
             rows={3}/>
         </div>
         <div className={`${name}-button-container`}>
-          { authorId && (
+          { author && (
               <button
                 className={`${name}-button`}
                 style={styles && styles.button}

routes/api/stream/index.js

@@ -35,7 +35,7 @@ router.get('/', (req, res, next) => {
     return Promise.all([
       [asset],
       comments,
-      User.findByIdArray(comments.map((comment) => comment.author_id)),
+      User.findPublicByIdArray(comments.map((comment) => comment.user_id)),
       Action.getActionSummaries(comments.map((comment) => comment.id))
     ]);
   })

tests/models/user.js

@@ -53,7 +53,6 @@ describe('User: models', () => {
           if(a.displayName > b.displayName) {return 1;}
           return 0;
         });
-        console.log(sorted);
         expect(sorted[0]).to.have.property('displayName')
           .and.to.equal('Marvel');
       });