From fb6e7e036b2c43ac3393b1ee62f08fcd57409ab4 Mon Sep 17 00:00:00 2001
From: Mitchell McCaffrey <mitchemmc@gmail.com>
Date: Sat, 10 Oct 2020 11:29:42 +1100
Subject: [PATCH] Fix bug with multi select and alt+tab

---
 src/modals/SelectMapModal.js    | 14 +++++++++++++-
 src/modals/SelectTokensModal.js | 14 +++++++++++++-
 2 files changed, 26 insertions(+), 2 deletions(-)

diff --git a/src/modals/SelectMapModal.js b/src/modals/SelectMapModal.js
index c47c27e..c61b256 100644
--- a/src/modals/SelectMapModal.js
+++ b/src/modals/SelectMapModal.js
@@ -1,4 +1,4 @@
-import React, { useRef, useState, useContext } from "react";
+import React, { useRef, useState, useContext, useEffect } from "react";
 import { Button, Flex, Label } from "theme-ui";
 import shortid from "shortid";
 import Case from "case";
@@ -309,6 +309,18 @@ function SelectMapModal({
 
   useKeyboard(handleKeyDown, handleKeyUp);
 
+  // Set select mode to single when alt+tabing
+  useEffect(() => {
+    function handleBlur() {
+      setSelectMode("single");
+    }
+
+    window.addEventListener("blur", handleBlur);
+    return () => {
+      window.removeEventListener("blur", handleBlur);
+    };
+  }, []);
+
   return (
     <Modal
       isOpen={isOpen}
diff --git a/src/modals/SelectTokensModal.js b/src/modals/SelectTokensModal.js
index 489663b..04066b3 100644
--- a/src/modals/SelectTokensModal.js
+++ b/src/modals/SelectTokensModal.js
@@ -1,4 +1,4 @@
-import React, { useRef, useContext, useState } from "react";
+import React, { useRef, useContext, useState, useEffect } from "react";
 import { Flex, Label, Button } from "theme-ui";
 import shortid from "shortid";
 import Case from "case";
@@ -183,6 +183,18 @@ function SelectTokensModal({ isOpen, onRequestClose }) {
 
   useKeyboard(handleKeyDown, handleKeyUp);
 
+  // Set select mode to single when alt+tabing
+  useEffect(() => {
+    function handleBlur() {
+      setSelectMode("single");
+    }
+
+    window.addEventListener("blur", handleBlur);
+    return () => {
+      window.removeEventListener("blur", handleBlur);
+    };
+  }, []);
+
   return (
     <Modal
       isOpen={isOpen}