SDK: "@amityco/js-sdk": "^5.1.0"
strong text
Hey Team,
I am currently facing issue with Comment Add and remove Feature.
I am getting inconsistent data and dataUpdated is being fired multiple times with various inconsitent results, and the final result is still wrong.
What do I mean by this?
For example if I like a post,i can see my reaction, but I decide to remove the like from the post, here is what happens:
- i click the button on the post
- it fires the CommentRepository.removeReaction(Id)
- it fires up
dataUpdated
3 times, and the final result will still have my Reaction on it.
And sometimes the data is inconsistent, I still can see my Reactions but the count and reactions array are empty as below
Here is the relevant code I used, this is run in an isolated environment and no re-renders from parents:
useEffect(() => {
collection.current = CommentRepository.queryComments({
referenceType: COMMENT_REFERENCE_TYPE,
referenceId: post.id,
last: currentLimit,
isDeleted: false,
filterByParentId: true,
});
setLoading(collection.current.loadingStatus === 'loading');
collection.current.on('dataUpdated', (data) => {
const curated = data.map(({ myReactions, reactions, reactionsCount }) => ({
myReactions,
reactions,
reactionsCount,
}));
console.log('>>> dataUpdated', curated[0]);
setComments(data); // reload comment table
setHasMore(collection.current.hasMore);
setLoading(false);
});
collection.current.on('dataError', (error) => {
setLoading(false);
if (error.message === 'EkoSDK: Some post not found') return;
console.error('Comment LiveCollections can not query/get/sync data from server', { error });
});
return () => collection.current.dispose();
}, [post, referenced]);
const handleReaction = useCallback(
async (reactionName) => {
setIsProcessing(true);
try {
const addResponse = await CommentRepository.addReaction({
commentId: amityContent.commentId,
reactionName,
});
if (!addResponse) throw new Error('Cannot add Reaction');
setReactionType(reactionName);
} catch (e) {
tracking.trackEvent({... });
} finally {
...
}
},
[isProcessing, amityContent, reactionType]
);
const handleRemoveReaction = useCallback(
async (ev) => {
setIsProcessing(true);
try {
const removeResponse = await CommentRepository.removeReaction({
commentId: amityContent.commentId,
reactionName: reactionType,
});
if (!removeResponse) throw new Error('Cannot remove Reaction');
setReactionType('');
} catch (e) {
tracking.trackEvent({
...
});
} finally {
...
}
}
},
[isProcessing, amityContent, reactionType]
);
Please help provide some insight on this. We are currently blocked by not being able to display the reaction count and my reactions correctly.
Any suggestion or solution is much appreciated.
Thanks