Three related "fill the available height" layout fixes to the connected screens:
- Tools & Prompts sidebars: replace the fixed magic max-height on ToolControls/
PromptControls with the Resources pattern — sidebar Card `variant="sidebar"`
(full-height flex column) + `Stack flex={1} mih={0}` + a flex-filling
ScrollArea — so the list runs to the bottom of the card before scrolling.
- Logs/Console/Protocol/Network standalone screens: only override ScreenLayout
`h` when embedded. Passing `h={undefined}` clobbered the default
`h: calc(100dvh - header)` (withProps plain-spreads), collapsing an empty
screen to its controls' height. Also center the Network/Protocol empty states.
- Tools placeholder: render the "Select a tool" empty state in a full-height
`DetailCard flex={1}` (like Prompts/Resources) instead of the content-sized
preview card, so it fills the pane.
Claude-Session: https://claude.ai/code/session_015sMW1YZXkM7fDkdPtHpE95
Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
dbda70e83b
commit
6722438428
1 changed files with 93 additions and 35 deletions
|
|
@ -54,10 +54,17 @@ const PanelContainer = Paper.withProps({
|
|||
variant: "panel",
|
||||
});
|
||||
|
||||
// Centered in the full-height panel so the empty message sits mid-panel rather
|
||||
// than clinging to the top of an otherwise-empty box (matches LogStreamPanel).
|
||||
const EmptyCenter = Stack.withProps({
|
||||
flex: 1,
|
||||
align: "center",
|
||||
justify: "center",
|
||||
});
|
||||
|
||||
const EmptyState = Text.withProps({
|
||||
c: "dimmed",
|
||||
ta: "center",
|
||||
py: "xl",
|
||||
});
|
||||
|
||||
// The section header is a single "pleat" bar (rounded, with the filter-button
|
||||
|
|
@ -293,7 +300,9 @@ export function ProtocolListPanel({
|
|||
</Group>
|
||||
|
||||
{!hasResults ? (
|
||||
<EmptyState>No request history</EmptyState>
|
||||
<EmptyCenter>
|
||||
<EmptyState>No request history</EmptyState>
|
||||
</EmptyCenter>
|
||||
) : (
|
||||
<EmbeddableScrollArea embedded={embedded} viewportRef={viewportRef}>
|
||||
<Stack gap="md">
|
||||
|
|
|
|||
Loading…
Reference in a new issue