Merge branch 'dashboard-canvas/add-widgets-menu/fix-bugs' into 'main'

removing redundancies

See merge request vkuchenik/website-framework!45

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

@@ -12,7 +12,7 @@ import SettingsCanvas from "./views/SettingsCanvas"
 import { DashboardCanvas } from "./views/DashboardCanvas";
 import { DASHBOARD_VIEWS } from "@/constants/viewKeys";
 
-export default function Canvas({ onCancel, isEditable, setIsEditable, isDelete, setIsDelete, view, setView, layout, setLayout, originalLayout, setOriginalLayout, onLayoutChange, onChangeView, darkMode }) {
+export default function Canvas({ onCancel, isEditable, setIsEditable, isDelete, setIsDelete, view, layout, setLayout, setOriginalLayout, onLayoutChange, onChangeView }) {
   const recipe = useRecipe({ key: "canvas" });
   const styles = recipe();
 
@@ -21,12 +21,9 @@ export default function Canvas({ onCancel, isEditable, setIsEditable, isDelete,
             {/* Check if view is a tab inside the Canvas Header */}
             { DASHBOARD_VIEWS.includes(view) && (
                 <DashboardCanvas
-                    darkMode={ darkMode }
                     view={ view }
-                    setView={ setView }
                     layout={ layout }
                     setLayout={ setLayout }
-                    originalLayout={ originalLayout }
                     setOriginalLayout={ setOriginalLayout }
                     onLayoutChange={ onLayoutChange }
                     onChangeView={ onChangeView }

client/src/components/layout/Canvas/components/SettingsButton.jsx

@@ -4,7 +4,6 @@ import AddWidgetMenu from "./AddWidgetMenu";
 
 export function SettingsButton({onAddWidget, onEditWidgets, onDeleteWidgets, widgetArray, setWidgetArray}) {    
   return (
-    // This uses Chakra's built in menu component
     <Menu.Root>
       <Menu.Trigger asChild >
           <IconButton variant="ghost" size="md" borderRadius="xl">

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

@@ -1,5 +1,5 @@
 import { HStack, Flex, Tabs } from "@chakra-ui/react";
-import { useState, useEffect } from "react";
+import { useState } from "react";
 import WidgetCanvas from "./DashboardCanvasNav/WidgetCanvas";
 import { SearchBar } from "../components/SearchBar";
 import { SettingsButton } from "../components/SettingsButton";
@@ -11,10 +11,7 @@ import { CancelButton } from "../components/CancelButton";
 import { SaveButton } from "../components/SaveButton";
 import DeleteAllButton from "../components/DeleteAllButton";
 
-export function DashboardCanvas({ view, setView, layout, setLayout, onLayoutChange }) {
+export function DashboardCanvas({ view, layout, setLayout, onLayoutChange, onCancel, isDelete, setIsDelete, isEditable, setIsEditable, onChangeView }) {
-  const [isEditable, setIsEditable] = useState(false); // editable=true means static=false (vice versa)
-  const [isDelete, setIsDelete] = useState(false);
-  const [originalLayout, setOriginalLayout] = useState([]);
   const [widgetArray, setWidgetArray] = useState([]);
 
   const onAddWidget = (ID) => {
@@ -35,7 +32,6 @@ export function DashboardCanvas({ view, setView, layout, setLayout, onLayoutChan
   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 => ({
@@ -48,7 +44,6 @@ export function DashboardCanvas({ view, setView, layout, setLayout, onLayoutChan
 
   const onSave = () => {
     console.log("saving widgets...");
-
     // Set all widgets back to static: true
     setLayout(prevLayout => 
       prevLayout.map(item => ({
@@ -56,7 +51,6 @@ export function DashboardCanvas({ view, setView, layout, setLayout, onLayoutChan
         static: true
     }))
   );
-
     setIsEditable(false);
     setIsDelete(false);
     setOriginalLayout([]); // Clear backup layout

client/src/components/layout/Dashboard.jsx

@@ -2,7 +2,6 @@ import Header from './Header/Header.jsx';
 import Sidebar from './Sidebar/Sidebar.jsx';
 import Canvas from './Canvas/Canvas.jsx';
 import { Grid, GridItem, useRecipe } from '@chakra-ui/react';
-import AlertLevel from './Canvas/components/AlertLevelWidget.jsx';
 import { useState } from 'react';
 
 export default function Dashboard() {
@@ -68,12 +67,9 @@ export default function Dashboard() {
         </GridItem>
         <GridItem colSpan={1} width="100%" overflow="auto">
           <Canvas 
-            darkMode={ darkMode }
             view={ view }
-            setView={ setView }
             layout={ layout }
             setLayout={ setLayout }
-            originalLayout={ originalLayout }
             setOriginalLayout={ setOriginalLayout }
             onLayoutChange={( newLayout ) => setLayout( newLayout )}
             onChangeView={ handleViewChange }