From ef1757f5d747e513d201eb6fa48918dba8248abe Mon Sep 17 00:00:00 2001
From: Diego Imbert <70353967+diegoimbert@users.noreply.github.com>
Date: Mon, 30 Mar 2026 22:00:14 +0200
Subject: [PATCH] fix: Ducklake UI Nits (#8628)

---
 frontend/package-lock.json                    |  4 +-
 frontend/src/lib/components/EditorBar.svelte  | 13 +++-
 .../lib/components/assets/AssetButtons.svelte | 46 ++++++------
 .../workspaceSettings/DucklakeSettings.svelte | 74 +++++++++----------
 .../(root)/(logged)/assets/+page.svelte       | 22 +++---
 5 files changed, 77 insertions(+), 82 deletions(-)

diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 1a508c8449..3497c6d6c1 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -163,8 +163,8 @@
 			}
 		},
 		"../backend/parsers/windmill-parser-wasm/pkg-ts": {
-			"name": "windmill-parser-wasm",
-			"version": "1.654.0"
+			"name": "windmill-parser-wasm-ts",
+			"version": "1.623.1"
 		},
 		"node_modules/@alloc/quick-lru": {
 			"version": "5.2.0",
diff --git a/frontend/src/lib/components/EditorBar.svelte b/frontend/src/lib/components/EditorBar.svelte
index ee2108711c..9e7f2eb81e 100644
--- a/frontend/src/lib/components/EditorBar.svelte
+++ b/frontend/src/lib/components/EditorBar.svelte
@@ -79,7 +79,16 @@
 		iconOnly?: boolean
 		validCode?: boolean
 		kind?: 'script' | 'trigger' | 'approval'
-		template?: 'pgsql' | 'mysql' | 'script' | 'docker' | 'powershell' | 'bunnative' | 'claudesandbox' | 'wac_python' | 'wac_typescript'
+		template?:
+			| 'pgsql'
+			| 'mysql'
+			| 'script'
+			| 'docker'
+			| 'powershell'
+			| 'bunnative'
+			| 'claudesandbox'
+			| 'wac_python'
+			| 'wac_typescript'
 		collabMode?: boolean
 		collabLive?: boolean
 		collabUsers?: { name: string }[]
@@ -739,7 +748,7 @@ JsonNode ${windmillPathToCamelCaseName(path)} = JsonNode.Parse(await client.GetS
 					startIcon={{ icon: Settings }}
 					target="_blank"
 					variant="accent"
-					href="{base}/workspace_settings?tab=windmill_lfs"
+					href="{base}/workspace_settings?tab=ducklake"
 				>
 					Go to settings
 				</Button>
diff --git a/frontend/src/lib/components/assets/AssetButtons.svelte b/frontend/src/lib/components/assets/AssetButtons.svelte
index 62bd981609..8e8c851f42 100644
--- a/frontend/src/lib/components/assets/AssetButtons.svelte
+++ b/frontend/src/lib/components/assets/AssetButtons.svelte
@@ -43,32 +43,28 @@
 	{#if (asset.kind === 'resource' && resourceDataCacheValue === undefined) || ducklakeNotFound || datatableNotFound}
 		<Popover contentClasses="px-3 py-2">
 			{#snippet trigger()}
-					
-					<Button
-						startIcon={{ icon: AlertTriangle }}
-						variant="default"
-						unifiedSize="md"
-						btnClasses="text-red-500"
-						iconOnly
-					/>
-				
-					{/snippet}
+				<Button
+					startIcon={{ icon: AlertTriangle }}
+					variant="default"
+					unifiedSize="md"
+					btnClasses="text-red-500"
+					iconOnly
+				/>
+			{/snippet}
 			{#snippet content()}
-					
-					<span class="text-sm">Not found</span>
-					{#if ducklakeNotFound}
-						<Button wrapperClasses="mt-1" href="/workspace_settings?tab=windmill_lfs">
-							Go to Ducklake settings
-						</Button>
-					{:else if datatableNotFound}
-						<Button wrapperClasses="mt-1" href="/workspace_settings?tab=windmill_data_tables">
-							Go to Data Table settings
-						</Button>
-					{:else if asset.kind === 'resource' && resourceDataCacheValue === undefined}
-						<Button wrapperClasses="mt-1" href="/resources">Go to Resources</Button>
-					{/if}
-				
-					{/snippet}
+				<span class="text-sm">Not found</span>
+				{#if ducklakeNotFound}
+					<Button wrapperClasses="mt-1" href="/workspace_settings?tab=ducklake">
+						Go to Ducklake settings
+					</Button>
+				{:else if datatableNotFound}
+					<Button wrapperClasses="mt-1" href="/workspace_settings?tab=windmill_data_tables">
+						Go to Data Table settings
+					</Button>
+				{:else if asset.kind === 'resource' && resourceDataCacheValue === undefined}
+					<Button wrapperClasses="mt-1" href="/resources">Go to Resources</Button>
+				{/if}
+			{/snippet}
 		</Popover>
 	{:else if assetCanBeExplored(asset, { resource_type: resourceDataCacheValue })}
 		<ExploreAssetButton
diff --git a/frontend/src/lib/components/workspaceSettings/DucklakeSettings.svelte b/frontend/src/lib/components/workspaceSettings/DucklakeSettings.svelte
index 0b27b645b0..641b56bb04 100644
--- a/frontend/src/lib/components/workspaceSettings/DucklakeSettings.svelte
+++ b/frontend/src/lib/components/workspaceSettings/DucklakeSettings.svelte
@@ -234,7 +234,7 @@
 		{/if}
 		{#each ducklakeSettings.ducklakes as ducklake, ducklakeIndex}
 			<Row>
-				<Cell first class="w-48 relative">
+				<Cell first class="w-44 relative">
 					{#if ducklake.name === 'main'}
 						<Tooltip wrapperClass="absolute mt-[0.6rem] right-4" placement="bottom-start">
 							The <i>main</i> ducklake can be accessed with the
@@ -249,7 +249,7 @@
 					/>
 				</Cell>
 				<Cell>
-					<div class="flex gap-2">
+					<div class="flex gap-1">
 						<div class="relative">
 							{#if ducklake.catalog.resource_type === 'instance'}
 								<Tooltip wrapperClass="absolute mt-[0.6rem] right-2 z-20" placement="bottom-start">
@@ -276,19 +276,19 @@
 										}
 									}
 								}
-								class="w-28"
+								class="w-24"
 							/>
 						</div>
 						<div class="flex flex-1">
 							{#if ducklake.catalog.resource_type !== 'instance'}
 								<ResourcePicker
-									class="flex-1"
+									class="flex-1 min-w-32"
 									bind:value={ducklake.catalog.resource_path}
 									resourceType={ducklake.catalog.resource_type}
 								/>
 							{:else}
 								<CustomInstanceDbSelect
-									class="flex-1"
+									class="flex-1 min-w-32"
 									bind:value={ducklake.catalog.resource_path}
 									{customInstanceDbs}
 									{confirmationModal}
@@ -305,7 +305,7 @@
 					</div>
 				</Cell>
 				<Cell>
-					<div class="flex gap-2">
+					<div class="flex gap-1">
 						<Select
 							placeholder="Default storage"
 							items={[
@@ -330,35 +330,31 @@
 					</div>
 				</Cell>
 				<Cell class="w-12">
-					<div class="flex gap-2">
+					<div class="flex gap-1">
 						<Popover contentClasses="p-4" enableFlyTransition closeOnOtherPopoverOpen>
 							{#snippet trigger()}
-													
-									<div class="relative">
-										<Button variant="default" iconOnly size="sm" endIcon={{ icon: SettingsIcon }} />
-										{#if ducklake.extra_args}
-											<div
-												class="absolute -top-0.5 -right-0.5 w-2 h-2 bg-accent rounded-full border border-surface"
-											></div>
-										{/if}
-									</div>
-								
-													{/snippet}
+								<div class="relative">
+									<Button variant="default" iconOnly size="sm" endIcon={{ icon: SettingsIcon }} />
+									{#if ducklake.extra_args}
+										<div
+											class="absolute -top-0.5 -right-0.5 w-2 h-2 bg-accent rounded-full border border-surface"
+										></div>
+									{/if}
+								</div>
+							{/snippet}
 							{#snippet content()}
-													
-									<Label
-										label="Extra args"
-										tooltip="Additional arguments to pass in the ATTACH command. The argument list is substituted as-is. Separate them with commas."
-									>
-										<TextInput
-											bind:value={ducklake.extra_args}
-											class="min-w-96"
-											underlyingInputEl="textarea"
-											inputProps={{ placeholder: "METADATA_SCHEMA 'schema', ENCRYPTED true" }}
-										/>
-									</Label>
-								
-													{/snippet}
+								<Label
+									label="Extra args"
+									tooltip="Additional arguments to pass in the ATTACH command. The argument list is substituted as-is. Separate them with commas."
+								>
+									<TextInput
+										bind:value={ducklake.extra_args}
+										class="min-w-96"
+										underlyingInputEl="textarea"
+										inputProps={{ placeholder: "METADATA_SCHEMA 'schema', ENCRYPTED true" }}
+									/>
+								</Label>
+							{/snippet}
 						</Popover>
 						{#if ducklakeIsDirty[ducklake.name]}
 							<Popover
@@ -367,18 +363,14 @@
 								class="cursor-not-allowed"
 							>
 								{#snippet trigger()}
-															
-										<ExploreAssetButton asset={{ kind: 'ducklake', path: '' }} disabled />
-									
-															{/snippet}
+									<ExploreAssetButton asset={{ kind: 'ducklake', path: '' }} disabled />
+								{/snippet}
 								{#snippet content()}
-																Please save settings first
-															{/snippet}
+									Please save settings first
+								{/snippet}
 							</Popover>
 						{:else}
-							<ExploreAssetButton
-								asset={{ kind: 'ducklake', path: ducklake.name }}
-							/>
+							<ExploreAssetButton asset={{ kind: 'ducklake', path: ducklake.name }} />
 						{/if}
 					</div>
 				</Cell>
diff --git a/frontend/src/routes/(root)/(logged)/assets/+page.svelte b/frontend/src/routes/(root)/(logged)/assets/+page.svelte
index 7da9d0727c..2668ac2734 100644
--- a/frontend/src/routes/(root)/(logged)/assets/+page.svelte
+++ b/frontend/src/routes/(root)/(logged)/assets/+page.svelte
@@ -267,7 +267,7 @@
 					title: 'Ducklake',
 					data: allDucklakes,
 					assetKind: 'ducklake',
-					settingsHref: '/workspace_settings?tab=windmill_lfs',
+					settingsHref: '/workspace_settings?tab=ducklake',
 					docsHref: 'https://www.windmill.dev/docs/core_concepts/persistent_storage/ducklake',
 					favorites: extractFavorites('ducklake')
 				})}
@@ -280,7 +280,8 @@
 							startIcon={{ icon: HardDriveIcon }}
 							on:click={() => volumesDrawer?.openDrawer()}
 						>
-							{allVolumes.current?.length ?? 0} {(allVolumes.current?.length ?? 0) === 1 ? 'volume' : 'volumes'}
+							{allVolumes.current?.length ?? 0}
+							{(allVolumes.current?.length ?? 0) === 1 ? 'volume' : 'volumes'}
 						</Button>
 					{/if}
 				{/snippet}
@@ -326,7 +327,8 @@
 <VolumesDrawer
 	bind:this={volumesDrawer}
 	onExplore={async (name) => {
-		const storage = (await VolumeService.getVolumeStorage({ workspace: $workspaceStore! })) ?? undefined
+		const storage =
+			(await VolumeService.getVolumeStorage({ workspace: $workspaceStore! })) ?? undefined
 		s3FilePicker?.open({ s3: `volumes/${$workspaceStore}/${name}/`, storage })
 	}}
 />
@@ -355,8 +357,8 @@
 						<Tooltip>
 							<AssetGenericIcon assetKind={asset.kind} size="16px" class="!text-secondary" />
 							{#snippet text()}
-														{formatAssetKind(asset)}
-													{/snippet}
+								{formatAssetKind(asset)}
+							{/snippet}
 						</Tooltip>
 					</Cell>
 					<Cell class="flex flex-col">
@@ -370,18 +372,14 @@
 					</Cell>
 					<Cell class="w-24">
 						{#if assetCanBeExplored(asset, asset.metadata) && !$userStore?.operator}
-							<ExploreAssetButton
-								{asset}
-								{s3FilePicker}
-								_resourceMetadata={asset.metadata}
-							/>
+							<ExploreAssetButton {asset} {s3FilePicker} _resourceMetadata={asset.metadata} />
 						{/if}
 						{#if asset.kind === 'resource' && asset.metadata === undefined}
 							<Tooltip class={'w-24 flex items-center justify-center'}>
 								<AlertTriangle size={20} class="text-orange-600 dark:text-orange-500" />
 								{#snippet text()}
-																Could not find resource
-															{/snippet}
+									Could not find resource
+								{/snippet}
 							</Tooltip>
 						{/if}
 					</Cell>