fix: make onSend callback async to match Promise<void> return type
This commit is contained in:
parent
3d54df27b4
commit
ccc344debd
@ -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}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user