Corp/backend/static/js/components/feedLikes.js

/**
 * feedLikes.js
 * Обработка лайков в карточках постов ленты
 */

(function() {
  'use strict';

  /**
   * Получение CSRF токена из cookie
   */
  function getCookie(name) {
    const cookies = document.cookie.split(';');
    for (let cookie of cookies) {
      const [cookieName, value] = cookie.trim().split('=');
      if (cookieName === name) {
        return decodeURIComponent(value);
      }
    }
    return null;
  }

  /**
   * Переключение лайка
   */
  async function toggleLike(postId, button) {
    const csrfToken = getCookie('csrftoken');
    if (!csrfToken) {
      alert('Необходимо авторизоваться');
      return;
    }

    const icon = button.querySelector('i');
    const countSpan = button.querySelector('.like-count');
    const isLiked = button.dataset.liked === 'true';
    const endpoint = isLiked ? 'unlike' : 'like';

    // Оптимистичное обновление UI
    button.disabled = true;

    try {
      const response = await fetch(`/api/v1/posts/${postId}/${endpoint}/`, {
        method: 'POST',
        headers: {
          'X-CSRFToken': csrfToken,
          'Content-Type': 'application/json',
          'X-Requested-With': 'XMLHttpRequest'
        }
      });

      if (response.ok) {
        const data = await response.json();
        
        // Обновляем иконку и счетчик
        if (isLiked) {
          icon.classList.remove('bi-heart-fill', 'text-danger');
          icon.classList.add('bi-heart');
          button.dataset.liked = 'false';
        } else {
          icon.classList.remove('bi-heart');
          icon.classList.add('bi-heart-fill', 'text-danger');
          button.dataset.liked = 'true';
        }

        // Обновляем счетчик
        if (countSpan) {
          countSpan.textContent = data.likes_count || 0;
        }
      } else {
        alert('Ошибка при обработке лайка');
      }
    } catch (error) {
      console.error('Ошибка:', error);
      alert('Ошибка сети');
    } finally {
      button.disabled = false;
    }
  }

  /**
   * Инициализация обработчиков лайков
   */
  function initFeedLikes() {
    // Используем делегирование событий
    document.addEventListener('click', function(e) {
      const likeBtn = e.target.closest('.like-btn-card');
      if (likeBtn) {
        e.preventDefault();
        e.stopPropagation(); // Чтобы не сработал клик по карточке
        const postId = likeBtn.dataset.postId;
        if (postId) {
          toggleLike(postId, likeBtn);
        }
      }
    });
  }

  // Инициализация при загрузке DOM
  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', initFeedLikes);
  } else {
    initFeedLikes();
  }

})();