From f8dbabe5058a7bb34578cce762cd91a5733c19ea Mon Sep 17 00:00:00 2001
From: Lei OT <lyt@hainatravel.com>
Date: Wed, 13 Mar 2024 21:38:46 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8E=86=E5=8F=B2=E8=AE=B0=E5=BD=95:=20?=
 =?UTF-8?q?=E4=BD=BF=E7=94=A8=E5=9C=A8=E7=BA=BF=E7=9A=84API,=20=E5=BE=80?=
 =?UTF-8?q?=E4=B8=8A=E4=B8=80=E9=A1=B5=E5=8A=A0=E8=BD=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/ChatHistory.jsx | 25 +++++++++++++++++++++++--
 1 file changed, 23 insertions(+), 2 deletions(-)

diff --git a/src/views/ChatHistory.jsx b/src/views/ChatHistory.jsx
index 2175b7a..6c48663 100644
--- a/src/views/ChatHistory.jsx
+++ b/src/views/ChatHistory.jsx
@@ -86,14 +86,25 @@ function ChatHistory() {
       await getMessages(data[0]);
     }
   };
+  const getMessagesPre = async (chatItem) => {
+    setLoading(true);
+    const data = await fetchMessages({ opisn: chatItem.opi_sn, whatsappid: chatItem.whatsapp_phone_number, lasttime: chatItem?.pretime || '' });
+    setLoading(false);
+    setChatItemMessages(prevValue => data.concat(prevValue));
+    const thisPreTime = data.length > 0 ? data[0].orgmsgtime : '';
+    const loadPrePage = !(data.length === 0 || data.length < MESSAGE_PAGE_SIZE);
+    setSelectedConversation({ ...chatItem, pretime: thisPreTime, loadPrePage });
+  };
   const getMessages = async (chatItem) => {
     setLoading(true);
     const data = await fetchMessages({ opisn: chatItem.opi_sn, whatsappid: chatItem.whatsapp_phone_number, lasttime: chatItem?.lasttime || '' });
     setLoading(false);
     setChatItemMessages(prevValue => prevValue.concat(data));
+    const thisPreTime = data.length > 0 ? data[0].orgmsgtime : '';
+    const loadPrePage = !(data.length === 0 || data.length < MESSAGE_PAGE_SIZE);
     const thisLastTime = data.length > 0 ? data[data.length - 1].orgmsgtime : '';
-    const loadNextPage = !(data.length === 0 || data.length < MESSAGE_PAGE_SIZE);
-    setSelectedConversation({ ...chatItem, lasttime: thisLastTime, loadNextPage });
+    const loadNextPage = false; // debug: !(data.length === 0 || data.length < MESSAGE_PAGE_SIZE);
+    setSelectedConversation({ ...chatItem, lasttime: thisLastTime, loadNextPage, pretime: thisPreTime, loadPrePage});
   };
 
   useEffect(() => {
@@ -166,6 +177,15 @@ function ChatHistory() {
         <Button onClick={onLoadMore}>loading more</Button>
       </div>
     ) : null;
+  const onLoadMorePre = () => {
+    getMessagesPre(selectedConversation);
+    // window.dispatchEvent(new Event('resize'));
+  };
+  const loadMorePre = !loading && selectedConversation.loadPrePage ? (
+      <div className='text-center pt-3 mb-3 h-8 leading-8 border-dotted border-0 border-t border-slate-300'>
+        <Button onClick={onLoadMorePre}>loading more</Button>
+      </div>
+    ) : null;
 
   const messagesEndRef = useRef(null);
   const messageRefs = useRef([]);
@@ -208,6 +228,7 @@ function ChatHistory() {
           <div className='h-full relative' ref={messagesEndRef}>
             <List
               loading={loading}
+              header={loadMorePre}
               loadMore={loadMore}
               className='h-full overflow-y-auto px-2 relative'
               itemLayout='vertical'