seperate default options
This commit is contained in:
parent
bada042344
commit
e894954239
|
@ -2,7 +2,10 @@ import { IconButton } from '@mui/material';
|
|||
import debounce from 'debounce-promise';
|
||||
import { AppContext } from 'pages/_app';
|
||||
import React, { useContext, useEffect, useRef, useState } from 'react';
|
||||
import { getAutoCompleteSuggestions } from 'services/searchService';
|
||||
import {
|
||||
getAutoCompleteSuggestions,
|
||||
getDefaultOptions,
|
||||
} from 'services/searchService';
|
||||
import {
|
||||
Bbox,
|
||||
DateValue,
|
||||
|
@ -38,9 +41,18 @@ export default function SearchInput(props: Iprops) {
|
|||
const handleChange = (value: SearchOption) => {
|
||||
setValue(value);
|
||||
};
|
||||
const [defaultOptions, setDefaultOptions] = useState([]);
|
||||
|
||||
useEffect(() => search(value), [value]);
|
||||
|
||||
useEffect(() => {
|
||||
const main = async () => {
|
||||
const defaultOptions = await getDefaultOptions();
|
||||
setDefaultOptions(defaultOptions);
|
||||
};
|
||||
main();
|
||||
}, []);
|
||||
|
||||
const resetSearch = () => {
|
||||
if (props.isOpen) {
|
||||
appContext.startLoading();
|
||||
|
@ -96,6 +108,7 @@ export default function SearchInput(props: Iprops) {
|
|||
// unwanted side effect: placeholder is not shown on focus/click
|
||||
// https://github.com/JedWatson/react-select/issues/1879
|
||||
// for correct fix AsyncSelect can be extended to support default options reloading on focus/click
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const handleOnFocus = () => {
|
||||
const emptySearch = ' ';
|
||||
selectRef.current.state.inputValue = emptySearch;
|
||||
|
@ -122,10 +135,11 @@ export default function SearchInput(props: Iprops) {
|
|||
placeholder={constants.SEARCH_HINT()}
|
||||
loadOptions={getOptions}
|
||||
onChange={handleChange}
|
||||
onFocus={handleOnFocus}
|
||||
// onFocus={handleOnFocus}
|
||||
isClearable
|
||||
escapeClearsValue
|
||||
styles={SelectStyles}
|
||||
defaultOptions={defaultOptions}
|
||||
noOptionsMessage={() => null}
|
||||
/>
|
||||
|
||||
|
|
|
@ -28,26 +28,28 @@ const ENDPOINT = getEndpoint();
|
|||
|
||||
const DIGITS = new Set(['0', '1', '2', '3', '4', '5', '6', '7', '8', '9']);
|
||||
|
||||
export const getDefaultOptions = async () => {
|
||||
return [
|
||||
await getIndexStatusSuggestion(),
|
||||
...(await getAllPeopleSuggestion()),
|
||||
];
|
||||
};
|
||||
|
||||
export const getAutoCompleteSuggestions =
|
||||
(files: EnteFile[], collections: Collection[]) =>
|
||||
async (searchPhrase: string) => {
|
||||
searchPhrase = searchPhrase.trim().toLowerCase();
|
||||
const suggestions = [];
|
||||
suggestions.push(await getIndexStatusSuggestion());
|
||||
suggestions.push(...(await getAllPeopleSuggestion()));
|
||||
if (!searchPhrase?.length) {
|
||||
return suggestions;
|
||||
return [];
|
||||
}
|
||||
suggestions.push(
|
||||
...[
|
||||
...getHolidaySuggestion(searchPhrase),
|
||||
...getYearSuggestion(searchPhrase),
|
||||
...getDateSuggestion(searchPhrase),
|
||||
...getCollectionSuggestion(searchPhrase, collections),
|
||||
...getFileSuggestion(searchPhrase, files),
|
||||
...(await getLocationSuggestions(searchPhrase)),
|
||||
]
|
||||
);
|
||||
const suggestions = [
|
||||
...getHolidaySuggestion(searchPhrase),
|
||||
...getYearSuggestion(searchPhrase),
|
||||
...getDateSuggestion(searchPhrase),
|
||||
...getCollectionSuggestion(searchPhrase, collections),
|
||||
...getFileSuggestion(searchPhrase, files),
|
||||
...(await getLocationSuggestions(searchPhrase)),
|
||||
];
|
||||
|
||||
const previewImageAppendedOptions: SearchOption[] = suggestions
|
||||
.map((suggestion) => ({
|
||||
|
@ -63,8 +65,8 @@ export const getAutoCompleteSuggestions =
|
|||
fileCount: resultFiles.length,
|
||||
previewFiles: resultFiles.slice(0, 3),
|
||||
};
|
||||
});
|
||||
// .filter((option) => option.fileCount);
|
||||
})
|
||||
.filter((option) => option.fileCount);
|
||||
|
||||
return previewImageAppendedOptions;
|
||||
};
|
||||
|
|
Loading…
Reference in a new issue