diff --git a/web/apps/photos/src/pages/gallery.tsx b/web/apps/photos/src/pages/gallery.tsx index 2fc5e447a4..edfdaa9a47 100644 --- a/web/apps/photos/src/pages/gallery.tsx +++ b/web/apps/photos/src/pages/gallery.tsx @@ -980,16 +980,18 @@ export default function Gallery() { }); }; - const updateSearch: UpdateSearch = (newSearch, summary) => { - if (newSearch?.collection) { - setActiveCollectionID(newSearch?.collection); + const handleSelectSearchOption = ( + searchOption: SearchOption | undefined, + ) => { + if (searchOption?.suggestion.type == "collection") { setIsInSearchMode(false); + setSelectedSearchOption(undefined); + setActiveCollectionID(searchOption.suggestion.collectionID); } else { - setSearchQuery(newSearch); - setIsInSearchMode(!!newSearch); - setSetSearchResultSummary(summary); + setIsInSearchMode(!!searchOption); + setSelectedSearchOption(searchOption); } - setIsClipSearchResult(!!newSearch?.clip); + setIsClipSearchResult(searchOption?.suggestion.type == "clip"); }; const openUploader = (intent?: UploadTypeSelectorIntent) => { @@ -1098,7 +1100,7 @@ export default function Gallery() { openUploader={openUploader} isInSearchMode={isInSearchMode} setIsInSearchMode={setIsInSearchMode} - updateSearch={updateSearch} + onSelectSearchOption={handleSelectSearchOption} /> )} diff --git a/web/packages/new/photos/components/SearchBar.tsx b/web/packages/new/photos/components/SearchBar.tsx index 895bdef2c0..a2adaff281 100644 --- a/web/packages/new/photos/components/SearchBar.tsx +++ b/web/packages/new/photos/components/SearchBar.tsx @@ -61,7 +61,7 @@ export interface SearchBarProps { /** * Set or clear the selected {@link SearchOption}. */ - setSelectedSearchOption: (o: SearchOption | undefined) => void; + onSelectSearchOption: (o: SearchOption | undefined) => void; } /** @@ -82,7 +82,7 @@ export interface SearchBarProps { export const SearchBar: React.FC = ({ setIsInSearchMode, isInSearchMode, - setSelectedSearchOption, + onSelectSearchOption, }) => { const isMobileWidth = useIsMobileWidth(); @@ -93,7 +93,7 @@ export const SearchBar: React.FC = ({ {isMobileWidth && !isInSearchMode ? ( ) : ( - + )} ); @@ -114,7 +114,7 @@ const MobileSearchArea: React.FC = ({ onSearch }) => ( const SearchInput: React.FC> = ({ isInSearchMode, - setSelectedSearchOption, + onSelectSearchOption, }) => { // A ref to the top level Select. const selectRef = useRef | null>(null); @@ -132,7 +132,7 @@ const SearchInput: React.FC> = ({ setValue(value ?? undefined); setInputValue(value?.suggestion.label ?? ""); // TODO-Cluster: - if (value) setSelectedSearchOption(value); + if (value) onSelectSearchOption(value); // The Select has a blurInputOnSelect prop, but that makes the input // field lose focus, not the entire menu (e.g. when pressing twice). @@ -150,14 +150,14 @@ const SearchInput: React.FC> = ({ const resetSearch = () => { setValue(undefined); setInputValue(""); - setSelectedSearchOption(undefined); + onSelectSearchOption(undefined); }; const handleSelectCGroup = (value: SearchOption) => { // Dismiss the search menu. selectRef.current?.blur(); setValue(value); - setSelectedSearchOption(undefined); + onSelectSearchOption(undefined); }; const handleFocus = () => {