From 78dac55d7aa1f3598e1607702e4b8684590db401 Mon Sep 17 00:00:00 2001
From: Mitchell McCaffrey <mitchemmc@gmail.com>
Date: Thu, 17 Jun 2021 11:30:06 +1000
Subject: [PATCH] Fix selection of text when 3D touching a token on iOS

---
 src/components/token/TokenBar.js | 9 ++++++++-
 src/hooks/usePreventSelect.js    | 9 +++++++++
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/src/components/token/TokenBar.js b/src/components/token/TokenBar.js
index 1eb3554..d59e221 100644
--- a/src/components/token/TokenBar.js
+++ b/src/components/token/TokenBar.js
@@ -165,7 +165,14 @@ function TokenBar({ onMapTokensStateCreate }) {
             padding: "0 16px",
           }}
         >
-          <Grid columns="1fr" gap={2} py={2}>
+          <Grid
+            columns="1fr"
+            gap={2}
+            py={2}
+            // Prevent selection on 3D touch for iOS
+            onTouchStart={preventSelect}
+            onTouchEnd={resumeSelect}
+          >
             {tokenGroups.map((group) => renderToken(group))}
           </Grid>
         </SimpleBar>
diff --git a/src/hooks/usePreventSelect.js b/src/hooks/usePreventSelect.js
index d20bb40..82d36bd 100644
--- a/src/hooks/usePreventSelect.js
+++ b/src/hooks/usePreventSelect.js
@@ -1,5 +1,14 @@
 function usePreventSelect() {
+  function clearSelection() {
+    if (window.getSelection) {
+      window.getSelection().removeAllRanges();
+    }
+    if (document.selection) {
+      document.selection.empty();
+    }
+  }
   function preventSelect() {
+    clearSelection();
     document.body.classList.add("no-select");
   }