Compare commits

..

No commits in common. "addfddd3ac0342497e6215373eb773c0903fdf0f" and "0d95b0240191a1d0255d8455bb08f56a3a23f2b7" have entirely different histories.

2 changed files with 3 additions and 17 deletions

View file

@ -28,10 +28,9 @@
createdAt: Date.now().toString() createdAt: Date.now().toString()
}; };
messages.addMessage(optimisticMessage); messages.addMessage(optimisticMessage);
messageInput = "";
const res = await request("POST", apiRoute(`channels/${channel.id}/messages`), true, { const res = await request("POST", apiRoute(`channels/${channel.id}/messages`), true, {
content: optimisticMessage.content content: messageInput
}); });
if (res.success && res.ok) { if (res.success && res.ok) {

View file

@ -1,23 +1,10 @@
<script> <script>
import { afterUpdate, beforeUpdate } from "svelte";
import { messagesStoreProvider } from "../../../stores.js"; import { messagesStoreProvider } from "../../../stores.js";
export let channelId; export let channelId;
let scrollTarget;
let shouldAutoscroll = false;
$: messages = messagesStoreProvider.getStore(channelId); $: messages = messagesStoreProvider.getStore(channelId);
beforeUpdate(() => {
shouldAutoscroll = scrollTarget && (scrollTarget.offsetHeight + scrollTarget.scrollTop) > (scrollTarget.scrollHeight - 20);
});
afterUpdate(() => {
if (shouldAutoscroll && scrollTarget) {
scrollTarget.scrollTo(0, scrollTarget.scrollHeight);
}
});
const onScroll = (e) => { const onScroll = (e) => {
const { scrollTop, offsetHeight, scrollHeight } = e.target; const { scrollTop, offsetHeight, scrollHeight } = e.target;
if (scrollTop === 0) { if (scrollTop === 0) {
@ -43,7 +30,7 @@
} }
</style> </style>
<div class="messages-container" on:scroll={ onScroll } bind:this={ scrollTarget }> <div class="messages-container" on:scroll={ onScroll }>
{#each $messages as message (message.id)} {#each $messages as message (message.id)}
<div> <div>
<b>{ message.author_username }</b> <b>{ message.author_username }</b>