{headerActions}
: null}
diff --git a/packages/views/git/branch-switcher.tsx b/packages/views/git/branch-switcher.tsx
new file mode 100644
index 0000000..85183af
--- /dev/null
+++ b/packages/views/git/branch-switcher.tsx
@@ -0,0 +1,137 @@
+"use client";
+
+import type { Branch, BranchView } from "@codedock/core/git";
+import { cn } from "@codedock/ui";
+import { ChevronDownIcon } from "lucide-react";
+import { useEffect, useRef, useState } from "react";
+
+import { shortHead } from "./lib/status.ts";
+
+export function BranchSwitcher({
+ view,
+ busy,
+ onSelectLocal,
+ onSelectRemote,
+}: {
+ view: BranchView;
+ busy: boolean;
+ onSelectLocal: (name: string) => Promise;
+ onSelectRemote: (name: string) => Promise;
+}) {
+ const [open, setOpen] = useState(false);
+ const root = useRef(null);
+ const current = view.current || "游离 HEAD";
+
+ useEffect(() => {
+ if (!open) {
+ return;
+ }
+ const onPointer = (event: PointerEvent) => {
+ if (root.current && !root.current.contains(event.target as Node)) {
+ setOpen(false);
+ }
+ };
+ document.addEventListener("pointerdown", onPointer);
+ return () => document.removeEventListener("pointerdown", onPointer);
+ }, [open]);
+
+ const pick = async (kind: "local" | "remote", name: string) => {
+ if (busy) {
+ return;
+ }
+ setOpen(false);
+ if (kind === "local") {
+ if (name === view.current) {
+ return;
+ }
+ await onSelectLocal(name);
+ return;
+ }
+ await onSelectRemote(name);
+ };
+
+ return (
+ (null);
+ const latest = commits[0];
+
+ useEffect(() => {
+ if (!open) {
+ return;
+ }
+ const onPointer = (event: PointerEvent) => {
+ if (root.current && !root.current.contains(event.target as Node)) {
+ setOpen(false);
+ }
+ };
+ const onKey = (event: KeyboardEvent) => {
+ if (event.key === "Escape") {
+ setOpen(false);
+ }
+ };
+ document.addEventListener("pointerdown", onPointer);
+ document.addEventListener("keydown", onKey);
+ return () => {
+ document.removeEventListener("pointerdown", onPointer);
+ document.removeEventListener("keydown", onKey);
+ };
+ }, [open]);
+
+ return (
+
+
+ );
+}
+
+function content(target: PreviewTarget | null, file: GitDiffFile | null, ready: boolean) {
+ if (!target) {
+ return 点击左侧文件查看差异 ;
+ }
+ if (!ready) {
+ return 正在读取差异… ;
+ }
+ if (!file) {
+ return 该文件当前没有差异 ;
+ }
+ if (file.binary) {
+ return 二进制文件，无法展示文本差异 ;
+ }
+ const patch = file.patch.trim();
+ if (!patch) {
+ return 这个文件没有可展示的文本差异 ;
+ }
+ return (
+
+
+ );
+}
diff --git a/packages/views/git/git-page.tsx b/packages/views/git/git-page.tsx
new file mode 100644
index 0000000..c499695
--- /dev/null
+++ b/packages/views/git/git-page.tsx
@@ -0,0 +1,98 @@
+"use client";
+
+import { Button } from "@codedock/ui";
+import { useMemo, useState, type ReactNode } from "react";
+
+import { BranchSwitcher } from "./branch-switcher.tsx";
+import { CommitHistory } from "./commit-history.tsx";
+import { DiffPanel } from "./diff-panel.tsx";
+import { useGitSite } from "./hooks/use-git-site.ts";
+import type { PreviewTarget } from "./lib/preview.ts";
+import { shortHead, trackLabel } from "./lib/status.ts";
+import { WorkspacePanel } from "./workspace-panel.tsx";
+
+export type GitPageProps = {
+ onBack?: () => void;
+ headerActions?: ReactNode;
+};
+
+export function GitPage({ onBack, headerActions }: GitPageProps) {
+ const site = useGitSite();
+ const [preview, setPreview] = useState(null);
+ const previewFile = useMemo(() => {
+ if (!preview) {
+ return null;
+ }
+ const list = preview.scope === "staged" ? site.diffs.staged : site.diffs.worktree;
+ return list.find((file) => file.path === preview.path) ?? null;
+ }, [preview, site.diffs]);
+
+ return (
+ (emptyState);
+ const [branches, setBranches] = useState(emptyBranches);
+ const [diffs, setDiffs] = useState(emptyDiffs);
+ const [commits, setCommits] = useState([]);
+ const [prompt, setPrompt] = useState(null);
+ const [error, setError] = useState(null);
+ const [busy, setBusy] = useState(false);
+ const [generating, setGenerating] = useState(false);
+ const [loading, setLoading] = useState(true);
+
+ const refresh = useCallback(async () => {
+ try {
+ const nextState = await client.status();
+ setState(nextState);
+ const extras = await Promise.allSettled([
+ client.listBranches(),
+ client.diff("staged"),
+ client.diff("worktree"),
+ client.log(),
+ ]);
+ const [nextBranches, staged, worktree, nextCommits] = extras;
+ if (nextBranches.status === "fulfilled") {
+ setBranches({
+ ...nextBranches.value,
+ locals: nextBranches.value.locals ?? [],
+ remotes: nextBranches.value.remotes ?? [],
+ graph: nextBranches.value.graph ?? { nodes: [], edges: [] },
+ });
+ }
+ if (staged.status === "fulfilled" || worktree.status === "fulfilled") {
+ setDiffs((prev) => ({
+ staged: staged.status === "fulfilled" ? staged.value : prev.staged,
+ worktree: worktree.status === "fulfilled" ? worktree.value : prev.worktree,
+ }));
+ }
+ if (nextCommits.status === "fulfilled") {
+ setCommits(nextCommits.value);
+ }
+ const failed = extras.find((item) => item.status === "rejected");
+ if (failed && failed.status === "rejected") {
+ setError(failed.reason instanceof Error ? failed.reason.message : "无法读取仓库");
+ return;
+ }
+ setError(null);
+ } catch (err) {
+ setError(err instanceof Error ? err.message : "无法读取仓库");
+ } finally {
+ setLoading(false);
+ }
+ }, [client]);
+
+ useEffect(() => {
+ void refresh();
+ }, [refresh]);
+
+ useEffect(() => {
+ let cancelled = false;
+ void client
+ .messagePrompt()
+ .then((next) => {
+ if (!cancelled) {
+ setPrompt(next);
+ }
+ })
+ .catch((err: unknown) => {
+ if (!cancelled) {
+ setError(err instanceof Error ? err.message : "无法读取提示词");
+ }
+ });
+ return () => {
+ cancelled = true;
+ };
+ }, [client]);
+
+ const run = useCallback(
+ async (action: () => Promise) => {
+ setBusy(true);
+ try {
+ await action();
+ await refresh();
+ setError(null);
+ } catch (err) {
+ setError(err instanceof Error ? err.message : "操作失败");
+ throw err;
+ } finally {
+ setBusy(false);
+ }
+ },
+ [refresh],
+ );
+
+ const stage = useCallback((paths: string[]) => run(() => client.stage(paths)), [client, run]);
+ const unstage = useCallback((paths: string[]) => run(() => client.unstage(paths)), [client, run]);
+ const discard = useCallback((paths: string[]) => run(() => client.discard(paths)), [client, run]);
+ const commit = useCallback(
+ (message: string) => run(() => client.commit({ message, paths: [] })),
+ [client, run],
+ );
+ const push = useCallback(() => run(() => client.push()), [client, run]);
+ const switchBranch = useCallback(
+ (name: string) => run(() => client.switchBranch(name)),
+ [client, run],
+ );
+ const reload = useCallback(async () => {
+ setBusy(true);
+ try {
+ await refresh();
+ } finally {
+ setBusy(false);
+ }
+ }, [refresh]);
+
+ const generate = useCallback(async (): Promise => {
+ setGenerating(true);
+ try {
+ const draft = await client.generateMessage();
+ setError(null);
+ return draft;
+ } catch (err) {
+ setError(err instanceof Error ? err.message : "生成失败");
+ throw err;
+ } finally {
+ setGenerating(false);
+ }
+ }, [client]);
+
+ const savePrompt = useCallback(
+ async (selected: string, custom: string) => {
+ try {
+ const next = await client.saveMessagePrompt({ selected, custom });
+ setPrompt(next);
+ setError(null);
+ } catch (err) {
+ setError(err instanceof Error ? err.message : "无法保存提示词");
+ throw err;
+ }
+ },
+ [client],
+ );
+
+ const checkoutRemote = useCallback(
+ (remoteName: string) =>
+ run(async () => {
+ const local = localNameFromRemote(remoteName);
+ const listed = await client.listBranches();
+ const exists = (listed.locals ?? []).some((branch) => branch.name === local);
+ if (!exists) {
+ await client.createBranch(local, remoteName);
+ }
+ await client.switchBranch(local);
+ }),
+ [client, run],
+ );
+
+ return {
+ state,
+ branches,
+ diffs,
+ commits,
+ prompt,
+ error,
+ busy,
+ generating,
+ loading,
+ refresh,
+ reload,
+ stage,
+ unstage,
+ discard,
+ commit,
+ generate,
+ savePrompt,
+ push,
+ switchBranch,
+ checkoutRemote,
+ };
+}
diff --git a/packages/views/git/index.ts b/packages/views/git/index.ts
new file mode 100644
index 0000000..a22b476
--- /dev/null
+++ b/packages/views/git/index.ts
@@ -0,0 +1,3 @@
+export { GitPage, type GitPageProps } from "./git-page.tsx";
+export { GitProvider, useGit } from "./provider.tsx";
+export { useGitSite } from "./hooks/use-git-site.ts";
diff --git a/packages/views/git/lib/preview.ts b/packages/views/git/lib/preview.ts
new file mode 100644
index 0000000..6adda4f
--- /dev/null
+++ b/packages/views/git/lib/preview.ts
@@ -0,0 +1,14 @@
+import type { DiffScope } from "@codedock/core/git";
+
+export type PreviewTarget = {
+ path: string;
+ scope: DiffScope;
+};
+
+export function isPreviewablePath(path: string): boolean {
+ return path !== "" && !path.endsWith("/");
+}
+
+export function scopeLabel(scope: DiffScope): string {
+ return scope === "staged" ? "已暂存" : "当前目录";
+}
diff --git a/packages/views/git/lib/status.ts b/packages/views/git/lib/status.ts
new file mode 100644
index 0000000..e112347
--- /dev/null
+++ b/packages/views/git/lib/status.ts
@@ -0,0 +1,80 @@
+import type { FileStatus } from "@codedock/core/git";
+
+export function letterDirty(letter: string): boolean {
+ return letter !== "" && letter !== " " && letter !== ".";
+}
+
+export function isStaged(file: FileStatus): boolean {
+ return letterDirty(file.staged_status);
+}
+
+export function isWorktreeDirty(file: FileStatus): boolean {
+ return letterDirty(file.worktree_status);
+}
+
+export function splitWorkspaceFiles(files: FileStatus[]): {
+ staged: FileStatus[];
+ worktree: FileStatus[];
+} {
+ return {
+ staged: files.filter((file) => isStaged(file) && !file.unmerged),
+ worktree: files.filter((file) => isWorktreeDirty(file) || file.unmerged),
+ };
+}
+
+export function stagedLabel(file: FileStatus): string {
+ if (file.unmerged) {
+ return "冲突";
+ }
+ switch (file.staged_status) {
+ case "A":
+ return "新增";
+ case "D":
+ return "删除";
+ case "R":
+ return "重命名";
+ case "C":
+ return "复制";
+ default:
+ return "已修改";
+ }
+}
+
+export function worktreeLabel(file: FileStatus): string {
+ if (file.unmerged) {
+ return "冲突";
+ }
+ if (file.worktree_status === "?") {
+ return "未跟踪";
+ }
+ if (file.worktree_status === "D") {
+ return "删除";
+ }
+ return "已修改";
+}
+
+export function localNameFromRemote(remoteName: string): string {
+ const slash = remoteName.indexOf("/");
+ return slash === -1 ? remoteName : remoteName.slice(slash + 1);
+}
+
+export function shortHead(head: string): string {
+ return head.slice(0, 8);
+}
+
+export function trackLabel(ahead: number, behind: number, upstream: string, gone: boolean): string {
+ if (!upstream) {
+ return "未跟踪远程";
+ }
+ if (gone) {
+ return `${upstream} 已删除`;
+ }
+ const bits: string[] = [];
+ if (ahead > 0) {
+ bits.push(`超前 ${ahead}`);
+ }
+ if (behind > 0) {
+ bits.push(`落后 ${behind}`);
+ }
+ return bits.length > 0 ? `${upstream} · ${bits.join(" · ")}` : upstream;
+}
diff --git a/packages/views/git/lib/tree.test.ts b/packages/views/git/lib/tree.test.ts
new file mode 100644
index 0000000..4562bf3
--- /dev/null
+++ b/packages/views/git/lib/tree.test.ts
@@ -0,0 +1,98 @@
+import assert from "node:assert/strict";
+import { test } from "node:test";
+
+import { isPreviewablePath } from "./preview.ts";
+import { localNameFromRemote, splitWorkspaceFiles } from "./status.ts";
+import { buildFileTree, collectFilePaths } from "./tree.ts";
+
+function file(
+ path: string,
+ staged = " ",
+ worktree = "M",
+): {
+ path: string;
+ orig_path: string;
+ staged_status: string;
+ worktree_status: string;
+ unmerged: boolean;
+} {
+ return {
+ path,
+ orig_path: "",
+ staged_status: staged,
+ worktree_status: worktree,
+ unmerged: false,
+ };
+}
+
+test("buildFileTree groups files under directories", () => {
+ const tree = buildFileTree([
+ file("apps/web/app/page.tsx"),
+ file("apps/web/package.json"),
+ file("README.md"),
+ ]);
+ assert.equal(tree.length, 2);
+ assert.equal(tree[0]?.name, "apps");
+ assert.equal(tree[0]?.children[0]?.name, "web");
+ assert.deepEqual(
+ tree[0]?.children[0]?.children.map((node) => node.name),
+ ["app", "package.json"],
+ );
+ assert.equal(tree[1]?.name, "README.md");
+ assert.equal(tree[1]?.file?.path, "README.md");
+});
+
+test("collectFilePaths walks a folder", () => {
+ const tree = buildFileTree([file("a/b.txt"), file("a/c.txt")]);
+ assert.deepEqual(collectFilePaths(tree[0]!), ["a/b.txt", "a/c.txt"]);
+});
+
+test("splitWorkspaceFiles separates staged and worktree", () => {
+ const split = splitWorkspaceFiles([
+ file("staged.ts", "M", " "),
+ file("dirty.ts", " ", "M"),
+ file("both.ts", "M", "M"),
+ { ...file("conflict.ts", "U", "U"), unmerged: true },
+ ]);
+ assert.deepEqual(
+ split.staged.map((item) => item.path),
+ ["staged.ts", "both.ts"],
+ );
+ assert.deepEqual(
+ split.worktree.map((item) => item.path),
+ ["dirty.ts", "both.ts", "conflict.ts"],
+ );
+});
+
+test("buildFileTree treats trailing-slash paths as folders", () => {
+ const tree = buildFileTree([file("apps/web/app/git/")]);
+ const git = tree[0]?.children[0]?.children[0]?.children[0];
+ assert.equal(git?.name, "git");
+ assert.equal(git?.file, undefined);
+ assert.deepEqual(git?.children, []);
+});
+
+test("buildFileTree nests untracked files under folders", () => {
+ const tree = buildFileTree([
+ file("packages/views/git/file-tree.tsx", " ", "?"),
+ file("packages/views/git/git-page.tsx", " ", "?"),
+ ]);
+ const git = tree[0]?.children[0]?.children[0];
+ assert.equal(git?.name, "git");
+ assert.equal(git?.file, undefined);
+ assert.deepEqual(
+ git?.children.map((node) => node.name),
+ ["file-tree.tsx", "git-page.tsx"],
+ );
+});
+
+test("localNameFromRemote strips the remote prefix", () => {
+ assert.equal(localNameFromRemote("origin/feat/git"), "feat/git");
+ assert.equal(localNameFromRemote("main"), "main");
+});
+
+test("isPreviewablePath skips folders", () => {
+ assert.equal(isPreviewablePath("apps/web/app/page.tsx"), true);
+ assert.equal(isPreviewablePath("apps/web/app/git/"), false);
+ assert.equal(isPreviewablePath(""), false);
+});
diff --git a/packages/views/git/lib/tree.ts b/packages/views/git/lib/tree.ts
new file mode 100644
index 0000000..879e86e
--- /dev/null
+++ b/packages/views/git/lib/tree.ts
@@ -0,0 +1,68 @@
+import type { FileStatus } from "@codedock/core/git";
+
+export type FileTreeNode = {
+ name: string;
+ path: string;
+ file?: FileStatus;
+ children: FileTreeNode[];
+};
+
+export function buildFileTree(files: FileStatus[]): FileTreeNode[] {
+ const root: FileTreeNode[] = [];
+ const dirs = new Map();
+
+ const ensureDir = (dirPath: string): FileTreeNode[] => {
+ if (!dirPath) {
+ return root;
+ }
+ const existing = dirs.get(dirPath);
+ if (existing) {
+ return existing.children;
+ }
+ const parts = dirPath.split("/");
+ const name = parts[parts.length - 1] ?? dirPath;
+ const parentPath = parts.slice(0, -1).join("/");
+ const node: FileTreeNode = { name, path: dirPath, children: [] };
+ dirs.set(dirPath, node);
+ ensureDir(parentPath).push(node);
+ return node.children;
+ };
+
+ const sorted = [...files].sort((a, b) => a.path.localeCompare(b.path));
+ for (const file of sorted) {
+ const normalized = file.path.replace(/\/+$/, "");
+ if (!normalized) {
+ continue;
+ }
+ if (file.path.endsWith("/")) {
+ ensureDir(normalized);
+ continue;
+ }
+ const parts = normalized.split("/").filter(Boolean);
+ const name = parts[parts.length - 1] ?? normalized;
+ const dir = parts.slice(0, -1).join("/");
+ ensureDir(dir).push({ name, path: file.path, file, children: [] });
+ }
+
+ const sortNodes = (nodes: FileTreeNode[]) => {
+ nodes.sort((a, b) => {
+ const dirFirst = Number(Boolean(a.file)) - Number(Boolean(b.file));
+ if (dirFirst !== 0) {
+ return dirFirst;
+ }
+ return a.name.localeCompare(b.name);
+ });
+ for (const node of nodes) {
+ sortNodes(node.children);
+ }
+ };
+ sortNodes(root);
+ return root;
+}
+
+export function collectFilePaths(node: FileTreeNode): string[] {
+ if (node.file) {
+ return [node.file.path];
+ }
+ return node.children.flatMap(collectFilePaths);
+}
diff --git a/packages/views/git/prompt-picker.tsx b/packages/views/git/prompt-picker.tsx
new file mode 100644
index 0000000..4eaae7c
--- /dev/null
+++ b/packages/views/git/prompt-picker.tsx
@@ -0,0 +1,123 @@
+"use client";
+
+import type { PromptConfig } from "@codedock/core/git";
+import { cn } from "@codedock/ui";
+import { ChevronDownIcon } from "lucide-react";
+import { useEffect, useRef, useState } from "react";
+
+export function PromptPicker({
+ prompt,
+ disabled,
+ onSelect,
+ onSaveCustom,
+}: {
+ prompt: PromptConfig | null;
+ disabled: boolean;
+ onSelect: (selected: string) => Promise;
+ onSaveCustom: (custom: string) => Promise;
+}) {
+ const [open, setOpen] = useState(false);
+ const [custom, setCustom] = useState(prompt?.custom ?? "");
+ const root = useRef(null);
+ const selected = prompt?.selected ?? "conventional";
+ const label = prompt?.presets.find((item) => item.id === selected)?.name ?? "提示词";
+
+ const persistCustom = () => {
+ if (selected === "custom" && custom !== (prompt?.custom ?? "")) {
+ void onSaveCustom(custom);
+ }
+ };
+
+ const close = () => {
+ persistCustom();
+ setOpen(false);
+ };
+
+ useEffect(() => {
+ setCustom(prompt?.custom ?? "");
+ }, [prompt?.custom]);
+
+ useEffect(() => {
+ if (!open) {
+ return;
+ }
+ const onPointer = (event: PointerEvent) => {
+ if (root.current && !root.current.contains(event.target as Node)) {
+ close();
+ }
+ };
+ document.addEventListener("pointerdown", onPointer);
+ return () => document.removeEventListener("pointerdown", onPointer);
+ }, [open, custom, selected, prompt?.custom]);
+
+ return (
+
+
+ {open ? (
+
+ );
+}
+
+function BranchGroup({
+ title,
+ empty,
+ items,
+ current,
+ onPick,
+}: {
+ title: string;
+ empty: string;
+ items: Branch[];
+ current: string;
+ onPick: (name: string) => void;
+}) {
+ return (
+
+ void pick("local", name)}
+ />
+ void pick("remote", name)}
+ />
+
+ ) : null}
+
+
+ );
+}
diff --git a/packages/views/git/commit-history.tsx b/packages/views/git/commit-history.tsx
new file mode 100644
index 0000000..6a4a893
--- /dev/null
+++ b/packages/views/git/commit-history.tsx
@@ -0,0 +1,88 @@
+"use client";
+
+import type { Commit } from "@codedock/core/git";
+import { cn } from "@codedock/ui";
+import { ChevronDownIcon } from "lucide-react";
+import { useEffect, useRef, useState } from "react";
+
+import { shortHead } from "./lib/status.ts";
+
+export function CommitHistory({ commits, busy }: { commits: Commit[]; busy: boolean }) {
+ const [open, setOpen] = useState(false);
+ const root = useRef{title}
+ {items.length === 0 ? (
+ {empty}
+ ) : ( +-
+ {items.map((branch) => {
+ const active = !branch.is_remote && (branch.is_current || branch.name === current);
+ return (
+
- + + + ); + })} +
+
+ {open ? (
+
+ );
+}
diff --git a/packages/views/git/diff-panel.tsx b/packages/views/git/diff-panel.tsx
new file mode 100644
index 0000000..58671ab
--- /dev/null
+++ b/packages/views/git/diff-panel.tsx
@@ -0,0 +1,75 @@
+"use client";
+
+import type { DiffFile as GitDiffFile } from "@codedock/core/git";
+import { DiffModeEnum, DiffView } from "@git-diff-view/react";
+import "@git-diff-view/react/styles/diff-view.css";
+
+import { scopeLabel, type PreviewTarget } from "./lib/preview.ts";
+
+export function DiffPanel({
+ target,
+ file,
+ ready,
+}: {
+ target: PreviewTarget | null;
+ file: GitDiffFile | null;
+ ready: boolean;
+}) {
+ return (
+
+
+ ) : null}
+ 提交历史
+ {commits.length === 0 ? (
+ 还没有提交
+ ) : ( +-
+ {commits.map((commit, index) => (
+
- + + {commit.title} + {index === 0 ? ( + HEAD + ) : null} + + + {shortHead(commit.id)} + {commit.author ? ` · ${commit.author}` : ""} + {commit.date ? ` · ${commit.date.slice(0, 10)}` : ""} + + + ))} +
+ {target ? (
+ <>
+ {scopeLabel(target.scope)}
+ {target.path}
+ {file?.orig_path ? (
+ 来自 {file.orig_path}
+ ) : null}
+
+ ) : (
+ 差异
+ )}
+
+ {content(target, file, ready)}
+ {children}
; +} diff --git a/packages/views/git/discard-confirm.tsx b/packages/views/git/discard-confirm.tsx new file mode 100644 index 0000000..c496ce3 --- /dev/null +++ b/packages/views/git/discard-confirm.tsx @@ -0,0 +1,80 @@ +"use client"; + +import { Button } from "@codedock/ui"; +import { useEffect } from "react"; + +export type DiscardRequest = { + name: string; + paths: string[]; +}; + +export function DiscardConfirm({ + request, + busy, + onCancel, + onConfirm, +}: { + request: DiscardRequest | null; + busy: boolean; + onCancel: () => void; + onConfirm: () => void; +}) { + useEffect(() => { + if (!request) { + return; + } + const onKey = (event: KeyboardEvent) => { + if (event.key === "Escape" && !busy) { + onCancel(); + } + }; + window.addEventListener("keydown", onKey); + return () => window.removeEventListener("keydown", onKey); + }, [busy, onCancel, request]); + + if (!request) { + return null; + } + + const count = request.paths.length; + const summary = + count > 1 + ? `将丢掉「${request.name}」下 ${count} 个文件的工作区改动。` + : `将丢掉「${request.name}」的工作区改动。`; + + return ( + {
+ if (!busy) {
+ onCancel();
+ }
+ }}
+ >
+
+ );
+}
diff --git a/packages/views/git/file-tree.tsx b/packages/views/git/file-tree.tsx
new file mode 100644
index 0000000..1214dd9
--- /dev/null
+++ b/packages/views/git/file-tree.tsx
@@ -0,0 +1,191 @@
+"use client";
+
+import type { FileStatus } from "@codedock/core/git";
+import { cn } from "@codedock/ui";
+import { ChevronDownIcon, ChevronRightIcon, File, Folder, FolderOpen, Minus, Plus, Undo2 } from "lucide-react";
+import { useMemo, useState } from "react";
+
+import { isPreviewablePath } from "./lib/preview.ts";
+import { buildFileTree, collectFilePaths, type FileTreeNode } from "./lib/tree.ts";
+
+const ROW_PAD = 10;
+const DEPTH_STEP = 20;
+
+export type TreeAction = {
+ kind: "stage" | "unstage";
+ onRun: (paths: string[]) => void;
+ onDiscard?: (info: { name: string; paths: string[] }) => void;
+};
+
+export function FileTree({
+ files,
+ labelOf,
+ empty,
+ activePath,
+ busy,
+ action,
+ onPreview,
+}: {
+ files: FileStatus[];
+ labelOf: (file: FileStatus) => string;
+ empty: string;
+ activePath?: string | null;
+ busy?: boolean;
+ action?: TreeAction;
+ onPreview?: (path: string) => void;
+}) {
+ const tree = useMemo(() => buildFileTree(files), [files]);
+ if (files.length === 0) {
+ return event.stopPropagation()}
+ >
+
+ + 撤回更改 +
++ {summary} + 未跟踪的文件会被删除，已暂存的内容不受影响。此操作无法撤销。 +
+
+
+
+
+ {empty}
; + } + return ( +-
+ {tree.map((node) => (
+
{
+ if (event.key !== "Enter" && event.key !== " ") {
+ return;
+ }
+ event.preventDefault();
+ if (expandable) {
+ setOpen((prev) => !prev);
+ return;
+ }
+ if (previewable && file) {
+ onPreview?.(file.path);
+ }
+ }}
+ onClick={() => {
+ if (expandable) {
+ setOpen((prev) => !prev);
+ return;
+ }
+ if (previewable && file) {
+ onPreview?.(file.path);
+ }
+ }}
+ >
+ {expandable ? (
+
+ {open ?
+ {expandable && open ? (
+ -
+ {node.children.map((child) => (
+
+
+
+ {site.error ? (
+
+ );
+}
diff --git a/packages/views/git/hooks/use-git-site.ts b/packages/views/git/hooks/use-git-site.ts
new file mode 100644
index 0000000..c53b6b6
--- /dev/null
+++ b/packages/views/git/hooks/use-git-site.ts
@@ -0,0 +1,216 @@
+"use client";
+
+import type { BranchView, Commit, DiffFile, MessageDraft, PromptConfig, SiteState } from "@codedock/core/git";
+import { useCallback, useEffect, useState } from "react";
+
+import { localNameFromRemote } from "../lib/status.ts";
+import { useGit } from "../provider.tsx";
+
+const emptyState = (): SiteState => ({
+ path: "",
+ is_repo: false,
+ empty: true,
+ branch: "",
+ head: "",
+ detached: false,
+ upstream: "",
+ ahead: 0,
+ behind: 0,
+ upstream_gone: false,
+ integrating: "",
+ default_branch: "",
+ files: [],
+ remotes: [],
+});
+
+const emptyBranches = (): BranchView => ({
+ current: "",
+ locals: [],
+ remotes: [],
+ graph: { nodes: [], edges: [] },
+});
+
+const emptyDiffs = (): { staged: DiffFile[]; worktree: DiffFile[] } => ({
+ staged: [],
+ worktree: [],
+});
+
+export function useGitSite() {
+ const { client } = useGit();
+ const [state, setState] = useState仓库
+ {site.state.is_repo ? (
+ <>
+
+ {site.state.path || "—"}
+ {site.state.head ? ` · ${shortHead(site.state.head)}` : ""}
+ {site.state.upstream
+ ? ` · ${trackLabel(site.state.ahead, site.state.behind, site.state.upstream, site.state.upstream_gone)}`
+ : ""}
+ {site.state.integrating ? ` · 正在 ${site.state.integrating}` : ""}
+
+
+ ) : null}
+
+ {headerActions}
+ {onBack ? (
+
+ ) : null}
+
+
+ {site.error}
+
+ ) : null}
+
+ {site.loading ? (
+
+ 正在读取仓库…
+ ) : !site.state.is_repo ? ( ++ 当前文件夹还不是 Git 仓库。把 GIT_REPO 指到仓根后再打开。 +
+ ) : ( + <> +
+
+ {open && prompt ? (
+
+
生成说明用的提示词
+ -
+ {prompt.presets.map((preset) => {
+ const active = preset.id === selected;
+ return (
+
- + + + ); + })} +
+