diff --git a/web/src/components/message-item/feedback-modal.tsx b/web/src/components/message-item/feedback-modal.tsx new file mode 100644 index 000000000..0dca166fa --- /dev/null +++ b/web/src/components/message-item/feedback-modal.tsx @@ -0,0 +1,37 @@ +import { Form, Input, Modal } from 'antd'; + +import { IModalProps } from '@/interfaces/common'; + +type FieldType = { + username?: string; +}; + +const FeedbackModal = ({ visible, hideModal }: IModalProps) => { + const [form] = Form.useForm(); + + const handleOk = async () => { + const ret = await form.validateFields(); + }; + + return ( + +
+ + name="username" + rules={[{ required: true, message: 'Please input your username!' }]} + > + + + +
+ ); +}; + +export default FeedbackModal; diff --git a/web/src/components/message-item/group-button.tsx b/web/src/components/message-item/group-button.tsx new file mode 100644 index 000000000..619fb9246 --- /dev/null +++ b/web/src/components/message-item/group-button.tsx @@ -0,0 +1,53 @@ +import CopyToClipboard from '@/components/copy-to-clipboard'; +import { useSetModalState } from '@/hooks/common-hooks'; +import { + DeleteOutlined, + DislikeOutlined, + LikeOutlined, + SoundOutlined, + SyncOutlined, +} from '@ant-design/icons'; +import { Radio } from 'antd'; +import FeedbackModal from './feedback-modal'; + +export const AssistantGroupButton = () => { + const { visible, hideModal, showModal } = useSetModalState(); + + return ( + <> + + + + + + + + + + + + + + + {visible && ( + + )} + + ); +}; + +export const UserGroupButton = () => { + return ( + + + + + + + + + + + + ); +}; diff --git a/web/src/components/message-item/index.tsx b/web/src/components/message-item/index.tsx index 89e0a7ede..a90e92175 100644 --- a/web/src/components/message-item/index.tsx +++ b/web/src/components/message-item/index.tsx @@ -13,10 +13,11 @@ import { } from '@/hooks/document-hooks'; import MarkdownContent from '@/pages/chat/markdown-content'; import { getExtension, isImage } from '@/utils/document-util'; -import { Avatar, Button, Flex, List, Typography } from 'antd'; +import { Avatar, Button, Flex, List, Space, Typography } from 'antd'; import FileIcon from '../file-icon'; import IndentedTreeModal from '../indented-tree/modal'; import NewDocumentLink from '../new-document-link'; +import { AssistantGroupButton, UserGroupButton } from './group-button'; import styles from './index.less'; const { Text } = Typography; @@ -109,7 +110,15 @@ const MessageItem = ({ )} - {isAssistant ? '' : nickname} + + {isAssistant ? ( + + ) : ( + + )} + + {/* {isAssistant ? '' : nickname} */} +