fix: glitchy UI when hover last message

web/screens/Thread/ThreadCenterPanel/ChatBody/index.tsx

@@ -202,6 +202,7 @@ const ChatBody = memo(
                       isCurrentMessage={
                         virtualRow.index === messages?.length - 1
                       }
+                      isLast={virtualRow.index === messages?.length - 1}
                       onExpand={(props) =>
                         preserveScrollOnExpand(() => {
                           setToolCallExpanded((prev) => ({

web/screens/Thread/ThreadCenterPanel/ChatItem/index.tsx

@@ -22,6 +22,7 @@ type Props = {
   loadModelError?: string
   isCurrentMessage?: boolean
   index: number
+  isLast: boolean
   onExpand: (props: { [id: number]: boolean }) => void
 } & ThreadMessage
 

web/screens/Thread/ThreadCenterPanel/TextMessage/ToolCallBlock.tsx

@@ -24,7 +24,6 @@ const ToolCallBlock = ({ id, name, result, loading, onExpand }: Props) => {
   const isExpanded = collapseState[id] ?? false
   const handleClick = () => {
     onExpand({ [id]: !isExpanded })
-    // setCollapseState((prev) => ({ ...prev, [id]: !isExpanded }))
   }
   return (
     <div className="mx-auto w-full">

web/screens/Thread/ThreadCenterPanel/TextMessage/index.tsx

@@ -33,6 +33,7 @@ const MessageContainer: React.FC<
   ThreadMessage & {
     isCurrentMessage: boolean
     index: number
+    isLast: boolean
     onExpand: (props: { [id: number]: boolean }) => void
   }
 > = (props) => {
@@ -124,10 +125,12 @@ const MessageContainer: React.FC<
         <div
           className={twMerge(
             'absolute right-0 order-1 flex cursor-pointer items-center justify-start gap-x-2 transition-all',
-            twMerge(
-              'hidden group-hover:absolute group-hover:-bottom-4 group-hover:right-4 group-hover:z-50 group-hover:flex',
-              image && 'group-hover:-top-2'
-            ),
+            !props.isLast
+              ? twMerge(
+                  'hidden group-hover:absolute group-hover:right-4 group-hover:top-4 group-hover:z-50 group-hover:flex',
+                  image && 'group-hover:-top-2'
+                )
+              : 'relative left-0 order-2 flex w-full justify-between opacity-0 group-hover:opacity-100',
 
             props.isCurrentMessage && 'opacity-100'
           )}