Rebuild the room feed when the url anchor changes after mount (#571)
This commit is contained in:
parent
e5debeacd8
commit
74a914eb5b
1 changed files with 17 additions and 1 deletions
|
|
@ -1,5 +1,5 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import {onDestroy, onMount} from "svelte"
|
import {onDestroy, onMount, untrack} from "svelte"
|
||||||
import {readable} from "svelte/store"
|
import {readable} from "svelte/store"
|
||||||
import {page} from "$app/stores"
|
import {page} from "$app/stores"
|
||||||
import {navigate} from "@app/modal"
|
import {navigate} from "@app/modal"
|
||||||
|
|
@ -372,6 +372,7 @@
|
||||||
let jumpSettled = $state(false)
|
let jumpSettled = $state(false)
|
||||||
let released = false
|
let released = false
|
||||||
let pinned: Maybe<{id: string; top: number}>
|
let pinned: Maybe<{id: string; top: number}>
|
||||||
|
let feedAnchor: Maybe<number>
|
||||||
let isProgrammaticScroll = $state(false)
|
let isProgrammaticScroll = $state(false)
|
||||||
let isUserScrolling = $state(false)
|
let isUserScrolling = $state(false)
|
||||||
let virtualList: Maybe<VirtualListController> = $state()
|
let virtualList: Maybe<VirtualListController> = $state()
|
||||||
|
|
@ -449,6 +450,19 @@
|
||||||
// the whole answer.
|
// the whole answer.
|
||||||
const showScrollButton = $derived(scrolledUp || windowStopsShort)
|
const showScrollButton = $derived(scrolledUp || windowStopsShort)
|
||||||
|
|
||||||
|
// A search result or a notification jumping into the room already on screen changes the url
|
||||||
|
// without re-creating this component, so the feed built on the old anchor has to be rebuilt
|
||||||
|
// on the new one. `at` is NaN when there is no anchor, and NaN never equals itself.
|
||||||
|
$effect(() => {
|
||||||
|
if (!isNaN(at) && feedAnchor && at !== feedAnchor) {
|
||||||
|
released = false
|
||||||
|
pinned = undefined
|
||||||
|
jumpSettled = false
|
||||||
|
|
||||||
|
untrack(() => start(at))
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
$effect(() => {
|
$effect(() => {
|
||||||
if (elements.length > 0 && !isUserScrolling) {
|
if (elements.length > 0 && !isUserScrolling) {
|
||||||
requestAnimationFrame(manageScrollPosition)
|
requestAnimationFrame(manageScrollPosition)
|
||||||
|
|
@ -485,6 +499,8 @@
|
||||||
const start = (anchor: number) => {
|
const start = (anchor: number) => {
|
||||||
cleanup?.()
|
cleanup?.()
|
||||||
|
|
||||||
|
feedAnchor = anchor
|
||||||
|
|
||||||
const feed = makeFeed({
|
const feed = makeFeed({
|
||||||
relays: [url],
|
relays: [url],
|
||||||
at: anchor,
|
at: anchor,
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue