From e6bad93b320d725ab6c24437c7edd2a42838b3c4 Mon Sep 17 00:00:00 2001
From: papapatrick <109422393+Patrickill@users.noreply.github.com>
Date: Thu, 26 Sep 2024 16:26:00 +0800
Subject: [PATCH] fix: mobile history slider records disappear (#2806)

* fix: mobile history slider records disappear

* change h
---
 .../chat/components/ChatHistorySlider.tsx     | 12 ++++-----
 .../src/web/core/chat/context/chatContext.tsx | 27 +++++++------------
 2 files changed, 14 insertions(+), 25 deletions(-)

diff --git a/projects/app/src/pages/chat/components/ChatHistorySlider.tsx b/projects/app/src/pages/chat/components/ChatHistorySlider.tsx
index 6624497c0..e6427c761 100644
--- a/projects/app/src/pages/chat/components/ChatHistorySlider.tsx
+++ b/projects/app/src/pages/chat/components/ChatHistorySlider.tsx
@@ -53,14 +53,12 @@ const ChatHistorySlider = ({
     onChangeChatId,
     chatId: activeChatId,
     isLoading,
-    ScrollList,
-    historyList,
+    ScrollData,
     histories
   } = useContextSelector(ChatContext, (v) => v);
 
   const concatHistory = useMemo(() => {
-    const formatHistories: HistoryItemType[] = historyList.map((data) => {
-      const item = data.data;
+    const formatHistories: HistoryItemType[] = histories.map((item) => {
       return { id: item.chatId, title: item.title, customTitle: item.customTitle, top: item.top };
     });
     const newChat: HistoryItemType = {
@@ -70,7 +68,7 @@ const ChatHistorySlider = ({
     const activeChat = histories.find((item) => item.chatId === activeChatId);
 
     return !activeChat ? [newChat].concat(formatHistories) : formatHistories;
-  }, [activeChatId, histories, historyList, t]);
+  }, [activeChatId, histories, t]);
 
   // custom title edit
   const { onOpenModal, EditModal: EditTitleModal } = useEditTitle({
@@ -173,7 +171,7 @@ const ChatHistorySlider = ({
         )}
       </Flex>
 
-      <ScrollList flex={'1 0 0'} h={0} px={[2, 5]} overflow={'overlay'}>
+      <ScrollData flex={'1 0 0'} h={0} px={[2, 5]} overflow={'overlay'}>
         {/* chat history */}
         <>
           {concatHistory.map((item, i) => (
@@ -283,7 +281,7 @@ const ChatHistorySlider = ({
             </Flex>
           ))}
         </>
-      </ScrollList>
+      </ScrollData>
 
       {/* exec */}
       {!isPc && isUserChatPage && (
diff --git a/projects/app/src/web/core/chat/context/chatContext.tsx b/projects/app/src/web/core/chat/context/chatContext.tsx
index 873f8e718..e695239bb 100644
--- a/projects/app/src/web/core/chat/context/chatContext.tsx
+++ b/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 { useVirtualScrollPagination } from '@fastgpt/web/hooks/useScrollPagination';
+import { useScrollPagination } from '@fastgpt/web/hooks/useScrollPagination';
 
 type ChatContextValueType = {
   params: Record<string, string | number>;
@@ -30,7 +30,7 @@ type ChatContextType = {
   forbidLoadChat: React.MutableRefObject<boolean>;
   onChangeChatId: (chatId?: string, forbid?: boolean) => void;
   loadHistories: () => void;
-  ScrollList: ({
+  ScrollData: ({
     children,
     EmptyChildren,
     isLoading,
@@ -42,10 +42,6 @@ type ChatContextType = {
   } & BoxProps) => ReactNode;
   onChangeAppId: (appId: string) => void;
   isLoading: boolean;
-  historyList: {
-    index: number;
-    data: ChatHistoryItemType;
-  }[];
   histories: ChatHistoryItemType[];
   onUpdateHistoryTitle: ({ chatId, newTitle }: { chatId: string; newTitle: string }) => void;
 };
@@ -53,12 +49,11 @@ type ChatContextType = {
 export const ChatContext = createContext<ChatContextType>({
   chatId: '',
   // forbidLoadChat: undefined,
-  historyList: [],
   histories: [],
   onUpdateHistoryTitle: function (): void {
     throw new Error('Function not implemented.');
   },
-  ScrollList: function (): ReactNode {
+  ScrollData: function (): ReactNode {
     throw new Error('Function not implemented.');
   },
   loadHistories: function (): void {
@@ -105,17 +100,14 @@ const ChatContextProvider = ({
   const { isOpen: isOpenSlider, onClose: onCloseSlider, onOpen: onOpenSlider } = useDisclosure();
 
   const {
-    scrollDataList: historyList,
-    ScrollList,
+    ScrollData,
     isLoading: isPaginationLoading,
     setData: setHistories,
     fetchData: loadHistories,
-    totalData: histories
-  } = useVirtualScrollPagination(getChatHistories, {
-    overscan: 30,
-    pageSize: 30,
-    itemHeight: 52,
-    defaultParams: params,
+    data: histories
+  } = useScrollPagination(getChatHistories, {
+    pageSize: 20,
+    params,
     refreshDeps: [params]
   });
 
@@ -229,9 +221,8 @@ const ChatContextProvider = ({
     onChangeChatId,
     onChangeAppId,
     isLoading,
-    historyList,
     setHistories,
-    ScrollList,
+    ScrollData,
     loadHistories,
     histories,
     onUpdateHistoryTitle