project/frontend/src/routes/extractedResult_.$pitchBook.$kpi.tsx

@@ -27,8 +27,7 @@ import {
 	useSuspenseQuery,
 } from "@tanstack/react-query";
 import { createFileRoute, useNavigate } from "@tanstack/react-router";
-import { useEffect, useState } from "react";
-import type { KeyboardEvent } from "react";
+import { useEffect, useState, type KeyboardEvent } from "react";
 import PDFViewer from "../components/pdfViewer";
 import { fetchPutKPI } from "../util/api";
 import { kpiQueryOptions } from "../util/query";
@@ -72,12 +71,36 @@ function ExtractedResultsPage() {
 
 	const originalValue = kpiValues[0]?.entity || "";
 	const originalPage = kpiValues[0]?.page || 0;
-	const selectedValue =
-		selectedIndex === -1 ? customValue : kpiValues[selectedIndex]?.entity || "";
+
+	// Funktion, um gleiche Werte zusammenzufassen und die Seiten zu sammeln
+	function groupKpiValues(values: Array<{ entity: string; page: number; [key: string]: any }>): Array<{ entity: string; pages: number[]; [key: string]: any }> {
+		const map = new Map<string, { entity: string; pages: number[]; [key: string]: any }>();
+		values.forEach((item: { entity: string; page: number; [key: string]: any }) => {
+			const key = item.entity.toLowerCase();
+			if (!map.has(key)) {
+				map.set(key, { ...item, pages: [item.page] });
+			} else {
+				const existingEntry = map.get(key)!;
+				if (!existingEntry.pages.includes(item.page)) {
+					existingEntry.pages.push(item.page);
+				}
+			}
+		});
+		return Array.from(map.values());
+	}
+
+	const groupedKpiValues: Array<{ entity: string; pages: number[]; [key: string]: any }> = groupKpiValues(kpiValues);
+
+	const selectedValue: string =
+		selectedIndex === -1 ? customValue : groupedKpiValues[selectedIndex]?.entity || "";
+	
 	const selectedPage =
 		selectedIndex === -1
 			? (parseInt(customPage) > 0 ? parseInt(customPage) : 1)
-			: kpiValues[selectedIndex]?.page || 1;
+			: groupedKpiValues[selectedIndex]?.pages[0] || 1;
+
+	// Um zu prüfen, ob der Wert nur aus Leerzeichen besteht
+	const isSelectedValueEmpty = selectedIndex === -1 ? customValue.trim() === "" : !selectedValue;
 
 	useEffect(() => {
 		const valueChanged = selectedValue !== originalValue;
@@ -90,7 +113,15 @@ function ExtractedResultsPage() {
 			const updatedData = { ...kpiData };
 			let baseObject;
 			if (selectedIndex >= 0) {
-				baseObject = kpiValues[selectedIndex];
+				// Das Originalobjekt mit allen Feldern für diesen Wert suchen
+				const original = kpiValues.find(v => v.entity.toLowerCase() === groupedKpiValues[selectedIndex].entity.toLowerCase()) as { status?: string; source?: string } | undefined;
+				baseObject = {
+					label: kpi.toUpperCase(),
+					entity: groupedKpiValues[selectedIndex].entity,
+					page: groupedKpiValues[selectedIndex].pages[0],
+					status: original?.status || "single-source",
+					source: original?.source || "auto",
+				};
 			} else {
 				baseObject = {
 					label: kpi.toUpperCase(),
@@ -131,7 +162,7 @@ function ExtractedResultsPage() {
 		} else {
 			const index = Number.parseInt(value);
 			setSelectedIndex(index);
-			setCurrentPage(kpiValues[index].page);
+			setCurrentPage(groupedKpiValues[index].pages[0]);
 			setCustomValue("");
 			setCustomPage("");
 		}
@@ -156,7 +187,7 @@ function ExtractedResultsPage() {
 	};
 
 	const handleRowClick = (index: number) => {
-		setCurrentPage(kpiValues[index].page);
+		setCurrentPage(groupedKpiValues[index].pages[0]);
 		setSelectedIndex(index);
 		setCustomValue("");
 		setCustomPage("");
@@ -195,10 +226,8 @@ function ExtractedResultsPage() {
 		setEditingCustomPage(true);
 	};
 
-	const handleCustomPageKeyPress = (e: KeyboardEvent<HTMLDivElement>) => {
-		if (e.key === "Enter") {
-			setEditingCustomPage(false);
-		} else if (e.key === "Escape") {
+	const handleCustomPageKeyPress = (e: KeyboardEvent<HTMLInputElement>) => {
+		if (e.key === "Enter" || e.key === "Escape") {
 			setEditingCustomPage(false);
 		}
 	};
@@ -244,14 +273,14 @@ function ExtractedResultsPage() {
 										<strong>Gefundene Werte</strong>
 									</TableCell>
 									<TableCell align="center" width="15%">
-										<strong>Seite</strong>
+										<strong>Seiten</strong>
 									</TableCell>
 								</TableRow>
 							</TableHead>
 							<TableBody>
-								{kpiValues.map((item, index) => (
+								{groupedKpiValues.map((item, index) => (
 									<TableRow
-										key={`${item.entity}_${item.page}_${index}`}
+										key={`${item.entity}_${item.pages.join('_')}_${index}`}
 										sx={{
 											"&:hover": { backgroundColor: "#f9f9f9" },
 											cursor: "pointer",
@@ -290,16 +319,19 @@ function ExtractedResultsPage() {
 											</Box>
 										</TableCell>
 										<TableCell align="center">
+											{item.pages.map((page: number, i: number) => (
 												<Link
+													key={page}
 													component="button"
 													onClick={(e: React.MouseEvent) => {
 														e.stopPropagation();
-													setCurrentPage(item.page);
+														setCurrentPage(page);
 													}}
-												sx={{ cursor: "pointer" }}
+													sx={{ cursor: "pointer", ml: i > 0 ? 1 : 0 }}
 												>
-												{item.page}
+													{page}
 												</Link>
+											))}
 										</TableCell>
 									</TableRow>
 								))}
@@ -335,6 +367,7 @@ function ExtractedResultsPage() {
 													},
 												}}
 											/>
+											<Box sx={{ width: '100%' }}>
 												<TextField
 													placeholder="Einen abweichenden Wert eingeben..."
 													value={customValue}
@@ -352,8 +385,11 @@ function ExtractedResultsPage() {
 													onClick={(e: React.MouseEvent) => {
 														e.stopPropagation();
 													}}
+													error={selectedIndex === -1 && customValue !== "" && customValue.trim() === ""}
+													helperText={selectedIndex === -1 && customValue !== "" && customValue.trim() === "" ? "Der Wert, der angegeben wurde, ist leer." : ""}
 												/>
 											</Box>
+										</Box>
 									</TableCell>
 									<TableCell align="center">
 										{editingCustomPage ? (
@@ -440,12 +476,12 @@ function ExtractedResultsPage() {
 							pitchBookId={pitchBook}
 							currentPage={currentPage}
 							onPageChange={setCurrentPage}
-							highlight={Object.values(kpiValues)
-								.flat()
-								.map((k) => ({ page: k.page, text: k.entity }))}
+							highlight={groupedKpiValues
+								.map((k) => k.pages.map((page: number) => ({ page, text: k.entity })))
+								.reduce((acc, val) => acc.concat(val), [])}
 							focusHighlight={{
-								page: kpiValues.at(selectedIndex)?.page || -1,
-								text: kpiValues.at(selectedIndex)?.entity || "",
+								page: groupedKpiValues.at(selectedIndex)?.pages[0] || -1,
+								text: groupedKpiValues.at(selectedIndex)?.entity || "",
 							}}
 						/>
 					</Paper>
@@ -453,7 +489,7 @@ function ExtractedResultsPage() {
 						<Button
 							variant="contained"
 							onClick={handleAcceptReview}
-							disabled={!selectedValue}
+							disabled={isSelectedValueEmpty}
 							sx={{
 								backgroundColor: "#383838",
 								"&:hover": { backgroundColor: "#2e2e2e" },