decidim-comments/app/frontend/comments/comments.component.jsx in decidim-0.0.2 vs decidim-comments/app/frontend/comments/comments.component.jsx in decidim-0.0.3

@@ -22,12 +22,12 @@
 export class Comments extends Component {
   render() {
     const { comments, reorderComments, orderBy, loading } = this.props;
     let commentClasses = "comments";
     let commentHeader = I18n.t("components.comments.title", { count: comments.length });
-    
-    if (loading) { 
+
+    if (loading) {
       commentClasses += " loading-comments"
       commentHeader = I18n.t("components.comments.loading");
     }
 
     return (
@@ -35,11 +35,11 @@
         <section className={commentClasses}>
           <div className="row collapse order-by">
             <h2 className="order-by__text section-heading">
               { commentHeader }
             </h2>
-            <CommentOrderSelector 
+            <CommentOrderSelector
               reorderComments={reorderComments}
               defaultOrderBy={orderBy}
             />
           </div>
           {this._renderCommentThreads()}
@@ -53,17 +53,17 @@
    * Iterates the comment's collection and render a CommentThread for each one
    * @private
    * @returns {ReactComponent[]} - A collection of CommentThread components
    */
   _renderCommentThreads() {
-    const { comments, currentUser, options: { votable } } = this.props;
+    const { comments, session, options: { votable } } = this.props;
 
     return comments.map((comment) => (
-      <CommentThread 
-        key={comment.id} 
-        comment={filter(CommentThread.fragments.comment, comment)} 
-        currentUser={currentUser}
+      <CommentThread
+        key={comment.id}
+        comment={filter(CommentThread.fragments.comment, comment)}
+        session={session}
         votable={votable}
       />
     ))
   }
 
@@ -71,16 +71,16 @@
    * If current user is present it renders the add comment form
    * @private
    * @returns {Void|ReactComponent} - A AddCommentForm component or nothing
    */
   _renderAddCommentForm() {
-    const { currentUser, commentableId, commentableType, options: { arguable } } = this.props;
+    const { session, commentableId, commentableType, options: { arguable } } = this.props;
 
-    if (currentUser) {
+    if (session) {
       return (
-        <AddCommentForm 
-          currentUser={currentUser}
+        <AddCommentForm
+          session={session}
           commentableId={commentableId}
           commentableType={commentableType}
           arguable={arguable}
         />
       );
@@ -93,12 +93,12 @@
 Comments.propTypes = {
   loading: PropTypes.bool,
   comments: PropTypes.arrayOf(PropTypes.shape({
     id: PropTypes.string.isRequired
   })),
-  currentUser: PropTypes.shape({
-    name: PropTypes.string.isRequired
+  session: PropTypes.shape({
+    user: PropTypes.any.isRequired
   }),
   commentableId: PropTypes.string.isRequired,
   commentableType: PropTypes.string.isRequired,
   options: PropTypes.shape({
     arguable: PropTypes.bool
@@ -109,21 +109,25 @@
 
 /**
  * Wrap the Comments component with a GraphQL query and children
  * fragments.
  */
+
+window.Comments = Comments;
+
 const CommentsWithData = graphql(gql`
   ${commentsQuery}
+  ${AddCommentForm.fragments.user}
   ${CommentThread.fragments.comment}
 `, {
   options: {
     pollInterval: 15000
   },
-  props: ({ ownProps, data: {loading, currentUser, comments, refetch }}) => ({
+  props: ({ ownProps, data: { loading, session, comments, refetch }}) => ({
     loading: loading,
     comments: comments || [],
-    currentUser: currentUser || null,
+    session,
     commentableId: ownProps.commentableId,
     commentableType: ownProps.commentableType,
     orderBy: ownProps.orderBy,
     options: ownProps.options,
     reorderComments: (orderBy) => {
@@ -139,10 +143,10 @@
  * connect it with Apollo client and store.
  * @returns {ReactComponent} - A component wrapped within an Application component
  */
 const CommentsApplication = ({ locale, commentableId, commentableType, options }) => (
   <Application locale={locale}>
-    <CommentsWithData 
+    <CommentsWithData
       commentableId={commentableId}
       commentableType={commentableType}
       options={options}
       orderBy="older"
     />