diff --git a/apps/canvas/front/src/Canvas.tsx b/apps/canvas/front/src/Canvas.tsx
index c794ade..453176c 100644
--- a/apps/canvas/front/src/Canvas.tsx
+++ b/apps/canvas/front/src/Canvas.tsx
@@ -3,19 +3,25 @@
 import { Details } from "@/components/details";
 import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from "./components/ui/resizable";
 import { Tools } from "./Tootls";
+import { useStateStore } from "./lib/state";
 
 export function CanvasBuilder() {
+	const store = useStateStore();
 	return (
 		<ResizablePanelGroup direction="horizontal" className="w-full h-full">
 			<ResizablePanel defaultSize={80}>
 				<ResizablePanelGroup direction="vertical">
 					<ResizablePanel defaultSize={80}>
 						<ResizablePanelGroup direction="horizontal">
-							<ResizablePanel defaultSize={15}>
-								<Resources />
-							</ResizablePanel>
-							<ResizableHandle withHandle />
-							<ResizablePanel defaultSize={85}>
+							{store.mode === "edit" && (
+								<>
+									<ResizablePanel defaultSize={15}>
+										<Resources />
+									</ResizablePanel>
+									<ResizableHandle withHandle />
+								</>
+							)}
+							<ResizablePanel defaultSize={store.mode === "edit" ? 85 : 100}>
 								<Canvas />
 							</ResizablePanel>
 						</ResizablePanelGroup>