<script lang="ts">
	import type { IMessage } from '$lib/message';

	interface Props {
		message: IMessage;
		localSenderId: number;
	}

	let { message, localSenderId }: Props = $props();
</script>

<div
	class={[
		'bg-accent text-accent-foreground w-fit max-w-[70%] rounded-lg px-4 py-2',
		message.senderId === localSenderId && 'self-end bg-primary text-primary-foreground'
	]}
>
	<p>{message.content}</p>
</div>
