Add navigation prevention while in Edit mode to Avatar menu options in Header

client/src/components/layout/Canvas/views/DashboardCanvas.jsx

@@ -11,7 +11,7 @@ import { CancelButton } from "../components/CancelButton";
 import { SaveButton } from "../components/SaveButton";
 import DeleteAllButton from "../components/DeleteAllButton";
 
-export function DashboardCanvas({ isEditable, setIsEditable, isDelete, setIsDelete, view, setView, layout, setLayout, originalLayout, setOriginalLayout, onLayoutChange, onChangeView }) {
+export function DashboardCanvas({ onCancel, isEditable, setIsEditable, isDelete, setIsDelete, view, setView, layout, setLayout, originalLayout, setOriginalLayout, onLayoutChange, onChangeView }) {
   // const [isEditable, setIsEditable] = useState(false); // editable=true means static=false (vice versa)
   // const [isDelete, setIsDelete] = useState(false);
   const [newCounter, setNewCounter] = useState(3);
@@ -55,18 +55,19 @@ export function DashboardCanvas({ isEditable, setIsEditable, isDelete, setIsDele
     setOriginalLayout([]) // Clear backup layout
   }
 
-  const onCancel = () => {
-    console.log("canceling changes...");
-    if (originalLayout.length) { 
-      setLayout(originalLayout.map(item => ({
-        ...item, 
-        static: true
-      })));
-    };
-    setIsEditable(false);
-    setIsDelete(false);
-    setOriginalLayout([]); 
-  }
+  // Lifting up to Dashboard.jsx for prop drilling
+  // const onCancel = () => {
+  //   console.log("canceling changes...");
+  //   if (originalLayout.length) { 
+  //     setLayout(originalLayout.map(item => ({
+  //       ...item, 
+  //       static: true
+  //     })));
+  //   };
+  //   setIsEditable(false);
+  //   setIsDelete(false);
+  //   setOriginalLayout([]); 
+  // }
 
   const onDeleteWidgets = () => {
     console.log("Start deleting widgets...");