Rough out chat

src/app/components/PeopleItem.svelte

@@ -1,16 +1,23 @@
 <script lang="ts">
-  import {onMount} from 'svelte'
-  import {nip19} from 'nostr-tools'
-  import {ago, append, first, sortBy, max, WEEK, ctx} from '@welshman/lib'
-  import {NOTE, getAncestorTags, getListValues} from '@welshman/util'
-  import type {Filter} from '@welshman/util'
-  import {deriveEvents} from '@welshman/store'
-  import {repository, load, loadRelaySelections, userFollows, formatTimestamp, formatTimestampRelative} from '@welshman/app'
-  import Link from '@lib/components/Link.svelte'
+  import {onMount} from "svelte"
+  import {nip19} from "nostr-tools"
+  import {ago, append, first, sortBy, WEEK, ctx} from "@welshman/lib"
+  import {NOTE, getAncestorTags, getListTags, getPubkeyTagValues} from "@welshman/util"
+  import type {Filter} from "@welshman/util"
+  import {deriveEvents} from "@welshman/store"
+  import {
+    repository,
+    load,
+    loadRelaySelections,
+    userFollows,
+    formatTimestamp,
+    formatTimestampRelative,
+  } from "@welshman/app"
+  import Link from "@lib/components/Link.svelte"
   import Profile from "@app/components/Profile.svelte"
   import ProfileInfo from "@app/components/ProfileInfo.svelte"
   import Content from "@app/components/Content.svelte"
-  import {entityLink} from '@app/state'
+  import {entityLink} from "@app/state"
 
   export let pubkey
 
@@ -38,16 +45,18 @@
     {@const event = first(sortBy(e => -e.created_at, roots))}
     {@const relays = ctx.app.router.Event(event).getUrls()}
     {@const nevent = nip19.neventEncode({id: event.id, relays})}
-    {@const following = getListValues("p", $userFollows).includes(pubkey)}
+    {@const following = getPubkeyTagValues(getListTags($userFollows)).includes(pubkey)}
     <div class="divider" />
     <Link external class="chat chat-start" href={entityLink(nevent)}>
       <div class="chat-bubble">
         <Content hideMedia={!following} {event} />
-        <p class="text-xs text-right">{formatTimestamp(event.created_at)}</p>
+        <p class="text-right text-xs">{formatTimestamp(event.created_at)}</p>
       </div>
     </Link>
     <div class="flex gap-2">
-      <div class="badge badge-neutral">{roots.length} recent {roots.length === 1 ? 'note' : 'notes'}</div>
+      <div class="badge badge-neutral">
+        {roots.length} recent {roots.length === 1 ? "note" : "notes"}
+      </div>
       <div class="badge badge-neutral">Last posted {formatTimestampRelative(event.created_at)}</div>
     </div>
   {/if}