From db733ac9ce48edeabd1da478a31320a6d769c0da Mon Sep 17 00:00:00 2001 From: jialin Date: Mon, 20 Jan 2025 22:05:15 +0800 Subject: [PATCH] fix: json stream data is truncated --- .../seal-table/components/table-row.tsx | 10 ++++-- src/components/seal-table/index.tsx | 3 +- src/components/seal-table/styles/index.less | 4 +++ src/components/seal-table/types.ts | 1 + src/hooks/use-chunk-request.ts | 33 ++++++++++++++----- src/pages/llmodels/components/table-list.tsx | 3 ++ src/pages/llmodels/index.tsx | 22 ++++++------- 7 files changed, 54 insertions(+), 22 deletions(-) diff --git a/src/components/seal-table/components/table-row.tsx b/src/components/seal-table/components/table-row.tsx index 40728b4f..0e84401d 100644 --- a/src/components/seal-table/components/table-row.tsx +++ b/src/components/seal-table/components/table-row.tsx @@ -196,7 +196,7 @@ const TableRow: React.FC< const handleVisibilityChange = async () => { if (document.visibilityState === 'hidden') { cacheDataListRef.current = []; - setChildrenData([]); + // setChildrenData([]); } }; @@ -295,7 +295,13 @@ const TableRow: React.FC< {childrenData.length ? ( renderChildrenData() ) : ( - + )} diff --git a/src/components/seal-table/index.tsx b/src/components/seal-table/index.tsx index ba9ae19e..45f1a055 100644 --- a/src/components/seal-table/index.tsx +++ b/src/components/seal-table/index.tsx @@ -26,6 +26,7 @@ const SealTable: React.FC = ( onCell, expandedRowKeys, loading, + loadend, expandable, pollingChildren, watchChildren, @@ -117,7 +118,7 @@ const SealTable: React.FC = ( if (!props.dataSource.length) { return (
- +
); } diff --git a/src/components/seal-table/styles/index.less b/src/components/seal-table/styles/index.less index 98f03ae2..492d2d80 100644 --- a/src/components/seal-table/styles/index.less +++ b/src/components/seal-table/styles/index.less @@ -39,6 +39,10 @@ border-top: 0; border-radius: 0 0 var(--ant-table-header-border-radius) var(--ant-table-header-border-radius); + + .ant-empty-image { + height: 30px; + } } .row-wrapper { diff --git a/src/components/seal-table/types.ts b/src/components/seal-table/types.ts index e5d31722..064ceb21 100644 --- a/src/components/seal-table/types.ts +++ b/src/components/seal-table/types.ts @@ -49,6 +49,7 @@ export interface SealTableProps { pollingChildren?: boolean; watchChildren?: boolean; loading?: boolean; + loadend?: boolean; onCell?: (record: any, dataIndex: string) => void; onSort?: (dataIndex: string, order: 'ascend' | 'descend') => void; onExpand?: (expanded: boolean, record: any, rowKey: any) => void; diff --git a/src/hooks/use-chunk-request.ts b/src/hooks/use-chunk-request.ts index dd14175e..a6d0325b 100644 --- a/src/hooks/use-chunk-request.ts +++ b/src/hooks/use-chunk-request.ts @@ -123,6 +123,7 @@ const useSetChunkRequest = () => { const particalConfig = { params: {}, contentType: 'json' }; const timer = useRef(null); const loadedSize = useRef(0); + const bufferedDataRef = useRef(''); const reset = () => { loaded.current = 0; @@ -187,17 +188,33 @@ const useSetChunkRequest = () => { loaded.current = e.loaded || 0; total.current = e.total || 0; - let result = response; - let cres = ''; - console.log('chunkrequest============e==', result); + let currentRes = sliceData(response, e.loaded, loadedSize); + let result: any[] = []; + let cres = currentRes; + if (contentType === 'json') { - const currentRes = sliceData(response, e.loaded, loadedSize); - result = parseData(currentRes); - result = resetResultSchema(result); - cres = currentRes; + // Append the new data to the buffered data + bufferedDataRef.current += currentRes; + + // Find valid JSON strings in the buffered data + let validJSON = findValidJSONStrings(bufferedDataRef.current); + if (validJSON.length > 0) { + result = resetResultSchema(validJSON); + + // Calculate the position of the last complete JSON fragment, keeping the unfinished part + const lastValidJSON = validJSON[validJSON.length - 1]; + const lastJSONIndex = bufferedDataRef.current.lastIndexOf( + JSON.stringify(lastValidJSON) + ); + bufferedDataRef.current = bufferedDataRef.current.slice( + lastJSONIndex + JSON.stringify(lastValidJSON).length + ); + } + handler(result); + } else { + handler(currentRes); } - handler(result); console.log('chunkrequest===', { result, url, diff --git a/src/pages/llmodels/components/table-list.tsx b/src/pages/llmodels/components/table-list.tsx index 655b1066..1e16e996 100644 --- a/src/pages/llmodels/components/table-list.tsx +++ b/src/pages/llmodels/components/table-list.tsx @@ -77,6 +77,7 @@ interface ModelsProps { workerList: WorkerListItem[]; dataSource: ListItem[]; loading: boolean; + loadend: boolean; total: number; } @@ -125,6 +126,7 @@ const Models: React.FC = ({ workerList, queryParams, loading, + loadend, total }) => { const [expandAtom, setExpandAtom] = useAtom(modelsExpandKeysAtom); @@ -819,6 +821,7 @@ const Models: React.FC = ({ expandedRowKeys={expandedRowKeys} onExpand={handleExpandChange} loading={loading} + loadend={loadend} rowKey="id" childParentKey="model_id" expandable={true} diff --git a/src/pages/llmodels/index.tsx b/src/pages/llmodels/index.tsx index 6e569b38..0334dca6 100644 --- a/src/pages/llmodels/index.tsx +++ b/src/pages/llmodels/index.tsx @@ -22,11 +22,13 @@ const Models: React.FC = () => { dataList: ListItem[]; deletedIds: number[]; loading: boolean; + loadend: boolean; total: number; }>({ dataList: [], deletedIds: [], loading: false, + loadend: false, total: 0 }); @@ -52,6 +54,7 @@ const Models: React.FC = () => { return { total: pre.total, loading: false, + loadend: true, dataList: list, deletedIds: opts?.deletedIds || [] }; @@ -95,6 +98,7 @@ const Models: React.FC = () => { setDataSource({ dataList: res.items || [], loading: false, + loadend: true, total: res.pagination.total, deletedIds: [] }); @@ -103,6 +107,7 @@ const Models: React.FC = () => { setDataSource({ dataList: [], loading: false, + loadend: true, total: dataSource.total, deletedIds: [] }); @@ -173,13 +178,9 @@ const Models: React.FC = () => { const handleOnCancelViewLogs = useCallback(async () => { isPageHidden.current = false; - await Promise.all([ - createModelsChunkRequest(), - createModelsInstanceChunkRequest() - ]); - setTimeout(() => { - fetchData(); - }, 100); + await createModelsInstanceChunkRequest(); + await createModelsChunkRequest(); + fetchData(); }, [fetchData, createModelsChunkRequest, createModelsInstanceChunkRequest]); const handleSearch = useCallback(async () => { @@ -235,10 +236,8 @@ const Models: React.FC = () => { const handleVisibilityChange = async () => { if (document.visibilityState === 'visible') { isPageHidden.current = false; - await Promise.all([ - createModelsChunkRequest(), - createModelsInstanceChunkRequest() - ]); + await createModelsInstanceChunkRequest(); + await createModelsChunkRequest(); fetchData(); } else { isPageHidden.current = true; @@ -273,6 +272,7 @@ const Models: React.FC = () => { onCancelViewLogs={handleOnCancelViewLogs} queryParams={queryParams} loading={dataSource.loading} + loadend={dataSource.loadend} total={dataSource.total} deleteIds={dataSource.deletedIds} gpuDeviceList={gpuDeviceList}