Record scroll test (#2783)

* perf: history add scrollList (#2696)

* perf: chatHistorySlider add virtualList

* perf: chat records add scrollList

* delete console

* perf: ScrollData add ref props

* 优化代码

* optimize code && add line breaks

* add total records display

* finish test

* perf: ScrollComponent load data

* perf: Scroll components load

* perf: scroll code

---------

Co-authored-by: papapatrick <109422393+Patrickill@users.noreply.github.com>

projects/app/src/web/common/api/fetch.ts

@@ -100,7 +100,7 @@ export const streamFetch = ({
         return finish();
       }
 
-      window.windowHidden
+      document.hidden
         ? setTimeout(animateResponseText, 16)
         : requestAnimationFrame(animateResponseText);
     }

projects/app/src/web/common/system/utils.ts

@@ -13,8 +13,3 @@ export const getWebLLMModel = (model?: string) => {
   const list = useSystemStore.getState().llmModelList;
   return list.find((item) => item.model === model || item.name === model) ?? list[0];
 };
-
-export const watchWindowHidden = () => {
-  // @ts-ignore
-  window.windowHidden = document.hidden;
-};

projects/app/src/web/core/chat/api.ts

@@ -1,5 +1,10 @@
 import { GET, POST, DELETE, PUT } from '@/web/common/api/request';
-import type { ChatHistoryItemType, ChatHistoryItemResType } from '@fastgpt/global/core/chat/type.d';
+import type {
+  ChatHistoryItemType,
+  ChatHistoryItemResType,
+  ChatSiteItemType,
+  ChatItemType
+} from '@fastgpt/global/core/chat/type.d';
 import { getResDataQuery } from '@/pages/api/core/chat/getResData';
 import type {
   CloseCustomFeedbackParams,
@@ -21,6 +26,10 @@ import { UpdateChatFeedbackProps } from '@fastgpt/global/core/chat/api';
 import { AuthTeamTagTokenProps } from '@fastgpt/global/support/user/team/tag';
 import { AppListItemType } from '@fastgpt/global/core/app/type';
 import { PaginationProps, PaginationResponse } from '@fastgpt/web/common/fetch/type';
+import type {
+  getPaginationRecordsBody,
+  getPaginationRecordsResponse
+} from '@/pages/api/core/chat/getPaginationRecords';
 
 /**
  * 获取初始化聊天内容
@@ -31,6 +40,7 @@ export const getInitOutLinkChatInfo = (data: InitOutLinkChatProps) =>
   GET<InitChatResponse>(`/core/chat/outLink/init`, data);
 export const getTeamChatInfo = (data: InitTeamChatProps) =>
   GET<InitChatResponse>(`/core/chat/team/init`, data);
+
 /**
  * get current window history(appid or shareId)
  */
@@ -41,6 +51,10 @@ export const getChatHistories = (data: PaginationProps<GetHistoriesProps>) =>
  */
 export const getChatResData = (data: getResDataQuery) =>
   GET<ChatHistoryItemResType[]>(`/core/chat/getResData`, data);
+
+export const getChatRecords = (data: getPaginationRecordsBody) =>
+  POST<getPaginationRecordsResponse>('core/chat/getPaginationRecords', data);
+
 /**
  * delete one history
  */

projects/app/src/web/core/chat/context/chatContext.tsx

@@ -13,7 +13,7 @@ import { ClearHistoriesProps, DelHistoryProps, UpdateHistoryProps } from '@/glob
 import { BoxProps, useDisclosure } from '@chakra-ui/react';
 import { useChatStore } from './storeChat';
 import { getNanoid } from '@fastgpt/global/common/string/tools';
-import { useScrollPagination } from '@fastgpt/web/hooks/useScrollPagination';
+import { useVirtualScrollPagination } from '@fastgpt/web/hooks/useScrollPagination';
 
 type ChatContextValueType = {
   params: Record<string, string | number>;
@@ -111,7 +111,7 @@ const ChatContextProvider = ({
     setData: setHistories,
     fetchData: loadHistories,
     totalData: histories
-  } = useScrollPagination(getChatHistories, {
+  } = useVirtualScrollPagination(getChatHistories, {
     overscan: 30,
     pageSize: 30,
     itemHeight: 52,
@@ -132,7 +132,6 @@ const ChatContextProvider = ({
           }
         });
       }
-
       onCloseSlider();
     },
     [chatId, onCloseSlider, router, setLastChatId]

projects/app/src/web/core/chat/inputGuide/api.ts

@@ -25,7 +25,7 @@ export const getCountChatInputGuideTotal = (data: countChatInputGuideTotalQuery)
  * Get chat input guide list
  */
 export const getChatInputGuideList = (data: ChatInputGuideProps) =>
-  GET<ChatInputGuideResponse>(`/core/chat/inputGuide/list`, data);
+  POST<ChatInputGuideResponse>(`/core/chat/inputGuide/list`, data);
 
 export const queryChatInputGuideList = (data: QueryChatInputGuideBody, url?: string) => {
   if (url) {

projects/app/src/web/core/dataset/api.ts

@@ -48,11 +48,14 @@ import type {
 import type { readCollectionSourceResponse } from '@/pages/api/core/dataset/collection/read';
 import type { GetDatasetListBody } from '@/pages/api/core/dataset/list';
 import type { UpdateDatasetCollectionParams } from '@/pages/api/core/dataset/collection/update';
-import type { GetDatasetDataListProps } from '@/pages/api/core/dataset/data/list';
+import type {
+  GetDatasetDataListProps,
+  GetDatasetDataListRes
+} from '@/pages/api/core/dataset/data/list';
 import type { UpdateDatasetDataProps } from '@fastgpt/global/core/dataset/controller';
 import type { DatasetFolderCreateBody } from '@/pages/api/core/dataset/folder/create';
-import { PaginationProps, PaginationResponse } from '@fastgpt/web/common/fetch/type';
-import { GetScrollCollectionsProps } from '@/pages/api/core/dataset/collection/scrollList';
+import type { PaginationProps, PaginationResponse } from '@fastgpt/web/common/fetch/type';
+import type { GetScrollCollectionsProps } from '@/pages/api/core/dataset/collection/scrollList';
 
 /* ======================== dataset ======================= */
 export const getDatasets = (data: GetDatasetListBody) =>
@@ -142,13 +145,13 @@ export const getDatasetCollectionTags = (
     datasetId: string;
     searchText?: string;
   }>
-) => GET<PaginationResponse<DatasetTagType>>(`/proApi/core/dataset/tag/list`, data);
+) => POST<PaginationResponse<DatasetTagType>>(`/proApi/core/dataset/tag/list`, data);
 export const getTagUsage = (datasetId: string) =>
   GET<TagUsageType[]>(`/proApi/core/dataset/tag/tagUsage?datasetId=${datasetId}`);
 export const getAllTags = (datasetId: string) =>
   GET<{ list: DatasetTagType[] }>(`/proApi/core/dataset/tag/getAllTags?datasetId=${datasetId}`);
 export const getScrollCollectionList = (data: GetScrollCollectionsProps) =>
-  GET<PaginationResponse<DatasetCollectionsListItemType>>(
+  POST<PaginationResponse<DatasetCollectionsListItemType>>(
     `/core/dataset/collection/scrollList`,
     data
   );
@@ -156,7 +159,7 @@ export const getScrollCollectionList = (data: GetScrollCollectionsProps) =>
 /* =============================== data ==================================== */
 /* get dataset list */
 export const getDatasetDataList = (data: GetDatasetDataListProps) =>
-  POST<PagingData<DatasetDataListItemType>>(`/core/dataset/data/list`, data);
+  POST<GetDatasetDataListRes>(`/core/dataset/data/list`, data);
 
 export const getDatasetDataItemById = (id: string) =>
   GET<DatasetDataItemType>(`/core/dataset/data/detail`, { id });

projects/app/src/web/core/dataset/context/datasetPageContext.tsx

@@ -142,7 +142,7 @@ export const DatasetPageContextProvider = ({
       const { list } = await getDatasetCollectionTags({
         datasetId: datasetDetail._id,
         searchText: searchTagKey,
-        current: 1,
+        offset: 0,
         pageSize: 15
       });
       return list;