index.js - Create a New Matching Request - Client Side - Tinder Clone

index.js

window.addEventListener("DOMContentLoaded", function () {
  ...
  const authenticatedUser = JSON.parse(localStorage.getItem("auth"));
  if (authenticatedUser) {
    ...
    // main card item.
    const mainCardEmptyMessage = document.getElementById("main__card-empty");
    const mainCardItemContainer = document.getElementById("main__card-item-container");

    // main card actions.
    const mainCardActions = document.getElementById("main__card-actions")
    const dislikeBtn = document.getElementById("dislike");
    const likeBtn = document.getElementById("like");
    ...
    const createMatchRequest = (matchRequestTo, matchRequestReceiver) => {
      if (authenticatedUser && authenticatedUser.uid && authenticatedUser.name && matchRequestTo && matchRequestReceiver) {
        axios.post('/requests/create', {
          matchRequestFrom: authenticatedUser.uid,
          matchRequestSender: authenticatedUser.name,
          matchRequestTo,
          matchRequestReceiver
        }).then(res => { }).catch(error => { });
      }
    }

    const swipeRight = (element) => {
      $(element).addClass('rotate-left').delay(700).fadeOut(1);
      $('.main__card-item').find('.status').remove();
      $(element).append('<div class="status like">Like!</div>');
      $(element).next().removeClass('rotate-left rotate-right').fadeIn(400);
      const matchRequestTo = $(element).attr('data-id');
      const matchRequestReceiver = $(element).attr('data-name');
      createMatchRequest(matchRequestTo, matchRequestReceiver);
      setTimeout(() => {
       shouldHideMainCard();  
      }, 1100)
    };
    ...
    if (likeBtn) {
      likeBtn.addEventListener('click', function () {
        const currentCard = getCurrentCard();
        if (currentCard) {
          swipeRight(currentCard);
          setTimeout(() => {
            shouldHideMainCard();  
           }, 1100);
        } else {
          hideMainCard();
        }
      });
    }
    ...
  }
});