External/buzz
1
0
Fork 0
mirror of https://github.com/block/buzz.git synced 2026-08-18 06:50:31 +02:00
Code Issues Packages Projects Releases Wiki Activity

Tighten YAML workflow editor layout

Browse Source 
Signed-off-by: Taylor Ho <taylorkmho@gmail.com>
This commit is contained in:
Taylor Ho
2026-08-14 22:25:31 -07:00
parent d6f233bc00
commit d7dcd23f68
2 changed files with 14 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
desktop/src/features/workflows/ui/WorkflowDialog.tsx
+9 -7
View File
@@ -141,10 +141,10 @@ function WorkflowNameEditor({
if (editing) {
return (
<div className="flex h-7 items-center gap-1.5">
<div className="flex h-6 items-center gap-1.5">
<Input
aria-label="Workflow name"
className="h-7 w-72 px-2 font-mono text-sm"
className="h-6 w-72 px-2 font-mono text-sm"
disabled={disabled}
onChange={(event) => setDraft(event.target.value)}
onKeyDown={(event) => {
@@ -177,7 +177,7 @@ function WorkflowNameEditor({
}
return (
<div className="inline-flex h-7 max-w-full min-w-0 items-center gap-1.5 font-mono text-sm text-muted-foreground">
<div className="inline-flex h-6 max-w-full min-w-0 items-center gap-1.5 font-mono text-sm text-muted-foreground">
<span className="min-w-0 truncate">
{generating ? "Generating name…" : name || "Untitled workflow"}
</span>
@@ -415,9 +415,11 @@ export function WorkflowDialog({
open={open && savedWebhookInfo === null}
>
<DialogContent className="flex h-[88vh] max-h-[88vh] w-[calc(100vw-2rem)] max-w-6xl flex-col gap-0 overflow-hidden p-0">
<DialogHeader className="flex flex-shrink-0 flex-row items-center justify-between gap-6 border-b border-border px-6 py-5 pr-14 text-left">
<div className="space-y-0.5">
<DialogTitle>{TITLES[mode]}</DialogTitle>
<DialogHeader className="flex flex-shrink-0 flex-row items-center justify-between gap-6 space-y-0 px-6 pt-3 pr-14 pb-2 text-left">
<div className="space-y-0">
<DialogTitle className="text-lg leading-tight">
{TITLES[mode]}
</DialogTitle>
<DialogDescription className="sr-only">
{mode === "edit"
? "Update when this workflow runs and what it does."
@@ -494,7 +496,7 @@ export function WorkflowDialog({
</p>
) : null}
<div className="flex flex-shrink-0 items-center justify-between gap-4 border-t border-border px-6 py-4">
<div className="flex flex-shrink-0 items-center justify-between gap-4 px-6 pt-2 pb-4">
<Tabs onValueChange={handleEditorModeChange} value={editorMode}>
<TabsList aria-label="Workflow editor mode" className="h-8 p-0.5">
<TabsTrigger
desktop/src/features/workflows/ui/WorkflowFormBuilder.tsx
+5 -5
View File
@@ -521,18 +521,18 @@ export function WorkflowFormBuilder({
) : null}
{mode === "yaml" ? (
<div className="min-h-0 flex-1 space-y-4 overflow-y-auto p-6">
<div className="max-w-md">{scopeField}</div>
<div className="flex h-full min-h-[320px] flex-col space-y-1.5">
<div className="flex min-h-0 flex-1 flex-col gap-3 overflow-hidden px-6 pb-3 pt-3">
<div className="max-w-md flex-shrink-0">{scopeField}</div>
<div className="flex min-h-0 flex-1 flex-col gap-1.5">
<Textarea
aria-label="Workflow YAML"
autoCapitalize="off"
className="min-h-[320px] flex-1 resize-none font-mono text-xs"
className="min-h-0 flex-1 resize-none font-mono text-xs"
disabled={disabled}
onChange={(event) => onChange(event.target.value)}
value={yaml}
/>
<p className="text-xs text-muted-foreground">
<p className="flex-shrink-0 text-xs text-muted-foreground">
Edit the raw YAML definition directly.
</p>
</div>