From cf84a256a4541b4bcee7df6129a6007a6c034dc5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Chalifour?= <francois.chalifour@gmail.com>
Date: Tue, 7 Jul 2020 15:32:47 +0200
Subject: [PATCH] fix(docsearch): support initial query

---
 src/DocSearch.tsx                 | 12 +++++++++---
 src/DocSearchModal.tsx            |  4 +++-
 src/useDocSearchKeyboardEvents.ts |  2 +-
 3 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/DocSearch.tsx b/src/DocSearch.tsx
index bce446bc..9ff7e544 100644
--- a/src/DocSearch.tsx
+++ b/src/DocSearch.tsx
@@ -30,10 +30,15 @@ export interface DocSearchProps
 export function DocSearch(props: DocSearchProps) {
   const [isOpen, setIsOpen] = React.useState(false);
   const searchButtonRef = React.useRef<HTMLButtonElement>(null);
+  const [initialQuery, setInitialQuery] = React.useState('');
 
-  const onOpen = React.useCallback(() => {
-    setIsOpen(true);
-  }, [setIsOpen]);
+  const onOpen = React.useCallback(
+    ({ query = '' } = {}) => {
+      setIsOpen(true);
+      setInitialQuery(query);
+    },
+    [setIsOpen]
+  );
 
   const onClose = React.useCallback(() => {
     setIsOpen(false);
@@ -49,6 +54,7 @@ export function DocSearch(props: DocSearchProps) {
         createPortal(
           <DocSearchModal
             {...props}
+            initialQuery={initialQuery}
             initialScrollY={window.scrollY}
             onClose={onClose}
           />,
diff --git a/src/DocSearchModal.tsx b/src/DocSearchModal.tsx
index 85dfeae3..afd4ac9c 100644
--- a/src/DocSearchModal.tsx
+++ b/src/DocSearchModal.tsx
@@ -23,6 +23,7 @@ import { ScreenState } from './ScreenState';
 import { Footer } from './Footer';
 
 interface DocSearchModalProps extends DocSearchProps {
+  initialQuery?: string;
   initialScrollY: number;
   onClose?(): void;
 }
@@ -42,6 +43,7 @@ export function DocSearchModal({
   hitComponent = Hit,
   resultsFooterComponent = () => null,
   navigator,
+  initialQuery: queryFromProp = '',
   initialScrollY = 0,
 }: DocSearchModalProps) {
   const [state, setState] = React.useState<
@@ -57,7 +59,7 @@ export function DocSearchModal({
   const inputRef = React.useRef<HTMLInputElement | null>(null);
   const snipetLength = React.useRef<number>(10);
   const initialQuery = React.useRef(
-    typeof window !== 'undefined'
+    queryFromProp || typeof window !== 'undefined'
       ? window.getSelection()!.toString().slice(0, MAX_QUERY_SIZE)
       : ''
   ).current;
diff --git a/src/useDocSearchKeyboardEvents.ts b/src/useDocSearchKeyboardEvents.ts
index 79040e3e..99f9417d 100644
--- a/src/useDocSearchKeyboardEvents.ts
+++ b/src/useDocSearchKeyboardEvents.ts
@@ -30,7 +30,7 @@ export function useDocSearchKeyboardEvents({
         searchButtonRef.current === document.activeElement
       ) {
         if (/[a-zA-Z0-9]/.test(String.fromCharCode(event.keyCode))) {
-          onOpen();
+          onOpen({ query: event.keyCode });
         }
       }
     }