diff --git a/web/package-lock.json b/web/package-lock.json index 28dd39f17..3ea22a384 100644 --- a/web/package-lock.json +++ b/web/package-lock.json @@ -31,6 +31,7 @@ "openai-speech-stream-player": "^1.0.8", "rc-tween-one": "^3.0.6", "react-copy-to-clipboard": "^5.1.0", + "react-error-boundary": "^4.0.13", "react-force-graph": "^1.44.4", "react-i18next": "^14.0.0", "react-markdown": "^9.0.1", @@ -23119,6 +23120,17 @@ "node": ">=6" } }, + "node_modules/react-error-boundary": { + "version": "4.0.13", + "resolved": "https://registry.npmmirror.com/react-error-boundary/-/react-error-boundary-4.0.13.tgz", + "integrity": "sha512-b6PwbdSv8XeOSYvjt8LpgpKrZ0yGdtZokYwkwV2wlcZbxgopHX/hgPl5VgpnoVOWd868n1hktM8Qm4b+02MiLQ==", + "dependencies": { + "@babel/runtime": "^7.12.5" + }, + "peerDependencies": { + "react": ">=16.13.1" + } + }, "node_modules/react-error-overlay": { "version": "6.0.9", "resolved": "https://registry.npmmirror.com/react-error-overlay/-/react-error-overlay-6.0.9.tgz", diff --git a/web/package.json b/web/package.json index 326b2f7b1..bab2d0241 100644 --- a/web/package.json +++ b/web/package.json @@ -42,6 +42,7 @@ "openai-speech-stream-player": "^1.0.8", "rc-tween-one": "^3.0.6", "react-copy-to-clipboard": "^5.1.0", + "react-error-boundary": "^4.0.13", "react-force-graph": "^1.44.4", "react-i18next": "^14.0.0", "react-markdown": "^9.0.1", diff --git a/web/src/components/indented-tree/indented-tree.tsx b/web/src/components/indented-tree/indented-tree.tsx index 770f132fd..fc3cc6a86 100644 --- a/web/src/components/indented-tree/indented-tree.tsx +++ b/web/src/components/indented-tree/indented-tree.tsx @@ -17,6 +17,7 @@ import { import { TreeData } from '@antv/g6/lib/types'; import isEmpty from 'lodash/isEmpty'; import React, { useCallback, useEffect, useRef } from 'react'; +import { ErrorBoundary, FallbackProps } from 'react-error-boundary'; const rootId = 'root'; @@ -297,6 +298,17 @@ interface IProps { style?: React.CSSProperties; } +function fallbackRender({ error }: FallbackProps) { + // Call resetErrorBoundary() to reset the error boundary and retry the render. + + return ( +
+

Something went wrong:

+
{error.message}
+
+ ); +} + const IndentedTree = ({ data, show, style = {} }: IProps) => { const containerRef = useRef(null); const graphRef = useRef(null); @@ -382,16 +394,18 @@ const IndentedTree = ({ data, show, style = {} }: IProps) => { }, [render, data]); return ( -
+ +
+ ); }; diff --git a/web/src/hooks/chat-hooks.ts b/web/src/hooks/chat-hooks.ts index bdd5b167e..e5e29dac6 100644 --- a/web/src/hooks/chat-hooks.ts +++ b/web/src/hooks/chat-hooks.ts @@ -494,7 +494,7 @@ export const useFetchMindMap = () => { mutationFn: async (params: IAskRequestBody) => { try { const ret = await chatService.getMindMap(params); - return ret?.data?.data ?? []; + return ret?.data?.data ?? {}; } catch (error) { if (has(error, 'message')) { message.error(error.message); diff --git a/web/src/pages/search/index.less b/web/src/pages/search/index.less index 6b3977c99..158419023 100644 --- a/web/src/pages/search/index.less +++ b/web/src/pages/search/index.less @@ -57,15 +57,22 @@ .content { height: 100%; - .main { - width: 60%; - // background-color: aqua; + .hide { + display: none; + } + + .mainMixin() { overflow: auto; padding: 20px 10px 10px; - .chunks { - // overflow: auto; - // height: 60vh; - } + } + + .largeMain { + width: 100%; + .mainMixin(); + } + .main { + width: 60%; + .mainMixin(); } .graph { @@ -111,6 +118,9 @@ } .partialInput { width: 100%; + position: sticky; + top: 0; + z-index: 1; .input(); } diff --git a/web/src/pages/search/index.tsx b/web/src/pages/search/index.tsx index be8bce823..c4c7d5ec3 100644 --- a/web/src/pages/search/index.tsx +++ b/web/src/pages/search/index.tsx @@ -20,7 +20,7 @@ import { Space, Tag, } from 'antd'; -import { useState } from 'react'; +import { useMemo, useState } from 'react'; import { useTranslation } from 'react-i18next'; import MarkdownContent from '../chat/markdown-content'; import { useFetchBackgroundImage, useSendQuestion } from './hooks'; @@ -35,7 +35,6 @@ const SearchPage = () => { const { t } = useTranslation(); const [checkedList, setCheckedList] = useState([]); const { chunks, total } = useSelectTestingResult(); - // const appConf = useFetchAppConf(); const { sendQuestion, handleClickRelatedQuestion, @@ -62,6 +61,14 @@ const SearchPage = () => { handleTestChunk(selectedDocumentIds, pageNumber, pageSize); }; + const isMindMapEmpty = useMemo(() => { + return ( + !mindMapLoading && + ((Array.isArray(mindMap?.children) && mindMap.children.length === 0) || + !Array.isArray(mindMap?.children)) + ); + }, [mindMap, mindMapLoading]); + const InputSearch = ( { ) : ( -
+
{InputSearch} {answer.answer && (
@@ -165,7 +174,9 @@ const SearchPage = () => { onChange={onChange} />
-
+
{mindMapLoading ? ( ) : (