diff --git a/client/coral-embed-stream/src/Comment.js b/client/coral-embed-stream/src/Comment.js index 034c44f6a..9d679473e 100644 --- a/client/coral-embed-stream/src/Comment.js +++ b/client/coral-embed-stream/src/Comment.js @@ -142,7 +142,6 @@ class Comment extends React.Component { ? { setActiveReplyBox(''); - refetch(); }} setActiveReplyBox={setActiveReplyBox} parentId={parentId || comment.id} diff --git a/client/coral-embed-stream/src/Embed.js b/client/coral-embed-stream/src/Embed.js index 8b420836e..a7c4dcb38 100644 --- a/client/coral-embed-stream/src/Embed.js +++ b/client/coral-embed-stream/src/Embed.js @@ -128,7 +128,6 @@ class Embed extends Component { { user ? ({ fragments: commentView }), - props: ({mutate}) => ({ - postItem: ({asset_id, body, parent_id} /* , type */ ) => { - return mutate({ + props: ({ownProps, mutate}) => ({ + postItem: ({asset_id, body, parent_id}) => + mutate({ variables: { asset_id, body, parent_id + }, + optimisticResponse: { + createComment: { + comment: { + user: { + id: ownProps.auth.user.id, + name: ownProps.auth.user.username + }, + created_at: new Date().toISOString(), + body, + parent_id, + asset_id, + action_summaries: [], + tags: [], + status: null, + id: `${Date.now()}_temp_id` + } + } + }, + updateQueries: { + AssetQuery: (oldData, {mutationResult:{data:{createComment:{comment}}}}) => { + + if (oldData.asset.moderation === 'PRE') { + return oldData; + } + + let updatedAsset; + + // If posting a reply + if (parent_id) { + updatedAsset = { + ...oldData, + asset: { + ...oldData.asset, + comments: oldData.asset.comments.map((oldComment) => { + return oldComment.id === parent_id + ? {...oldComment, replies: [...oldComment.replies, comment]} + : oldComment; + }) + } + }; + } else { + + // If posting a top-level comment + updatedAsset = { + ...oldData, + asset: { + ...oldData.asset, + commentCount: oldData.asset.commentCount + 1, + comments: [comment, ...oldData.asset.comments] + } + }; + } + + return updatedAsset; + } } - }); - }}), + }) + }), }); export const postLike = graphql(POST_LIKE, { diff --git a/client/coral-framework/graphql/mutations/postComment.graphql b/client/coral-framework/graphql/mutations/postComment.graphql index 6ce46eaa8..110ab4b4e 100644 --- a/client/coral-framework/graphql/mutations/postComment.graphql +++ b/client/coral-framework/graphql/mutations/postComment.graphql @@ -4,6 +4,10 @@ mutation CreateComment ($asset_id: ID!, $parent_id: ID, $body: String!) { createComment(asset_id:$asset_id, parent_id:$parent_id, body:$body) { comment { ...commentView + replyCount + replies { + ...commentView + } } errors { translation_key