diff --git a/apps/canvas/front/src/lib/state.ts b/apps/canvas/front/src/lib/state.ts
index b8db5b5..6e04e4c 100644
--- a/apps/canvas/front/src/lib/state.ts
+++ b/apps/canvas/front/src/lib/state.ts
@@ -41,6 +41,7 @@
 };
 
 export type GatewayHttpsData = NodeData & {
+	readonly?: boolean;
 	network?: string;
 	subdomain?: string;
 	https?: PortConnectedTo;
@@ -56,6 +57,7 @@
 };
 
 export type GatewayTCPData = NodeData & {
+	readonly?: boolean;
 	network?: string;
 	subdomain?: string;
 	exposed: PortConnectedTo[];
@@ -87,6 +89,11 @@
 ] as const;
 export type ServiceType = (typeof ServiceTypes)[number];
 
+export type Domain = {
+	network: string;
+	subdomain: string;
+};
+
 export type ServiceData = NodeData & {
 	type: ServiceType;
 	repository:
@@ -106,6 +113,17 @@
 	volume: string[];
 	preBuildCommands: string;
 	isChoosingPortToConnect: boolean;
+	dev?:
+		| {
+				enabled: false;
+				expose?: Domain;
+		  }
+		| {
+				enabled: true;
+				expose?: Domain;
+				codeServerNodeId: string;
+				sshNodeId: string;
+		  };
 };
 
 export type ServiceNode = Node<ServiceData> & {
@@ -168,35 +186,41 @@
 	| NANode;
 
 export function nodeLabel(n: AppNode): string {
-	switch (n.type) {
-		case "network":
-			return n.data.domain;
-		case "app":
-			return n.data.label || "Service";
-		case "github":
-			return n.data.repository?.fullName || "Github";
-		case "gateway-https": {
-			if (n.data && n.data.network && n.data.subdomain) {
-				return `https://${n.data.subdomain}.${n.data.network}`;
-			} else {
-				return "HTTPS Gateway";
+	try {
+		switch (n.type) {
+			case "network":
+				return n.data.domain;
+			case "app":
+				return n.data.label || "Service";
+			case "github":
+				return n.data.repository?.fullName || "Github";
+			case "gateway-https": {
+				if (n.data && n.data.network && n.data.subdomain) {
+					return `https://${n.data.subdomain}.${n.data.network}`;
+				} else {
+					return "HTTPS Gateway";
+				}
 			}
-		}
-		case "gateway-tcp": {
-			if (n.data && n.data.network && n.data.subdomain) {
-				return `${n.data.subdomain}.${n.data.network}`;
-			} else {
-				return "TCP Gateway";
+			case "gateway-tcp": {
+				if (n.data && n.data.network && n.data.subdomain) {
+					return `${n.data.subdomain}.${n.data.network}`;
+				} else {
+					return "TCP Gateway";
+				}
 			}
+			case "mongodb":
+				return n.data.label || "MongoDB";
+			case "postgresql":
+				return n.data.label || "PostgreSQL";
+			case "volume":
+				return n.data.label || "Volume";
+			case undefined:
+				throw new Error("MUST NOT REACH!");
 		}
-		case "mongodb":
-			return n.data.label || "MongoDB";
-		case "postgresql":
-			return n.data.label || "PostgreSQL";
-		case "volume":
-			return n.data.label || "Volume";
-		case undefined:
-			throw new Error("MUST NOT REACH!");
+	} catch (e) {
+		console.error("opaa", e);
+	} finally {
+		console.log("done");
 	}
 }
 
@@ -464,14 +488,36 @@
 		});
 	};
 
+	const injectNetworkNodes = () => {
+		const newNetworks = get().env.networks.filter(
+			(x) => !get().nodes.some((n) => n.type === "network" && n.data.domain === x.domain),
+		);
+		newNetworks.forEach((n) => {
+			get().addNode({
+				id: n.domain,
+				type: "network",
+				connectable: true,
+				data: {
+					domain: n.domain,
+					label: n.domain,
+					envVars: [],
+					ports: [],
+					state: "success", // TODO(gio): monitor network health
+				},
+			});
+			console.log("added network", n.domain);
+		});
+	};
+
 	const restoreSaved = async () => {
 		const { projectId } = get();
 		const resp = await fetch(`/api/project/${projectId}/saved/${get().mode === "deploy" ? "deploy" : "draft"}`, {
 			method: "GET",
 		});
 		const inst = await resp.json();
-		setN(inst.nodes || []);
-		set({ edges: inst.edges || [] });
+		setN(inst.nodes);
+		set({ edges: inst.edges });
+		injectNetworkNodes();
 		if (
 			get().zoom.x !== inst.viewport.x ||
 			get().zoom.y !== inst.viewport.y ||
@@ -780,23 +826,7 @@
 			} finally {
 				if (JSON.stringify(get().env) !== JSON.stringify(env)) {
 					set({ env });
-					const newNetworks = env.networks.filter(
-						(x) => !get().nodes.some((n) => n.type === "network" && n.data.domain === x.domain),
-					);
-					newNetworks.forEach((n) => {
-						get().addNode({
-							id: n.domain,
-							type: "network",
-							connectable: true,
-							data: {
-								domain: n.domain,
-								label: n.domain,
-								envVars: [],
-								ports: [],
-								state: "success", // TODO(gio): monitor network health
-							},
-						});
-					});
+					injectNetworkNodes();
 
 					if (env.integrations.github) {
 						set({ githubService: new GitHubServiceImpl(projectId!) });