diff --git a/packages/plugins/@nocobase/plugin-ai/package.json b/packages/plugins/@nocobase/plugin-ai/package.json
index 20853a6328..fa999e2040 100644
--- a/packages/plugins/@nocobase/plugin-ai/package.json
+++ b/packages/plugins/@nocobase/plugin-ai/package.json
@@ -13,7 +13,7 @@
     "@nocobase/test": "1.x"
   },
   "devDependencies": {
-    "@ant-design/x": "^1.0.5",
+    "@ant-design/x": "^1.1.0",
     "@langchain/core": "^0.3.39",
     "@langchain/deepseek": "^0.0.1",
     "@langchain/openai": "^0.4.3",
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/AIEmployeesProvider.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/AIEmployeesProvider.tsx
index 2b5ee907eb..e9c60d7758 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/AIEmployeesProvider.tsx
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/AIEmployeesProvider.tsx
@@ -12,6 +12,7 @@ import { createContext } from 'react';
 import { ChatBoxProvider } from './chatbox/ChatBoxProvider';
 import { useAPIClient, useRequest } from '@nocobase/client';
 import { AIEmployee } from './types';
+import { AISelectionProvider } from './selector/AISelectorProvider';
 
 export const AIEmployeesContext = createContext<{
   aiEmployees: AIEmployee[];
@@ -24,9 +25,11 @@ export const AIEmployeesProvider: React.FC<{
   const [aiEmployees, setAIEmployees] = React.useState<AIEmployee[]>(null);
 
   return (
-    <AIEmployeesContext.Provider value={{ aiEmployees, setAIEmployees }}>
-      <ChatBoxProvider>{props.children}</ChatBoxProvider>
-    </AIEmployeesContext.Provider>
+    <AISelectionProvider>
+      <AIEmployeesContext.Provider value={{ aiEmployees, setAIEmployees }}>
+        <ChatBoxProvider>{props.children}</ChatBoxProvider>
+      </AIEmployeesContext.Provider>
+    </AISelectionProvider>
   );
 };
 
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/ProfileCard.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/ProfileCard.tsx
new file mode 100644
index 0000000000..f4f8452a65
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/ProfileCard.tsx
@@ -0,0 +1,85 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React from 'react';
+import { Avatar, Divider } from 'antd';
+import { useToken } from '@nocobase/client';
+import { AIEmployee } from './types';
+import { avatars } from './avatars';
+import { useT } from '../locale';
+
+export const ProfileCard: React.FC<{
+  aiEmployee: AIEmployee;
+  taskDesc?: string;
+}> = (props) => {
+  const { aiEmployee, taskDesc } = props;
+  const { token } = useToken();
+  const t = useT();
+
+  return (
+    <div
+      style={{
+        width: '300px',
+        padding: '8px',
+      }}
+    >
+      {aiEmployee ? (
+        <>
+          <div
+            style={{
+              width: '100%',
+              textAlign: 'center',
+            }}
+          >
+            <Avatar
+              src={avatars(aiEmployee.avatar)}
+              size={60}
+              style={{
+                boxShadow: `0px 0px 2px ${token.colorBorder}`,
+              }}
+            />
+            <div
+              style={{
+                fontSize: token.fontSizeLG,
+                fontWeight: token.fontWeightStrong,
+                margin: '8px 0',
+              }}
+            >
+              {aiEmployee.nickname}
+            </div>
+          </div>
+          <Divider
+            orientation="left"
+            plain
+            style={{
+              fontStyle: 'italic',
+            }}
+          >
+            {t('Bio')}
+          </Divider>
+          <p>{aiEmployee.bio}</p>
+          {taskDesc && (
+            <>
+              <Divider
+                orientation="left"
+                plain
+                style={{
+                  fontStyle: 'italic',
+                }}
+              >
+                {t('Task description')}
+              </Divider>
+              <p>{taskDesc}</p>
+            </>
+          )}
+        </>
+      ) : null}
+    </div>
+  );
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/AIEmployeeHeader.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/AIEmployeeHeader.tsx
new file mode 100644
index 0000000000..2eeedbb8bf
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/AIEmployeeHeader.tsx
@@ -0,0 +1,58 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React from 'react';
+import { List, Popover, Button, Avatar, Divider } from 'antd';
+import { useToken } from '@nocobase/client';
+import { useAIEmployeesContext } from '../AIEmployeesProvider';
+import { useT } from '../../locale';
+import { useChatBoxContext } from './ChatBoxContext';
+import { avatars } from '../avatars';
+import { css } from '@emotion/css';
+import { Sender } from '@ant-design/x';
+import { ProfileCard } from '../ProfileCard';
+
+export const AIEmployeeHeader: React.FC = () => {
+  const t = useT();
+  const { token } = useToken();
+  const {
+    service: { loading },
+    aiEmployees,
+  } = useAIEmployeesContext();
+  const { switchAIEmployee } = useChatBoxContext();
+  return (
+    <Sender.Header closable={false}>
+      <List
+        loading={loading}
+        dataSource={aiEmployees || []}
+        split={false}
+        itemLayout="horizontal"
+        renderItem={(aiEmployee) => {
+          return (
+            <Popover content={<ProfileCard aiEmployee={aiEmployee} />}>
+              <Button
+                className={css`
+                  width: 36px;
+                  height: 36px;
+                  line-height: 36px;
+                  padding: 0;
+                  margin-right: 3px;
+                `}
+                shape="circle"
+                onClick={() => switchAIEmployee(aiEmployee)}
+              >
+                <Avatar src={avatars(aiEmployee.avatar)} size={36} />
+              </Button>
+            </Popover>
+          );
+        }}
+      />
+    </Sender.Header>
+  );
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/ChatBox.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/ChatBox.tsx
index ed501efb65..b00f78b117 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/ChatBox.tsx
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/ChatBox.tsx
@@ -8,77 +8,21 @@
  */
 
 import React, { useContext, useState } from 'react';
-import { Layout, Card, Divider, Button, Avatar, List, Input, Popover, Empty, Spin, App } from 'antd';
-import { Conversations, Sender, Bubble } from '@ant-design/x';
-import type { ConversationsProps } from '@ant-design/x';
-import { CloseOutlined, ExpandOutlined, EditOutlined, LayoutOutlined, DeleteOutlined } from '@ant-design/icons';
-import { useAPIClient, useToken } from '@nocobase/client';
-import { useT } from '../../locale';
+import { Layout, Card, Button } from 'antd';
+import { CloseOutlined, ExpandOutlined, EditOutlined, LayoutOutlined } from '@ant-design/icons';
+import { useToken } from '@nocobase/client';
 const { Header, Footer, Sider, Content } = Layout;
-import { avatars } from '../avatars';
-import { useAIEmployeesContext } from '../AIEmployeesProvider';
-import { css } from '@emotion/css';
-import { ReactComponent as EmptyIcon } from '../empty-icon.svg';
-import { Attachment } from './Attachment';
 import { ChatBoxContext } from './ChatBoxContext';
-import { AIEmployee } from '../types';
+import { Conversations } from './Conversations';
+import { Messages } from './Messages';
+import { Sender } from './Sender';
+import { useAISelectionContext } from '../selector/AISelectorProvider';
 
 export const ChatBox: React.FC = () => {
-  const { modal, message } = App.useApp();
-  const api = useAPIClient();
-  const {
-    send,
-    setOpen,
-    filterEmployee,
-    setFilterEmployee,
-    conversations: conversationsService,
-    currentConversation,
-    setCurrentConversation,
-    messages,
-    setMessages,
-    roles,
-    attachments,
-    setAttachments,
-    responseLoading,
-    senderRef,
-    senderValue,
-    setSenderValue,
-    clear,
-  } = useContext(ChatBoxContext);
-  const { loading: ConversationsLoading, data: conversationsRes } = conversationsService;
-  const {
-    aiEmployees,
-    service: { loading },
-  } = useAIEmployeesContext();
-  const t = useT();
+  const { setOpen, startNewConversation, currentEmployee } = useContext(ChatBoxContext);
   const { token } = useToken();
   const [showConversations, setShowConversations] = useState(false);
-  const aiEmployeesList = [{ username: 'all' } as AIEmployee, ...(aiEmployees || [])];
-  const conversations: ConversationsProps['items'] = (conversationsRes || []).map((conversation) => ({
-    key: conversation.sessionId,
-    label: conversation.title,
-    timestamp: new Date(conversation.updatedAt).getTime(),
-  }));
-
-  const deleteConversation = async (sessionId: string) => {
-    await api.resource('aiConversations').destroy({
-      filterByTk: sessionId,
-    });
-    message.success(t('Deleted successfully'));
-    conversationsService.refresh();
-    clear();
-  };
-
-  const getMessages = async (sessionId: string) => {
-    const res = await api.resource('aiConversations').getMessages({
-      sessionId,
-    });
-    const messages = res?.data?.data;
-    if (!messages) {
-      return;
-    }
-    setMessages(messages.reverse());
-  };
+  const { selectable } = useAISelectionContext();
 
   return (
     <div
@@ -90,111 +34,11 @@ export const ChatBox: React.FC = () => {
         maxWidth: '760px',
         height: '90%',
         maxHeight: '560px',
-        zIndex: 1000,
+        zIndex: selectable ? -1 : 1000,
       }}
     >
-      <Card style={{ height: '100%' }} bodyStyle={{ height: '100%', paddingTop: 0 }}>
+      <Card style={{ height: '100%' }} styles={{ body: { height: '100%', paddingTop: 0 } }}>
         <Layout style={{ height: '100%' }}>
-          <Sider
-            width="42px"
-            style={{
-              backgroundColor: token.colorBgContainer,
-              marginRight: '5px',
-            }}
-          >
-            <List
-              loading={loading}
-              dataSource={aiEmployeesList}
-              split={false}
-              itemLayout="horizontal"
-              renderItem={(aiEmployee) => {
-                const highlight =
-                  aiEmployee.username === filterEmployee
-                    ? `color: ${token.colorPrimary};
-                        border-color: ${token.colorPrimary};`
-                    : '';
-                return aiEmployee.username === 'all' ? (
-                  <Button
-                    onClick={() => setFilterEmployee(aiEmployee.username)}
-                    className={css`
-                      width: 40px;
-                      height: 40px;
-                      line-height: 40px;
-                      font-weight: ${token.fontWeightStrong};
-                      margin-top: 10px;
-                      margin-bottom: 8px;
-                      ${highlight}
-                    `}
-                  >
-                    ALL
-                  </Button>
-                ) : (
-                  <Popover
-                    placement="rightTop"
-                    content={
-                      <div
-                        style={{
-                          width: '300px',
-                          padding: '8px',
-                        }}
-                      >
-                        <div
-                          style={{
-                            width: '100%',
-                            textAlign: 'center',
-                          }}
-                        >
-                          <Avatar
-                            src={avatars(aiEmployee.avatar)}
-                            size={60}
-                            className={css``}
-                            style={{
-                              boxShadow: `0px 0px 2px ${token.colorBorder}`,
-                            }}
-                          />
-                          <div
-                            style={{
-                              fontSize: token.fontSizeLG,
-                              fontWeight: token.fontWeightStrong,
-                              margin: '8px 0',
-                            }}
-                          >
-                            {aiEmployee.nickname}
-                          </div>
-                        </div>
-                        <Divider
-                          orientation="left"
-                          plain
-                          style={{
-                            fontStyle: 'italic',
-                          }}
-                        >
-                          {t('Bio')}
-                        </Divider>
-                        <p>{aiEmployee.bio}</p>
-                      </div>
-                    }
-                  >
-                    <Button
-                      className={css`
-                        width: 40px;
-                        height: 40px;
-                        line-height: 40px;
-                        padding: 0;
-                        ${highlight}
-                      `}
-                      onClick={() => {
-                        clear();
-                        setFilterEmployee(aiEmployee.username);
-                      }}
-                    >
-                      <Avatar src={avatars(aiEmployee.avatar)} shape="square" size={40} />
-                    </Button>
-                  </Popover>
-                );
-              }}
-            />
-          </Sider>
           <Sider
             width="30%"
             style={{
@@ -203,57 +47,7 @@ export const ChatBox: React.FC = () => {
               marginRight: '5px',
             }}
           >
-            <Layout>
-              <Header
-                style={{
-                  backgroundColor: token.colorBgContainer,
-                  height: '48px',
-                  lineHeight: '48px',
-                  padding: '0 5px',
-                }}
-              >
-                <Input.Search style={{ verticalAlign: 'middle' }} />
-              </Header>
-              <Content>
-                <Spin spinning={ConversationsLoading}>
-                  {conversations && conversations.length ? (
-                    <Conversations
-                      activeKey={currentConversation}
-                      onActiveChange={(sessionId) => {
-                        if (sessionId === currentConversation) {
-                          return;
-                        }
-                        setCurrentConversation(sessionId);
-                        getMessages(sessionId);
-                      }}
-                      items={conversations}
-                      menu={(conversation) => ({
-                        items: [
-                          {
-                            label: 'Delete',
-                            key: 'delete',
-                            icon: <DeleteOutlined />,
-                          },
-                        ],
-                        onClick: ({ key }) => {
-                          switch (key) {
-                            case 'delete':
-                              modal.confirm({
-                                title: t('Delete this conversation?'),
-                                content: t('Are you sure to delete this conversation?'),
-                                onOk: () => deleteConversation(conversation.key),
-                              });
-                              break;
-                          }
-                        },
-                      })}
-                    />
-                  ) : (
-                    <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
-                  )}
-                </Spin>
-              </Content>
-            </Layout>
+            <Conversations />
           </Sider>
           <Layout>
             <Header
@@ -275,15 +69,7 @@ export const ChatBox: React.FC = () => {
                   type="text"
                   onClick={() => setShowConversations(!showConversations)}
                 />
-                {filterEmployee !== 'all' ? (
-                  <Button
-                    icon={<EditOutlined />}
-                    type="text"
-                    onClick={() => {
-                      clear();
-                    }}
-                  />
-                ) : null}
+                {currentEmployee ? <Button icon={<EditOutlined />} type="text" onClick={startNewConversation} /> : null}
               </div>
               <div
                 style={{
@@ -301,27 +87,7 @@ export const ChatBox: React.FC = () => {
                 position: 'relative',
               }}
             >
-              {messages?.length ? (
-                <Bubble.List
-                  style={{
-                    marginRight: '8px',
-                  }}
-                  roles={roles}
-                  items={messages}
-                />
-              ) : (
-                <div
-                  style={{
-                    position: 'absolute',
-                    width: '64px',
-                    top: '50%',
-                    left: '50%',
-                    transform: 'translate(-50%, -50%)',
-                  }}
-                >
-                  <EmptyIcon />
-                </div>
-              )}
+              <Messages />
             </Content>
             <Footer
               style={{
@@ -329,61 +95,8 @@ export const ChatBox: React.FC = () => {
                 padding: 0,
               }}
             >
-              <Sender
-                value={senderValue}
-                ref={senderRef}
-                onChange={(value) => {
-                  setSenderValue(value);
-                }}
-                onSubmit={(content) =>
-                  send({
-                    sessionId: currentConversation,
-                    aiEmployee: { username: filterEmployee },
-                    messages: [
-                      {
-                        type: 'text',
-                        content,
-                      },
-                    ],
-                  })
-                }
-                header={
-                  attachments.length ? (
-                    <div
-                      style={{
-                        padding: '8px 8px 0',
-                      }}
-                    >
-                      {attachments.map((attachment, index) => {
-                        return (
-                          <Attachment
-                            key={index}
-                            closeable={true}
-                            onClose={() => {
-                              setAttachments(attachments.filter((_, i) => i !== index));
-                            }}
-                            {...attachment}
-                          />
-                        );
-                      })}
-                    </div>
-                  ) : null
-                }
-                disabled={filterEmployee === 'all' && !currentConversation}
-                placeholder={filterEmployee === 'all' && !currentConversation ? t('Please choose an AI employee.') : ''}
-                loading={responseLoading}
-              />
+              <Sender />
             </Footer>
-            {/* </Layout> */}
-            {/* <Sider */}
-            {/*   width="25%" */}
-            {/*   style={{ */}
-            {/*     backgroundColor: token.colorBgContainer, */}
-            {/*   }} */}
-            {/* > */}
-            {/*   <Conversations items={employees} /> */}
-            {/* </Sider> */}
-            {/* </Layout> */}
           </Layout>
         </Layout>
       </Card>
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/ChatBoxContext.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/ChatBoxContext.tsx
index 8fbec476b9..6e51b4a7ba 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/ChatBoxContext.tsx
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/ChatBoxContext.tsx
@@ -7,10 +7,19 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { AttachmentProps, Conversation, Message, Action, SendOptions, AIEmployee } from '../types';
-import { Avatar, GetProp, GetRef, Button, Alert, Space } from 'antd';
+import {
+  AttachmentProps,
+  Conversation,
+  Message,
+  Action,
+  SendOptions,
+  AIEmployee,
+  MessageType,
+  ShortcutOptions,
+} from '../types';
+import { Avatar, GetProp, GetRef, Button, Alert, Space, Popover } from 'antd';
 import type { Sender } from '@ant-design/x';
-import React, { createContext, useContext, useEffect, useState, useRef } from 'react';
+import React, { createContext, useContext, useEffect, useState, useRef, useMemo } from 'react';
 import { Bubble } from '@ant-design/x';
 import { useAPIClient, useRequest } from '@nocobase/client';
 import { AIEmployeesContext } from '../AIEmployeesProvider';
@@ -18,12 +27,18 @@ import { Attachment } from './Attachment';
 import { ReloadOutlined, CopyOutlined } from '@ant-design/icons';
 import { avatars } from '../avatars';
 import { useChatMessages } from './useChatMessages';
+import { uid } from '@formily/shared';
+import { useT } from '../../locale';
+import { createForm, Form } from '@formily/core';
+import { ProfileCard } from '../ProfileCard';
+import _ from 'lodash';
+import { InfoFormMessage } from './InfoForm';
 
 export const ChatBoxContext = createContext<{
   setOpen: (open: boolean) => void;
   open: boolean;
-  filterEmployee: string;
-  setFilterEmployee: React.Dispatch<React.SetStateAction<string>>;
+  currentEmployee: AIEmployee;
+  setCurrentEmployee: React.Dispatch<React.SetStateAction<AIEmployee>>;
   conversations: {
     loading: boolean;
     data?: Conversation[];
@@ -35,18 +50,19 @@ export const ChatBoxContext = createContext<{
   setMessages: React.Dispatch<React.SetStateAction<Message[]>>;
   roles: { [role: string]: any };
   responseLoading: boolean;
-  attachments: AttachmentProps[];
-  setAttachments: React.Dispatch<React.SetStateAction<AttachmentProps[]>>;
-  actions: Action[];
-  setActions: React.Dispatch<React.SetStateAction<Action[]>>;
   senderValue: string;
   setSenderValue: React.Dispatch<React.SetStateAction<string>>;
   senderRef: React.MutableRefObject<GetRef<typeof Sender>>;
-  clear: () => void;
+  senderPlaceholder: string;
+  infoForm: Form;
+  showInfoForm: boolean;
+  switchAIEmployee: (aiEmployee: AIEmployee) => void;
+  startNewConversation: () => void;
+  triggerShortcut: (options: ShortcutOptions) => void;
   send(opts: SendOptions): void;
 }>({} as any);
 
-const defaultRoles = {
+const defaultRoles: GetProp<typeof Bubble.List, 'roles'> = {
   user: {
     placement: 'end',
     styles: {
@@ -81,6 +97,24 @@ const defaultRoles = {
       );
     },
   },
+  info: {
+    placement: 'start',
+    avatar: { icon: '', style: { visibility: 'hidden' } },
+    typing: { step: 5, interval: 20 },
+    style: {
+      maxWidth: 400,
+      marginInlineEnd: 48,
+    },
+    styles: {
+      footer: {
+        width: '100%',
+      },
+    },
+    // variant: 'borderless',
+    messageRender: (msg: any) => {
+      return <InfoFormMessage values={msg.content} />;
+    },
+  },
   action: {
     placement: 'start',
     avatar: { icon: '', style: { visibility: 'hidden' } },
@@ -107,7 +141,11 @@ const defaultRoles = {
 
 const aiEmployeeRole = (aiEmployee: AIEmployee) => ({
   placement: 'start',
-  avatar: aiEmployee.avatar ? <Avatar src={avatars(aiEmployee.avatar)} /> : null,
+  avatar: aiEmployee.avatar ? (
+    <Popover content={<ProfileCard aiEmployee={aiEmployee} />} placement="leftTop">
+      <Avatar src={avatars(aiEmployee.avatar)} />
+    </Popover>
+  ) : null,
   typing: { step: 5, interval: 20 },
   style: {
     maxWidth: 400,
@@ -139,63 +177,123 @@ const aiEmployeeRole = (aiEmployee: AIEmployee) => ({
   },
 });
 
-export const useChatBoxContext = () => {
+export const useSetChatBoxContext = () => {
+  const t = useT();
   const api = useAPIClient();
   const { aiEmployees } = useContext(AIEmployeesContext);
-  const [openChatBox, setOpenChatBox] = useState(false);
-  const [filterEmployee, setFilterEmployee] = useState('all');
+  const [open, setOpen] = useState(false);
+  const [currentEmployee, setCurrentEmployee] = useState<AIEmployee>(null);
   const [currentConversation, setCurrentConversation] = useState<string>();
-  const { messages, setMessages, attachments, setAttachments, actions, setActions, responseLoading, sendMessages } =
-    useChatMessages();
+  const { messages, setMessages, responseLoading, addMessage, sendMessages } = useChatMessages();
   const [senderValue, setSenderValue] = useState<string>('');
+  const [senderPlaceholder, setSenderPlaceholder] = useState<string>('');
   const senderRef = useRef<GetRef<typeof Sender>>(null);
   const [roles, setRoles] = useState<GetProp<typeof Bubble.List, 'roles'>>(defaultRoles);
+
+  const infoForm = useMemo(() => createForm(), []);
+
   const conversations = useRequest<Conversation[]>(
     () =>
       api
         .resource('aiConversations')
         .list({
           sort: ['-updatedAt'],
-          ...(filterEmployee !== 'all'
-            ? {
-                filter: {
-                  'aiEmployees.username': filterEmployee,
-                },
-              }
-            : {}),
         })
         .then((res) => res?.data?.data),
     {
-      ready: openChatBox,
-      refreshDeps: [filterEmployee],
+      ready: open,
     },
   );
 
-  const clear = () => {
-    setCurrentConversation(undefined);
-    setMessages([]);
-    setAttachments([]);
-    setActions([]);
+  const send = (options: SendOptions) => {
+    const sendOptions = {
+      ...options,
+      onConversationCreate: (sessionId: string) => {
+        setCurrentConversation(sessionId);
+        conversations.refresh();
+      },
+    };
+    if (!_.isEmpty(infoForm?.values)) {
+      sendOptions.infoFormValues = { ...infoForm.values };
+    }
     setSenderValue('');
-    senderRef.current?.focus();
+    infoForm.reset();
+    sendMessages(sendOptions);
   };
 
-  const send = async (options: SendOptions) => {
-    setSenderValue('');
-    const { aiEmployee } = options;
+  const updateRole = (aiEmployee: AIEmployee) => {
     if (!roles[aiEmployee.username]) {
       setRoles((prev) => ({
         ...prev,
         [aiEmployee.username]: aiEmployeeRole(aiEmployee),
       }));
     }
-    sendMessages({
-      ...options,
-      onConversationCreate: (sessionId: string) => {
-        setCurrentConversation(sessionId);
-        conversations.refresh();
+  };
+
+  const switchAIEmployee = (aiEmployee: AIEmployee) => {
+    const greetingMsg = {
+      key: uid(),
+      role: aiEmployee.username,
+      content: {
+        type: 'greeting',
+        content: aiEmployee.greeting || t('Default greeting message', { nickname: aiEmployee.nickname }),
       },
-    });
+    };
+    setCurrentEmployee(aiEmployee);
+    setSenderPlaceholder(aiEmployee.chatSettings?.senderPlaceholder);
+    infoForm.reset();
+    senderRef.current?.focus();
+    if (!currentConversation) {
+      setMessages([greetingMsg]);
+    } else {
+      addMessage(greetingMsg);
+      setSenderValue('');
+    }
+  };
+
+  const startNewConversation = () => {
+    setCurrentConversation(undefined);
+    setCurrentEmployee(null);
+    setSenderValue('');
+    infoForm.reset();
+    setMessages([]);
+    senderRef.current?.focus();
+  };
+
+  const triggerShortcut = (options: ShortcutOptions) => {
+    const { aiEmployee, message, infoFormValues, autoSend } = options;
+    updateRole(aiEmployee);
+    if (!open) {
+      setOpen(true);
+    }
+    if (currentConversation) {
+      setCurrentConversation(undefined);
+      setMessages([]);
+    }
+    setCurrentEmployee(aiEmployee);
+    if (message && message.type === 'text') {
+      setSenderValue(message.content);
+    } else {
+      setSenderValue('');
+    }
+    setMessages([
+      {
+        key: uid(),
+        role: aiEmployee.username,
+        content: {
+          type: 'greeting',
+          content: aiEmployee.greeting || t('Default greeting message', { nickname: aiEmployee.nickname }),
+        },
+      },
+    ]);
+    senderRef.current?.focus();
+    infoForm.setValues(infoFormValues);
+    if (autoSend) {
+      send({
+        aiEmployee,
+        messages: [message],
+      });
+    }
   };
 
   useEffect(() => {
@@ -215,16 +313,16 @@ export const useChatBoxContext = () => {
   }, [aiEmployees]);
 
   useEffect(() => {
-    if (openChatBox) {
+    if (open) {
       senderRef.current?.focus();
     }
-  }, [openChatBox]);
+  }, [open]);
 
   return {
-    open: openChatBox,
-    setOpen: setOpenChatBox,
-    filterEmployee,
-    setFilterEmployee,
+    open,
+    setOpen,
+    currentEmployee,
+    setCurrentEmployee,
     conversations,
     currentConversation,
     setCurrentConversation,
@@ -232,14 +330,19 @@ export const useChatBoxContext = () => {
     setMessages,
     roles,
     responseLoading,
-    attachments,
-    setAttachments,
-    actions,
-    setActions,
     senderRef,
     senderValue,
     setSenderValue,
+    senderPlaceholder,
+    showInfoForm: !!currentEmployee?.chatSettings?.infoForm?.length,
+    infoForm,
+    switchAIEmployee,
+    startNewConversation,
+    triggerShortcut,
     send,
-    clear,
   };
 };
+
+export const useChatBoxContext = () => {
+  return useContext(ChatBoxContext);
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/ChatBoxProvider.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/ChatBoxProvider.tsx
index 9a47977da8..e00218585b 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/ChatBoxProvider.tsx
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/ChatBoxProvider.tsx
@@ -13,13 +13,13 @@ import { CurrentUserContext } from '@nocobase/client';
 import { ChatBox } from './ChatBox';
 import icon from '../icon.svg';
 import { css } from '@emotion/css';
-import { ChatBoxContext, useChatBoxContext } from './ChatBoxContext';
+import { ChatBoxContext, useSetChatBoxContext } from './ChatBoxContext';
 
 export const ChatBoxProvider: React.FC<{
   children: React.ReactNode;
 }> = (props) => {
   const currentUserCtx = useContext(CurrentUserContext);
-  const chatBoxCtx = useChatBoxContext();
+  const chatBoxCtx = useSetChatBoxContext();
   const { open, setOpen } = chatBoxCtx;
 
   if (!currentUserCtx?.data?.data) {
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/Conversations.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/Conversations.tsx
new file mode 100644
index 0000000000..cb5dd9a124
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/Conversations.tsx
@@ -0,0 +1,112 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React from 'react';
+import { Layout, Input, Empty, Spin, App } from 'antd';
+import { Conversations as AntConversations } from '@ant-design/x';
+import type { ConversationsProps } from '@ant-design/x';
+import { useAPIClient, useToken } from '@nocobase/client';
+import { useChatBoxContext } from './ChatBoxContext';
+import { useT } from '../../locale';
+import { DeleteOutlined } from '@ant-design/icons';
+const { Header, Content } = Layout;
+
+export const Conversations: React.FC = () => {
+  const t = useT();
+  const api = useAPIClient();
+  const { modal, message } = App.useApp();
+  const { token } = useToken();
+  const {
+    conversations: conversationsService,
+    currentConversation,
+    setCurrentConversation,
+    setMessages,
+    startNewConversation,
+  } = useChatBoxContext();
+  const { loading: ConversationsLoading, data: conversationsRes } = conversationsService;
+  const conversations: ConversationsProps['items'] = (conversationsRes || []).map((conversation) => ({
+    key: conversation.sessionId,
+    label: conversation.title,
+    timestamp: new Date(conversation.updatedAt).getTime(),
+  }));
+
+  const deleteConversation = async (sessionId: string) => {
+    await api.resource('aiConversations').destroy({
+      filterByTk: sessionId,
+    });
+    message.success(t('Deleted successfully'));
+    conversationsService.refresh();
+    startNewConversation();
+  };
+
+  const getMessages = async (sessionId: string) => {
+    const res = await api.resource('aiConversations').getMessages({
+      sessionId,
+    });
+    const messages = res?.data?.data;
+    if (!messages) {
+      return;
+    }
+    setMessages(messages.reverse());
+  };
+
+  return (
+    <Layout>
+      <Header
+        style={{
+          backgroundColor: token.colorBgContainer,
+          height: '48px',
+          lineHeight: '48px',
+          padding: '0 5px',
+        }}
+      >
+        <Input.Search style={{ verticalAlign: 'middle' }} />
+      </Header>
+      <Content>
+        <Spin spinning={ConversationsLoading}>
+          {conversations && conversations.length ? (
+            <AntConversations
+              activeKey={currentConversation}
+              onActiveChange={(sessionId) => {
+                if (sessionId === currentConversation) {
+                  return;
+                }
+                setCurrentConversation(sessionId);
+                getMessages(sessionId);
+              }}
+              items={conversations}
+              menu={(conversation) => ({
+                items: [
+                  {
+                    label: 'Delete',
+                    key: 'delete',
+                    icon: <DeleteOutlined />,
+                  },
+                ],
+                onClick: ({ key }) => {
+                  switch (key) {
+                    case 'delete':
+                      modal.confirm({
+                        title: t('Delete this conversation?'),
+                        content: t('Are you sure to delete this conversation?'),
+                        onOk: () => deleteConversation(conversation.key),
+                      });
+                      break;
+                  }
+                },
+              })}
+            />
+          ) : (
+            <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
+          )}
+        </Spin>
+      </Content>
+    </Layout>
+  );
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/FieldSelector.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/FieldSelector.tsx
new file mode 100644
index 0000000000..327adb1a75
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/FieldSelector.tsx
@@ -0,0 +1,33 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React from 'react';
+import { Button } from 'antd';
+import { SelectOutlined } from '@ant-design/icons';
+import { useChatBoxContext } from './ChatBoxContext';
+import { useAISelectionContext } from '../selector/AISelectorProvider';
+
+export const FieldSelector: React.FC = () => {
+  const { currentEmployee, senderValue, setSenderValue, senderRef } = useChatBoxContext();
+  const { startSelect } = useAISelectionContext();
+
+  const handleSelect = () => {
+    startSelect('fields', {
+      onSelect: ({ value }) => {
+        if (!value) {
+          return;
+        }
+        setSenderValue(senderValue + value);
+        senderRef.current?.focus();
+      },
+    });
+  };
+
+  return <Button disabled={!currentEmployee} type="text" icon={<SelectOutlined />} onClick={handleSelect} />;
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/InfoForm.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/InfoForm.tsx
new file mode 100644
index 0000000000..0807a3c658
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/InfoForm.tsx
@@ -0,0 +1,125 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React, { useMemo } from 'react';
+import { AIEmployee } from '../types';
+import { SchemaComponent } from '@nocobase/client';
+import { BlockSelector } from '../selector/BlockSelector';
+import { useChatBoxContext } from './ChatBoxContext';
+import { useT } from '../../locale';
+import { uid } from '@formily/shared';
+import { createForm } from '@formily/core';
+import { Card } from 'antd';
+
+const schemaMap = {
+  blocks: {
+    'x-component': 'BlockSelector',
+    'x-component-props': {},
+  },
+  collections: {
+    'x-component': 'CollectionSelect',
+    'x-component-props': {
+      multiple: true,
+    },
+  },
+};
+
+export const InfoForm: React.FC<{
+  aiEmployee: AIEmployee;
+}> = ({ aiEmployee }) => {
+  const infoForm = aiEmployee?.chatSettings?.infoForm || [];
+  const schemaProperties = infoForm.map((field) => ({
+    name: field.name,
+    title: field.title,
+    type: 'string',
+    'x-decorator': 'FormItem',
+    ...schemaMap[field.type],
+  }));
+  return (
+    <SchemaComponent
+      components={{ BlockSelector }}
+      schema={{
+        type: 'void',
+        properties: schemaProperties.reduce((acc, field) => {
+          acc[field.name] = field;
+          return acc;
+        }, {}),
+      }}
+    />
+  );
+};
+
+export const ReadPrettyInfoForm: React.FC<{
+  aiEmployee: AIEmployee;
+}> = ({ aiEmployee }) => {
+  const infoForm = aiEmployee?.chatSettings?.infoForm || [];
+  const schemaProperties = infoForm.map((field) => ({
+    name: field.name,
+    title: field.title,
+    type: 'string',
+    'x-decorator': 'FormItem',
+    'x-decorator-props': {
+      style: {
+        marginBottom: '5px',
+      },
+    },
+    'x-component': 'Select',
+    'x-read-pretty': true,
+  }));
+  return (
+    <SchemaComponent
+      schema={{
+        type: 'void',
+        properties: schemaProperties.reduce((acc, field) => {
+          acc[field.name] = field;
+          return acc;
+        }, {}),
+      }}
+    />
+  );
+};
+
+export const InfoFormMessage: React.FC<{
+  values: any;
+}> = ({ values }) => {
+  const { currentEmployee } = useChatBoxContext();
+  const t = useT();
+  const form = useMemo(
+    () =>
+      createForm({
+        initialValues: values,
+      }),
+    [values],
+  );
+  return (
+    <>
+      {t('I will use the following information')}
+      <SchemaComponent
+        components={{ ReadPrettyInfoForm }}
+        schema={{
+          type: 'void',
+          properties: {
+            [uid()]: {
+              type: 'void',
+              'x-decorator': 'FormV2',
+              'x-decorator-props': {
+                form,
+                layout: 'horizontal',
+              },
+              'x-component': 'ReadPrettyInfoForm',
+              'x-component-props': {
+                aiEmployee: currentEmployee,
+              },
+            },
+          },
+        }}
+      />
+    </>
+  );
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/Messages.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/Messages.tsx
new file mode 100644
index 0000000000..87e4a92d53
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/Messages.tsx
@@ -0,0 +1,42 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React from 'react';
+import { Bubble } from '@ant-design/x';
+import { useChatBoxContext } from './ChatBoxContext';
+import { ReactComponent as EmptyIcon } from '../empty-icon.svg';
+
+export const Messages: React.FC = () => {
+  const { messages, roles } = useChatBoxContext();
+  return (
+    <>
+      {messages?.length ? (
+        <Bubble.List
+          style={{
+            marginRight: '8px',
+          }}
+          roles={roles}
+          items={messages}
+        />
+      ) : (
+        <div
+          style={{
+            position: 'absolute',
+            width: '64px',
+            top: '50%',
+            left: '50%',
+            transform: 'translate(-50%, -50%)',
+          }}
+        >
+          <EmptyIcon />
+        </div>
+      )}
+    </>
+  );
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/Sender.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/Sender.tsx
new file mode 100644
index 0000000000..a62444bb9c
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/Sender.tsx
@@ -0,0 +1,61 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React, { memo } from 'react';
+import { Sender as AntSender } from '@ant-design/x';
+import { useChatBoxContext } from './ChatBoxContext';
+import { SenderPrefix } from './SenderPrefix';
+import { Attachment } from './Attachment';
+import { AIEmployeeHeader } from './AIEmployeeHeader';
+import { useT } from '../../locale';
+import { SenderHeader } from './SenderHeader';
+import { SenderFooter } from './SenderFooter';
+
+export const Sender: React.FC = memo(() => {
+  const t = useT();
+  const {
+    senderValue,
+    setSenderValue,
+    senderPlaceholder,
+    send,
+    currentConversation,
+    currentEmployee,
+    responseLoading,
+    showInfoForm,
+    senderRef,
+  } = useChatBoxContext();
+  return (
+    <AntSender
+      value={senderValue}
+      ref={senderRef}
+      onChange={(value) => {
+        setSenderValue(value);
+      }}
+      onSubmit={(content) =>
+        send({
+          sessionId: currentConversation,
+          aiEmployee: currentEmployee,
+          messages: [
+            {
+              type: 'text',
+              content,
+            },
+          ],
+        })
+      }
+      prefix={currentConversation || !showInfoForm ? <SenderPrefix /> : null}
+      header={!currentConversation ? <SenderHeader /> : null}
+      loading={responseLoading}
+      footer={({ components }) => <SenderFooter components={components} />}
+      disabled={!currentEmployee}
+      placeholder={!currentEmployee ? t('Please choose an AI employee') : senderPlaceholder}
+      actions={false}
+    />
+  );
+});
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/SenderFooter.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/SenderFooter.tsx
new file mode 100644
index 0000000000..e7c3ba5a06
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/SenderFooter.tsx
@@ -0,0 +1,34 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React from 'react';
+import { Divider, Flex } from 'antd';
+import { useChatBoxContext } from './ChatBoxContext';
+import { FieldSelector } from './FieldSelector';
+import { useT } from '../../locale';
+
+export const SenderFooter: React.FC<{
+  components: any;
+}> = ({ components }) => {
+  const t = useT();
+  const { SendButton, LoadingButton } = components;
+  const { responseLoading: loading } = useChatBoxContext();
+
+  return (
+    <Flex justify="space-between" align="center">
+      <Flex gap="small" align="center">
+        <FieldSelector />
+        <Divider type="vertical" />
+      </Flex>
+      <Flex align="center">
+        {loading ? <LoadingButton type="default" /> : <SendButton type="primary" disabled={false} />}
+      </Flex>
+    </Flex>
+  );
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/SenderHeader.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/SenderHeader.tsx
new file mode 100644
index 0000000000..8b48dac04f
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/SenderHeader.tsx
@@ -0,0 +1,78 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React, { useMemo } from 'react';
+import { useChatBoxContext } from './ChatBoxContext';
+import { Sender } from '@ant-design/x';
+import { AIEmployeeHeader } from './AIEmployeeHeader';
+import { Avatar } from 'antd';
+import { avatars } from '../avatars';
+import { useT } from '../../locale';
+import { SchemaComponent, useToken } from '@nocobase/client';
+import { InfoForm } from './InfoForm';
+import { uid } from '@formily/shared';
+
+export const SenderHeader: React.FC = () => {
+  const t = useT();
+  const { token } = useToken();
+  const { currentEmployee, startNewConversation, showInfoForm, infoForm: form } = useChatBoxContext();
+  return currentEmployee ? (
+    showInfoForm ? (
+      <Sender.Header
+        onOpenChange={startNewConversation}
+        title={
+          <div
+            style={{
+              display: 'flex',
+              alignItems: 'flex-start',
+            }}
+          >
+            <Avatar src={avatars(currentEmployee.avatar)} />
+            <div
+              style={{
+                marginLeft: '4px',
+                paddingTop: '4px',
+              }}
+            >
+              <div
+                style={{
+                  color: token.colorTextDisabled,
+                }}
+              >
+                {t('Please tell me the following information')}
+              </div>
+            </div>
+          </div>
+        }
+      >
+        <SchemaComponent
+          components={{ InfoForm }}
+          schema={{
+            type: 'void',
+            properties: {
+              [uid()]: {
+                type: 'void',
+                'x-decorator': 'FormV2',
+                'x-decorator-props': {
+                  form,
+                },
+                'x-component': 'InfoForm',
+                'x-component-props': {
+                  aiEmployee: currentEmployee,
+                },
+              },
+            },
+          }}
+        />
+      </Sender.Header>
+    ) : null
+  ) : (
+    <AIEmployeeHeader />
+  );
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/SenderPrefix.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/SenderPrefix.tsx
new file mode 100644
index 0000000000..a84311fa30
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/SenderPrefix.tsx
@@ -0,0 +1,25 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React, { useContext } from 'react';
+import { ChatBoxContext } from './ChatBoxContext';
+import { avatars } from '../avatars';
+import { Avatar } from 'antd';
+
+export const SenderPrefix: React.FC = () => {
+  const { currentEmployee } = useContext(ChatBoxContext);
+  return currentEmployee ? (
+    <Avatar
+      src={avatars(currentEmployee.avatar)}
+      style={{
+        cursor: 'pointer',
+      }}
+    />
+  ) : null;
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/useChatMessages.ts b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/useChatMessages.ts
index cad08ab168..ace602c83d 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/useChatMessages.ts
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/chatbox/useChatMessages.ts
@@ -18,14 +18,6 @@ export const useChatMessages = () => {
   const api = useAPIClient();
   const [messages, setMessages] = useState<Message[]>([]);
   const [responseLoading, setResponseLoading] = useState(false);
-  const [attachments, setAttachments] = useState<AttachmentProps[]>([]);
-  const [actions, setActions] = useState<Action[]>([]);
-
-  const clearMessages = () => {
-    setMessages([]);
-    setAttachments([]);
-    setActions([]);
-  };
 
   const addMessage = (message: Message) => {
     setMessages((prev) => [...prev, message]);
@@ -108,34 +100,24 @@ export const useChatMessages = () => {
     sessionId,
     aiEmployee,
     messages: sendMsgs,
-    greeting,
+    infoFormValues,
     onConversationCreate,
   }: SendOptions & {
     onConversationCreate?: (sessionId: string) => void;
   }) => {
     const msgs: Message[] = [];
-    if (greeting) {
-      msgs.push({
-        key: uid(),
-        role: aiEmployee.username,
-        content: {
-          type: 'greeting',
-          content: aiEmployee.greeting || t('Default greeting message', { nickname: aiEmployee.nickname }),
-        },
-      });
-    }
     if (!sendMsgs.length) {
-      addMessages(msgs);
       return;
     }
-    if (attachments.length) {
-      msgs.push(
-        ...attachments.map((attachment) => ({
-          key: uid(),
-          role: 'user',
-          content: attachment,
-        })),
-      );
+    if (infoFormValues) {
+      msgs.push({
+        key: uid(),
+        role: 'info',
+        content: {
+          type: 'info',
+          content: infoFormValues,
+        },
+      });
     }
     msgs.push(...sendMsgs.map((msg) => ({ key: uid(), role: 'user', content: msg })));
     addMessages(msgs);
@@ -152,7 +134,6 @@ export const useChatMessages = () => {
       sessionId = conversation.sessionId;
       onConversationCreate?.(sessionId);
     }
-    setAttachments([]);
     setResponseLoading(true);
 
     addMessage({
@@ -183,34 +164,31 @@ export const useChatMessages = () => {
       return;
     }
     const { result, error } = await processStreamResponse(sendRes.data);
-    if (actions.length && !error) {
-      addMessages(
-        actions.map((action) => ({
-          key: uid(),
-          role: 'action',
-          content: {
-            type: 'action',
-            icon: action.icon,
-            content: action.content,
-            onClick: () => {
-              action.onClick(result);
-            },
-          },
-        })),
-      );
-      setActions([]);
-    }
+    // if (actions.length && !error) {
+    //   addMessages(
+    //     actions.map((action) => ({
+    //       key: uid(),
+    //       role: 'action',
+    //       content: {
+    //         type: 'action',
+    //         icon: action.icon,
+    //         content: action.content,
+    //         onClick: () => {
+    //           action.onClick(result);
+    //         },
+    //       },
+    //     })),
+    //   );
+    //   setActions([]);
+    // }
   };
 
   return {
     messages,
+    addMessage,
+    addMessages,
     setMessages,
-    attachments,
-    setAttachments,
-    actions,
-    setActions,
     responseLoading,
     sendMessages,
-    clearMessages,
   };
 };
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/initializer/AIEmployeeButton.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/initializer/AIEmployeeButton.tsx
index ca44957e4b..d685ee9bdf 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/initializer/AIEmployeeButton.tsx
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/initializer/AIEmployeeButton.tsx
@@ -7,24 +7,20 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import React, { useContext } from 'react';
-import { Avatar, Tag, Popover, Divider, Button } from 'antd';
+import React from 'react';
+import { Avatar, Popover, Button } from 'antd';
 import { avatars } from '../avatars';
 import {
   SortableItem,
-  useBlockContext,
   useLocalVariables,
   useSchemaToolbarRender,
-  useToken,
   useVariables,
   withDynamicSchemaProps,
 } from '@nocobase/client';
 import { useFieldSchema } from '@formily/react';
-import { useT } from '../../locale';
-import { css } from '@emotion/css';
-import { useAIEmployeeChatContext } from '../AIEmployeeChatProvider';
-import { ChatBoxContext } from '../chatbox/ChatBoxContext';
+import { useChatBoxContext } from '../chatbox/ChatBoxContext';
 import { AIEmployee } from '../types';
+import { ProfileCard } from '../ProfileCard';
 
 async function replaceVariables(template, variables, localVariables = {}) {
   const regex = /\{\{\s*(.*?)\s*\}\}/g;
@@ -64,17 +60,18 @@ async function replaceVariables(template, variables, localVariables = {}) {
 export const AIEmployeeButton: React.FC<{
   aiEmployee: AIEmployee;
   taskDesc?: string;
-  attachments: string[];
-  actions: string[];
-}> = withDynamicSchemaProps(({ aiEmployee, taskDesc, attachments: selectedAttachments, actions: selectedActions }) => {
-  const t = useT();
-  const { setOpen, send, setAttachments, setFilterEmployee, setActions, clear } = useContext(ChatBoxContext);
-  const { token } = useToken();
+  autoSend?: boolean;
+  message: {
+    type: string;
+    content: string;
+  };
+  infoForm: any;
+}> = withDynamicSchemaProps(({ aiEmployee, taskDesc, message, infoForm: infoFormValues, autoSend }) => {
+  const { triggerShortcut } = useChatBoxContext();
   const fieldSchema = useFieldSchema();
   const { render } = useSchemaToolbarRender(fieldSchema);
   const variables = useVariables();
   const localVariables = useLocalVariables();
-  const { attachments, actions } = useAIEmployeeChatContext();
 
   return (
     <SortableItem
@@ -82,110 +79,23 @@ export const AIEmployeeButton: React.FC<{
         position: 'relative',
       }}
       onClick={async () => {
-        clear();
-        setOpen(true);
-        setFilterEmployee(aiEmployee.username);
-        if (selectedAttachments && selectedAttachments.length) {
-          setAttachments((prev) => {
-            const newAttachments = selectedAttachments.map((name: string) => {
-              const attachment = attachments[name];
-              return {
-                type: attachment.type,
-                title: attachment.title,
-                content: attachment.content,
-              };
-            });
-            return [...prev, ...newAttachments];
-          });
-        }
-        if (selectedActions && selectedActions.length) {
-          setActions((prev) => {
-            const newActions = selectedActions.map((name: string) => {
-              const action = actions[name];
-              return {
-                icon: action.icon,
-                content: action.title,
-                onClick: action.action,
-              };
-            });
-            return [...prev, ...newActions];
-          });
-        }
-        const messages = [];
-        const message = fieldSchema['x-component-props']?.message;
-        if (message) {
+        let msg;
+        if (message && message.content) {
           const content = await replaceVariables(message.content, variables, localVariables);
-          messages.push({
+          msg = {
             type: message.type || 'text',
             content,
-          });
+          };
         }
-        send({
+        triggerShortcut({
           aiEmployee,
-          messages,
-          greeting: true,
+          message: msg,
+          autoSend,
+          infoFormValues,
         });
       }}
     >
-      <Popover
-        content={
-          <div
-            style={{
-              width: '300px',
-              padding: '8px',
-            }}
-          >
-            <div
-              style={{
-                width: '100%',
-                textAlign: 'center',
-              }}
-            >
-              <Avatar
-                src={avatars(aiEmployee.avatar)}
-                size={60}
-                className={css``}
-                style={{
-                  boxShadow: `0px 0px 2px ${token.colorBorder}`,
-                }}
-              />
-              <div
-                style={{
-                  fontSize: token.fontSizeLG,
-                  fontWeight: token.fontWeightStrong,
-                  margin: '8px 0',
-                }}
-              >
-                {aiEmployee.nickname}
-              </div>
-            </div>
-            <Divider
-              orientation="left"
-              plain
-              style={{
-                fontStyle: 'italic',
-              }}
-            >
-              {t('Bio')}
-            </Divider>
-            <p>{aiEmployee.bio}</p>
-            {taskDesc && (
-              <>
-                <Divider
-                  orientation="left"
-                  plain
-                  style={{
-                    fontStyle: 'italic',
-                  }}
-                >
-                  {t('Task description')}
-                </Divider>
-                <p>{taskDesc}</p>
-              </>
-            )}
-          </div>
-        }
-      >
+      <Popover content={<ProfileCard taskDesc={taskDesc} aiEmployee={aiEmployee} />}>
         <Button
           shape="circle"
           style={{
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/ChatSettings.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/ChatSettings.tsx
new file mode 100644
index 0000000000..f9b194c42b
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/ChatSettings.tsx
@@ -0,0 +1,116 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React from 'react';
+import { SchemaComponent } from '@nocobase/client';
+import { useT } from '../../locale';
+import { InputsFormSettings } from './InputsFormSettings';
+import { ArrayItems } from '@formily/antd-v5';
+
+export const ChatSettings: React.FC = () => {
+  const t = useT();
+  return (
+    <SchemaComponent
+      components={{ InputsFormSettings, ArrayItems }}
+      schema={{
+        type: 'object',
+        name: 'chatSettings',
+        properties: {
+          newConversationSettings: {
+            type: 'void',
+            'x-component': 'Divider',
+            'x-component-props': {
+              children: t('New conversation settings'),
+            },
+          },
+          senderPlaceholder: {
+            type: 'string',
+            'x-component': 'Input',
+            'x-decorator': 'FormItem',
+            title: t('Sender placeholder'),
+          },
+          infoForm: {
+            type: 'array',
+            title: t('Required information form'),
+            description: t(
+              'Provide a form for the user to fill in the required information when starting a new conversation',
+            ),
+            'x-component': 'ArrayItems',
+            'x-decorator': 'FormItem',
+            items: {
+              type: 'object',
+              properties: {
+                space: {
+                  type: 'void',
+                  'x-component': 'Space',
+                  properties: {
+                    sort: {
+                      type: 'void',
+                      'x-decorator': 'FormItem',
+                      'x-component': 'ArrayItems.SortHandle',
+                    },
+                    name: {
+                      type: 'string',
+                      'x-decorator': 'FormItem',
+                      'x-component': 'Input',
+                      'x-component-props': {
+                        placeholder: t('Field name'),
+                      },
+                      required: true,
+                    },
+                    title: {
+                      type: 'string',
+                      'x-decorator': 'FormItem',
+                      'x-component': 'Input',
+                      'x-component-props': {
+                        placeholder: t('Field title'),
+                      },
+                      required: true,
+                    },
+                    type: {
+                      type: 'string',
+                      'x-decorator': 'FormItem',
+                      'x-component': 'Select',
+                      'x-component-props': {
+                        placeholder: t('Field type'),
+                      },
+                      required: true,
+                      enum: [
+                        {
+                          label: t('Blocks'),
+                          value: 'blocks',
+                        },
+                        {
+                          label: t('Collections'),
+                          value: 'collections',
+                        },
+                      ],
+                    },
+                    remove: {
+                      type: 'void',
+                      'x-decorator': 'FormItem',
+                      'x-component': 'ArrayItems.Remove',
+                    },
+                  },
+                },
+              },
+            },
+            properties: {
+              add: {
+                type: 'void',
+                title: t('Add field'),
+                'x-component': 'ArrayItems.Addition',
+              },
+            },
+          },
+        },
+      }}
+    />
+  );
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/Employees.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/Employees.tsx
index 169469fa45..2e8253669b 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/Employees.tsx
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/Employees.tsx
@@ -22,12 +22,13 @@ import { useT } from '../../locale';
 const { Meta } = Card;
 import { css } from '@emotion/css';
 import { EditOutlined, DeleteOutlined } from '@ant-design/icons';
-import { AvatarSelect } from './AvatarSelect';
 import { useForm } from '@formily/react';
 import { createForm } from '@formily/core';
 import { uid } from '@formily/shared';
 import { avatars } from '../avatars';
 import { ModelSettings } from './ModelSettings';
+import { ProfileSettings } from './ProfileSettings';
+import { ChatSettings } from './ChatSettings';
 
 const EmployeeContext = createContext(null);
 
@@ -38,63 +39,12 @@ const AIEmployeeForm: React.FC = () => {
         {
           key: 'profile',
           label: 'Profile',
-          children: (
-            <SchemaComponent
-              components={{ AvatarSelect }}
-              schema={{
-                type: 'void',
-                properties: {
-                  username: {
-                    type: 'string',
-                    title: 'Username',
-                    'x-decorator': 'FormItem',
-                    'x-component': 'Input',
-                  },
-                  nickname: {
-                    type: 'string',
-                    title: 'Nickname',
-                    'x-decorator': 'FormItem',
-                    'x-component': 'Input',
-                  },
-                  avatar: {
-                    type: 'string',
-                    title: 'Avatar',
-                    'x-decorator': 'FormItem',
-                    'x-component': 'AvatarSelect',
-                  },
-                  bio: {
-                    type: 'string',
-                    title: 'Bio',
-                    'x-decorator': 'FormItem',
-                    'x-component': 'Input.TextArea',
-                    'x-component-props': {
-                      placeholder:
-                        'The introduction to the AI employee will inform human colleagues about its skills and how to use it. This information will be displayed on the employee’s profile. This will not be part of the prompt of this AI employee.',
-                    },
-                  },
-                  about: {
-                    type: 'string',
-                    title: 'About me',
-                    'x-decorator': 'FormItem',
-                    'x-component': 'Input.TextArea',
-                    'x-component-props': {
-                      placeholder:
-                        'Define the AI employee’s role, guide its work, and instruct it complete user-assigned tasks. This will be part of the prompt of this AI employee.',
-                      autoSize: {
-                        minRows: 15,
-                      },
-                    },
-                  },
-                  greeting: {
-                    type: 'string',
-                    title: 'Greeting message',
-                    'x-decorator': 'FormItem',
-                    'x-component': 'Input.TextArea',
-                  },
-                },
-              }}
-            />
-          ),
+          children: <ProfileSettings />,
+        },
+        {
+          key: 'chat',
+          label: 'Chat settings',
+          children: <ChatSettings />,
         },
         // {
         //   key: 'skills',
@@ -178,41 +128,7 @@ const AIEmployeeForm: React.FC = () => {
         {
           key: 'modelSettings',
           label: 'Model Settings',
-          children: (
-            <SchemaComponent
-              components={{ ModelSettings }}
-              schema={{
-                type: 'object',
-                name: 'modelSettings',
-                properties: {
-                  llmService: {
-                    type: 'string',
-                    title: 'LLM service',
-                    'x-decorator': 'FormItem',
-                    'x-component': 'RemoteSelect',
-                    'x-component-props': {
-                      manual: false,
-                      fieldNames: {
-                        label: 'title',
-                        value: 'name',
-                      },
-                      service: {
-                        resource: 'llmServices',
-                        action: 'list',
-                        params: {
-                          fields: ['title', 'name'],
-                        },
-                      },
-                    },
-                  },
-                  settings: {
-                    type: 'void',
-                    'x-component': 'ModelSettings',
-                  },
-                },
-              }}
-            />
-          ),
+          children: <ModelSettings />,
         },
       ]}
     />
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/InputsFormSettings.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/InputsFormSettings.tsx
new file mode 100644
index 0000000000..c176f6406d
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/InputsFormSettings.tsx
@@ -0,0 +1,242 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React, { useState } from 'react';
+import { Card, Button, Empty, Modal, Collapse, Form, Input, Switch, Select, List, Tag } from 'antd';
+import { PlusOutlined } from '@ant-design/icons';
+import { useT } from '../../locale';
+import { useField } from '@formily/react';
+import { ArrayField } from '@formily/core';
+import { FormItem, FormLayout } from '@formily/antd-v5';
+import { EditOutlined, DeleteOutlined } from '@ant-design/icons';
+
+const inputSourceLabels = {
+  manual: 'Manual input',
+  blocks: 'Blocks',
+  fields: 'Field values',
+  collections: 'Data sources & collections',
+};
+
+const InputsEditModal: React.FC<{
+  title: string;
+  open: boolean;
+  onOk: (value: any) => void;
+  onCancel: () => void;
+}> = ({ open, title, onOk, onCancel }) => {
+  const t = useT();
+  const [inputField, setInputField] = useState({
+    title: '',
+    sources: {
+      manual: {
+        enabled: true,
+        value: '',
+      },
+      blocks: {
+        enabled: false,
+        value: [],
+      },
+      fields: {
+        enabled: false,
+        value: [],
+      },
+      collections: {
+        enabled: false,
+        value: [],
+      },
+    },
+  });
+
+  const handleTitleChange = (value: string) => {
+    setInputField((prev) => ({
+      ...prev,
+      title: value,
+    }));
+  };
+
+  const handleSwitchChange = (key: string, value: boolean) => {
+    setInputField((prev) => ({
+      ...prev,
+      sources: {
+        ...prev.sources,
+        [key]: {
+          ...prev.sources[key],
+          enabled: value,
+        },
+      },
+    }));
+  };
+
+  const handleValueChange = (key: string, value: any) => {
+    setInputField((prev) => ({
+      ...prev,
+      sources: {
+        ...prev.sources,
+        [key]: {
+          ...prev.sources[key],
+          value,
+        },
+      },
+    }));
+  };
+
+  return (
+    <Modal open={open} title={title} onOk={() => onOk(inputField)} onCancel={onCancel}>
+      <FormLayout layout="vertical">
+        <FormItem label={t('Title')}>
+          <Input value={inputField.title} onChange={(e) => handleTitleChange(e.target.value)} />
+        </FormItem>
+        <FormItem label={t('Input sources')}>
+          <Collapse
+            size="small"
+            items={[
+              {
+                key: 'manual',
+                label: t('Manual input'),
+                children: (
+                  <Form.Item>
+                    <Input placeholder={t('Placeholder')} onChange={(v) => handleValueChange('manual', v)} />
+                  </Form.Item>
+                ),
+                extra: <Switch size="small" defaultChecked onChange={(v) => handleSwitchChange('manual', v)} />,
+              },
+              {
+                key: 'blocks',
+                label: t('Blocks'),
+                children: (
+                  <Form.Item>
+                    <Select
+                      allowClear
+                      mode="multiple"
+                      options={[
+                        {
+                          key: 'table',
+                          value: 'table',
+                          label: t('Table'),
+                        },
+                        {
+                          key: 'form',
+                          value: 'form',
+                          label: t('Form'),
+                        },
+                      ]}
+                      onChange={(v) => handleValueChange('blocks', v)}
+                    />
+                  </Form.Item>
+                ),
+                extra: <Switch size="small" onChange={(v) => handleSwitchChange('blocks', v)} />,
+              },
+              {
+                key: 'fields',
+                label: t('Field values'),
+                children: (
+                  <Form.Item>
+                    <Select
+                      mode="multiple"
+                      allowClear
+                      options={[
+                        {
+                          key: 'input',
+                          value: 'input',
+                          label: t('Single line text'),
+                        },
+                      ]}
+                      onChange={(v) => handleValueChange('fields', v)}
+                    />
+                  </Form.Item>
+                ),
+                extra: <Switch size="small" onChange={(v) => handleSwitchChange('fields', v)} />,
+              },
+              {
+                key: 'collections',
+                label: t('Data sources & collections'),
+                children: (
+                  <Form.Item>
+                    <Select onChange={(v) => handleValueChange('collections', v)} />
+                  </Form.Item>
+                ),
+                extra: <Switch size="small" onChange={(v) => handleSwitchChange('collections', v)} />,
+              },
+            ]}
+          />
+        </FormItem>
+      </FormLayout>
+    </Modal>
+  );
+};
+
+export const InputsFormSettings: React.FC = () => {
+  const t = useT();
+  const field = useField<ArrayField>();
+  const [open, setOpen] = React.useState(false);
+
+  const handleAdd = (value: any) => {
+    const enabledSources = {};
+    for (const key in value.sources) {
+      if (value.sources[key].enabled) {
+        enabledSources[key] = value.sources[key];
+      }
+    }
+    value.sources = enabledSources;
+    field.value = [...(field.value || []), value];
+    setOpen(false);
+  };
+
+  return (
+    <Card
+      styles={{
+        body: {
+          padding: 0,
+        },
+      }}
+      extra={
+        <>
+          <Button size="small" variant="dashed" color="primary" icon={<PlusOutlined />} onClick={() => setOpen(true)}>
+            {t('Add field')}
+          </Button>
+          <InputsEditModal title={t('Add field')} open={open} onOk={handleAdd} onCancel={() => setOpen(false)} />
+        </>
+      }
+    >
+      {field.value && field.value.length ? (
+        <List
+          size="small"
+          dataSource={field.value}
+          renderItem={(item) => {
+            return (
+              <List.Item
+                actions={[
+                  <Button key="edit" icon={<EditOutlined />} type="text" />,
+                  <Button key="delete" icon={<DeleteOutlined />} type="text" />,
+                ]}
+              >
+                <List.Item.Meta title={item.title} />
+                <>
+                  {Object.keys(item.sources || {}).map((source) => {
+                    return (
+                      <Tag
+                        style={{
+                          marginBottom: '3px',
+                        }}
+                        key={source}
+                      >
+                        {t(inputSourceLabels[source])}
+                      </Tag>
+                    );
+                  })}
+                </>
+              </List.Item>
+            );
+          }}
+        />
+      ) : (
+        <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
+      )}
+    </Card>
+  );
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/ModelSettings.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/ModelSettings.tsx
index b46eea3fd8..2d295605ee 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/ModelSettings.tsx
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/ModelSettings.tsx
@@ -8,17 +8,17 @@
  */
 
 import { observer, useForm } from '@formily/react';
-import { useAPIClient, usePlugin, useRequest } from '@nocobase/client';
+import { SchemaComponent, useAPIClient, usePlugin, useRequest } from '@nocobase/client';
 import React from 'react';
 import PluginAIClient from '../../';
 
-export const useModelSettingsForm = (provider: string) => {
+const useModelOptionsForm = (provider: string) => {
   const plugin = usePlugin(PluginAIClient);
   const p = plugin.aiManager.llmProviders.get(provider);
   return p?.components?.ModelSettingsForm;
 };
 
-export const ModelSettings = observer(
+const ModelOptions = observer(
   () => {
     const form = useForm();
     const api = useAPIClient();
@@ -33,11 +33,49 @@ export const ModelSettings = observer(
         refreshDeps: [form.values?.modelSettings?.llmService],
       },
     );
-    const Component = useModelSettingsForm(data?.provider);
+    const Component = useModelOptionsForm(data?.provider);
     if (loading) {
       return null;
     }
     return Component ? <Component /> : null;
   },
-  { displayName: 'AIEmployeeModelSettingsForm' },
+  { displayName: 'AIEmployeeModelOptionsForm' },
 );
+
+export const ModelSettings: React.FC = () => {
+  return (
+    <SchemaComponent
+      components={{ ModelOptions }}
+      schema={{
+        type: 'object',
+        name: 'modelSettings',
+        properties: {
+          llmService: {
+            type: 'string',
+            title: 'LLM service',
+            'x-decorator': 'FormItem',
+            'x-component': 'RemoteSelect',
+            'x-component-props': {
+              manual: false,
+              fieldNames: {
+                label: 'title',
+                value: 'name',
+              },
+              service: {
+                resource: 'llmServices',
+                action: 'list',
+                params: {
+                  fields: ['title', 'name'],
+                },
+              },
+            },
+          },
+          settings: {
+            type: 'void',
+            'x-component': 'ModelOptions',
+          },
+        },
+      }}
+    />
+  );
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/ProfileSettings.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/ProfileSettings.tsx
new file mode 100644
index 0000000000..11c3eda7cc
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/manager/ProfileSettings.tsx
@@ -0,0 +1,72 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { SchemaComponent } from '@nocobase/client';
+import React from 'react';
+import { AvatarSelect } from './AvatarSelect';
+
+export const ProfileSettings: React.FC = () => {
+  return (
+    <SchemaComponent
+      components={{ AvatarSelect }}
+      schema={{
+        type: 'void',
+        properties: {
+          username: {
+            type: 'string',
+            title: 'Username',
+            'x-decorator': 'FormItem',
+            'x-component': 'Input',
+          },
+          nickname: {
+            type: 'string',
+            title: 'Nickname',
+            'x-decorator': 'FormItem',
+            'x-component': 'Input',
+          },
+          avatar: {
+            type: 'string',
+            title: 'Avatar',
+            'x-decorator': 'FormItem',
+            'x-component': 'AvatarSelect',
+          },
+          bio: {
+            type: 'string',
+            title: 'Bio',
+            'x-decorator': 'FormItem',
+            'x-component': 'Input.TextArea',
+            'x-component-props': {
+              placeholder:
+                'The introduction to the AI employee will inform human colleagues about its skills and how to use it. This information will be displayed on the employee’s profile. This will not be part of the prompt of this AI employee.',
+            },
+          },
+          about: {
+            type: 'string',
+            title: 'About me',
+            'x-decorator': 'FormItem',
+            'x-component': 'Input.TextArea',
+            'x-component-props': {
+              placeholder:
+                'Define the AI employee’s role, guide its work, and instruct it complete user-assigned tasks. This will be part of the prompt of this AI employee.',
+              autoSize: {
+                minRows: 15,
+              },
+            },
+          },
+          greeting: {
+            type: 'string',
+            title: 'Greeting message',
+            'x-decorator': 'FormItem',
+            'x-component': 'Input.TextArea',
+          },
+        },
+      }}
+    />
+  );
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/selector/AISelectorProvider.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/selector/AISelectorProvider.tsx
new file mode 100644
index 0000000000..e05cfae7dd
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/selector/AISelectorProvider.tsx
@@ -0,0 +1,47 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React, { createContext, useContext, useState } from 'react';
+import { Selector } from '../types';
+
+export const AISelectionContext = createContext<{
+  selectable: string;
+  selector?: Selector;
+  startSelect: (selectType: string, selector?: Selector) => void;
+  stopSelect: () => void;
+}>({
+  selectable: false,
+} as any);
+
+export const useAISelectionContext = () => {
+  return useContext(AISelectionContext);
+};
+
+export const AISelectionProvider: React.FC = (props) => {
+  const [selectable, setSelectable] = useState('');
+  const [selector, setSelector] = useState<Selector>(null);
+
+  const startSelect = (selectType: string, selector?: Selector) => {
+    if (selector) {
+      setSelector(selector);
+    }
+    setSelectable(selectType);
+  };
+
+  const stopSelect = () => {
+    setSelectable('');
+    setSelector(null);
+  };
+
+  return (
+    <AISelectionContext.Provider value={{ selectable, selector, startSelect, stopSelect }}>
+      {props.children}
+    </AISelectionContext.Provider>
+  );
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/selector/BlockSelector.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/selector/BlockSelector.tsx
new file mode 100644
index 0000000000..804578065d
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/selector/BlockSelector.tsx
@@ -0,0 +1,68 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React from 'react';
+import { Button } from 'antd';
+import { useT } from '../../locale';
+import { BuildOutlined } from '@ant-design/icons';
+import { useAISelectionContext } from './AISelectorProvider';
+import { useField } from '@formily/react';
+import { Field } from '@formily/core';
+import { CloseCircleOutlined, PauseOutlined } from '@ant-design/icons';
+
+export const BlockSelector: React.FC<{
+  onSelect?: (ctx: { uid: string }) => void;
+}> = ({ onSelect }) => {
+  const t = useT();
+  const { startSelect, stopSelect } = useAISelectionContext();
+  const [selecting, setSelecting] = React.useState(false);
+  const field = useField<Field>();
+
+  return (
+    <Button
+      variant="dashed"
+      color="primary"
+      icon={<BuildOutlined />}
+      size="small"
+      onClick={() => {
+        if (selecting) {
+          setSelecting(false);
+          stopSelect();
+          return;
+        }
+        setSelecting(true);
+        startSelect('blocks', {
+          onSelect: (ctx) => {
+            onSelect?.(ctx);
+            field.value = ctx.uid;
+            setSelecting(false);
+          },
+        });
+      }}
+    >
+      {selecting ? (
+        <>
+          {t('Selecting...')} <PauseOutlined />
+        </>
+      ) : field.value ? (
+        <>
+          {field.value}{' '}
+          <CloseCircleOutlined
+            onClick={(e) => {
+              e.stopPropagation();
+              field.value = null;
+            }}
+          />
+        </>
+      ) : (
+        t('Select block')
+      )}
+    </Button>
+  );
+};
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/selector/withAISelectable.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/selector/withAISelectable.tsx
new file mode 100644
index 0000000000..0a4ce43586
--- /dev/null
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/selector/withAISelectable.tsx
@@ -0,0 +1,71 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { createStyles } from '@nocobase/client';
+import React, { ComponentType, forwardRef } from 'react';
+import { useAISelectionContext } from './AISelectorProvider';
+import { useFieldSchema, useField } from '@formily/react';
+
+const useStyles = createStyles(({ token, css }) => {
+  return {
+    aiSelectable: css`
+      position: relative;
+      transition: all 0.3s ease;
+      &:hover {
+        cursor: grab;
+      }
+      &::after {
+        content: '';
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        background: rgba(0, 210, 255, 0.2);
+        opacity: 0;
+        transition: opacity 0.3s ease;
+        z-index: 1;
+      }
+
+      &:hover::after {
+        opacity: 1;
+      }
+    `,
+  };
+});
+
+export function withAISelectable<T = any>(
+  WrappedComponent: React.ComponentType,
+  options: {
+    selectType: string;
+  },
+) {
+  const { selectType } = options;
+  const SelectableComponent: ComponentType<T> = (props) => {
+    const { styles } = useStyles();
+    const { selectable, selector, stopSelect } = useAISelectionContext();
+    const fieldSchema = useFieldSchema();
+    const field = useField();
+
+    const handleSelect = () => {
+      selector?.onSelect?.({
+        uid: fieldSchema['x-uid'],
+        value: field?.value,
+      });
+      stopSelect();
+    };
+
+    return (
+      <div className={selectable === selectType ? styles.aiSelectable : ''} onClick={handleSelect}>
+        <WrappedComponent {...props} />
+      </div>
+    );
+  };
+  return SelectableComponent;
+}
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/settings/AIEmployeeButton.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/settings/AIEmployeeButton.tsx
index 7b7b60ddef..74e13a42ac 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/settings/AIEmployeeButton.tsx
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/settings/AIEmployeeButton.tsx
@@ -7,10 +7,11 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import React, { useMemo } from 'react';
+import React, { memo, useMemo, useState } from 'react';
 import {
+  SchemaComponent,
   SchemaSettings,
-  SchemaSettingsModalItem,
+  SchemaSettingsItem,
   useBlockContext,
   useCollection,
   useCollectionFilterOptions,
@@ -19,10 +20,14 @@ import {
 } from '@nocobase/client';
 import { useT } from '../../locale';
 import { avatars } from '../avatars';
-import { Card, Avatar, Tooltip } from 'antd';
+import { Card, Avatar, Tooltip, Modal } from 'antd';
 const { Meta } = Card;
 import { Schema } from '@formily/react';
-import { useAIEmployeeChatContext } from '../AIEmployeeChatProvider';
+import { createForm } from '@formily/core';
+import { InfoForm } from '../chatbox/InfoForm';
+import { uid } from '@formily/shared';
+import { useAISelectionContext } from '../selector/AISelectorProvider';
+import { AIEmployee } from '../types';
 
 export const useAIEmployeeButtonVariableOptions = () => {
   const collection = useCollection();
@@ -49,6 +54,138 @@ export const useAIEmployeeButtonVariableOptions = () => {
   }, [recordData, t, fields, blockType]);
 };
 
+const SettingsForm: React.FC<{
+  form: any;
+  aiEmployee: AIEmployee;
+}> = memo(({ form, aiEmployee }) => {
+  const { dn } = useSchemaSettings();
+  const t = useT();
+  return (
+    <SchemaComponent
+      components={{ InfoForm }}
+      scope={{ useAIEmployeeButtonVariableOptions }}
+      schema={{
+        type: 'void',
+        properties: {
+          [uid()]: {
+            'x-component': 'FormV2',
+            'x-component-props': {
+              form,
+            },
+            properties: {
+              profile: {
+                type: 'void',
+                'x-decorator': 'FormItem',
+                'x-component': () => (
+                  <Card
+                    variant="borderless"
+                    style={{
+                      maxWidth: 520,
+                    }}
+                  >
+                    <Meta
+                      avatar={aiEmployee.avatar ? <Avatar src={avatars(aiEmployee.avatar)} size={48} /> : null}
+                      title={aiEmployee.nickname}
+                      description={aiEmployee.bio}
+                    />
+                  </Card>
+                ),
+              },
+              taskDesc: {
+                type: 'string',
+                title: t('Task description'),
+                'x-decorator': 'FormItem',
+                'x-component': 'Input.TextArea',
+                description: t(
+                  'Displays the AI employee’s assigned tasks on the profile when hovering over the button.',
+                ),
+                default: dn.getSchemaAttribute('x-component-props.taskDesc'),
+              },
+              messageDivider: {
+                type: 'void',
+                'x-component': 'Divider',
+                'x-component-props': {
+                  children: t('Default message'),
+                },
+              },
+              message: {
+                type: 'object',
+                properties: {
+                  messageType: {
+                    type: 'string',
+                    title: t('Message type'),
+                    'x-decorator': 'FormItem',
+                    'x-component': 'Select',
+                    enum: [
+                      {
+                        label: t('Text'),
+                        value: 'text',
+                      },
+                      {
+                        label: t('Image'),
+                        value: 'image',
+                      },
+                    ],
+                    default: 'text',
+                    'x-component-props': {
+                      placeholder: t('Message type'),
+                    },
+                  },
+                  content: {
+                    title: t('Message content'),
+                    type: 'string',
+                    'x-decorator': 'FormItem',
+                    'x-component': 'Variable.RawTextArea',
+                    'x-component-props': {
+                      scope: '{{ useAIEmployeeButtonVariableOptions }}',
+                      changeOnSelect: true,
+                      fieldNames: {
+                        value: 'name',
+                        label: 'title',
+                      },
+                    },
+                  },
+                },
+                default: dn.getSchemaAttribute('x-component-props.message'),
+                'x-reactions': {
+                  dependencies: ['.manualMessage'],
+                  fulfill: {
+                    state: {
+                      visible: '{{ !$deps[0] }}',
+                    },
+                  },
+                },
+              },
+              autoSend: {
+                type: 'boolean',
+                'x-content': t('Send default message automatically'),
+                'x-decorator': 'FormItem',
+                'x-component': 'Checkbox',
+                default: dn.getSchemaAttribute('x-component-props.autoSend') || false,
+              },
+              formDivider: {
+                type: 'void',
+                'x-component': 'Divider',
+                'x-component-props': {
+                  children: t('Required information form'),
+                },
+              },
+              infoForm: {
+                type: 'object',
+                'x-component': 'InfoForm',
+                'x-component-props': {
+                  aiEmployee,
+                },
+                default: dn.getSchemaAttribute('x-component-props.infoForm'),
+              },
+            },
+          },
+        },
+      }}
+    />
+  );
+});
+
 export const aiEmployeeButtonSettings = new SchemaSettings({
   name: 'aiEmployees:button',
   items: [
@@ -57,171 +194,46 @@ export const aiEmployeeButtonSettings = new SchemaSettings({
       Component: () => {
         const t = useT();
         const { dn } = useSchemaSettings();
+        const [open, setOpen] = useState(false);
         const aiEmployee = dn.getSchemaAttribute('x-component-props.aiEmployee') || {};
-        const { attachments = [], actions = [] } = useAIEmployeeChatContext();
-        const attachmentsOptions = useMemo(
-          () =>
-            Object.entries(attachments).map(([name, item]) => ({
-              label: (
-                <Tooltip title={item.description} placement="right">
-                  {item.title}
-                </Tooltip>
-              ),
-              value: name,
-            })),
-          [attachments],
-        );
-        const actionsOptions = useMemo(
-          () =>
-            Object.entries(actions).map(([name, item]) => ({
-              label: (
-                <Tooltip title={item.description} placement="right">
-                  {item.title}
-                </Tooltip>
-              ),
-              value: name,
-            })),
-          [actions],
-        );
+        const form = useMemo(() => createForm({}), []);
+        const { selectable } = useAISelectionContext();
+
         return (
-          <SchemaSettingsModalItem
-            scope={{ useAIEmployeeButtonVariableOptions }}
-            schema={{
-              type: 'object',
-              title: t('Edit'),
-              properties: {
-                profile: {
-                  type: 'void',
-                  'x-decorator': 'FormItem',
-                  'x-component': () => (
-                    <Card
-                      variant="borderless"
-                      style={{
-                        maxWidth: 520,
-                      }}
-                    >
-                      <Meta
-                        avatar={aiEmployee.avatar ? <Avatar src={avatars(aiEmployee.avatar)} size={48} /> : null}
-                        title={aiEmployee.nickname}
-                        description={aiEmployee.bio}
-                      />
-                    </Card>
-                  ),
+          <div onClick={(e) => e.stopPropagation()}>
+            <SchemaSettingsItem title={t('Edit')} onClick={() => setOpen(true)} />
+            <Modal
+              styles={{
+                mask: {
+                  zIndex: selectable ? -1 : 1000,
                 },
-                taskDesc: {
-                  type: 'string',
-                  title: t('Task description'),
-                  'x-decorator': 'FormItem',
-                  'x-component': 'Input.TextArea',
-                  description: t(
-                    'Displays the AI employee’s assigned tasks on the profile when hovering over the button.',
-                  ),
-                  default: dn.getSchemaAttribute('x-component-props.taskDesc'),
+                wrapper: {
+                  zIndex: selectable ? -1 : 1000,
                 },
-                manualMessage: {
-                  type: 'boolean',
-                  'x-content': t('Requires the user to enter a message manually.'),
-                  'x-decorator': 'FormItem',
-                  'x-component': 'Checkbox',
-                  default: dn.getSchemaAttribute('x-component-props.manualMessage') || false,
-                },
-                message: {
-                  type: 'object',
-                  properties: {
-                    messageType: {
-                      type: 'string',
-                      title: t('Message type'),
-                      'x-decorator': 'FormItem',
-                      'x-component': 'Select',
-                      enum: [
-                        {
-                          label: t('Text'),
-                          value: 'text',
-                        },
-                        {
-                          label: t('Image'),
-                          value: 'image',
-                        },
-                      ],
-                      default: 'text',
-                      'x-component-props': {
-                        placeholder: t('Message type'),
-                      },
-                    },
-                    content: {
-                      title: t('Message content'),
-                      type: 'string',
-                      'x-decorator': 'FormItem',
-                      'x-component': 'Variable.RawTextArea',
-                      'x-component-props': {
-                        scope: '{{ useAIEmployeeButtonVariableOptions }}',
-                        changeOnSelect: true,
-                        fieldNames: {
-                          value: 'name',
-                          label: 'title',
-                        },
-                      },
-                    },
+              }}
+              title={t('Edit')}
+              open={open}
+              onCancel={() => {
+                setOpen(false);
+              }}
+              onOk={() => {
+                const { taskDesc, message, autoSend, infoForm } = form.values;
+                dn.deepMerge({
+                  'x-uid': dn.getSchemaAttribute('x-uid'),
+                  'x-component-props': {
+                    aiEmployee,
+                    message,
+                    taskDesc,
+                    autoSend,
+                    infoForm,
                   },
-                  default: dn.getSchemaAttribute('x-component-props.message'),
-                  'x-reactions': {
-                    dependencies: ['.manualMessage'],
-                    fulfill: {
-                      state: {
-                        visible: '{{ !$deps[0] }}',
-                      },
-                    },
-                  },
-                },
-                attachments: {
-                  type: 'array',
-                  title: t('Attachments'),
-                  'x-component': 'Checkbox.Group',
-                  'x-decorator': 'FormItem',
-                  enum: attachmentsOptions,
-                  default: dn.getSchemaAttribute('x-component-props.attachments'),
-                  'x-reactions': {
-                    target: 'attachments',
-                    fulfill: {
-                      state: {
-                        visible: '{{$self.value.length}}',
-                      },
-                    },
-                  },
-                },
-                actions: {
-                  type: 'array',
-                  title: t('Actions'),
-                  'x-component': 'Checkbox.Group',
-                  'x-decorator': 'FormItem',
-                  enum: actionsOptions,
-                  default: dn.getSchemaAttribute('x-component-props.actions'),
-                  'x-reactions': {
-                    target: 'actions',
-                    fulfill: {
-                      state: {
-                        visible: '{{$self.value.length}}',
-                      },
-                    },
-                  },
-                },
-              },
-            }}
-            title={t('Edit')}
-            onSubmit={({ message, taskDesc, manualMessage, attachments, actions }) => {
-              dn.deepMerge({
-                'x-uid': dn.getSchemaAttribute('x-uid'),
-                'x-component-props': {
-                  aiEmployee,
-                  message,
-                  taskDesc,
-                  manualMessage,
-                  attachments,
-                  actions,
-                },
-              });
-            }}
-          />
+                });
+                setOpen(false);
+              }}
+            >
+              <SettingsForm form={form} aiEmployee={aiEmployee} />
+            </Modal>
+          </div>
         );
       },
     },
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/types.ts b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/types.ts
index e1471294a7..66fccf2025 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/types.ts
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/ai-employees/types.ts
@@ -9,12 +9,24 @@
 
 import type { BubbleProps } from '@ant-design/x';
 
+export type Selector = {
+  onSelect?: (ctx: any) => void;
+};
+
 export type AIEmployee = {
   username: string;
   nickname?: string;
   avatar?: string;
   bio?: string;
   greeting?: string;
+  chatSettings?: {
+    senderPlaceholder?: string;
+    infoForm?: {
+      name: string;
+      title: string;
+      type: string;
+    }[];
+  };
 };
 
 export type Conversation = {
@@ -41,10 +53,17 @@ export type Action = {
 
 export type SendOptions = {
   sessionId?: string;
-  greeting?: boolean;
   aiEmployee?: AIEmployee;
   messages: {
     type: MessageType;
     content: string;
   }[];
+  infoFormValues?: any;
+};
+
+export type ShortcutOptions = {
+  aiEmployee: AIEmployee;
+  message: { type: MessageType; content: string };
+  infoFormValues: any;
+  autoSend: boolean;
 };
diff --git a/packages/plugins/@nocobase/plugin-ai/src/client/index.tsx b/packages/plugins/@nocobase/plugin-ai/src/client/index.tsx
index c82c1ed246..9bddb9a1e2 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/client/index.tsx
+++ b/packages/plugins/@nocobase/plugin-ai/src/client/index.tsx
@@ -7,7 +7,7 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { Plugin, lazy } from '@nocobase/client';
+import { CardItem, CollectionField, FormV2, Plugin, lazy } from '@nocobase/client';
 import { AIManager } from './manager/ai-manager';
 import { openaiProviderOptions } from './llm-providers/openai';
 import { deepseekProviderOptions } from './llm-providers/deepseek';
@@ -19,6 +19,7 @@ import { namespace } from './locale';
 import { detailsAIEmployeesInitializer, formAIEmployeesInitializer } from './ai-employees/initializer/AIEmployees';
 import { aiEmployeeButtonSettings } from './ai-employees/settings/AIEmployeeButton';
 import { useDetailsAIEmployeeChatContext, useFormAIEmployeeChatContext } from './ai-employees/useBlockChatContext';
+import { withAISelectable } from './ai-employees/selector/withAISelectable';
 const { AIEmployeesProvider } = lazy(() => import('./ai-employees/AIEmployeesProvider'), 'AIEmployeesProvider');
 const { AIEmployeeChatProvider } = lazy(
   () => import('./ai-employees/AIEmployeeChatProvider'),
@@ -45,6 +46,12 @@ export class PluginAIClient extends Plugin {
     this.app.addComponents({
       AIEmployeeButton,
       AIEmployeeChatProvider,
+      CardItem: withAISelectable(CardItem, {
+        selectType: 'blocks',
+      }),
+      CollectionField: withAISelectable(CollectionField, {
+        selectType: 'fields',
+      }),
     });
     this.app.addScopes({
       useDetailsAIEmployeeChatContext,
diff --git a/packages/plugins/@nocobase/plugin-ai/src/collections/ai-employees.ts b/packages/plugins/@nocobase/plugin-ai/src/collections/ai-employees.ts
index 2986179f04..411e0fb8f4 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/collections/ai-employees.ts
+++ b/packages/plugins/@nocobase/plugin-ai/src/collections/ai-employees.ts
@@ -40,6 +40,10 @@ export default {
       type: 'string',
       interface: 'textarea',
     },
+    {
+      name: 'chatSettings',
+      type: 'jsonb',
+    },
     {
       name: 'skills',
       type: 'jsonb',
diff --git a/packages/plugins/@nocobase/plugin-ai/src/server/collections/ai-messages.ts b/packages/plugins/@nocobase/plugin-ai/src/server/collections/ai-messages.ts
index 9688ed96e1..a2af960759 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/server/collections/ai-messages.ts
+++ b/packages/plugins/@nocobase/plugin-ai/src/server/collections/ai-messages.ts
@@ -21,20 +21,11 @@ export default defineCollection({
     },
     {
       name: 'content',
-      type: 'text',
+      type: 'jsonb',
     },
     {
       name: 'role',
       type: 'string',
     },
-    {
-      name: 'type',
-      type: 'string',
-      defaultValue: 'text',
-    },
-    {
-      name: 'title',
-      type: 'string',
-    },
   ],
 });
diff --git a/packages/plugins/@nocobase/plugin-ai/src/server/resource/aiConversations.ts b/packages/plugins/@nocobase/plugin-ai/src/server/resource/aiConversations.ts
index 7beeb14e69..3defcaf97c 100644
--- a/packages/plugins/@nocobase/plugin-ai/src/server/resource/aiConversations.ts
+++ b/packages/plugins/@nocobase/plugin-ai/src/server/resource/aiConversations.ts
@@ -10,8 +10,40 @@
 import actions, { Context, Next } from '@nocobase/actions';
 import snowflake from '../snowflake';
 import PluginAIServer from '../plugin';
-import { Model } from '@nocobase/database';
 import { convertUiSchemaToJsonSchema } from '../utils';
+import { Database, Model } from '@nocobase/database';
+
+async function parseInfoMessage(db: Database, aiEmployee: Model, content: Record<string, any>) {
+  const infoForm: {
+    name: string;
+    title: string;
+    type: 'blocks' | 'collections';
+  }[] = aiEmployee.chatSettings?.infoForm;
+  if (!infoForm) {
+    return;
+  }
+  if (!content) {
+    return;
+  }
+  let info = '';
+  for (const key in content) {
+    const field = infoForm.find((item) => item.name === key);
+    if (field.type === 'blocks') {
+      const uiSchemaRepo = db.getRepository('uiSchemas') as any;
+      const schema = await uiSchemaRepo.getJsonSchema(content[key]);
+      if (!schema) {
+        return;
+      }
+      info += `${field.title}: ${JSON.stringify(schema)}; `;
+    } else {
+      info += `${field.title}: ${content[key]}; `;
+    }
+  }
+  if (!info) {
+    return;
+  }
+  return `The following information you can utilize in your conversation: ${info}`;
+}
 
 export default {
   name: 'aiConversations',
@@ -71,19 +103,10 @@ export default {
       if (!conversation) {
         ctx.throw(400);
       }
-      const rows = await ctx.db.getRepository('aiConversations.messages', sessionId).find({
+      ctx.body = await ctx.db.getRepository('aiConversations.messages', sessionId).find({
         sort: ['-messageId'],
         limit: 10,
       });
-      ctx.body = rows.map((row: Model) => ({
-        messageId: row.messageId,
-        role: row.role,
-        content: {
-          title: row.title,
-          content: row.content,
-          type: row.type,
-        },
-      }));
       await next();
     },
     async sendMessages(ctx: Context, next: Next) {
@@ -154,9 +177,7 @@ export default {
           values: messages.map((message: any) => ({
             messageId: snowflake.generate(),
             role: message.role,
-            content: message.content.content,
-            type: message.content.type,
-            title: message.content.title,
+            content: message.content,
           })),
         });
       } catch (err) {
@@ -168,14 +189,12 @@ export default {
       ctx.status = 200;
       const userMessages = [];
       for (const msg of messages) {
-        if (msg.role !== 'user') {
+        if (msg.role !== 'user' && msg.role !== 'info') {
           continue;
         }
         let content = msg.content.content;
-        if (msg.content.type === 'uiSchema') {
-          const uiSchemaRepo = ctx.db.getRepository('uiSchemas');
-          const schema = await uiSchemaRepo.getJsonSchema(content);
-          content = JSON.stringify(convertUiSchemaToJsonSchema(schema));
+        if (msg.content.type === 'info') {
+          content = await parseInfoMessage(ctx.db, employee, content);
         }
         userMessages.push({
           role: 'user',
@@ -215,12 +234,19 @@ export default {
         message += chunk.content;
         ctx.res.write(`data: ${JSON.stringify({ type: 'content', body: chunk.content })}\n\n`);
       }
+      if (!message) {
+        ctx.res.write(`data: ${JSON.stringify({ type: 'error', body: 'No content' })}\n\n`);
+        ctx.res.end();
+        return next();
+      }
       await ctx.db.getRepository('aiConversations.messages', sessionId).create({
         values: {
           messageId: snowflake.generate(),
           role: aiEmployee,
-          content: message,
-          type: 'text',
+          content: {
+            content: message,
+            type: 'text',
+          },
         },
       });
       ctx.res.end();