Cutlery/immich
1
0
Fork 1
mirror of https://github.com/immich-app/immich.git synced 2025-11-26 08:15:17 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix: timeline scroll after navigate (#23664)

Browse Source
This commit is contained in:
Daniel Dietzler 2025-11-13 11:28:42 +01:00 committed by GitHub
parent 2c54b506b3
commit 0e7e67efe1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 16 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
web/src/lib/components/timeline/Timeline.svelte
View File

@ -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=<id>, /photos/<id>, 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'));