From 9f11e7c22b65bd86ff9c916bd0c419c6aa2f0a65 Mon Sep 17 00:00:00 2001
From: one <wangan.cs@gmail.com>
Date: Mon, 31 Mar 2025 03:08:30 +0800
Subject: [PATCH] perf(Tabs): improve responsiveness when switching items
 rapidly

---
 .../src/pages/home/Tabs/AssistantItem.tsx         | 15 ++++++++++-----
 src/renderer/src/pages/home/Tabs/TopicsTab.tsx    |  6 ++++--
 2 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/src/renderer/src/pages/home/Tabs/AssistantItem.tsx b/src/renderer/src/pages/home/Tabs/AssistantItem.tsx
index c85a13eb..5345bcf2 100644
--- a/src/renderer/src/pages/home/Tabs/AssistantItem.tsx
+++ b/src/renderer/src/pages/home/Tabs/AssistantItem.tsx
@@ -13,7 +13,7 @@ import { hasTopicPendingRequests } from '@renderer/utils/queue'
 import { Dropdown } from 'antd'
 import { ItemType } from 'antd/es/menu/interface'
 import { omit } from 'lodash'
-import { FC, useCallback, useEffect, useState } from 'react'
+import { FC, startTransition, useCallback, useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import styled from 'styled-components'
 
@@ -114,11 +114,16 @@ const AssistantItem: FC<AssistantItemProps> = ({ assistant, isActive, onSwitch,
   const handleSwitch = useCallback(async () => {
     await modelGenerating()
 
-    if (topicPosition === 'left' && clickAssistantToShowTopic) {
-      EventEmitter.emit(EVENT_NAMES.SWITCH_TOPIC_SIDEBAR)
+    if (clickAssistantToShowTopic) {
+      if (topicPosition === 'left') {
+        EventEmitter.emit(EVENT_NAMES.SWITCH_TOPIC_SIDEBAR)
+      }
+      onSwitch(assistant)
+    } else {
+      startTransition(() => {
+        onSwitch(assistant)
+      })
     }
-
-    onSwitch(assistant)
   }, [clickAssistantToShowTopic, onSwitch, assistant, topicPosition])
 
   const assistantName = assistant.name || t('chat.default.name')
diff --git a/src/renderer/src/pages/home/Tabs/TopicsTab.tsx b/src/renderer/src/pages/home/Tabs/TopicsTab.tsx
index b638af15..d92b0d45 100644
--- a/src/renderer/src/pages/home/Tabs/TopicsTab.tsx
+++ b/src/renderer/src/pages/home/Tabs/TopicsTab.tsx
@@ -37,7 +37,7 @@ import { hasTopicPendingRequests } from '@renderer/utils/queue'
 import { Dropdown, MenuProps, Tooltip } from 'antd'
 import dayjs from 'dayjs'
 import { findIndex } from 'lodash'
-import { FC, useCallback, useMemo, useRef, useState } from 'react'
+import { FC, startTransition, useCallback, useMemo, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import styled from 'styled-components'
 
@@ -146,7 +146,9 @@ const Topics: FC<Props> = ({ assistant: _assistant, activeTopic, setActiveTopic
   const onSwitchTopic = useCallback(
     async (topic: Topic) => {
       // await modelGenerating()
-      setActiveTopic(topic)
+      startTransition(() => {
+        setActiveTopic(topic)
+      })
     },
     [setActiveTopic]
   )