BuzzbeeSCD/openchamber
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: align mini chat draft layout

Browse Source 
Centers the welcome prompt in mini chat drafts
Keeps the mini chat composer at the bottom
Preserves the standard desktop draft layout
This commit is contained in:
Bohdan Triapitsyn
2026-05-28 01:20:21 +03:00
parent 3817a5947f
commit 7dffc98f00
2 changed files with 4 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/src/components/chat/ChatContainer.tsx
+3 -1
View File
@@ -15,6 +15,7 @@ import { useChatAutoFollow, type AnimationHandlers, type ContentChangeReason } f
import { useChatTimelineController } from './hooks/useChatTimelineController'; import { useChatTimelineController } from './hooks/useChatTimelineController';
import { TimelineDialog } from './TimelineDialog'; import { TimelineDialog } from './TimelineDialog';
import { useChatTurnNavigation } from './hooks/useChatTurnNavigation'; import { useChatTurnNavigation } from './hooks/useChatTurnNavigation';
import { useChatSurfaceMode } from './useChatSurfaceMode';
import { useDeviceInfo } from '@/lib/device'; import { useDeviceInfo } from '@/lib/device';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import { OverlayScrollbar } from '@/components/ui/OverlayScrollbar'; import { OverlayScrollbar } from '@/components/ui/OverlayScrollbar';
@@ -529,9 +530,10 @@ export const ChatContainer: React.FC<ChatContainerProps> = ({ autoOpenDraft = tr
const { isMobile } = useDeviceInfo(); const { isMobile } = useDeviceInfo();
const isVSCode = isVSCodeRuntime(); const isVSCode = isVSCodeRuntime();
const chatSurfaceMode = useChatSurfaceMode();
const draftOpen = Boolean(newSessionDraft?.open); const draftOpen = Boolean(newSessionDraft?.open);
const isDesktopExpandedInput = isExpandedInput && !isMobile; const isDesktopExpandedInput = isExpandedInput && !isMobile;
const useCompactDraftLayout = isMobile || isVSCode; const useCompactDraftLayout = isMobile || isVSCode || chatSurfaceMode === 'mini-chat';
const messageListRef = React.useRef<MessageListHandle | null>(null); const messageListRef = React.useRef<MessageListHandle | null>(null);
const draftProjectLabel = React.useMemo(() => { const draftProjectLabel = React.useMemo(() => {
const selectedProject = newSessionDraft?.selectedProjectId const selectedProject = newSessionDraft?.selectedProjectId
packages/ui/src/components/chat/ChatInput.tsx
+1 -1
View File
@@ -3787,7 +3787,7 @@ const ChatInputComponent: React.FC<ChatInputProps> = ({ onOpenSettings, scrollTo
)} )}
style={isMobile && inputBarOffset > 0 ? { marginBottom: `${inputBarOffset}px` } : undefined} style={isMobile && inputBarOffset > 0 ? { marginBottom: `${inputBarOffset}px` } : undefined}
> >
{newSessionDraftOpen && !isDesktopExpanded && !isMobile && !isVSCode ? ( {newSessionDraftOpen && !isDesktopExpanded && !isMobile && !isVSCode && !isMiniChatSurface ? (
<div className="chat-input-column mb-7 text-center"> <div className="chat-input-column mb-7 text-center">
<h1 className="text-balance text-2xl font-medium tracking-tight text-foreground md:text-3xl"> <h1 className="text-balance text-2xl font-medium tracking-tight text-foreground md:text-3xl">
{draftProjectLabel {draftProjectLabel