✨ feat: ChatItemRenderConfig Actions render support more custiom

ant-design · May 14, 2024 · 8b404b4 · 8b404b4
1 parent 371bc65
commit 8b404b4
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 0 deletions.
diff --git a/src/ChatItem/index.tsx b/src/ChatItem/index.tsx
@@ -37,6 +37,7 @@ const ChatItem = memo<ChatItemProps>((props) => {
     text,
     chatItemRenderConfig,
     renderErrorMessages,
+    renderActions,
     markdownProps,
     onDoubleClick,
     originData,
@@ -113,6 +114,8 @@ const ChatItem = memo<ChatItemProps>((props) => {
   ]);
 
   const actionsDom = useMemo(() => {
+    console.log('renderActions', renderActions);
+
     if (chatItemRenderConfig?.actionsRender === false) return null;
     if (error) return null;
     const dom = (

diff --git a/src/ChatItem/type.ts b/src/ChatItem/type.ts
@@ -1,5 +1,6 @@
 import { ReactNode } from 'react';
 
+import { RenderAction } from '@/ChatList';
 import { EditableMessageProps } from '@/EditableMessage';
 import { ChatMessageError, DivProps, MetaData } from '@/types';
 import { MarkdownProps } from '@ant-design/pro-editor';
@@ -59,6 +60,9 @@ export interface ChatItemProps<T = Record<string, any>> {
    */
   primary?: boolean;
   renderMessage?: (content: ReactNode) => ReactNode;
+  renderActions?: {
+    [actionKey: string]: RenderAction;
+  };
   /**
    * @description Whether to show the title of the chat item
    */

diff --git a/src/ChatList/ChatListItem.tsx b/src/ChatList/ChatListItem.tsx
@@ -195,12 +195,16 @@ const ChatListItem = (props: ChatListItemProps) => {
    * @returns 渲染操作按钮的组件。
    */
   const Actions = useRefFunction(({ data }: { data: ChatMessage }) => {
+    console.log('renderActions', renderActions);
+
     if (!renderActions || !item?.role) return;
     let RenderFunction;
     if (renderActions?.[item.role]) RenderFunction = renderActions[item.role];
     if (renderActions?.['default']) RenderFunction = renderActions['default'];
     if (!RenderFunction) RenderFunction = ActionsBar;
 
+    console.log('data', data);
+
     const handleActionClick: ListItemProps['onActionsClick'] = (action, data) => {
       switch (action.key) {
         case 'copy': {
@@ -243,6 +247,7 @@ const ChatListItem = (props: ChatListItemProps) => {
         className={chatItemClassName}
         data-id={item.id}
         actions={<Actions data={item} />}
+        renderActions={renderActions}
         avatar={(item as any).meta}
         avatarAddon={groupNav}
         editing={editing}