diff --git a/web/src/assets/svg/file-icon/aep.svg b/web/src/assets/svg/file-icon/aep.svg new file mode 100644 index 0000000000000000000000000000000000000000..fcf26db8a5ce984d224292a232a6c3952b8a6d1f --- /dev/null +++ b/web/src/assets/svg/file-icon/aep.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/ai.svg b/web/src/assets/svg/file-icon/ai.svg new file mode 100644 index 0000000000000000000000000000000000000000..4e2bf68aa6ba894dcca784d85f95aaf4e9f1cf26 --- /dev/null +++ b/web/src/assets/svg/file-icon/ai.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/avi.svg b/web/src/assets/svg/file-icon/avi.svg new file mode 100644 index 0000000000000000000000000000000000000000..7225956cf39ed46112af1328f75eee788760c957 --- /dev/null +++ b/web/src/assets/svg/file-icon/avi.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/css.svg b/web/src/assets/svg/file-icon/css.svg new file mode 100644 index 0000000000000000000000000000000000000000..506a853c4464c8ea140bd73515faa0ba71b7297a --- /dev/null +++ b/web/src/assets/svg/file-icon/css.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/csv.svg b/web/src/assets/svg/file-icon/csv.svg new file mode 100644 index 0000000000000000000000000000000000000000..ad691e0d4f1d468dcfd81cdc4a8fca9a59b606a5 --- /dev/null +++ b/web/src/assets/svg/file-icon/csv.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/dmg.svg b/web/src/assets/svg/file-icon/dmg.svg new file mode 100644 index 0000000000000000000000000000000000000000..4755f46fa976d3d55a20ca11b8a703a569e9adef --- /dev/null +++ b/web/src/assets/svg/file-icon/dmg.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/doc.svg b/web/src/assets/svg/file-icon/doc.svg new file mode 100644 index 0000000000000000000000000000000000000000..2e68655ca1f4e395c4448f8fdb9a0a1112de0336 --- /dev/null +++ b/web/src/assets/svg/file-icon/doc.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/docx.svg b/web/src/assets/svg/file-icon/docx.svg new file mode 100644 index 0000000000000000000000000000000000000000..dd43254899c5a0de7665aaa39d9f8cf6cef5fcd8 --- /dev/null +++ b/web/src/assets/svg/file-icon/docx.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/eps.svg b/web/src/assets/svg/file-icon/eps.svg new file mode 100644 index 0000000000000000000000000000000000000000..4f2a66b1a03162da5127721ce5d51bf483d5310a --- /dev/null +++ b/web/src/assets/svg/file-icon/eps.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/exe.svg b/web/src/assets/svg/file-icon/exe.svg new file mode 100644 index 0000000000000000000000000000000000000000..fbaea17f1c008d7ab65e805e4a63535738923c8c --- /dev/null +++ b/web/src/assets/svg/file-icon/exe.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/fig.svg b/web/src/assets/svg/file-icon/fig.svg new file mode 100644 index 0000000000000000000000000000000000000000..7a500cdaebd1b291a1c633d204edf225d2fe0a5b --- /dev/null +++ b/web/src/assets/svg/file-icon/fig.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/gif.svg b/web/src/assets/svg/file-icon/gif.svg new file mode 100644 index 0000000000000000000000000000000000000000..ff4e0245578a224eaffe0aa7811e71d858cbd5aa --- /dev/null +++ b/web/src/assets/svg/file-icon/gif.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/html.svg b/web/src/assets/svg/file-icon/html.svg new file mode 100644 index 0000000000000000000000000000000000000000..8d157fe680eafa5b46b0786db868209da3fba7d0 --- /dev/null +++ b/web/src/assets/svg/file-icon/html.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/indd.svg b/web/src/assets/svg/file-icon/indd.svg new file mode 100644 index 0000000000000000000000000000000000000000..b86688b6601fd51e5293c7e113786e8344d19c4e --- /dev/null +++ b/web/src/assets/svg/file-icon/indd.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/java.svg b/web/src/assets/svg/file-icon/java.svg new file mode 100644 index 0000000000000000000000000000000000000000..bea4ca9cc4db714b1a029ab45da0b412898bb407 --- /dev/null +++ b/web/src/assets/svg/file-icon/java.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/jpeg.svg b/web/src/assets/svg/file-icon/jpeg.svg new file mode 100644 index 0000000000000000000000000000000000000000..490a29226c8627ffb29f9a7a8745ac105c3be3ad --- /dev/null +++ b/web/src/assets/svg/file-icon/jpeg.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/jpg.svg b/web/src/assets/svg/file-icon/jpg.svg new file mode 100644 index 0000000000000000000000000000000000000000..035ef810c09a0f321cef595dfcba40673c6a3a7b --- /dev/null +++ b/web/src/assets/svg/file-icon/jpg.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/js.svg b/web/src/assets/svg/file-icon/js.svg new file mode 100644 index 0000000000000000000000000000000000000000..3791ff50af569d16dd46e00a7f83c49dec6f005d --- /dev/null +++ b/web/src/assets/svg/file-icon/js.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/json.svg b/web/src/assets/svg/file-icon/json.svg new file mode 100644 index 0000000000000000000000000000000000000000..5ead80c1e29316f8c22cce8ffc2b60fa9e74708a --- /dev/null +++ b/web/src/assets/svg/file-icon/json.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/mkv.svg b/web/src/assets/svg/file-icon/mkv.svg new file mode 100644 index 0000000000000000000000000000000000000000..2b00a8eced65e6cece9d1446d32900f7a06717c6 --- /dev/null +++ b/web/src/assets/svg/file-icon/mkv.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/mp3.svg b/web/src/assets/svg/file-icon/mp3.svg new file mode 100644 index 0000000000000000000000000000000000000000..b311e4d535a306a0072106548cd1400c485ed5fd --- /dev/null +++ b/web/src/assets/svg/file-icon/mp3.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/mp4.svg b/web/src/assets/svg/file-icon/mp4.svg new file mode 100644 index 0000000000000000000000000000000000000000..4f5f79dc367db4db031858fd4411cef0f76d3ec8 --- /dev/null +++ b/web/src/assets/svg/file-icon/mp4.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/mpeg.svg b/web/src/assets/svg/file-icon/mpeg.svg new file mode 100644 index 0000000000000000000000000000000000000000..23c01e866ca7754baa3d2f18eb0152ea3dd66c47 --- /dev/null +++ b/web/src/assets/svg/file-icon/mpeg.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/pdf.svg b/web/src/assets/svg/file-icon/pdf.svg new file mode 100644 index 0000000000000000000000000000000000000000..6e1a5f060e42c08313f7a2961b1a054cac8b7965 --- /dev/null +++ b/web/src/assets/svg/file-icon/pdf.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/png.svg b/web/src/assets/svg/file-icon/png.svg new file mode 100644 index 0000000000000000000000000000000000000000..d581915bdd69b190fb9c316350423cb1dce9ecd5 --- /dev/null +++ b/web/src/assets/svg/file-icon/png.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/ppt.svg b/web/src/assets/svg/file-icon/ppt.svg new file mode 100644 index 0000000000000000000000000000000000000000..365c32de35c59ea55b9151af1b5a947ba1c3527a --- /dev/null +++ b/web/src/assets/svg/file-icon/ppt.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/pptx.svg b/web/src/assets/svg/file-icon/pptx.svg new file mode 100644 index 0000000000000000000000000000000000000000..09894ce2a018be244d9190e96b6f8178fb7dd5a6 --- /dev/null +++ b/web/src/assets/svg/file-icon/pptx.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/psd.svg b/web/src/assets/svg/file-icon/psd.svg new file mode 100644 index 0000000000000000000000000000000000000000..0aa30c0cf55410b1075d919c8199c6e858ddcabf --- /dev/null +++ b/web/src/assets/svg/file-icon/psd.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/rss.svg b/web/src/assets/svg/file-icon/rss.svg new file mode 100644 index 0000000000000000000000000000000000000000..b4114c7b2d5e6fe38a0564f005b116c89e924d68 --- /dev/null +++ b/web/src/assets/svg/file-icon/rss.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/sql.svg b/web/src/assets/svg/file-icon/sql.svg new file mode 100644 index 0000000000000000000000000000000000000000..0368a502cd712bcc9c5de1c5390aad53b87e98cf --- /dev/null +++ b/web/src/assets/svg/file-icon/sql.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/svg.svg b/web/src/assets/svg/file-icon/svg.svg new file mode 100644 index 0000000000000000000000000000000000000000..0957124cfcee59cf590477ad6d3e3d34dd69f0db --- /dev/null +++ b/web/src/assets/svg/file-icon/svg.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/tiff.svg b/web/src/assets/svg/file-icon/tiff.svg new file mode 100644 index 0000000000000000000000000000000000000000..de818515a6cc673c1868d4ace245d27be66486bd --- /dev/null +++ b/web/src/assets/svg/file-icon/tiff.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/txt.svg b/web/src/assets/svg/file-icon/txt.svg new file mode 100644 index 0000000000000000000000000000000000000000..0a4fe6fae031ec6e3231c542426138a672af1daa --- /dev/null +++ b/web/src/assets/svg/file-icon/txt.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/wav.svg b/web/src/assets/svg/file-icon/wav.svg new file mode 100644 index 0000000000000000000000000000000000000000..d2b018eef1cb8089598fd6ad0df8805ba289b83a --- /dev/null +++ b/web/src/assets/svg/file-icon/wav.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/webp.svg b/web/src/assets/svg/file-icon/webp.svg new file mode 100644 index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391 diff --git a/web/src/assets/svg/file-icon/xls.svg b/web/src/assets/svg/file-icon/xls.svg new file mode 100644 index 0000000000000000000000000000000000000000..7fe4a5c705d1c9ddfbdba45aa379debbb3b5d63c --- /dev/null +++ b/web/src/assets/svg/file-icon/xls.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/xlsx.svg b/web/src/assets/svg/file-icon/xlsx.svg new file mode 100644 index 0000000000000000000000000000000000000000..544a1384a82c79095bc45cda9898b42f5d4bee84 --- /dev/null +++ b/web/src/assets/svg/file-icon/xlsx.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/assets/svg/file-icon/xml.svg b/web/src/assets/svg/file-icon/xml.svg new file mode 100644 index 0000000000000000000000000000000000000000..4e61546c2a58b0b9387a4fa4aca6d9d0ef269cd0 --- /dev/null +++ b/web/src/assets/svg/file-icon/xml.svg @@ -0,0 +1,10 @@ + + + + + + \ No newline at end of file diff --git a/web/src/components/new-document-link.tsx b/web/src/components/new-document-link.tsx new file mode 100644 index 0000000000000000000000000000000000000000..84c0c9378db6d668b1740181dcef4b6ad136df68 --- /dev/null +++ b/web/src/components/new-document-link.tsx @@ -0,0 +1,20 @@ +import { api_host } from '@/utils/api'; +import React from 'react'; + +interface IProps extends React.PropsWithChildren { + documentId: string; +} + +const NewDocumentLink = ({ children, documentId }: IProps) => { + return ( + + {children} + + ); +}; + +export default NewDocumentLink; diff --git a/web/src/components/svg-icon.tsx b/web/src/components/svg-icon.tsx new file mode 100644 index 0000000000000000000000000000000000000000..d7c16f478d2f8bb6429b4c119c0de41a5267f03d --- /dev/null +++ b/web/src/components/svg-icon.tsx @@ -0,0 +1,34 @@ +import { + UseDynamicSVGImportOptions, + useDynamicSVGImport, +} from '@/hooks/commonHooks'; + +interface IconProps extends React.SVGProps { + name: string; + onCompleted?: UseDynamicSVGImportOptions['onCompleted']; + onError?: UseDynamicSVGImportOptions['onError']; +} + +const SvgIcon: React.FC = ({ + name, + onCompleted, + onError, + ...rest +}): React.ReactNode | null => { + const { error, loading, SvgIcon } = useDynamicSVGImport(name, { + onCompleted, + onError, + }); + if (error) { + return error.message; + } + if (loading) { + return 'Loading...'; + } + if (SvgIcon) { + return ; + } + return null; +}; + +export default SvgIcon; diff --git a/web/src/constants/common.ts b/web/src/constants/common.ts index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..d315cf17548fcb313aed9de61370ffd197886f8a 100644 --- a/web/src/constants/common.ts +++ b/web/src/constants/common.ts @@ -0,0 +1,40 @@ +export const fileIconMap = { + aep: 'aep.svg', + ai: 'ai.svg', + avi: 'avi.svg', + css: 'css.svg', + csv: 'csv.svg', + dmg: 'dmg.svg', + doc: 'doc.svg', + docx: 'docx.svg', + eps: 'eps.svg', + exe: 'exe.svg', + fig: 'fig.svg', + gif: 'gif.svg', + html: 'html.svg', + indd: 'indd.svg', + java: 'java.svg', + jpeg: 'jpeg.svg', + jpg: 'jpg.svg', + js: 'js.svg', + json: 'json.svg', + mkv: 'mkv.svg', + mp3: 'mp3.svg', + mp4: 'mp4.svg', + mpeg: 'mpeg.svg', + pdf: 'pdf.svg', + png: 'png.svg', + ppt: 'ppt.svg', + pptx: 'pptx.svg', + psd: 'psd.svg', + rss: 'rss.svg', + sql: 'sql.svg', + svg: 'svg.svg', + tiff: 'tiff.svg', + txt: 'txt.svg', + wav: 'wav.svg', + webp: 'webp.svg', + xls: 'xls.svg', + xlsx: 'xlsx.svg', + xml: 'xml.svg', +}; diff --git a/web/src/hooks/commonHooks.ts b/web/src/hooks/commonHooks.ts index e4361cd29fe48946573a72e6eecfcf07d3383f02..6cbf10e8974d50eda4daa762cfd306565bcd7a95 100644 --- a/web/src/hooks/commonHooks.ts +++ b/web/src/hooks/commonHooks.ts @@ -32,3 +32,39 @@ export const useDeepCompareEffect = ( }; }, []); }; + +export interface UseDynamicSVGImportOptions { + onCompleted?: ( + name: string, + SvgIcon: React.FC> | undefined, + ) => void; + onError?: (err: Error) => void; +} + +export function useDynamicSVGImport( + name: string, + options: UseDynamicSVGImportOptions = {}, +) { + const ImportedIconRef = useRef>>(); + const [loading, setLoading] = useState(false); + const [error, setError] = useState(); + + const { onCompleted, onError } = options; + useEffect(() => { + setLoading(true); + const importIcon = async (): Promise => { + try { + ImportedIconRef.current = (await import(name)).ReactComponent; + onCompleted?.(name, ImportedIconRef.current); + } catch (err: any) { + onError?.(err); + setError(err); + } finally { + setLoading(false); + } + }; + importIcon(); + }, [name, onCompleted, onError]); + + return { error, loading, SvgIcon: ImportedIconRef.current }; +} diff --git a/web/src/interfaces/database/chat.ts b/web/src/interfaces/database/chat.ts index eb4ec51f370c600471669754315ac0f5db5d8a44..af6b12c902b67a0dd929947f986dc5cf92bcac0c 100644 --- a/web/src/interfaces/database/chat.ts +++ b/web/src/interfaces/database/chat.ts @@ -71,7 +71,7 @@ export interface IReference { total: number; } -interface Docagg { +export interface Docagg { count: number; doc_id: string; doc_name: string; diff --git a/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.tsx b/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.tsx index 89af5283bbace732e5f67626c13c6a95f0df99cf..e509ec0cbadd57a7b9c6dc60728a6c5003120d3a 100644 --- a/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.tsx +++ b/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.tsx @@ -1,6 +1,5 @@ import Image from '@/components/image'; import { IChunk } from '@/interfaces/database/knowledge'; -import { api_host } from '@/utils/api'; import { Card, Checkbox, CheckboxProps, Flex, Popover, Switch } from 'antd'; import { useState } from 'react'; import styles from './index.less'; @@ -48,11 +47,6 @@ const ChunkCard = ({ } > - )} diff --git a/web/src/pages/add-knowledge/components/knowledge-testing/testing-result/select-files.tsx b/web/src/pages/add-knowledge/components/knowledge-testing/testing-result/select-files.tsx index ab5d06c9c2b9640d186108b49738861a372407a3..cb80d01750052e6b5f23961c9d3ba63c32088a05 100644 --- a/web/src/pages/add-knowledge/components/knowledge-testing/testing-result/select-files.tsx +++ b/web/src/pages/add-knowledge/components/knowledge-testing/testing-result/select-files.tsx @@ -1,6 +1,6 @@ import { ReactComponent as NavigationPointerIcon } from '@/assets/svg/navigation-pointer.svg'; +import NewDocumentLink from '@/components/new-document-link'; import { ITestingDocument } from '@/interfaces/database/knowledge'; -import { api_host } from '@/utils/api'; import { Table, TableProps } from 'antd'; import { useDispatch, useSelector } from 'umi'; @@ -34,13 +34,9 @@ const SelectFiles = ({ handleTesting }: IProps) => { key: 'view', width: 50, render: (_, { doc_id }) => ( - + - + ), }, ]; diff --git a/web/src/pages/add-knowledge/index.tsx b/web/src/pages/add-knowledge/index.tsx index 370d1150fe5f5fe337b1edd1f9aed3a0d076e566..ec4ba5df66b055686ff8892013dff19c2838e7ca 100644 --- a/web/src/pages/add-knowledge/index.tsx +++ b/web/src/pages/add-knowledge/index.tsx @@ -2,7 +2,7 @@ import { useKnowledgeBaseId } from '@/hooks/knowledgeHook'; import { useSecondPathName, useThirdPathName } from '@/hooks/routeHook'; import { Breadcrumb } from 'antd'; import { ItemType } from 'antd/es/breadcrumb/Breadcrumb'; -import { useEffect, useMemo } from 'react'; +import { useCallback, useEffect, useMemo } from 'react'; import { Link, Outlet, useDispatch, useLocation, useNavigate } from 'umi'; import Siderbar from './components/knowledge-sidebar'; import { @@ -25,9 +25,9 @@ const KnowledgeAdding = () => { const datasetActiveKey: KnowledgeDatasetRouteKey = useThirdPathName() as KnowledgeDatasetRouteKey; - const gotoList = () => { + const gotoList = useCallback(() => { navigate('/knowledge'); - }; + }, [navigate]); const breadcrumbItems: ItemType[] = useMemo(() => { const items: ItemType[] = [ @@ -54,7 +54,7 @@ const KnowledgeAdding = () => { } return items; - }, [activeKey, datasetActiveKey]); + }, [activeKey, datasetActiveKey, gotoList, knowledgeBaseId]); useEffect(() => { const search: string = location.search.slice(1); @@ -71,7 +71,7 @@ const KnowledgeAdding = () => { ...map, }, }); - }, [location]); + }, [location, dispatch]); return ( <> diff --git a/web/src/pages/chat/chat-container/index.less b/web/src/pages/chat/chat-container/index.less index c0ce04b554a41d1706c1191501783f732e9f9bd2..1eba20a51a08afd8a11ca1a4678505d410e2d4fb 100644 --- a/web/src/pages/chat/chat-container/index.less +++ b/web/src/pages/chat/chat-container/index.less @@ -39,3 +39,11 @@ .messageItemRight { text-align: right; } + +.referencePopoverWrapper { + width: 50vw; +} + +.referenceChunkImage { + width: 10vw; +} diff --git a/web/src/pages/chat/chat-container/index.tsx b/web/src/pages/chat/chat-container/index.tsx index 31d939ff506dfc6c4b066bff950d9ba5a8c49e71..4c0704f7ba467db3c2248e84ba2d809bf080cd90 100644 --- a/web/src/pages/chat/chat-container/index.tsx +++ b/web/src/pages/chat/chat-container/index.tsx @@ -3,18 +3,38 @@ import { MessageType } from '@/constants/chat'; import { useOneNamespaceEffectsLoading } from '@/hooks/storeHooks'; import { useSelectUserInfo } from '@/hooks/userSettingHook'; import { IReference, Message } from '@/interfaces/database/chat'; -import { Avatar, Button, Flex, Input, Popover } from 'antd'; +import { + Avatar, + Button, + Flex, + Input, + List, + Popover, + Space, + Typography, +} from 'antd'; import classNames from 'classnames'; import { ChangeEventHandler, useCallback, useMemo, useState } from 'react'; import reactStringReplace from 'react-string-replace'; -import { useFetchConversation, useSendMessage } from '../hooks'; +import { + useFetchConversation, + useGetFileIcon, + useScrollToBottom, + useSendMessage, +} from '../hooks'; import { IClientConversation } from '../interface'; +import Image from '@/components/image'; +import NewDocumentLink from '@/components/new-document-link'; import { InfoCircleOutlined } from '@ant-design/icons'; import Markdown from 'react-markdown'; import { visitParents } from 'unist-util-visit-parents'; import styles from './index.less'; +const reg = /(#{2}\d+\${2})/g; + +const getChunkIndex = (match: string) => Number(match.slice(2, 3)); + const rehypeWrapReference = () => { return function wrapTextTransform(tree: any) { visitParents(tree, 'text', (node, ancestors) => { @@ -28,32 +48,69 @@ const rehypeWrapReference = () => { }; }; -const MessageItem = ({ item }: { item: Message; references: IReference[] }) => { +const MessageItem = ({ + item, + reference, +}: { + item: Message; + reference: IReference; +}) => { const userInfo = useSelectUserInfo(); - const popoverContent = useMemo( - () => ( -
-

Content

-

Content

-
- ), - [], + const isAssistant = item.role === MessageType.Assistant; + + const getFileIcon = useGetFileIcon(); + + const getPopoverContent = useCallback( + (chunkIndex: number) => { + const chunks = reference?.chunks ?? []; + const chunkItem = chunks[chunkIndex]; + const document = reference?.doc_aggs.find( + (x) => x?.doc_id === chunkItem?.doc_id, + ); + const documentId = document?.doc_id; + return ( + + + +
{chunkItem?.content_with_weight}
+ {documentId && ( + + {document?.doc_name} + + )} +
+
+ ); + }, + [reference], ); const renderReference = useCallback( (text: string) => { - return reactStringReplace(text, /#{2}\d{1,}\${2}/g, (match, i) => { + return reactStringReplace(text, reg, (match, i) => { + const chunkIndex = getChunkIndex(match); return ( - + ); }); }, - [popoverContent], + [getPopoverContent], ); + const referenceDocumentList = useMemo(() => { + return reference?.doc_aggs ?? []; + }, [reference?.doc_aggs]); + return (
{ )} - - {item.role === MessageType.Assistant ? 'Resume Assistant' : 'You'} - + {isAssistant ? 'Resume Assistant' : 'You'}
{ {item.content}
+ {isAssistant && referenceDocumentList.length > 0 && ( + ( + + + {/* */} + + + {item.doc_name} + + + )} + /> + )}
@@ -117,6 +188,8 @@ const ChatContainer = () => { 'completeConversation', 'getConversation', ]); + const ref = useScrollToBottom(); + useGetFileIcon(); const handlePressEnter = () => { setValue(''); @@ -131,14 +204,24 @@ const ChatContainer = () => {
- {conversation?.message?.map((message) => ( - - ))} + {conversation?.message?.map((message) => { + const assistantMessages = conversation?.message + ?.filter((x) => x.role === MessageType.Assistant) + .slice(1); + const referenceIndex = assistantMessages.findIndex( + (x) => x.id === message.id, + ); + const reference = conversation.reference[referenceIndex]; + return ( + + ); + })}
+
{ return { sendMessage: handleSendMessage }; }; +export const useScrollToBottom = () => { + const ref = useRef(null); + let chatModel: ChatModelState = useSelector((state: any) => state.chatModel); + const { currentConversation } = chatModel; + + const scrollToBottom = useCallback(() => { + if (currentConversation.id) { + ref.current?.scrollIntoView({ behavior: 'instant' }); + } + }, [currentConversation]); + + useEffect(() => { + scrollToBottom(); + }, [scrollToBottom]); + + return ref; +}; + +export const useGetFileIcon = () => { + // const req = require.context('@/assets/svg/file-icon'); + // const ret = req.keys().map(req); + // console.info(ret); + // useEffect(() => {}, []); + + const getFileIcon = (filename: string) => { + const ext: string = getFileExtension(filename); + const iconPath = fileIconMap[ext as keyof typeof fileIconMap]; + // const x = require(`@/assets/svg/file-icon/${iconPath}`); + return `@/assets/svg/file-icon/${iconPath}`; + }; + + return getFileIcon; +}; + //#endregion diff --git a/web/src/utils/domUtils.ts b/web/src/utils/domUtils.ts new file mode 100644 index 0000000000000000000000000000000000000000..8710ec70760565966c09aaad4e03362bca9c8613 --- /dev/null +++ b/web/src/utils/domUtils.ts @@ -0,0 +1,3 @@ +export const scrollToBottom = (element: HTMLElement) => { + element.scrollTo(0, element.scrollHeight); +}; diff --git a/web/src/utils/index.ts b/web/src/utils/index.ts index f278904713069e1774bee4c8cd934ed74d267cba..d0cdcef726387586977d1d4da5fe105e89a8a0f9 100644 --- a/web/src/utils/index.ts +++ b/web/src/utils/index.ts @@ -25,3 +25,6 @@ export default { getWidth, rsaPsw, }; + +export const getFileExtension = (filename: string) => + filename.slice(filename.lastIndexOf('.') + 1).toLowerCase(); diff --git a/web/src/utils/request.ts b/web/src/utils/request.ts index 2005a821858566bba8af575815c4052072449624..b04bd54dfe3a82b733175f6dc4b3821923ffc3d6 100644 --- a/web/src/utils/request.ts +++ b/web/src/utils/request.ts @@ -107,7 +107,6 @@ request.interceptors.request.use((url: string, options: any) => { * */ request.interceptors.response.use(async (response: any, request) => { - console.log(response, request); const data: ResponseType = await response.clone().json(); // response 拦截