diff --git a/plugins/talk-plugin-featured-comments/client/components/TabPane.js b/plugins/talk-plugin-featured-comments/client/components/TabPane.js index 63766b7ce..3eecfad70 100644 --- a/plugins/talk-plugin-featured-comments/client/components/TabPane.js +++ b/plugins/talk-plugin-featured-comments/client/components/TabPane.js @@ -1,5 +1,5 @@ import React from 'react'; -import FeaturedComment from './FeaturedComment'; +import FeaturedComment from '../containers/FeaturedComment'; export default ({root, data, asset: {featuredComments, ...asset}, viewComment}) => (
diff --git a/plugins/talk-plugin-featured-comments/client/containers/FeaturedComment.js b/plugins/talk-plugin-featured-comments/client/containers/FeaturedComment.js new file mode 100644 index 000000000..6a2013269 --- /dev/null +++ b/plugins/talk-plugin-featured-comments/client/containers/FeaturedComment.js @@ -0,0 +1,41 @@ +import {gql} from 'react-apollo'; +import FeaturedComment from '../components/FeaturedComment'; +import {withFragments} from 'plugin-api/beta/client/hocs'; +import {getSlotFragmentSpreads} from 'plugin-api/beta/client/utils'; + +const slots = [ + 'commentReactions', +]; + +export default withFragments({ + root: gql` + fragment TalkFeaturedComments_Comment_root on RootQuery { + __typename + ${getSlotFragmentSpreads(slots, 'root')} + } + `, + asset: gql` + fragment TalkFeaturedComments_Comment_asset on Asset { + __typename + ${getSlotFragmentSpreads(slots, 'asset')} + } + `, + comment: gql` + fragment TalkFeaturedComments_Comment_comment on Comment { + id + body + created_at + replyCount + tags { + tag { + name + } + } + user { + id + username + } + ${getSlotFragmentSpreads(slots, 'comment')} + } + ` +})(FeaturedComment); diff --git a/plugins/talk-plugin-featured-comments/client/containers/TabPane.js b/plugins/talk-plugin-featured-comments/client/containers/TabPane.js index 10f407588..2b4894c7d 100644 --- a/plugins/talk-plugin-featured-comments/client/containers/TabPane.js +++ b/plugins/talk-plugin-featured-comments/client/containers/TabPane.js @@ -3,14 +3,11 @@ import {bindActionCreators} from 'redux'; import {compose, gql} from 'react-apollo'; import TabPane from '../components/TabPane'; import {withFragments} from 'plugin-api/beta/client/hocs'; -import {getSlotFragmentSpreads} from 'plugin-api/beta/client/utils'; +import FeaturedComment from '../containers/FeaturedComment'; +import {getDefinitionName} from 'coral-framework/utils'; import {viewComment} from 'coral-embed-stream/src/actions/stream'; -const slots = [ - 'commentReactions', -]; - const mapDispatchToProps = (dispatch) => bindActionCreators({ viewComment, @@ -22,32 +19,25 @@ const enhance = compose( root: gql` fragment TalkFeaturedComments_TabPane_root on RootQuery { __typename - ${getSlotFragmentSpreads(slots, 'root')} + ...${getDefinitionName(FeaturedComment.fragments.root)} } + ${FeaturedComment.fragments.root} `, asset: gql` fragment TalkFeaturedComments_TabPane_asset on Asset { id featuredComments: comments(tags: ["FEATURED"], excludeIgnored: $excludeIgnored, deep: true) { nodes { - id - body - created_at - replyCount - tags { - tag { - name - } - } - user { - id - username - } - ${getSlotFragmentSpreads(slots, 'comment')} + ...${getDefinitionName(FeaturedComment.fragments.comment)} } + hasNextPage + startCursor + endCursor } - ${getSlotFragmentSpreads(slots, 'asset')} + ...${getDefinitionName(FeaturedComment.fragments.asset)} } + ${FeaturedComment.fragments.comment} + ${FeaturedComment.fragments.asset} `, }), );