gorb/frontend
4
0
Fork 0
Code Issues 15 Pull requests 8 Projects Releases Packages 1 Wiki Activity Actions

Fix loading of older messages in message history #56

Merged
sauceyred merged 6 commits from fix/old-messages-loading into main 2025-08-03 18:07:47 +00:00
Conversation 1 Commits 6 Files changed 2 +6 -20
2 changed files with 6 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

3
components/Message.vue
View file

@ -126,9 +126,6 @@ onMounted(async () => {
} }
if (mediaLinks.length) { if (mediaLinks.length) {
hasEmbed.value = true hasEmbed.value = true
setTimeout(() => {
scrollToBottom(document.getElementById("messages") as HTMLDivElement);
}, 500);
}; };
} catch (error) { } catch (error) {
console.error(error); console.error(error);

23
components/MessageArea.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<div id="message-area"> <div id="message-area">
<div id="messages" ref="messagesElement"> <div id="messages" ref="messagesElement">
<Message v-for="(message, i) of messages" :username="getDisplayName(message.user)" <Message v-for="(message, i) of messages" :username="getDisplayName(message.user)" :key="message.uuid"
:text="message.message" :timestamp="messageTimestamps[message.uuid]" :img="message.user.avatar" :text="message.message" :timestamp="messageTimestamps[message.uuid]" :img="message.user.avatar"
:format="timeFormat" :type="messagesType[message.uuid]" :format="timeFormat" :type="messagesType[message.uuid]"
:margin-bottom="(messages[i + 1] && messagesType[messages[i + 1].uuid] == 'normal') ?? false" :margin-bottom="(messages[i + 1] && messagesType[messages[i + 1].uuid] == 'normal') ?? false"
@ -237,12 +237,8 @@ function sendMessage(e: Event) {
} }
function getReplyMessage(id: string) { function getReplyMessage(id: string) {
console.log("[REPLYMSG] id:", id);
const messagesValues = Object.values(messages.value); const messagesValues = Object.values(messages.value);
console.log("[REPLYMSG] messages values:", messagesValues);
for (const message of messagesValues) { for (const message of messagesValues) {
console.log("[REPLYMSG] message:", message);
console.log("[REPLYMSG] IDs match?", message.uuid == id);
if (message.uuid == id) return message; if (message.uuid == id) return message;
} }
} }
@ -266,21 +262,14 @@ onMounted(async () => {
if (fetched) return; if (fetched) return;
fetched = true; fetched = true;
console.log("scroll height is at 10% or less"); console.log("scroll height is at 10% or less");
//console.log("current oldest:", currentOldestMessage);
const olderMessages = await fetchMessages(route.params.channelId as string, { amount, offset }); const olderMessages = await fetchMessages(route.params.channelId as string, { amount, offset });
if (olderMessages) { if (olderMessages?.length) {
olderMessages.reverse(); olderMessages.reverse();
console.log("older messages:", olderMessages); messages.value = [...olderMessages.map(msg => reactive(msg)), ...messages.value];
if (olderMessages.length == 0) return; for (const message of messages.value) {
olderMessages.reverse(); groupMessage(message);
for (const [i, oldMessage] of olderMessages.entries()) {
console.log("old message:", oldMessage);
messages.value.unshift(oldMessage);
for (const message of messages.value) {
groupMessage(message);
}
} }
offset += offset; offset += amount;
} }
} else { } else {
fetched = false; fetched = false;