Skip to content

fix(ui): keep Hub chat input from overlapping SessionInsights on paste #6719

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
zanesq merged 2 commits into from
Feb 6, 2026
Merged

fix(ui): keep Hub chat input from overlapping SessionInsights on paste #6719

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
bd2ed3e
fix(ui): keep Hub chat input from overlapping Session Insights on lon…
Abhijay007 Jan 26, 2026
2fc199c
Merge upstream/main into fix/cutOffChat
zanesq Feb 5, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 22 additions & 20 deletions ui/desktop/src/components/Hub.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,8 +73,8 @@ export default function Hub({
};

return (
<div className="flex flex-col h-full bg-background-muted">
<div className="flex-1 flex flex-col mb-0.5 relative">
<div className="flex flex-col h-full min-h-0 bg-background-muted">
<div className="flex-1 flex flex-col min-h-[45vh] overflow-hidden mb-0.5 relative">
<SessionInsights />
{isCreatingSession && (
<div className="absolute bottom-1 left-4 z-20 pointer-events-none">
Expand All @@ -83,24 +83,26 @@ export default function Hub({
)}
</div>

<ChatInput
sessionId={null}
handleSubmit={handleSubmit}
chatState={isCreatingSession ? ChatState.LoadingConversation : ChatState.Idle}
onStop={() => {}}
initialValue=""
setView={setView}
totalTokens={0}
accumulatedInputTokens={0}
accumulatedOutputTokens={0}
droppedFiles={[]}
onFilesProcessed={() => {}}
messages={[]}
disableAnimation={false}
sessionCosts={undefined}
toolCount={0}
onWorkingDirChange={setWorkingDir}
/>
<div className="flex-shrink-0 max-h-[50vh] min-h-0 overflow-hidden flex flex-col">
Copy link

Copilot AI Jan 26, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Wrapping ChatInput in a max-h-[50vh] overflow-hidden container can clip ChatInput’s bottom controls (dir switcher / menus) on shorter window heights with no way to scroll to them. Consider using overflow-y-auto (or overflow-auto) for this wrapper, or removing the overflow constraint and relying on the textarea’s internal max-height/scrolling.

Suggested change
<div className="flex-shrink-0 max-h-[50vh] min-h-0 overflow-hidden flex flex-col">
<div className="flex-shrink-0 max-h-[50vh] min-h-0 overflow-y-auto flex flex-col">

Copilot uses AI. Check for mistakes.
<ChatInput
sessionId={null}
handleSubmit={handleSubmit}
chatState={isCreatingSession ? ChatState.LoadingConversation : ChatState.Idle}
onStop={() => {}}
initialValue=""
setView={setView}
totalTokens={0}
accumulatedInputTokens={0}
accumulatedOutputTokens={0}
droppedFiles={[]}
onFilesProcessed={() => {}}
messages={[]}
disableAnimation={false}
sessionCosts={undefined}
toolCount={0}
onWorkingDirChange={setWorkingDir}
/>
</div>
</div>
);
}
2 changes: 1 addition & 1 deletion ui/desktop/src/components/Layout/AppLayout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,7 @@ const AppLayoutContent: React.FC<AppLayoutContentProps> = ({ activeSessions }) =
};

return (
<div className="flex flex-1 w-full relative animate-fade-in">
<div className="flex flex-1 w-full min-h-0 relative animate-fade-in">
{!shouldHideButtons && (
<div className={`${headerPadding} absolute top-3 z-100 flex items-center`}>
<SidebarTrigger
Expand Down
4 changes: 2 additions & 2 deletions ui/desktop/src/components/sessions/SessionsInsights.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -171,7 +171,7 @@ export function SessionInsights() {
See all
</Button>
</div>
<div className="space-y-3 min-h-[96px]">
<div className="space-y-3 min-h-[96px] max-h-[140px] overflow-hidden">
{/* Skeleton chat items */}
<div className="flex items-center justify-between py-1 px-2">
<div className="flex items-center space-x-2">
Expand Down Expand Up @@ -295,7 +295,7 @@ export function SessionInsights() {
See all
</Button>
</div>
<div className="space-y-1 min-h-[96px] transition-all duration-300 ease-in-out">
<div className="space-y-1 min-h-[96px] max-h-[140px] overflow-hidden transition-all duration-300 ease-in-out">
{isLoadingSessions ? (
<>
<div className="flex items-center justify-between py-1 px-2">
Expand Down
4 changes: 2 additions & 2 deletions ui/desktop/src/components/ui/sidebar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ function SidebarProvider({
} as React.CSSProperties
}
className={cn(
'group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full',
'group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex h-svh min-h-0 w-full overflow-hidden',
className
)}
{...props}
Expand Down Expand Up @@ -294,7 +294,7 @@ function SidebarInset({ className, ...props }: React.ComponentProps<'main'>) {
<main
data-slot="sidebar-inset"
className={cn(
'bg-background relative flex w-full flex-1 flex-col min-w-0',
'bg-background relative flex w-full flex-1 flex-col min-w-0 min-h-0',
// For inset variant (used in the app)
'md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm',
// For offcanvas variant - ensure content doesn't go under sidebar
Expand Down