diff --git a/client/coral-admin/src/routes/Moderation/containers/Indicator.js b/client/coral-admin/src/routes/Moderation/containers/Indicator.js index d4fe22851..7df710f2f 100644 --- a/client/coral-admin/src/routes/Moderation/containers/Indicator.js +++ b/client/coral-admin/src/routes/Moderation/containers/Indicator.js @@ -7,10 +7,15 @@ import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import withQueueConfig from '../hoc/withQueueConfig'; import baseQueueConfig from '../queueConfig'; +import Slot from 'coral-framework/components/Slot'; class IndicatorContainer extends Component { subscriptions = []; + handleCommentChange = (root, comment) => { + return handleIndicatorChange(root, comment, this.props.queueConfig); + }; + subscribeToUpdates() { const parameters = [ { @@ -19,7 +24,7 @@ class IndicatorContainer extends Component { prev, { subscriptionData: { data: { commentAdded: comment } } } ) => { - return handleIndicatorChange(prev, comment, this.props.queueConfig); + return this.handleCommentChange(prev, comment); }, }, { @@ -28,7 +33,7 @@ class IndicatorContainer extends Component { prev, { subscriptionData: { data: { commentFlagged: comment } } } ) => { - return handleIndicatorChange(prev, comment, this.props.queueConfig); + return this.handleCommentChange(prev, comment); }, }, { @@ -37,25 +42,25 @@ class IndicatorContainer extends Component { prev, { subscriptionData: { data: { commentAccepted: comment } } } ) => { - return handleIndicatorChange(prev, comment, this.props.queueConfig); + return this.handleCommentChange(prev, comment); }, }, { document: COMMENT_REJECTED_SUBSCRIPTION, updateQuery: ( prev, - { subscriptionData: { data: { commentRejected: { comment } } } } + { subscriptionData: { data: { commentRejected: comment } } } ) => { - return handleIndicatorChange(prev, comment, this.props.queueConfig); + return this.handleCommentChange(prev, comment); }, }, { document: COMMENT_RESET_SUBSCRIPTION, updateQuery: ( prev, - { subscriptionData: { data: { commentReset: { comment } } } } + { subscriptionData: { data: { commentReset: comment } } } ) => { - return handleIndicatorChange(prev, comment, this.props.queueConfig); + return this.handleCommentChange(prev, comment); }, }, ]; @@ -97,7 +102,16 @@ class IndicatorContainer extends Component { return null; } - return ; + return ( + + + + + ); } } @@ -146,7 +160,7 @@ const COMMENT_FLAGGED_SUBSCRIPTION = gql` const COMMENT_ACCEPTED_SUBSCRIPTION = gql` subscription TalkAdmin_ModerationIndicator_CommentAccepted { - commentAccepted{ + commentAccepted { ${fields} } } @@ -154,7 +168,7 @@ const COMMENT_ACCEPTED_SUBSCRIPTION = gql` const COMMENT_REJECTED_SUBSCRIPTION = gql` subscription TalkAdmin_ModerationIndicator_CommentRejected { - commentRejected{ + commentRejected { ${fields} } } diff --git a/plugins/talk-plugin-featured-comments/client/containers/ModIndicatorSubscription.js b/plugins/talk-plugin-featured-comments/client/containers/ModIndicatorSubscription.js new file mode 100644 index 000000000..53af12eb4 --- /dev/null +++ b/plugins/talk-plugin-featured-comments/client/containers/ModIndicatorSubscription.js @@ -0,0 +1,94 @@ +import React from 'react'; +import { gql } from 'react-apollo'; + +class ModIndicatorSubscription extends React.Component { + subscriptions = null; + + componentWillMount() { + const configs = [ + { + document: COMMENT_FEATURED_SUBSCRIPTION, + updateQuery: ( + prev, + { subscriptionData: { data: { commentFeatured: { comment } } } } + ) => { + return this.props.handleCommentChange(prev, comment); + }, + }, + { + document: COMMENT_UNFEATURED_SUBSCRIPTION, + updateQuery: ( + prev, + { subscriptionData: { data: { commentUnfeatured: { comment } } } } + ) => { + return this.props.handleCommentChange(prev, comment); + }, + }, + ]; + this.subscriptions = configs.map(config => + this.props.data.subscribeToMore(config) + ); + } + + componentWillUnmount() { + this.subscriptions.forEach(unsubscribe => unsubscribe()); + } + + render() { + return null; + } +} + +const COMMENT_FEATURED_SUBSCRIPTION = gql` + subscription TalkFeaturedComments_Indicator_CommentFeatured { + commentFeatured { + comment { + status + actions { + __typename + ... on FlagAction { + reason + } + user { + id + role + } + } + status_history { + type + assigned_by { + id + } + } + } + } + } +`; + +const COMMENT_UNFEATURED_SUBSCRIPTION = gql` + subscription TalkFeaturedComments_Indicator_CommentUnfeatured { + commentUnfeatured { + comment { + status + actions { + __typename + ... on FlagAction { + reason + } + user { + id + role + } + } + status_history { + type + assigned_by { + id + } + } + } + } + } +`; + +export default ModIndicatorSubscription; diff --git a/plugins/talk-plugin-featured-comments/client/index.js b/plugins/talk-plugin-featured-comments/client/index.js index 1f0bac704..2572a54f4 100644 --- a/plugins/talk-plugin-featured-comments/client/index.js +++ b/plugins/talk-plugin-featured-comments/client/index.js @@ -6,6 +6,7 @@ import update from 'immutability-helper'; import ModTag from './containers/ModTag'; import ModActionButton from './containers/ModActionButton'; import ModSubscription from './containers/ModSubscription'; +import ModIndicatorSubscription from './containers/ModIndicatorSubscription'; import FeaturedDialog from './containers/FeaturedDialog'; import { gql } from 'react-apollo'; import reducer from './reducer'; @@ -23,6 +24,7 @@ export default { moderationActions: [ModActionButton], adminModeration: [ModSubscription, FeaturedDialog], adminCommentInfoBar: [ModTag], + adminModerationIndicator: [ModIndicatorSubscription], }, mutations: { IgnoreUser: ({ variables }) => ({ diff --git a/plugins/talk-plugin-featured-comments/index.js b/plugins/talk-plugin-featured-comments/index.js index f5a9c8ae5..6dd3114e1 100644 --- a/plugins/talk-plugin-featured-comments/index.js +++ b/plugins/talk-plugin-featured-comments/index.js @@ -36,7 +36,7 @@ module.exports = { commentFeatured: (options, args) => ({ commentFeatured: { filter: ({ comment }, { user }) => { - if (args.asset_id === null) { + if (!args.asset_id) { return check(user, ['ADMIN', 'MODERATOR']); } return comment.asset_id === args.asset_id; @@ -46,7 +46,7 @@ module.exports = { commentUnfeatured: (options, args) => ({ commentUnfeatured: { filter: ({ comment }, { user }) => { - if (args.asset_id === null) { + if (!args.asset_id) { return check(user, ['ADMIN', 'MODERATOR']); } return comment.asset_id === args.asset_id;