{#if !top} { console.info("visible"); if (!messagesLoading) { loadMoreMessages(); } }} >

{$i18n.t("Loading...")}

{:else if !thread}

{#if channel}

{#if channel?.type === "dm"}

{#each channel.users .filter((u) => u.id !== $user?.id) .slice(0, 2) as u, index}

{/each}

{/if}

{#if channel?.name} {channel.name} {:else} {channel?.users ?.filter((u) => u.id !== $user?.id) .map((u) => u.name) .join(", ")} {/if}

{$i18n.t( "This channel was created on {{createdAt}}. This is the very beginning of the {{channelName}} channel.", { createdAt: dayjs( channel.created_at / 1000000, ).format("MMMM D, YYYY"), channelName: channel.name, }, )}

{:else}

{$i18n.t("Start of the channel")}

{/if} {#if messageList.length > 0}

{/if}

{/if} {#each messageList as message, messageIdx (id ? `${id}-${message.id}` : message.id)} { messages = messages.filter((m) => m.id !== message.id); const res = deleteMessage( localStorage.token, message.channel_id, message.id, ).catch((error) => { toast.error(`${error}`); return null; }); }} onEdit={(content) => { messages = messages.map((m) => { if (m.id === message.id) { m.content = content; } return m; }); const res = updateMessage( localStorage.token, message.channel_id, message.id, { content: content, }, ).catch((error) => { toast.error(`${error}`); return null; }); }} onReply={(message) => { onReply(message); }} onPin={async (message) => { messages = messages.map((m) => { if (m.id === message.id) { m.is_pinned = !m.is_pinned; m.pinned_by = !m.is_pinned ? null : $user?.id; m.pinned_at = !m.is_pinned ? null : Date.now() * 1000000; } return m; }); const updatedMessage = await pinMessage( localStorage.token, message.channel_id, message.id, message.is_pinned, ).catch((error) => { toast.error(`${error}`); return null; }); }} onThread={(id) => { onThread(id); }} onReaction={(name) => { if ( (message?.reactions ?? []) .find((reaction) => reaction.name === name) ?.users?.some((u) => u.id === $user?.id) ?? false ) { messages = messages.map((m) => { if (m.id === message.id) { const reaction = m.reactions.find( (reaction) => reaction.name === name, ); if (reaction) { reaction.users = reaction.users.filter( (u) => u.id !== $user?.id, ); reaction.count = reaction.users.length; if (reaction.count === 0) { m.reactions = m.reactions.filter( (r) => r.name !== name, ); } } } return m; }); const res = removeReaction( localStorage.token, message.channel_id, message.id, name, ).catch((error) => { toast.error(`${error}`); return null; }); } else { messages = messages.map((m) => { if (m.id === message.id) { if (m.reactions) { const reaction = m.reactions.find( (reaction) => reaction.name === name, ); if (reaction) { reaction.users.push({ id: $user?.id, name: $user?.name, }); reaction.count = reaction.users.length; } else { m.reactions.push({ name: name, users: [ { id: $user?.id, name: $user?.name, }, ], count: 1, }); } } } return m; }); const res = addReaction( localStorage.token, message.channel_id, message.id, name, ).catch((error) => { toast.error(`${error}`); return null; }); } }} /> {/each}

{/if}