diff --git a/web/.umirc.ts b/web/.umirc.ts
index 84afb1a4b05e9f3a1f369ad67a798e953489c3e7..4ecbc3c52bf9ee80953604a39536a7f8cabb35fb 100644
--- a/web/.umirc.ts
+++ b/web/.umirc.ts
@@ -18,7 +18,7 @@ export default defineConfig({
dva: {},
lessLoader: {
modifyVars: {
- hack: `true; @import "~@/less/variable.less";`,
+ hack: `true; @import "~@/less/index.less";`,
},
},
proxy: {
diff --git a/web/src/layouts/components/header/index.tsx b/web/src/layouts/components/header/index.tsx
index 7705cae780c871e103405c3b6945d812836165f0..210c823bd5bfd3813776e6887e886fde24d8596f 100644
--- a/web/src/layouts/components/header/index.tsx
+++ b/web/src/layouts/components/header/index.tsx
@@ -1,5 +1,4 @@
import { ReactComponent as StarIon } from '@/assets/svg/chat-star.svg';
-import { ReactComponent as FileIcon } from '@/assets/svg/file-management.svg';
import { ReactComponent as KnowledgeBaseIcon } from '@/assets/svg/knowledge-base.svg';
import { ReactComponent as Logo } from '@/assets/svg/logo.svg';
import { Layout, Radio, Space, theme } from 'antd';
@@ -23,7 +22,7 @@ const RagHeader = () => {
() => [
{ path: '/knowledge', name: 'Knowledge Base', icon: KnowledgeBaseIcon },
{ path: '/chat', name: 'Chat', icon: StarIon },
- { path: '/file', name: 'File Management', icon: FileIcon },
+ // { path: '/file', name: 'File Management', icon: FileIcon },
],
[],
);
diff --git a/web/src/less/index.less b/web/src/less/index.less
new file mode 100644
index 0000000000000000000000000000000000000000..252829931b587efba7270b55db987116a2bdc208
--- /dev/null
+++ b/web/src/less/index.less
@@ -0,0 +1,2 @@
+@import './variable.less';
+@import './mixins.less';
diff --git a/web/src/less/mixins.less b/web/src/less/mixins.less
new file mode 100644
index 0000000000000000000000000000000000000000..734924b2497dc2a43d5d271e0ba2c9f4746678cd
--- /dev/null
+++ b/web/src/less/mixins.less
@@ -0,0 +1,31 @@
+.chunkText() {
+ em {
+ color: red;
+ font-style: normal;
+ }
+ table {
+ width: 100%;
+ }
+
+ caption {
+ color: @blurBackground;
+ font-size: 20px;
+ height: 50px;
+ line-height: 50px;
+ font-weight: 600;
+ margin-bottom: 10px;
+ }
+
+ th {
+ color: #fff;
+ background-color: @blurBackground;
+ }
+
+ td:hover {
+ background: @blurBackgroundHover;
+ }
+
+ tr:nth-child(even) {
+ background-color: #f2f2f2;
+ }
+}
diff --git a/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.less b/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.less
index 8e6e4039ee6a6e0b282e1f78ca1fb8018f60a64b..1ee2e3f5ba91faadf8dac7ddd6b5c73f9ca2da00 100644
--- a/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.less
+++ b/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.less
@@ -9,35 +9,7 @@
.content {
flex: 1;
- em {
- color: red;
- font-style: normal;
- }
- table {
- width: 100%;
- }
-
- caption {
- color: @blurBackground;
- font-size: 20px;
- height: 50px;
- line-height: 50px;
- font-weight: 600;
- margin-bottom: 10px;
- }
-
- th {
- color: #fff;
- background-color: @blurBackground;
- }
-
- td:hover {
- background: @blurBackgroundHover;
- }
-
- tr:nth-child(even) {
- background-color: #f2f2f2;
- }
+ .chunkText;
}
.cardSelected {
diff --git a/web/src/pages/chat/chat-configuration-modal/index.tsx b/web/src/pages/chat/chat-configuration-modal/index.tsx
index fcc38e220c3ea5b38cf0a3324434c7361fec4a7e..aec87560d9ec712aa72e250096c686000226ad43 100644
--- a/web/src/pages/chat/chat-configuration-modal/index.tsx
+++ b/web/src/pages/chat/chat-configuration-modal/index.tsx
@@ -121,14 +121,16 @@ const ChatConfigurationModal = ({ visible, hideModal, id }: IProps) => {
);
useEffect(() => {
- const icon = currentDialog.icon;
- let fileList: UploadFile[] = [];
-
- if (icon) {
- fileList = [{ uid: '1', name: 'file', thumbUrl: icon, status: 'done' }];
+ if (visible) {
+ const icon = currentDialog.icon;
+ let fileList: UploadFile[] = [];
+
+ if (icon) {
+ fileList = [{ uid: '1', name: 'file', thumbUrl: icon, status: 'done' }];
+ }
+ form.setFieldsValue({ ...currentDialog, icon: fileList });
}
- form.setFieldsValue({ ...currentDialog, icon: fileList });
- }, [currentDialog, form]);
+ }, [currentDialog, form, visible]);
return (
<Modal
diff --git a/web/src/pages/chat/chat-container/index.less b/web/src/pages/chat/chat-container/index.less
index db2a86030cf4b635628c823e3756d4b6305441ac..ada0de0e53147f3033a4e0ca94dd9928ef95a1b3 100644
--- a/web/src/pages/chat/chat-container/index.less
+++ b/web/src/pages/chat/chat-container/index.less
@@ -28,6 +28,9 @@
padding: 0 14px;
background-color: rgba(249, 250, 251, 1);
}
+ .messageEmpty {
+ width: 300px;
+ }
.referenceIcon {
padding: 0 6px;
}
@@ -52,3 +55,6 @@
.referenceImagePreview {
width: 600px;
}
+.chunkContentText {
+ .chunkText;
+}
diff --git a/web/src/pages/chat/chat-container/index.tsx b/web/src/pages/chat/chat-container/index.tsx
index 39855cbe97920da846113fec17e5805280b87c3f..c084e2d9736bfd69cd42eed091dccb818878bac2 100644
--- a/web/src/pages/chat/chat-container/index.tsx
+++ b/web/src/pages/chat/chat-container/index.tsx
@@ -11,6 +11,7 @@ import {
Input,
List,
Popover,
+ Skeleton,
Space,
} from 'antd';
import classNames from 'classnames';
@@ -100,7 +101,12 @@ const MessageItem = ({
></Image>
</Popover>
<Space direction={'vertical'}>
- <div>{chunkItem?.content_with_weight}</div>
+ <div
+ dangerouslySetInnerHTML={{
+ __html: chunkItem?.content_with_weight,
+ }}
+ className={styles.chunkContentText}
+ ></div>
{documentId && (
<Flex gap={'middle'}>
<img src={fileThumbnails[documentId]} alt="" />
@@ -171,17 +177,24 @@ const MessageItem = ({
<Flex vertical gap={8} flex={1}>
<b>{isAssistant ? '' : userInfo.nickname}</b>
<div className={styles.messageText}>
- <Markdown
- rehypePlugins={[rehypeWrapReference]}
- components={
- {
- 'custom-typography': ({ children }: { children: string }) =>
- renderReference(children),
- } as any
- }
- >
- {item.content}
- </Markdown>
+ {item.content ? (
+ <Markdown
+ rehypePlugins={[rehypeWrapReference]}
+ components={
+ {
+ 'custom-typography': ({
+ children,
+ }: {
+ children: string;
+ }) => renderReference(children),
+ } as any
+ }
+ >
+ {item.content}
+ </Markdown>
+ ) : (
+ <Skeleton active className={styles.messageEmpty} />
+ )}
</div>
{isAssistant && referenceDocumentList.length > 0 && (
<List
diff --git a/web/src/pages/chat/hooks.ts b/web/src/pages/chat/hooks.ts
index 1c8926be5e6530fa3ab7f553825b0faaee7c0047..e2d61d8882904b34671056f042aecb57d16338d9 100644
--- a/web/src/pages/chat/hooks.ts
+++ b/web/src/pages/chat/hooks.ts
@@ -78,12 +78,10 @@ export const useSetCurrentDialog = () => {
const setCurrentDialog = useCallback(
(dialogId: string) => {
- if (dialogId) {
- dispatch({
- type: 'chatModel/setCurrentDialog',
- payload: { id: dialogId },
- });
- }
+ dispatch({
+ type: 'chatModel/setCurrentDialog',
+ payload: { id: dialogId },
+ });
},
[dispatch],
);
@@ -427,6 +425,12 @@ export const useSelectCurrentConversation = () => {
content: message,
id: uuid(),
} as IMessage,
+ {
+ role: MessageType.Assistant,
+ content: '',
+ id: uuid(),
+ reference: [],
+ } as IMessage,
],
};
});
@@ -525,12 +529,13 @@ export const useSendMessage = () => {
const conversation: IClientConversation = useSelector(
(state: any) => state.chatModel.currentConversation,
);
+ const fetchConversation = useFetchConversation();
const { handleClickConversation } = useClickConversationCard();
const sendMessage = useCallback(
- (message: string, id?: string) => {
- dispatch({
+ async (message: string, id?: string) => {
+ const retcode = await dispatch<any>({
type: 'chatModel/completeConversation',
payload: {
conversation_id: id ?? conversationId,
@@ -545,8 +550,22 @@ export const useSendMessage = () => {
],
},
});
+
+ if (retcode === 0) {
+ if (id) {
+ handleClickConversation(id);
+ } else {
+ fetchConversation(conversationId);
+ }
+ }
},
- [dispatch, conversation?.message, conversationId],
+ [
+ dispatch,
+ conversation?.message,
+ conversationId,
+ fetchConversation,
+ handleClickConversation,
+ ],
);
const handleSendMessage = useCallback(
@@ -557,12 +576,11 @@ export const useSendMessage = () => {
const data = await setConversation(message);
if (data.retcode === 0) {
const id = data.data.id;
- handleClickConversation(id);
sendMessage(message, id);
}
}
},
- [conversationId, handleClickConversation, setConversation, sendMessage],
+ [conversationId, setConversation, sendMessage],
);
return { sendMessage: handleSendMessage };
diff --git a/web/src/pages/chat/index.less b/web/src/pages/chat/index.less
index cb1546f2035d6ac3b8f270c78da770b0c58395fa..57eb15a7dd90c195727ed28b0c19c0cfd3f0a0e9 100644
--- a/web/src/pages/chat/index.less
+++ b/web/src/pages/chat/index.less
@@ -38,6 +38,7 @@
.chatTitleContent {
padding: 5px 10px;
+ overflow: auto;
}
.chatTitleCard {
diff --git a/web/src/pages/chat/index.tsx b/web/src/pages/chat/index.tsx
index 59dcbe6618292629a50670cb268e43fbe30ad8d7..961ce1a7a78ccdf7fefd05c900a99076d671704d 100644
--- a/web/src/pages/chat/index.tsx
+++ b/web/src/pages/chat/index.tsx
@@ -76,9 +76,9 @@ const Chat = () => {
(info: any) => {
info?.domEvent?.preventDefault();
info?.domEvent?.stopPropagation();
- if (dialogId) {
- setCurrentDialog(dialogId);
- }
+ // if (dialogId) {
+ setCurrentDialog(dialogId ?? '');
+ // }
showModal();
};
diff --git a/web/src/pages/chat/model.ts b/web/src/pages/chat/model.ts
index e885e60dd583e49ac6da718b5180fc1b5511972b..b3d632ba8d24d1c6d6dc5fbcb941316f73ee3b20 100644
--- a/web/src/pages/chat/model.ts
+++ b/web/src/pages/chat/model.ts
@@ -140,14 +140,15 @@ const model: DvaModel<ChatModelState> = {
},
*completeConversation({ payload }, { call, put }) {
const { data } = yield call(chatService.completeConversation, payload);
- if (data.retcode === 0) {
- yield put({
- type: 'getConversation',
- payload: {
- conversation_id: payload.conversation_id,
- },
- });
- }
+ // if (data.retcode === 0) {
+ // yield put({
+ // type: 'getConversation',
+ // payload: {
+ // conversation_id: payload.conversation_id,
+ // },
+ // });
+ // }
+ return data.retcode;
},
*removeConversation({ payload }, { call, put }) {
const { data } = yield call(chatService.removeConversation, {