sophie/chat.sad.ovh
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add message rendering, fix sse cancling, add user id copying

Browse source
This commit is contained in:
Soph :3 2026-01-04 21:41:24 +02:00
parent f1539bdffa
commit 3a0f096ade
6 changed files with 155 additions and 42 deletions
Download patch file Download diff file Expand all files Collapse all files

46
src/lib/components/extra/User.svelte
View file

@ -1,22 +1,34 @@
<script lang="ts">
import { Status, type UserWithStatus } from '$lib';
import { Status, type UserWithStatus } from '$lib';
const {
onclick,
user
}: { onclick?: (e: MouseEvent) => void, user: UserWithStatus } = $props();
const { onclick, user }: { onclick?: (e: MouseEvent) => void; user: UserWithStatus } = $props();
</script>
<a {onclick} href="##" class="flex items-center gap-2">
<div class="relative">
<img src={"https://api.dicebear.com/7.x/pixel-art/svg?seed=" + user.username} alt={user.username} class="size-6 rounded-full" />
{#if user.status === Status.OFFLINE}
<span class="absolute bottom-0 end-0 block size-2 rounded-full bg-gray-500 ring-1 ring-white"></span>
{:else if user.status === Status.DND}
<span class="absolute bottom-0 end-0 block size-2 rounded-full bg-red-500 ring-1 ring-white"></span>
{:else if user.status === Status.ONLINE}
<span class="absolute bottom-0 end-0 block size-2 rounded-full bg-green-500 ring-1 ring-white"></span>
{/if}
</div>
{user.username}
<a
{onclick}
oncontextmenu={async (e) => {
e.preventDefault();
await navigator.clipboard.writeText(user.id);
}}
href="##"
class="flex items-center gap-2"
>
<div class="relative">
<img
src={'https://api.dicebear.com/7.x/pixel-art/svg?seed=' + user.username}
alt={user.username}
class="size-6 rounded-full"
/>
{#if user.status === Status.OFFLINE}
<span class="absolute end-0 bottom-0 block size-2 rounded-full bg-gray-500 ring-1 ring-white"
></span>
{:else if user.status === Status.DND}
<span class="absolute end-0 bottom-0 block size-2 rounded-full bg-red-500 ring-1 ring-white"
></span>
{:else if user.status === Status.ONLINE}
<span class="absolute end-0 bottom-0 block size-2 rounded-full bg-green-500 ring-1 ring-white"
></span>
{/if}
</div>
{user.username}
</a>