wuxu/codeg
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

支持folder主界面多语言

Browse Source
This commit is contained in:
xintaofei
2026-03-07 13:12:18 +08:00
parent 07963e9706
commit 3ddc8f165a
22 changed files with 902 additions and 167 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/conversations/conversation-detail-panel.tsx
View File

@@ -2,6 +2,7 @@
import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react"
import { Plus, RefreshCw, X } from "lucide-react"
import { useTranslations } from "next-intl"
import { toast } from "sonner"
import { useFolderContext } from "@/contexts/folder-context"
import { useTabContext } from "@/contexts/tab-context"
@@ -41,6 +42,7 @@ const ExistingConversationView = memo(function ExistingConversationView({
isActive,
reloadSignal,
}: ExistingConversationViewProps) {
const t = useTranslations("Folder.conversation")
const { refreshConversations, folder } = useFolderContext()
const contextKey = `conv-${agentType}-${conversationId}`
@@ -193,12 +195,12 @@ const ExistingConversationView = memo(function ExistingConversationView({
pendingReloadState.current = null
if (detailError) {
toast.error(`会话重新加载失败：${detailError}`)
toast.error(t("reloadFailed", { message: detailError }))
return
}
toast.success("当前会话已重新加载")
}, [detailLoading, detailError])
toast.success(t("reloaded"))
}, [detailLoading, detailError, t])
return (
<ConversationShell
@@ -237,6 +239,7 @@ const ExistingConversationView = memo(function ExistingConversationView({
})
export function ConversationDetailPanel() {
const t = useTranslations("Folder.conversation")
const { folder, newConversation } = useFolderContext()
const { tabs, activeTabId, openNewConversationTab, closeTab } =
useTabContext()
@@ -364,14 +367,14 @@ export function ConversationDetailPanel() {
onSelect={handleReloadActiveConversation}
>
<RefreshCw className="h-4 w-4" />
重新加载
{t("reload")}
</ContextMenuItem>
<ContextMenuItem
disabled={!folder?.path}
onSelect={handleNewConversation}
>
<Plus className="h-4 w-4" />
新建会话
{t("newConversation")}
</ContextMenuItem>
<ContextMenuSeparator />
<ContextMenuItem
@@ -379,7 +382,7 @@ export function ConversationDetailPanel() {
onSelect={handleCloseActiveTab}
>
<X className="h-4 w-4" />
关闭会话
{t("closeConversation")}
</ContextMenuItem>
</ContextMenuContent>
</ContextMenu>

21
src/components/conversations/search-command-dialog.tsx
View File

@@ -2,6 +2,8 @@
import { useState, useEffect, useRef, useCallback } from "react"
import { formatDistanceToNow } from "date-fns"
import { enUS, zhCN, zhTW } from "date-fns/locale"
import { useLocale, useTranslations } from "next-intl"
import { useFolderContext } from "@/contexts/folder-context"
import { useTabContext } from "@/contexts/tab-context"
import { listFolderConversations } from "@/lib/tauri"
@@ -31,6 +33,10 @@ export function SearchCommandDialog({
open,
onOpenChange,
}: SearchCommandDialogProps) {
const t = useTranslations("Folder.search")
const locale = useLocale()
const dateFnsLocale =
locale === "zh-CN" ? zhCN : locale === "zh-TW" ? zhTW : enUS
const { folderId, conversations } = useFolderContext()
const { openTab } = useTabContext()
@@ -96,12 +102,12 @@ export function SearchCommandDialog({
return (
<CommandDialog
title="Search conversations"
title={t("dialogTitle")}
open={open}
onOpenChange={onOpenChange}
>
<CommandInput
placeholder="Search conversations..."
placeholder={t("placeholder")}
value={query}
onValueChange={setQuery}
/>
@@ -116,7 +122,7 @@ export function SearchCommandDialog({
: "text-muted-foreground hover:text-foreground"
)}
>
All
{t("allAgents")}
</button>
{availableAgents.map((at) => (
<button
@@ -138,10 +144,10 @@ export function SearchCommandDialog({
<CommandList className="min-h-96">
<CommandEmpty>
{searching
? "Searching..."
? t("searching")
: !query.trim() && !agentFilter
? "键入搜索以查询会话"
: "No results found."}
? t("typeToSearch")
: t("noResults")}
</CommandEmpty>
{results.length > 0 && (
<CommandGroup>
@@ -159,7 +165,7 @@ export function SearchCommandDialog({
)}
/>
<span className="flex-1 truncate">
{conv.title || "Untitled conversation"}
{conv.title || t("untitledConversation")}
</span>
<span className="text-xs text-muted-foreground shrink-0">
{AGENT_LABELS[conv.agent_type]}
@@ -167,6 +173,7 @@ export function SearchCommandDialog({
<span className="text-xs text-muted-foreground shrink-0">
{formatDistanceToNow(new Date(conv.created_at), {
addSuffix: true,
locale: dateFnsLocale,
})}
</span>
</CommandItem>

42
src/components/conversations/sidebar-conversation-card.tsx
View File

@@ -2,9 +2,11 @@
import { memo, useState, useCallback } from "react"
import { formatDistanceToNow } from "date-fns"
import { enUS, zhCN, zhTW } from "date-fns/locale"
import { GitBranch, Pencil, Trash2, Circle, Download, Plus } from "lucide-react"
import { useLocale, useTranslations } from "next-intl"
import type { DbConversationSummary, ConversationStatus } from "@/lib/types"
import { STATUS_COLORS, STATUS_LABELS } from "@/lib/types"
import { STATUS_COLORS } from "@/lib/types"
import { cn } from "@/lib/utils"
import { AgentIcon } from "@/components/agent-icon"
import {
@@ -69,12 +71,18 @@ export const SidebarConversationCard = memo(function SidebarConversationCard({
onImport,
importing,
}: SidebarConversationCardProps) {
const t = useTranslations("Folder.conversationCard")
const tStatus = useTranslations("Folder.statusLabels")
const locale = useLocale()
const dateFnsLocale =
locale === "zh-CN" ? zhCN : locale === "zh-TW" ? zhTW : enUS
const [renameOpen, setRenameOpen] = useState(false)
const [deleteOpen, setDeleteOpen] = useState(false)
const [renameValue, setRenameValue] = useState("")
const timeAgo = formatDistanceToNow(new Date(conversation.updated_at), {
addSuffix: true,
locale: dateFnsLocale,
})
const handleClick = useCallback(() => {
@@ -123,7 +131,7 @@ export const SidebarConversationCard = memo(function SidebarConversationCard({
className="size-4 shrink-0"
/>
<span className="text-sm font-medium truncate">
{conversation.title || "Untitled conversation"}
{conversation.title || t("untitledConversation")}
</span>
</div>
<div className="flex items-center gap-3 mt-1 text-xs text-muted-foreground">
@@ -142,20 +150,20 @@ export const SidebarConversationCard = memo(function SidebarConversationCard({
<>
<ContextMenuItem onSelect={onNewConversation}>
<Plus className="h-4 w-4" />
New Conversation
{t("newConversation")}
</ContextMenuItem>
<ContextMenuSeparator />
</>
)}
<ContextMenuItem onSelect={handleRenameOpen}>
<Pencil className="h-4 w-4" />
Rename
{t("rename")}
</ContextMenuItem>
<ContextMenuSeparator />
<ContextMenuSub>
<ContextMenuSubTrigger>
<Circle className="h-4 w-4" />
Status
{t("status")}
</ContextMenuSubTrigger>
<ContextMenuSubContent>
{ALL_STATUSES.filter((s) => s !== conversation.status).map(
@@ -170,7 +178,7 @@ export const SidebarConversationCard = memo(function SidebarConversationCard({
STATUS_COLORS[s]
)}
/>
{STATUS_LABELS[s]}
{tStatus(s)}
</ContextMenuItem>
)
)}
@@ -182,14 +190,14 @@ export const SidebarConversationCard = memo(function SidebarConversationCard({
onSelect={() => setDeleteOpen(true)}
>
<Trash2 className="h-4 w-4" />
Delete
{t("delete")}
</ContextMenuItem>
{onImport && (
<>
<ContextMenuSeparator />
<ContextMenuItem disabled={importing} onSelect={onImport}>
<Download className="h-4 w-4" />
{importing ? "Importing..." : "Import local sessions"}
{importing ? t("importing") : t("importLocalSessions")}
</ContextMenuItem>
</>
)}
@@ -199,7 +207,7 @@ export const SidebarConversationCard = memo(function SidebarConversationCard({
<Dialog open={renameOpen} onOpenChange={setRenameOpen}>
<DialogContent>
<DialogHeader>
<DialogTitle>Rename conversation</DialogTitle>
<DialogTitle>{t("renameConversation")}</DialogTitle>
</DialogHeader>
<Input
value={renameValue}
@@ -212,9 +220,9 @@ export const SidebarConversationCard = memo(function SidebarConversationCard({
/>
<DialogFooter>
<Button variant="outline" onClick={() => setRenameOpen(false)}>
Cancel
{t("cancel")}
</Button>
<Button onClick={handleRenameConfirm}>Save</Button>
<Button onClick={handleRenameConfirm}>{t("save")}</Button>
</DialogFooter>
</DialogContent>
</Dialog>
@@ -222,17 +230,17 @@ export const SidebarConversationCard = memo(function SidebarConversationCard({
<AlertDialog open={deleteOpen} onOpenChange={setDeleteOpen}>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Delete conversation?</AlertDialogTitle>
<AlertDialogTitle>{t("deleteConversationTitle")}</AlertDialogTitle>
<AlertDialogDescription>
This will delete &ldquo;
{conversation.title || "Untitled conversation"}&rdquo;. This
action cannot be undone.
{t("deleteConversationDescription", {
title: conversation.title || t("untitledConversation"),
})}
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogCancel>{t("cancel")}</AlertDialogCancel>
<AlertDialogAction onClick={handleDeleteConfirm}>
Delete
{t("delete")}
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>

55
src/components/conversations/sidebar-conversation-list.tsx
View File

@@ -8,6 +8,7 @@ import {
useState,
type Ref,
} from "react"
import { useTranslations } from "next-intl"
import { toast } from "sonner"
import { CheckCheck, ChevronRight, Download, Loader2, Plus } from "lucide-react"
import { useFolderContext } from "@/contexts/folder-context"
@@ -20,7 +21,7 @@ import {
deleteConversation,
} from "@/lib/tauri"
import type { ConversationStatus, DbConversationSummary } from "@/lib/types"
import { STATUS_ORDER, STATUS_LABELS, STATUS_COLORS } from "@/lib/types"
import { STATUS_ORDER, STATUS_COLORS } from "@/lib/types"
import { SidebarConversationCard } from "./sidebar-conversation-card"
import { Button } from "@/components/ui/button"
import { Skeleton } from "@/components/ui/skeleton"
@@ -79,6 +80,9 @@ export function SidebarConversationList({
}: {
ref?: Ref<SidebarConversationListHandle>
}) {
const t = useTranslations("Folder.sidebar")
const tStatus = useTranslations("Folder.statusLabels")
const tCommon = useTranslations("Folder.common")
const {
folder,
conversations,
@@ -225,7 +229,7 @@ export function SidebarConversationList({
if (importing) return
setImporting(true)
const taskId = `import-${folderId}-${Date.now()}`
addTask(taskId, "Importing local sessions")
addTask(taskId, t("importLocalSessions"))
updateTask(taskId, { status: "running" })
try {
const result = await importLocalConversations(folderId)
@@ -233,19 +237,22 @@ export function SidebarConversationList({
refreshConversations()
if (result.imported > 0) {
toast.success(
`Imported ${result.imported} session(s), skipped ${result.skipped}`
t("toasts.importedSessions", {
imported: result.imported,
skipped: result.skipped,
})
)
} else {
toast.info(`No new sessions found (skipped ${result.skipped})`)
toast.info(t("toasts.noNewSessionsFound", { skipped: result.skipped }))
}
} catch (e) {
const msg = e instanceof Error ? e.message : String(e)
updateTask(taskId, { status: "failed", error: msg })
toast.error(`Import failed: ${msg}`)
toast.error(t("toasts.importFailed", { message: msg }))
} finally {
setImporting(false)
}
}, [importing, folderId, addTask, updateTask, refreshConversations])
}, [importing, folderId, addTask, updateTask, refreshConversations, t])
const handleCompleteAllReview = useCallback(async () => {
if (completingReview || reviewConversationCount === 0) return
@@ -258,12 +265,12 @@ export function SidebarConversationList({
)
refreshConversations()
toast.success(
`Marked ${reviewConversationCount} review session(s) as completed`
t("toasts.reviewCompleted", { count: reviewConversationCount })
)
setCompleteReviewOpen(false)
} catch (e) {
const msg = e instanceof Error ? e.message : String(e)
toast.error(`Failed to complete review sessions: ${msg}`)
toast.error(t("toasts.completeReviewFailed", { message: msg }))
} finally {
setCompletingReview(false)
}
@@ -272,6 +279,7 @@ export function SidebarConversationList({
reviewConversationCount,
reviewConversations,
refreshConversations,
t,
])
return (
@@ -290,14 +298,16 @@ export function SidebarConversationList({
</div>
) : error ? (
<div className="flex-1 flex items-center justify-center px-3">
<p className="text-destructive text-xs">Error: {error}</p>
<p className="text-destructive text-xs">
{t("error", { message: error })}
</p>
</div>
) : conversations.length === 0 ? (
<ContextMenu>
<ContextMenuTrigger asChild>
<div className="flex-1 flex flex-col items-center justify-center px-3 gap-3">
<p className="text-muted-foreground text-xs text-center">
No conversations found.
{t("noConversationsFound")}
</p>
<Button
variant="outline"
@@ -310,19 +320,19 @@ export function SidebarConversationList({
) : (
<Download className="h-3.5 w-3.5 mr-1.5" />
)}
{importing ? "Importing..." : "Import local sessions"}
{importing ? t("importing") : t("importLocalSessions")}
</Button>
</div>
</ContextMenuTrigger>
<ContextMenuContent>
<ContextMenuItem onSelect={handleNewConversation}>
<Plus className="h-4 w-4" />
New Conversation
{t("newConversation")}
</ContextMenuItem>
<ContextMenuSeparator />
<ContextMenuItem disabled={importing} onSelect={handleImport}>
<Download className="h-4 w-4" />
{importing ? "Importing..." : "Import local sessions"}
{importing ? t("importing") : t("importLocalSessions")}
</ContextMenuItem>
</ContextMenuContent>
</ContextMenu>
@@ -356,7 +366,7 @@ export function SidebarConversationList({
STATUS_COLORS[status]
)}
/>
<span>{STATUS_LABELS[status]}</span>
<span>{tStatus(status)}</span>
<span className="ml-auto text-muted-foreground/60 tabular-nums">
{items.length}
</span>
@@ -381,7 +391,7 @@ export function SidebarConversationList({
onSelect={() => setCompleteReviewOpen(true)}
>
<CheckCheck className="h-4 w-4" />
Complete all sessions
{t("completeAllSessions")}
</ContextMenuItem>
</ContextMenuContent>
</ContextMenu>
@@ -421,12 +431,12 @@ export function SidebarConversationList({
<ContextMenuContent>
<ContextMenuItem onSelect={handleNewConversation}>
<Plus className="h-4 w-4" />
New Conversation
{t("newConversation")}
</ContextMenuItem>
<ContextMenuSeparator />
<ContextMenuItem disabled={importing} onSelect={handleImport}>
<Download className="h-4 w-4" />
{importing ? "Importing..." : "Import local sessions"}
{importing ? t("importing") : t("importLocalSessions")}
</ContextMenuItem>
</ContextMenuContent>
</ContextMenu>
@@ -439,21 +449,22 @@ export function SidebarConversationList({
>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Complete all review sessions?</AlertDialogTitle>
<AlertDialogTitle>{t("completeAllReviewTitle")}</AlertDialogTitle>
<AlertDialogDescription>
This will mark all {reviewConversationCount} session(s) in Review
as completed.
{t("completeAllReviewDescription", {
count: reviewConversationCount,
})}
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel disabled={completingReview}>
Cancel
{tCommon("cancel")}
</AlertDialogCancel>
<AlertDialogAction
disabled={completingReview || reviewConversationCount === 0}
onClick={handleCompleteAllReview}
>
{completingReview ? "Completing..." : "Confirm"}
{completingReview ? t("completing") : tCommon("confirm")}
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>

58
src/components/files/file-workspace-panel.tsx
View File

@@ -4,6 +4,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react"
import dynamic from "next/dynamic"
import { ChevronDown, ChevronRight, FileCode2, FileIcon } from "lucide-react"
import type { editor as MonacoEditorNs } from "monaco-editor"
import { useTranslations } from "next-intl"
import { useWorkspaceContext } from "@/contexts/workspace-context"
import { DiffViewer } from "@/components/diff/diff-viewer"
import { UnifiedDiffPreview } from "@/components/diff/unified-diff-preview"
@@ -490,6 +491,7 @@ function DiffFileList({
onOpenDiff: (path: string) => Promise<void>
openFilePreview: (path: string) => Promise<void>
}) {
const t = useTranslations("Folder.fileWorkspacePanel")
return (
<div className="h-full flex flex-col min-h-0">
<div className="border-b border-border bg-muted/25 px-3 py-2 space-y-1">
@@ -499,10 +501,7 @@ function DiffFileList({
{badge}
</span>
)}
<span>
{diffOutline.files.length}{" "}
{diffOutline.files.length === 1 ? "file" : "files"}
</span>
<span>{t("fileCount", { count: diffOutline.files.length })}</span>
<span className="font-mono text-green-600 dark:text-green-400">
+{diffOutline.totalAdditions}
</span>
@@ -553,14 +552,14 @@ function DiffFileList({
void onOpenDiff(file.path)
}}
>
查看差异
{t("viewDiff")}
</ContextMenuItem>
<ContextMenuItem
onSelect={() => {
void openFilePreview(file.path)
}}
>
打开文件
{t("openFile")}
</ContextMenuItem>
</ContextMenuContent>
</ContextMenu>
@@ -572,6 +571,7 @@ function DiffFileList({
}
export function FileWorkspacePanel() {
const t = useTranslations("Folder.fileWorkspacePanel")
const {
activeFileTab,
openBranchDiff,
@@ -999,9 +999,7 @@ export function FileWorkspacePanel() {
return (
<div className="h-full flex flex-col items-center justify-center text-center px-6">
<FileCode2 className="h-8 w-8 text-muted-foreground/60 mb-3" />
<p className="text-sm text-muted-foreground">
Open a file or diff from the right panel
</p>
<p className="text-sm text-muted-foreground">{t("openFileOrDiff")}</p>
</div>
)
}
@@ -1017,19 +1015,19 @@ export function FileWorkspacePanel() {
const origLabel = isCommitDiff
? `${commitHash}~1`
: isExternalConflictDiff
? "Disk"
: "HEAD"
? t("disk")
: t("head")
const modLabel = isCommitDiff
? commitHash
: isExternalConflictDiff
? "Unsaved"
: "Working Tree"
? t("unsaved")
: t("workingTree")
return (
<div className="h-full relative">
{activeFileTab.loading && (
<div className="absolute top-2 right-3 z-10 rounded-md bg-background/70 px-2 py-1 text-[11px] text-muted-foreground backdrop-blur-sm">
Loading...
{t("loading")}
</div>
)}
{!activeFileTab.loading && (
@@ -1055,7 +1053,7 @@ export function FileWorkspacePanel() {
<div className="h-full relative">
{activeFileTab.loading && (
<div className="absolute top-2 right-3 z-10 rounded-md bg-background/70 px-2 py-1 text-[11px] text-muted-foreground backdrop-blur-sm">
Loading...
{t("loading")}
</div>
)}
<UnifiedDiffPreview
@@ -1074,13 +1072,16 @@ export function FileWorkspacePanel() {
? diffListContext.commitHash.slice(0, 7)
: diffListContext.kind === "branch"
? diffListContext.branch
: "Working Tree"
: t("workingTree")
const description =
diffListContext.kind === "commit"
? diffListContext.commitMessage
: diffListContext.kind === "branch"
? `${diffListContext.path} · compare with ${diffListContext.branch}`
? t("compareWithBranch", {
path: diffListContext.path,
branch: diffListContext.branch,
})
: diffListContext.path
const handleOpenDiff = async (path: string) => {
@@ -1101,7 +1102,7 @@ export function FileWorkspacePanel() {
<div className="h-full relative">
{activeFileTab.loading && (
<div className="absolute top-2 right-3 z-10 rounded-md bg-background/70 px-2 py-1 text-[11px] text-muted-foreground backdrop-blur-sm">
Loading...
{t("loading")}
</div>
)}
{!activeFileTab.loading && (
@@ -1121,17 +1122,14 @@ export function FileWorkspacePanel() {
<div className="h-full relative">
{activeFileTab.loading && (
<div className="absolute top-2 right-3 z-10 rounded-md bg-background/70 px-2 py-1 text-[11px] text-muted-foreground backdrop-blur-sm">
Loading...
{t("loading")}
</div>
)}
<div className="h-full flex flex-col min-h-0">
{diffOutline && (
<div className="border-b border-border bg-muted/25">
<div className="px-3 py-1.5 text-[11px] text-muted-foreground flex items-center gap-3">
<span>
{diffOutline.files.length}{" "}
{diffOutline.files.length === 1 ? "file" : "files"}
</span>
<span>{t("fileCount", { count: diffOutline.files.length })}</span>
<span className="font-mono text-green-600 dark:text-green-400">
+{diffOutline.totalAdditions}
</span>
@@ -1139,7 +1137,7 @@ export function FileWorkspacePanel() {
-{diffOutline.totalDeletions}
</span>
{diffOutline.totalHunks > 0 && (
<span>{diffOutline.totalHunks} hunks</span>
<span>{t("hunkCount", { count: diffOutline.totalHunks })}</span>
)}
{allHunks.length > 0 && (
<div className="ml-auto flex items-center gap-1">
@@ -1150,7 +1148,7 @@ export function FileWorkspacePanel() {
className="rounded border border-border bg-background px-2 py-0.5 text-[10px] disabled:opacity-40 hover:bg-muted transition-colors inline-flex items-center gap-1"
>
<ChevronRight className="h-3 w-3 rotate-180" />
Prev
{t("prev")}
</button>
<button
type="button"
@@ -1161,7 +1159,7 @@ export function FileWorkspacePanel() {
}
className="rounded border border-border bg-background px-2 py-0.5 text-[10px] disabled:opacity-40 hover:bg-muted transition-colors inline-flex items-center gap-1"
>
Next
{t("next")}
<ChevronRight className="h-3 w-3" />
</button>
</div>
@@ -1245,7 +1243,9 @@ export function FileWorkspacePanel() {
type="button"
onClick={() => jumpToLine(hunk.startLine)}
className="shrink-0 rounded border border-border bg-background px-1.5 py-0.5 hover:bg-muted transition-colors"
title={`Jump to line ${hunk.startLine}`}
title={t("jumpToLine", {
line: hunk.startLine,
})}
>
L{hunk.startLine}
</button>
@@ -1259,7 +1259,7 @@ export function FileWorkspacePanel() {
})}
{diffOutline.files.length === 0 && (
<div className="text-[11px] text-muted-foreground px-1 py-0.5">
No parsed diff sections
{t("noParsedDiffSections")}
</div>
)}
</div>
@@ -1279,7 +1279,7 @@ export function FileWorkspacePanel() {
theme={editorTheme}
loading={
<div className="h-full flex items-center justify-center text-xs text-muted-foreground">
Loading editor...
{t("loadingEditor")}
</div>
}
options={{

12
src/components/files/file-workspace-tab-bar.tsx
View File

@@ -3,6 +3,7 @@
import { useCallback, useEffect, useRef, useState } from "react"
import { Reorder } from "motion/react"
import { FileText, GitCompare, X } from "lucide-react"
import { useTranslations } from "next-intl"
import { useWorkspaceContext } from "@/contexts/workspace-context"
import { useShortcutSettings } from "@/hooks/use-shortcut-settings"
import { matchShortcutEvent } from "@/lib/keyboard-shortcuts"
@@ -16,6 +17,7 @@ import {
} from "@/components/ui/context-menu"
export function FileWorkspaceTabBar() {
const t = useTranslations("Folder.fileWorkspace")
const {
mode,
activePane,
@@ -80,7 +82,7 @@ export function FileWorkspaceTabBar() {
if (fileTabs.length === 0) {
return (
<div className="h-10 px-3 flex items-center border-b border-border text-xs text-muted-foreground">
Files
{t("files")}
</div>
)
}
@@ -159,7 +161,7 @@ export function FileWorkspaceTabBar() {
event.stopPropagation()
closeFileTab(tab.id)
}}
aria-label="Close file tab"
aria-label={t("closeFileTab")}
>
<X className="h-3 w-3" />
</button>
@@ -167,14 +169,14 @@ export function FileWorkspaceTabBar() {
</ContextMenuTrigger>
<ContextMenuContent>
<ContextMenuItem onSelect={() => closeFileTab(tab.id)}>
关闭
{t("close")}
</ContextMenuItem>
<ContextMenuItem onSelect={() => closeOtherFileTabs(tab.id)}>
关闭其它
{t("closeOthers")}
</ContextMenuItem>
<ContextMenuSeparator />
<ContextMenuItem onSelect={closeAllFileTabs}>
关闭所有
{t("closeAll")}
</ContextMenuItem>
</ContextMenuContent>
</ContextMenu>

37
src/components/layout/aux-panel-session-files-tab.tsx
View File

@@ -2,6 +2,7 @@
import { useEffect, useMemo, useRef, useState } from "react"
import { ChevronRight, FileIcon } from "lucide-react"
import { useTranslations } from "next-intl"
import { useFolderContext } from "@/contexts/folder-context"
import { useTabContext } from "@/contexts/tab-context"
import type { LiveMessage } from "@/contexts/acp-connections-context"
@@ -77,8 +78,15 @@ function mergeLiveTurns(params: {
liveMessage: LiveMessage | null
connStatus: ConnectionStatus | null
pendingPromptText: string | null
fallbackPromptText: string
}): MessageTurn[] {
const { turns, liveMessage, connStatus, pendingPromptText } = params
const {
turns,
liveMessage,
connStatus,
pendingPromptText,
fallbackPromptText,
} = params
if (!liveMessage || connStatus !== "prompting") return turns
const liveBlocks = liveMessage.content.flatMap((block) => {
@@ -118,7 +126,7 @@ function mergeLiveTurns(params: {
id: `live-user-${liveMessage.id}`,
role: "user",
blocks: [
{ type: "text", text: pendingPromptText?.trim() || "Current response" },
{ type: "text", text: pendingPromptText?.trim() || fallbackPromptText },
],
timestamp: now,
})
@@ -145,6 +153,7 @@ function SessionFilesContent({
connStatus: ConnectionStatus | null
pendingPromptText: string | null
}) {
const t = useTranslations("Folder.sessionFiles")
const { detail, loading, refetch } = useDbMessageDetail(conversationId)
const { openSessionFileDiff } = useWorkspaceContext()
const { folder } = useFolderContext()
@@ -166,8 +175,9 @@ function SessionFilesContent({
liveMessage,
connStatus,
pendingPromptText,
fallbackPromptText: t("currentResponse"),
}),
[detail?.turns, liveMessage, connStatus, pendingPromptText]
[detail?.turns, liveMessage, connStatus, pendingPromptText, t]
)
const groups = useMemo(
() => (turns.length > 0 ? extractSessionFilesGrouped(turns) : []),
@@ -182,7 +192,7 @@ function SessionFilesContent({
) => {
openSessionFileDiff(
filePath,
diffContent ?? `No diff data available for ${filePath}`,
diffContent ?? t("noDiffDataAvailable", { filePath }),
`msg-${groupIndex + 1}-chg-${changeIndex + 1}`
)
}
@@ -190,7 +200,9 @@ function SessionFilesContent({
if (loading) {
return (
<div className="flex items-center justify-center h-full p-4">
<p className="text-xs text-muted-foreground text-center">Loading...</p>
<p className="text-xs text-muted-foreground text-center">
{t("loading")}
</p>
</div>
)
}
@@ -199,7 +211,7 @@ function SessionFilesContent({
return (
<div className="flex items-center justify-center h-full p-4">
<p className="text-xs text-muted-foreground text-center">
No file changes found in this conversation
{t("noFileChangesInConversation")}
</p>
</div>
)
@@ -258,12 +270,10 @@ function SessionFilesContent({
</p>
<div className="mt-2 flex flex-wrap items-center gap-1.5">
<span className="rounded-md border border-border bg-muted/40 px-1.5 py-0.5 text-[10px] text-muted-foreground">
{group.files.length}{" "}
{group.files.length === 1 ? "change" : "changes"}
{t("changeCount", { count: group.files.length })}
</span>
<span className="rounded-md border border-border bg-muted/40 px-1.5 py-0.5 text-[10px] text-muted-foreground">
{uniqueFileCount}{" "}
{uniqueFileCount === 1 ? "File" : "Files"}
{t("fileCount", { count: uniqueFileCount })}
</span>
<span className="inline-flex items-center gap-1 rounded-md border border-border bg-muted/40 px-1.5 py-0.5 font-mono text-[10px] text-foreground">
<CommitFileAdditions
@@ -338,7 +348,7 @@ function SessionFilesContent({
</p>
{isRemoved ? (
<span className="inline-flex shrink-0 items-center rounded-md border border-destructive/30 bg-destructive/10 px-1.5 py-0.5 font-mono text-[10px] text-destructive">
Remove
{t("remove")}
</span>
) : (
<span className="inline-flex shrink-0 items-center gap-1 rounded-md border border-border bg-muted/40 px-1.5 py-0.5 font-mono text-[10px] text-foreground">
@@ -366,6 +376,7 @@ function SessionFilesContent({
}
export function SessionFilesTab() {
const t = useTranslations("Folder.sessionFiles")
const { tabs, activeTabId } = useTabContext()
const activeTab = tabs.find((t) => t.id === activeTabId)
@@ -378,7 +389,7 @@ export function SessionFilesTab() {
return (
<div className="flex items-center justify-center h-full p-4">
<p className="text-xs text-muted-foreground text-center">
Open a conversation to see its file changes
{t("openConversationToSeeChanges")}
</p>
</div>
)
@@ -388,7 +399,7 @@ export function SessionFilesTab() {
return (
<div className="flex items-center justify-center h-full p-4">
<p className="text-xs text-muted-foreground text-center">
No file changes found in this conversation
{t("noFileChangesInConversation")}
</p>
</div>
)

26
src/components/layout/aux-panel.tsx
View File

@@ -2,6 +2,7 @@
import { useCallback, useState } from "react"
import { FileDiff, Folder, FolderPen, GitCommit } from "lucide-react"
import { useTranslations } from "next-intl"
import {
useAuxPanelContext,
type AuxPanelTab,
@@ -13,6 +14,7 @@ import { GitLogTab } from "./aux-panel-git-log-tab"
import { SessionFilesTab } from "./aux-panel-session-files-tab"
export function AuxPanel() {
const t = useTranslations("Folder.auxPanel.tabs")
const { isOpen, activeTab, setActiveTab } = useAuxPanelContext()
const [hasMountedFileTree, setHasMountedFileTree] = useState(
activeTab === "file_tree"
@@ -54,16 +56,32 @@ export function AuxPanel() {
variant="line"
className="h-10 w-full shrink-0 justify-start border-b border-border px-3 group-data-horizontal/tabs:h-10"
>
<TabsTrigger value="session_files" title="Diff" aria-label="Diff">
<TabsTrigger
value="session_files"
title={t("diff")}
aria-label={t("diff")}
>
<FileDiff className="h-3.5 w-3.5" />
</TabsTrigger>
<TabsTrigger value="file_tree" title="Files" aria-label="Files">
<TabsTrigger
value="file_tree"
title={t("files")}
aria-label={t("files")}
>
<Folder className="h-3.5 w-3.5" />
</TabsTrigger>
<TabsTrigger value="changes" title="Changes" aria-label="Changes">
<TabsTrigger
value="changes"
title={t("changes")}
aria-label={t("changes")}
>
<FolderPen className="h-3.5 w-3.5" />
</TabsTrigger>
<TabsTrigger value="git_log" title="Commits" aria-label="Commits">
<TabsTrigger
value="git_log"
title={t("commits")}
aria-label={t("commits")}
>
<GitCommit className="h-3.5 w-3.5" />
</TabsTrigger>
</TabsList>

12
src/components/layout/folder-name-dropdown.tsx
View File

@@ -3,6 +3,7 @@
import { useState } from "react"
import { ChevronDown, Folder, FolderOpen, GitBranch } from "lucide-react"
import { open } from "@tauri-apps/plugin-dialog"
import { useTranslations } from "next-intl"
import {
DropdownMenu,
DropdownMenuContent,
@@ -22,13 +23,14 @@ import { CloneDialog } from "@/components/welcome/clone-dialog"
import type { FolderHistoryEntry } from "@/lib/types"
export function FolderNameDropdown() {
const t = useTranslations("Folder.folderNameDropdown")
const { folder } = useFolderContext()
const [openFolders, setOpenFolders] = useState<FolderHistoryEntry[]>([])
const [history, setHistory] = useState<FolderHistoryEntry[]>([])
const [cloneOpen, setCloneOpen] = useState(false)
const folderPath = folder?.path ?? ""
const folderName = folder?.name ?? "文件夹"
const folderName = folder?.name ?? t("fallbackFolderName")
async function handleOpenChange(open: boolean) {
if (open) {
@@ -77,16 +79,16 @@ export function FolderNameDropdown() {
<DropdownMenuContent className="min-w-64" align="start">
<DropdownMenuItem onSelect={handleOpenFolder}>
<FolderOpen className="h-3.5 w-3.5 shrink-0" />
Open Folder
{t("openFolder")}
</DropdownMenuItem>
<DropdownMenuItem onSelect={() => setCloneOpen(true)}>
<GitBranch className="h-3.5 w-3.5 shrink-0" />
Clone Repository
{t("cloneRepository")}
</DropdownMenuItem>
{openFolders.length > 0 && (
<>
<DropdownMenuSeparator />
<DropdownMenuLabel>已打开</DropdownMenuLabel>
<DropdownMenuLabel>{t("opened")}</DropdownMenuLabel>
{openFolders.map((entry) => (
<DropdownMenuItem
key={entry.path}
@@ -114,7 +116,7 @@ export function FolderNameDropdown() {
{history.length > 0 && (
<>
<DropdownMenuSeparator />
<DropdownMenuLabel>最近打开</DropdownMenuLabel>
<DropdownMenuLabel>{t("recentOpen")}</DropdownMenuLabel>
{history.map((entry) => (
<DropdownMenuItem
key={entry.path}

50
src/components/layout/folder-title-bar.tsx
View File

@@ -18,6 +18,7 @@ import {
Search,
Settings,
} from "lucide-react"
import { useTranslations } from "next-intl"
import { getGitBranch, openFolderWindow, openSettingsWindow } from "@/lib/tauri"
import { useFolderContext } from "@/contexts/folder-context"
import { Button } from "@/components/ui/button"
@@ -41,22 +42,24 @@ import { SearchCommandDialog } from "@/components/conversations/search-command-d
const MODE_TABS = [
{
mode: "conversation",
title: "会话模式",
titleKey: "conversation",
icon: MessageSquare,
},
{
mode: "fusion",
title: "融合模式",
titleKey: "fusion",
icon: Columns2,
},
{
mode: "files",
title: "文件模式",
titleKey: "files",
icon: FileCode2,
},
] as const
export function FolderTitleBar() {
const tModes = useTranslations("Folder.modes")
const tTitleBar = useTranslations("Folder.folderTitleBar")
const { folder } = useFolderContext()
const { isOpen, toggle } = useSidebarContext()
const { isOpen: auxPanelOpen, toggle: toggleAuxPanel } = useAuxPanelContext()
@@ -212,7 +215,7 @@ export function FolderTitleBar() {
center={
<div
role="tablist"
aria-label="工作区模式"
aria-label={tModes("workspaceModesAria")}
className="relative flex h-[27px] items-center rounded-full border border-border/80 bg-background/80 p-0.5"
>
<div
@@ -222,6 +225,7 @@ export function FolderTitleBar() {
{MODE_TABS.map((item) => {
const Icon = item.icon
const isActive = mode === item.mode
const title = tModes(item.titleKey)
return (
<div
key={item.mode}
@@ -235,8 +239,8 @@ export function FolderTitleBar() {
onClick={() => setMode(item.mode)}
onKeyDown={(event) => handleModeKeyDown(event, item.mode)}
onMouseDown={(event) => event.preventDefault()}
title={item.title}
aria-label={item.title}
title={title}
aria-label={title}
aria-selected={isActive}
>
<Icon
@@ -259,7 +263,13 @@ export function FolderTitleBar() {
size="icon"
className="h-6 w-6 hover:text-foreground/80"
onClick={toggle}
title={`${isOpen ? "Hide Sidebar" : "Show Sidebar"} (${formatShortcutLabel(shortcuts.toggle_sidebar, isMac)})`}
title={tTitleBar("withShortcut", {
label: tTitleBar(isOpen ? "hideSidebar" : "showSidebar"),
shortcut: formatShortcutLabel(
shortcuts.toggle_sidebar,
isMac
),
})}
>
<PanelLeft className="h-3.5 w-3.5" />
</Button>
@@ -268,7 +278,13 @@ export function FolderTitleBar() {
size="icon"
className={`h-6 w-6 hover:text-foreground/80 ${terminalOpen ? "bg-accent" : ""}`}
onClick={() => toggleTerminal()}
title={`Toggle Terminal (${formatShortcutLabel(shortcuts.toggle_terminal, isMac)})`}
title={tTitleBar("withShortcut", {
label: tTitleBar("toggleTerminal"),
shortcut: formatShortcutLabel(
shortcuts.toggle_terminal,
isMac
),
})}
>
<PanelBottom className="h-3.5 w-3.5" />
</Button>
@@ -277,7 +293,13 @@ export function FolderTitleBar() {
size="icon"
className={`h-6 w-6 hover:text-foreground/80 ${auxPanelOpen ? "bg-accent" : ""}`}
onClick={toggleAuxPanel}
title={`Toggle Auxiliary Panel (${formatShortcutLabel(shortcuts.toggle_aux_panel, isMac)})`}
title={tTitleBar("withShortcut", {
label: tTitleBar("toggleAuxPanel"),
shortcut: formatShortcutLabel(
shortcuts.toggle_aux_panel,
isMac
),
})}
>
<PanelRight className="h-3.5 w-3.5" />
</Button>
@@ -286,7 +308,10 @@ export function FolderTitleBar() {
size="icon"
className="h-6 w-6 hover:text-foreground/80"
onClick={() => setSearchOpen(true)}
title={`Search (${formatShortcutLabel(shortcuts.toggle_search, isMac)})`}
title={tTitleBar("withShortcut", {
label: tTitleBar("search"),
shortcut: formatShortcutLabel(shortcuts.toggle_search, isMac),
})}
>
<Search className="h-3.5 w-3.5" />
</Button>
@@ -295,7 +320,10 @@ export function FolderTitleBar() {
size="icon"
className="h-6 w-6 hover:text-foreground/80"
onClick={handleOpenSettings}
title={`Open Settings (${formatShortcutLabel(shortcuts.open_settings, isMac)})`}
title={tTitleBar("withShortcut", {
label: tTitleBar("openSettings"),
shortcut: formatShortcutLabel(shortcuts.open_settings, isMac),
})}
>
<Settings className="h-3.5 w-3.5" />
</Button>

12
src/components/layout/sidebar.tsx
View File

@@ -2,6 +2,7 @@
import { useCallback, useRef } from "react"
import { ChevronsDownUp, ChevronsUpDown, Crosshair, Plus } from "lucide-react"
import { useTranslations } from "next-intl"
import { useFolderContext } from "@/contexts/folder-context"
import { useTabContext } from "@/contexts/tab-context"
import { useSidebarContext } from "@/contexts/sidebar-context"
@@ -12,6 +13,7 @@ import {
import { Button } from "@/components/ui/button"
export function Sidebar() {
const t = useTranslations("Folder.sidebar")
const { folder } = useFolderContext()
const { openNewConversationTab } = useTabContext()
const { isOpen } = useSidebarContext()
@@ -27,14 +29,14 @@ export function Sidebar() {
return (
<aside className="group/sidebar flex h-full min-h-0 flex-col overflow-hidden bg-sidebar text-sidebar-foreground select-none">
<div className="flex h-10 items-center justify-between border-b border-border px-4">
<h2 className="text-xs font-bold">Conversations</h2>
<h2 className="text-xs font-bold">{t("title")}</h2>
<div className="flex items-center gap-0.5 opacity-0 transition-opacity group-hover/sidebar:opacity-100">
<Button
variant="ghost"
size="icon"
className="h-6 w-6 shrink-0 text-muted-foreground"
onClick={() => listRef.current?.scrollToActive()}
title="Locate Active Conversation"
title={t("locateActiveConversation")}
>
<Crosshair className="h-3.5 w-3.5" />
</Button>
@@ -43,7 +45,7 @@ export function Sidebar() {
size="icon"
className="h-6 w-6 shrink-0 text-muted-foreground"
onClick={() => listRef.current?.expandAll()}
title="Expand All Groups"
title={t("expandAllGroups")}
>
<ChevronsUpDown className="h-3.5 w-3.5" />
</Button>
@@ -52,7 +54,7 @@ export function Sidebar() {
size="icon"
className="h-6 w-6 shrink-0 text-muted-foreground"
onClick={() => listRef.current?.collapseAll()}
title="Collapse All Groups"
title={t("collapseAllGroups")}
>
<ChevronsDownUp className="h-3.5 w-3.5" />
</Button>
@@ -61,7 +63,7 @@ export function Sidebar() {
size="icon"
className="h-6 w-6 shrink-0 text-muted-foreground"
onClick={handleNewConversation}
title="New Conversation"
title={t("newConversation")}
>
<Plus className="h-3.5 w-3.5" />
</Button>

6
src/components/layout/status-bar-alerts.tsx
View File

@@ -1,6 +1,7 @@
"use client"
import { CircleAlert, X, Trash2 } from "lucide-react"
import { useTranslations } from "next-intl"
import {
useAlertContext,
type AlertLevel,
@@ -110,6 +111,7 @@ function AlertActionButton({ action }: { action: AlertAction }) {
}
export function StatusBarAlerts() {
const t = useTranslations("Folder.statusBar.alerts")
const { alerts, hasAlerts, dismissAlert, clearAll } = useAlertContext()
return (
@@ -124,7 +126,7 @@ export function StatusBarAlerts() {
</PopoverTrigger>
<PopoverContent side="top" align="end" className="w-80 p-3">
<div className="flex items-center justify-between mb-2">
<span className="text-xs font-medium">告警</span>
<span className="text-xs font-medium">{t("title")}</span>
{hasAlerts && (
<button
onClick={clearAll}
@@ -135,7 +137,7 @@ export function StatusBarAlerts() {
)}
</div>
{!hasAlerts ? (
<div className="text-xs text-muted-foreground py-2">暂无告警信息</div>
<div className="text-xs text-muted-foreground py-2">{t("empty")}</div>
) : (
<div className="space-y-2 max-h-56 overflow-y-auto">
{alerts.map((alert) => (

31
src/components/layout/status-bar-connection.tsx
View File

@@ -2,6 +2,7 @@
import { useCallback, useMemo, useSyncExternalStore } from "react"
import { Unplug } from "lucide-react"
import { useTranslations } from "next-intl"
import { useConnectionStore } from "@/contexts/acp-connections-context"
import { useTabContext } from "@/contexts/tab-context"
import { useFolderContext } from "@/contexts/folder-context"
@@ -15,24 +16,35 @@ import {
import { AGENT_LABELS } from "@/lib/types"
import { cn } from "@/lib/utils"
const STATUS_STYLE: Record<string, { className: string; title: string }> = {
connected: { className: "opacity-100", title: "Connected" },
type ConnectionStatusLabelKey =
| "connected"
| "connecting"
| "downloading"
| "prompting"
| "error"
const STATUS_STYLE: Record<
string,
{ className: string; labelKey: ConnectionStatusLabelKey }
> = {
connected: { className: "opacity-100", labelKey: "connected" },
connecting: {
className: "opacity-100 animate-pulse",
title: "Connecting...",
labelKey: "connecting",
},
downloading: {
className: "opacity-100 animate-pulse",
title: "Downloading...",
labelKey: "downloading",
},
prompting: {
className: "opacity-100 animate-pulse",
title: "Responding...",
labelKey: "prompting",
},
error: { className: "opacity-50", title: "Connection error" },
error: { className: "opacity-50", labelKey: "error" },
}
export function StatusBarConnection() {
const t = useTranslations("Folder.statusBar.connection")
const store = useConnectionStore()
const { tabs, activeTabId } = useTabContext()
const { conversations } = useFolderContext()
@@ -89,7 +101,7 @@ export function StatusBarConnection() {
{model && <span>{model}</span>}
</div>
</TooltipTrigger>
<TooltipContent side="top">Disconnected</TooltipContent>
<TooltipContent side="top">{t("disconnected")}</TooltipContent>
</Tooltip>
</TooltipProvider>
)
@@ -99,10 +111,11 @@ export function StatusBarConnection() {
if (!style) return null
const label = AGENT_LABELS[agentType]
const statusLabel = t(style.labelKey)
const tooltipText =
status === "error" && activeConn?.error
? `${label} - ${activeConn.error}`
: `${label} - ${style.title}`
? t("tooltipError", { agent: label, error: activeConn.error })
: t("tooltip", { agent: label, status: statusLabel })
return (
<TooltipProvider>

12
src/components/layout/status-bar-stats.tsx
View File

@@ -2,6 +2,7 @@
import { useMemo } from "react"
import { BarChart3 } from "lucide-react"
import { useTranslations } from "next-intl"
import { useFolderContext } from "@/contexts/folder-context"
import { AGENT_LABELS } from "@/lib/types"
import { AgentIcon } from "@/components/agent-icon"
@@ -12,6 +13,7 @@ import {
} from "@/components/ui/popover"
export function StatusBarStats() {
const t = useTranslations("Folder.statusBar.stats")
const { stats } = useFolderContext()
const activeAgents = useMemo(
@@ -26,7 +28,9 @@ export function StatusBarStats() {
<PopoverTrigger asChild>
<button className="flex items-center gap-1.5 hover:text-foreground transition-colors">
<BarChart3 className="h-3 w-3" />
<span>{stats.total_conversations} conversations</span>
<span>
{t("conversations", { count: stats.total_conversations })}
</span>
<span className="flex items-center gap-1 ml-1">
{activeAgents.map((a) => (
<AgentIcon
@@ -40,8 +44,10 @@ export function StatusBarStats() {
</PopoverTrigger>
<PopoverContent side="top" align="start" className="w-64 p-3">
<div className="text-xs font-medium mb-2">
{stats.total_conversations} conversations / {stats.total_messages}{" "}
messages
{t("summary", {
conversations: stats.total_conversations,
messages: stats.total_messages,
})}
</div>
<div className="space-y-1.5">
{activeAgents.map((a) => (

4
src/components/layout/status-bar-tasks.tsx
View File

@@ -1,6 +1,7 @@
"use client"
import { Clock } from "lucide-react"
import { useTranslations } from "next-intl"
import { useTaskContext } from "@/contexts/task-context"
import { Skeleton } from "@/components/ui/skeleton"
import {
@@ -18,6 +19,7 @@ function Spinner({ className }: { className?: string }) {
}
export function StatusBarTasks() {
const t = useTranslations("Folder.statusBar.tasks")
const { tasks } = useTaskContext()
if (tasks.length === 0) return null
@@ -45,7 +47,7 @@ export function StatusBarTasks() {
</button>
</PopoverTrigger>
<PopoverContent side="top" align="end" className="w-72 p-3">
<div className="text-xs font-medium mb-2">任务</div>
<div className="text-xs font-medium mb-2">{t("title")}</div>
<div className="space-y-2 max-h-48 overflow-y-auto">
{tasks.map((task) => (
<div key={task.id} className="space-y-1">

31
src/components/layout/status-bar-tokens.tsx
View File

@@ -1,6 +1,7 @@
"use client"
import { Coins } from "lucide-react"
import { useTranslations } from "next-intl"
import { useSessionStats } from "@/contexts/session-stats-context"
import {
Popover,
@@ -29,6 +30,7 @@ function formatPercent(percent: number | null): string {
}
export function StatusBarTokens() {
const t = useTranslations("Folder.statusBar.tokens")
const { sessionStats } = useSessionStats()
const usage = sessionStats?.total_usage
@@ -55,17 +57,20 @@ export function StatusBarTokens() {
const dashOffset = ICON_CIRCUMFERENCE * (1 - (contextPercent ?? 0) / 100)
const rows: { label: string; value: number }[] = []
const rows: {
key: "input" | "output" | "cacheRead" | "cacheWrite" | "total"
value: number
}[] = []
if (hasUsage) {
rows.push(
{ label: "Input", value: usage.input_tokens },
{ label: "Output", value: usage.output_tokens },
{ label: "Cache Read", value: usage.cache_read_input_tokens },
{ label: "Cache Write", value: usage.cache_creation_input_tokens }
{ key: "input", value: usage.input_tokens },
{ key: "output", value: usage.output_tokens },
{ key: "cacheRead", value: usage.cache_read_input_tokens },
{ key: "cacheWrite", value: usage.cache_creation_input_tokens }
)
}
if (total != null) {
rows.push({ label: "Total", value: total })
rows.push({ key: "total", value: total })
}
const hasTokenSection = rows.length > 0
@@ -79,7 +84,7 @@ export function StatusBarTokens() {
{hasContext ? (
<>
<svg
aria-label="Context window usage"
aria-label={t("contextWindowUsageAria")}
className="size-3.5"
viewBox={`0 0 ${ICON_VIEWBOX} ${ICON_VIEWBOX}`}
>
@@ -127,7 +132,7 @@ export function StatusBarTokens() {
}`}
>
<div className="flex items-center justify-between gap-2 text-xs font-medium whitespace-nowrap">
<span>Context Window</span>
<span>{t("contextWindow")}</span>
<span className="tabular-nums shrink-0">
{formatPercent(contextPercent)}
</span>
@@ -139,7 +144,7 @@ export function StatusBarTokens() {
/>
</div>
<div className="flex items-center justify-between text-xs leading-none text-muted-foreground">
<span>Used / Max</span>
<span>{t("usedMax")}</span>
<span className="tabular-nums">
{contextUsed == null || contextMax == null
? "--"
@@ -151,19 +156,19 @@ export function StatusBarTokens() {
{hasTokenSection ? (
<>
<div className="mb-0 mt-0.5 text-xs leading-none font-medium">
Token Usage
{t("tokenUsage")}
</div>
<div className="space-y-0">
{rows.map((row) => (
<div
key={row.label}
key={row.key}
className={`flex items-center justify-between py-0.5 text-xs leading-none ${
row.label === "Total"
row.key === "total"
? "mt-0.5 border-t border-border pt-0.5 font-medium"
: "text-muted-foreground"
}`}
>
<span>{row.label}</span>
<span>{t(row.key)}</span>
<span className="tabular-nums">
{formatNumber(row.value)}
</span>

14
src/components/layout/window-controls.tsx
View File

@@ -2,10 +2,12 @@
import { useEffect, useState } from "react"
import { getCurrentWindow } from "@tauri-apps/api/window"
import { useTranslations } from "next-intl"
import { usePlatform } from "@/hooks/use-platform"
import { cn } from "@/lib/utils"
export function WindowControls() {
const t = useTranslations("Folder.windowControls")
const { isWindows } = usePlatform()
const [isMaximized, setIsMaximized] = useState(false)
@@ -75,8 +77,8 @@ export function WindowControls() {
console.error("[WindowControls] failed to minimize:", err)
})
}}
aria-label="Minimize window"
title="Minimize"
aria-label={t("minimizeWindow")}
title={t("minimize")}
>
<MinimizeIcon />
</button>
@@ -88,8 +90,8 @@ export function WindowControls() {
console.error("[WindowControls] failed to toggle maximize:", err)
})
}}
aria-label={isMaximized ? "Restore window" : "Maximize window"}
title={isMaximized ? "Restore" : "Maximize"}
aria-label={t(isMaximized ? "restoreWindow" : "maximizeWindow")}
title={t(isMaximized ? "restore" : "maximize")}
>
{isMaximized ? <RestoreIcon /> : <MaximizeIcon />}
</button>
@@ -104,8 +106,8 @@ export function WindowControls() {
console.error("[WindowControls] failed to close:", err)
})
}}
aria-label="Close window"
title="Close"
aria-label={t("closeWindow")}
title={t("close")}
>
<CloseIcon />
</button>

12
src/components/tabs/tab-item.tsx
View File

@@ -3,6 +3,7 @@
import { memo, useCallback, useRef } from "react"
import { Reorder } from "motion/react"
import { X } from "lucide-react"
import { useTranslations } from "next-intl"
import { cn } from "@/lib/utils"
import { STATUS_COLORS } from "@/lib/types"
import type { ConversationStatus } from "@/lib/types"
@@ -34,6 +35,7 @@ export const TabItem = memo(function TabItem({
onCloseAll,
onPin,
}: TabItemProps) {
const t = useTranslations("Folder.tabs")
const isDragging = useRef(false)
const itemRef = useRef<HTMLDivElement>(null)
@@ -129,19 +131,21 @@ export const TabItem = memo(function TabItem({
event.stopPropagation()
handleClose()
}}
aria-label="Close conversation tab"
aria-label={t("closeConversationTab")}
>
<X className="h-3 w-3" />
</button>
</div>
</ContextMenuTrigger>
<ContextMenuContent>
<ContextMenuItem onSelect={handleClose}>关闭</ContextMenuItem>
<ContextMenuItem onSelect={handleClose}>{t("close")}</ContextMenuItem>
<ContextMenuItem onSelect={handleCloseOthers}>
关闭其它
{t("closeOthers")}
</ContextMenuItem>
<ContextMenuSeparator />
<ContextMenuItem onSelect={onCloseAll}>关闭所有</ContextMenuItem>
<ContextMenuItem onSelect={onCloseAll}>
{t("closeAll")}
</ContextMenuItem>
</ContextMenuContent>
</ContextMenu>
</Reorder.Item>

19
src/components/terminal/terminal-tab-bar.tsx
View File

@@ -2,7 +2,11 @@
import { useRef, useState } from "react"
import { Minus, Plus, X } from "lucide-react"
import { useTranslations } from "next-intl"
import { useTerminalContext } from "@/contexts/terminal-context"
import { useShortcutSettings } from "@/hooks/use-shortcut-settings"
import { useIsMac } from "@/hooks/use-is-mac"
import { formatShortcutLabel } from "@/lib/keyboard-shortcuts"
import { Button } from "@/components/ui/button"
import {
ContextMenu,
@@ -13,6 +17,9 @@ import {
} from "@/components/ui/context-menu"
export function TerminalTabBar() {
const t = useTranslations("Folder.terminal")
const { shortcuts } = useShortcutSettings()
const isMac = useIsMac()
const {
tabs,
activeTabId,
@@ -83,20 +90,20 @@ export function TerminalTabBar() {
</ContextMenuTrigger>
<ContextMenuContent>
<ContextMenuItem onSelect={() => startRename(tab.id, tab.title)}>
重命名
{t("rename")}
</ContextMenuItem>
<ContextMenuSeparator />
<ContextMenuItem onSelect={() => closeTerminal(tab.id)}>
关闭
{t("close")}
</ContextMenuItem>
<ContextMenuItem
onSelect={() => closeOtherTerminals(tab.id)}
disabled={tabs.length <= 1}
>
关闭其它
{t("closeOthers")}
</ContextMenuItem>
<ContextMenuItem onSelect={() => closeAllTerminals()}>
关闭所有
{t("closeAll")}
</ContextMenuItem>
</ContextMenuContent>
</ContextMenu>
@@ -114,7 +121,9 @@ export function TerminalTabBar() {
size="icon"
className="h-6 w-6 shrink-0 ml-auto"
onClick={toggle}
title="Hide Terminal (Ctrl+J)"
title={t("hideTerminal", {
shortcut: formatShortcutLabel(shortcuts.toggle_terminal, isMac),
})}
>
<Minus className="h-3 w-3" />
</Button>