feat(chat): optimize AIAgent components (#561)

Author: liuxy0551

src/chat/__tests__/useChat.test.ts

@@ -138,21 +138,21 @@ describe('Test useChat', () => {
         act(() => {
             result.current.message.update(mockPrompt.id, mockMessage.id, (m) => ({
                 ...m,
-                assistantId: 111,
+                assistantId: '111',
             }));
         });
         expect(result.current.message.get(mockPrompt.id, mockMessage.id)).toEqual<BaseMessage>(
-            new BaseMessage({ ...mockMessage, assistantId: 111 })
+            new BaseMessage({ ...mockMessage, assistantId: '111' })
         );
 
         fn.mockRestore();
         act(() => {
             result.current.message.update(mockPrompt.id, mockMessage.id, {
-                assistantId: 123,
+                assistantId: '123',
             });
         });
         expect(result.current.message.get(mockPrompt.id, mockMessage.id)).toEqual<BaseMessage>(
-            new BaseMessage({ ...mockMessage, assistantId: 123 })
+            new BaseMessage({ ...mockMessage, assistantId: '123' })
         );
         expect(fn).toBeCalledTimes(1);
 
@@ -162,13 +162,13 @@ describe('Test useChat', () => {
                 mockMessage.id,
                 (m) => ({
                     ...m,
-                    assistantId: 111,
+                    assistantId: '111',
                 }),
                 false
             );
         });
         expect(result.current.message.get(mockPrompt.id, mockMessage.id)).toEqual<BaseMessage>(
-            new BaseMessage({ ...mockMessage, assistantId: 111 })
+            new BaseMessage({ ...mockMessage, assistantId: '111' })
         );
         expect(fn).toBeCalledTimes(1);
 
@@ -418,7 +418,7 @@ describe('Test useChat', () => {
         act(() => {
             result.current.message.create(mockPrompt.id, mockMessage);
             result.current.message.update(mockPrompt.id, mockMessage.id, {
-                assistantId: 1,
+                assistantId: '1',
             });
             result.current.message.remove(mockPrompt.id, mockMessage.id);
         });
@@ -428,7 +428,7 @@ describe('Test useChat', () => {
             result.current.conversation.create(mockConversation);
             result.current.prompt.update(mockPrompt.id, { assistantId: 'assistant_prompt_id' });
             result.current.message.create(mockPrompt.id, mockMessage);
-            result.current.message.update(mockPrompt.id, mockMessage.id, { assistantId: 1 });
+            result.current.message.update(mockPrompt.id, mockMessage.id, { assistantId: '1' });
             result.current.message.remove(mockPrompt.id, mockMessage.id);
         });
         expect(result.error).toBeUndefined();

src/chat/codeBlock/index.tsx

@@ -3,12 +3,13 @@ import { Prism as SyntaxHighlighter, SyntaxHighlighterProps } from 'react-syntax
 import { oneLight } from 'react-syntax-highlighter/dist/cjs/styles/prism';
 import classNames from 'classnames';
 
-import Copy, { type ICopyProps } from '../../copy';
+import Copy from '../../copy';
 import { CopyIcon } from '../icon';
+import { CopyOptions } from '../useContext';
 import './index.scss';
 
 export interface ICodeBlockProps {
-    copy?: boolean | ICopyProps;
+    copy?: boolean | CopyOptions;
     className?: string;
     style?: React.CSSProperties;
     convert?: boolean;
@@ -34,7 +35,7 @@ export default function CodeBlock({
         return { value, language };
     }, [children]);
 
-    const copy = useMemo<{ disabled: boolean; options: Partial<ICopyProps> }>(() => {
+    const copy = useMemo<{ disabled: boolean; options: CopyOptions }>(() => {
         if (typeof rawCopy === 'boolean') {
             return {
                 disabled: !rawCopy,

src/chat/entity.ts

@@ -43,7 +43,7 @@ export type PromptProperties = {
 
 export type MessageProperties = {
     id: Id;
-    assistantId?: number;
+    assistantId?: string;
     creator?: string;
     createdAt?: Timestamp;
     content?: string;
@@ -100,7 +100,7 @@ export abstract class Prompt {
 export abstract class Message {
     id: Id;
     // 后端 Id
-    assistantId?: number;
+    assistantId?: string;
     creator?: string;
     createdAt: Timestamp;
     content: string;

src/chat/markdown/index.scss

@@ -85,6 +85,9 @@
         margin: 8px;
         border-top: none;
     }
+    &__img {
+        max-width: 100%;
+    }
     > *:last-child {
         margin-bottom: 0;
     }

src/chat/markdown/index.tsx

@@ -4,6 +4,7 @@ import { type ReactMarkdownOptions } from 'react-markdown/lib/react-markdown';
 import classNames from 'classnames';
 import remarkGfm from 'remark-gfm';
 
+import Image from '../../image';
 import CodeBlock, { type ICodeBlockProps } from '../codeBlock';
 import './index.scss';
 
@@ -56,6 +57,15 @@ export default memo(
                             return <div>{data.children}</div>;
                         }
                     },
+                    img({ src, ...rest }) {
+                        return (
+                            <Image
+                                className="dtc__aigc__markdown__img"
+                                src={src}
+                                {...(rest as any)}
+                            />
+                        );
+                    },
                     ...components,
                 }}
                 includeElementIndex

src/chat/pagination/index.scss

@@ -1,4 +1,5 @@
 .dtc-aigc-pagination {
+    user-select: none;
     display: flex;
     align-items: center;
     gap: 4px;

src/chat/welcome/index.scss

@@ -1,6 +1,7 @@
 $primaryGradient: #00BAC6 0%, #0067FF 50%, #450FDE 100%;
 
 .dtc__welcome {
+    border-radius: 8px;
     overflow: hidden;
     color: #FFF;
     background: linear-gradient(110deg, $primaryGradient) border-box;