cflx 0.6.11

Conflux – a spec-driven parallel coding orchestrator that runs AI agents on git worktrees
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44

import React from 'react';
import { RemoteChange, RemoteProject } from '../api/types';
import { ChangeRow } from './ChangeRow';

interface ChangesPanelProps {
  projects: RemoteProject[];
  selectedProjectId: string | null;
  onClickChange?: (changeId: string) => void;
  selectedChangeId?: string | null;
}

export function ChangesPanel({ projects, selectedProjectId, onClickChange, selectedChangeId }: ChangesPanelProps) {
  if (!selectedProjectId) {
    return (
      <div className="flex flex-1 items-center justify-center p-8">
        <p className="text-sm text-[#52525b]">Select a project to view changes</p>
      </div>
    );
  }

  const project = projects.find((p) => p.id === selectedProjectId);
  const projectChanges: RemoteChange[] = project?.changes ?? [];

  if (projectChanges.length === 0) {
    return (
      <div className="flex flex-1 items-center justify-center p-8">
        <p className="text-sm text-[#52525b]">No changes</p>
      </div>
    );
  }

  return (
    <div className="space-y-1.5 p-3">
      {projectChanges.map((change) => (
        <ChangeRow
          key={change.id}
          change={change}
          onClickChange={onClickChange}
          isSelected={selectedChangeId === change.id}
        />
      ))}
    </div>
  );
}