Add a global image drop for dropping directly to the map screen

src/routes/Game.js

@@ -8,6 +8,7 @@ import OfflineBanner from "../components/banner/OfflineBanner";
 import LoadingOverlay from "../components/LoadingOverlay";
 import Link from "../components/Link";
 import MapLoadingOverlay from "../components/map/MapLoadingOverlay";
+import GlobalImageDrop from "../components/file/GlobalImageDrop";
 
 import AuthModal from "../modals/AuthModal";
 import GameExpiredModal from "../modals/GameExpiredModal";
@@ -114,7 +115,7 @@ function Game() {
               <PlayerProvider session={session}>
                 <PartyProvider session={session}>
                   <MapStageProvider value={mapStageRef}>
-                    <Flex sx={{ flexDirection: "column", height: "100%" }}>
+                    <GlobalImageDrop>
                       <Flex
                         sx={{
                           justifyContent: "space-between",
@@ -125,7 +126,7 @@ function Game() {
                         <NetworkedParty session={session} gameId={gameId} />
                         <NetworkedMapAndTokens session={session} />
                       </Flex>
-                    </Flex>
+                    </GlobalImageDrop>
                     <Banner
                       isOpen={!!peerError}
                       onRequestClose={() => setPeerError(null)}