From 6c758ef3ff99a819fa1ab402236003331ff759cd Mon Sep 17 00:00:00 2001
From: Diego Imbert <diego@windmill.dev>
Date: Sun, 7 Jun 2026 23:54:26 +0200
Subject: [PATCH] fix(drafts): disable Diff button on draft-only items across
 the 4 editors
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Diff has no baseline to compare against on draft-only items — the
button used to be gated by the pre-PR `/add` route's own state, but the
`/add → /edit` redirect landed everything under the regular `/edit`
page where the gate was missing.

- ScriptBuilder: gate the topbar Diff on `savedScript.no_deployed`;
  seed `no_deployed: true` on the route's `new_draft` empty NewScript
  so the gate fires before the first deploy.
- FlowBuilder: gate the topbar Diff on `newFlow` (route already sets
  it from `backendFlow.no_deployed` and the new-draft branch).
- AppEditorHeader: gate both the "Diff" dropdown action and the
  Deploy-drawer's "Diff" button on `newApp`.
- RawAppEditorHeader: gate the topbar Diff + the Deploy-drawer's "Diff"
  button on `newApp`.

Each gate also rewrites the tooltip ("Deploy this … once to compare
against the deployed version") so the hover state explains why.
---
 frontend/src/lib/components/FlowBuilder.svelte            | 6 ++++--
 frontend/src/lib/components/ScriptBuilder.svelte          | 7 +++++--
 .../src/lib/components/apps/editor/AppEditorHeader.svelte | 8 ++++----
 .../src/lib/components/raw_apps/RawAppEditorHeader.svelte | 8 ++++----
 .../(root)/(logged)/scripts/edit/[...path]/+page.svelte   | 7 ++++++-
 5 files changed, 23 insertions(+), 13 deletions(-)

diff --git a/frontend/src/lib/components/FlowBuilder.svelte b/frontend/src/lib/components/FlowBuilder.svelte
index e1a8830160..828a60943a 100644
--- a/frontend/src/lib/components/FlowBuilder.svelte
+++ b/frontend/src/lib/components/FlowBuilder.svelte
@@ -1051,9 +1051,11 @@
 							variant="default"
 							unifiedSize="md"
 							on:click={() => openDiffDrawer()}
-							disabled={!savedFlow}
+							disabled={!savedFlow || newFlow}
 							iconOnly={compactTopbar}
-							title="Diff"
+							title={newFlow
+								? 'Deploy this flow once to compare against the deployed version'
+								: 'Diff'}
 							startIcon={{ icon: DiffIcon }}
 						>
 							Diff
diff --git a/frontend/src/lib/components/ScriptBuilder.svelte b/frontend/src/lib/components/ScriptBuilder.svelte
index d4a566d764..01bd6a6b40 100644
--- a/frontend/src/lib/components/ScriptBuilder.svelte
+++ b/frontend/src/lib/components/ScriptBuilder.svelte
@@ -1898,13 +1898,16 @@
 				{/snippet}
 				{#snippet diffButton()}
 					{#if customUi?.topBar?.diff != false}
+						{@const isDraftOnly = (savedScript as any)?.no_deployed === true}
 						<Button
 							variant="default"
 							unifiedSize="md"
 							on:click={() => openDiffDrawer()}
-							disabled={!savedScript || !diffDrawer}
+							disabled={!savedScript || !diffDrawer || isDraftOnly}
 							iconOnly={compactTopbar}
-							title="Diff"
+							title={isDraftOnly
+								? 'Deploy this script once to compare against the deployed version'
+								: 'Diff'}
 							startIcon={{ icon: DiffIcon }}
 						>
 							Diff
diff --git a/frontend/src/lib/components/apps/editor/AppEditorHeader.svelte b/frontend/src/lib/components/apps/editor/AppEditorHeader.svelte
index 765d1ceffe..dad1ba97f9 100644
--- a/frontend/src/lib/components/apps/editor/AppEditorHeader.svelte
+++ b/frontend/src/lib/components/apps/editor/AppEditorHeader.svelte
@@ -526,7 +526,7 @@
 			displayName: 'Diff',
 			icon: DiffIcon,
 			action: async () => {
-				if (!savedApp) {
+				if (!savedApp || newApp) {
 					return
 				}
 
@@ -546,7 +546,7 @@
 					}
 				})
 			},
-			disabled: !savedApp
+			disabled: !savedApp || newApp
 		},
 		// App debug menu
 		{
@@ -696,9 +696,9 @@
 			<div class="flex flex-row gap-4">
 				<Button
 					variant="accent"
-					disabled={!savedApp}
+					disabled={!savedApp || newApp}
 					on:click={async () => {
-						if (!savedApp) {
+						if (!savedApp || newApp) {
 							return
 						}
 						// deployedValue should be syncronized when we open Diff
diff --git a/frontend/src/lib/components/raw_apps/RawAppEditorHeader.svelte b/frontend/src/lib/components/raw_apps/RawAppEditorHeader.svelte
index 8de11a0241..cda171d0ab 100644
--- a/frontend/src/lib/components/raw_apps/RawAppEditorHeader.svelte
+++ b/frontend/src/lib/components/raw_apps/RawAppEditorHeader.svelte
@@ -551,9 +551,9 @@
 			<div class="flex flex-row gap-2">
 				<Button
 					variant="default"
-					disabled={!savedApp}
+					disabled={!savedApp || newApp}
 					on:click={async () => {
-						if (!savedApp) {
+						if (!savedApp || newApp) {
 							return
 						}
 						// deployedValue should be syncronized when we open Diff
@@ -734,9 +734,9 @@
 			variant="default"
 			unifiedSize="md"
 			on:click={() => openDiffDrawer()}
-			disabled={!savedApp}
+			disabled={!savedApp || newApp}
 			iconOnly={compactTopbar}
-			title="Diff"
+			title={newApp ? 'Deploy this app once to compare against the deployed version' : 'Diff'}
 			startIcon={{ icon: DiffIcon }}
 		>
 			Diff
diff --git a/frontend/src/routes/(root)/(logged)/scripts/edit/[...path]/+page.svelte b/frontend/src/routes/(root)/(logged)/scripts/edit/[...path]/+page.svelte
index fce368ccb2..82612b3fca 100644
--- a/frontend/src/routes/(root)/(logged)/scripts/edit/[...path]/+page.svelte
+++ b/frontend/src/routes/(root)/(logged)/scripts/edit/[...path]/+page.svelte
@@ -181,7 +181,12 @@
 				// `JSON.stringify(undefined)` returns the value `undefined`,
 				// and `JSON.parse(undefined)` coerces to the literal string
 				// "undefined", throwing the toast "Could not parse code".
-				schema: emptySchema()
+				schema: emptySchema(),
+				// Mirrors the backend's overlay shape for deployed=null
+				// paths — ScriptBuilder's Diff button gates on this so
+				// /add (and any other draft-only state) doesn't offer a
+				// diff that has no baseline to compare against.
+				no_deployed: true
 			} as unknown as EditableScript
 			initialPath = ''
 			savedScript = structuredClone(empty)