diff --git a/web/src/lib/components/shared-components/search-bar/SearchFilters.svelte b/web/src/lib/components/shared-components/search-bar/SearchFilters.svelte index 6f6cfeed06..c02d4b9b2c 100644 --- a/web/src/lib/components/shared-components/search-bar/SearchFilters.svelte +++ b/web/src/lib/components/shared-components/search-bar/SearchFilters.svelte @@ -62,8 +62,10 @@ let searchHistory = $state(); let activeFilter: string = $state('type'); - let people: Promise | undefined = $state(undefined); - let tags: Promise | undefined = $state(undefined); + let peoplePromise: Promise | undefined = $state(undefined); + let people: PersonResponseDto[] | undefined = $state(undefined); + let tagsPromise: Promise | undefined = $state(undefined); + let tags: TagResponseDto[] | undefined = $state(undefined); let typeTitle: string | undefined = $derived(searchTypeTitle(searchManager.filter.queryType)); let peopleTitle: string | undefined = $state(undefined); @@ -82,7 +84,7 @@ ), ); let tagsTitle: string | undefined = $state(undefined); - let mediaTitle: string | undefined = $state(searchMediaTitle(searchManager.filter.mediaType)); + let mediaTitle: string | undefined = $derived(searchMediaTitle(searchManager.filter.mediaType)); let filters = [ { @@ -136,28 +138,30 @@ const clear = () => { searchManager.reset(); - peopleTitle = tagsTitle = mediaTitle = undefined; + peopleTitle = tagsTitle = undefined; }; onMount(() => { - if (searchManager.filter.personIds.size > 0) { - if (!people) { - people = getPeople(searchManager.filter.personIds); - } - - void people.then((res) => { - peopleTitle = searchPeopleTitle(res, searchManager.filter.personIds); - }); + if (searchManager.filter.personIds.size > 0 && !peoplePromise) { + peoplePromise = getPeople(searchManager.filter.personIds); + void peoplePromise.then((res) => (people = res)); } - if (searchManager.filter.tagIds?.size) { - if (!tags) { - tags = getAllTags(); - } + if (searchManager.filter.tagIds?.size && !tagsPromise) { + tagsPromise = getAllTags(); + void tagsPromise.then((res) => (tags = res)); + } + }); - void tags.then((res) => { - tagsTitle = searchTagsTitle(res, searchManager.filter.tagIds!); - }); + $effect(() => { + if (people) { + peopleTitle = searchPeopleTitle(people, searchManager.filter.personIds); + } + }); + + $effect(() => { + if (tags) { + tagsTitle = searchTagsTitle(tags, searchManager.filter.tagIds!); } }); @@ -222,15 +226,15 @@ {#if activeFilter === 'type'} {:else if activeFilter === 'people'} - + {:else if activeFilter === 'date'} {:else if activeFilter === 'places'} {:else if activeFilter === 'tags'} - + {:else if activeFilter === 'media'} - + {/if} {/if} diff --git a/web/src/lib/components/shared-components/search-bar/SearchMediaSection.svelte b/web/src/lib/components/shared-components/search-bar/SearchMediaSection.svelte index 58d6ed8221..d494da0988 100644 --- a/web/src/lib/components/shared-components/search-bar/SearchMediaSection.svelte +++ b/web/src/lib/components/shared-components/search-bar/SearchMediaSection.svelte @@ -1,23 +1,11 @@
@@ -25,13 +13,25 @@ {$t('media_type_description')}
- setMedia(MediaType.All)}> + (searchManager.filter.mediaType = MediaType.All)} + > {$t('all')} - setMedia(MediaType.Image)}> + (searchManager.filter.mediaType = MediaType.Image)} + > {$t('image')} - setMedia(MediaType.Video)}> + (searchManager.filter.mediaType = MediaType.Video)} + > {$t('video')}
diff --git a/web/src/routes/(user)/search/[[photos=photos]]/[[assetId=id]]/+page.svelte b/web/src/routes/(user)/search/[[photos=photos]]/[[assetId=id]]/+page.svelte index 8fc67f3e5b..578c63e42c 100644 --- a/web/src/routes/(user)/search/[[photos=photos]]/[[assetId=id]]/+page.svelte +++ b/web/src/routes/(user)/search/[[photos=photos]]/[[assetId=id]]/+page.svelte @@ -245,6 +245,7 @@ delete terms[key]; assetMultiSelectManager.clear(); void goto(Route.search(terms)); + searchManager.setQuery(terms); } onMount(() => searchManager.setQuery(terms));