47 lines
1.3 KiB
TypeScript
47 lines
1.3 KiB
TypeScript
|
'use client';
|
||
|
|
|
||
|
|
import { useState } from 'react';
|
||
|
|
import { OCRUpload } from '@/components/ocr/OCRUpload';
|
||
|
|
import { OCRResults } from '@/components/ocr/OCRResults';
|
||
|
|
import { OCRDetail } from '@/components/ocr/OCRDetail';
|
||
|
|
import { getOCRResult, type OCRResultResponse } from '@/lib/ocr';
|
||
|
|
|
||
|
|
export default function OCRPage() {
|
||
|
|
const [selectedResult, setSelectedResult] = useState<OCRResultResponse | null>(null);
|
||
|
|
|
||
|
|
const handleUploadComplete = async (resultId: string) => {
|
||
|
|
// Refresh results by triggering a re-render
|
||
|
|
// The OCRResults component will auto-refresh via its useEffect
|
||
|
|
// Optionally fetch the new result
|
||
|
|
try {
|
||
|
|
const result = await getOCRResult(resultId);
|
||
|
|
setSelectedResult(result);
|
||
|
|
} catch {
|
||
|
|
// Result might not be ready yet, ignore
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
const handleSelectResult = (result: OCRResultResponse) => {
|
||
|
|
setSelectedResult(result);
|
||
|
|
};
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div data-testid="ocr-page" className="space-y-6">
|
||
|
|
<h1 className="text-2xl font-bold text-text">OCR Erfassung</h1>
|
||
|
|
|
||
|
|
<OCRUpload onUploadComplete={handleUploadComplete} />
|
||
|
|
|
||
|
|
<OCRResults onSelectResult={handleSelectResult} />
|
||
|
|
|
||
|
|
{selectedResult && (
|
||
|
|
<OCRDetail
|
||
|
|
result={selectedResult}
|
||
|
|
onApplyComplete={() => {
|
||
|
|
// Could refresh results here
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|