feat: optimize AIAgent components

Author: liuxy0551

src/chat/entity.ts

@@ -27,23 +27,23 @@ type Timestamp = number;
 
 export type ConversationProperties = {
     id: string;
-    assistantId?: string;
+    assistantId?: string | number;
     createdAt?: Timestamp;
     title?: string;
     prompts?: Prompt[];
 };
 
 export type PromptProperties = {
     id: Id;
-    assistantId?: string;
+    assistantId?: string | number;
     createdAt?: Timestamp;
     title: string;
     messages?: Message[];
 };
 
 export type MessageProperties = {
     id: Id;
-    assistantId?: number;
+    assistantId?: string | number;
     creator?: string;
     createdAt?: Timestamp;
     content?: string;
@@ -56,7 +56,7 @@ export type MessageProperties = {
 export abstract class Conversation {
     id: Id;
     // 后端 Id
-    assistantId?: string;
+    assistantId?: string | number;
     createdAt: Timestamp;
     title?: string;
     prompts: Prompt[];
@@ -78,7 +78,7 @@ export abstract class Conversation {
 export abstract class Prompt {
     id: Id;
     // 后端 Id
-    assistantId?: string;
+    assistantId?: string | number;
     createdAt: Timestamp;
     title: string;
     messages: Message[];
@@ -100,7 +100,7 @@ export abstract class Prompt {
 export abstract class Message {
     id: Id;
     // 后端 Id
-    assistantId?: number;
+    assistantId?: string | number;
     creator?: string;
     createdAt: Timestamp;
     content: string;

src/chat/markdown/index.scss

@@ -111,4 +111,7 @@
             }
         }
     }
+    img {
+        max-width: 100%;
+    }
 }

src/chat/markdown/index.tsx

@@ -1,6 +1,7 @@
 import React, { memo, type PropsWithChildren, useEffect } from 'react';
 import ReactMarkdown from 'react-markdown';
 import { type ReactMarkdownOptions } from 'react-markdown/lib/react-markdown';
+import { Image } from 'antd';
 import classNames from 'classnames';
 import remarkGfm from 'remark-gfm';
 
@@ -48,6 +49,9 @@ export default memo(
                     hr() {
                         return <hr color="#ebecf0" className="dtc__aigc__markdown__hr" />;
                     },
+                    img({ src, ...rest }) {
+                        return <Image src={src} {...rest} />;
+                    },
                     ...components,
                 }}
                 {...rest}

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;

src/useIntersectionObserver/index.ts

@@ -1,5 +1,8 @@
 import { MutableRefObject, useEffect, useRef, useState } from 'react';
 
+/**
+ * 自动观察元素是否可见，处理元素是否进入可是区域
+ */
 const useIntersectionObserver = <T extends Element>(
     callback: IntersectionObserverCallback,
     options: IntersectionObserverInit & { freezeOnceVisible?: boolean } = {}