theo-agent-dashboard

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs | README

DiffResult.tsx (1231B)

      1 import { useMemo, type ReactNode } from "react";
      2 import { DiffView, DiffModeEnum, DiffFile } from "@git-diff-view/react";
      3 import "@git-diff-view/react/styles/diff-view.css";
      4 import { parseUnifiedDiff } from "./diffParser";
      5 
      6 interface DiffResultProps {
      7   content: string;
      8 }
      9 
     10 /** Render unified diff output using @git-diff-view/react with dark theme. */
     11 export function DiffResult({ content }: DiffResultProps): ReactNode {
     12   const diffFile = useMemo(() => {
     13     try {
     14       const { oldFileName, newFileName, hunks } = parseUnifiedDiff(content);
     15       if (hunks.length === 0) return null;
     16 
     17       const file = DiffFile.createInstance({
     18         oldFile: { fileName: oldFileName ?? undefined },
     19         newFile: { fileName: newFileName ?? undefined },
     20         hunks,
     21       });
     22       file.initTheme("dark");
     23       file.init();
     24       return file;
     25     } catch {
     26       return null;
     27     }
     28   }, [content]);
     29 
     30   if (!diffFile) {
     31     return <pre className="text-xs text-gray-300">{content}</pre>;
     32   }
     33 
     34   return (
     35     <div data-testid="diff-view" className="rounded text-xs">
     36       <DiffView
     37         diffFile={diffFile}
     38         diffViewMode={DiffModeEnum.Unified}
     39         diffViewTheme="dark"
     40         diffViewHighlight
     41       />
     42     </div>
     43   );
     44 }