diff --git a/apps/canvas/front/src/components/node-app.tsx b/apps/canvas/front/src/components/node-app.tsx
index f01bd98..7516d19 100644
--- a/apps/canvas/front/src/components/node-app.tsx
+++ b/apps/canvas/front/src/components/node-app.tsx
@@ -91,7 +91,7 @@
 	subdomain: z.string().min(1, "required"),
 });
 
-export function NodeAppDetails({ id, data }: ServiceNode) {
+export function NodeAppDetails({ id, data, disabled }: ServiceNode & { disabled?: boolean }) {
 	const store = useStateStore();
 	const nodes = useNodes<AppNode>();
 	const env = useEnv();
@@ -640,6 +640,7 @@
 										className="lowercase"
 										{...field}
 										ref={focus(field, "name")}
+										disabled={disabled}
 									/>
 								</FormControl>
 								<FormMessage />
@@ -651,7 +652,12 @@
 						name="type"
 						render={({ field }) => (
 							<FormItem>
-								<Select onValueChange={field.onChange} defaultValue={field.value} {...typeProps}>
+								<Select
+									onValueChange={field.onChange}
+									defaultValue={field.value}
+									{...typeProps}
+									disabled={disabled}
+								>
 									<FormControl>
 										<SelectTrigger>
 											<SelectValue placeholder="Runtime" />
@@ -679,7 +685,7 @@
 						name="id"
 						render={({ field }) => (
 							<FormItem>
-								<Select onValueChange={field.onChange} defaultValue={field.value}>
+								<Select onValueChange={field.onChange} defaultValue={field.value} disabled={disabled}>
 									<FormControl>
 										<SelectTrigger>
 											<SelectValue placeholder="Repository" />
@@ -708,7 +714,7 @@
 						render={({ field }) => (
 							<FormItem>
 								<FormControl>
-									<Input placeholder="master" className="lowercase" {...field} />
+									<Input placeholder="master" className="lowercase" {...field} disabled={disabled} />
 								</FormControl>
 								<FormMessage />
 							</FormItem>
@@ -720,7 +726,7 @@
 						render={({ field }) => (
 							<FormItem>
 								<FormControl>
-									<Input placeholder="/" {...field} />
+									<Input placeholder="/" {...field} disabled={disabled} />
 								</FormControl>
 								<FormMessage />
 							</FormItem>
@@ -739,6 +745,7 @@
 								variant={"ghost"}
 								onClick={() => removePort(p.id)}
 								className="w-4 h-4"
+								disabled={disabled}
 							>
 								<XIcon />
 							</Button>
@@ -756,7 +763,7 @@
 						render={({ field }) => (
 							<FormItem>
 								<FormControl>
-									<Input placeholder="name" className="lowercase" {...field} />
+									<Input placeholder="name" className="lowercase" {...field} disabled={disabled} />
 								</FormControl>
 								<FormMessage />
 							</FormItem>
@@ -768,13 +775,15 @@
 						render={({ field }) => (
 							<FormItem>
 								<FormControl>
-									<Input placeholder="value" {...field} />
+									<Input placeholder="value" {...field} disabled={disabled} />
 								</FormControl>
 								<FormMessage />
 							</FormItem>
 						)}
 					/>
-					<Button type="submit">Add Port</Button>
+					<Button type="submit" disabled={disabled}>
+						Add Port
+					</Button>
 				</form>
 			</Form>
 			Env Vars
@@ -794,6 +803,7 @@
 											onKeyUp={saveAliasOnEnter(v)}
 											onBlur={saveAliasOnBlur(v)}
 											autoFocus={true}
+											disabled={disabled}
 										/>
 									</li>
 								);
@@ -823,6 +833,7 @@
 				placeholder="new line separated list of commands to run before running the service"
 				value={data.preBuildCommands}
 				onChange={setPreBuildCommands}
+				disabled={disabled}
 			/>
 			Dev
 			<Form {...devForm}>
@@ -833,7 +844,12 @@
 						render={({ field }) => (
 							<FormItem>
 								<div className="flex flex-row gap-1 items-center">
-									<Checkbox id="devEnabled" onCheckedChange={field.onChange} checked={field.value} />
+									<Checkbox
+										id="devEnabled"
+										onCheckedChange={field.onChange}
+										checked={field.value}
+										disabled={disabled}
+									/>
 									<Label htmlFor="devEnabled">Enabled</Label>
 								</div>
 								<FormMessage />
@@ -850,7 +866,11 @@
 							name="network"
 							render={({ field }) => (
 								<FormItem>
-									<Select onValueChange={field.onChange} defaultValue={field.value}>
+									<Select
+										onValueChange={field.onChange}
+										defaultValue={field.value}
+										disabled={disabled}
+									>
 										<FormControl>
 											<SelectTrigger>
 												<SelectValue placeholder="Network" />
@@ -875,7 +895,7 @@
 							render={({ field }) => (
 								<FormItem>
 									<FormControl>
-										<Input placeholder="subdomain" {...field} />
+										<Input placeholder="subdomain" {...field} disabled={disabled} />
 									</FormControl>
 									<FormMessage />
 								</FormItem>