@droppii-org/chat-sdk
Version:
Droppii React Chat SDK
29 lines (28 loc) • 1.48 kB
JavaScript
"use client";
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { useState } from "react";
import { FloatButton, Drawer } from "antd";
import { MessageOutlined, CloseOutlined } from "@ant-design/icons";
import MessageList from "../message/MessageList";
import { useConversationDetail } from "../../hooks/conversation/useConversation";
const ChatBubble = ({ conversationId, sourceID, sessionType, className, }) => {
const { conversationDetail } = useConversationDetail({
sourceID,
sessionType,
});
const [isOpen, setIsOpen] = useState(false);
const toggleChat = () => {
setIsOpen(!isOpen);
};
return (_jsxs(_Fragment, { children: [_jsx(FloatButton, { icon: isOpen ? _jsx(CloseOutlined, {}) : _jsx(MessageOutlined, {}), type: "primary", style: {
right: 24,
bottom: 24,
width: 60,
height: 60,
}, onClick: toggleChat, className: className }), _jsx(Drawer, { placement: "right", onClose: () => setIsOpen(false), open: isOpen, mask: true, closable: false, styles: {
body: { padding: 0 },
}, classNames: {
wrapper: "!z-[9999]",
}, children: _jsx(MessageList, { conversationId: conversationId, conversationData: conversationDetail, className: "flex-1", onClose: () => setIsOpen(false) }) })] }));
};
export default ChatBubble;