fix fetch on scroll

This commit is contained in:
nflnkr 2023-05-12 18:33:18 +03:00 committed by skeris
parent bec307569c
commit 208c7f69ff

@ -30,41 +30,36 @@ export default function Chat() {
const ticket = tickets.find(ticket => ticket.id === ticketId);
useEffect(function scrollOnNewMessage() {
scrollToBottom();
}, [messages]);
useEffect(function fetchTicketMessages() {
if (!ticketId) return;
useEffect(
function fetchTicketMessages() {
if (!ticketId) return;
const getTicketsBody: GetMessagesRequest = {
amt: messagesPerPage,
page: messageApiPage,
ticket: ticketId,
};
const controller = new AbortController();
const getTicketsBody: GetMessagesRequest = {
amt: messagesPerPage,
page: messageApiPage,
ticket: ticketId,
};
const controller = new AbortController();
setMessageFetchState("fetching");
getTicketMessages({
body: getTicketsBody,
signal: controller.signal,
}).then(result => {
console.log("GetMessagesResponse", result);
if (result?.length > 0) {
if (chatBoxRef.current && chatBoxRef.current.scrollTop < 1) chatBoxRef.current.scrollTop = 1;
addOrUpdateMessages(result);
setMessageFetchState("idle");
} else setMessageFetchState("all fetched");
}).catch(error => {
console.log("Error fetching messages", error);
enqueueSnackbar(error.message);
});
setMessageFetchState("fetching");
getTicketMessages({
body: getTicketsBody,
signal: controller.signal,
}).then(result => {
console.log("GetMessagesResponse", result);
if (result?.length > 0) {
addOrUpdateMessages(result);
setMessageFetchState("idle");
} else setMessageFetchState("all fetched");
}).catch(error => {
console.log("Error fetching messages", error);
enqueueSnackbar(error.message);
});
return () => {
controller.abort();
clearMessageState();
};
}, [messageApiPage, messagesPerPage, ticketId]);
return () => {
controller.abort();
};
}, [messageApiPage, messagesPerPage, ticketId]);
useEffect(function subscribeToMessages() {
==== BASE ====
@ -110,7 +105,6 @@ export default function Chat() {
if (messagesFetchStateRef.current !== "idle") return;
if (chatBox.scrollTop < chatBox.clientHeight) {
if (chatBox.scrollTop < 1) chatBox.scrollTop = 50;
incrementMessageApiPage();
}
};
@ -253,9 +247,3 @@ export default function Chat() {
</Box>
);
}
function sortMessagesByTime(message1: TicketMessage, message2: TicketMessage) {
const date1 = new Date(message1.created_at).getTime();
const date2 = new Date(message2.created_at).getTime();
return date1 - date2;
}