feat: Support for sending messages in different channels

This commit is contained in:
April Hall 2025-02-06 16:25:57 -05:00
parent 6ec65e44b2
commit 04c13396b6
Signed by: arithefirst
GPG Key ID: 4508A15C4DB91C5B
4 changed files with 26 additions and 6 deletions

View File

@ -5,3 +5,10 @@ export interface TypeMessage {
imageSrc: string; imageSrc: string;
user: string; user: string;
} }
export interface TypeFullMessage {
channel: string;
message: string;
imageSrc: string;
user: string;
}

View File

@ -27,11 +27,12 @@ export function startupSocketIOServer(httpServer: HttpServer | null) {
if (msg.content !== '') { if (msg.content !== '') {
console.log(`\x1b[35m[ws:kit]\x1b[0m message from ${socket.id}: ${msg.content}`); console.log(`\x1b[35m[ws:kit]\x1b[0m message from ${socket.id}: ${msg.content}`);
// Store the message in the database // Store the message in the database
await db.sendMessage('general', msg.content, msg.id, uuidv4()); await db.sendMessage(msg.channel, msg.content, msg.id, uuidv4());
io!.emit('message', { io!.emit('message', {
user: msg.id, user: msg.id,
message: msg.content, message: msg.content,
imageSrc: `https://api.dicebear.com/9.x/identicon/svg?seed=${msg.id}`, imageSrc: `https://api.dicebear.com/9.x/identicon/svg?seed=${msg.id}`,
channel: msg.channel,
}); });
} }
}); });

View File

@ -13,6 +13,7 @@ export async function load({ params }): Promise<{ messages: TypeMessage[] }> {
message: value.message_content, message: value.message_content,
user: value.sender.toString(), user: value.sender.toString(),
imageSrc: `https://api.dicebear.com/9.x/identicon/svg?seed=${value.sender.toString()}`, imageSrc: `https://api.dicebear.com/9.x/identicon/svg?seed=${value.sender.toString()}`,
channel: value.channel,
}; };
}) })
: []; : [];

View File

@ -2,36 +2,47 @@
import { io } from 'socket.io-client'; import { io } from 'socket.io-client';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { v4 as uuidv4 } from 'uuid'; import { v4 as uuidv4 } from 'uuid';
import { type TypeMessage } from '$lib'; import type { TypeMessage, TypeFullMessage } from '$lib';
import type { PageData } from './$types'; import type { PageData } from './$types';
import { Input } from '$lib/components/ui/input/index'; import { Input } from '$lib/components/ui/input/index';
import { Button } from '$lib/components/ui/button/index'; import { Button } from '$lib/components/ui/button/index';
import Send from 'lucide-svelte/icons/send'; import Send from 'lucide-svelte/icons/send';
import Message from '$lib/components/message.svelte'; import Message from '$lib/components/message.svelte';
import { page } from '$app/state';
let { data }: { data: PageData } = $props(); let { data }: { data: PageData } = $props();
let user: string | undefined; let user: string | undefined;
let socket: ReturnType<typeof io> | null = null; let socket: ReturnType<typeof io> | null = null;
let log: TypeMessage[] = $state([]); let log: TypeMessage[] = $state([]);
let msg: string = $state(''); let msg: string = $state('');
const channel = $derived(page.params.channel);
function logEvent(newMsg: TypeMessage) { function logEvent(newMsg: TypeMessage) {
log = [newMsg, ...log]; log = [
{
message: newMsg.message,
imageSrc: newMsg.imageSrc,
user: newMsg.user,
},
...log,
];
} }
function establishSocketIOConnection() { function establishSocketIOConnection() {
if (socket) return; if (socket) return;
socket = io(); socket = io();
socket.on('message', (data: TypeMessage) => { socket.on('message', (data: TypeFullMessage) => {
console.log('[ws] message received', data); console.log('[ws] message received', data);
logEvent(data); if (data.channel == channel) {
logEvent(data);
}
}); });
} }
function sendMessage() { function sendMessage() {
if (!socket) return; if (!socket) return;
socket.emit('message', { id: user, content: msg }); socket.emit('message', { id: user, content: msg, channel: channel });
msg = ''; msg = '';
} }