diff --git a/client/src/components/layout/Canvas/views/DashboardCanvas.jsx b/client/src/components/layout/Canvas/views/DashboardCanvas.jsx index 0e11076..a6b7d0c 100644 --- a/client/src/components/layout/Canvas/views/DashboardCanvas.jsx +++ b/client/src/components/layout/Canvas/views/DashboardCanvas.jsx @@ -14,42 +14,53 @@ import DeleteAllButton from "../components/DeleteAllButton"; export function DashboardCanvas({ onCancel, isEditable, setIsEditable, isDelete, setIsDelete, view, layout, setLayout, originalLayout, setOriginalLayout, onLayoutChange, onChangeView }) { const [newCounter, setNewCounter] = useState(3); + // Adding a widget triggers Edit mode const onAddWidget = () => { const newId = newCounter.toString(); + setLayout(prev => [ - ...prev, + ...prev, { i: newId, x: (prev.length * 3) % 12, y: Infinity, w: 3, h: 3, + static: false, } ]); setNewCounter(prev => prev + 1); + onEditWidgets(); }; - useEffect(() => { - console.log("static change effect"); - setLayout(prevLayout => - prevLayout.map(item => ({ - ...item, - static: !isEditable // static false means resizable/editable - })) - ); - }, [isEditable]); - const onEditWidgets = () => { console.log("widgets are now editable"); setOriginalLayout(layout); // Backup layout before editing + + // Set all widgets to editable, static: false + setLayout(prevLayout => + prevLayout.map(item => ({ + ...item, + static: false + })) + ); setIsEditable(true); // Enable edit mode } const onSave = () => { console.log("saving widgets..."); + + // Set all widgets back to static: true + setLayout(prevLayout => + prevLayout.map(item => ({ + ...item, + static: true + })) + ); + setIsEditable(false); setIsDelete(false); - setOriginalLayout([]) // Clear backup layout + setOriginalLayout([]); // Clear backup layout } const onDeleteWidgets = () => {