From 928b9ca7b899f22cf3e40bf497d5bd671f2f613f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Chalifour?= <francois.chalifour@gmail.com>
Date: Fri, 21 Aug 2020 14:30:57 +0200
Subject: [PATCH] fix(docsearch): allow a single instance to open

If a website uses two DocSearch instances (e.g., one for mobile and one for desktop), it resulted in a double modal being show when hitting `Ctrl + K`.

This is fixed by checking that the active DocSearch CSS class is not applied on `body` before opening the modal.
---
 src/useDocSearchKeyboardEvents.ts | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/useDocSearchKeyboardEvents.ts b/src/useDocSearchKeyboardEvents.ts
index 3d06c964..09db4de8 100644
--- a/src/useDocSearchKeyboardEvents.ts
+++ b/src/useDocSearchKeyboardEvents.ts
@@ -29,6 +29,13 @@ export function useDocSearchKeyboardEvents({
 }: UseDocSearchKeyboardEventsProps) {
   React.useEffect(() => {
     function onKeyDown(event: KeyboardEvent) {
+      function open() {
+        // We check that no other DocSearch modal is showing before opening
+        // another one.
+        if (!document.body.classList.contains('DocSearch--active')) {
+          onOpen();
+        }
+      }
       if (
         (event.keyCode === 27 && isOpen) ||
         // The `Cmd+K` shortcut both opens and closes the modal.
@@ -41,8 +48,8 @@ export function useDocSearchKeyboardEvents({
 
         if (isOpen) {
           onClose();
-        } else {
-          onOpen();
+        } else if (!document.body.classList.contains('DocSearch--active')) {
+          open();
         }
       }