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