diff --git a/web/src/lib/components/timeline/Timeline.svelte b/web/src/lib/components/timeline/Timeline.svelte index 044a45e725..d0305f8aa9 100644 --- a/web/src/lib/components/timeline/Timeline.svelte +++ b/web/src/lib/components/timeline/Timeline.svelte @@ -193,7 +193,7 @@ return true; }; - export const scrollAfterNavigate = async ({ scrollToAssetQueryParam }: { scrollToAssetQueryParam: boolean }) => { + export const scrollAfterNavigate = async () => { if (timelineManager.viewportHeight === 0 || timelineManager.viewportWidth === 0) { // this can happen if you do the following navigation order // /photos?at=, /photos/, http://example.com, browser back, browser back @@ -203,16 +203,16 @@ timelineManager.viewportWidth = rect.width; } } - if (scrollToAssetQueryParam) { - const scrollTarget = $gridScrollTarget?.at; - let scrolled = false; - if (scrollTarget) { - scrolled = await scrollAndLoadAsset(scrollTarget); - } - if (!scrolled) { - // if the asset is not found, scroll to the top - timelineManager.scrollTo(0); - } + const scrollTarget = $gridScrollTarget?.at; + let scrolled = false; + console.log(scrollTarget, scrolled); + if (scrollTarget) { + scrolled = await scrollAndLoadAsset(scrollTarget); + } + if (!scrolled) { + console.log('scrolling?'); + // if the asset is not found, scroll to the top + timelineManager.scrollTo(0); } invisible = false; }; @@ -226,6 +226,7 @@ // and a new route is being navigated to. It will never be called on direct // navigations by the browser. beforeNavigate(({ from, to }) => { + console.log('before navigate'); timelineManager.suspendTransitions = true; const isNavigatingToAssetViewer = isAssetViewerRoute(to); const isNavigatingFromAssetViewer = isAssetViewerRoute(from); @@ -235,6 +236,7 @@ // afterNavigate is only called after navigation to a new URL, {complete} will resolve // after successful navigation. afterNavigate(({ complete }) => { + console.log('after navigate'); void complete.finally(() => { const isAssetViewerPage = isAssetViewerRoute(page); @@ -245,11 +247,7 @@ initialLoadWasAssetViewer = isAssetViewerPage && !hasNavigatedToOrFromAssetViewer; } - const isDirectTimelineLoad = isDirectNavigation && !isAssetViewerPage; - const isNavigatingFromAssetViewer = !isDirectNavigation && hasNavigatedToOrFromAssetViewer; - const scrollToAssetQueryParam = isDirectTimelineLoad || isNavigatingFromAssetViewer; - - void scrollAfterNavigate({ scrollToAssetQueryParam }); + void scrollAfterNavigate(); }); }); @@ -306,7 +304,7 @@ } }; - // note: don't throttle, debounch, or otherwise make this function async - it causes flicker + // note: don't throttle, debounce, or otherwise make this function async - it causes flicker const handleTimelineScroll = () => { if (!scrollableElement) { return; @@ -544,7 +542,7 @@ if (asset) { $gridScrollTarget = { at: asset }; } - void scrollAfterNavigate({ scrollToAssetQueryParam: true }); + void scrollAfterNavigate(); }} onBeforeUpdate={(payload: UpdatePayload) => { const timelineUpdate = payload.updates.some((update) => update.path.endsWith('Timeline.svelte'));