Skip to content

Commit e89f193

Browse files
daisuke-awajidaisuke-awaji
authored
UI refactoring (#268)
1 parent 3b5d061 commit e89f193

File tree

5 files changed

+43
-56
lines changed

5 files changed

+43
-56
lines changed

‎src/renderer/src/i18n/locales/planActMode.ts‎

Lines changed: 7 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -7,21 +7,15 @@ export const planActMode = {
77
'Plan mode - Read-only tools enabled (Ctrl+Shift+A)':
88
'Plan mode - Read-only tools enabled (Ctrl+Shift+A)',
99
'Act mode - All tools enabled (⌘+Shift+A)': 'Act mode - All tools enabled (⌘+Shift+A)',
10-
'Act mode - All tools enabled (Ctrl+Shift+A)': 'Act mode - All tools enabled (Ctrl+Shift+A)',
11-
'Switched to Plan mode': 'Switched to Plan mode',
12-
'Switched to Act mode': 'Switched to Act mode'
10+
'Act mode - All tools enabled (Ctrl+Shift+A)': 'Act mode - All tools enabled (Ctrl+Shift+A)'
1311
},
1412
ja: {
15-
'Plan mode - Read-only tools enabled': 'プランモード - 読み取り専用ツールのみ有効',
16-
'Act mode - All tools enabled': 'アクトモード - すべてのツールが有効',
17-
'Plan mode - Read-only tools enabled (⌘+Shift+A)':
18-
'プランモード - 読み取り専用ツールのみ有効 (⌘+Shift+A)',
13+
'Plan mode - Read-only tools enabled': '読み取り専用ツールのみ有効',
14+
'Act mode - All tools enabled': 'すべてのツールが有効',
15+
'Plan mode - Read-only tools enabled (⌘+Shift+A)': '読み取り専用ツールのみ有効 (⌘+Shift+A)',
1916
'Plan mode - Read-only tools enabled (Ctrl+Shift+A)':
20-
'プランモード - 読み取り専用ツールのみ有効 (Ctrl+Shift+A)',
21-
'Act mode - All tools enabled (⌘+Shift+A)': 'アクトモード - すべてのツールが有効 (⌘+Shift+A)',
22-
'Act mode - All tools enabled (Ctrl+Shift+A)':
23-
'アクトモード - すべてのツールが有効 (Ctrl+Shift+A)',
24-
'Switched to Plan mode': 'プランモードに切り替えました',
25-
'Switched to Act mode': 'アクトモードに切り替えました'
17+
'読み取り専用ツールのみ有効 (Ctrl+Shift+A)',
18+
'Act mode - All tools enabled (⌘+Shift+A)': 'すべてのツールが有効 (⌘+Shift+A)',
19+
'Act mode - All tools enabled (Ctrl+Shift+A)': 'すべてのツールが有効 (Ctrl+Shift+A)'
2620
}
2721
}

‎src/renderer/src/pages/ChatPage/components/AgentList/AgentCard.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ export const AgentCard: React.FC<AgentCardProps> = ({
4444
<div className="flex-shrink-0 mr-4">
4545
<div
4646
className={`w-10 h-10 flex items-center justify-center
47-
${!isCustomAgent ? 'bg-gray-200 dark:bg-gray-700/80' : 'bg-blue-100 dark:bg-blue-800/80'}
47+
${!isCustomAgent ? 'bg-gray-200 dark:bg-gray-700/80' : 'bg-blue-100 dark:bg-blue-800/40'}
4848
rounded-lg border border-transparent dark:border-gray-600 shadow-sm dark:shadow-inner`}
4949
>
5050
{agent.icon ? (

‎src/renderer/src/pages/ChatPage/components/AgentSelector/index.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export const AgentSelector: React.FC<AgentSelectorProps> = ({
2727
type="button"
2828
onClick={onOpenSettings}
2929
className="w-full flex items-center gap-2 px-3 py-2 text-sm
30-
text-gray-600 dark:text-gray-300 rounded-md hover:text-gray-800 dark:hover:text-gray-500
30+
text-gray-900 dark:text-gray-300 rounded-md hover:text-gray-500 dark:hover:text-gray-500
3131
transition-colors"
3232
>
3333
<span className="flex items-center gap-4">

‎src/renderer/src/pages/ChatPage/components/InputForm/PlanActToggle.tsx‎

Lines changed: 34 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React, { useMemo } from 'react'
22
import { useTranslation } from 'react-i18next'
3+
import { Tooltip } from 'flowbite-react'
34
import { useSettings } from '@renderer/contexts/SettingsContext'
45

56
type PlanActToggleProps = {
@@ -15,36 +16,43 @@ export const PlanActToggle: React.FC<PlanActToggleProps> = ({ className = '' })
1516
const { t } = useTranslation()
1617
const { planMode, setPlanMode } = useSettings()
1718

18-
// プラットフォームに応じたキー表示を決定
19-
const modifierKey = useMemo(() => {
19+
// プラットフォームに応じた翻訳キーを決定
20+
const { planModeTooltipKey, actModeTooltipKey } = useMemo(() => {
2021
const isMac = navigator.platform.toLowerCase().includes('mac')
21-
return isMac ? '⌘' : 'Ctrl'
22+
return {
23+
planModeTooltipKey: isMac
24+
? 'Plan mode - Read-only tools enabled (⌘+Shift+A)'
25+
: 'Plan mode - Read-only tools enabled (Ctrl+Shift+A)',
26+
actModeTooltipKey: isMac
27+
? 'Act mode - All tools enabled (⌘+Shift+A)'
28+
: 'Act mode - All tools enabled (Ctrl+Shift+A)'
29+
}
2230
}, [])
2331

2432
return (
25-
<div
26-
className={`flex rounded-full border dark:border-gray-700 overflow-hidden bg-gray-800 ${className}`}
27-
>
28-
<button
29-
className={`px-3 py-1 text-xs font-medium transition-colors ${
30-
planMode ? planModeStyle : unselectedStyle
31-
}`}
32-
onClick={() => setPlanMode(true)}
33-
aria-pressed={planMode}
34-
title={t(`Plan mode - Read-only tools enabled (${modifierKey}+Shift+A)`)}
35-
>
36-
Plan
37-
</button>
38-
<button
39-
className={`px-3 py-1 text-xs font-medium transition-colors ${
40-
!planMode ? actModeStyle : unselectedStyle
41-
}`}
42-
onClick={() => setPlanMode(false)}
43-
aria-pressed={!planMode}
44-
title={t(`Act mode - All tools enabled (${modifierKey}+Shift+A)`)}
45-
>
46-
Act
47-
</button>
33+
<div className={`flex rounded-full border dark:border-gray-700 overflow-hidden ${className}`}>
34+
<Tooltip content={t(planModeTooltipKey)} placement="bottom" animation="duration-500">
35+
<button
36+
className={`px-3 py-1.5 text-xs font-medium transition-colors ${
37+
planMode ? planModeStyle : unselectedStyle
38+
}`}
39+
onClick={() => setPlanMode(true)}
40+
aria-pressed={planMode}
41+
>
42+
Plan
43+
</button>
44+
</Tooltip>
45+
<Tooltip content={t(actModeTooltipKey)} placement="bottom" animation="duration-500">
46+
<button
47+
className={`px-3 py-1.5 text-xs font-medium transition-colors ${
48+
!planMode ? actModeStyle : unselectedStyle
49+
}`}
50+
onClick={() => setPlanMode(false)}
51+
aria-pressed={!planMode}
52+
>
53+
Act
54+
</button>
55+
</Tooltip>
4856
</div>
4957
)
5058
}

‎src/renderer/src/pages/ChatPage/components/InputForm/TextArea.tsx‎

Lines changed: 0 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -198,21 +198,6 @@ export const TextArea: React.FC<TextAreaProps> = ({
198198
)
199199

200200
const handleKeyDown = (e: React.KeyboardEvent) => {
201-
// Cmd+Shift+A でPlan/Actモードを切り替え（テキストエリア内でも有効にする）
202-
if ((e.metaKey || e.ctrlKey) && e.shiftKey && e.key.toLowerCase() === 'a') {
203-
e.preventDefault()
204-
setPlanMode(!planMode)
205-
206-
// モード切り替え通知
207-
const newMode = !planMode ? 'Plan' : 'Act'
208-
toast.success(t(`Switched to ${newMode} mode`), {
209-
duration: 2000,
210-
position: 'bottom-center',
211-
icon: '🔄'
212-
})
213-
return
214-
}
215-
216201
// メッセージ送信のキー入力処理
217202
if (isComposing) {
218203
return

0 commit comments

Comments
 (0)