From e36058263c94edc1c2d47292b8ab780f3e725895 Mon Sep 17 00:00:00 2001
From: Mitchell McCaffrey <mitchemmc@gmail.com>
Date: Mon, 8 Feb 2021 17:06:54 +1100
Subject: [PATCH] Added more loading spinners to map and token operations

---
 src/components/LoadingOverlay.js | 2 +-
 src/modals/SelectMapModal.js     | 4 ++++
 src/modals/SelectTokensModal.js  | 7 ++++---
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/components/LoadingOverlay.js b/src/components/LoadingOverlay.js
index d23eb15..887f9a1 100644
--- a/src/components/LoadingOverlay.js
+++ b/src/components/LoadingOverlay.js
@@ -3,7 +3,7 @@ import { Box } from "theme-ui";
 
 import Spinner from "./Spinner";
 
-function LoadingOverlay(bg) {
+function LoadingOverlay({ bg }) {
   return (
     <Box
       sx={{
diff --git a/src/modals/SelectMapModal.js b/src/modals/SelectMapModal.js
index c19ea0e..488eb59 100644
--- a/src/modals/SelectMapModal.js
+++ b/src/modals/SelectMapModal.js
@@ -264,6 +264,7 @@ function SelectMapModal({
 
   const [isMapsRemoveModalOpen, setIsMapsRemoveModalOpen] = useState(false);
   async function handleMapsRemove() {
+    setIsLoading(true);
     setIsMapsRemoveModalOpen(false);
     await removeMaps(selectedMapIds);
     setSelectedMapIds([]);
@@ -271,10 +272,12 @@ function SelectMapModal({
     if (currentMap && selectedMapIds.includes(currentMap.id)) {
       onMapChange(null, null);
     }
+    setIsLoading(false);
   }
 
   const [isMapsResetModalOpen, setIsMapsResetModalOpen] = useState(false);
   async function handleMapsReset() {
+    setIsLoading(true);
     setIsMapsResetModalOpen(false);
     for (let id of selectedMapIds) {
       const newState = await resetMap(id);
@@ -283,6 +286,7 @@ function SelectMapModal({
         onMapStateChange(newState);
       }
     }
+    setIsLoading(false);
   }
 
   // Either single, multiple or range
diff --git a/src/modals/SelectTokensModal.js b/src/modals/SelectTokensModal.js
index 0b0f6c2..2c4e009 100644
--- a/src/modals/SelectTokensModal.js
+++ b/src/modals/SelectTokensModal.js
@@ -22,9 +22,6 @@ import { useTokenData } from "../contexts/TokenDataContext";
 import { useAuth } from "../contexts/AuthContext";
 import { useKeyboard } from "../contexts/KeyboardContext";
 
-// 300 pixels total
-const thumbnailResolution = { size: 300, quality: 0.5 };
-
 function SelectTokensModal({ isOpen, onRequestClose }) {
   const { userId } = useAuth();
   const {
@@ -159,13 +156,17 @@ function SelectTokensModal({ isOpen, onRequestClose }) {
 
   const [isTokensRemoveModalOpen, setIsTokensRemoveModalOpen] = useState(false);
   async function handleTokensRemove() {
+    setIsLoading(true);
     setIsTokensRemoveModalOpen(false);
     await removeTokens(selectedTokenIds);
     setSelectedTokenIds([]);
+    setIsLoading(false);
   }
 
   async function handleTokensHide(hideInSidebar) {
+    setIsLoading(true);
     await updateTokens(selectedTokenIds, { hideInSidebar });
+    setIsLoading(false);
   }
 
   // Either single, multiple or range