594 lines
22 KiB
TypeScript
594 lines
22 KiB
TypeScript
|
/**
|
|||
|
|
* Agent 审计任务创建对话框
|
|||
|
|
* 专门用于 Agent Audit 页面，UI 风格与终端界面保持一致
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
import { useState, useEffect, useMemo } from "react";
|
|||
|
|
import { useNavigate } from "react-router-dom";
|
|||
|
|
import {
|
|||
|
|
Dialog,
|
|||
|
|
DialogContent,
|
|||
|
|
DialogHeader,
|
|||
|
|
DialogTitle,
|
|||
|
|
} from "@/components/ui/dialog";
|
|||
|
|
import { Button } from "@/components/ui/button";
|
|||
|
|
import { Input } from "@/components/ui/input";
|
|||
|
|
import { Badge } from "@/components/ui/badge";
|
|||
|
|
import { ScrollArea } from "@/components/ui/scroll-area";
|
|||
|
|
import {
|
|||
|
|
Collapsible,
|
|||
|
|
CollapsibleContent,
|
|||
|
|
CollapsibleTrigger,
|
|||
|
|
} from "@/components/ui/collapsible";
|
|||
|
|
import {
|
|||
|
|
Select,
|
|||
|
|
SelectContent,
|
|||
|
|
SelectItem,
|
|||
|
|
SelectTrigger,
|
|||
|
|
SelectValue,
|
|||
|
|
} from "@/components/ui/select";
|
|||
|
|
import {
|
|||
|
|
Search,
|
|||
|
|
ChevronRight,
|
|||
|
|
GitBranch,
|
|||
|
|
Package,
|
|||
|
|
Globe,
|
|||
|
|
Loader2,
|
|||
|
|
Bot,
|
|||
|
|
Settings2,
|
|||
|
|
Play,
|
|||
|
|
Upload,
|
|||
|
|
FolderOpen,
|
|||
|
|
} from "lucide-react";
|
|||
|
|
import { toast } from "sonner";
|
|||
|
|
import { api } from "@/shared/config/database";
|
|||
|
|
import { createAgentTask } from "@/shared/api/agentTasks";
|
|||
|
|
import { isRepositoryProject, isZipProject } from "@/shared/utils/projectUtils";
|
|||
|
|
import { getZipFileInfo, type ZipFileMeta } from "@/shared/utils/zipStorage";
|
|||
|
|
import { validateZipFile } from "@/features/projects/services/repoZipScan";
|
|||
|
|
import type { Project } from "@/shared/types";
|
|||
|
|
import FileSelectionDialog from "@/components/audit/FileSelectionDialog";
|
|||
|
|
|
|||
|
|
interface CreateAgentTaskDialogProps {
|
|||
|
|
open: boolean;
|
|||
|
|
onOpenChange: (open: boolean) => void;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const DEFAULT_EXCLUDES = [
|
|||
|
|
"node_modules/**",
|
|||
|
|
".git/**",
|
|||
|
|
"dist/**",
|
|||
|
|
"build/**",
|
|||
|
|
"*.log",
|
|||
|
|
];
|
|||
|
|
|
|||
|
|
export default function CreateAgentTaskDialog({
|
|||
|
|
open,
|
|||
|
|
onOpenChange,
|
|||
|
|
}: CreateAgentTaskDialogProps) {
|
|||
|
|
const navigate = useNavigate();
|
|||
|
|
|
|||
|
|
// 状态
|
|||
|
|
const [projects, setProjects] = useState<Project[]>([]);
|
|||
|
|
const [loadingProjects, setLoadingProjects] = useState(true);
|
|||
|
|
const [selectedProjectId, setSelectedProjectId] = useState<string>("");
|
|||
|
|
const [searchTerm, setSearchTerm] = useState("");
|
|||
|
|
const [branch, setBranch] = useState("main");
|
|||
|
|
const [branches, setBranches] = useState<string[]>([]);
|
|||
|
|
const [loadingBranches, setLoadingBranches] = useState(false);
|
|||
|
|
const [excludePatterns, setExcludePatterns] = useState(DEFAULT_EXCLUDES);
|
|||
|
|
const [showAdvanced, setShowAdvanced] = useState(false);
|
|||
|
|
const [creating, setCreating] = useState(false);
|
|||
|
|
|
|||
|
|
// ZIP 文件状态
|
|||
|
|
const [zipFile, setZipFile] = useState<File | null>(null);
|
|||
|
|
const [storedZipInfo, setStoredZipInfo] = useState<ZipFileMeta | null>(null);
|
|||
|
|
const [useStoredZip, setUseStoredZip] = useState(true);
|
|||
|
|
|
|||
|
|
// 文件选择状态
|
|||
|
|
const [selectedFiles, setSelectedFiles] = useState<string[] | undefined>();
|
|||
|
|
const [showFileSelection, setShowFileSelection] = useState(false);
|
|||
|
|
|
|||
|
|
const selectedProject = projects.find((p) => p.id === selectedProjectId);
|
|||
|
|
|
|||
|
|
// 加载项目列表
|
|||
|
|
useEffect(() => {
|
|||
|
|
if (open) {
|
|||
|
|
setLoadingProjects(true);
|
|||
|
|
api.getProjects()
|
|||
|
|
.then((data) => {
|
|||
|
|
setProjects(data.filter((p: Project) => p.is_active));
|
|||
|
|
})
|
|||
|
|
.catch(() => {
|
|||
|
|
toast.error("加载项目列表失败");
|
|||
|
|
})
|
|||
|
|
.finally(() => setLoadingProjects(false));
|
|||
|
|
|
|||
|
|
// 重置状态
|
|||
|
|
setSelectedProjectId("");
|
|||
|
|
setSearchTerm("");
|
|||
|
|
setBranch("main");
|
|||
|
|
setExcludePatterns(DEFAULT_EXCLUDES);
|
|||
|
|
setShowAdvanced(false);
|
|||
|
|
setZipFile(null);
|
|||
|
|
setStoredZipInfo(null);
|
|||
|
|
setSelectedFiles(undefined);
|
|||
|
|
}
|
|||
|
|
}, [open]);
|
|||
|
|
|
|||
|
|
// 加载分支列表
|
|||
|
|
useEffect(() => {
|
|||
|
|
const loadBranches = async () => {
|
|||
|
|
// 使用 selectedProjectId 从 projects 中获取最新的 project 对象
|
|||
|
|
const project = projects.find((p) => p.id === selectedProjectId);
|
|||
|
|
if (!project || !isRepositoryProject(project)) {
|
|||
|
|
setBranches([]);
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
setLoadingBranches(true);
|
|||
|
|
try {
|
|||
|
|
const result = await api.getProjectBranches(project.id);
|
|||
|
|
console.log("[Branch] 加载分支结果:", result);
|
|||
|
|
|
|||
|
|
if (result.error) {
|
|||
|
|
console.warn("[Branch] 加载分支警告:", result.error);
|
|||
|
|
toast.error(`加载分支失败: ${result.error}`);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
setBranches(result.branches);
|
|||
|
|
if (result.default_branch) {
|
|||
|
|
setBranch(result.default_branch);
|
|||
|
|
}
|
|||
|
|
} catch (err) {
|
|||
|
|
const msg = err instanceof Error ? err.message : "未知错误";
|
|||
|
|
console.error("[Branch] 加载分支失败:", msg);
|
|||
|
|
toast.error(`加载分支失败: ${msg}`);
|
|||
|
|
setBranches([project.default_branch || "main"]);
|
|||
|
|
} finally {
|
|||
|
|
setLoadingBranches(false);
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
loadBranches();
|
|||
|
|
}, [selectedProjectId, projects]);
|
|||
|
|
|
|||
|
|
// 加载 ZIP 文件信息
|
|||
|
|
useEffect(() => {
|
|||
|
|
const loadZipInfo = async () => {
|
|||
|
|
if (!selectedProject || !isZipProject(selectedProject)) {
|
|||
|
|
setStoredZipInfo(null);
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
try {
|
|||
|
|
const info = await getZipFileInfo(selectedProject.id);
|
|||
|
|
setStoredZipInfo(info);
|
|||
|
|
setUseStoredZip(info.has_file);
|
|||
|
|
} catch {
|
|||
|
|
setStoredZipInfo(null);
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
loadZipInfo();
|
|||
|
|
}, [selectedProject?.id]);
|
|||
|
|
|
|||
|
|
// 过滤项目
|
|||
|
|
const filteredProjects = useMemo(() => {
|
|||
|
|
if (!searchTerm) return projects;
|
|||
|
|
const term = searchTerm.toLowerCase();
|
|||
|
|
return projects.filter(
|
|||
|
|
(p) =>
|
|||
|
|
p.name.toLowerCase().includes(term) ||
|
|||
|
|
p.description?.toLowerCase().includes(term)
|
|||
|
|
);
|
|||
|
|
}, [projects, searchTerm]);
|
|||
|
|
|
|||
|
|
// 是否可以开始
|
|||
|
|
const canStart = useMemo(() => {
|
|||
|
|
if (!selectedProject) return false;
|
|||
|
|
if (isZipProject(selectedProject)) {
|
|||
|
|
return (useStoredZip && storedZipInfo?.has_file) || !!zipFile;
|
|||
|
|
}
|
|||
|
|
return !!selectedProject.repository_url && !!branch.trim();
|
|||
|
|
}, [selectedProject, useStoredZip, storedZipInfo, zipFile, branch]);
|
|||
|
|
|
|||
|
|
// 创建任务
|
|||
|
|
const handleCreate = async () => {
|
|||
|
|
if (!selectedProject) return;
|
|||
|
|
|
|||
|
|
setCreating(true);
|
|||
|
|
try {
|
|||
|
|
const agentTask = await createAgentTask({
|
|||
|
|
project_id: selectedProject.id,
|
|||
|
|
name: `Agent审计-${selectedProject.name}`,
|
|||
|
|
branch_name: isRepositoryProject(selectedProject) ? branch : undefined,
|
|||
|
|
exclude_patterns: excludePatterns,
|
|||
|
|
target_files: selectedFiles,
|
|||
|
|
verification_level: "sandbox",
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
onOpenChange(false);
|
|||
|
|
toast.success("Agent 审计任务已创建");
|
|||
|
|
navigate(`/agent-audit/${agentTask.id}`);
|
|||
|
|
} catch (err) {
|
|||
|
|
const msg = err instanceof Error ? err.message : "创建失败";
|
|||
|
|
toast.error(msg);
|
|||
|
|
} finally {
|
|||
|
|
setCreating(false);
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
// 处理文件上传
|
|||
|
|
const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
|||
|
|
const file = e.target.files?.[0];
|
|||
|
|
if (file) {
|
|||
|
|
const validation = validateZipFile(file);
|
|||
|
|
if (!validation.valid) {
|
|||
|
|
toast.error(validation.error || "文件无效");
|
|||
|
|
e.target.value = "";
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
setZipFile(file);
|
|||
|
|
setUseStoredZip(false);
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<Dialog open={open} onOpenChange={onOpenChange}>
|
|||
|
|
<DialogContent className="!w-[min(90vw,480px)] !max-w-none max-h-[85vh] flex flex-col p-0 gap-0 bg-[#0d0d12] border border-gray-800 rounded-lg">
|
|||
|
|
{/* Header */}
|
|||
|
|
<DialogHeader className="px-5 py-4 border-b border-gray-800 flex-shrink-0">
|
|||
|
|
<DialogTitle className="flex items-center gap-3 font-mono text-white">
|
|||
|
|
<div className="p-2 bg-primary/20 rounded">
|
|||
|
|
<Bot className="w-5 h-5 text-primary" />
|
|||
|
|
</div>
|
|||
|
|
<div>
|
|||
|
|
<span className="text-base font-bold">New Agent Audit</span>
|
|||
|
|
<p className="text-xs text-gray-500 font-normal mt-0.5">
|
|||
|
|
AI-Powered Security Analysis
|
|||
|
|
</p>
|
|||
|
|
</div>
|
|||
|
|
</DialogTitle>
|
|||
|
|
</DialogHeader>
|
|||
|
|
|
|||
|
|
<div className="flex-1 overflow-y-auto p-5 space-y-5">
|
|||
|
|
{/* 项目选择 */}
|
|||
|
|
<div className="space-y-3">
|
|||
|
|
<div className="flex items-center justify-between">
|
|||
|
|
<span className="text-xs font-mono font-bold uppercase text-gray-400">
|
|||
|
|
Select Project
|
|||
|
|
</span>
|
|||
|
|
<Badge variant="outline" className="border-gray-700 text-gray-500 font-mono text-[10px]">
|
|||
|
|
{filteredProjects.length} available
|
|||
|
|
</Badge>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
{/* 搜索框 */}
|
|||
|
|
<div className="relative">
|
|||
|
|
<Search className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-600" />
|
|||
|
|
<Input
|
|||
|
|
placeholder="Search projects..."
|
|||
|
|
value={searchTerm}
|
|||
|
|
onChange={(e) => setSearchTerm(e.target.value)}
|
|||
|
|
className="pl-9 h-10 bg-gray-900/50 border-gray-800 text-white font-mono placeholder:text-gray-600 focus:border-primary focus:ring-0"
|
|||
|
|
/>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
{/* 项目列表 */}
|
|||
|
|
<ScrollArea className="h-[200px] border border-gray-800 rounded-lg bg-gray-900/30">
|
|||
|
|
{loadingProjects ? (
|
|||
|
|
<div className="flex items-center justify-center h-full">
|
|||
|
|
<Loader2 className="w-5 h-5 animate-spin text-primary" />
|
|||
|
|
</div>
|
|||
|
|
) : filteredProjects.length === 0 ? (
|
|||
|
|
<div className="flex flex-col items-center justify-center h-full text-gray-600 font-mono">
|
|||
|
|
<Package className="w-8 h-8 mb-2 opacity-50" />
|
|||
|
|
<span className="text-sm">{searchTerm ? "No matches" : "No projects"}</span>
|
|||
|
|
</div>
|
|||
|
|
) : (
|
|||
|
|
<div className="p-1">
|
|||
|
|
{filteredProjects.map((project) => (
|
|||
|
|
<ProjectItem
|
|||
|
|
key={project.id}
|
|||
|
|
project={project}
|
|||
|
|
selected={selectedProjectId === project.id}
|
|||
|
|
onSelect={() => setSelectedProjectId(project.id)}
|
|||
|
|
/>
|
|||
|
|
))}
|
|||
|
|
</div>
|
|||
|
|
)}
|
|||
|
|
</ScrollArea>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
{/* 配置区域 */}
|
|||
|
|
{selectedProject && (
|
|||
|
|
<div className="space-y-4">
|
|||
|
|
{/* 仓库项目：分支选择 */}
|
|||
|
|
{isRepositoryProject(selectedProject) && (
|
|||
|
|
<div className="flex items-center gap-3 p-3 border border-gray-800 rounded-lg bg-blue-950/20">
|
|||
|
|
<GitBranch className="w-5 h-5 text-blue-400" />
|
|||
|
|
<span className="font-mono text-sm text-gray-400 w-16">Branch</span>
|
|||
|
|
{loadingBranches ? (
|
|||
|
|
<div className="flex items-center gap-2 flex-1">
|
|||
|
|
<Loader2 className="w-4 h-4 animate-spin text-blue-400" />
|
|||
|
|
<span className="text-sm text-blue-400 font-mono">Loading...</span>
|
|||
|
|
</div>
|
|||
|
|
) : (
|
|||
|
|
<Select value={branch} onValueChange={setBranch}>
|
|||
|
|
<SelectTrigger className="flex-1 h-9 bg-gray-900/50 border-gray-700 text-white font-mono focus:ring-0">
|
|||
|
|
<SelectValue placeholder="Select branch" />
|
|||
|
|
</SelectTrigger>
|
|||
|
|
<SelectContent className="bg-gray-900 border-gray-700">
|
|||
|
|
{branches.map((b) => (
|
|||
|
|
<SelectItem key={b} value={b} className="font-mono text-white">
|
|||
|
|
{b}
|
|||
|
|
</SelectItem>
|
|||
|
|
))}
|
|||
|
|
</SelectContent>
|
|||
|
|
</Select>
|
|||
|
|
)}
|
|||
|
|
</div>
|
|||
|
|
)}
|
|||
|
|
|
|||
|
|
{/* ZIP 项目：文件选择 */}
|
|||
|
|
{isZipProject(selectedProject) && (
|
|||
|
|
<div className="p-3 border border-gray-800 rounded-lg bg-amber-950/20 space-y-3">
|
|||
|
|
<div className="flex items-center gap-3">
|
|||
|
|
<Package className="w-5 h-5 text-amber-400" />
|
|||
|
|
<span className="font-mono text-sm text-gray-400">ZIP File</span>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
{storedZipInfo?.has_file && (
|
|||
|
|
<div
|
|||
|
|
className={`p-2 rounded border cursor-pointer transition-colors ${
|
|||
|
|
useStoredZip
|
|||
|
|
? 'border-green-500 bg-green-950/30'
|
|||
|
|
: 'border-gray-700 hover:border-gray-600'
|
|||
|
|
}`}
|
|||
|
|
onClick={() => setUseStoredZip(true)}
|
|||
|
|
>
|
|||
|
|
<div className="flex items-center gap-2">
|
|||
|
|
<div className={`w-3 h-3 rounded-full border-2 ${
|
|||
|
|
useStoredZip ? 'border-green-500 bg-green-500' : 'border-gray-600'
|
|||
|
|
}`} />
|
|||
|
|
<span className="text-sm text-white font-mono">
|
|||
|
|
{storedZipInfo.original_filename}
|
|||
|
|
</span>
|
|||
|
|
<Badge className="bg-green-500/20 text-green-400 border-0 text-[10px]">
|
|||
|
|
Stored
|
|||
|
|
</Badge>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
)}
|
|||
|
|
|
|||
|
|
<div
|
|||
|
|
className={`p-2 rounded border cursor-pointer transition-colors ${
|
|||
|
|
!useStoredZip && zipFile
|
|||
|
|
? 'border-amber-500 bg-amber-950/30'
|
|||
|
|
: 'border-gray-700 hover:border-gray-600'
|
|||
|
|
}`}
|
|||
|
|
>
|
|||
|
|
<label className="flex items-center gap-2 cursor-pointer">
|
|||
|
|
<div className={`w-3 h-3 rounded-full border-2 ${
|
|||
|
|
!useStoredZip && zipFile ? 'border-amber-500 bg-amber-500' : 'border-gray-600'
|
|||
|
|
}`} />
|
|||
|
|
<Upload className="w-4 h-4 text-gray-500" />
|
|||
|
|
<span className="text-sm text-gray-400 font-mono">
|
|||
|
|
{zipFile ? zipFile.name : "Upload new file..."}
|
|||
|
|
</span>
|
|||
|
|
<input
|
|||
|
|
type="file"
|
|||
|
|
accept=".zip"
|
|||
|
|
onChange={handleFileChange}
|
|||
|
|
className="hidden"
|
|||
|
|
/>
|
|||
|
|
</label>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
)}
|
|||
|
|
|
|||
|
|
{/* 高级选项 */}
|
|||
|
|
<Collapsible open={showAdvanced} onOpenChange={setShowAdvanced}>
|
|||
|
|
<CollapsibleTrigger className="flex items-center gap-2 text-xs font-mono text-gray-500 hover:text-gray-300 transition-colors">
|
|||
|
|
<ChevronRight className={`w-4 h-4 transition-transform ${showAdvanced ? "rotate-90" : ""}`} />
|
|||
|
|
<Settings2 className="w-4 h-4" />
|
|||
|
|
<span className="uppercase font-bold">Advanced Options</span>
|
|||
|
|
</CollapsibleTrigger>
|
|||
|
|
<CollapsibleContent className="mt-3 space-y-3">
|
|||
|
|
{/* 文件选择 */}
|
|||
|
|
{(() => {
|
|||
|
|
const isRepo = isRepositoryProject(selectedProject);
|
|||
|
|
const isZip = isZipProject(selectedProject);
|
|||
|
|
const hasStoredZip = storedZipInfo?.has_file;
|
|||
|
|
// 可以选择文件的条件：仓库项目 或 ZIP项目使用已存储文件
|
|||
|
|
const canSelectFiles = isRepo || (isZip && useStoredZip && hasStoredZip);
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<div className="flex items-center justify-between p-3 border border-dashed border-gray-700 rounded-lg bg-gray-900/30">
|
|||
|
|
<div>
|
|||
|
|
<p className="font-mono text-xs uppercase font-bold text-gray-500">
|
|||
|
|
Scan Scope
|
|||
|
|
</p>
|
|||
|
|
<p className="text-sm text-white font-mono mt-1">
|
|||
|
|
{selectedFiles
|
|||
|
|
? `${selectedFiles.length} files selected`
|
|||
|
|
: "All files"}
|
|||
|
|
</p>
|
|||
|
|
</div>
|
|||
|
|
<div className="flex gap-2">
|
|||
|
|
{selectedFiles && canSelectFiles && (
|
|||
|
|
<Button
|
|||
|
|
size="sm"
|
|||
|
|
variant="ghost"
|
|||
|
|
onClick={() => setSelectedFiles(undefined)}
|
|||
|
|
className="h-8 text-xs text-red-400 hover:bg-red-900/30 hover:text-red-300"
|
|||
|
|
>
|
|||
|
|
Reset
|
|||
|
|
</Button>
|
|||
|
|
)}
|
|||
|
|
<Button
|
|||
|
|
size="sm"
|
|||
|
|
variant="outline"
|
|||
|
|
onClick={() => setShowFileSelection(true)}
|
|||
|
|
disabled={!canSelectFiles}
|
|||
|
|
className="h-8 text-xs border-gray-700 text-gray-300 hover:bg-gray-800 hover:text-white font-mono disabled:opacity-50"
|
|||
|
|
>
|
|||
|
|
<FolderOpen className="w-3 h-3 mr-1" />
|
|||
|
|
Select Files
|
|||
|
|
</Button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
);
|
|||
|
|
})()}
|
|||
|
|
|
|||
|
|
{/* 排除模式 */}
|
|||
|
|
<div className="p-3 border border-dashed border-gray-700 rounded-lg bg-gray-900/30 space-y-3">
|
|||
|
|
<div className="flex items-center justify-between">
|
|||
|
|
<span className="font-mono text-xs uppercase font-bold text-gray-500">
|
|||
|
|
Exclude Patterns
|
|||
|
|
</span>
|
|||
|
|
<button
|
|||
|
|
type="button"
|
|||
|
|
onClick={() => setExcludePatterns(DEFAULT_EXCLUDES)}
|
|||
|
|
className="text-xs font-mono text-primary hover:text-primary/80"
|
|||
|
|
>
|
|||
|
|
Reset
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div className="flex flex-wrap gap-1.5">
|
|||
|
|
{excludePatterns.map((p) => (
|
|||
|
|
<Badge
|
|||
|
|
key={p}
|
|||
|
|
variant="secondary"
|
|||
|
|
className="bg-gray-800 text-gray-300 border-0 font-mono text-xs cursor-pointer hover:bg-red-900/50 hover:text-red-400"
|
|||
|
|
onClick={() => setExcludePatterns((prev) => prev.filter((x) => x !== p))}
|
|||
|
|
>
|
|||
|
|
{p} ×
|
|||
|
|
</Badge>
|
|||
|
|
))}
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<Input
|
|||
|
|
placeholder="Add pattern, press Enter..."
|
|||
|
|
className="h-8 bg-gray-900/50 border-gray-700 text-white font-mono text-sm placeholder:text-gray-600 focus:ring-0"
|
|||
|
|
onKeyDown={(e) => {
|
|||
|
|
if (e.key === "Enter" && e.currentTarget.value) {
|
|||
|
|
const val = e.currentTarget.value.trim();
|
|||
|
|
if (val && !excludePatterns.includes(val)) {
|
|||
|
|
setExcludePatterns((prev) => [...prev, val]);
|
|||
|
|
}
|
|||
|
|
e.currentTarget.value = "";
|
|||
|
|
}
|
|||
|
|
}}
|
|||
|
|
/>
|
|||
|
|
</div>
|
|||
|
|
</CollapsibleContent>
|
|||
|
|
</Collapsible>
|
|||
|
|
</div>
|
|||
|
|
)}
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
{/* Footer */}
|
|||
|
|
<div className="flex-shrink-0 flex justify-end gap-3 px-5 py-4 bg-gray-900/50 border-t border-gray-800">
|
|||
|
|
<Button
|
|||
|
|
variant="ghost"
|
|||
|
|
onClick={() => onOpenChange(false)}
|
|||
|
|
disabled={creating}
|
|||
|
|
className="px-4 h-10 font-mono text-gray-400 hover:text-white hover:bg-gray-800"
|
|||
|
|
>
|
|||
|
|
Cancel
|
|||
|
|
</Button>
|
|||
|
|
<Button
|
|||
|
|
onClick={handleCreate}
|
|||
|
|
disabled={!canStart || creating}
|
|||
|
|
className="px-5 h-10 bg-primary hover:bg-primary/90 text-white font-mono font-bold"
|
|||
|
|
>
|
|||
|
|
{creating ? (
|
|||
|
|
<>
|
|||
|
|
<Loader2 className="w-4 h-4 animate-spin mr-2" />
|
|||
|
|
Starting...
|
|||
|
|
</>
|
|||
|
|
) : (
|
|||
|
|
<>
|
|||
|
|
<Play className="w-4 h-4 mr-2" />
|
|||
|
|
Start Audit
|
|||
|
|
</>
|
|||
|
|
)}
|
|||
|
|
</Button>
|
|||
|
|
</div>
|
|||
|
|
</DialogContent>
|
|||
|
|
|
|||
|
|
{/* 文件选择对话框 */}
|
|||
|
|
<FileSelectionDialog
|
|||
|
|
open={showFileSelection}
|
|||
|
|
onOpenChange={setShowFileSelection}
|
|||
|
|
projectId={selectedProjectId}
|
|||
|
|
branch={branch}
|
|||
|
|
excludePatterns={excludePatterns}
|
|||
|
|
onConfirm={setSelectedFiles}
|
|||
|
|
/>
|
|||
|
|
</Dialog>
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 项目列表项
|
|||
|
|
function ProjectItem({
|
|||
|
|
project,
|
|||
|
|
selected,
|
|||
|
|
onSelect,
|
|||
|
|
}: {
|
|||
|
|
project: Project;
|
|||
|
|
selected: boolean;
|
|||
|
|
onSelect: () => void;
|
|||
|
|
}) {
|
|||
|
|
const isRepo = isRepositoryProject(project);
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<div
|
|||
|
|
className={`flex items-center gap-3 p-3 cursor-pointer rounded-lg transition-all ${
|
|||
|
|
selected
|
|||
|
|
? "bg-primary/10 border border-primary/50"
|
|||
|
|
: "hover:bg-gray-800/50 border border-transparent"
|
|||
|
|
}`}
|
|||
|
|
onClick={onSelect}
|
|||
|
|
>
|
|||
|
|
<div className={`p-1.5 rounded ${isRepo ? "bg-blue-500/20" : "bg-amber-500/20"}`}>
|
|||
|
|
{isRepo ? (
|
|||
|
|
<Globe className="w-4 h-4 text-blue-400" />
|
|||
|
|
) : (
|
|||
|
|
<Package className="w-4 h-4 text-amber-400" />
|
|||
|
|
)}
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div className="flex-1 min-w-0">
|
|||
|
|
<div className="flex items-center gap-2">
|
|||
|
|
<span className={`font-mono text-sm truncate ${selected ? 'text-white font-bold' : 'text-gray-300'}`}>
|
|||
|
|
{project.name}
|
|||
|
|
</span>
|
|||
|
|
<Badge
|
|||
|
|
variant="outline"
|
|||
|
|
className={`text-[10px] px-1 py-0 font-mono ${
|
|||
|
|
isRepo
|
|||
|
|
? "border-blue-500/50 text-blue-400"
|
|||
|
|
: "border-amber-500/50 text-amber-400"
|
|||
|
|
}`}
|
|||
|
|
>
|
|||
|
|
{isRepo ? "REPO" : "ZIP"}
|
|||
|
|
</Badge>
|
|||
|
|
</div>
|
|||
|
|
{project.description && (
|
|||
|
|
<p className="text-xs text-gray-600 mt-0.5 font-mono truncate">
|
|||
|
|
{project.description}
|
|||
|
|
</p>
|
|||
|
|
)}
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
{selected && (
|
|||
|
|
<div className="w-2 h-2 rounded-full bg-primary animate-pulse" />
|
|||
|
|
)}
|
|||
|
|
</div>
|
|||
|
|
);
|
|||
|
|
}
|