From 0f0aaac8762b0bcb6d534883ddbaf32d0d6d80ce Mon Sep 17 00:00:00 2001 From: Guilhem Lemouel Date: Wed, 23 Sep 2026 09:26:31 +0200 Subject: [PATCH] fix: the header carries what it promised, and nothing it does not MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The registry's item described pickers the breadcrumb no longer has: nine fields — the editability flags, the change callbacks, the navigation hook — that nothing read, while the flow editor passed eight of them and quietly lost its inline rename. The type now says what the bar does: a path, and either a summary or the page's own control for one. The flow editor renames through that control, as the detail page already did. `barPlacement` went the same way: no page registered 'inline', so the layout's guard never fired. The sessions page registered an inset of 0 whenever its preview pane never mounted — the "no session selected" and opted-out arms — and 0 reads as "a page owns the right edge", floating the band over the page's first line. It registers an inset only once the pane has a width. The band's sidebar handle docks through `setDetached` like the card's own toggle, so docking still suppresses the rail's entry animation and closes the card; a summary without its breadcrumb no longer leads with a stray separator in an embed; a page's hint sits with its name whichever way the page named itself; and `Menu.closeInstantly` and `EditorHeader`'s `inline`/`hideSummary` go, their callers having been replaced. Co-Authored-By: Claude Opus 5 (1M context) --- .../src/lib/components/EditorHeader.svelte | 41 +++++++------------ .../src/lib/components/FlowBuilder.svelte | 30 ++++++++------ .../src/lib/components/NavBreadcrumb.svelte | 1 + .../src/lib/components/PageHeaderBar.svelte | 14 +++++-- .../lib/components/PageHeaderContent.svelte | 2 - .../apps/editor/InWorkspaceAppViewer.svelte | 5 +-- .../details/DetailPageHeader.svelte | 8 +--- .../lib/components/meltComponents/Menu.svelte | 7 +--- .../components/pageHeaderRegistry.svelte.ts | 22 ++-------- .../src/routes/(root)/(logged)/+layout.svelte | 4 +- .../(root)/(logged)/sessions/+page.svelte | 2 +- 11 files changed, 53 insertions(+), 83 deletions(-) diff --git a/frontend/src/lib/components/EditorHeader.svelte b/frontend/src/lib/components/EditorHeader.svelte index 7b6c4e0393..82be29b658 100644 --- a/frontend/src/lib/components/EditorHeader.svelte +++ b/frontend/src/lib/components/EditorHeader.svelte @@ -56,14 +56,9 @@ * dropped, leaving only the summary. Used by the condensed session- * preview top bar to save vertical room. */ hidePath?: boolean - /** Drop the summary, for a host that renders its own after the path. */ - hideSummary?: boolean /** Workspace whose items the breadcrumb picker lists; defaults to the operating * workspace (see `useOperatingWorkspace`). */ workspaceId?: string - /** Lay the summary out after the path on one line, for the page header bar, rather than - * stacked under it. */ - inline?: boolean } let { @@ -78,9 +73,7 @@ summaryEditable = true, pathEditable = true, hidePath = false, - hideSummary = false, - workspaceId, - inline = false + workspaceId }: Props = $props() let pathPopoverOpen = $state(false) @@ -133,11 +126,7 @@ } -
+
{#if !hidePath}
@@ -247,18 +236,16 @@ {/if} - {#if !hideSummary} -
- -
- {/if} +
+ +
diff --git a/frontend/src/lib/components/FlowBuilder.svelte b/frontend/src/lib/components/FlowBuilder.svelte index 74ed6a22d0..7b0e87ea50 100644 --- a/frontend/src/lib/components/FlowBuilder.svelte +++ b/frontend/src/lib/components/FlowBuilder.svelte @@ -69,6 +69,7 @@ import FlowHistory from './flows/FlowHistory.svelte' import EditorHeader from './EditorHeader.svelte' import AutosaveIndicator from './AutosaveIndicator.svelte' + import EditableInput from './common/EditableInput.svelte' import type { FlowBuilderWhitelabelCustomUi } from './custom_ui' import FlowYamlEditor from './flows/header/FlowYamlEditor.svelte' import { type TriggerContext, type ScheduleTrigger } from './triggers' @@ -1544,19 +1545,7 @@ ($pathStore = v), - onSummaryChange: (v) => (flowStore.val.summary = v), - onNavigate: (item) => onNavigate?.(item) - }} + item={{ kind: 'flow', path: $pathStore, summaryContent: flowSummary }} actions={flowHeaderActions} contexts={headerContexts} /> @@ -1635,6 +1624,21 @@
{/if} + {#snippet flowSummary()} + + (flowStore.val.summary = v)} + textClass="text-xs font-medium text-emphasis leading-tight" + class="max-w-full min-w-0" + /> + {/snippet} + {#snippet flowHeaderActions()} diff --git a/frontend/src/lib/components/PageHeaderContent.svelte b/frontend/src/lib/components/PageHeaderContent.svelte index 227cbbf5b5..98ee5d91b1 100644 --- a/frontend/src/lib/components/PageHeaderContent.svelte +++ b/frontend/src/lib/components/PageHeaderContent.svelte @@ -17,7 +17,6 @@ the header, so nesting is decided by the caller rather than guessed from context actions, actionsOrder, contexts, - barPlacement, actingWorkspaceId, barRightInset }: PageHeaderContent = $props() @@ -30,7 +29,6 @@ the header, so nesting is decided by the caller rather than guessed from context actions, actionsOrder, contexts, - barPlacement, actingWorkspaceId, barRightInset })) diff --git a/frontend/src/lib/components/apps/editor/InWorkspaceAppViewer.svelte b/frontend/src/lib/components/apps/editor/InWorkspaceAppViewer.svelte index cccf070c91..601cf6d377 100644 --- a/frontend/src/lib/components/apps/editor/InWorkspaceAppViewer.svelte +++ b/frontend/src/lib/components/apps/editor/InWorkspaceAppViewer.svelte @@ -156,10 +156,7 @@ {#if canWriteApp && !hideEditBtn} - + {/if} {#snippet editAction()} diff --git a/frontend/src/lib/components/details/DetailPageHeader.svelte b/frontend/src/lib/components/details/DetailPageHeader.svelte index b04ab7a28e..c93d82b3a8 100644 --- a/frontend/src/lib/components/details/DetailPageHeader.svelte +++ b/frontend/src/lib/components/details/DetailPageHeader.svelte @@ -202,13 +202,7 @@ breadcrumb, the summary keeps its rename-and-labels popover, and everything else rides along as the bar's actions. --> diff --git a/frontend/src/lib/components/meltComponents/Menu.svelte b/frontend/src/lib/components/meltComponents/Menu.svelte index ebfd74662d..02ed1d90f7 100644 --- a/frontend/src/lib/components/meltComponents/Menu.svelte +++ b/frontend/src/lib/components/meltComponents/Menu.svelte @@ -16,10 +16,6 @@ interface Props { placement?: Placement - /** Drops the fly-out, so the panel is out of the DOM the moment it closes. For a menu whose - * act tears its own trigger down — picking a workspace — where floating-ui spends the - * outro re-placing the panel against a reference on its way out, and it bounces. */ - closeInstantly?: boolean /** Inline style on the panel. A margin here shifts it after floating-ui has placed it, * which is the only way to anchor it to a box wider than the trigger: melt's menubar * menu ignores `positioning.offset`. */ @@ -54,7 +50,6 @@ let { placement = 'right-start', contentStyle = '', - closeInstantly = false, justifyEnd = false, lightMode = false, maxHeight = 900, @@ -230,7 +225,7 @@ data-menu onmouseenter={cancelPendingClose} onmouseleave={scheduleClose} - transition:placementFly={{ duration: closeInstantly ? 0 : 100, placement }} + transition:placementFly={{ duration: 100, placement }} style={contentStyle} class={twMerge( 'z-[6000] border w-56 origin-top-right rounded-md shadow-md focus:outline-none', diff --git a/frontend/src/lib/components/pageHeaderRegistry.svelte.ts b/frontend/src/lib/components/pageHeaderRegistry.svelte.ts index 71f6fc3593..4b23eb7077 100644 --- a/frontend/src/lib/components/pageHeaderRegistry.svelte.ts +++ b/frontend/src/lib/components/pageHeaderRegistry.svelte.ts @@ -1,25 +1,15 @@ import type { Snippet } from 'svelte' -import type { WorkspaceItem, WorkspaceItemKind } from './workspacePicker' +import type { WorkspaceItemKind } from './workspacePicker' /** An item the page is working on: the breadcrumb walks its path and ends with its summary. */ export type PageHeaderItem = { kind: WorkspaceItemKind + /** Shown whole, and copied on click. */ path: string | undefined - /** The item's saved path, so a mid-rename breadcrumb and picker stay coherent. */ - savedPath?: string summary?: string - /** Rendered after the path instead of the editable summary — for a page whose summary is - * itself a control, such as a detail page's rename-and-labels popover. */ + /** Rendered in place of the plain summary, for a page whose summary is itself a control — + * a detail page's rename-and-labels popover, an editor's editable title. */ summaryContent?: Snippet - raw_app?: boolean - /** Which workspace the breadcrumb's pickers read (a session editor acts on its fork). */ - workspaceId?: string - pathEditable?: boolean - summaryEditable?: boolean - onBehalfOfEmail?: string - onSummaryChange?: (summary: string) => void - onPathChange?: (path: string) => void - onNavigate?: (item: WorkspaceItem) => void } /** A page with no item of its own, such as a list: the breadcrumb is the section alone. */ @@ -50,9 +40,6 @@ export type PageHeaderContent = { * session's side panel. The band stops there instead of running over it, and the band floats * above the page rather than pushing it down, so that column starts at the top. */ barRightInset?: number - /** 'inline' when the route renders the bar itself — for a layout whose side panel must run to - * the top of the viewport beside it, rather than starting under a full-width bar. */ - barPlacement?: 'layout' | 'inline' /** Contexts those buttons look up. They render under the header, not under the page that * wrote them, so anything the page's tree provides has to travel with them. */ contexts?: Map @@ -86,7 +73,6 @@ export const pageHeader = { if (c.section !== undefined) merged.section = c.section if (c.hint !== undefined) merged.hint = c.hint if (c.contexts !== undefined) merged.contexts = c.contexts - if (c.barPlacement !== undefined) merged.barPlacement = c.barPlacement if (c.actingWorkspaceId !== undefined) merged.actingWorkspaceId = c.actingWorkspaceId if (c.barRightInset !== undefined) merged.barRightInset = c.barRightInset } diff --git a/frontend/src/routes/(root)/(logged)/+layout.svelte b/frontend/src/routes/(root)/(logged)/+layout.svelte index 784f933ea3..1fde2d1432 100644 --- a/frontend/src/routes/(root)/(logged)/+layout.svelte +++ b/frontend/src/routes/(root)/(logged)/+layout.svelte @@ -1541,7 +1541,7 @@ - {#if !devOnly && pageHeader.content?.barPlacement !== 'inline' && (!menuHidden || pageHeader.actions.length > 0)} + {#if !devOnly && (!menuHidden || pageHeader.actions.length > 0)} {@const rightInset = pageHeader.content?.barRightInset} {@const leftInset = useDrawer ? 0 : railWidth}