finalyse

app/components/ResultPreviewComponent.tsx

@@ -1,11 +1,20 @@
 import { Copy, Download, AlertTriangle } from "lucide-react";
 import { ReactNode } from "react";
 
+interface EntityMapping {
+  originalValue: string;
+  anonymizedValue: string;
+  entityType: string;
+  startIndex: number;
+  endIndex: number;
+}
+
 interface ResultPreviewComponentProps {
   outputText: string;
   copyToClipboard: () => void;
   downloadText: () => void;
-  highlightEntities: (text: string) => ReactNode;
+  highlightEntities: (text: string, mappings?: EntityMapping[]) => ReactNode;
+  entityMappings?: EntityMapping[];
 }
 
 export const ResultPreviewComponent = ({
@@ -13,6 +22,7 @@ export const ResultPreviewComponent = ({
   copyToClipboard,
   downloadText,
   highlightEntities,
+  entityMappings,
 }: ResultPreviewComponentProps) => {
   if (!outputText) return null;
 
@@ -48,7 +58,7 @@ export const ResultPreviewComponent = ({
         <div className="flex-1 p-4 overflow-hidden">
           <div className="h-full min-h-[300px] text-[#092727] whitespace-pre-wrap overflow-y-auto">
             <div className="leading-relaxed">
-              {highlightEntities(outputText)}
+              {highlightEntities(outputText, entityMappings)}
             </div>
           </div>
         </div>