Moved notes to be above drawings

src/components/note/Note.js

@@ -19,6 +19,7 @@ function Note({
   draggable,
   onNoteDragStart,
   onNoteDragEnd,
+  fadeOnHover,
 }) {
   const { userId } = useContext(AuthContext);
   const { mapWidth, mapHeight, setPreventMapInteraction } = useContext(
@@ -89,6 +90,19 @@ function Note({
     }
   }
 
+  const [noteOpacity, setNoteOpacity] = useState(1);
+  function handlePointerEnter() {
+    if (fadeOnHover) {
+      setNoteOpacity(0.5);
+    }
+  }
+
+  function handlePointerLeave() {
+    if (noteOpacity !== 1.0) {
+      setNoteOpacity(1.0);
+    }
+  }
+
   const [fontSize, setFontSize] = useState(1);
   useEffect(() => {
     const text = textRef.current;
@@ -160,7 +174,9 @@ function Note({
       onMouseUp={handlePointerUp}
       onTouchStart={handlePointerDown}
       onTouchEnd={handlePointerUp}
-      opacity={note.visible ? 1.0 : 0.5}
+      onMouseEnter={handlePointerEnter}
+      onMouseLeave={handlePointerLeave}
+      opacity={note.visible ? noteOpacity : 0.5}
     >
       {!note.textOnly && (
         <Rect