the fragment tree

client/coral-embed-stream/src/tabs/stream/containers/Comment.js

@@ -4,6 +4,8 @@ import Comment from '../components/Comment';
 import { withFragments } from 'coral-framework/hocs';
 import { getSlotFragmentSpreads } from 'coral-framework/utils';
 import { withSetCommentStatus } from 'coral-framework/graphql/mutations';
+import { getDefinitionName } from 'coral-framework/utils';
+import CommentBox from './CommentBox';
 import {
   THREADING_LEVEL,
   REPLY_COMMENTS_LOAD_DEPTH,
@@ -23,6 +25,7 @@ const slots = [
   'commentAuthorTags',
   'commentTimestamp',
   'commentContent',
+  'commentBox',
 ];
 
 /**
@@ -94,7 +97,8 @@ const singleCommentFragment = gql`
       edited
       editableUntil
     }
-    ${getSlotFragmentSpreads(slots, 'comment')}
+    ${getSlotFragmentSpreads(slots, 'comment')}.
+    ...${getDefinitionName(CommentBox.fragments.comment)}
   }
 `;
 

client/coral-embed-stream/src/tabs/stream/containers/CommentBox.js

@@ -1,14 +1,18 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-
+import { gql } from 'react-apollo';
+import { getSlotFragmentSpreads } from 'coral-framework/utils';
+import withFragments from 'coral-framework/hocs/withFragments';
+import { getDefinitionName } from 'coral-framework/utils';
 import t, { timeago } from 'coral-framework/services/i18n';
 import { can } from 'coral-framework/services/perms';
 import { isSuspended } from 'coral-framework/utils/user';
-
+import DraftArea from './DraftArea';
 import Slot from 'coral-framework/components/Slot';
 import { connect } from 'react-redux';
 import { CommentForm } from '../components/CommentForm';
 import { notifyForNewCommentStatus } from '../helpers';
+import { compose } from 'react-apollo';
 
 // TODO: (kiwi) Need to adapt CSS classes post refactor to match the rest.
 export const name = 'talk-commentbox';
@@ -209,8 +213,21 @@ CommentBox.propTypes = {
   tags: PropTypes.array,
 };
 
+const slots = ['commentBox'];
+
 const mapStateToProps = state => ({
   tags: state.stream.commentBoxTags,
 });
 
-export default connect(mapStateToProps, null)(CommentBox);
+export default compose(
+  connect(mapStateToProps, null),
+  withFragments({
+    comment: gql`
+    fragment TalkEmbedStream_CommentBox_comment on Comment {
+      __typename
+      ${getSlotFragmentSpreads(slots, 'comment')}
+      ...${getDefinitionName(DraftArea.fragments.comment)}
+    }
+`,
+  })
+)(CommentBox);