starred/windmill
1
0
Fork 0
mirror of https://github.com/windmill-labs/windmill.git synced 2026-10-12 16:02:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: taller trigger chip; node menu and guard badge on the card corner, below the header

Browse Source 
Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
This commit is contained in:
Diego Imbert
2026-09-30 19:26:50 +02:00
co-authored by Claude Opus 5.5
parent 1ae135fb75
commit 60e40b8064
3 changed files with 10 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/components/assets/AssetGraph/AssetNode.svelte
+8 -3
View File
@@ -251,6 +251,10 @@
'bg-surface-accent-selected border-border-selected hover:bg-surface-accent-selected text-accent'
let producer = $derived(upstream && 'path' in upstream ? upstream : undefined)
let coProducers = $derived(upstream && 'scripts' in upstream ? upstream.scripts : [])
let hasHeader = $derived(!!producer || coProducers.length > 0)
// The corner controls sit on the card's corner, below the header tab:
// -top-2 plus PIPELINE_NODE_HEADER (22px).
const CARD_CORNER_TOP = 'top-[14px]'
let coSelected = $derived(!!(upstream && 'scripts' in upstream && upstream.selected))
let coProducerItems = $derived(
upstreamScriptItems(coProducers, (path) => coProducers.find((s) => s.path === path)?.onOpen())
@@ -403,7 +407,7 @@
{:else if upstream}
{@const trigger = producer?.trigger}
{@const chipClass = twMerge(
'truncate rounded-md border px-1.5 py-0.5 text-3xs leading-none font-normal',
'truncate rounded-md border px-1.5 py-1 text-3xs leading-none font-normal',
trigger?.missing
? 'border-red-300 dark:border-red-600 text-red-700 dark:text-red-300'
: 'border-gray-300 dark:border-gray-600 text-secondary',
@@ -461,7 +465,7 @@
<NodeActionsMenu
items={menuItems}
hover={hovered}
kebabClass={showGuardBadge ? '-right-8' : undefined}
kebabClass={twMerge(showGuardBadge && '-right-8', hasHeader && CARD_CORNER_TOP)}
>
<PipelineNodeCard
kindLabel={data.noAsset ? 'No asset' : formatAssetKind(asset)}
@@ -474,7 +478,7 @@
{selected}
tone={data.error ? 'error' : undefined}
subtitle={upstream ? upstreamRow : undefined}
header={producer || coProducers.length > 0 ? scriptHeader : undefined}
header={hasHeader ? scriptHeader : undefined}
headerSelected={producer ? !!producer.selected : coSelected}
width={data.width}
surface={upstream ? 'primary' : 'secondary'}
@@ -605,6 +609,7 @@
<div
class={twMerge(
'absolute -top-2 -right-2 z-10 rounded-full w-5 h-5 grid place-items-center border shadow-sm',
hasHeader && CARD_CORNER_TOP,
guardClass
)}
title={guardTitle}
frontend/src/lib/components/assets/AssetGraph/NodeFixButton.svelte
+1 -1
View File
@@ -70,7 +70,7 @@ red fill already says something is wrong.
{#snippet trigger()}
{#if chip}
<span
class="flex items-center gap-1 rounded-md border px-1.5 py-0.5 text-3xs leading-none font-normal whitespace-nowrap bg-surface border-red-300 dark:border-red-600 text-red-700 dark:text-red-300 hover:bg-surface-hover"
class="flex items-center gap-1 rounded-md border px-1.5 py-1 text-3xs leading-none font-normal whitespace-nowrap bg-surface border-red-300 dark:border-red-600 text-red-700 dark:text-red-300 hover:bg-surface-hover"
>
<Wrench size={10} class="shrink-0" />
{label}
frontend/src/lib/components/assets/AssetGraph/assetGraphLayout.ts
+1 -1
View File
@@ -20,7 +20,7 @@ const SIBLING_GAP = NODE.gap.horizontal
const COMPONENT_GAP = SIBLING_GAP * 2
/** Extra height of an assets-only node: the trigger chip under its title. */
export const PIPELINE_NODE_EXTRA_ROW = 16
export const PIPELINE_NODE_EXTRA_ROW = 20
/** Height of the header strip naming an assets-only node's producing script. */
export const PIPELINE_NODE_HEADER = 22
/** Extra vertical padding of a card under a header, top plus bottom. */