Refactor plugin

This commit is contained in:
Chi Vinh Le
2017-04-06 19:26:29 +07:00
parent b64e46c007
commit 5cb9fdccf9
4 changed files with 3 additions and 180 deletions
@@ -2,19 +2,13 @@ import React from 'react';
import styles from './style.css';
import Icon from './Icon';
import {compose, gql, graphql} from 'react-apollo';
import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
import {I18n} from 'coral-framework';
import get from 'lodash/get';
import cn from 'classnames';
import translations from '../translations.json';
const lang = new I18n(translations);
import {showSignInDialog} from 'coral-framework/actions/auth';
class RespectButton extends React.Component {
export default class RespectButton extends React.Component {
static slot = 'Comment.Detail';
@@ -67,150 +61,3 @@ class RespectButton extends React.Component {
}
}
const COMMENT_QUERY = gql`
query CommentQuery($commentId: ID!) {
comment(id: $commentId) {
id
action_summaries {
... on RespectActionSummary {
count
current_user {
id
}
}
}
}
me {
status
}
}
`;
const withQuery = graphql(COMMENT_QUERY);
const withDeleteAction = graphql(gql`
mutation deleteAction($id: ID!) {
deleteAction(id:$id) {
errors {
translation_key
}
}
}
`, {
options: (props) => ({
refetchQueries: [
{
query: COMMENT_QUERY,
variables: {
commentId: props.commentId,
},
},
],
}),
props: ({mutate}) => ({
deleteAction: (id) => {
return mutate({
variables: {id},
optimisticResponse: {
deleteAction: {
__typename: 'DeleteActionResponse',
errors: null,
}
},
updateQueries: {
CommentQuery: (prev) => {
if (get(prev, 'comment.action_summaries.0.current_user.id') !== id) {
return prev;
}
const next = {
...prev,
comment: {
...prev.comment,
action_summaries: [{
__typename: 'RespectActionSummary',
count: prev.comment.action_summaries[0].count - 1,
current_user: null,
}],
}
};
return next;
},
},
},
);
}}),
});
const withPostRespect = graphql(gql`
mutation createRespect($respect: CreateRespectInput!) {
createRespect(respect: $respect) {
respect {
id
}
errors {
translation_key
}
}
}
`, {
options: (props) => ({
refetchQueries: [
{
query: COMMENT_QUERY,
variables: {
commentId: props.commentId,
},
},
],
}),
props: ({mutate}) => ({
postRespect: (respect) => {
return mutate({
variables: {respect},
optimisticResponse: {
createRespect: {
__typename: 'CreateRespectResponse',
errors: null,
respect: {
__typename: 'RespectAction',
id: 'pending',
},
}
},
updateQueries: {
CommentQuery: (prev, {mutationResult, queryVariables}) => {
if (queryVariables.commentId !== respect.item_id) {
return prev;
}
const respectAction = mutationResult.data.createRespect.respect;
const count = prev.action_summaries ? prev.action_summaries.count : 0;
const next = {
...prev,
comment: {
...prev.comment,
action_summaries: [{
__typename: 'RespectActionSummary',
count: count + 1,
current_user: respectAction,
}],
}
};
return next;
},
},
});
}})
});
const mapDispatchToProps = dispatch =>
bindActionCreators({showSignInDialog}, dispatch);
const enhance = compose(
connect(null, mapDispatchToProps),
withDeleteAction,
withPostRespect,
withQuery,
);
export default enhance(RespectButton);