JQuery не отражает точные значения

Я внедрил кнопку like с помощью jQuery в свой проект django. Все работает, за исключением того, что счетчик лайков не отображается должным образом

Пример:

Пользователь заходит на страницу, где пост не понравился

Пользователю нравится сообщение:

API запрос:

Пользователь затем не любит пост:

Вы видите, что лайки правильно отправляются в БД, но счетчик лайков обратный. Я потратил кучу времени на это, но до сих пор не могу понять почему.

view:

class PostLikeAPIToggle(APIView):
    authentication_classes = (authentication.SessionAuthentication,)
    permission_classes = (permissions.IsAuthenticated,)

    def get(self, request, pk=None, format=None):
        # slug = self.kwargs.get("slug")
        obj = get_object_or_404(Post, pk=pk)
        url_ = obj.get_absolute_url()
        user = self.request.user
        updated = False
        liked = False
        counts=obj.likes.count()
        if user.is_authenticated:
            if user in obj.likes.all():
                liked = False
                obj.likes.remove(user)
            else:
                liked = True
                obj.likes.add(user)
            updated = True
        data = {
            "updated": updated,
            "liked": liked,
            "likescount": counts
        }
        return Response(data)

jQuery:

<script>
    $(document).ready(function(){
         function updateText(btn, newCount, verb){
         btn.text(newCount + " " + verb)
     }

     $(".like-btn").click(function(e){
       e.preventDefault()
       var this_ = $(this)
       var likeUrl = this_.attr("data-href")
       var likeCount = parseInt(this_.attr("data-likes")) | 0
       var addLike = likeCount + 1
       var removeLike = likeCount - 1
       if (likeUrl){
          $.ajax({
           url: likeUrl,
           method: "GET",
           data: {},
           success: function(data){
             console.log(data)
             var newLikes;
             if (data.liked){
                  updateText(this_, data.likescount, "")
                  $(".like-btn").prepend("<i></i>");
                  $( "i" ).addClass( "fa fa-heart-o liked-heart" );
                                    
                        
              } else {
                  updateText(this_, data.likescount, "")
                  $(".like-btn").prepend("<i></i>");   
                  $( "i" ).addClass( "fa fa-heart-o unliked-heart" );    

              }
           }, error: function(error){
             console.log(error)
             console.log("error")
           }
         })
       }       
     })
 })
</script>  

like btn:

<a class="like-btn" data-href='{{ post.get_api_like_url }}' data-likes="{{ post.likes.count }}" href="{{ post.get_like_url }}"><i class="{% if userliked %}fa fa-heart-o liked-heart{% else %}fa fa-heart-o unliked-heart{% endif %}" aria-hidden="true"></i>{{ post.likes.count }}</a>

Вернуться на верх