Fix folder ui issues and use colpali ref

This commit is contained in:
Adityavardhan Agrawal 2025-04-17 00:50:16 -07:00
parent 4ffe0b3bac
commit 1ec1efe176
2 changed files with 42 additions and 35 deletions

View File

@ -691,7 +691,7 @@ const DocumentsSection: React.FC<DocumentsSectionProps> = ({ apiBaseUrl, authTok
} }
} }
const url = `${effectiveApiUrl}/ingest/file${useColpaliRef ? '?use_colpali=true' : ''}`; const url = `${effectiveApiUrl}/ingest/file?use_colpali=${useColpaliRef}`;
// Non-blocking fetch // Non-blocking fetch
fetch(url, { fetch(url, {
@ -840,12 +840,12 @@ const DocumentsSection: React.FC<DocumentsSectionProps> = ({ apiBaseUrl, authTok
formData.append('rules', rulesRef); formData.append('rules', rulesRef);
formData.append('parallel', 'true'); formData.append('parallel', 'true');
if (useColpaliRef !== undefined) {
formData.append('use_colpali', useColpaliRef.toString()); // Always set explicit use_colpali value
} const url = `${effectiveApiUrl}/ingest/files?use_colpali=${useColpaliRef}`;
// Non-blocking fetch // Non-blocking fetch
fetch(`${effectiveApiUrl}/ingest/files`, { fetch(url, {
method: 'POST', method: 'POST',
headers: { headers: {
'Authorization': authToken ? `Bearer ${authToken}` : '' 'Authorization': authToken ? `Bearer ${authToken}` : ''
@ -996,8 +996,10 @@ const DocumentsSection: React.FC<DocumentsSectionProps> = ({ apiBaseUrl, authTok
resetUploadDialog(); resetUploadDialog();
try { try {
// Non-blocking fetch // Non-blocking fetch with explicit use_colpali parameter
fetch(`${effectiveApiUrl}/ingest/text`, { const url = `${effectiveApiUrl}/ingest/text?use_colpali=${useColpaliRef}`;
fetch(url, {
method: 'POST', method: 'POST',
headers: { headers: {
'Authorization': authToken ? `Bearer ${authToken}` : '', 'Authorization': authToken ? `Bearer ${authToken}` : '',
@ -1007,7 +1009,6 @@ const DocumentsSection: React.FC<DocumentsSectionProps> = ({ apiBaseUrl, authTok
content: textContentRef, content: textContentRef,
metadata: metadataObj, metadata: metadataObj,
rules: JSON.parse(rulesRef || '[]'), rules: JSON.parse(rulesRef || '[]'),
use_colpali: useColpaliRef,
folder_name: folderToUse folder_name: folderToUse
}) })
}) })
@ -1207,26 +1208,26 @@ const DocumentsSection: React.FC<DocumentsSectionProps> = ({ apiBaseUrl, authTok
</div> </div>
</div> </div>
{documents.length === 0 && !loading && folders.length === 0 && !foldersLoading ? ( <div className="flex flex-col gap-4 flex-1">
<div className="text-center py-8 border border-dashed rounded-lg flex-1 flex items-center justify-center"> <FolderList
<div> folders={folders}
<Upload className="mx-auto h-12 w-12 mb-2 text-muted-foreground" /> selectedFolder={selectedFolder}
<p className="text-muted-foreground">No documents found. Upload your first document.</p> setSelectedFolder={setSelectedFolder}
</div> apiBaseUrl={effectiveApiUrl}
</div> authToken={authToken}
) : ( refreshFolders={fetchFolders}
<div className="flex flex-col gap-4 flex-1"> loading={foldersLoading}
<FolderList />
folders={folders}
selectedFolder={selectedFolder}
setSelectedFolder={setSelectedFolder}
apiBaseUrl={effectiveApiUrl}
authToken={authToken}
refreshFolders={fetchFolders}
loading={foldersLoading}
/>
{selectedFolder !== null && ( {selectedFolder !== null ? (
documents.length === 0 && !loading ? (
<div className="text-center py-8 border border-dashed rounded-lg flex-1 flex items-center justify-center">
<div>
<Upload className="mx-auto h-12 w-12 mb-2 text-muted-foreground" />
<p className="text-muted-foreground">No documents found in this folder. Upload a document.</p>
</div>
</div>
) : (
<div className="flex flex-col md:flex-row gap-4 flex-1"> <div className="flex flex-col md:flex-row gap-4 flex-1">
<div className="w-full md:w-2/3"> <div className="w-full md:w-2/3">
<DocumentList <DocumentList
@ -1254,9 +1255,9 @@ const DocumentsSection: React.FC<DocumentsSectionProps> = ({ apiBaseUrl, authTok
/> />
</div> </div>
</div> </div>
)} )
</div> ) : null}
)} </div>
</div> </div>
); );
}; };

View File

@ -8,6 +8,7 @@ import { Label } from '@/components/ui/label';
import { ScrollArea } from '@/components/ui/scroll-area'; import { ScrollArea } from '@/components/ui/scroll-area';
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from '@/components/ui/dialog'; import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from '@/components/ui/dialog';
import { Upload } from 'lucide-react'; import { Upload } from 'lucide-react';
import { Checkbox } from '@/components/ui/checkbox';
// Alert system is handled by the parent component // Alert system is handled by the parent component
interface UploadDialogProps { interface UploadDialogProps {
@ -183,13 +184,18 @@ const UploadDialog: React.FC<UploadDialogProps> = ({
</div> </div>
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">
<input <Checkbox
type="checkbox"
id="useColpali" id="useColpali"
checked={useColpali} checked={useColpali}
onChange={(e) => setUseColpali(e.target.checked)} onCheckedChange={(checked) => setUseColpali(checked === true)}
/> />
<Label htmlFor="useColpali">Use Colpali</Label> <Label
htmlFor="useColpali"
className="cursor-pointer text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
onClick={() => setUseColpali(!useColpali)}
>
Use Colpali
</Label>
</div> </div>
</div> </div>