Make issue chat composer inline again

This commit is contained in:
dotta 2026-04-08 11:21:11 -05:00
parent e15b5412ec
commit f44c951a22
2 changed files with 86 additions and 89 deletions

View file

@ -257,7 +257,7 @@ describe("IssueChatThread", () => {
}); });
}); });
it("keeps the composer pinned with a capped editor height", () => { it("keeps the composer inline with bottom breathing room and a capped editor height", () => {
const root = createRoot(container); const root = createRoot(container);
act(() => { act(() => {
@ -277,9 +277,9 @@ describe("IssueChatThread", () => {
const composer = container.querySelector('[data-testid="issue-chat-composer"]') as HTMLDivElement | null; const composer = container.querySelector('[data-testid="issue-chat-composer"]') as HTMLDivElement | null;
expect(composer).not.toBeNull(); expect(composer).not.toBeNull();
expect(composer?.className).toContain("sticky"); expect(composer?.className).not.toContain("sticky");
expect(composer?.className).toContain("bottom-0"); expect(composer?.className).not.toContain("bottom-0");
expect(composer?.className).toContain("pb-[calc(env(safe-area-inset-bottom)+0.75rem)]"); expect(composer?.className).toContain("pb-[calc(env(safe-area-inset-bottom)+1.5rem)]");
const editor = container.querySelector('textarea[aria-label="Issue chat editor"]') as HTMLTextAreaElement | null; const editor = container.querySelector('textarea[aria-label="Issue chat editor"]') as HTMLTextAreaElement | null;
expect(editor?.dataset.contentClassName).toContain("max-h-[28dvh]"); expect(editor?.dataset.contentClassName).toContain("max-h-[28dvh]");

View file

@ -1519,9 +1519,8 @@ const IssueChatComposer = forwardRef<IssueChatComposerHandle, IssueChatComposerP
<div <div
ref={composerContainerRef} ref={composerContainerRef}
data-testid="issue-chat-composer" data-testid="issue-chat-composer"
className="sticky bottom-0 z-10 bg-gradient-to-t from-background via-background/95 to-background/70 pt-4 pb-[calc(env(safe-area-inset-bottom)+0.75rem)] backdrop-blur supports-[backdrop-filter]:from-background/92 supports-[backdrop-filter]:via-background/82" className="space-y-3 pt-4 pb-[calc(env(safe-area-inset-bottom)+1.5rem)]"
> >
<div className="space-y-3 rounded-2xl border border-border/70 bg-background/95 p-3 shadow-sm">
<MarkdownEditor <MarkdownEditor
ref={editorRef} ref={editorRef}
value={body} value={body}
@ -1531,11 +1530,10 @@ const IssueChatComposer = forwardRef<IssueChatComposerHandle, IssueChatComposerP
onSubmit={handleSubmit} onSubmit={handleSubmit}
imageUploadHandler={onImageUpload} imageUploadHandler={onImageUpload}
bordered bordered
className="rounded-xl border-border/70 bg-background/95"
contentClassName="min-h-[72px] max-h-[28dvh] overflow-y-auto pr-1 text-sm scrollbar-auto-hide" contentClassName="min-h-[72px] max-h-[28dvh] overflow-y-auto pr-1 text-sm scrollbar-auto-hide"
/> />
<div className="flex flex-wrap items-center justify-end gap-3 border-t border-border/60 pt-2"> <div className="flex flex-wrap items-center justify-end gap-3">
{(onImageUpload || onAttachImage) ? ( {(onImageUpload || onAttachImage) ? (
<div className="mr-auto flex items-center gap-3"> <div className="mr-auto flex items-center gap-3">
<input <input
@ -1611,7 +1609,6 @@ const IssueChatComposer = forwardRef<IssueChatComposerHandle, IssueChatComposerP
</Button> </Button>
</div> </div>
</div> </div>
</div>
); );
}); });