flotilla/src/app/components/ProfileBadges.svelte

44 lines
1.3 KiB
Svelte

<script lang="ts">
import {onMount} from "svelte"
import {formatTimestampRelative} from "@welshman/lib"
import {NOTE, COMMENT, MESSAGE} from "@welshman/util"
import Button from "@lib/components/Button.svelte"
import ProfileSpaces from "@app/components/ProfileSpaces.svelte"
import {network, roomLists} from "@app/core"
import {latestEvents} from "@app/repository"
import {goToEvent} from "@app/routes"
import {pushModal} from "@app/modal"
type Props = {
pubkey: string
url?: string
}
const {pubkey, url}: Props = $props()
const latest = $latestEvents.forPubkey(pubkey)
const spaceUrls = $roomLists.urls(pubkey).$
const viewEvent = () => goToEvent($latest!)
const openSpaces = () => pushModal(ProfileSpaces, {pubkey, url}, {label: "Profile spaces"})
onMount(() => {
$network.loadUsingOutbox(pubkey, {limit: 1, kinds: [NOTE, COMMENT, MESSAGE]})
})
</script>
<div class="flex flex-wrap gap-2">
{#if $latest}
<Button onclick={viewEvent} class="badge badge-neutral">
Last active {formatTimestampRelative($latest.created_at)}
</Button>
{/if}
{#if $spaceUrls.length > 0}
<Button onclick={openSpaces} class="badge badge-neutral">
{$spaceUrls.length}
{$spaceUrls.length === 1 ? "space" : "spaces"}
</Button>
{/if}
</div>