Add mobile nav notification badges

This commit is contained in:
Jon Staab
2024-11-14 12:16:44 -08:00
parent 14ad4ec785
commit 2978d91977
11 changed files with 128 additions and 131 deletions
+27
View File
@@ -0,0 +1,27 @@
<script lang="ts">
import Link from "@lib/components/Link.svelte"
import CardButton from "@lib/components/CardButton.svelte"
import SpaceAvatar from "@app/components/SpaceAvatar.svelte"
import RelayName from "@app/components/RelayName.svelte"
import RelayDescription from "@app/components/RelayDescription.svelte"
import {makeSpacePath} from "@app/routes"
import {deriveNotification, SPACE_FILTERS} from "@app/notifications"
export let url
const path = makeSpacePath(url)
const notification = deriveNotification(path, SPACE_FILTERS, url)
</script>
<Link replaceState href={path}>
<CardButton>
<div slot="icon"><SpaceAvatar {url} /></div>
<div slot="title" class="flex gap-1">
<RelayName {url} />
{#if $notification}
<div class="relative top-1 h-2 w-2 rounded-full bg-primary" />
{/if}
</div>
<div slot="info"><RelayDescription {url} /></div>
</CardButton>
</Link>