From 06ba5a53c1e8264b5f4f9d5beb2ae45a931b7ba3 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Wed, 26 Apr 2017 22:33:49 -0300
Subject: [PATCH 01/11] Stateless Slot

---
 client/coral-framework/components/Slot.js | 24 ++++++++++-------------
 1 file changed, 10 insertions(+), 14 deletions(-)

diff --git a/client/coral-framework/components/Slot.js b/client/coral-framework/components/Slot.js
index c1e5dfe65..ad4847fcb 100644
--- a/client/coral-framework/components/Slot.js
+++ b/client/coral-framework/components/Slot.js
@@ -1,20 +1,16 @@
-import React, {Component} from 'react';
-import {getSlotElements} from 'coral-framework/helpers/plugins';
+import React from 'react';
+import cn from 'classnames';
 import styles from './Slot.css';
+import {getSlotElements} from 'coral-framework/helpers/plugins';
 
-class Slot extends Component {
-  render() {
-    const {fill, inline = false, ...rest} = this.props;
-    return (
-      <div className={inline ? styles.inline : ''}>
-        {getSlotElements(fill, rest)}
-      </div>
-    );
-  }
+export default function Slot ({fill, inline = false, ...rest}) {
+  return (
+    <div className={cn({[styles.inline]: inline})}>
+      {getSlotElements(fill, rest)}
+    </div>
+  );
 }
 
 Slot.propTypes = {
   fill: React.PropTypes.string
-};
-
-export default Slot;
+};
\ No newline at end of file

From 9fa3e361b58175db12df0a2496790a9522fdc225 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Wed, 26 Apr 2017 22:34:17 -0300
Subject: [PATCH 02/11] Ref Stream

---
 .../src/components/Stream.js                  | 286 +++++++++---------
 1 file changed, 147 insertions(+), 139 deletions(-)

diff --git a/client/coral-embed-stream/src/components/Stream.js b/client/coral-embed-stream/src/components/Stream.js
index 2875d0397..50f2800a3 100644
--- a/client/coral-embed-stream/src/components/Stream.js
+++ b/client/coral-embed-stream/src/components/Stream.js
@@ -1,28 +1,30 @@
 import React, {PropTypes} from 'react';
+
 import {Button} from 'coral-ui';
-import Comment from '../containers/Comment';
-import CommentBox from 'coral-plugin-commentbox/CommentBox';
-import SuspendedAccount from 'coral-framework/components/SuspendedAccount';
-import RestrictedContent from 'coral-framework/components/RestrictedContent';
-import ChangeUsernameContainer from 'coral-sign-in/containers/ChangeUsernameContainer';
-import IgnoredCommentTombstone from './IgnoredCommentTombstone';
-import InfoBox from 'coral-plugin-infobox/InfoBox';
-import QuestionBox from 'coral-plugin-questionbox/QuestionBox';
 import LoadMore from './LoadMore';
 import NewCount from './NewCount';
+import Comment from '../containers/Comment';
+import Slot from 'coral-framework/components/Slot';
+import InfoBox from 'coral-plugin-infobox/InfoBox';
 import {ModerationLink} from 'coral-plugin-moderation';
+import CommentBox from 'coral-plugin-commentbox/CommentBox';
+import QuestionBox from 'coral-plugin-questionbox/QuestionBox';
+import IgnoredCommentTombstone from './IgnoredCommentTombstone';
+import SuspendedAccount from 'coral-framework/components/SuspendedAccount';
+import RestrictedContent from 'coral-framework/components/RestrictedContent';
+import ChangeUsernameContainer
+  from 'coral-sign-in/containers/ChangeUsernameContainer';
 
 class Stream extends React.Component {
-
-  setActiveReplyBox = (reactKey) => {
+  setActiveReplyBox = reactKey => {
     if (!this.props.auth.user) {
       this.props.showSignInDialog();
     } else {
       this.props.setActiveReplyBox(reactKey);
     }
-  }
+  };
 
-  render () {
+  render() {
     const {
       root: {asset, asset: {comments}, comment, myIgnoredUsers},
       postItem,
@@ -39,152 +41,158 @@ class Stream extends React.Component {
       ignoreUser,
       auth: {loggedIn, isAdmin, user},
       commentCountCache,
-      editName,
+      editName
     } = this.props;
     const open = asset.closedAt === null;
 
     // even though the permalinked comment is the highlighted one, we're displaying its parent + replies
-    const highlightedComment = comment && comment.parent ? comment.parent : comment;
+    const highlightedComment = comment && comment.parent
+      ? comment.parent
+      : comment;
 
     const banned = user && user.status === 'BANNED';
 
-    const hasOlderComments = !!(
-      asset &&
+    const hasOlderComments = !!(asset &&
       asset.lastComment &&
-      asset.lastComment.id !== asset.comments[asset.comments.length - 1].id
-    );
+      asset.lastComment.id !== asset.comments[asset.comments.length - 1].id);
 
     // Find the created_at date of the first comment. If no comments exist, set the date to a week ago.
     const firstCommentDate = asset.comments[0]
       ? asset.comments[0].created_at
       : new Date(Date.now() - 1000 * 60 * 60 * 24 * 7).toISOString();
-    const commentIsIgnored = (comment) => myIgnoredUsers && myIgnoredUsers.includes(comment.user.id);
+    const commentIsIgnored = comment =>
+      myIgnoredUsers && myIgnoredUsers.includes(comment.user.id);
     return (
-      <div id='stream'>
-        {
-          open
-           ? <div id="commentBox">
-               <InfoBox
-                 content={asset.settings.infoBoxContent}
-                 enable={asset.settings.infoBoxEnable}
-               />
-               <QuestionBox
-                 content={asset.settings.questionBoxContent}
-                 enable={asset.settings.questionBoxEnable}
-               />
-             <RestrictedContent restricted={banned} restrictedComp={
-                 <SuspendedAccount
-                   canEditName={user && user.canEditName}
-                   editName={editName}
-                   />
-               }>
-               {
-                 user
-                 ? <CommentBox
-                    addNotification={this.props.addNotification}
-                    postItem={this.props.postItem}
-                    appendItemArray={this.props.appendItemArray}
-                    updateItem={this.props.updateItem}
-                    setCommentCountCache={this.props.setCommentCountCache}
-                    commentCountCache={commentCountCache}
-                    assetId={asset.id}
-                    premod={asset.settings.moderation}
-                    isReply={false}
-                    authorId={user.id}
-                    charCountEnable={asset.settings.charCountEnable}
-                    maxCharCount={asset.settings.charCount} />
-                 : null
-               }
-             </RestrictedContent>
-             </div>
-           : <p>{asset.settings.closedMessage}</p>
-        }
-        {!loggedIn && <Button id='coralSignInButton' onClick={this.props.showSignInDialog} full>Sign in to comment</Button>}
-        {loggedIn && user && <ChangeUsernameContainer loggedIn={loggedIn} user={user} />}
+      <div id="stream">
+        {open
+          ? <div id="commentBox">
+              <InfoBox
+                content={asset.settings.infoBoxContent}
+                enable={asset.settings.infoBoxEnable}
+              />
+              <QuestionBox
+                content={asset.settings.questionBoxContent}
+                enable={asset.settings.questionBoxEnable}
+              />
+              <RestrictedContent
+                restricted={banned}
+                restrictedComp={
+                  <SuspendedAccount
+                    canEditName={user && user.canEditName}
+                    editName={editName}
+                  />
+                }
+              >
+                {user
+                  ? <CommentBox
+                      addNotification={this.props.addNotification}
+                      postItem={this.props.postItem}
+                      appendItemArray={this.props.appendItemArray}
+                      updateItem={this.props.updateItem}
+                      setCommentCountCache={this.props.setCommentCountCache}
+                      commentCountCache={commentCountCache}
+                      assetId={asset.id}
+                      premod={asset.settings.moderation}
+                      isReply={false}
+                      authorId={user.id}
+                      charCountEnable={asset.settings.charCountEnable}
+                      maxCharCount={asset.settings.charCount}
+                    />
+                  : null}
+              </RestrictedContent>
+            </div>
+          : <p>{asset.settings.closedMessage}</p>}
+        {!loggedIn &&
+          <Button
+            id="coralSignInButton"
+            onClick={this.props.showSignInDialog}
+            full
+          >
+            Sign in to comment
+          </Button>}
+        {loggedIn &&
+          user &&
+          <ChangeUsernameContainer loggedIn={loggedIn} user={user} />}
         {loggedIn && <ModerationLink assetId={asset.id} isAdmin={isAdmin} />}
 
         {/* the highlightedComment is isolated after the user followed a permalink */}
-        {
-          highlightedComment
+        {highlightedComment
           ? <Comment
-            data={this.props.data}
-            root={this.props.root}
-            setActiveReplyBox={this.setActiveReplyBox}
-            activeReplyBox={this.props.activeReplyBox}
-            addNotification={addNotification}
-            depth={0}
-            postItem={this.props.postItem}
-            asset={asset}
-            currentUser={user}
-            highlighted={comment.id}
-            postLike={this.props.postLike}
-            postFlag={this.props.postFlag}
-            postDontAgree={this.props.postDontAgree}
-            loadMore={this.props.loadMore}
-            deleteAction={this.props.deleteAction}
-            showSignInDialog={this.props.showSignInDialog}
-            key={highlightedComment.id}
-            commentIsIgnored={commentIsIgnored}
-            reactKey={highlightedComment.id}
-            comment={highlightedComment}
-            charCountEnable={asset.settings.charCountEnable}
-            maxCharCount={asset.settings.charCount}
-          />
-          : <div>
-            <NewCount
-              commentCount={asset.commentCount}
-              commentCountCache={commentCountCache}
+              data={this.props.data}
+              root={this.props.root}
+              setActiveReplyBox={this.setActiveReplyBox}
+              activeReplyBox={this.props.activeReplyBox}
+              addNotification={addNotification}
+              depth={0}
+              postItem={this.props.postItem}
+              asset={asset}
+              currentUser={user}
+              highlighted={comment.id}
+              postLike={this.props.postLike}
+              postFlag={this.props.postFlag}
+              postDontAgree={this.props.postDontAgree}
               loadMore={this.props.loadMore}
-              firstCommentDate={firstCommentDate}
-              assetId={asset.id}
-              setCommentCountCache={this.props.setCommentCountCache}
+              deleteAction={this.props.deleteAction}
+              showSignInDialog={this.props.showSignInDialog}
+              key={highlightedComment.id}
+              commentIsIgnored={commentIsIgnored}
+              reactKey={highlightedComment.id}
+              comment={highlightedComment}
+              charCountEnable={asset.settings.charCountEnable}
+              maxCharCount={asset.settings.charCount}
+            />
+          : <div>
+              <NewCount
+                commentCount={asset.commentCount}
+                commentCountCache={commentCountCache}
+                loadMore={this.props.loadMore}
+                firstCommentDate={firstCommentDate}
+                assetId={asset.id}
+                setCommentCountCache={this.props.setCommentCountCache}
               />
-            <div className="embed__stream">
-              {
-                comments.map(comment =>
-                  commentIsIgnored(comment)
-                    ? <IgnoredCommentTombstone
-                        key={comment.id}
-                      />
-                    : <Comment
-                        data={this.props.data}
-                        root={this.props.root}
-                        disableReply={!open}
-                        setActiveReplyBox={this.setActiveReplyBox}
-                        activeReplyBox={this.props.activeReplyBox}
-                        addNotification={addNotification}
-                        depth={0}
-                        postItem={postItem}
-                        asset={asset}
-                        currentUser={user}
-                        postLike={postLike}
-                        postFlag={postFlag}
-                        postDontAgree={postDontAgree}
-                        addCommentTag={addCommentTag}
-                        removeCommentTag={removeCommentTag}
-                        ignoreUser={ignoreUser}
-                        commentIsIgnored={commentIsIgnored}
-                        loadMore={loadMore}
-                        deleteAction={deleteAction}
-                        showSignInDialog={showSignInDialog}
-                        key={comment.id}
-                        reactKey={comment.id}
-                        comment={comment}
-                        pluginProps={pluginProps}
-                        charCountEnable={asset.settings.charCountEnable}
-                        maxCharCount={asset.settings.charCount}
-                      />
-                )
-              }
-            </div>
-            <LoadMore
-              topLevel={true}
-              assetId={asset.id}
-              comments={asset.comments}
-              moreComments={hasOlderComments}
-              loadMore={this.props.loadMore} />
-          </div>
-        }
+              <div className="embed__stream">
+                {comments.map(
+                  comment =>
+                    (commentIsIgnored(comment)
+                      ? <IgnoredCommentTombstone key={comment.id} />
+                      : <Comment
+                          data={this.props.data}
+                          root={this.props.root}
+                          disableReply={!open}
+                          setActiveReplyBox={this.setActiveReplyBox}
+                          activeReplyBox={this.props.activeReplyBox}
+                          addNotification={addNotification}
+                          depth={0}
+                          postItem={postItem}
+                          asset={asset}
+                          currentUser={user}
+                          postLike={postLike}
+                          postFlag={postFlag}
+                          postDontAgree={postDontAgree}
+                          addCommentTag={addCommentTag}
+                          removeCommentTag={removeCommentTag}
+                          ignoreUser={ignoreUser}
+                          commentIsIgnored={commentIsIgnored}
+                          loadMore={loadMore}
+                          deleteAction={deleteAction}
+                          showSignInDialog={showSignInDialog}
+                          key={comment.id}
+                          reactKey={comment.id}
+                          comment={comment}
+                          pluginProps={pluginProps}
+                          charCountEnable={asset.settings.charCountEnable}
+                          maxCharCount={asset.settings.charCount}
+                        />)
+                )}
+              </div>
+              <LoadMore
+                topLevel={true}
+                assetId={asset.id}
+                comments={asset.comments}
+                moreComments={hasOlderComments}
+                loadMore={this.props.loadMore}
+              />
+            </div>}
       </div>
     );
   }
@@ -201,7 +209,7 @@ Stream.propTypes = {
   removeCommentTag: PropTypes.func,
 
   // dispatch action to ignore another user
-  ignoreUser: React.PropTypes.func,
+  ignoreUser: React.PropTypes.func
 };
 
 export default Stream;

From 1fea1405ef4bfac74855ca398335add61df26a00 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Wed, 26 Apr 2017 22:34:38 -0300
Subject: [PATCH 03/11] Adding Slots, CommentBox ref

---
 client/coral-plugin-commentbox/CommentBox.js | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/client/coral-plugin-commentbox/CommentBox.js b/client/coral-plugin-commentbox/CommentBox.js
index 6dd2d486f..44017ab52 100644
--- a/client/coral-plugin-commentbox/CommentBox.js
+++ b/client/coral-plugin-commentbox/CommentBox.js
@@ -1,13 +1,14 @@
-import React, {Component, PropTypes} from 'react';
+import React, {PropTypes} from 'react';
+import {Button} from 'coral-ui';
+import {connect} from 'react-redux';
 import {I18n} from '../coral-framework';
 import translations from './translations.json';
-import {Button} from 'coral-ui';
 import Slot from 'coral-framework/components/Slot';
-import {connect} from 'react-redux';
+
 
 const name = 'coral-plugin-commentbox';
 
-class CommentBox extends Component {
+class CommentBox extends React.Component {
 
   constructor(props) {
     super(props);
@@ -151,13 +152,14 @@ class CommentBox extends Component {
             id={isReply ? 'replyText' : 'commentText'}
             onChange={this.handleChange}
             rows={3}/>
+          <Slot fill='commentInputArea' />
         </div>
         <div className={`${name}-char-count ${length > maxCharCount ? `${name}-char-max` : ''}`}>
           {maxCharCount && `${maxCharCount - length} ${lang.t('characters-remaining')}`}
         </div>
         <div className={`${name}-button-container`}>
           <Slot
-            fill="commentBoxDetail"
+            fill="commentInputDetailArea"
             registerHook={this.registerHook}
             unregisterHook={this.unregisterHook}
             inline

From 3dd2da96e896bd588112c09ec74e429a49c5324d Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Wed, 26 Apr 2017 22:35:30 -0300
Subject: [PATCH 04/11] Adding Slots to QuestionBox, ref

---
 client/coral-plugin-questionbox/QuestionBox.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/client/coral-plugin-questionbox/QuestionBox.js b/client/coral-plugin-questionbox/QuestionBox.js
index 31ad45869..3ad439c2a 100644
--- a/client/coral-plugin-questionbox/QuestionBox.js
+++ b/client/coral-plugin-questionbox/QuestionBox.js
@@ -1,5 +1,6 @@
 import React from 'react';
 const packagename = 'coral-plugin-questionbox';
+import Slot from 'coral-framework/components/Slot';
 
 const QuestionBox = ({enable, content}) =>
 <div className={`${packagename}-info ${enable ? null : 'hidden'}` }>
@@ -10,6 +11,7 @@ const QuestionBox = ({enable, content}) =>
   <div className={`${packagename}-content`}>
     {content}
   </div>
+  <Slot fill="streamQuestionArea" />
 </div>;
 
 export default QuestionBox;

From 29e398c51d7e8765f001d4b9d8db25b7f8a396f0 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Wed, 26 Apr 2017 22:37:37 -0300
Subject: [PATCH 05/11] Rename Slot to commentInputDetailArea in Coral Plugin
 Offtopic

---
 plugins/coral-plugin-offtopic/client/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/coral-plugin-offtopic/client/index.js b/plugins/coral-plugin-offtopic/client/index.js
index c006c9a9e..071f37a40 100644
--- a/plugins/coral-plugin-offtopic/client/index.js
+++ b/plugins/coral-plugin-offtopic/client/index.js
@@ -3,7 +3,7 @@ import OffTopicTag from './components/OffTopicTag';
 
 export default {
   slots: {
-    commentBoxDetail: [OffTopicCheckbox],
+    commentInputDetailArea: [OffTopicCheckbox],
     commentInfoBar: [OffTopicTag]
   }
 };

From e0b177d955ca39414bfe65d900ba9480674171fa Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Wed, 26 Apr 2017 23:02:09 -0300
Subject: [PATCH 06/11] Updated slot name

---
 plugins/coral-plugin-respect/client/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/coral-plugin-respect/client/index.js b/plugins/coral-plugin-respect/client/index.js
index a336786d6..e5baccb59 100644
--- a/plugins/coral-plugin-respect/client/index.js
+++ b/plugins/coral-plugin-respect/client/index.js
@@ -2,6 +2,6 @@ import RespectButton from './containers/RespectButton';
 
 export default {
   slots: {
-    commentDetail: [RespectButton],
+    commentActions: [RespectButton],
   }
 };

From 00fe4b7c83c374c37e076e46dfcff8aa94cea03a Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Wed, 26 Apr 2017 23:03:51 -0300
Subject: [PATCH 07/11] =?UTF-8?q?=C3=9Apdating=20slot=20names?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/coral-framework/helpers/plugins.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/coral-framework/helpers/plugins.js b/client/coral-framework/helpers/plugins.js
index df50fdcb7..87ac35975 100644
--- a/client/coral-framework/helpers/plugins.js
+++ b/client/coral-framework/helpers/plugins.js
@@ -44,7 +44,7 @@ function getComponentFragments(components) {
  * Returns an object that can be used to compose fragments or queries.
  *
  * Example:
- * const pluginFragments = getSlotsFragments(['commentInfoBar', 'commentDetail']);
+ * const pluginFragments = getSlotsFragments(['commentInfoBar', 'commentActions']);
  * const rootFragment = gql`
  *   fragment Comment_root on RootQuery {
  +     ${pluginFragments.spreads('root')}

From c60db4104793cc8aa6f0b581bbad572ff704b7eb Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Wed, 26 Apr 2017 23:04:22 -0300
Subject: [PATCH 08/11] Updating slot name

---
 client/coral-embed-stream/src/containers/Comment.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/coral-embed-stream/src/containers/Comment.js b/client/coral-embed-stream/src/containers/Comment.js
index 524f7ec62..6c8a38177 100644
--- a/client/coral-embed-stream/src/containers/Comment.js
+++ b/client/coral-embed-stream/src/containers/Comment.js
@@ -3,7 +3,7 @@ import Comment from '../components/Comment';
 import withFragments from 'coral-framework/hocs/withFragments';
 import {getSlotsFragments} from 'coral-framework/helpers/plugins';
 
-const pluginFragments = getSlotsFragments(['commentInfoBar', 'commentDetail']);
+const pluginFragments = getSlotsFragments(['commentInfoBar', 'commentActions']);
 
 export default withFragments({
   root: gql`

From de6492a26d29f985ced286114f628cdd31300a31 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Wed, 26 Apr 2017 23:06:09 -0300
Subject: [PATCH 09/11] =?UTF-8?q?=C3=81dding=20reactions,=20commentContent?=
 =?UTF-8?q?=20and=20updating=20current=20Slot?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/coral-embed-stream/src/components/Comment.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/client/coral-embed-stream/src/components/Comment.js b/client/coral-embed-stream/src/components/Comment.js
index 4f8426159..7ce143c55 100644
--- a/client/coral-embed-stream/src/components/Comment.js
+++ b/client/coral-embed-stream/src/components/Comment.js
@@ -197,7 +197,9 @@ class Comment extends React.Component {
           }
 
           <Content body={comment.body} />
+          <Slot fill="commentContent" />
           <div className="commentActionsLeft comment__action-container">
+            <Slot fill="commentReactions" inline />
             <ActionButton>
               {/* TODO implmement iPerformedThisAction for the like */}
               <LikeButton
@@ -228,7 +230,7 @@ class Comment extends React.Component {
               </IfUserCanModifyBest>
             </ActionButton>
             <Slot
-              fill="commentDetail"
+              fill="commentActions"
               data={this.props.data}
               root={this.props.root}
               comment={comment}

From 37e093f60ad0a033859d44c4d794a8e2e39d1d19 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Wed, 26 Apr 2017 23:15:40 -0300
Subject: [PATCH 10/11] Linting

---
 client/coral-embed-stream/src/components/Stream.js | 1 -
 client/coral-framework/components/Slot.js          | 2 +-
 client/coral-plugin-commentbox/CommentBox.js       | 1 -
 3 files changed, 1 insertion(+), 3 deletions(-)

diff --git a/client/coral-embed-stream/src/components/Stream.js b/client/coral-embed-stream/src/components/Stream.js
index 50f2800a3..eb30dc16c 100644
--- a/client/coral-embed-stream/src/components/Stream.js
+++ b/client/coral-embed-stream/src/components/Stream.js
@@ -4,7 +4,6 @@ import {Button} from 'coral-ui';
 import LoadMore from './LoadMore';
 import NewCount from './NewCount';
 import Comment from '../containers/Comment';
-import Slot from 'coral-framework/components/Slot';
 import InfoBox from 'coral-plugin-infobox/InfoBox';
 import {ModerationLink} from 'coral-plugin-moderation';
 import CommentBox from 'coral-plugin-commentbox/CommentBox';
diff --git a/client/coral-framework/components/Slot.js b/client/coral-framework/components/Slot.js
index ad4847fcb..8e2dd9502 100644
--- a/client/coral-framework/components/Slot.js
+++ b/client/coral-framework/components/Slot.js
@@ -13,4 +13,4 @@ export default function Slot ({fill, inline = false, ...rest}) {
 
 Slot.propTypes = {
   fill: React.PropTypes.string
-};
\ No newline at end of file
+};
diff --git a/client/coral-plugin-commentbox/CommentBox.js b/client/coral-plugin-commentbox/CommentBox.js
index 44017ab52..5d0906b6e 100644
--- a/client/coral-plugin-commentbox/CommentBox.js
+++ b/client/coral-plugin-commentbox/CommentBox.js
@@ -5,7 +5,6 @@ import {I18n} from '../coral-framework';
 import translations from './translations.json';
 import Slot from 'coral-framework/components/Slot';
 
-
 const name = 'coral-plugin-commentbox';
 
 class CommentBox extends React.Component {

From d14b965f54a162e272279654f18b9702c1191150 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Mon, 1 May 2017 10:46:37 -0300
Subject: [PATCH 11/11] Adding fragment slots

---
 client/coral-embed-stream/src/containers/Comment.js | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/client/coral-embed-stream/src/containers/Comment.js b/client/coral-embed-stream/src/containers/Comment.js
index 6c8a38177..9b48e0809 100644
--- a/client/coral-embed-stream/src/containers/Comment.js
+++ b/client/coral-embed-stream/src/containers/Comment.js
@@ -3,7 +3,15 @@ import Comment from '../components/Comment';
 import withFragments from 'coral-framework/hocs/withFragments';
 import {getSlotsFragments} from 'coral-framework/helpers/plugins';
 
-const pluginFragments = getSlotsFragments(['commentInfoBar', 'commentActions']);
+const pluginFragments = getSlotsFragments([
+  'streamQuestionArea',
+  'commentInputArea',
+  'commentInputDetailArea',
+  'commentInfoBar',
+  'commentActions',
+  'commentContent',
+  'commentReactions'
+]);
 
 export default withFragments({
   root: gql`
@@ -36,5 +44,5 @@ export default withFragments({
       ${pluginFragments.spreads('comment')}
     }
     ${pluginFragments.definitions('comment')}
-  `,
+  `
 })(Comment);