Feat: Modify the data structure of the chunk in the conversation #3909 (#3955)

### What problem does this PR solve?

Feat: Modify the data structure of the chunk in the conversation #3909

### Type of change


- [x] New Feature (non-breaking change which adds functionality)
This commit is contained in:
balibabu
2024-12-10 16:36:16 +08:00
committed by GitHub
parent 03f00c9e6f
commit fc4e644e5f
27 changed files with 304 additions and 202 deletions

View File

@ -1,7 +1,6 @@
import Image from '@/components/image';
import SvgIcon from '@/components/svg-icon';
import { IReference } from '@/interfaces/database/chat';
import { IChunk } from '@/interfaces/database/knowledge';
import { IReference, IReferenceChunk } from '@/interfaces/database/chat';
import { getExtension } from '@/utils/document-util';
import { InfoCircleOutlined } from '@ant-design/icons';
import { Button, Flex, Popover, Space } from 'antd';
@ -11,6 +10,7 @@ import Markdown from 'react-markdown';
import reactStringReplace from 'react-string-replace';
import SyntaxHighlighter from 'react-syntax-highlighter';
import rehypeKatex from 'rehype-katex';
import rehypeRaw from 'rehype-raw';
import remarkGfm from 'remark-gfm';
import remarkMath from 'remark-math';
import { visitParents } from 'unist-util-visit-parents';
@ -36,7 +36,7 @@ const MarkdownContent = ({
content: string;
loading: boolean;
reference: IReference;
clickDocumentButton?: (documentId: string, chunk: IChunk) => void;
clickDocumentButton?: (documentId: string, chunk: IReferenceChunk) => void;
}) => {
const { t } = useTranslation();
const { setDocumentIds, data: fileThumbnails } =
@ -54,7 +54,7 @@ const MarkdownContent = ({
}, [reference, setDocumentIds]);
const handleDocumentButtonClick = useCallback(
(documentId: string, chunk: IChunk, isPdf: boolean) => () => {
(documentId: string, chunk: IReferenceChunk, isPdf: boolean) => () => {
if (!isPdf) {
return;
}
@ -85,15 +85,15 @@ const MarkdownContent = ({
const chunks = reference?.chunks ?? [];
const chunkItem = chunks[chunkIndex];
const document = reference?.doc_aggs?.find(
(x) => x?.doc_id === chunkItem?.doc_id,
(x) => x?.doc_id === chunkItem?.document_id,
);
const documentId = document?.doc_id;
const fileThumbnail = documentId ? fileThumbnails[documentId] : '';
const fileExtension = documentId ? getExtension(document?.doc_name) : '';
const imageId = chunkItem?.img_id;
const imageId = chunkItem?.image_id;
return (
<Flex
key={chunkItem?.chunk_id}
key={chunkItem?.id}
gap={10}
className={styles.referencePopoverWrapper}
>
@ -116,7 +116,7 @@ const MarkdownContent = ({
<Space direction={'vertical'}>
<div
dangerouslySetInnerHTML={{
__html: DOMPurify.sanitize(chunkItem?.content_with_weight),
__html: DOMPurify.sanitize(chunkItem?.content ?? ''),
}}
className={styles.chunkContentText}
></div>
@ -176,7 +176,7 @@ const MarkdownContent = ({
return (
<Markdown
rehypePlugins={[rehypeWrapReference, rehypeKatex]}
rehypePlugins={[rehypeWrapReference, rehypeKatex, rehypeRaw]}
remarkPlugins={[remarkGfm, remarkMath]}
components={
{