da4152264c
Pipeline view groups phases by dependency depth with DAG visualization. Phase detail panel with Tiptap rich content editor and auto-save. Code review tab with diff viewer and comment threads (dummy data). Centralized live updates hook replaces scattered subscription boilerplate. Extract agent output parsing into shared utility. Inbox detail panel, account cards, and agent action components.
38 lines
1.2 KiB
TypeScript
38 lines
1.2 KiB
TypeScript
import type { PipelineColumn } from "@codewalk-district/shared";
|
|
import { PipelineStageColumn } from "./PipelineStageColumn";
|
|
import type { SerializedTask } from "@/components/TaskRow";
|
|
|
|
interface PipelineGraphProps {
|
|
columns: PipelineColumn<{
|
|
id: string;
|
|
name: string;
|
|
status: string;
|
|
createdAt: string | Date;
|
|
}>[];
|
|
tasksByPhase: Record<string, SerializedTask[]>;
|
|
}
|
|
|
|
export function PipelineGraph({ columns, tasksByPhase }: PipelineGraphProps) {
|
|
return (
|
|
<div className="overflow-x-auto pb-4">
|
|
<div className="flex min-w-max items-start gap-0">
|
|
{columns.map((column, idx) => (
|
|
<div key={column.depth} className="flex items-start">
|
|
{/* Connector arrow between columns */}
|
|
{idx > 0 && (
|
|
<div className="flex items-center self-center py-4">
|
|
<div className="h-px w-6 bg-border" />
|
|
<div className="h-0 w-0 border-y-[4px] border-l-[6px] border-y-transparent border-l-border" />
|
|
</div>
|
|
)}
|
|
<PipelineStageColumn
|
|
phases={column.phases}
|
|
tasksByPhase={tasksByPhase}
|
|
/>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|