Codewalkers/apps/web/src/components/review/DiffViewer.tsx

import type { FileDiff, DiffLine, ReviewComment } from "./types";
import { FileCard } from "./FileCard";

interface DiffViewerProps {
  files: FileDiff[];
  comments: ReviewComment[];
  onAddComment: (
    filePath: string,
    lineNumber: number,
    lineType: DiffLine["type"],
    body: string,
  ) => void;
  onResolveComment: (commentId: string) => void;
  onUnresolveComment: (commentId: string) => void;
  onReplyComment?: (parentCommentId: string, body: string) => void;
  onEditComment?: (commentId: string, body: string) => void;
  viewedFiles?: Set<string>;
  onToggleViewed?: (filePath: string) => void;
  onRegisterRef?: (filePath: string, el: HTMLDivElement | null) => void;
}

export function DiffViewer({
  files,
  comments,
  onAddComment,
  onResolveComment,
  onUnresolveComment,
  onReplyComment,
  onEditComment,
  viewedFiles,
  onToggleViewed,
  onRegisterRef,
}: DiffViewerProps) {
  return (
    <div className="space-y-4">
      {files.map((file) => (
        <div key={file.newPath} ref={(el) => onRegisterRef?.(file.newPath, el)}>
          <FileCard
            file={file}
            comments={comments.filter((c) => c.filePath === file.newPath)}
            onAddComment={onAddComment}
            onResolveComment={onResolveComment}
            onUnresolveComment={onUnresolveComment}
            onReplyComment={onReplyComment}
            onEditComment={onEditComment}
            isViewed={viewedFiles?.has(file.newPath) ?? false}
            onToggleViewed={() => onToggleViewed?.(file.newPath)}
          />
        </div>
      ))}
    </div>
  );
}