Simplify goToEvent

src/app/util/routes.ts

@@ -2,11 +2,10 @@ import type {Page} from "@sveltejs/kit"
 import {get} from "svelte/store"
 import * as nip19 from "nostr-tools/nip19"
 import {goto} from "$app/navigation"
-import {nthEq, sleep} from "@welshman/lib"
+import {nthEq} from "@welshman/lib"
 import type {TrustedEvent} from "@welshman/util"
 import {getAddress} from "@welshman/util"
 import {tracker, loadRelay} from "@welshman/app"
-import {scrollToEvent} from "@lib/html"
 import {identity} from "@welshman/lib"
 import {
   getTagValue,
@@ -62,6 +61,14 @@ export const makeRoomPath = (url: string, h: string) => `/spaces/${encodeRelay(u
 
 export const makeSpaceChatPath = (url: string) => makeRoomPath(url, "chat")
 
+export const makeMessagePath = (url: string, event: TrustedEvent) => {
+  const h = getTagValue(ROOM, event.tags)
+  const path = h ? makeRoomPath(url, h) : makeSpaceChatPath(url)
+  const qp = new URLSearchParams({at: String(event.created_at)})
+
+  return path + "?" + qp.toString()
+}
+
 export const makeGoalPath = (url: string, id?: string) => makeSpacePath(url, "goals", id)
 
 export const makeThreadPath = (url: string, id?: string) => makeSpacePath(url, "threads", id)
@@ -92,27 +99,22 @@ export const getPrimaryNavItemIndex = ($page: Page) => {
   }
 }
 
-export const goToEvent = async (event: TrustedEvent, options: Record<string, any> = {}) => {
+export const goToEvent = (event: TrustedEvent, options: Record<string, any> = {}) => {
   const urls = Array.from(tracker.getRelays(event.id))
-  const path = await getEventPath(event, urls)
+  const path = getEventPath(event, urls)
 
   if (path.includes("://")) {
     window.open(path)
   } else {
     goto(path, options)
-
-    await sleep(300)
-    await scrollToEvent(event.id)
   }
 }
 
-export const getEventPath = async (event: TrustedEvent, urls: string[]) => {
+export const getEventPath = (event: TrustedEvent, urls: string[]) => {
   if (DM_KINDS.includes(event.kind)) {
     return makeChatPath([event.pubkey, ...getPubkeyTagValues(event.tags)])
   }
 
-  const h = getTagValue(ROOM, event.tags)
-
   if (urls.length > 0) {
     const url = urls[0]
 
@@ -133,7 +135,7 @@ export const getEventPath = async (event: TrustedEvent, urls: string[]) => {
     }
 
     if (event.kind === MESSAGE) {
-      return h ? makeRoomPath(url, h) : makeSpacePath(url, "chat")
+      return makeMessagePath(url, event)
     }
 
     const address = event.tags.find(nthEq(0, "A"))?.[1]
@@ -150,7 +152,7 @@ export const getEventPath = async (event: TrustedEvent, urls: string[]) => {
       }
 
       if (parseInt(kind) === MESSAGE) {
-        return h ? makeRoomPath(url, h) : makeSpacePath(url, "chat")
+        return makeMessagePath(url, event)
       }
     }
 

src/lib/html.ts

@@ -1,4 +1,4 @@
-import {sleep, last, randomId} from "@welshman/lib"
+import {sleep, randomId} from "@welshman/lib"
 export {preventDefault, stopPropagation} from "svelte/legacy"
 
 export const copyToClipboard = (text: string) => {
@@ -103,42 +103,6 @@ export const isIntersecting = async (element: Element) =>
     observer.observe(element)
   })
 
-export const scrollToEvent = async (id: string, attempts = 3): Promise<boolean> => {
-  const element = document.querySelector(`[data-event="${id}"]`) as any
-  const elements = Array.from(document.querySelectorAll("[data-event]"))
-
-  if (element) {
-    element.scrollIntoView({behavior: "smooth", block: "center"})
-    element.style = "filter: brightness(1.5); transition-property: all; transition-duration: 400ms;"
-
-    setTimeout(() => {
-      element.style = "transition-property: all; transition-duration: 300ms;"
-    }, 800)
-
-    setTimeout(() => {
-      element.style = ""
-    }, 800 + 400)
-
-    return true
-  } else if (elements.length > 0) {
-    if (attempts <= 0) {
-      return false
-    }
-
-    const lastElement = last(elements)
-
-    if (lastElement && !isIntersecting(lastElement)) {
-      lastElement.scrollIntoView({behavior: "smooth", block: "center"})
-    }
-
-    await sleep(300)
-
-    return scrollToEvent(id, attempts - 1)
-  }
-
-  return false
-}
-
 export const compressFile = async (
   file: File | Blob,
   options: Record<string, any> = {},

src/routes/spaces/[relay]/[h]/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import {onMount, onDestroy} from "svelte"
+  import {onMount} from "svelte"
   import {readable} from "svelte/store"
   import {page} from "$app/stores"
   import type {Readable} from "svelte/store"

src/routes/spaces/[relay]/chat/+page.svelte

@@ -27,7 +27,7 @@
   import RoomComposeParent from "@app/components/RoomComposeParent.svelte"
   import {userSettingsValues, decodeRelay, PROTECTED, MESSAGE_KINDS} from "@app/core/state"
   import {prependParent, canEnforceNip70, publishDelete} from "@app/core/commands"
-  import {setChecked, checked} from "@app/util/notifications"
+  import {checked} from "@app/util/notifications"
   import {pushToast} from "@app/util/toast"
   import {makeFeed} from "@app/core/requests"
   import {popKey} from "@lib/implicit"