Spaces:
Sleeping
Sleeping
Download frontend/src/hooks/useDocuments.ts from orakzai-io/Rednote: direct link, hf CLI and curl.
- Browser
- Download file 2.61 kB
-
https://huggingface.co/spaces/orakzai-io/Rednote/resolve/main/frontend/src/hooks/useDocuments.ts
- Command line
-
hf download hf://spaces/orakzai-io/Rednote/frontend/src/hooks/useDocuments.ts
-
curl -L -o useDocuments.ts https://huggingface.co/spaces/orakzai-io/Rednote/resolve/main/frontend/src/hooks/useDocuments.ts
2.61 kB
| import { useState, useEffect, useRef } from 'react'; | |
| import type { DocumentInfo } from '../types'; | |
| import { | |
| fetchDocuments as apiFetchDocuments, | |
| uploadDocument as apiUploadDocument, | |
| deleteDocument as apiDeleteDocument, | |
| } from '../api/client'; | |
| export function useDocuments() { | |
| const [documents, setDocuments] = useState<DocumentInfo[]>([]); | |
| const [selectedDocId, setSelectedDocId] = useState<string | null>(null); | |
| const [isUploading, setIsUploading] = useState(false); | |
| const [uploadError, setUploadError] = useState<string | null>(null); | |
| const fileInputRef = useRef<HTMLInputElement>(null); | |
| const loadDocuments = async () => { | |
| try { | |
| const data = await apiFetchDocuments(); | |
| setDocuments(data); | |
| } catch (err) { | |
| console.error('Error fetching documents:', err); | |
| } | |
| }; | |
| // eslint-disable-next-line react-hooks/set-state-in-effect | |
| useEffect(() => { | |
| loadDocuments(); | |
| }, []); | |
| const handleFileUpload = async (event: React.ChangeEvent<HTMLInputElement>) => { | |
| const file = event.target.files?.[0]; | |
| if (!file) return; | |
| if (file.size > 10 * 1024 * 1024) { | |
| setUploadError('File size exceeds the 10MB limit.'); | |
| return; | |
| } | |
| setIsUploading(true); | |
| setUploadError(null); | |
| try { | |
| await apiUploadDocument(file); | |
| await loadDocuments(); | |
| if (fileInputRef.current) fileInputRef.current.value = ''; | |
| } catch (err: unknown) { | |
| console.error(err); | |
| setUploadError(err instanceof Error ? err.message : 'Error uploading file.'); | |
| } finally { | |
| setIsUploading(false); | |
| } | |
| }; | |
| const [docToDelete, setDocToDelete] = useState<string | null>(null); | |
| const confirmDeleteDocument = (id: string, event: React.MouseEvent) => { | |
| event.stopPropagation(); | |
| setDocToDelete(id); | |
| }; | |
| const executeDeleteDocument = async () => { | |
| if (!docToDelete) return; | |
| const id = docToDelete; | |
| setDocToDelete(null); | |
| try { | |
| await apiDeleteDocument(id); | |
| if (selectedDocId === id) setSelectedDocId(null); | |
| await loadDocuments(); | |
| } catch (err) { | |
| console.error('Error deleting document:', err); | |
| } | |
| }; | |
| const handleDocumentSelect = (id: string) => { | |
| setSelectedDocId((prev) => (prev === id ? null : id)); | |
| }; | |
| return { | |
| documents, | |
| selectedDocId, | |
| isUploading, | |
| uploadError, | |
| docToDelete, | |
| setDocToDelete, | |
| fileInputRef, | |
| handleFileUpload, | |
| handleDeleteDocument: confirmDeleteDocument, | |
| executeDeleteDocument, | |
| handleDocumentSelect, | |
| }; | |
| } | |