diff --git a/apps/canvas/front/src/lib/state.ts b/apps/canvas/front/src/lib/state.ts
index d64f81f..b8db5b5 100644
--- a/apps/canvas/front/src/lib/state.ts
+++ b/apps/canvas/front/src/lib/state.ts
@@ -1,7 +1,7 @@
 import { Category, defaultCategories } from "./categories";
 import { CreateValidators, Validator } from "./config";
 import { GitHubService, GitHubServiceImpl } from "./github";
-import type { Edge, Node, OnConnect, OnEdgesChange, OnNodesChange } from "@xyflow/react";
+import type { Edge, Node, OnConnect, OnEdgesChange, OnNodesChange, Viewport as ReactFlowViewport } from "@xyflow/react";
 import {
 	addEdge,
 	applyEdgeChanges,
@@ -377,6 +377,7 @@
 	projects: Project[];
 	nodes: AppNode[];
 	edges: Edge[];
+	zoom: ReactFlowViewport;
 	categories: Category[];
 	messages: Message[];
 	env: Env;
@@ -403,10 +404,10 @@
 const messagesSelector = (state: AppState) => state.messages;
 const githubServiceSelector = (state: AppState) => state.githubService;
 const envSelector = (state: AppState) => state.env;
-const dimensionsSelector = (state: AppState) => state.dimensions;
+const zoomSelector = (state: AppState) => state.zoom;
 
-export function useDimensions(): Dimensions {
-	return useStateStore(dimensionsSelector);
+export function useZoom(): ReactFlowViewport {
+	return useStateStore(zoomSelector);
 }
 
 export function useProjectId(): string | undefined {
@@ -457,9 +458,6 @@
 
 export const useStateStore = create<AppState>((set, get): AppState => {
 	const setN = (nodes: AppNode[]) => {
-		if (nodes.length == 0) {
-			console.trace("setN", nodes);
-		}
 		set({
 			nodes,
 			messages: v(nodes),
@@ -473,7 +471,14 @@
 		});
 		const inst = await resp.json();
 		setN(inst.nodes || []);
-		get().setEdges(inst.edges || []);
+		set({ edges: inst.edges || [] });
+		if (
+			get().zoom.x !== inst.viewport.x ||
+			get().zoom.y !== inst.viewport.y ||
+			get().zoom.zoom !== inst.viewport.zoom
+		) {
+			set({ zoom: inst.viewport });
+		}
 	};
 
 	function updateNodeData<T extends NodeType>(id: string, data: NodeDataUpdate<T>): void {
@@ -669,6 +674,11 @@
 			width: 800,
 			height: 600,
 		},
+		zoom: {
+			x: 0,
+			y: 0,
+			zoom: 1,
+		},
 		githubService: null,
 		setViewport: (viewport) => {
 			const { viewport: vp } = get();
@@ -769,7 +779,6 @@
 				console.error("Failed to fetch integrations:", error);
 			} finally {
 				if (JSON.stringify(get().env) !== JSON.stringify(env)) {
-					console.log(env);
 					set({ env });
 					const newNetworks = env.networks.filter(
 						(x) => !get().nodes.some((n) => n.type === "network" && n.data.domain === x.domain),
@@ -801,6 +810,9 @@
 			set({ mode });
 		},
 		setProject: async (projectId) => {
+			if (projectId === get().projectId) {
+				return;
+			}
 			set({
 				projectId,
 			});