feat: add keyborad shortcut settings

src/main/index.ts

@@ -3,6 +3,7 @@ import { app, BrowserWindow } from 'electron'
 import installExtension, { REDUX_DEVTOOLS } from 'electron-devtools-installer'
 
 import { registerIpc } from './ipc'
+import { registerZoomShortcut } from './shortcut'
 import { updateUserDataPath } from './utils/upgrade'
 import { createMainWindow } from './window'
 
@@ -30,6 +31,8 @@ app.whenReady().then(async () => {
 
   const mainWindow = createMainWindow()
 
+  registerZoomShortcut(mainWindow)
+
   registerIpc(mainWindow, app)
 
   if (process.env.NODE_ENV === 'development') {

src/main/shortcut.ts

@@ -0,0 +1,26 @@
+import { BrowserWindow, globalShortcut } from 'electron'
+
+export function registerZoomShortcut(mainWindow: BrowserWindow) {
+  // 注册放大快捷键 (Ctrl+Plus 或 Cmd+Plus)
+  globalShortcut.register('CommandOrControl+=', () => {
+    if (mainWindow) {
+      const currentZoom = mainWindow.webContents.getZoomFactor()
+      mainWindow.webContents.setZoomFactor(currentZoom + 0.1)
+    }
+  })
+
+  // 注册缩小快捷键 (Ctrl+Minus 或 Cmd+Minus)
+  globalShortcut.register('CommandOrControl+-', () => {
+    if (mainWindow) {
+      const currentZoom = mainWindow.webContents.getZoomFactor()
+      mainWindow.webContents.setZoomFactor(currentZoom - 0.1)
+    }
+  })
+
+  // 注册重置缩放快捷键 (Ctrl+0 或 Cmd+0)
+  globalShortcut.register('CommandOrControl+0', () => {
+    if (mainWindow) {
+      mainWindow.webContents.setZoomFactor(1)
+    }
+  })
+}

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

@@ -309,7 +309,16 @@
       "topic.position": "Topic Position",
       "topic.position.left": "Left",
       "topic.position.right": "Right",
-      "topic.show.time": "Show Topic Time"
+      "topic.show.time": "Show Topic Time",
+      "shortcuts": {
+        "title": "Keyboard Shortcuts",
+        "action": "Action",
+        "key": "Key",
+        "new_topic": "New Topic",
+        "zoom_in": "Zoom In",
+        "zoom_out": "Zoom Out",
+        "zoom_reset": "Reset Zoom"
+      }
     },
     "translate": {
       "title": "Translation",

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

@@ -308,7 +308,16 @@
       "topic.position": "话题位置",
       "topic.position.left": "左侧",
       "topic.position.right": "右侧",
-      "topic.show.time": "显示话题时间"
+      "topic.show.time": "显示话题时间",
+      "shortcuts": {
+        "title": "快捷方式",
+        "action": "操作",
+        "key": "按键",
+        "new_topic": "新建话题",
+        "zoom_in": "放大界面",
+        "zoom_out": "缩小界面",
+        "zoom_reset": "重置缩放"
+      }
     },
     "translate": {
       "title": "翻译",

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

@@ -308,7 +308,16 @@
       "topic.position": "話題位置",
       "topic.position.left": "左側",
       "topic.position.right": "右側",
-      "topic.show.time": "顯示話題時間"
+      "topic.show.time": "顯示話題時間",
+      "shortcuts": {
+        "title": "快速方式",
+        "action": "操作",
+        "key": "按鍵",
+        "new_topic": "新建話題",
+        "zoom_in": "放大界面",
+        "zoom_out": "縮小界面",
+        "zoom_reset": "重置縮放"
+      }
     },
     "translate": {
       "title": "翻譯",

src/renderer/src/pages/home/Inputbar/Inputbar.tsx

@@ -166,7 +166,7 @@ const Inputbar: FC<Props> = ({ assistant, setActiveTopic }) => {
     const textArea = textareaRef.current?.resizableTextArea?.textArea
     if (textArea) {
       textArea.style.height = 'auto'
-      textArea.style.height = textArea?.scrollHeight > 400 ? '400px' : `${textArea?.scrollHeight + 2}px`
+      textArea.style.height = textArea?.scrollHeight > 400 ? '400px' : `${textArea?.scrollHeight}px`
     }
   }
 

src/renderer/src/pages/settings/SettingsPage.tsx

@@ -1,4 +1,11 @@
-import { CloudOutlined, InfoCircleOutlined, MessageOutlined, SaveOutlined, SettingOutlined } from '@ant-design/icons'
+import {
+  CloudOutlined,
+  InfoCircleOutlined,
+  MacCommandOutlined,
+  MessageOutlined,
+  SaveOutlined,
+  SettingOutlined
+} from '@ant-design/icons'
 import { Navbar, NavbarCenter } from '@renderer/components/app/Navbar'
 import { isLocalAi } from '@renderer/config/env'
 import { FC } from 'react'
@@ -12,6 +19,7 @@ import DataSettings from './DataSettings/DataSettings'
 import GeneralSettings from './GeneralSettings'
 import ModelSettings from './ModelSettings'
 import ProvidersList from './ProviderSettings'
+import ShortcutSettings from './ShortcutSettings'
 
 const SettingsPage: FC = () => {
   const { pathname } = useLocation()
@@ -54,6 +62,12 @@ const SettingsPage: FC = () => {
               {t('settings.general')}
             </MenuItem>
           </MenuItemLink>
+          <MenuItemLink to="/settings/shortcut">
+            <MenuItem className={isRoute('/settings/shortcut')}>
+              <MacCommandOutlined />
+              {t('settings.shortcuts.title')}
+            </MenuItem>
+          </MenuItemLink>
           <MenuItemLink to="/settings/data">
             <MenuItem className={isRoute('/settings/data')}>
               <SaveOutlined />
@@ -74,6 +88,7 @@ const SettingsPage: FC = () => {
             <Route path="assistant" element={<AssistantSettings />} />
             <Route path="general/*" element={<GeneralSettings />} />
             <Route path="data/*" element={<DataSettings />} />
+            <Route path="shortcut" element={<ShortcutSettings />} />
             <Route path="about" element={<AboutSettings />} />
           </Routes>
         </SettingContent>

src/renderer/src/pages/settings/ShortcutSettings.tsx

@@ -0,0 +1,98 @@
+import { isMac } from '@renderer/config/constant'
+import { Switch, Table as AntTable, Tag } from 'antd'
+import type { ColumnsType } from 'antd/es/table'
+import { FC } from 'react'
+import { useTranslation } from 'react-i18next'
+import styled from 'styled-components'
+
+import { SettingContainer, SettingDivider, SettingTitle } from '.'
+
+interface ShortcutItem {
+  key: string
+  name: string
+  shortcut: string
+  enabled: boolean
+}
+
+const ShortcutSettings: FC = () => {
+  const { t } = useTranslation()
+
+  const commandKey = isMac ? '⌘' : 'Ctrl'
+
+  const columns: ColumnsType<ShortcutItem> = [
+    {
+      title: t('settings.shortcuts.action'),
+      dataIndex: 'name',
+      key: 'name',
+      width: '50%'
+    },
+    {
+      title: t('settings.shortcuts.key'),
+      dataIndex: 'shortcut',
+      key: 'shortcut',
+      width: '30%',
+      render: (shortcut: string) => {
+        const keys = shortcut.split(' ').map((key) => key.trim())
+        return (
+          <span>
+            {keys.map((key) => (
+              <Tag key={key} style={{ padding: '0 8px' }}>
+                <span style={{ fontFamily: 'monospace' }}>{key}</span>
+              </Tag>
+            ))}
+          </span>
+        )
+      }
+    },
+    {
+      title: '',
+      key: 'enabled',
+      width: '20%',
+      align: 'right',
+      render: () => <Switch defaultChecked disabled />
+    }
+  ]
+
+  const shortcuts: ShortcutItem[] = [
+    {
+      key: 'new_topic',
+      name: t('settings.shortcuts.new_topic'),
+      shortcut: `${commandKey} N`,
+      enabled: true
+    },
+    {
+      key: 'zoom_in',
+      name: t('settings.shortcuts.zoom_in'),
+      shortcut: `${commandKey} +`,
+      enabled: true
+    },
+    {
+      key: 'zoom_out',
+      name: t('settings.shortcuts.zoom_out'),
+      shortcut: `${commandKey} -`,
+      enabled: true
+    },
+    {
+      key: 'zoom_reset',
+      name: t('settings.shortcuts.zoom_reset'),
+      shortcut: `${commandKey} 0`,
+      enabled: true
+    }
+  ]
+
+  return (
+    <SettingContainer>
+      <SettingTitle>{t('settings.shortcuts.title')}</SettingTitle>
+      <SettingDivider style={{ marginBottom: 0 }} />
+      <Table columns={columns} dataSource={shortcuts} pagination={false} size="middle" showHeader={false} />
+    </SettingContainer>
+  )
+}
+
+const Table = styled(AntTable)`
+  .ant-table-cell {
+    padding: 8px 0;
+  }
+`
+
+export default ShortcutSettings