diff --git a/web/src/lib/stores/folders.svelte.ts b/web/src/lib/stores/folders.svelte.ts index fb59687a38..e7a58e33cc 100644 --- a/web/src/lib/stores/folders.svelte.ts +++ b/web/src/lib/stores/folders.svelte.ts @@ -1,3 +1,4 @@ +import { buildTree, type RecursiveObject } from '$lib/utils/tree-utils'; import { getAssetsByOriginalPath, getUniqueOriginalPaths, @@ -15,6 +16,8 @@ class FoldersStore { private initialized = false; uniquePaths = $state([]); assets = $state({}); + rootPath = ''; + tree = $state({}); async fetchUniquePaths() { if (this.initialized) { @@ -24,6 +27,24 @@ class FoldersStore { const uniquePaths = await getUniqueOriginalPaths(); this.uniquePaths.push(...uniquePaths); + + this.tree = buildTree(foldersStore.uniquePaths); + + const getAssets = async () => { + await this.fetchAssetsByPath(this.rootPath); + return this.assets[this.rootPath] || null; + }; + + let currentFolders = Object.keys(this.tree || {}).sort(); + let currentAssets = await getAssets(); + + while (currentFolders.length === 1 && currentAssets.length === 0) { + const folder = currentFolders[0]; + this.rootPath += `/${folder}`; + this.tree = this.tree[folder]; + currentFolders = Object.keys(this.tree || {}).sort(); + currentAssets = await getAssets(); + } } bustAssetCache() { @@ -34,7 +55,7 @@ class FoldersStore { if (!path) { return; } - this.assets[path] = await getAssetsByOriginalPath({ path }); + this.assets[path] = await getAssetsByOriginalPath({ path: this.getEffectivePath(path) }); } async fetchAssetsByPath(path: string) { @@ -42,7 +63,11 @@ class FoldersStore { return; } - this.assets[path] = await getAssetsByOriginalPath({ path }); + this.assets[path] = await getAssetsByOriginalPath({ path: this.getEffectivePath(path) }); + } + + private getEffectivePath(path: string) { + return this.rootPath ? this.rootPath + '/' + path : path; } clearCache() { diff --git a/web/src/routes/(user)/folders/[[photos=photos]]/[[assetId=id]]/+page.svelte b/web/src/routes/(user)/folders/[[photos=photos]]/[[assetId=id]]/+page.svelte index 8ff2a35981..45437fc81e 100644 --- a/web/src/routes/(user)/folders/[[photos=photos]]/[[assetId=id]]/+page.svelte +++ b/web/src/routes/(user)/folders/[[photos=photos]]/[[assetId=id]]/+page.svelte @@ -9,7 +9,7 @@ import { AppRoute, QueryParameter } from '$lib/constants'; import type { Viewport } from '$lib/stores/assets.store'; import { foldersStore } from '$lib/stores/folders.svelte'; - import { buildTree, normalizeTreePath } from '$lib/utils/tree-utils'; + import { normalizeTreePath } from '$lib/utils/tree-utils'; import { mdiDotsVertical, mdiFolder, mdiFolderHome, mdiFolderOutline, mdiPlus, mdiSelectAll } from '@mdi/js'; import { onMount } from 'svelte'; import { t } from 'svelte-i18n'; @@ -42,7 +42,7 @@ const viewport: Viewport = $state({ width: 0, height: 0 }); let pathSegments = $derived(data.path ? data.path.split('/') : []); - let tree = $derived(buildTree(foldersStore.uniquePaths)); + let tree = $derived(data.tree); let currentPath = $derived($page.url.searchParams.get(QueryParameter.PATH) || ''); let currentTreeItems = $derived(currentPath ? data.currentFolders : Object.keys(tree).sort()); diff --git a/web/src/routes/(user)/folders/[[photos=photos]]/[[assetId=id]]/+page.ts b/web/src/routes/(user)/folders/[[photos=photos]]/[[assetId=id]]/+page.ts index d00ba238ef..bcba812a6e 100644 --- a/web/src/routes/(user)/folders/[[photos=photos]]/[[assetId=id]]/+page.ts +++ b/web/src/routes/(user)/folders/[[photos=photos]]/[[assetId=id]]/+page.ts @@ -3,7 +3,7 @@ import { foldersStore } from '$lib/stores/folders.svelte'; import { authenticate } from '$lib/utils/auth'; import { getFormatter } from '$lib/utils/i18n'; import { getAssetInfoFromParam } from '$lib/utils/navigation'; -import { buildTree, normalizeTreePath } from '$lib/utils/tree-utils'; +import { normalizeTreePath } from '$lib/utils/tree-utils'; import type { PageLoad } from './$types'; export const load = (async ({ params, url }) => { @@ -24,16 +24,19 @@ export const load = (async ({ params, url }) => { // We should bust the asset cache of the folder store, to make sure we don't show stale data foldersStore.bustAssetCache(); } - - let tree = buildTree(foldersStore.uniquePaths); + let tree = foldersStore.tree; const parts = normalizeTreePath(path || '').split('/'); + for (const part of parts) { - tree = tree?.[part]; + if (part) { + tree = tree?.[part]; + } } return { asset, path, + tree: foldersStore.tree, currentFolders: Object.keys(tree || {}).sort(), pathAssets, meta: {