From b3ee1cc2023097b77ebf254fbbc7cd569922c85f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Chalifour?= <francois.chalifour@gmail.com>
Date: Fri, 2 Oct 2020 12:28:44 +0200
Subject: [PATCH] feat: select query when coming from a selection search

---
 packages/docsearch-react/src/DocSearchModal.tsx | 11 +++++++++--
 packages/docsearch-react/src/SearchBox.tsx      |  7 +++++++
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/packages/docsearch-react/src/DocSearchModal.tsx b/packages/docsearch-react/src/DocSearchModal.tsx
index 39379194..ff359a88 100644
--- a/packages/docsearch-react/src/DocSearchModal.tsx
+++ b/packages/docsearch-react/src/DocSearchModal.tsx
@@ -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>
 
diff --git a/packages/docsearch-react/src/SearchBox.tsx b/packages/docsearch-react/src/SearchBox.tsx
index 3d1a281f..304bba7b 100644
--- a/packages/docsearch-react/src/SearchBox.tsx
+++ b/packages/docsearch-react/src/SearchBox.tsx
@@ -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