Просмотр исходного кода

Improve row expansion logic for better experience

Saoud Rizwan 1 год назад
Родитель
Сommit
6e69ea90df
1 измененных файлов с 8 добавлено и 3 удалено
  1. 8 3
      webview-ui/src/components/ChatView.tsx

+ 8 - 3
webview-ui/src/components/ChatView.tsx

@@ -382,7 +382,9 @@ const ChatView = ({ isHidden, showAnnouncement, hideAnnouncement, showHistoryVie
 	const toggleRowExpansion = useCallback(
 	const toggleRowExpansion = useCallback(
 		(ts: number) => {
 		(ts: number) => {
 			const isCollapsing = expandedRows[ts] ?? false
 			const isCollapsing = expandedRows[ts] ?? false
-			const isLastMessage = visibleMessages.at(-1)?.ts === ts
+			const isLast = visibleMessages.at(-1)?.ts === ts
+			const isSecondToLast = visibleMessages.at(-2)?.ts === ts
+			const isLastCollapsed = !expandedRows[visibleMessages.at(-1)?.ts ?? 0]
 			setExpandedRows((prev) => ({
 			setExpandedRows((prev) => ({
 				...prev,
 				...prev,
 				[ts]: !prev[ts],
 				[ts]: !prev[ts],
@@ -396,8 +398,11 @@ const ChatView = ({ isHidden, showAnnouncement, hideAnnouncement, showHistoryVie
 					})
 					})
 				}, 0)
 				}, 0)
 				return () => clearTimeout(timer)
 				return () => clearTimeout(timer)
-			} else if (isLastMessage) {
+			} else if (isLast || isSecondToLast) {
 				if (isCollapsing) {
 				if (isCollapsing) {
+					if (isSecondToLast && !isLastCollapsed) {
+						return
+					}
 					const timer = setTimeout(() => {
 					const timer = setTimeout(() => {
 						virtuosoRef.current?.scrollToIndex({
 						virtuosoRef.current?.scrollToIndex({
 							index: visibleMessages.length - 1,
 							index: visibleMessages.length - 1,
@@ -408,7 +413,7 @@ const ChatView = ({ isHidden, showAnnouncement, hideAnnouncement, showHistoryVie
 				} else {
 				} else {
 					const timer = setTimeout(() => {
 					const timer = setTimeout(() => {
 						virtuosoRef.current?.scrollToIndex({
 						virtuosoRef.current?.scrollToIndex({
-							index: visibleMessages.length - 1,
+							index: visibleMessages.length - (isLast ? 1 : 2),
 							align: "start",
 							align: "start",
 						})
 						})
 					}, 0)
 					}, 0)