fix: make onSend callback async to match Promise<void> return type

This commit is contained in:
zhenyi 2026-05-30 14:59:57 +08:00
parent 3d54df27b4
commit ccc344debd

View File

@ -9,6 +9,7 @@ import { Loader2, MessageSquare, ChevronDown, Pin } from "lucide-react";
import type { MessageNewService } from "@/socket";
import MessageItem, { DateDivider, formatDate } from "./message-item";
import MessageComposer from "./composer";
import type { Thread } from "./thread-sidebar";
type Props = {
roomId: string;
@ -24,6 +25,7 @@ type Props = {
onDelete?: (messageId: string) => void;
onEdit?: (messageId: string, content: string) => void;
onStartThread?: (messageId: string, seq: number) => void;
onViewThread?: (threadId: string, seq: number) => void;
onReactionToggle?: (
messageId: string,
emoji: string,
@ -34,6 +36,7 @@ type Props = {
{ content: string; displayName?: string }
>;
typingText?: string | null;
threads?: Thread[];
};
function shouldShowHeader(
@ -78,9 +81,11 @@ export default function MessageView({
onDelete,
onEdit,
onStartThread,
onViewThread,
onReactionToggle,
streamingMessages = new Map(),
typingText,
threads,
}: Props) {
const scrollRef = useRef<HTMLDivElement>(null);
const bottomRef = useRef<HTMLDivElement>(null);
@ -199,13 +204,17 @@ export default function MessageView({
return (
<div className="flex min-h-0 flex-1 flex-col">
{pinnedMessages.length > 0 && (
<div className="flex shrink-0 items-center gap-2 border-b border-border/30 bg-amber-500/[0.03] px-4 py-1.5">
<Pin className="size-3 text-amber-500/60" />
<span className="truncate text-[12px] text-muted-foreground/60">
<button
className="flex shrink-0 w-full cursor-pointer items-center gap-2 border-b border-amber-500/10 bg-amber-500/[0.03] px-4 py-2 text-left transition-colors hover:bg-amber-500/[0.06]"
type="button"
title={`${pinnedMessages.length} pinned message${pinnedMessages.length > 1 ? "s" : ""}`}
>
<Pin className="size-3.5 text-amber-500/50" />
<span className="truncate text-[12px] font-medium text-amber-600/60">
{pinnedMessages.length} pinned message
{pinnedMessages.length > 1 ? "s" : ""}
</span>
</div>
</button>
)}
<div className="relative min-h-0 flex-1">
@ -233,21 +242,25 @@ export default function MessageView({
);
case "notice_beginning":
return (
<div key="notice_beginning" className="flex items-center gap-3 px-4 py-5">
<div className="h-px flex-1 bg-gradient-to-r from-transparent via-border/40 to-transparent" />
<span className="shrink-0 text-[11px] font-medium text-muted-foreground/30">
Beginning of #{roomName}
<div key="notice_beginning" className="flex flex-col items-center gap-2 px-4 py-6">
<div className="grid size-10 place-items-center rounded-2xl bg-muted/30 ring-1 ring-border/20">
<MessageSquare className="size-4 text-muted-foreground/20" />
</div>
<span className="text-[12px] font-medium text-muted-foreground/30">
Beginning of <span className="text-muted-foreground/50">#{roomName}</span>
</span>
<div className="h-px flex-1 bg-gradient-to-r from-transparent via-border/40 to-transparent" />
<div className="h-px w-24 bg-gradient-to-r from-transparent via-border/30 to-transparent mt-1" />
</div>
);
case "notice_scroll":
return (
<div
key="notice_scroll"
className="py-3 text-center text-[11px] text-muted-foreground/30"
className="flex items-center justify-center gap-2 py-4 text-[11px] text-muted-foreground/30"
>
Scroll up for older messages
<div className="h-px w-8 bg-gradient-to-r from-transparent to-border/30" />
<span>Scroll up for older messages</span>
<div className="h-px w-8 bg-gradient-to-l from-transparent to-border/30" />
</div>
);
case "date":
@ -265,9 +278,11 @@ export default function MessageView({
onPinToggle={onPinToggle}
onReactionToggle={onReactionToggle}
onStartThread={onStartThread}
onViewThread={onViewThread}
onReply={(msg) => setReplyTarget(msg)}
roomId={roomId}
showHeader={item.showHeader}
threads={threads}
/>
);
default:
@ -337,8 +352,8 @@ export default function MessageView({
<MessageComposer
onCancelReply={() => setReplyTarget(null)}
onSend={(content) => {
onSend(content, replyTarget?.id);
onSend={async (content) => {
await onSend(content, replyTarget?.id);
setReplyTarget(null);
}}
onTyping={onTyping}