fix: budget dock height for answer controls and toolbar

This commit is contained in:
anikam13
2026-10-26 23:03:09 -07:00
parent 3dc88472ee
commit 42814ba6a6
3 changed files with 16 additions and 4 deletions
+14 -2
View File
@@ -2026,11 +2026,23 @@ function DockOverlay({
if (!el) return; if (!el) return;
const measure = () => { const measure = () => {
setSbInset(Math.round((el.offsetWidth - el.clientWidth) / 2)); setSbInset(Math.round((el.offsetWidth - el.clientWidth) / 2));
setDockMaxH(Math.max(el.clientHeight - 32, 160)); const block = blockRef.current;
const question = block?.querySelector<HTMLElement>("[data-dock-scroll-area]");
// The height budget belongs to the whole dock, including answer
// controls, stats, and padding. Only the question may consume the
// remaining space; otherwise the overlay grows behind the header.
const chrome = block && question ? block.offsetHeight - question.offsetHeight : 0;
setDockMaxH(Math.max(el.clientHeight - 32 - chrome, 0));
}; };
measure(); measure();
const observer = new ResizeObserver(measure);
observer.observe(el);
if (blockRef.current) observer.observe(blockRef.current);
window.addEventListener("resize", measure); window.addEventListener("resize", measure);
return () => window.removeEventListener("resize", measure); return () => {
observer.disconnect();
window.removeEventListener("resize", measure);
};
}, [scrollRef]); }, [scrollRef]);
// GROWTH MUTE (owner round, 2026-10-05 — the generation churn): during a // GROWTH MUTE (owner round, 2026-10-05 — the generation churn): during a
+1 -1
View File
@@ -105,7 +105,7 @@ export function PracticeDock({ problemCallId, input, expanded, onExpand, onSubmi
cards' label row — owner round, 2026-10-05) + the statement, cards' label row — owner round, 2026-10-05) + the statement,
markdown + LaTeX rendered, capped by the measured column markdown + LaTeX rendered, capped by the measured column
(--dock-max-h; the old fixed 40vh cut long problems short). */} (--dock-max-h; the old fixed 40vh cut long problems short). */}
<div className="max-h-[var(--dock-max-h,40vh)] overflow-y-auto px-4 pt-3 pb-2"> <div data-dock-scroll-area="" className="max-h-[var(--dock-max-h,40vh)] overflow-y-auto px-4 pt-3 pb-2">
<div className="mb-1 text-xs font-medium uppercase tracking-wide text-muted-foreground">Problem</div> <div className="mb-1 text-xs font-medium uppercase tracking-wide text-muted-foreground">Problem</div>
<div className="lh-prose text-[15px]"> <div className="lh-prose text-[15px]">
<ToolContentResponse>{input.statement}</ToolContentResponse> <ToolContentResponse>{input.statement}</ToolContentResponse>
+1 -1
View File
@@ -564,7 +564,7 @@ function QuestionDockForm({
{/* Question area — scrolls internally if very tall; the bottom row stays put. {/* Question area — scrolls internally if very tall; the bottom row stays put.
Capped by the measured column (--dock-max-h; the old fixed 55dvh cut Capped by the measured column (--dock-max-h; the old fixed 55dvh cut
long questions short — owner round, 2026-10-05). */} long questions short — owner round, 2026-10-05). */}
<div data-session-find-root="" className="max-h-[var(--dock-max-h,55dvh)] overflow-y-auto px-4 pt-3"> <div data-dock-scroll-area="" data-session-find-root="" className="max-h-[var(--dock-max-h,55dvh)] overflow-y-auto px-4 pt-3">
<div className="mb-1 text-xs font-medium uppercase tracking-wide text-muted-foreground"> <div className="mb-1 text-xs font-medium uppercase tracking-wide text-muted-foreground">
{toolName === "probe" {toolName === "probe"
? "Probe" ? "Probe"