Skip to content

Complete Japanese localization of UI components #6

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
Copilot wants to merge 2 commits into
base: main
Choose a base branch
from
Draft

Complete Japanese localization of UI components #6

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
6e5e587
Initial plan
Copilot Sep 9, 2025
ab2d021
Complete Japanese UI translation for all components
Copilot Sep 9, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 7 additions & 7 deletions BackCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,14 +62,14 @@ export default function BackCard({ item }: BackCardProps) {
<button
onClick={() => promoteItem(item.id)}
className="text-orange-600 hover:text-orange-800 text-sm"
title="Promote to Front Burner"
title="フロントバーナーに昇格"
>
⬆️
</button>
<button
onClick={() => demoteItem(item.id)}
className="text-orange-600 hover:text-orange-800 text-sm"
title="Demote to Kitchen Sink"
title="キッチンシンクに降格"
>
⬇️
</button>
Expand All @@ -89,21 +89,21 @@ export default function BackCard({ item }: BackCardProps) {
value={editContent}
onChange={(e) => setEditContent(e.target.value)}
className="flex-1 p-2 border border-orange-300 rounded resize-none"
placeholder="What's your next priority?"
placeholder="次の優先タスクは何ですか？"
autoFocus
/>
<div className="flex gap-2 mt-2">
<button
onClick={handleSave}
className="px-3 py-1 bg-orange-600 text-white rounded text-sm hover:bg-orange-700"
>
Save
保存
</button>
<button
onClick={() => setIsEditing(false)}
className="px-3 py-1 bg-gray-300 text-gray-700 rounded text-sm hover:bg-gray-400"
>
Cancel
キャンセル
</button>
</div>
</div>
Expand All @@ -116,7 +116,7 @@ export default function BackCard({ item }: BackCardProps) {
{totalSubtasks > 0 && (
<div className="mb-3">
<div className="flex justify-between text-sm text-gray-600 mb-1">
<span>Progress</span>
<span>進捗</span>
<span>{completedSubtasks}/{totalSubtasks}</span>
</div>
<div className="w-full bg-gray-200 rounded-full h-2">
Expand Down Expand Up @@ -149,7 +149,7 @@ export default function BackCard({ item }: BackCardProps) {
type="text"
value={newSubtask}
onChange={(e) => setNewSubtask(e.target.value)}
placeholder="Add subtask..."
placeholder="サブタスクを追加..."
className="flex-1 px-2 py-1 border border-orange-300 rounded text-sm"
onKeyPress={(e) => e.key === 'Enter' && handleAddSubtask()}
/>
Expand Down
12 changes: 6 additions & 6 deletions FrontCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@ export default function FrontCard({ item }: FrontCardProps) {
<button
onClick={() => demoteItem(item.id)}
className="text-red-600 hover:text-red-800 text-sm"
title="Demote to Back Burner"
title="バックバーナーに降格"
>
⬇️
</button>
Expand All @@ -82,21 +82,21 @@ export default function FrontCard({ item }: FrontCardProps) {
value={editContent}
onChange={(e) => setEditContent(e.target.value)}
className="flex-1 p-2 border border-red-300 rounded resize-none"
placeholder="What's your top priority?"
placeholder="最重要なタスクは何ですか？"
autoFocus
/>
<div className="flex gap-2 mt-2">
<button
onClick={handleSave}
className="px-3 py-1 bg-red-600 text-white rounded text-sm hover:bg-red-700"
>
Save
保存
</button>
<button
onClick={() => setIsEditing(false)}
className="px-3 py-1 bg-gray-300 text-gray-700 rounded text-sm hover:bg-gray-400"
>
Cancel
キャンセル
</button>
</div>
</div>
Expand All @@ -109,7 +109,7 @@ export default function FrontCard({ item }: FrontCardProps) {
{totalSubtasks > 0 && (
<div className="mb-3">
<div className="flex justify-between text-sm text-gray-600 mb-1">
<span>Progress</span>
<span>進捗</span>
<span>{completedSubtasks}/{totalSubtasks}</span>
</div>
<div className="w-full bg-gray-200 rounded-full h-2">
Expand Down Expand Up @@ -142,7 +142,7 @@ export default function FrontCard({ item }: FrontCardProps) {
type="text"
value={newSubtask}
onChange={(e) => setNewSubtask(e.target.value)}
placeholder="Add subtask..."
placeholder="サブタスクを追加..."
className="flex-1 px-2 py-1 border border-red-300 rounded text-sm"
onKeyPress={(e) => e.key === 'Enter' && handleAddSubtask()}
/>
Expand Down
20 changes: 10 additions & 10 deletions RolloverDialog.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,24 +27,24 @@ export default function RolloverDialog({ isOpen, onClose }: RolloverDialogProps)
return (
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
<div className="bg-white rounded-lg p-6 max-w-md w-full mx-4">
<h2 className="text-xl font-bold mb-4">🔄 Session Rollover</h2>
<h2 className="text-xl font-bold mb-4">🔄 セッションロールオーバー</h2>

<p className="text-gray-600 mb-4">
It&apos;s time to start a new {periodType === 'day' ? 'daily' : 'weekly'} session!
新しい{periodType === 'day' ? 'デイリー' : 'ウィークリー'}セッションを開始する時間です！
</p>

{totalIncomplete > 0 && (
<div className="bg-yellow-50 border border-yellow-200 rounded p-3 mb-4">
<p className="text-yellow-800 text-sm">
You have {totalIncomplete} incomplete item(s) in your Front and Back burners.
フロントバーナーとバックバーナーに{totalIncomplete}個の未完了項目があります。
</p>
</div>
)}

<div className="space-y-4">
<div>
<label className="block text-sm font-medium text-gray-700 mb-2">
Session Type
セッションタイプ
</label>
<div className="flex gap-4">
<label className="flex items-center">
Expand All @@ -55,7 +55,7 @@ export default function RolloverDialog({ isOpen, onClose }: RolloverDialogProps)
onChange={(e) => setPeriodType(e.target.value as 'day')}
className="mr-2"
/>
Daily
デイリー
</label>
<label className="flex items-center">
<input
Expand All @@ -65,7 +65,7 @@ export default function RolloverDialog({ isOpen, onClose }: RolloverDialogProps)
onChange={(e) => setPeriodType(e.target.value as 'week')}
className="mr-2"
/>
Weekly
ウィークリー
</label>
</div>
</div>
Expand All @@ -79,11 +79,11 @@ export default function RolloverDialog({ isOpen, onClose }: RolloverDialogProps)
className="mr-2"
/>
<span className="text-sm text-gray-700">
Auto-downgrade incomplete items to Kitchen Sink
未完了の項目をキッチンシンクに自動降格
</span>
</label>
<p className="text-xs text-gray-500 mt-1">
If unchecked, incomplete items will remain in their current burners
チェックを外すと、未完了の項目は現在のバーナーに留まります
</p>
</div>
</div>
Expand All @@ -93,13 +93,13 @@ export default function RolloverDialog({ isOpen, onClose }: RolloverDialogProps)
onClick={handleStartNewSession}
className="flex-1 px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700 transition-colors"
>
Start New Session
新しいセッションを開始
</button>
<button
onClick={onClose}
className="px-4 py-2 bg-gray-300 text-gray-700 rounded hover:bg-gray-400 transition-colors"
>
Later
後で
</button>
</div>
</div>
Expand Down
32 changes: 16 additions & 16 deletions SettingsSheet.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ export default function SettingsSheet({ isOpen, onClose }: SettingsSheetProps) {
})}
className="mr-2"
/>
Daily
デイリー
</label>
<label className="flex items-center">
<input
Expand All @@ -70,7 +70,7 @@ export default function SettingsSheet({ isOpen, onClose }: SettingsSheetProps) {
})}
className="mr-2"
/>
Weekly
ウィークリー
</label>
</div>
</div>
Expand All @@ -87,11 +87,11 @@ export default function SettingsSheet({ isOpen, onClose }: SettingsSheetProps) {
className="mr-2"
/>
<span className="text-sm text-gray-700">
Auto-downgrade incomplete items during rollover
ロールオーバー時に未完了の項目を自動降格
</span>
</label>
<p className="text-xs text-gray-500 mt-1 ml-6">
When starting a new session, incomplete Front/Back items will be moved to Kitchen Sink
新しいセッションを開始する際、未完了のフロント/バック項目はキッチンシンクに移動されます
</p>
</div>

Expand All @@ -107,21 +107,21 @@ export default function SettingsSheet({ isOpen, onClose }: SettingsSheetProps) {
className="mr-2"
/>
<span className="text-sm text-gray-700">
Enable push notifications (Future feature)
プッシュ通知を有効にする（将来の機能）
</span>
</label>
<p className="text-xs text-gray-500 mt-1 ml-6">
Get reminders for session rollovers and task deadlines
セッションロールオーバーとタスク期限のリマインダーを受け取る
</p>
</div>
</div>
</div>

<div>
<h3 className="text-lg font-semibold mb-3">Session History</h3>
<h3 className="text-lg font-semibold mb-3">セッション履歴</h3>
<div className="bg-gray-50 rounded p-3">
<p className="text-sm text-gray-600 mb-2">
Total completed sessions: {history.length}
完了したセッション総数: {history.length}
</p>
{history.length > 0 ? (
<div className="space-y-1 max-h-32 overflow-y-auto">
Expand All @@ -132,29 +132,29 @@ export default function SettingsSheet({ isOpen, onClose }: SettingsSheetProps) {
))}
{history.length > 5 && (
<div className="text-xs text-gray-400">
... and {history.length - 5} more
... その他 {history.length - 5} 件
</div>
)}
</div>
) : (
<p className="text-xs text-gray-500">No completed sessions yet</p>
<p className="text-xs text-gray-500">完了したセッションはまだありません</p>
)}
</div>
</div>

<div>
<h3 className="text-lg font-semibold mb-3">Keyboard Shortcuts</h3>
<h3 className="text-lg font-semibold mb-3">キーボードショートカット</h3>
<div className="bg-gray-50 rounded p-3 space-y-1">
<div className="flex justify-between text-sm">
<span className="text-gray-600">Quick add focus:</span>
<span className="text-gray-600">クイック追加フォーカス:</span>
<code className="bg-gray-200 px-1 rounded">/</code>
</div>
<div className="flex justify-between text-sm">
<span className="text-gray-600">Focus Front Burner:</span>
<span className="text-gray-600">フロントバーナーフォーカス:</span>
<code className="bg-gray-200 px-1 rounded">f</code>
</div>
<div className="flex justify-between text-sm">
<span className="text-gray-600">Focus Back Burner:</span>
<span className="text-gray-600">バックバーナーフォーカス:</span>
<code className="bg-gray-200 px-1 rounded">b</code>
</div>
</div>
Expand All @@ -166,13 +166,13 @@ export default function SettingsSheet({ isOpen, onClose }: SettingsSheetProps) {
onClick={handleSave}
className="flex-1 px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700 transition-colors"
>
Save Changes
変更を保存
</button>
<button
onClick={handleReset}
className="px-4 py-2 bg-gray-300 text-gray-700 rounded hover:bg-gray-400 transition-colors"
>
Reset
リセット
</button>
</div>
</div>
Expand Down
16 changes: 8 additions & 8 deletions SinkList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,14 +34,14 @@ export default function SinkList({ items }: SinkListProps) {
<h3 className="text-gray-800 font-bold text-lg mb-4 flex items-center">
🗂️ キッチンシンク
<span className="ml-2 text-sm font-normal text-gray-500">
({items.length} items)
({items.length} 項目)
</span>
</h3>

<div className="space-y-2 max-h-96 overflow-y-auto">
{items.length === 0 ? (
<p className="text-gray-500 text-center py-8">
No items in the kitchen sink yet.
キッチンシンクにはまだ項目がありません。
</p>
) : (
items.map((item) => (
Expand Down Expand Up @@ -71,13 +71,13 @@ export default function SinkList({ items }: SinkListProps) {
onClick={() => handleSave(item.id)}
className="px-2 py-1 bg-blue-600 text-white rounded text-sm hover:bg-blue-700"
>
Save
保存
</button>
<button
onClick={() => setEditingId(null)}
className="px-2 py-1 bg-gray-300 text-gray-700 rounded text-sm hover:bg-gray-400"
>
Cancel
キャンセル
</button>
</div>
) : (
Expand All @@ -101,7 +101,7 @@ export default function SinkList({ items }: SinkListProps) {
</span>
{item.status === 'dropped' && (
<span className="text-xs text-gray-400 bg-gray-200 px-2 py-1 rounded">
Dropped
ドロップ済み
</span>
)}
</div>
Expand All @@ -113,21 +113,21 @@ export default function SinkList({ items }: SinkListProps) {
<button
onClick={() => handleEdit(item)}
className="text-gray-600 hover:text-gray-800 text-sm"
title="Edit"
title="編集"
>
✏️
</button>
<button
onClick={() => promoteItem(item.id)}
className="text-gray-600 hover:text-gray-800 text-sm"
title="Promote to Back Burner"
title="バックバーナーに昇格"
>
⬆️
</button>
<button
onClick={() => deleteItem('sink', item.id)}
className="text-gray-600 hover:text-gray-800 text-sm"
title="Delete"
title="削除"
>
🗑️
</button>
Expand Down
Loading