Проблема приложения чат не может нажать на цель дважды - javascript

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

здесь application.js

let currentRecipient = '';
let chatInput = $('#chat-input');
let chatButton = $('#btn-send');
let userList = $('#user-list');
let messageList = $('#messages');

function updateUserList() {
    $.getJSON('api/v1/user/', function (data) {
        userList.children('.user').remove();
        for (let i = 0; i < data.length; i++) {
            const userItem = `
                <a class="friends-list">
                    <div class="friends-img">
                        <div class="sameline">
                            <img alt="avatarchat" src="${data[i].profile.image}" style="object-fit: cover;width: 40px;height: 40px;border-radius: 50px;border: 2px solid;">
                            <a class="list-group-item user">${data[i]['username']}</a>
                        </div>    
                    </div>
                </a>
            `;
            $(userItem).appendTo('#user-list');
        }
        $('.user').click(function () {
            userList.children('.active').removeClass('active');
            let selected = event.target;
            $(selected).addClass('active');
            setCurrentRecipient(selected.text);
        });
    });
}

function drawMessage(message) {
    let position = 'in';
    const date = new Date(message.timestamp);
    if (message.user === currentUser) position = 'out';
    const messageItem = `   
            <li class="message clearfix ${position}">
                <div class="chat-img">
                    <img alt="avatarchat" src="${message.recipient_details.profile.image}" style="object-fit: cover;">
                </div>
                <div class="chat-body clearfix" id="chat-body">
                    <div class="chat-message">
                        <h5>${message.user}</h5>
                        <p>${message.body}</p>
                        <p style="font-size: 11px;color: white;">${message.timestamp}</p>
                    </div>
                </div>
            </li>`;
    $(messageItem).appendTo('#messages');
    
}

function getConversation(recipient) {
    $.getJSON(`/chat/api/v1/message/?target=${recipient}`, function (data) {
        messageList.children('.message').remove();
        for (let i = data['results'].length - 1; i >= 0; i--) {
            drawMessage(data['results'][i]);
        }
        messageList.animate({scrollTop: messageList.prop('scrollHeight')});
    });

}

function getMessageById(message) {
    id = JSON.parse(message).message
    $.getJSON(`/chat/api/v1/message/${id}/`, function (data) {
        if (data.user === currentRecipient ||
            (data.recipient === currentRecipient && data.user == currentUser)) {
            drawMessage(data);
        }
        messageList.animate({scrollTop: messageList.prop('scrollHeight')});
    });
}

Я думаю, что проблема в функции getConversation

function sendMessage(recipient, body) {
    $.post('/chat/api/v1/message/', {
        recipient: recipient,
        body: body
    }).fail(function () {
        alert('Error! Check console!');
    });
}

function setCurrentRecipient(username) {
    currentRecipient = username;
    getConversation(currentRecipient);
    enableInput();
}
function enableInput() {
    chatInput.prop('disabled', false);
    chatButton.prop('disabled', false);
    chatInput.focus();
}
function disableInput() {
    chatInput.prop('disabled', true);
    chatButton.prop('disabled', true);
}
$(document).ready(function () {
    updateUserList();
    disableInput();

    var ws_scheme = window.location.protocol == "https:" ? "wss" : "ws";

    var socket = new WebSocket(
        ws_scheme + '://' + window.location.host +
        '/ws/socket-server/')

    chatInput.keypress(function (e) {
        if (e.keyCode == 13)
            chatButton.click();
    });

    chatButton.click(function () {
        if (chatInput.val().length > 0) {
            sendMessage(currentRecipient, chatInput.val());
            chatInput.val('');
        }
    });

    socket.onmessage = function (e) {
        getMessageById(e.data);
    };
});

пожалуйста, помогите, это свело меня с ума!

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