diff --git a/src/app.postcss b/src/app.postcss index 2e82aa0..f20e0d6 100644 --- a/src/app.postcss +++ b/src/app.postcss @@ -50,6 +50,7 @@ --orangered: #fa5f5f; --max-red: #de1a1a; --yellow: #fad14b; + --header-height: 3.81rem; } @tailwind components; diff --git a/src/lib/components/Server/SelectRoom.svelte b/src/lib/components/Server/SelectRoom.svelte index 200ef7c..10a68dc 100644 --- a/src/lib/components/Server/SelectRoom.svelte +++ b/src/lib/components/Server/SelectRoom.svelte @@ -8,7 +8,6 @@ function setRoom(roomId: string) { $selectedRoom[$selectedServer] = roomId; - updateMessages($selectedServer, roomId); drawerStore.close(); goto('/chat'); } @@ -25,8 +24,7 @@ }} title={`id: ${room.roomId}, epoch length(s): ${(room.rateLimit ? room.rateLimit : 1) / 1000}, -'message limit': ${room.userMessageLimit}`} - > +'message limit': ${room.userMessageLimit}`}>
{room.name}
diff --git a/src/lib/utils/rooms.ts b/src/lib/utils/rooms.ts index ea5c4be..9b5e47d 100644 --- a/src/lib/utils/rooms.ts +++ b/src/lib/utils/rooms.ts @@ -5,8 +5,7 @@ import { selectedServer, serverStore, messageStore, - currentSelectedRoom, - alertQueue + currentSelectedRoom } from '$lib/stores'; import { get } from 'svelte/store'; import { @@ -25,28 +24,44 @@ export function roomListForServer(server: string = get(selectedServer)): RoomI[] function updateRoomStore(rooms: RoomI[], serverURL: string = get(selectedServer)) { // Update the roomStore directly roomsStore.update((store) => { - rooms.forEach((room) => { - const roomId = String(room.roomId); - store[roomId] = { ...room, server: serverURL }; + const newStore = { ...store }; + const filteredRooms = rooms.filter((room) => String(room.roomId) !== '0071'); + filteredRooms.forEach((room) => { + let roomId = String(room.roomId); + if (roomId === '0071') { + roomId = '7001'; + room.roomId = '7001'; + } + if (newStore['0071']) { + delete newStore['0071']; + } + newStore[roomId] = { ...room, server: serverURL }; }); - return store; + console.debug(newStore); + return newStore; }); // Update the serverStore serverStore.update((store) => { rooms.forEach((room) => { - const roomId = String(room.roomId); + let roomId = String(room.roomId); + if (roomId === '0071') { + roomId = '7001'; + room.roomId = '7001'; + store[serverURL].rooms?.filter((id) => id !== '0071'); + } store[serverURL].rooms?.push(roomId); }); return store; }); } -async function getRoomIdsByIdentity(server: string, roomIds: string[]): Promise { +async function getRoomIdsByIdentity(server: string): Promise { const idc = getCommitment(); if (idc) { return await getRoomIdsByIdentityCommitment(server); + } else { + return []; } - return roomIds; } async function fetchRoomsByIds(server: string, roomIds: string[]): Promise { @@ -66,8 +81,17 @@ export async function updateRooms( server: string = get(selectedServer), roomIds: string[] = [] ): Promise { - roomIds = await getRoomIdsByIdentity(server, roomIds); + if (roomIds.length == 0) { + console.debug('Updating all rooms'); + roomIds = await getRoomIdsByIdentity(server); + } if (roomIds.length > 0) { + if (roomIds.includes('0071')) { + console.warn('DETECTED 0071'); + //remove 0071 from roomIds + roomIds = roomIds.filter((id) => id !== '0071'); + roomIds.push('7001'); + } const rooms = await fetchRoomsByIds(server, roomIds); const acceptedRoomNames = extractRoomNames(rooms); @@ -85,7 +109,13 @@ export async function updateRooms( } export function updateMessages(server: string, roomId: string) { - console.debug('updating messages'); + try { + const rooms = get(roomsStore); + const name = rooms[roomId].name; + console.debug('Updating messages for', name); + } catch (e) { + console.debug('RoomsStore not ready yet'); + } getMessages(server, roomId).then((messages) => { messageStore.update((store) => { store[roomId] = messages; @@ -113,18 +143,14 @@ export function addMessageToRoom(roomId: string, data: MessageI) { // Add the new message const test = [...currentStore[roomId]]; - console.log('oldmsgs', test); - console.log('newmsg', data); currentStore[roomId] = [...currentStore[roomId], data]; - console.log('allmsgs', currentStore[roomId]); // Trim messages to the last 500 if (currentStore[roomId].length > 500) { currentStore[roomId] = currentStore[roomId].slice(-500); } const result = { ...currentStore }; - console.log(result); return result; }); } diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 8ccd260..3dd1cea 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -91,13 +91,11 @@ + background="variant-filled-primary" /> + rounded="rounded-token"> {#if $drawerStore.id === 'roomselect'} {#if $numberServers > 1}

Change Server:

@@ -109,9 +107,8 @@
+ class="w-full h-screen max-h-screen" + id="pagewrapper">
@@ -123,8 +120,7 @@
@@ -140,6 +136,7 @@ } #headerwrapper { grid-area: header; + max-height: var(--header-height); position: sticky; top: 0; z-index: 1; diff --git a/src/routes/chat/+page.svelte b/src/routes/chat/+page.svelte index fe3598e..fee2964 100644 --- a/src/routes/chat/+page.svelte +++ b/src/routes/chat/+page.svelte @@ -5,8 +5,7 @@
+ class="bg-surface-50-900-token">
@@ -14,6 +13,7 @@ diff --git a/src/routes/chat/Conversation.svelte b/src/routes/chat/Conversation.svelte index 980fa77..19bb4ae 100644 --- a/src/routes/chat/Conversation.svelte +++ b/src/routes/chat/Conversation.svelte @@ -11,11 +11,28 @@ let elemChat: HTMLElement; - // For some reason, eslint thinks ScrollBehavior is undefined... - // eslint-disable-next-line no-undef - export function scrollChatBottom(behavior: ScrollBehavior = 'smooth', delay = 1): void { + $: { + if ($currentRoomMessages) { + try { + scrollChatBottom('instant'); + } catch { + console.warn('Could not scroll to bottom'); + } + } + } + + function scrollChatBottom(behavior: ScrollBehavior = 'smooth', delay = 20, count = 0): void { + if (count > 10) { + console.warn('scrollChatBottom: elemChat is not defined after multiple attempts, giving up'); + return; + } + setTimeout(() => { - elemChat.scrollTo({ top: elemChat.scrollHeight, behavior }); + if (!elemChat) { + scrollChatBottom(behavior, delay * 4, count + 1); + } else { + elemChat.scrollTo({ top: elemChat.scrollHeight, behavior }); + } }, delay); } @@ -32,7 +49,13 @@ } onMount(() => { - scrollChatBottom('instant', 10); + scrollChatBottom('instant'); + document.addEventListener('scrollChat', (e: Event) => { + const customEvent = e as CustomEvent; + const behavior = customEvent.detail.behavior ? customEvent.detail.behavior : 'smooth'; + const delay = customEvent.detail.delay ? customEvent.detail.delay : 20; + scrollChatBottom(behavior, delay); + }); }); diff --git a/src/routes/chat/Sidebar.svelte b/src/routes/chat/Sidebar.svelte index 9e59457..0a6e1b9 100644 --- a/src/routes/chat/Sidebar.svelte +++ b/src/routes/chat/Sidebar.svelte @@ -6,8 +6,7 @@