From 770d38b72caa92ae9e38bebfd425eed4ac282c2d Mon Sep 17 00:00:00 2001
From: Hyungi Ahn <hyungiahn@Hyungiui-MacBookPro.local>
Date: Fri, 3 Apr 2026 13:14:20 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EB=AC=B8=EC=84=9C=20=EC=82=AD=EC=A0=9C?=
 =?UTF-8?q?=20=EA=B8=B0=EB=8A=A5=20=E2=80=94=20=EC=A0=95=EB=B3=B4=20?=
 =?UTF-8?q?=ED=8C=A8=EB=84=90=EC=97=90=EC=84=9C=20=ED=99=95=EC=9D=B8=20?=
 =?UTF-8?q?=ED=9B=84=20=EC=82=AD=EC=A0=9C=20(=ED=8C=8C=EC=9D=BC+DB)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../src/lib/components/PreviewPanel.svelte    | 47 ++++++++++++++++++-
 frontend/src/routes/documents/+page.svelte    |  2 +-
 2 files changed, 46 insertions(+), 3 deletions(-)

diff --git a/frontend/src/lib/components/PreviewPanel.svelte b/frontend/src/lib/components/PreviewPanel.svelte
index 6c14633..eeecdc4 100644
--- a/frontend/src/lib/components/PreviewPanel.svelte
+++ b/frontend/src/lib/components/PreviewPanel.svelte
@@ -1,11 +1,11 @@
 <script>
-  import { X, ExternalLink, Plus, Save } from 'lucide-svelte';
+  import { X, ExternalLink, Plus, Save, Trash2 } from 'lucide-svelte';
   import { api } from '$lib/api';
   import { addToast } from '$lib/stores/ui';
   import FormatIcon from './FormatIcon.svelte';
   import TagPill from './TagPill.svelte';
 
-  let { doc, onclose } = $props();
+  let { doc, onclose, ondelete = () => {} } = $props();
 
   // 메모 상태
   let noteText = $state('');
@@ -16,6 +16,24 @@
   let newTag = $state('');
   let tagEditing = $state(false);
 
+  // 삭제
+  let deleteConfirm = $state(false);
+  let deleting = $state(false);
+
+  async function deleteDoc() {
+    deleting = true;
+    try {
+      await api(`/documents/${doc.id}?delete_file=true`, { method: 'DELETE' });
+      addToast('success', '문서 삭제됨');
+      ondelete();
+    } catch (err) {
+      addToast('error', '삭제 실패');
+    } finally {
+      deleting = false;
+      deleteConfirm = false;
+    }
+  }
+
   // 편집 URL
   let editUrlText = $state('');
   let editUrlEditing = $state(false);
@@ -273,5 +291,30 @@
         </div>
       </dl>
     </div>
+
+    <!-- 삭제 -->
+    <div class="pt-2 border-t border-[var(--border)]">
+      {#if deleteConfirm}
+        <div class="flex items-center gap-2">
+          <span class="text-xs text-[var(--error)]">정말 삭제?</span>
+          <button
+            onclick={deleteDoc}
+            disabled={deleting}
+            class="px-2 py-1 text-xs bg-[var(--error)] text-white rounded disabled:opacity-50"
+          >{deleting ? '삭제 중...' : '확인'}</button>
+          <button
+            onclick={() => deleteConfirm = false}
+            class="px-2 py-1 text-xs text-[var(--text-dim)]"
+          >취소</button>
+        </div>
+      {:else}
+        <button
+          onclick={() => deleteConfirm = true}
+          class="flex items-center gap-1 text-xs text-[var(--text-dim)] hover:text-[var(--error)]"
+        >
+          <Trash2 size={12} /> 문서 삭제
+        </button>
+      {/if}
+    </div>
   </div>
 </aside>
diff --git a/frontend/src/routes/documents/+page.svelte b/frontend/src/routes/documents/+page.svelte
index d4cf1f6..b53eb68 100644
--- a/frontend/src/routes/documents/+page.svelte
+++ b/frontend/src/routes/documents/+page.svelte
@@ -258,7 +258,7 @@
       aria-label="정보 패널 닫기"
     ></button>
     <div class="absolute right-0 top-0 bottom-0 z-50 w-[320px] shadow-xl">
-      <PreviewPanel doc={selectedDoc} onclose={() => infoPanelOpen = false} />
+      <PreviewPanel doc={selectedDoc} onclose={() => infoPanelOpen = false} ondelete={() => { selectedDoc = null; infoPanelOpen = false; loadDocuments(); }} />
     </div>
   </div>
 {/if}