fix

frontend/src/pages/Docs/DocsPage.tsx

@@ -1,6 +1,7 @@
 import { useState, useEffect } from 'react';
 import { Topbar } from '../../components/layout/Topbar';
 import { Upload, Search } from 'lucide-react';
+import { UploadModal } from './UploadModal';
 
 interface Doc {
   id: string;
@@ -24,20 +25,39 @@ const MOCK_DOCS: Doc[] = [
   { id: '7', name: 'GB/T 42118-2022', status: 'risk', uploadedAt: '2025-08-30', chunks: 0, type: 'National Draft' },
 ];
 
-const STATUS_LABEL: Record<string, string> = { ok: 'Ready', warn: 'Embedding', risk: 'Failed', info: 'Pending' };
+const STATUS_LABEL: Record<string, string> = { ok: 'Ready', warn: 'Processing', risk: 'Failed', info: 'Pending' };
 const STATUS_MAP: Record<string, string> = { All: 'All', Ready: 'ok', Embedding: 'warn', Failed: 'risk', Pending: 'info' };
 
+// Map backend DocumentStatus enum values to frontend display status
+function backendStatus(s: string): Doc['status'] {
+  if (s === 'indexed') return 'ok';
+  if (s === 'failed') return 'risk';
+  if (s === 'parsed') return 'warn';   // chunked, awaiting embedding
+  return 'info';                        // pending / stored
+}
+
 export function DocsPage() {
   const [search, setSearch] = useState('');
   const [statusF, setStatusF] = useState('All');
   const [typeF, setTypeF] = useState('All types');
   const [selected, setSelected] = useState<Set<string>>(new Set());
   const [docs, setDocs] = useState<Doc[]>(MOCK_DOCS);
+  const [showUpload, setShowUpload] = useState(false);
 
   useEffect(() => {
-    fetch('/api/v1/documents')
+    fetch('/api/v1/documents/management-list')
       .then(r => r.json())
-      .then(d => { if (Array.isArray(d?.documents)) setDocs(d.documents); })
+      .then(d => {
+        if (!Array.isArray(d?.documents)) return;
+        setDocs(d.documents.map((item: Record<string, unknown>) => ({
+          id: item.doc_id as string,
+          name: item.doc_name as string,
+          status: backendStatus(item.status as string),
+          uploadedAt: ((item.updated_at as string) ?? '').slice(0, 10),
+          chunks: (item.chunk_count as number) ?? 0,
+          type: (item.regulation_type as string) || '—',
+        })));
+      })
       .catch(() => {});
   }, []);
 
@@ -73,7 +93,9 @@ export function DocsPage() {
                 onChange={e => setSearch(e.target.value)}
               />
             </div>
-            <button className="btn sm primary"><Upload size={13} />Upload document</button>
+            <button className="btn sm primary" onClick={() => setShowUpload(true)}>
+              <Upload size={13} />Upload document
+            </button>
           </>
         }
       />
@@ -136,6 +158,8 @@ export function DocsPage() {
           ))}
         </div>
       </div>
+
+      {showUpload && <UploadModal onClose={() => setShowUpload(false)} />}
     </div>
   );
 }