fixed the menus in the map tool files to highlight and change the cursor when hovered over

src/maps/mapObjectTools/agMapTools.tsx

@@ -8,7 +8,8 @@ import {
   Typography,
   Box,
   FormControlLabel,
-  Checkbox
+  Checkbox,
+  lighten
 } from "@mui/material";
 import AddMarkerIcon from "products/AgIcons/AddMarker";
 import FieldMapIcon from "products/AgIcons/FieldMap";
@@ -45,8 +46,20 @@ const useStyles = makeStyles((theme: Theme) => ({
       marginLeft: -15
     },
     listItems: {
-      borderRadius: "3rem"
-    }
+      borderRadius: "3rem",
+      cursor: "pointer",
+      "&:hover": {
+        backgroundColor: lighten(theme.palette.background.default, 0.25)
+      }
+    },
+    clickableMenuItem: {
+      fill: "transparent",
+      "&:hover": {
+        fill: "lightGrey",
+        opacity: 0.3,
+        cursor: "pointer"
+      }
+    },
 }));
 
 interface Props {
@@ -204,7 +217,6 @@ export default function AgMapTools(props: Props) {
               <List className={classes.list}>
                 <ListItem
                   id="createBin"
-                  //button
                   onClick={e => {
                     changeNewStatus(true);
                     //setPlaceLine(false);
@@ -381,6 +393,8 @@ export default function AgMapTools(props: Props) {
                   //button
                   onClick={e => {
                     changeMarkerType(pond.ObjectType.OBJECT_TYPE_FIELDMARKER);
+                    toggleMeasurement(false)
+                    toggleEditorMode(undefined)
                     // if (watching) {
                     //   props.newMarker(geoPosition.longitude, geoPosition.latitude, "custom");
                     // }
@@ -400,6 +414,7 @@ export default function AgMapTools(props: Props) {
                   id="addMeasurementLine"
                   //button
                   onClick={e => {
+                    changeMarkerType(pond.ObjectType.OBJECT_TYPE_UNKNOWN)
                     toggleEditorMode("drawLine");
                     toggleObjectEditType(pond.ObjectType.OBJECT_TYPE_UNKNOWN); //TODO: make this a measurement object type in the future
                     toggleMeasurement(true);

src/maps/mapObjectTools/aviationMapTools.tsx

@@ -2,6 +2,7 @@ import {
   Box,
   Grid2 as Grid,
   IconButton,
+  lighten,
   List,
   ListItem,
   ListItemIcon,
@@ -33,7 +34,11 @@ const useStyles = makeStyles((theme: Theme) => ({
       boxShadow: "4px 4px 10px black"
     },
     listItems: {
-      borderRadius: "3rem"
+      borderRadius: "3rem",
+      cursor: "pointer",
+      "&:hover": {
+        backgroundColor: lighten(theme.palette.background.default, 0.25)
+      }
     },
     liFont: {
       fontWeight: 700,

src/maps/mapObjectTools/constructionMapTools.tsx

@@ -2,6 +2,7 @@ import {
   //Box,
   Grid2 as Grid,
   IconButton,
+  lighten,
   List,
   ListItem,
   ListItemIcon,
@@ -37,7 +38,11 @@ const useStyles = makeStyles((theme: Theme) => ({
       boxShadow: "4px 4px 10px black"
     },
     listItems: {
-      borderRadius: "3rem"
+      borderRadius: "3rem",
+      cursor: "pointer",
+      "&:hover": {
+        backgroundColor: lighten(theme.palette.background.default, 0.25)
+      }
     },
     liFont: {
       fontWeight: 700,