Web-Frontend/client/src/components/layout/Canvas/Canvas.jsx

// This Canvas component will be used to dynamically populate 
// the main canvas section of the web App with a default state
// of 'WidgetCanvas' 
import { useState } from "react";
import { Box } from "@chakra-ui/react";
import CanvasHeader from "./CanvasHeader";
import WidgetCanvas from "./views/WidgetCanvas";
// import MapCanvas from "./views/MapCanvas";
// import AdminCanvas from "./views/AdminCanvas";

export default function Canvas({ view }) {
    // const [view, setView] = useState("widget");

    return (
        <Box height="100%" width="100%">
            <CanvasHeader />
            {view === "widget" && <WidgetCanvas />}
            {/* {view === "map" && <MapCanvas />} */}
            {/* {view === "admin" && <AdminCanvas />} */}
        </Box>
    );
}