@fatdoge/wtree 0.2.1 → 0.3.0

package/src/i18n/locales/en.json

@@ -128,6 +128,23 @@
       "pruneFailed": "Prune failed"
     }
   },
+  "diff": {
+    "title": "Changes",
+    "viewStaged": "Diff",
+    "stagedFiles": "Staged",
+    "unstagedFiles": "Unstaged",
+    "diffPreview": "Diff preview",
+    "noChanges": "No changes in this worktree.",
+    "selectFile": "Select a file to view diff",
+    "noDiffContent": "No diff content for this file",
+    "commits": "Commits",
+    "copyDiff": "Copy Diff",
+    "close": "Close",
+    "toast": {
+      "copied": "Diff copied to clipboard",
+      "copyFailed": "Failed to copy diff"
+    }
+  },
   "helpPage": {
     "title": "Help",
     "commands": "Commands Reference",

package/src/i18n/locales/zh.json

@@ -128,6 +128,23 @@
       "pruneFailed": "清理失败"
     }
   },
+  "diff": {
+    "title": "变更",
+    "viewStaged": "Diff",
+    "stagedFiles": "已暂存",
+    "unstagedFiles": "未暂存",
+    "diffPreview": "Diff 预览",
+    "noChanges": "该 worktree 没有变动。",
+    "selectFile": "选择文件查看 diff",
+    "noDiffContent": "该文件没有 diff 内容",
+    "commits": "提交记录",
+    "copyDiff": "复制 Diff",
+    "close": "关闭",
+    "toast": {
+      "copied": "Diff 已复制到剪贴板",
+      "copyFailed": "复制 Diff 失败"
+    }
+  },
   "helpPage": {
     "title": "帮助",
     "commands": "命令速查",

package/src/pages/Worktrees.tsx

@@ -1,11 +1,13 @@
-import { Copy, ExternalLink, Plus, RefreshCw, Settings, Trash2, Lock, Unlock, Code } from 'lucide-react'
+import { Copy, ExternalLink, Plus, RefreshCw, Settings, Trash2, Lock, Unlock, Code, GitCompare } from 'lucide-react'
 import { useEffect, useMemo, useState } from 'react'
 import { Link } from 'react-router-dom'
 import { useTranslation } from 'react-i18next'
 import Button from '@/components/Button'
 import Modal from '@/components/Modal'
+import DiffPreviewModal from '@/components/DiffPreviewModal'
 import { useWorktreeStore } from '@/stores/worktreeStore'
 import { toast } from 'sonner'
+import type { WorktreeDiffInfo } from '../../shared/wtui-types'
 
 function truncatePath(p: string) {
   if (p.length <= 70) return p
@@ -24,11 +26,18 @@ export default function Worktrees() {
   const lock = useWorktreeStore((s) => s.lock)
   const unlock = useWorktreeStore((s) => s.unlock)
 
+  const fetchStagedDiff = useWorktreeStore((s) => s.fetchStagedDiff)
+
   const [removeId, setRemoveId] = useState<string | null>(null)
   const [forceDelete, setForceDelete] = useState(false)
   const [isDeleting, setIsDeleting] = useState(false)
+  const [diffWorktreeId, setDiffWorktreeId] = useState<string | null>(null)
+  const [diffInfo, setDiffInfo] = useState<WorktreeDiffInfo | null>(null)
+  const [diffLoading, setDiffLoading] = useState(false)
+
   const selected = useMemo(() => items.find((x) => x.id === selectedId), [items, selectedId])
   const toRemove = useMemo(() => items.find((x) => x.id === removeId), [items, removeId])
+  const diffWorktree = useMemo(() => items.find((x) => x.id === diffWorktreeId), [items, diffWorktreeId])
 
   useEffect(() => {
     refresh()
@@ -40,6 +49,23 @@ export default function Worktrees() {
     setIsDeleting(false)
   }
 
+  const openDiff = async (id: string) => {
+    setDiffWorktreeId(id)
+    setDiffInfo(null)
+    setDiffLoading(true)
+    try {
+      const info = await fetchStagedDiff(id)
+      if (info) setDiffInfo(info)
+    } finally {
+      setDiffLoading(false)
+    }
+  }
+
+  const closeDiff = () => {
+    setDiffWorktreeId(null)
+    setDiffInfo(null)
+  }
+
   const handleDelete = async () => {
     if (!removeId) return
     setIsDeleting(true)
@@ -166,6 +192,17 @@ export default function Worktrees() {
                         )}
                       </div>
                       <div className="col-span-2 mt-3 md:mt-0 flex md:justify-end gap-1">
+                        <Button
+                          variant="ghost"
+                          size="sm"
+                          onClick={(e) => {
+                            e.stopPropagation()
+                            openDiff(wt.id)
+                          }}
+                          title={t('diff.viewStaged')}
+                        >
+                          <GitCompare className="h-4 w-4" />
+                        </Button>
                         <Button
                           variant="ghost"
                           size="sm"
@@ -282,6 +319,15 @@ export default function Worktrees() {
                     <ExternalLink className="h-4 w-4" />
                     {t('worktrees.actions.folder')}
                   </Button>
+                  <Button
+                    className="w-full sm:w-auto"
+                    variant="secondary"
+                    size="sm"
+                    onClick={() => openDiff(selected.id)}
+                  >
+                    <GitCompare className="h-4 w-4" />
+                    {t('diff.viewStaged')}
+                  </Button>
                 </div>
               </div>
             ) : (
@@ -301,6 +347,14 @@ export default function Worktrees() {
         </div>
       </div>
 
+      <DiffPreviewModal
+        open={Boolean(diffWorktreeId)}
+        onClose={closeDiff}
+        worktreePath={diffWorktree?.path ?? ''}
+        diffInfo={diffInfo}
+        loading={diffLoading}
+      />
+
       <Modal
         title={forceDelete ? t('worktrees.deleteModal.forceTitle') : t('worktrees.deleteModal.title')}
         open={Boolean(removeId)}

package/src/stores/worktreeStore.ts

@@ -1,5 +1,5 @@
 import { create } from 'zustand'
-import type { CreateWorktreeRequest, WorktreeItem } from '../../shared/wtui-types'
+import type { CreateWorktreeRequest, WorktreeItem, WorktreeDiffInfo } from '../../shared/wtui-types'
 import { apiDelete, apiGet, apiPost } from '@/utils/api'
 
 type WorktreeState = {
@@ -16,6 +16,7 @@ type WorktreeState = {
   prune: () => Promise<boolean>
   branches: string[]
   fetchBranches: () => Promise<void>
+  fetchStagedDiff: (id: string) => Promise<WorktreeDiffInfo | null>
 }
 
 export const useWorktreeStore = create<WorktreeState>((set, get) => ({
@@ -90,4 +91,9 @@ export const useWorktreeStore = create<WorktreeState>((set, get) => ({
     const r = await apiGet<string[]>('/api/branches')
     if (r.ok) set({ branches: r.data })
   },
+  fetchStagedDiff: async (id: string) => {
+    const r = await apiGet<WorktreeDiffInfo>(`/api/worktrees/${encodeURIComponent(id)}/staged`)
+    if (r.ok) return r.data
+    return null
+  },
 }))