jerry/buzz
1
0
Fork 0
mirror of https://github.com/block/buzz.git synced 2026-11-04 08:21:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

Align system message reactions

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Thomas Petersen
2026-05-04 22:02:41 -04:00
parent 5a675de57a
commit a7947767a1
2 changed files with 24 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
desktop/src/features/messages/ui/MessageReactions.tsx
View File

@@ -49,19 +49,21 @@ export function MessageReactions({
canToggle,
pending,
onSelect,
className,
}: {
messageId: string;
reactions: TimelineReaction[];
canToggle: boolean;
pending: boolean;
onSelect: (emoji: string) => void;
className?: string;
}) {
if (reactions.length === 0) {
return null;
}
return (
<div className="mt-1.5 flex flex-wrap items-center gap-1.5 pt-1">
<div className={cn("mt-1.5 flex flex-wrap items-center gap-1.5 pt-1", className)}>
{reactions.map((reaction) => (
<ReactionPill
key={`${messageId}-${reaction.emoji}`}

37
desktop/src/features/messages/ui/SystemMessageRow.tsx
View File

@@ -257,11 +257,30 @@ export const SystemMessageRow = React.memo(function SystemMessageRow({
className="group/message rounded-lg px-2 py-1"
data-testid="system-message-row"
>
<div className="flex items-center gap-2.5">
<div className="grid grid-cols-[1rem_minmax(0,1fr)_auto] items-start gap-x-2.5">
<div className="flex h-4 w-4 shrink-0 items-center justify-center rounded-full bg-muted">
<ArrowRightLeft className="h-3 w-3 text-muted-foreground" />
</div>
<p className="text-xs text-muted-foreground">{description}</p>
<div className="min-w-0">
<p className="text-xs text-muted-foreground">{description}</p>
<div className="pl-6">
<MessageReactions
messageId={message.id}
reactions={reactions}
canToggle={canToggleReactions}
pending={reactionPending}
className="mt-0.5 pt-0.5"
onSelect={(emoji) => {
void handleReactionSelect(emoji);
}}
/>
{reactionErrorMessage ? (
<p className="mt-1.5 text-xs text-destructive">
{reactionErrorMessage}
</p>
) : null}
</div>
</div>
<div className="ml-auto flex items-center gap-1 text-xs text-muted-foreground/60">
<div className="relative">
<div className="absolute right-0 top-1/2 -translate-y-1/2">
@@ -344,20 +363,6 @@ export const SystemMessageRow = React.memo(function SystemMessageRow({
<MessageTimestamp createdAt={message.createdAt} time={message.time} />
</div>
</div>
<MessageReactions
messageId={message.id}
reactions={reactions}
canToggle={canToggleReactions}
pending={reactionPending}
onSelect={(emoji) => {
void handleReactionSelect(emoji);
}}
/>
{reactionErrorMessage ? (
<p className="mt-1.5 text-xs text-destructive">
{reactionErrorMessage}
</p>
) : null}
</div>
);
});