mlogclub
67900d9849
- Introduced AgentMessageEditor component for agent message handling. - Created CustomerMessageEditor component to handle customer messages. - Refactored shared message editor logic into SharedMessageEditor. - Removed the old KefuMessageEditor component. - Updated chat panel to use the new AgentMessageEditor. - Updated KefuChatShell to use CustomerMessageEditor instead of KefuMessageEditor. - Added quick reply fetching and handling in AgentMessageEditor.
71 lines
1.8 KiB
TypeScript
71 lines
1.8 KiB
TypeScript
"use client"
|
|
|
|
import { useEffect, useState } from "react"
|
|
import { toast } from "sonner"
|
|
|
|
import {
|
|
SharedMessageEditor,
|
|
type UploadedMessageEditorImage,
|
|
} from "@/components/chat/shared-message-editor"
|
|
import { fetchQuickReplyListAll, type AdminQuickReply } from "@/lib/api/admin"
|
|
|
|
type AgentMessageEditorProps = {
|
|
disabled?: boolean
|
|
uploadingAsset?: boolean
|
|
onSend: (html: string) => Promise<void>
|
|
onUploadImage: (file: File) => Promise<UploadedMessageEditorImage | null>
|
|
onSendAttachment: (file: File) => Promise<void>
|
|
}
|
|
|
|
export function AgentMessageEditor({
|
|
disabled = false,
|
|
uploadingAsset = false,
|
|
onSend,
|
|
onUploadImage,
|
|
onSendAttachment,
|
|
}: AgentMessageEditorProps) {
|
|
const [quickReplies, setQuickReplies] = useState<AdminQuickReply[]>([])
|
|
const [loadingQuickReplies, setLoadingQuickReplies] = useState(true)
|
|
const [quickReplyPickerOpen, setQuickReplyPickerOpen] = useState(false)
|
|
|
|
useEffect(() => {
|
|
let cancelled = false
|
|
void fetchQuickReplyListAll()
|
|
.then((list) => {
|
|
if (!cancelled) {
|
|
setQuickReplies(list)
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
if (!cancelled) {
|
|
toast.error(error instanceof Error ? error.message : "加载快捷回复失败")
|
|
}
|
|
})
|
|
.finally(() => {
|
|
if (!cancelled) {
|
|
setLoadingQuickReplies(false)
|
|
}
|
|
})
|
|
return () => {
|
|
cancelled = true
|
|
}
|
|
}, [])
|
|
|
|
return (
|
|
<SharedMessageEditor
|
|
variant="agent"
|
|
disabled={disabled}
|
|
uploadingAsset={uploadingAsset}
|
|
quickReplies={{
|
|
open: quickReplyPickerOpen,
|
|
loading: loadingQuickReplies,
|
|
items: quickReplies,
|
|
onOpenChange: setQuickReplyPickerOpen,
|
|
}}
|
|
onSend={onSend}
|
|
onUploadImage={onUploadImage}
|
|
onSendAttachment={onSendAttachment}
|
|
/>
|
|
)
|
|
}
|