Canvas: Remove deployment action

Change-Id: I5887f130f5d11880271c943f58284d62f7d07a23
diff --git a/apps/canvas/front/src/components/actions.tsx b/apps/canvas/front/src/components/actions.tsx
index de04e9e..ec0d28a 100644
--- a/apps/canvas/front/src/components/actions.tsx
+++ b/apps/canvas/front/src/components/actions.tsx
@@ -84,7 +84,7 @@
 					"Content-Type": "application/json",
 				},
 				body: JSON.stringify({
-					state: JSON.stringify(instance.toObject()),
+					state: instance.toObject(),
 					config,
 				}),
 			});
@@ -210,6 +210,44 @@
 			setReloading(false);
 		}
 	}, [projectId, toast]);
+	const removeDeployment = useCallback(async () => {
+		if (projectId == null) {
+			return;
+		}
+		if (!confirm("Are you sure you want to remove this deployment? This action cannot be undone.")) {
+			return;
+		}
+		setReloading(true);
+		try {
+			const resp = await fetch(`/api/project/${projectId}/remove-deployment`, {
+				method: "POST",
+				headers: {
+					"Content-Type": "application/json",
+				},
+			});
+			if (resp.ok) {
+				toast({
+					title: "Deployment removed successfully",
+				});
+				store.setMode("edit");
+			} else {
+				const errorData = await resp.json();
+				toast({
+					variant: "destructive",
+					title: "Failed to remove deployment",
+					description: errorData.error || "Unknown error",
+				});
+			}
+		} catch (e) {
+			console.log(e);
+			toast({
+				variant: "destructive",
+				title: "Failed to remove deployment",
+			});
+		} finally {
+			setReloading(false);
+		}
+	}, [projectId, toast, store]);
 	const [deployProps, setDeployProps] = useState({});
 	const [reloadProps, setReloadProps] = useState({});
 	useEffect(() => {
@@ -247,6 +285,13 @@
 								Reload Services
 							</DropdownMenuItem>
 							<DropdownMenuItem
+								onClick={removeDeployment}
+								disabled={projectId === undefined}
+								className="cursor-pointer hover:bg-gray-200"
+							>
+								Remove Deployment
+							</DropdownMenuItem>
+							<DropdownMenuItem
 								onClick={deleteProject}
 								disabled={projectId === undefined}
 								className="cursor-pointer hover:bg-gray-200"