wassname/talk
1
0
Fork 0
mirror of https://github.com/wassname/talk.git synced 2026-07-04 03:03:02 +08:00
Code Issues Packages Projects Releases Wiki Activity

RespectPlugin use fat query

Browse Source
This commit is contained in:
Chi Vinh Le
2017-04-25 19:54:54 +07:00
parent 54ea71bedf
commit 3d10534da1
2 changed files with 62 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plugins/coral-plugin-respect/client/components/RespectButton.js
+5 -5
View File
@@ -12,8 +12,8 @@ const lang = new I18n(translations);
class RespectButton extends Component {
handleClick = () => {
const {postRespect, showSignInDialog, deleteAction, commentId} = this.props;
const {me, comment} = this.props.data;
const {postRespect, showSignInDialog, deleteAction} = this.props;
const {root: {me}, comment} = this.props;
const myRespectActionSummary = getMyActionSummary('RespectActionSummary', comment);
@@ -29,17 +29,17 @@ class RespectButton extends Component {
}
if (myRespectActionSummary) {
deleteAction(myRespectActionSummary.current_user.id);
deleteAction(myRespectActionSummary.current_user.id, comment.id);
} else {
postRespect({
item_id: commentId,
item_id: comment.id,
item_type: 'COMMENTS'
});
}
}
render() {
const {comment} = this.props.data;
const {comment} = this.props;
if (!comment) {
return null;
plugins/coral-plugin-respect/client/containers/RespectButton.js
+57 -77
View File
@@ -6,33 +6,22 @@ import withFragments from 'coral-framework/hocs/withFragments';
import {showSignInDialog} from 'coral-framework/actions/auth';
import RespectButton from '../components/RespectButton';
// TODO: use `update` instead of `updateQueries` for optimistic mutations.
// See https://dev-blog.apollodata.com/apollo-clients-new-imperative-store-api-6cb69318a1e3
// and https://github.com/apollographql/apollo-client/issues/1224
const isRespectAction = (a) => a.__typename === 'RespectActionSummary';
export const RESPECT_QUERY = gql`
query RespectQuery($commentId: ID!) {
comment(id: $commentId) {
id
action_summaries {
... on RespectActionSummary {
count
current_user {
id
}
const COMMENT_FRAGMENT = gql`
fragment RespectButton_comment on Comment {
id
action_summaries {
... on RespectActionSummary {
count
current_user {
id
}
}
}
me {
status
}
}
`;
const withQuery = graphql(RESPECT_QUERY);
const withDeleteAction = graphql(gql`
mutation deleteAction($id: ID!) {
deleteAction(id:$id) {
@@ -43,7 +32,7 @@ const withDeleteAction = graphql(gql`
}
`, {
props: ({mutate}) => ({
deleteAction: (id) => {
deleteAction: (id, commentId) => {
return mutate({
variables: {id},
optimisticResponse: {
@@ -52,27 +41,26 @@ const withDeleteAction = graphql(gql`
errors: null,
}
},
updateQueries: {
RespectQuery: (prev) => {
const action_summaries = prev.comment.action_summaries;
const idx = action_summaries.findIndex(isRespectAction);
if (idx < 0 || get(action_summaries[idx], 'current_user.id') !== id) {
return prev;
}
const next = {
...prev,
comment: {
...prev.comment,
action_summaries: action_summaries.map(
(a, i) => i !== idx ? a : ({
...a,
count: a.count - 1,
current_user: null,
})),
}
};
return next;
},
update: (proxy) => {
const fragmentId = `Comment_${commentId}`;
// Read the data from our cache for this query.
const data = proxy.readFragment({fragment: COMMENT_FRAGMENT, id: fragmentId});
// Check whether we respected this comment.
const idx = data.action_summaries.findIndex(isRespectAction);
if (idx < 0 || get(data.action_summaries[idx], 'current_user.id') !== id) {
return;
}
data.action_summaries[idx] = {
...data.action_summaries[idx],
count: data.action_summaries[idx].count - 1,
current_user: null,
};
// Write our data back to the cache.
proxy.writeFragment({fragment: COMMENT_FRAGMENT, id: fragmentId, data});
},
});
},
@@ -105,46 +93,39 @@ const withPostRespect = graphql(gql`
},
}
},
updateQueries: {
RespectQuery: (prev, {mutationResult, queryVariables}) => {
if (queryVariables.commentId !== respect.item_id) {
return prev;
}
update: (proxy, mutationResult) => {
const fragmentId = `Comment_${respect.item_id}`;
let action_summaries = prev.comment.action_summaries;
let idx = action_summaries.findIndex(isRespectAction);
// Read the data from our cache for this query.
const data = proxy.readFragment({fragment: COMMENT_FRAGMENT, id: fragmentId});
// Check whether we already respected this comment.
if (idx >= 0 && action_summaries[idx].current_user) {
return prev;
}
// Add our comment from the mutation to the end.
let idx = data.action_summaries.findIndex(isRespectAction);
if (idx < 0) {
// Check whether we already respected this comment.
if (idx >= 0 && data.action_summaries[idx].current_user) {
return;
}
// Add initial action when it doesn't exist.
action_summaries = action_summaries.concat([{
__typename: 'RespectActionSummary',
count: 0,
current_user: null,
}]);
idx = action_summaries.length - 1;
}
if (idx < 0) {
const respectAction = mutationResult.data.createRespect.respect;
const next = {
...prev,
comment: {
...prev.comment,
action_summaries: action_summaries.map(
(a, i) => i !== idx ? a : ({
...a,
count: a.count + 1,
current_user: respectAction,
})),
}
};
return next;
},
// Add initial action when it doesn't exist.
data.action_summaries.push({
__typename: 'RespectActionSummary',
count: 0,
current_user: null,
});
idx = data.action_summaries.length - 1;
}
data.action_summaries[idx] = {
...data.action_summaries[idx],
count: data.action_summaries[idx].count + 1,
current_user: mutationResult.data.createRespect.respect,
};
// Write our data back to the cache.
proxy.writeFragment({fragment: COMMENT_FRAGMENT, id: fragmentId, data});
},
});
},
@@ -178,7 +159,6 @@ const enhance = compose(
connect(null, mapDispatchToProps),
withDeleteAction,
withPostRespect,
withQuery,
);
export default enhance(RespectButton);