diff --git a/src/components/map/MapSettings.js b/src/components/map/MapSettings.js
index 79c6742..bfabeec 100644
--- a/src/components/map/MapSettings.js
+++ b/src/components/map/MapSettings.js
@@ -26,6 +26,9 @@ function MapSettings({
     }
   }
 
+  const mapEmpty = !map || isEmpty(map);
+  const mapStateEmpty = !mapState || isEmpty(mapState);
+
   return (
     <Flex sx={{ flexDirection: "column" }}>
       <Flex>
@@ -38,7 +41,7 @@ function MapSettings({
             onChange={(e) =>
               onSettingsChange("gridX", parseInt(e.target.value))
             }
-            disabled={!map || map.type === "default"}
+            disabled={mapEmpty || map.type === "default"}
             min={1}
             my={1}
           />
@@ -52,7 +55,7 @@ function MapSettings({
             onChange={(e) =>
               onSettingsChange("gridY", parseInt(e.target.value))
             }
-            disabled={!map || map.type === "default"}
+            disabled={mapEmpty || map.type === "default"}
             min={1}
             my={1}
           />
@@ -66,7 +69,7 @@ function MapSettings({
               name="name"
               value={(map && map.name) || ""}
               onChange={(e) => onSettingsChange("name", e.target.value)}
-              disabled={!map || map.type === "default"}
+              disabled={mapEmpty || map.type === "default"}
               my={1}
             />
           </Box>
@@ -74,7 +77,7 @@ function MapSettings({
             <Label>
               <Checkbox
                 checked={map && map.showGrid}
-                disabled={!map || map.type === "default"}
+                disabled={mapEmpty || map.type === "default"}
                 onChange={(e) => onSettingsChange("showGrid", e.target.checked)}
               />
               Show Grid
@@ -86,24 +89,28 @@ function MapSettings({
             <Flex my={1}>
               <Label>
                 <Checkbox
-                  checked={mapState && mapState.editFlags.includes("fog")}
-                  disabled={!mapState}
+                  checked={!mapStateEmpty && mapState.editFlags.includes("fog")}
+                  disabled={mapStateEmpty}
                   onChange={(e) => handleFlagChange(e, "fog")}
                 />
                 Fog
               </Label>
               <Label>
                 <Checkbox
-                  checked={mapState && mapState.editFlags.includes("drawing")}
-                  disabled={mapState === null}
+                  checked={
+                    !mapStateEmpty && mapState.editFlags.includes("drawing")
+                  }
+                  disabled={mapStateEmpty}
                   onChange={(e) => handleFlagChange(e, "drawing")}
                 />
                 Drawings
               </Label>
               <Label>
                 <Checkbox
-                  checked={mapState && mapState.editFlags.includes("tokens")}
-                  disabled={!mapState}
+                  checked={
+                    !mapStateEmpty && mapState.editFlags.includes("tokens")
+                  }
+                  disabled={mapStateEmpty}
                   onChange={(e) => handleFlagChange(e, "tokens")}
                 />
                 Tokens
@@ -124,7 +131,6 @@ function MapSettings({
         }}
         aria-label={showMore ? "Show Less" : "Show More"}
         title={showMore ? "Show Less" : "Show More"}
-        disabled={!map || isEmpty(map)}
       >
         <ExpandMoreIcon />
       </IconButton>
diff --git a/src/components/token/TokenSettings.js b/src/components/token/TokenSettings.js
index b01103a..92d2f20 100644
--- a/src/components/token/TokenSettings.js
+++ b/src/components/token/TokenSettings.js
@@ -2,6 +2,7 @@ import React from "react";
 import { Flex, Box, Input, IconButton, Label, Checkbox } from "theme-ui";
 
 import ExpandMoreIcon from "../../icons/ExpandMoreIcon";
+import { isEmpty } from "../../helpers/shared";
 
 function TokenSettings({
   token,
@@ -9,6 +10,7 @@ function TokenSettings({
   showMore,
   onShowMoreChange,
 }) {
+  const tokenEmpty = !token || isEmpty(token);
   return (
     <Flex sx={{ flexDirection: "column" }}>
       <Flex>
@@ -21,7 +23,7 @@ function TokenSettings({
             onChange={(e) =>
               onSettingsChange("defaultSize", parseInt(e.target.value))
             }
-            disabled={!token || token.type === "default"}
+            disabled={tokenEmpty || token.type === "default"}
             min={1}
             my={1}
           />
@@ -35,7 +37,7 @@ function TokenSettings({
               name="name"
               value={(token && token.name) || ""}
               onChange={(e) => onSettingsChange("name", e.target.value)}
-              disabled={!token || token.type === "default"}
+              disabled={tokenEmpty || token.type === "default"}
               my={1}
             />
           </Box>
@@ -44,7 +46,7 @@ function TokenSettings({
               <Label>
                 <Checkbox
                   checked={token && token.isVehicle}
-                  disabled={!token || token.type === "default"}
+                  disabled={tokenEmpty || token.type === "default"}
                   onChange={(e) =>
                     onSettingsChange("isVehicle", e.target.checked)
                   }
@@ -56,7 +58,7 @@ function TokenSettings({
               <Label>
                 <Checkbox
                   checked={token && token.hideInSidebar}
-                  disabled={!token || token.type === "default"}
+                  disabled={tokenEmpty || token.type === "default"}
                   onChange={(e) =>
                     onSettingsChange("hideInSidebar", e.target.checked)
                   }
@@ -79,7 +81,6 @@ function TokenSettings({
         }}
         aria-label={showMore ? "Show Less" : "Show More"}
         title={showMore ? "Show Less" : "Show More"}
-        disabled={!token}
       >
         <ExpandMoreIcon />
       </IconButton>