From 5e2fa72466bfe44c7b1dbffdbfff97a22b104605 Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Wed, 24 May 2017 22:05:41 +0700 Subject: [PATCH] Support extendable queries --- .../routes/Moderation/components/Comment.js | 32 +++++++++-- .../Moderation/components/Moderation.js | 2 + .../Moderation/components/ModerationQueue.js | 4 +- .../Moderation/components/UserDetail.js | 7 ++- .../routes/Moderation/containers/Comment.js | 56 +++++++++++++++++++ .../Moderation/containers/Moderation.js | 52 ++++------------- .../Moderation/containers/UserDetail.js | 9 +++ 7 files changed, 112 insertions(+), 50 deletions(-) create mode 100644 client/coral-admin/src/routes/Moderation/containers/Comment.js diff --git a/client/coral-admin/src/routes/Moderation/components/Comment.js b/client/coral-admin/src/routes/Moderation/components/Comment.js index 6246dd5b9..c2b6b39f4 100644 --- a/client/coral-admin/src/routes/Moderation/components/Comment.js +++ b/client/coral-admin/src/routes/Moderation/components/Comment.js @@ -42,8 +42,8 @@ const Comment = ({ } // since words are checked against word boundaries on the backend, - // this should be the behavior on the front end as well. - // currently the highlighter plugin does not support this out of the box. + // should be the behavior on the front end as well. + // currently the highlighter plugin does not support out of the box. const searchWords = [...suspectWords, ...bannedWords] .filter((w) => { return new RegExp(`(^|\\s)${w}(\\s|$)`).test(comment.body); @@ -88,7 +88,12 @@ const Comment = ({ {lang.t('comment.banned_user')} : null} - +
Story: {comment.asset.title} @@ -110,7 +115,12 @@ const Comment = ({ {lang.t('comment.view_context')}

- +
{links ? @@ -141,12 +151,22 @@ const Comment = ({ ); })}
- +
- +
{flagActions && flagActions.length ? { const status = comment.action_summaries ? 'FLAGGED' : comment.status; return {user.username} {profile && this.profile = ref} value={profile} />} - +

Member since {new Date(user.created_at).toLocaleString()}


diff --git a/client/coral-admin/src/routes/Moderation/containers/Comment.js b/client/coral-admin/src/routes/Moderation/containers/Comment.js new file mode 100644 index 000000000..d85b90253 --- /dev/null +++ b/client/coral-admin/src/routes/Moderation/containers/Comment.js @@ -0,0 +1,56 @@ +import {gql} from 'react-apollo'; +import Comment from '../components/Comment'; +import {getSlotsFragments} from 'coral-framework/helpers/plugins'; +import withFragments from 'coral-framework/hocs/withFragments'; + +const pluginFragments = getSlotsFragments([ + 'adminCommentInfoBar', + 'adminCommentContent', + 'adminSideActions', + 'adminCommentDetailArea', +]); + +export default withFragments({ + root: gql` + fragment Comment_root on RootQuery { + __typename + ${pluginFragments.spreads('root')} + } + ${pluginFragments.definitions('root')} + `, + comment: gql` + fragment Comment_comment on Comment { + id + body + created_at + status + user { + id + name: username + status + } + asset { + id + title + url + } + action_summaries { + count + ... on FlagActionSummary { + reason + } + } + actions { + ... on FlagAction { + reason + message + user { + username + } + } + } + ${pluginFragments.spreads('comment')} + } + ${pluginFragments.definitions('comment')} + ` +})(Comment); diff --git a/client/coral-admin/src/routes/Moderation/containers/Moderation.js b/client/coral-admin/src/routes/Moderation/containers/Moderation.js index 4d831c841..e0e8f7694 100644 --- a/client/coral-admin/src/routes/Moderation/containers/Moderation.js +++ b/client/coral-admin/src/routes/Moderation/containers/Moderation.js @@ -4,6 +4,7 @@ import {bindActionCreators} from 'redux'; import {compose, gql} from 'react-apollo'; import isEqual from 'lodash/isEqual'; import withQuery from 'coral-framework/hocs/withQuery'; +import {getDefinitionName} from 'coral-framework/utils'; import {banUser, setCommentStatus, suspendUser} from '../../../graphql/mutations'; @@ -24,6 +25,7 @@ import { import {Spinner} from 'coral-ui'; import Moderation from '../components/Moderation'; +import Comment from './Comment'; class ModerationContainer extends Component { componentWillMount() { @@ -92,44 +94,10 @@ class ModerationContainer extends Component { } } -const commentView = gql` - fragment commentView on Comment { - id - body - created_at - status - user { - id - name: username - status - } - asset { - id - title - url - } - action_summaries { - count - ... on FlagActionSummary { - reason - } - } - actions { - ... on FlagAction { - reason - message - user { - username - } - } - } - } -`; - const LOAD_MORE_QUERY = gql` query LoadMoreModQueue($limit: Int = 10, $cursor: Date, $sort: SORT_ORDER, $asset_id: ID, $statuses:[COMMENT_STATUS!], $action_type: ACTION_TYPE) { comments(query: {limit: $limit, cursor: $cursor, asset_id: $asset_id, statuses: $statuses, sort: $sort, action_type: $action_type}) { - ...commentView + ...${getDefinitionName(Comment.fragments.comment)} action_summaries { count ... on FlagActionSummary { @@ -138,7 +106,7 @@ const LOAD_MORE_QUERY = gql` } } } - ${commentView} + ${Comment.fragments.comment} `; const withModQueueQuery = withQuery(gql` @@ -148,21 +116,21 @@ const withModQueueQuery = withQuery(gql` asset_id: $asset_id, sort: $sort }) { - ...commentView + ...${getDefinitionName(Comment.fragments.comment)} } accepted: comments(query: { statuses: [ACCEPTED], asset_id: $asset_id, sort: $sort }) { - ...commentView + ...${getDefinitionName(Comment.fragments.comment)} } premod: comments(query: { statuses: [PREMOD], asset_id: $asset_id, sort: $sort }) { - ...commentView + ...${getDefinitionName(Comment.fragments.comment)} } flagged: comments(query: { action_type: FLAG, @@ -170,14 +138,14 @@ const withModQueueQuery = withQuery(gql` statuses: [NONE, PREMOD], sort: $sort }) { - ...commentView + ...${getDefinitionName(Comment.fragments.comment)} } rejected: comments(query: { statuses: [REJECTED], asset_id: $asset_id, sort: $sort }) { - ...commentView + ...${getDefinitionName(Comment.fragments.comment)} } assets: assets { id @@ -208,7 +176,7 @@ const withModQueueQuery = withQuery(gql` organizationName } } - ${commentView} + ${Comment.fragments.comment} `, { options: ({params: {id = null}, moderation: {sortOrder}}) => { return { diff --git a/client/coral-admin/src/routes/Moderation/containers/UserDetail.js b/client/coral-admin/src/routes/Moderation/containers/UserDetail.js index d1f43716c..acc129074 100644 --- a/client/coral-admin/src/routes/Moderation/containers/UserDetail.js +++ b/client/coral-admin/src/routes/Moderation/containers/UserDetail.js @@ -2,6 +2,11 @@ import React, {PropTypes} from 'react'; import {compose, gql} from 'react-apollo'; import UserDetail from '../components/UserDetail'; import withQuery from 'coral-framework/hocs/withQuery'; +import {getSlotsFragments} from 'coral-framework/helpers/plugins'; + +const pluginFragments = getSlotsFragments([ + 'userProfile', +]); class UserDetailContainer extends React.Component { static propTypes = { @@ -28,10 +33,14 @@ export const withUserDetailQuery = withQuery(gql` id provider } + ${pluginFragments.spreads('user')} } totalComments: commentCount(query: {author_id: $author_id}) rejectedComments: commentCount(query: {author_id: $author_id, statuses: [REJECTED]}) + ${pluginFragments.spreads('root')} } + ${pluginFragments.definitions('user')} + ${pluginFragments.definitions('root')} `, { options: ({id}) => { return {