Added erase all back in

src/components/map/Map.js

@@ -63,6 +63,7 @@ function Map({
       useBlending: true,
     },
   });
+
   function handleToolSettingChange(tool, change) {
     setToolSettings((prevSettings) => ({
       ...prevSettings,
@@ -73,6 +74,16 @@ function Map({
     }));
   }
 
+  function handleToolAction(action) {
+    if (action === "eraseAll") {
+      onMapDraw({
+        type: "remove",
+        shapeIds: mapShapes.map((s) => s.id),
+        timestamp: Date.now(),
+      });
+    }
+  }
+
   const [mapShapes, setMapShapes] = useState([]);
   function handleMapShapeAdd(shape) {
     onMapDraw({ type: "add", shapes: [shape], timestamp: Date.now() });
@@ -82,14 +93,6 @@ function Map({
     onMapDraw({ type: "remove", shapeIds: [shapeId], timestamp: Date.now() });
   }
 
-  function handleShapeRemoveAll() {
-    onMapDraw({
-      type: "remove",
-      shapeIds: mapShapes.map((s) => s.id),
-      timestamp: Date.now(),
-    });
-  }
-
   const [fogShapes, setFogShapes] = useState([]);
   function handleFogShapeAdd(shape) {
     onFogDraw({ type: "add", shapes: [shape], timestamp: Date.now() });
@@ -251,6 +254,7 @@ function Map({
       selectedToolId={selectedToolId}
       toolSettings={toolSettings}
       onToolSettingChange={handleToolSettingChange}
+      onToolAction={handleToolAction}
       disabledControls={disabledControls}
       onUndo={onMapUndo}
       onRedo={onMapRedo}

src/components/map/MapControls.js

@@ -28,6 +28,7 @@ function MapContols({
   onSelectedToolChange,
   toolSettings,
   onToolSettingChange,
+  onToolAction,
   disabledControls,
   onUndo,
   onRedo,
@@ -192,6 +193,7 @@ function MapContols({
             onSettingChange={(change) =>
               onToolSettingChange(selectedToolId, change)
             }
+            onToolAction={onToolAction}
           />
         </Box>
       );

src/components/map/controls/EraseToolSettings.js

@@ -3,10 +3,14 @@ import { Flex, IconButton } from "theme-ui";
 
 import EraseAllIcon from "../../../icons/EraseAllIcon";
 
-function EraseToolSettings({ onEraseAll }) {
+function EraseToolSettings({ onToolAction }) {
   return (
     <Flex sx={{ alignItems: "center" }}>
-      <IconButton aria-label="Erase All" title="Erase All" onClick={onEraseAll}>
+      <IconButton
+        aria-label="Erase All"
+        title="Erase All"
+        onClick={() => onToolAction("eraseAll")}
+      >
         <EraseAllIcon />
       </IconButton>
     </Flex>