From 45f7b3e8d5c3e60024db7f5e42d00faff8895b5b Mon Sep 17 00:00:00 2001
From: Ender <enderyildirim@outlook.com>
Date: Fri, 24 Oct 2025 03:14:17 +0200
Subject: [PATCH] feat(admin): add minimal Drafts list to load existing drafts
 from /api/drafts

---
 apps/admin/src/components/EditorShell.tsx | 35 +++++++++++++++++++++++
 1 file changed, 35 insertions(+)

diff --git a/apps/admin/src/components/EditorShell.tsx b/apps/admin/src/components/EditorShell.tsx
index 4c36955..9513d9d 100644
--- a/apps/admin/src/components/EditorShell.tsx
+++ b/apps/admin/src/components/EditorShell.tsx
@@ -6,6 +6,7 @@ import { useEffect, useState } from 'react';
 export default function EditorShell({ onLogout }: { onLogout?: () => void }) {
   const [draft, setDraft] = useState<string>('');
   const [draftId, setDraftId] = useState<string | null>(null);
+  const [drafts, setDrafts] = useState<string[]>([]);
 
   useEffect(() => {
     const savedId = localStorage.getItem('voxblog_draft_id');
@@ -23,6 +24,15 @@ export default function EditorShell({ onLogout }: { onLogout?: () => void }) {
         } catch {}
       })();
     }
+    (async () => {
+      try {
+        const res = await fetch('/api/drafts');
+        if (res.ok) {
+          const data = await res.json();
+          if (Array.isArray(data.items)) setDrafts(data.items);
+        }
+      } catch {}
+    })();
   }, []);
 
   const saveDraft = async () => {
@@ -44,6 +54,18 @@ export default function EditorShell({ onLogout }: { onLogout?: () => void }) {
     } catch {}
   };
 
+  const loadDraft = async (id: string) => {
+    try {
+      const res = await fetch(`/api/drafts/${id}`);
+      if (!res.ok) return;
+      const data = await res.json();
+      setDraft(data.content || '');
+      setDraftId(data.id || id);
+      localStorage.setItem('voxblog_draft_id', data.id || id);
+      if (data.content) localStorage.setItem('voxblog_draft', data.content);
+    } catch {}
+  };
+
   return (
     <AdminLayout title="VoxBlog Admin" onLogout={onLogout}>
       <Typography variant="h4" sx={{ mb: 2 }}>
@@ -51,6 +73,19 @@ export default function EditorShell({ onLogout }: { onLogout?: () => void }) {
       </Typography>
       <Box sx={{ display: 'grid', gap: 3 }}>
         <Recorder onTranscript={(t) => setDraft(t)} />
+        <Box>
+          <Typography variant="subtitle1" sx={{ mb: 1 }}>Drafts</Typography>
+          <Stack direction="row" spacing={1} sx={{ flexWrap: 'wrap', mb: 1 }}>
+            {drafts.map(id => (
+              <Button key={id} size="small" variant={draftId === id ? 'contained' : 'outlined'} onClick={() => loadDraft(id)}>
+                {id.slice(0, 8)}
+              </Button>
+            ))}
+            {drafts.length === 0 && (
+              <Typography variant="body2">No drafts yet.</Typography>
+            )}
+          </Stack>
+        </Box>
         <Box>
           <Typography variant="subtitle1" sx={{ mb: 1 }}>Draft</Typography>
           <TextField