From 98a2269b8a5b4ec32fc0c5aff4e17578fbfa1789 Mon Sep 17 00:00:00 2001
From: one <wangan.cs@gmail.com>
Date: Mon, 5 May 2025 14:57:01 +0800
Subject: [PATCH] fix: conditionally show loading more spinner (#5670)

---
 src/renderer/src/pages/home/Messages/Messages.tsx | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/renderer/src/pages/home/Messages/Messages.tsx b/src/renderer/src/pages/home/Messages/Messages.tsx
index 1186c920f2..67f08e3119 100644
--- a/src/renderer/src/pages/home/Messages/Messages.tsx
+++ b/src/renderer/src/pages/home/Messages/Messages.tsx
@@ -239,9 +239,11 @@ const Messages: React.FC<MessagesProps> = ({ assistant, topic, setActiveTopic })
           inverse
           style={{ overflow: 'visible' }}>
           <ScrollContainer>
-            <LoaderContainer $loading={isLoadingMore}>
-              <SvgSpinners180Ring color="var(--color-text-2)" />
-            </LoaderContainer>
+            {isLoadingMore && (
+              <LoaderContainer>
+                <SvgSpinners180Ring color="var(--color-text-2)" />
+              </LoaderContainer>
+            )}
             {groupedMessages.map(([key, groupMessages]) => (
               <MessageGroup
                 key={key}
@@ -296,14 +298,12 @@ const computeDisplayMessages = (messages: Message[], startIndex: number, display
   return displayMessages
 }
 
-const LoaderContainer = styled.div<{ $loading: boolean }>`
+const LoaderContainer = styled.div`
   display: flex;
   justify-content: center;
   padding: 10px;
   width: 100%;
   background: var(--color-background);
-  opacity: ${(props) => (props.$loading ? 1 : 0)};
-  transition: opacity 0.3s ease;
   pointer-events: none;
 `