From f73749ac630e656fc52976b1e350d4f56955437b Mon Sep 17 00:00:00 2001 From: kangfenmao Date: Tue, 29 Oct 2024 01:55:11 +0800 Subject: [PATCH] feat: add keyborad shortcut settings --- src/main/index.ts | 3 + src/main/shortcut.ts | 26 +++++ src/renderer/src/i18n/en-us.json | 11 ++- src/renderer/src/i18n/zh-cn.json | 11 ++- src/renderer/src/i18n/zh-tw.json | 11 ++- .../src/pages/home/Inputbar/Inputbar.tsx | 2 +- .../src/pages/settings/SettingsPage.tsx | 17 +++- .../src/pages/settings/ShortcutSettings.tsx | 98 +++++++++++++++++++ 8 files changed, 174 insertions(+), 5 deletions(-) create mode 100644 src/main/shortcut.ts create mode 100644 src/renderer/src/pages/settings/ShortcutSettings.tsx diff --git a/src/main/index.ts b/src/main/index.ts index b1d17b4b..868fd372 100644 --- a/src/main/index.ts +++ b/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') { diff --git a/src/main/shortcut.ts b/src/main/shortcut.ts new file mode 100644 index 00000000..117c386d --- /dev/null +++ b/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) + } + }) +} diff --git a/src/renderer/src/i18n/en-us.json b/src/renderer/src/i18n/en-us.json index d4344585..5f07b776 100644 --- a/src/renderer/src/i18n/en-us.json +++ b/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", diff --git a/src/renderer/src/i18n/zh-cn.json b/src/renderer/src/i18n/zh-cn.json index 1b4cc573..a0217ce8 100644 --- a/src/renderer/src/i18n/zh-cn.json +++ b/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": "翻译", diff --git a/src/renderer/src/i18n/zh-tw.json b/src/renderer/src/i18n/zh-tw.json index a3377989..7269cf49 100644 --- a/src/renderer/src/i18n/zh-tw.json +++ b/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": "翻譯", diff --git a/src/renderer/src/pages/home/Inputbar/Inputbar.tsx b/src/renderer/src/pages/home/Inputbar/Inputbar.tsx index 252898fe..b551c3c7 100644 --- a/src/renderer/src/pages/home/Inputbar/Inputbar.tsx +++ b/src/renderer/src/pages/home/Inputbar/Inputbar.tsx @@ -166,7 +166,7 @@ const Inputbar: FC = ({ 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` } } diff --git a/src/renderer/src/pages/settings/SettingsPage.tsx b/src/renderer/src/pages/settings/SettingsPage.tsx index dc399982..e1bd61f9 100644 --- a/src/renderer/src/pages/settings/SettingsPage.tsx +++ b/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')} + + + + {t('settings.shortcuts.title')} + + @@ -74,6 +88,7 @@ const SettingsPage: FC = () => { } /> } /> } /> + } /> } /> diff --git a/src/renderer/src/pages/settings/ShortcutSettings.tsx b/src/renderer/src/pages/settings/ShortcutSettings.tsx new file mode 100644 index 00000000..3324a2b1 --- /dev/null +++ b/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 = [ + { + 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 ( + + {keys.map((key) => ( + + {key} + + ))} + + ) + } + }, + { + title: '', + key: 'enabled', + width: '20%', + align: 'right', + render: () => + } + ] + + 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 ( + + {t('settings.shortcuts.title')} + + + + ) +} + +const Table = styled(AntTable)` + .ant-table-cell { + padding: 8px 0; + } +` + +export default ShortcutSettings