fix(client): fix broken 'download' function on FailedOCR page

This commit is contained in:
perf3ct 2025-06-25 22:49:53 +00:00
parent a6d9446d1f
commit dd8555b088
No known key found for this signature in database
GPG Key ID: 569C4EEC436F5232
3 changed files with 43 additions and 6 deletions

View File

@ -38,7 +38,7 @@ import {
} from '@mui/icons-material';
import { useNavigate } from 'react-router-dom';
import { useAuth } from '../../contexts/AuthContext';
import api from '../../services/api';
import api, { documentService } from '../../services/api';
interface Document {
id: string;
@ -377,9 +377,12 @@ const RecentDocuments: React.FC<RecentDocumentsProps> = ({ documents = [] }) =>
</IconButton>
<IconButton
size="small"
onClick={() => {
const downloadUrl = `/api/documents/${doc.id}/download`;
window.open(downloadUrl, '_blank');
onClick={async () => {
try {
await documentService.downloadFile(doc.id, doc.original_filename || doc.filename);
} catch (error) {
console.error('Download failed:', error);
}
}}
>
<DownloadIcon fontSize="small" />

View File

@ -473,7 +473,13 @@ const FailedOcrPage: React.FC = () => {
<Tooltip title="Download Document">
<IconButton
size="small"
onClick={() => window.open(`/api/documents/${document.id}/download`, '_blank')}
onClick={async () => {
try {
await documentService.downloadFile(document.id, document.original_filename || document.filename);
} catch (error) {
console.error('Download failed:', error);
}
}}
>
<DownloadIcon />
</IconButton>
@ -760,7 +766,13 @@ const FailedOcrPage: React.FC = () => {
<Tooltip title="Download Document">
<IconButton
size="small"
onClick={() => window.open(`/api/documents/${doc.id}/download`, '_blank')}
onClick={async () => {
try {
await documentService.downloadFile(doc.id, doc.original_filename || doc.filename);
} catch (error) {
console.error('Download failed:', error);
}
}}
sx={{ color: theme.palette.secondary.main }}
>
<DownloadIcon />

View File

@ -151,6 +151,28 @@ export const documentService = {
})
},
downloadFile: async (id: string, filename?: string) => {
try {
const response = await api.get(`/documents/${id}/download`, {
responseType: 'blob',
});
// Create blob URL and trigger download
const blob = new Blob([response.data], { type: response.headers['content-type'] });
const url = window.URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = filename || `document-${id}`;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
window.URL.revokeObjectURL(url);
} catch (error) {
console.error('Download failed:', error);
throw error;
}
},
getOcrText: (id: string) => {
return api.get<OcrResponse>(`/documents/${id}/ocr`)
},