From 83cb23d424f17833d7683536e2c77e06e6fc8fed Mon Sep 17 00:00:00 2001
From: Untone <anton.rewin@gmail.com>
Date: Tue, 23 Jan 2024 17:41:49 +0300
Subject: [PATCH] revert-upvote

---
 src/components/Article/ShoutRatingControl.tsx | 36 ++++++++++++-------
 src/context/reactions.tsx                     |  6 ++--
 2 files changed, 26 insertions(+), 16 deletions(-)

diff --git a/src/components/Article/ShoutRatingControl.tsx b/src/components/Article/ShoutRatingControl.tsx
index e309ac6d..c65d02e4 100644
--- a/src/components/Article/ShoutRatingControl.tsx
+++ b/src/components/Article/ShoutRatingControl.tsx
@@ -26,43 +26,53 @@ export const ShoutRatingControl = (props: ShoutRatingControlProps) => {
 
   const {
     reactionEntities,
-    actions: { createReaction, loadReactionsBy },
+    actions: { createReaction, deleteReaction, loadReactionsBy },
   } = useReactions()
 
+  const [isLoading, setIsLoading] = createSignal(false)
+
   const checkReaction = (reactionKind: ReactionKind) =>
     Object.values(reactionEntities).some(
       (r) =>
         r.kind === reactionKind &&
-        r.created_by.slug === author()?.slug &&
+        r.created_by.id === author()?.id &&
         r.shout.id === props.shout.id &&
         !r.reply_to,
     )
 
   const isUpvoted = createMemo(() => checkReaction(ReactionKind.Like))
-
   const isDownvoted = createMemo(() => checkReaction(ReactionKind.Dislike))
 
   const shoutRatingReactions = createMemo(() =>
     Object.values(reactionEntities).filter(
-      (r) =>
-        [ReactionKind.Like, ReactionKind.Dislike].includes(r.kind) &&
-        r.shout.id === props.shout.id &&
-        !r.reply_to,
+      (r) => ['LIKE', 'DISLIKE'].includes(r.kind) && r.shout.id === props.shout.id && !r.reply_to,
     ),
   )
-  const [isLoading, setIsLoading] = createSignal(false)
+
+  const deleteShoutReaction = async (reactionKind: ReactionKind) => {
+    const reactionToDelete = Object.values(reactionEntities).find(
+      (r) =>
+        r.kind === reactionKind &&
+        r.created_by.id === author()?.id &&
+        r.shout.id === props.shout.id &&
+        !r.reply_to,
+    )
+    return deleteReaction(reactionToDelete.id)
+  }
+
   const handleRatingChange = async (isUpvote: boolean) => {
-    setIsLoading(true)
     requireAuthentication(async () => {
-      try {
+      if (isUpvoted()) {
+        await deleteShoutReaction(ReactionKind.Like)
+      } else if (isDownvoted()) {
+        await deleteShoutReaction(ReactionKind.Dislike)
+      } else {
         await createReaction({
           kind: isUpvote ? ReactionKind.Like : ReactionKind.Dislike,
           shout: props.shout.id,
         })
-      } catch (error) {
-        console.warn(error)
       }
-      setIsLoading(false)
+
       loadShout(props.shout.slug)
       loadReactionsBy({
         by: { shout: props.shout.slug },
diff --git a/src/context/reactions.tsx b/src/context/reactions.tsx
index 8588e413..226c408f 100644
--- a/src/context/reactions.tsx
+++ b/src/context/reactions.tsx
@@ -78,10 +78,10 @@ export const ReactionsProvider = (props: { children: JSX.Element }) => {
     setReactionEntities(changes)
   }
 
-  const deleteReaction = async (id: number): Promise<void> => {
-    const reaction = await apiClient.destroyReaction(id)
+  const deleteReaction = async (reaction_id: number): Promise<void> => {
+    const _reaction = await apiClient.destroyReaction(reaction_id)
     setReactionEntities({
-      [reaction.id]: undefined,
+      [reaction_id]: undefined,
     })
   }