Files
openchamber/packages/ui/src/components/chat/SessionRecapSpacer.tsx
T
Bohdan Triapitsyn 70e7c37372 feat: tighten spacing between completed turns and user messages
- Assistant turn bottom padding pb-8 -> pb-2, desktop user message top
  padding pt-6 -> pt-4 (footer-to-bubble gap 60px -> 28px)
- Drop the recap note's -mt-6 that compensated the old large padding
2026-07-19 23:19:02 +03:00

36 lines
1.2 KiB
TypeScript

import React from 'react';
import { useSessionAssistState } from '@/hooks/useSessionAssist';
import { useI18n } from '@/lib/i18n';
interface SessionRecapNoteProps {
sessionId: string;
directory?: string;
isMobile: boolean;
}
// Quiet one-paragraph recap of the agent's last reply, rendered right under
// the last message (above the reserved bottom gap). Appears only after the
// 1-minute quiet window, so the layout shift happens off-screen in practice.
export const SessionRecapNote: React.FC<SessionRecapNoteProps> = React.memo(({ sessionId, directory, isMobile }) => {
const { visibleRecap } = useSessionAssistState(sessionId, directory);
const { t } = useI18n();
if (!visibleRecap) {
return null;
}
return (
<div className="chat-message-column">
{/* The last assistant turn carries pb-8 — pull the recap up into that gap. */}
<div aria-label={t('chat.recap.aria')}>
<span className={`typography-meta text-muted-foreground/70 ${isMobile ? 'line-clamp-4' : 'line-clamp-2'}`}>
<span className="italic text-muted-foreground/50">{t('chat.recap.label')} </span>
{visibleRecap}
</span>
</div>
</div>
);
});
SessionRecapNote.displayName = 'SessionRecapNote';