diff --git a/web/src/lib/components/shared-components/search-bar/search-bar.svelte b/web/src/lib/components/shared-components/search-bar/search-bar.svelte index d92bd1806c..9f7635572d 100644 --- a/web/src/lib/components/shared-components/search-bar/search-bar.svelte +++ b/web/src/lib/components/shared-components/search-bar/search-bar.svelte @@ -32,6 +32,7 @@ let showFilter = $state(false); let isSearchSuggestions = $state(false); let selectedId: string | undefined = $state(); + let isFocus = $state(false); const listboxId = generateId(); @@ -98,7 +99,25 @@ }; const onSubmit = () => { - handlePromiseError(handleSearch({ query: value })); + const searchType = getSearchType(); + let payload: SmartSearchDto | MetadataSearchDto = {} as SmartSearchDto | MetadataSearchDto; + + switch (searchType) { + case 'smart': { + payload = { query: value } as SmartSearchDto; + break; + } + case 'metadata': { + payload = { originalFileName: value } as MetadataSearchDto; + break; + } + case 'description': { + payload = { description: value } as MetadataSearchDto; + break; + } + } + + handlePromiseError(handleSearch(payload)); saveSearchTerm(value); }; @@ -132,10 +151,12 @@ const openDropdown = () => { showSuggestions = true; + isFocus = true; }; const closeDropdown = () => { showSuggestions = false; + isFocus = false; searchHistoryBox?.clearSelection(); }; @@ -143,6 +164,26 @@ event.preventDefault(); onSubmit(); }; + + function getSearchType(): 'smart' | 'metadata' | 'description' { + const t = localStorage.getItem('searchQueryType'); + return t === 'smart' || t === 'description' ? t : 'metadata'; + } + + function getSearchTypeText(): string { + const searchType = getSearchType(); + switch (searchType) { + case 'smart': { + return $t('context'); + } + case 'metadata': { + return $t('filename'); + } + case 'description': { + return $t('description'); + } + } + } + + {#if isFocus} +
0} + > +

+ {getSearchTypeText()} +

+
+ {/if} + {#if showClearIcon}
diff --git a/web/src/lib/components/shared-components/search-bar/search-filter-modal.svelte b/web/src/lib/components/shared-components/search-bar/search-filter-modal.svelte index f37894a3e2..576c1af540 100644 --- a/web/src/lib/components/shared-components/search-bar/search-filter-modal.svelte +++ b/web/src/lib/components/shared-components/search-bar/search-filter-modal.svelte @@ -2,7 +2,7 @@ import type { SearchLocationFilter } from './search-location-section.svelte'; import type { SearchDisplayFilters } from './search-display-section.svelte'; import type { SearchDateFilter } from './search-date-section.svelte'; - import { MediaType } from '$lib/constants'; + import { MediaType, QueryType, validQueryTypes } from '$lib/constants'; export type SearchFilter = { query: string; @@ -55,9 +55,18 @@ return value === null ? undefined : value; } + function storeQueryType(type: SearchFilter['queryType']) { + localStorage.setItem('searchQueryType', type); + } + + function defaultQueryType(): QueryType { + const storedQueryType = localStorage.getItem('searchQueryType') as QueryType; + return validQueryTypes.has(storedQueryType) ? storedQueryType : QueryType.SMART; + } + let filter: SearchFilter = $state({ query: 'query' in searchQuery ? searchQuery.query : searchQuery.originalFileName || '', - queryType: 'smart', + queryType: defaultQueryType(), personIds: new SvelteSet('personIds' in searchQuery ? searchQuery.personIds : []), tagIds: new SvelteSet('tagIds' in searchQuery ? searchQuery.tagIds : []), location: { @@ -90,7 +99,7 @@ const resetForm = () => { filter = { query: '', - queryType: 'smart', + queryType: defaultQueryType(), // retain from localStorage or default personIds: new SvelteSet(), tagIds: new SvelteSet(), location: {}, @@ -142,8 +151,14 @@ const onsubmit = (event: Event) => { event.preventDefault(); + storeQueryType(filter.queryType); search(); }; + + // Will be called whenever queryType changes, not just onsubmit. + $effect(() => { + storeQueryType(filter.queryType); + }); diff --git a/web/src/lib/constants.ts b/web/src/lib/constants.ts index db04efa5db..b296e49f17 100644 --- a/web/src/lib/constants.ts +++ b/web/src/lib/constants.ts @@ -119,6 +119,14 @@ export const fallbackLocale = { name: 'English (US)', }; +export enum QueryType { + SMART = 'smart', + METADATA = 'metadata', + DESCRIPTION = 'description', +} + +export const validQueryTypes = new Set([QueryType.SMART, QueryType.METADATA, QueryType.DESCRIPTION]); + export const locales = [ { code: 'af-ZA', name: 'Afrikaans (South Africa)' }, { code: 'sq-AL', name: 'Albanian (Albania)' },