1
0
Fork 0

feat: select query when coming from a selection search

This commit is contained in:
François Chalifour 2020-10-02 12:28:44 +02:00
parent ec278ee3d9
commit b3ee1cc202
2 changed files with 16 additions and 2 deletions

View file

@ -56,11 +56,14 @@ export function DocSearchModal({
const dropdownRef = React.useRef<HTMLDivElement | null>(null);
const inputRef = React.useRef<HTMLInputElement | null>(null);
const snippetLength = React.useRef<number>(10);
const initialQuery = React.useRef(
initialQueryFromProp || typeof window !== 'undefined'
const initialQueryFromSelection = React.useRef(
typeof window !== 'undefined'
? window.getSelection()!.toString().slice(0, MAX_QUERY_SIZE)
: ''
).current;
const initialQuery = React.useRef(
initialQueryFromProp || initialQueryFromSelection
).current;
const searchClient = useSearchClient(appId, apiKey, transformSearchClient);
const favoriteSearches = React.useRef(
@ -373,6 +376,10 @@ export function DocSearchModal({
autoFocus={initialQuery.length === 0}
onClose={onClose}
inputRef={inputRef}
isFromSelection={
Boolean(initialQuery) &&
initialQuery === initialQueryFromSelection
}
/>
</header>

View file

@ -21,6 +21,7 @@ interface SearchBoxProps
autoFocus: boolean;
inputRef: MutableRefObject<HTMLInputElement | null>;
onClose(): void;
isFromSelection: boolean;
}
export function SearchBox(props: SearchBoxProps) {
@ -34,6 +35,12 @@ export function SearchBox(props: SearchBoxProps) {
}
}, [props.autoFocus, props.inputRef]);
React.useEffect(() => {
if (props.isFromSelection && props.inputRef.current) {
props.inputRef.current.select();
}
}, [props.isFromSelection, props.inputRef]);
return (
<>
<form