tower-studio 0.1.3 → 0.1.6

package/src/components/repository/repo-sidebar.tsx

@@ -1,855 +0,0 @@
-"use client";
-
-import { useState, useEffect, useCallback, useRef } from "react";
-import {
-  ChevronDown, ChevronRight, Search, Plus,
-  GitBranch, Globe, FileText, Pencil, FolderOpen, GitCommitVertical,
-  Check, AlertCircle, Loader2, Sparkles, RefreshCw, Trash2,
-} from "lucide-react";
-import {
-  Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter,
-} from "@/components/ui/dialog";
-import { Button } from "@/components/ui/button";
-import { Input } from "@/components/ui/input";
-import { Textarea } from "@/components/ui/textarea";
-import { updateProject, createProject, deleteProject, getRecentLocalProjects, getOrCreateTowerTaskId } from "@/actions/workspace-actions";
-import { analyzeProjectDirectory } from "@/actions/project-actions";
-import { useRouter } from "next/navigation";
-import { useI18n } from "@/lib/i18n";
-import { toast } from "sonner";
-import { FolderBrowserDialog } from "@/components/layout/folder-browser-dialog";
-import { SegmentedControl } from "@/components/ui/segmented-control";
-import { CreateBranchDialog } from "./create-branch-dialog";
-import { GitLogPanel } from "./git-log-panel";
-import { GitStashPanel } from "./git-stash-panel";
-
-interface ProjectSidebarProps {
-  project: {
-    id: string;
-    name: string;
-    alias: string | null;
-    description: string | null;
-    type: string;
-    gitUrl: string | null;
-    localPath: string | null;
-    projectType?: string | null;
-  };
-  workspaceId: string;
-}
-
-interface ChangedFile {
-  file: string;
-  status: string;
-  staged: boolean;
-}
-
-interface GitInfo {
-  isGit: boolean;
-  currentBranch?: string;
-  branches?: string[];
-  remoteBranches?: string[];
-  statusSummary?: { modified: number; staged: number; untracked: number };
-  changedFiles?: ChangedFile[];
-  ahead?: number;
-  behind?: number;
-  remoteUrl?: string;
-  commits?: { hash: string; shortHash: string; message: string; author: string; date: string }[];
-  stashes?: { index: number; message: string }[];
-}
-
-export function RepoSidebar({ project, workspaceId }: ProjectSidebarProps) {
-  const { t, locale } = useI18n();
-  const router = useRouter();
-  const [gitExpanded, setGitExpanded] = useState(true);
-  const [browseExpanded, setBrowseExpanded] = useState(true);
-  const [showEditDialog, setShowEditDialog] = useState(false);
-  const [showDeleteDialog, setShowDeleteDialog] = useState(false);
-  const [deleteConfirmText, setDeleteConfirmText] = useState("");
-  const [isDeleting, setIsDeleting] = useState(false);
-  const [isOpeningStudio, setIsOpeningStudio] = useState(false);
-  const [showFolderBrowser, setShowFolderBrowser] = useState(false);
-  const [editName, setEditName] = useState(project.name);
-  const [editAlias, setEditAlias] = useState(project.alias ?? "");
-  const [editDesc, setEditDesc] = useState(project.description ?? "");
-  const [editLocalPath, setEditLocalPath] = useState(project.localPath ?? "");
-  const [editProjectType, setEditProjectType] = useState<"FRONTEND" | "BACKEND">((project.projectType as "FRONTEND" | "BACKEND") ?? "FRONTEND");
-
-  // Recent local projects
-  const [recentProjects, setRecentProjects] = useState<Array<{ id: string; name: string; alias: string | null; localPath: string | null; workspaceId: string; type: string }>>([]);
-
-  useEffect(() => {
-    getRecentLocalProjects(100).then(setRecentProjects);
-  }, []);
-
-  // Browse → Create flow
-  const [showBrowseCreate, setShowBrowseCreate] = useState(false);
-  const [browsePath, setBrowsePath] = useState("");
-  const [browseCreateName, setBrowseCreateName] = useState("");
-  const [browseCreateAlias, setBrowseCreateAlias] = useState("");
-  const [browseCreateDesc, setBrowseCreateDesc] = useState("");
-  const [browseCreateProjectType, setBrowseCreateProjectType] = useState<"FRONTEND" | "BACKEND">("FRONTEND");
-  const [browseCreateLoading, setBrowseCreateLoading] = useState(false);
-  const [isAnalyzing, setIsAnalyzing] = useState(false);
-
-  // Git state
-  const [gitInfo, setGitInfo] = useState<GitInfo | null>(null);
-  const [gitLoading, setGitLoading] = useState(false);
-  const [initLoading, setInitLoading] = useState(false);
-  const [showCreateBranch, setShowCreateBranch] = useState(false);
-
-  const showToast = (msg: string) => {
-    toast.info(msg);
-  };
-
-  // Load git info when localPath is available
-  const loadGitInfo = useCallback(async () => {
-    if (!project.localPath) return;
-    setGitLoading(true);
-    try {
-      const res = await fetch(`/api/git?path=${encodeURIComponent(project.localPath)}`);
-      if (res.ok) {
-        setGitInfo(await res.json());
-      }
-    } catch {
-      // ignore
-    } finally {
-      setGitLoading(false);
-    }
-  }, [project.localPath]);
-
-  useEffect(() => {
-    loadGitInfo();
-  }, [loadGitInfo]);
-
-  const handleInitGit = async () => {
-    if (!project.localPath) return;
-    setInitLoading(true);
-    try {
-      const res = await fetch("/api/git", {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ action: "init", path: project.localPath }),
-      });
-      if (res.ok) {
-        showToast(t("git.initSuccess"));
-        await loadGitInfo();
-      } else {
-        showToast(t("git.initFailed"));
-      }
-    } catch {
-      showToast(t("git.initFailed"));
-    } finally {
-      setInitLoading(false);
-    }
-  };
-
-  const handleSwitchBranch = async (branch: string) => {
-    if (!project.localPath) return;
-    try {
-      const res = await fetch("/api/git", {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ action: "checkout", path: project.localPath, branch }),
-      });
-      if (res.ok) {
-        showToast(`${t("git.switchSuccess")} ${branch}`);
-        await loadGitInfo();
-      } else {
-        const err = await res.json();
-        showToast(`${t("git.switchFailed")}: ${err.error}`);
-      }
-    } catch {
-      showToast(t("git.switchFailed"));
-    }
-  };
-
-  const navigateToProject = (wsId: string, projId: string) => {
-    router.push(`/workspaces/${wsId}?projectId=${projId}`, { scroll: false });
-    router.refresh();
-  };
-
-  const handleBrowseSelect = (selectedPath: string) => {
-    const existing = recentProjects.find((rp) => rp.localPath === selectedPath);
-    if (existing) {
-      navigateToProject(existing.workspaceId, existing.id);
-      return;
-    }
-    // Not found → open create dialog
-    const folderName = selectedPath.split("/").filter(Boolean).pop() ?? "";
-    setBrowsePath(selectedPath);
-    setBrowseCreateName(folderName);
-    setBrowseCreateAlias("");
-    setBrowseCreateDesc("");
-    setShowBrowseCreate(true);
-  };
-
-  const handleBrowseCreate = async () => {
-    if (!browseCreateName.trim()) return;
-    setBrowseCreateLoading(true);
-    try {
-      const newProject = await createProject({
-        name: browseCreateName.trim(),
-        alias: browseCreateAlias.trim() || undefined,
-        description: browseCreateDesc.trim() || undefined,
-        localPath: browsePath,
-        projectType: browseCreateProjectType,
-        workspaceId,
-      });
-      setShowBrowseCreate(false);
-      navigateToProject(workspaceId, newProject.id);
-    } catch (e: unknown) {
-      toast.error(e instanceof Error ? e.message : String(e));
-    } finally {
-      setBrowseCreateLoading(false);
-    }
-  };
-
-  const handleEditAnalyze = async () => {
-    if (!editLocalPath || isAnalyzing) return;
-    setIsAnalyzing(true);
-    try {
-      const result = await analyzeProjectDirectory(editLocalPath.trim(), locale);
-      setEditDesc(result);
-    } catch {
-      toast.error(t("project.analyzeError"));
-    } finally {
-      setIsAnalyzing(false);
-    }
-  };
-
-  const handleSaveProject = async () => {
-    try {
-      await updateProject(project.id, {
-        name: editName.trim(),
-        alias: editAlias.trim() || undefined,
-        description: editDesc.trim() || undefined,
-        localPath: editLocalPath.trim() || undefined,
-        projectType: editProjectType,
-      });
-      router.refresh();
-      setShowEditDialog(false);
-    } catch (e: unknown) {
-      toast.error(e instanceof Error ? e.message : String(e));
-    }
-  };
-
-  return (
-    <aside className="relative w-72 flex-shrink-0 overflow-y-auto border-l border-border bg-sidebar">
-
-      {/* ── Project Details ── */}
-      <div className="border-b border-border p-4">
-        <div className="flex items-start justify-between">
-          <div className="flex-1 min-w-0">
-            <h2 className="text-base font-semibold text-foreground">{project.name}</h2>
-            {project.alias && (
-              <p className="mt-0.5 text-xs text-muted-foreground">{project.alias}</p>
-            )}
-          </div>
-          <div className="flex items-center gap-0.5">
-            <Button
-              variant="ghost"
-              size="icon-sm"
-              onClick={() => {
-                setEditName(project.name);
-                setEditAlias(project.alias ?? "");
-                setEditDesc(project.description ?? "");
-                setEditLocalPath(project.localPath ?? "");
-                setShowEditDialog(true);
-              }}
-              className="text-muted-foreground"
-            >
-              <Pencil className="h-3.5 w-3.5" />
-            </Button>
-            <Button
-              variant="ghost"
-              size="icon-sm"
-              onClick={() => {
-                setDeleteConfirmText("");
-                setShowDeleteDialog(true);
-              }}
-              className="text-muted-foreground hover:text-rose-400"
-            >
-              <Trash2 className="h-3.5 w-3.5" />
-            </Button>
-          </div>
-        </div>
-        {project.description && (
-          <p className="mt-2 text-sm text-secondary-foreground leading-relaxed line-clamp-4">{project.description}</p>
-        )}
-        <div className="mt-3 flex flex-wrap items-center gap-2">
-          <span className={`inline-flex items-center gap-1 rounded-md px-2 py-0.5 text-[11px] font-medium ${
-            project.type === "GIT"
-              ? "bg-sky-500/15 text-sky-300 ring-1 ring-sky-500/20"
-              : "bg-muted text-muted-foreground ring-1 ring-border"
-          }`}>
-            {project.type === "GIT" ? (
-              <><GitBranch className="h-3 w-3" />{t("sidebar.right.gitType")}</>
-            ) : (
-              <><FileText className="h-3 w-3" />{t("sidebar.right.normalType")}</>
-            )}
-          </span>
-        </div>
-        {project.localPath && (
-          <div className="mt-3 flex items-start gap-2 rounded-md bg-muted/50 px-2.5 py-2 text-xs">
-            <FolderOpen className="mt-0.5 h-3 w-3 shrink-0 text-muted-foreground" />
-            <span className="break-all font-mono text-secondary-foreground">{project.localPath}</span>
-          </div>
-        )}
-        {project.gitUrl && (
-          <div className="mt-2 flex items-start gap-2 rounded-md bg-muted/50 px-2.5 py-2 text-xs">
-            <Globe className="mt-0.5 h-3 w-3 shrink-0 text-muted-foreground" />
-            <span className="break-all text-secondary-foreground">{project.gitUrl}</span>
-          </div>
-        )}
-        {project.localPath && (
-          <Button
-            variant="outline"
-            className="mt-3 w-full h-8 gap-1.5 text-xs"
-            disabled={isOpeningStudio}
-            onClick={async () => {
-              setIsOpeningStudio(true);
-              try {
-                const taskId = await getOrCreateTowerTaskId(project.id);
-                router.push(`/workspaces/${workspaceId}/tasks/${taskId}`);
-              } catch {
-                toast.error(t("git.openStudioFailed"));
-              } finally {
-                setIsOpeningStudio(false);
-              }
-            }}
-          >
-            {isOpeningStudio ? <Loader2 className="h-3.5 w-3.5 animate-spin" /> : <FolderOpen className="h-3.5 w-3.5" />}
-            {t("git.openStudio")}
-          </Button>
-        )}
-      </div>
-
-      {/* ── Git Section ── */}
-      <div className="border-b border-border p-4">
-        <Button
-          variant="ghost"
-          onClick={() => setGitExpanded(!gitExpanded)}
-          className="flex w-full cursor-pointer justify-between px-2 py-2"
-        >
-          <span className="text-[11px] font-semibold uppercase tracking-wider text-muted-foreground">{t("git.section")}</span>
-          {gitExpanded ? <ChevronDown className="h-3.5 w-3.5 text-muted-foreground" /> : <ChevronRight className="h-3.5 w-3.5 text-muted-foreground" />}
-        </Button>
-
-        {gitExpanded && (
-          <div className="mt-3">
-            {!project.localPath ? (
-              /* No local path set */
-              <div className="rounded-lg border border-border bg-muted/50 p-3">
-                <div className="flex items-center gap-2 text-muted-foreground">
-                  <AlertCircle className="h-3.5 w-3.5" />
-                  <p className="text-xs">{t("git.noLocalPath")}</p>
-                </div>
-              </div>
-            ) : gitLoading ? (
-              <div className="flex items-center justify-center py-4 text-muted-foreground">
-                <Loader2 className="h-4 w-4 animate-spin" />
-                <span className="ml-2 text-xs">{t("git.loading")}</span>
-              </div>
-            ) : gitInfo && !gitInfo.isGit ? (
-              /* Not a git repo — offer init */
-              <div className="rounded-lg border border-border bg-muted/50 p-3">
-                <div className="flex items-center gap-2 text-muted-foreground">
-                  <AlertCircle className="h-3.5 w-3.5" />
-                  <p className="text-xs">{t("git.notInitialized")}</p>
-                </div>
-                <Button
-                 
-                  className="mt-3 h-7 w-full gap-1.5 bg-primary/10 text-xs text-primary ring-1 ring-primary/20 hover:bg-primary/15"
-                  onClick={handleInitGit}
-                  disabled={initLoading}
-                >
-                  {initLoading ? <Loader2 className="h-3 w-3 animate-spin" /> : <GitCommitVertical className="h-3 w-3" />}
-                  {t("git.initRepo")}
-                </Button>
-              </div>
-            ) : gitInfo?.isGit ? (
-              /* Git repo — show current branch + dropdown selectors */
-              <div className="space-y-3">
-                {/* Current branch + actions + branch selector */}
-                <UnifiedBranchDropdown
-                  localBranches={gitInfo.branches ?? []}
-                  remoteBranches={(gitInfo.remoteBranches ?? []).filter((b) => !gitInfo.branches?.includes(b))}
-                  currentBranch={gitInfo.currentBranch ?? ""}
-                  onSwitch={handleSwitchBranch}
-                  onFetch={async () => {
-                    if (!project.localPath) return;
-                    await fetch("/api/git", {
-                      method: "POST",
-                      headers: { "Content-Type": "application/json" },
-                      body: JSON.stringify({ action: "fetch", path: project.localPath }),
-                    });
-                    await loadGitInfo();
-                  }}
-                  onCreateBranch={() => setShowCreateBranch(true)}
-                />
-
-                {/* Commit log */}
-                <GitLogPanel commits={gitInfo.commits ?? []} />
-
-                {/* Stash */}
-                <GitStashPanel
-                  localPath={project.localPath!}
-                  stashes={gitInfo.stashes ?? []}
-                  hasChanges={(gitInfo.changedFiles ?? []).length > 0}
-                  onRefresh={loadGitInfo}
-                />
-              </div>
-            ) : null}
-          </div>
-        )}
-      </div>
-
-      {/* ── Browse Local ── */}
-      <div className="p-4">
-        <Button
-          variant="ghost"
-          onClick={() => setBrowseExpanded(!browseExpanded)}
-          className="flex w-full cursor-pointer justify-between px-2 py-2"
-        >
-          <span className="text-[11px] font-semibold uppercase tracking-wider text-muted-foreground">{t("sidebar.right.browseRepo")}</span>
-          {browseExpanded ? <ChevronDown className="h-3.5 w-3.5 text-muted-foreground" /> : <ChevronRight className="h-3.5 w-3.5 text-muted-foreground" />}
-        </Button>
-        {browseExpanded && (
-          <div className="mt-3 space-y-3">
-            <Button
-              variant="outline"
-             
-              className="w-full h-8 gap-1.5 text-xs"
-              onClick={() => setShowFolderBrowser(true)}
-            >
-              <FolderOpen className="h-3.5 w-3.5" />
-              {t("sidebar.right.browseRepo")}
-            </Button>
-
-            {/* Recent local projects */}
-            {recentProjects.length > 0 && (
-              <div>
-                <p className="text-[10px] font-semibold uppercase tracking-wider text-muted-foreground mb-1.5 px-1">{t("sidebar.right.recent")}</p>
-                <div className="space-y-0.5">
-                  {recentProjects.map((rp) => (
-                    <button
-                      key={rp.id}
-                      onClick={() => { if (rp.id !== project.id) navigateToProject(rp.workspaceId, rp.id); }}
-                      className={`flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left transition-colors ${
-                        rp.id === project.id ? "bg-primary/10 text-primary cursor-default" : "hover:bg-accent cursor-pointer"
-                      }`}
-                    >
-                      {rp.type === "GIT" ? (
-                        <GitBranch className="h-3 w-3 shrink-0 text-emerald-400" />
-                      ) : (
-                        <FolderOpen className="h-3 w-3 shrink-0 text-primary/70" />
-                      )}
-                      <div className="min-w-0 flex-1">
-                        <p className="truncate text-xs font-medium text-foreground">{rp.name}</p>
-                        {rp.localPath && (
-                          <p className="truncate text-[10px] font-mono text-muted-foreground">{rp.localPath}</p>
-                        )}
-                      </div>
-                    </button>
-                  ))}
-                </div>
-              </div>
-            )}
-          </div>
-        )}
-      </div>
-
-      {/* ── Edit Project Dialog ── */}
-      <Dialog open={showEditDialog} onOpenChange={setShowEditDialog}>
-        <DialogContent style={{ maxWidth: "32rem" }}>
-          <DialogHeader>
-            <DialogTitle>{t("project.edit")}</DialogTitle>
-          </DialogHeader>
-          <div className="space-y-3 py-2">
-            <div>
-              <label className="text-xs font-medium text-muted-foreground">{t("project.name")}</label>
-              <Input value={editName} onChange={(e) => setEditName(e.target.value)} className="mt-1.5" />
-            </div>
-            <div>
-              <label className="text-xs font-medium text-muted-foreground">{t("project.type.label")}</label>
-              <div className="mt-1.5">
-                <SegmentedControl
-                  options={[
-                    { value: "FRONTEND" as const, label: t("project.type.frontend") },
-                    { value: "BACKEND" as const, label: t("project.type.backend") },
-                  ]}
-                  value={editProjectType}
-                  onChange={setEditProjectType}
-                />
-              </div>
-            </div>
-            <div>
-              <label className="text-xs font-medium text-muted-foreground">{t("project.alias")}</label>
-              <Input value={editAlias} onChange={(e) => setEditAlias(e.target.value)} className="mt-1.5" />
-            </div>
-            <div>
-              <div className="flex items-center justify-between">
-                <label className="text-xs font-medium text-muted-foreground">{t("project.description")}</label>
-                <Button
-                  type="button"
-                  variant="ghost"
-                  onClick={handleEditAnalyze}
-                  className={`h-6 gap-1 px-2 text-[11px] text-muted-foreground hover:text-foreground ${!editLocalPath || isAnalyzing ? "opacity-50" : ""}`}
-                >
-                  {isAnalyzing ? (
-                    <Loader2 className="h-3 w-3 animate-spin" />
-                  ) : (
-                    <Sparkles className="h-3 w-3" />
-                  )}
-                  {isAnalyzing ? t("project.analyzing") : t("project.genDesc")}
-                </Button>
-              </div>
-              <Textarea
-                value={editDesc}
-                onChange={(e) => setEditDesc(e.target.value)}
-                rows={2}
-                className="mt-1.5 w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground placeholder-muted-foreground outline-none transition-colors focus:border-ring focus:ring-1 focus:ring-ring resize-none max-h-[200px] overflow-y-auto"
-              />
-            </div>
-            <div>
-              <label className="text-xs font-medium text-muted-foreground">{t("project.localPath")}</label>
-              <div className="mt-1.5 flex gap-2">
-                <Input
-                  value={editLocalPath}
-                  onChange={(e) => setEditLocalPath(e.target.value)}
-                  placeholder={t("project.localPathPlaceholder")}
-                  className="flex-1 font-mono text-xs"
-                />
-                <Button variant="outline" onClick={() => setShowFolderBrowser(true)} className="h-8 shrink-0">
-                  {t("folder.browse")}
-                </Button>
-              </div>
-            </div>
-          </div>
-          <DialogFooter>
-            <Button variant="outline" onClick={() => setShowEditDialog(false)}>{t("common.cancel")}</Button>
-            <Button
-              onClick={handleSaveProject}
-              disabled={!editName.trim() || isAnalyzing}
-              className="bg-primary/10 text-primary ring-1 ring-primary/20 hover:bg-primary/15"
-            >
-              {t("common.save")}
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
-
-      {/* Folder Browser */}
-      <FolderBrowserDialog
-        open={showFolderBrowser}
-        onOpenChange={setShowFolderBrowser}
-        onSelect={(path) => {
-          if (showEditDialog) {
-            setEditLocalPath(path);
-          } else {
-            handleBrowseSelect(path);
-          }
-        }}
-      />
-
-      {/* Browse → Create Project Dialog */}
-      <Dialog open={showBrowseCreate} onOpenChange={setShowBrowseCreate}>
-        <DialogContent className="sm:max-w-md">
-          <DialogHeader>
-            <DialogTitle>{t("topbar.newProject")}</DialogTitle>
-          </DialogHeader>
-          <div className="space-y-3 py-2">
-            {/* Locked path */}
-            <div>
-              <label className="text-xs font-medium text-muted-foreground">{t("project.localPath")}</label>
-              <div className="mt-1.5 rounded-md border border-border bg-muted/50 px-3 py-2 font-mono text-xs text-muted-foreground">
-                {browsePath}
-              </div>
-            </div>
-            <div>
-              <label className="text-xs font-medium text-muted-foreground">{t("project.name")}</label>
-              <Input
-                value={browseCreateName}
-                onChange={(e) => setBrowseCreateName(e.target.value)}
-                placeholder={t("project.namePlaceholder")}
-                className="mt-1.5"
-              />
-            </div>
-            <div>
-              <label className="text-xs font-medium text-muted-foreground">{t("project.type.label")}</label>
-              <div className="mt-1.5">
-                <SegmentedControl
-                  options={[
-                    { value: "FRONTEND" as const, label: t("project.type.frontend") },
-                    { value: "BACKEND" as const, label: t("project.type.backend") },
-                  ]}
-                  value={browseCreateProjectType}
-                  onChange={setBrowseCreateProjectType}
-                />
-              </div>
-            </div>
-            <div>
-              <label className="text-xs font-medium text-muted-foreground">{t("project.alias")}</label>
-              <Input
-                value={browseCreateAlias}
-                onChange={(e) => setBrowseCreateAlias(e.target.value)}
-                placeholder={t("project.aliasPlaceholder")}
-                className="mt-1.5"
-              />
-            </div>
-            <div>
-              <label className="text-xs font-medium text-muted-foreground">{t("project.description")}</label>
-              <Textarea
-                value={browseCreateDesc}
-                onChange={(e) => setBrowseCreateDesc(e.target.value)}
-                placeholder={t("project.descPlaceholder")}
-                rows={2}
-                className="mt-1.5 w-full rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground placeholder-muted-foreground outline-none transition-colors focus:border-ring focus:ring-1 focus:ring-ring resize-none"
-              />
-            </div>
-          </div>
-          <DialogFooter>
-            <Button variant="outline" onClick={() => setShowBrowseCreate(false)}>{t("common.cancel")}</Button>
-            <Button
-              onClick={handleBrowseCreate}
-              disabled={!browseCreateName.trim() || browseCreateLoading}
-              className="bg-primary/10 text-primary ring-1 ring-primary/20 hover:bg-primary/15"
-            >
-              {browseCreateLoading ? <Loader2 className="h-3 w-3 animate-spin mr-1" /> : null}
-              {t("common.create")}
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
-
-      {/* Create Branch Dialog */}
-      {gitInfo?.isGit && (
-        <CreateBranchDialog
-          open={showCreateBranch}
-          onOpenChange={setShowCreateBranch}
-          branches={gitInfo.branches ?? []}
-          currentBranch={gitInfo.currentBranch ?? ""}
-          localPath={project.localPath!}
-          onCreated={async () => {
-            await loadGitInfo();
-            showToast(t("git.createSuccess"));
-          }}
-          onError={(msg) => showToast(`${t("git.createFailed")}: ${msg}`)}
-        />
-      )}
-
-      {/* Delete Project Confirmation Dialog */}
-      <Dialog open={showDeleteDialog} onOpenChange={(open) => {
-        setShowDeleteDialog(open);
-        if (!open) setDeleteConfirmText("");
-      }}>
-        <DialogContent className="sm:max-w-md">
-          <DialogHeader>
-            <DialogTitle className="text-rose-400">{t("project.deleteTitle")}</DialogTitle>
-          </DialogHeader>
-          <div className="space-y-3 py-2">
-            <p className="text-sm text-muted-foreground">
-              {t("project.deleteWarning", { name: project.name })}
-            </p>
-            <p className="text-sm text-muted-foreground">
-              {t("project.deleteIrreversible")}
-            </p>
-            <div>
-              <label className="text-xs font-medium text-muted-foreground">
-                {t("project.deleteConfirmLabel")}
-              </label>
-              <Input
-                value={deleteConfirmText}
-                onChange={(e) => setDeleteConfirmText(e.target.value)}
-                placeholder={t("project.deleteConfirmPlaceholder")}
-                className="mt-1.5"
-                autoFocus
-              />
-            </div>
-          </div>
-          <DialogFooter>
-            <Button variant="outline" onClick={() => setShowDeleteDialog(false)}>
-              {t("common.cancel")}
-            </Button>
-            <Button
-              variant="destructive"
-              disabled={deleteConfirmText !== t("project.deleteConfirmText") || isDeleting}
-              onClick={async () => {
-                setIsDeleting(true);
-                try {
-                  await deleteProject(project.id);
-                  toast.success(t("project.deleteSuccess"));
-                  router.push(`/workspaces/${workspaceId}`);
-                } catch {
-                  toast.error(t("project.deleteFailed"));
-                } finally {
-                  setIsDeleting(false);
-                  setShowDeleteDialog(false);
-                }
-              }}
-            >
-              {isDeleting && <Loader2 className="h-3 w-3 animate-spin mr-1" />}
-              {t("project.deleteButton")}
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
-    </aside>
-  );
-}
-
-// ── Unified Branch Dropdown with Local/Remote groups + Fetch ──
-function UnifiedBranchDropdown({
-  localBranches,
-  remoteBranches,
-  currentBranch,
-  onSwitch,
-  onFetch,
-  onCreateBranch,
-}: {
-  localBranches: string[];
-  remoteBranches: string[];
-  currentBranch: string;
-  onSwitch: (branch: string) => void;
-  onFetch: () => Promise<void>;
-  onCreateBranch: () => void;
-}) {
-  const { t } = useI18n();
-  const [open, setOpen] = useState(false);
-  const [filter, setFilter] = useState("");
-  const [fetching, setFetching] = useState(false);
-  const dropdownRef = useRef<HTMLDivElement>(null);
-
-  useEffect(() => {
-    if (!open) return;
-    function handleClick(e: MouseEvent) {
-      if (dropdownRef.current && !dropdownRef.current.contains(e.target as Node)) {
-        setOpen(false);
-      }
-    }
-    document.addEventListener("mousedown", handleClick);
-    return () => document.removeEventListener("mousedown", handleClick);
-  }, [open]);
-
-  const lc = filter.toLowerCase();
-  const filteredLocal = localBranches.filter((b) => b.toLowerCase().includes(lc));
-  const filteredRemote = remoteBranches.filter((b) => b.toLowerCase().includes(lc));
-  const hasResults = filteredLocal.length > 0 || filteredRemote.length > 0;
-
-  const handleFetch = async () => {
-    setFetching(true);
-    try {
-      await onFetch();
-    } finally {
-      setFetching(false);
-    }
-  };
-
-  return (
-    <div>
-      <div className="flex items-center justify-between mb-1.5">
-        <p className="text-[10px] font-semibold uppercase tracking-wider text-muted-foreground">{t("git.currentBranch")}</p>
-        <div className="flex items-center gap-0.5">
-          <Button
-            variant="ghost"
-            size="icon-xs"
-            onClick={handleFetch}
-            disabled={fetching}
-            className="text-muted-foreground"
-            aria-label="Fetch"
-          >
-            <RefreshCw className={`h-3 w-3 ${fetching ? "animate-spin" : ""}`} />
-          </Button>
-          <Button
-            variant="ghost"
-            size="icon-xs"
-            onClick={onCreateBranch}
-            className="text-muted-foreground"
-            aria-label={t("git.createBranch")}
-          >
-            <Plus className="h-3 w-3" />
-          </Button>
-        </div>
-      </div>
-      {/* Branch dropdown */}
-      <div className="relative" ref={dropdownRef}>
-        <button
-          onClick={() => { setOpen(!open); setFilter(""); }}
-          className="flex w-full items-center justify-between rounded-lg border border-border bg-muted/50 px-3 py-2 text-left transition-colors hover:bg-accent"
-        >
-          <div className="flex items-center gap-2 min-w-0">
-            <GitBranch className="h-3 w-3 shrink-0 text-emerald-400" />
-            <span className="truncate font-mono text-xs text-foreground">{currentBranch || "—"}</span>
-          </div>
-          <ChevronDown className={`h-3 w-3 shrink-0 text-muted-foreground transition-transform ${open ? "rotate-180" : ""}`} />
-        </button>
-
-        {open && (
-          <div className="absolute left-0 right-0 top-full z-20 mt-1 rounded-lg border border-border bg-popover shadow-xl">
-            {/* Search */}
-            <div className="border-b border-border p-1.5">
-              <div className="relative">
-                <Search className="absolute left-2 top-1/2 -translate-y-1/2 h-3 w-3 text-muted-foreground" />
-                <input
-                  value={filter}
-                  onChange={(e) => setFilter(e.target.value)}
-                  placeholder="Filter..."
-                  autoFocus
-                  className="h-7 w-full rounded-md bg-muted/50 pl-7 pr-2 text-xs text-foreground placeholder-muted-foreground outline-none focus:ring-1 focus:ring-ring"
-                />
-              </div>
-            </div>
-            <div className="max-h-60 overflow-auto py-1">
-              {!hasResults && (
-                <p className="px-3 py-2 text-xs text-muted-foreground">No branches found</p>
-              )}
-              {/* Local branches group */}
-              {filteredLocal.length > 0 && (
-                <>
-                  <p className="px-3 pt-1.5 pb-1 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground">
-                    {t("git.localBranches")}
-                  </p>
-                  {filteredLocal.map((b) => {
-                    const isActive = b === currentBranch;
-                    return (
-                      <button
-                        key={`local-${b}`}
-                        onClick={() => { if (!isActive) onSwitch(b); setOpen(false); }}
-                        className={`flex w-full items-center gap-2 px-3 py-1.5 text-left transition-colors ${
-                          isActive ? "bg-emerald-500/10 text-emerald-400" : "text-secondary-foreground hover:bg-accent"
-                        }`}
-                      >
-                        <GitBranch className="h-3 w-3 shrink-0" />
-                        <span className="truncate font-mono text-xs">{b}</span>
-                        {isActive && <Check className="h-3 w-3 ml-auto shrink-0" />}
-                      </button>
-                    );
-                  })}
-                </>
-              )}
-              {/* Remote branches group */}
-              {filteredRemote.length > 0 && (
-                <>
-                  <p className="px-3 pt-2.5 pb-1 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground">
-                    {t("git.remoteBranches")}
-                  </p>
-                  {filteredRemote.map((b) => (
-                    <button
-                      key={`remote-${b}`}
-                      onClick={() => { onSwitch(b); setOpen(false); }}
-                      className="flex w-full items-center gap-2 px-3 py-1.5 text-left text-secondary-foreground transition-colors hover:bg-accent"
-                    >
-                      <Globe className="h-3 w-3 shrink-0 text-sky-400" />
-                      <span className="truncate font-mono text-xs">{b}</span>
-                    </button>
-                  ))}
-                </>
-              )}
-            </div>
-          </div>
-        )}
-      </div>
-    </div>
-  );
-}
-