feat(TopicsTab): double click topic name to edit (#9382)

* feat(TopicsTab): 添加双击话题名称开始编辑功能

* feat(话题标签): 添加通过弹窗重命名话题的功能

* refactor(TopicsTab): 移除未使用的topicEdit参数

* style(TopicsTab): 调整主题名称容器的样式和输入框边框

移除主题编辑输入框的边框和阴影效果，并设置固定高度

* feat(i18n): 添加话题重命名提示文本并支持在弹窗中显示

为话题编辑功能添加多语言提示文本，说明双击可快速重命名
在PromptPopup组件中新增extraNode属性以支持显示额外提示信息

* docs(i18n): 为话题重命名提示添加"提示"前缀

src/renderer/src/components/Popups/PromptPopup.tsx

@@ -1,6 +1,6 @@
 import { Input, Modal } from 'antd'
 import { TextAreaProps } from 'antd/es/input'
-import { useRef, useState } from 'react'
+import { ReactNode, useRef, useState } from 'react'
 
 import { Box } from '../Layout'
 import { TopView } from '../TopView'
@@ -11,6 +11,7 @@ interface PromptPopupShowParams {
   defaultValue?: string
   inputPlaceholder?: string
   inputProps?: TextAreaProps
+  extraNode?: ReactNode
 }
 
 interface Props extends PromptPopupShowParams {
@@ -23,6 +24,7 @@ const PromptPopupContainer: React.FC<Props> = ({
   defaultValue = '',
   inputPlaceholder = '',
   inputProps = {},
+  extraNode = null,
   resolve
 }) => {
   const [value, setValue] = useState(defaultValue)
@@ -88,6 +90,7 @@ const PromptPopupContainer: React.FC<Props> = ({
         rows={1}
         {...inputProps}
       />
+      {extraNode}
     </Modal>
   )
 }

src/renderer/src/i18n/locales/en-us.json

@@ -584,7 +584,8 @@
       },
       "edit": {
         "placeholder": "Enter new name",
-        "title": "Edit Name"
+        "title": "Edit Name",
+        "title_tip": "Tips: Double-click the topic name to rename it directly in place"
       },
       "export": {
         "image": "Export as image",

src/renderer/src/i18n/locales/ja-jp.json

@@ -584,7 +584,8 @@
       },
       "edit": {
         "placeholder": "新しい名前を入力",
-        "title": "名前を編集"
+        "title": "名前を編集",
+        "title_tip": "ヒント: トピック名をダブルクリックすると、直接その場で名前を変更できます"
       },
       "export": {
         "image": "画像としてエクスポート",

src/renderer/src/i18n/locales/ru-ru.json

@@ -584,7 +584,8 @@
       },
       "edit": {
         "placeholder": "Введите новый заголовок",
-        "title": "Редактировать заголовок"
+        "title": "Редактировать заголовок",
+        "title_tip": "Совет: двойной щелчок по названию темы позволяет переименовать её на месте"
       },
       "export": {
         "image": "Экспорт как изображение",

src/renderer/src/i18n/locales/zh-cn.json

@@ -584,7 +584,8 @@
       },
       "edit": {
         "placeholder": "输入新名称",
-        "title": "编辑话题名"
+        "title": "编辑话题名",
+        "title_tip": "提示: 双击话题名可以直接就地重命名"
       },
       "export": {
         "image": "导出为图片",

src/renderer/src/i18n/locales/zh-tw.json

@@ -584,7 +584,8 @@
       },
       "edit": {
         "placeholder": "輸入新名稱",
-        "title": "編輯名稱"
+        "title": "編輯名稱",
+        "title_tip": "提示：雙擊話題名可以直接就地重新命名"
       },
       "export": {
         "image": "匯出為圖片",

src/renderer/src/i18n/translate/el-gr.json

@@ -584,7 +584,8 @@
       },
       "edit": {
         "placeholder": "Εισαγάγετε το νέο όνομα",
-        "title": "Επεξεργασία ονόματος θέματος"
+        "title": "Επεξεργασία ονόματος θέματος",
+        "title_tip": "Συμβουλές: Διπλό κλικ στο όνομα του θέματος για να το μετονομάσετε απευθείας"
       },
       "export": {
         "image": "Εξαγωγή ως εικόνα",

src/renderer/src/i18n/translate/es-es.json

@@ -584,7 +584,8 @@
       },
       "edit": {
         "placeholder": "Introduce nuevo nombre",
-        "title": "Editar nombre del tema"
+        "title": "Editar nombre del tema",
+        "title_tip": "Consejos: hacer doble clic en el nombre del tema permite cambiar el nombre directamente en el lugar"
       },
       "export": {
         "image": "Exportar como imagen",

src/renderer/src/i18n/translate/fr-fr.json

@@ -584,7 +584,8 @@
       },
       "edit": {
         "placeholder": "Entrez un nouveau nom",
-        "title": "Modifier le nom du sujet"
+        "title": "Modifier le nom du sujet",
+        "title_tip": "Conseil : double-cliquez sur le nom du sujet pour le renommer directement sur place"
       },
       "export": {
         "image": "Exporter sous forme d'image",

src/renderer/src/i18n/translate/pt-pt.json

@@ -584,7 +584,8 @@
       },
       "edit": {
         "placeholder": "Digite novo nome",
-        "title": "Editar nome do tópico"
+        "title": "Editar nome do tópico",
+        "title_tip": "Dicas: Clique duas vezes no nome do tópico para renomeá-lo diretamente no local"
       },
       "export": {
         "image": "Exportar como imagem",

src/renderer/src/pages/home/Tabs/TopicsTab.tsx

@@ -222,9 +222,19 @@ const Topics: FC<Props> = ({ assistant: _assistant, activeTopic, setActiveTopic,
         key: 'rename',
         icon: <EditIcon size={14} />,
         disabled: isRenaming(topic.id),
-        onClick() {
+        async onClick() {
-          setEditingTopicId(topic.id)
+          const name = await PromptPopup.show({
-          topicEdit.startEdit(topic.name)
+            title: t('chat.topics.edit.title'),
+            message: '',
+            defaultValue: topic?.name || '',
+            extraNode: (
+              <div style={{ color: 'var(--color-text-3)', marginTop: 8 }}>{t('chat.topics.edit.title_tip')}</div>
+            )
+          })
+          if (name && topic?.name !== name) {
+            const updatedTopic = { ...topic, name, isNameManuallyEdited: true }
+            updateTopic(updatedTopic)
+          }
         }
       },
       {
@@ -448,7 +458,6 @@ const Topics: FC<Props> = ({ assistant: _assistant, activeTopic, setActiveTopic,
     assistants,
     assistant,
     updateTopic,
-    topicEdit,
     activeTopic.id,
     setActiveTopic,
     onPinTopic,
@@ -519,7 +528,13 @@ const Topics: FC<Props> = ({ assistant: _assistant, activeTopic, setActiveTopic,
                     onClick={(e) => e.stopPropagation()}
                   />
                 ) : (
-                  <TopicName className={getTopicNameClassName()} title={topicName}>
+                  <TopicName
+                    className={getTopicNameClassName()}
+                    title={topicName}
+                    onDoubleClick={() => {
+                      setEditingTopicId(topic.id)
+                      topicEdit.startEdit(topic.name)
+                    }}>
                     {topicName}
                   </TopicName>
                 )}
@@ -622,6 +637,7 @@ const TopicNameContainer = styled.div`
   flex-direction: row;
   align-items: center;
   gap: 4px;
+  height: 20px;
   justify-content: space-between;
 `
 
@@ -675,19 +691,14 @@ const TopicName = styled.div`
 
 const TopicEditInput = styled.input`
   background: var(--color-background);
-  border: 1px solid var(--color-border);
+  border: none;
-  border-radius: 4px;
   color: var(--color-text-1);
   font-size: 13px;
   font-family: inherit;
   padding: 2px 6px;
   width: 100%;
   outline: none;
-
+  padding: 0;
-  &:focus {
-    border-color: var(--color-primary);
-    box-shadow: 0 0 0 2px var(--color-primary-alpha);
-  }
 `
 
 const PendingIndicator = styled.div.attrs({