diff --git a/client/coral-embed-stream/src/tabs/stream/containers/Comment.js b/client/coral-embed-stream/src/tabs/stream/containers/Comment.js index 90cded652..ea0fd33e4 100644 --- a/client/coral-embed-stream/src/tabs/stream/containers/Comment.js +++ b/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)} } `; diff --git a/client/coral-embed-stream/src/tabs/stream/containers/CommentBox.js b/client/coral-embed-stream/src/tabs/stream/containers/CommentBox.js index bf9e55b57..17459fe49 100644 --- a/client/coral-embed-stream/src/tabs/stream/containers/CommentBox.js +++ b/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);