feat: web UI chat render, panels, presence + analytics
This commit is contained in:
@@ -0,0 +1,45 @@
|
||||
<script lang="ts">
|
||||
import type { ContactView } from "$lib/api/types";
|
||||
import Avatar from "$lib/components/ui/Avatar.svelte";
|
||||
|
||||
interface Props {
|
||||
contact: ContactView;
|
||||
}
|
||||
|
||||
let { contact }: Props = $props();
|
||||
|
||||
const name = $derived(
|
||||
[contact.first_name, contact.last_name].filter(Boolean).join(" ") ||
|
||||
"Contact"
|
||||
);
|
||||
</script>
|
||||
|
||||
<div class="Contact">
|
||||
<Avatar {name} colorKey={contact.user_id ?? 0} size={2.5} />
|
||||
<div class="info">
|
||||
<div class="name">{name}</div>
|
||||
{#if contact.phone_number}
|
||||
<div class="phone">{contact.phone_number}</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.Contact {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.625rem;
|
||||
|
||||
min-width: 12rem;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.name {
|
||||
font-weight: var(--font-weight-medium);
|
||||
}
|
||||
|
||||
.phone {
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-secondary);
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user