Carlos Florêncio
79 lines
2.1 KiB
TypeScript
79 lines
2.1 KiB
TypeScript
'use client';
|
|
|
|
import { memo, useMemo } from 'react';
|
|
import { DiffViewer } from './diff-viewer';
|
|
import { transformGitDiff } from '@/lib/diff';
|
|
import type { DiffComment } from '@/lib/diff/types';
|
|
|
|
interface FileDiffViewerProps {
|
|
/** File path */
|
|
filePath: string;
|
|
/** Raw diff content */
|
|
diff: string;
|
|
/** File status (M, A, D, etc.) */
|
|
status?: string;
|
|
/** Enable line selection for comments */
|
|
enableComments?: boolean;
|
|
/** Session ID for comment storage */
|
|
sessionId?: string;
|
|
/** Callback when comment is added */
|
|
onCommentAdd?: (comment: DiffComment) => void;
|
|
/** Callback when comment is deleted */
|
|
onCommentDelete?: (commentId: string) => void;
|
|
/** External comments (controlled mode) */
|
|
comments?: DiffComment[];
|
|
/** Additional class name */
|
|
className?: string;
|
|
/** Whether to show in compact mode */
|
|
compact?: boolean;
|
|
/** Whether to hide the file header */
|
|
hideHeader?: boolean;
|
|
/** Callback to open file in editor */
|
|
onOpenFile?: (filePath: string) => void;
|
|
}
|
|
|
|
/**
|
|
* Wrapper around DiffViewer that handles data transformation with memoization.
|
|
*
|
|
* Use this component when you have raw diff data (filePath, diff, status).
|
|
* The transformation to FileDiffData is memoized internally, preventing
|
|
* unnecessary re-renders when parent components update.
|
|
*
|
|
* This is the recommended component to use for rendering git diffs.
|
|
*/
|
|
export const FileDiffViewer = memo(function FileDiffViewer({
|
|
filePath,
|
|
diff,
|
|
status = 'M',
|
|
enableComments,
|
|
sessionId,
|
|
onCommentAdd,
|
|
onCommentDelete,
|
|
comments,
|
|
className,
|
|
compact,
|
|
hideHeader,
|
|
onOpenFile,
|
|
}: FileDiffViewerProps) {
|
|
// Memoize the transformation - only recalculates when raw data changes
|
|
const data = useMemo(
|
|
() => transformGitDiff(filePath, diff, status),
|
|
[filePath, diff, status]
|
|
);
|
|
|
|
return (
|
|
<DiffViewer
|
|
data={data}
|
|
enableComments={enableComments}
|
|
sessionId={sessionId}
|
|
onCommentAdd={onCommentAdd}
|
|
onCommentDelete={onCommentDelete}
|
|
comments={comments}
|
|
className={className}
|
|
compact={compact}
|
|
hideHeader={hideHeader}
|
|
onOpenFile={onOpenFile}
|
|
/>
|
|
);
|
|
});
|