diff --git a/apps/desktop/src/components/ConversationHeader.tsx b/apps/desktop/src/components/ConversationHeader.tsx index 0215a83..4fa1de2 100644 --- a/apps/desktop/src/components/ConversationHeader.tsx +++ b/apps/desktop/src/components/ConversationHeader.tsx @@ -14,6 +14,7 @@ import { UsersIcon, VideoIcon, } from './icons'; +import { PinnedMessagesPill } from './PinnedMessagesPill'; const PRESENCE_DOT: Record = { online: 'bg-emerald-500', @@ -30,6 +31,8 @@ interface Props { onMediaClick?: () => void; onProfileClick?: (ev: React.MouseEvent) => void; onSearchClick?: () => void; + pinnedCount?: number; + onOpenPinned?: () => void; } export function ConversationHeader({ @@ -39,6 +42,8 @@ export function ConversationHeader({ onMediaClick, onProfileClick, onSearchClick, + pinnedCount = 0, + onOpenPinned, }: Props) { if (!conversation) { return
; @@ -49,10 +54,12 @@ export function ConversationHeader({ {/* Voice-channel rail rendered separately in ConversationPage so it can sit between the message surface and the in-call dock. */} @@ -67,6 +74,8 @@ interface HeaderBarProps { onMediaClick?: () => void; onProfileClick?: (ev: React.MouseEvent) => void; onSearchClick?: () => void; + pinnedCount?: number; + onOpenPinned?: () => void; } function HeaderBar({ @@ -76,6 +85,8 @@ function HeaderBar({ onMediaClick, onProfileClick, onSearchClick, + pinnedCount = 0, + onOpenPinned, }: HeaderBarProps) { const { t } = useTranslation(['app']); @@ -140,6 +151,7 @@ function HeaderBar({
{!isDm && }

{title}

+ onOpenPinned?.()} />

{isDm ? ( diff --git a/apps/desktop/src/components/PinnedMessagesPill.tsx b/apps/desktop/src/components/PinnedMessagesPill.tsx new file mode 100644 index 0000000..78def31 --- /dev/null +++ b/apps/desktop/src/components/PinnedMessagesPill.tsx @@ -0,0 +1,23 @@ +import { PinIcon } from './icons'; + +interface Props { + count: number; + onClick: () => void; +} + +// Compact chip rendered in the conv header that opens the pinned panel. +// Renders nothing when count is 0 so a fresh conv shows no clutter. +export function PinnedMessagesPill({ count, onClick }: Props) { + if (count === 0) return null; + return ( + + ); +}