feat(epub): add Import EPUB entry to the home library

src/components/Library.tsx

@@ -1,10 +1,14 @@
 import { useEffect, useState, type MouseEvent } from "react";
-import { type BookSummary, deleteBook, exampleBook, listBooks, loadBook, newBook } from "../library";
+import { type BookSummary, deleteBook, exampleBook, listBooks, loadBook, newBook, saveBook } from "../library";
 import type { Book } from "../model/book";
+import { importEpub } from "../import/epub";
+import { isDesktop } from "../ipc";
 import { Icon } from "./Icon";
 
 export function Library({ onOpen }: { onOpen: (book: Book) => void }) {
   const [books, setBooks] = useState<BookSummary[]>([]);
+  const [busy, setBusy] = useState(false);
+  const [notice, setNotice] = useState<string | null>(null);
 
   const refresh = () => listBooks().then(setBooks).catch(() => setBooks([]));
   useEffect(() => {
@@ -17,6 +21,24 @@ export function Library({ onOpen }: { onOpen: (book: Book) => void }) {
     refresh();
   };
 
+  const handleImport = async () => {
+    if (!isDesktop) {
+      setNotice('Import runs in the desktop app only — open the window from "pnpm tauri dev".');
+      return;
+    }
+    setBusy(true);
+    try {
+      const book = await importEpub();
+      if (!book) return;
+      await saveBook(book);
+      onOpen(book);
+    } catch (e) {
+      setNotice(`Import failed: ${e}`);
+    } finally {
+      setBusy(false);
+    }
+  };
+
   return (
     <div className="library">
       <header className="library-head" data-tauri-drag-region />
@@ -25,6 +47,10 @@ export function Library({ onOpen }: { onOpen: (book: Book) => void }) {
           <Icon d="M12 5v14M5 12h14" size={20} />
           <span>New book</span>
         </button>
+        <button className="card card-action" onClick={handleImport} disabled={busy}>
+          <Icon d="M12 3v10m0 0l-4-4m4 4l4-4M5 19h14" size={20} />
+          <span>{busy ? "Importing…" : "Import EPUB"}</span>
+        </button>
         <button className="card card-example" onClick={() => onOpen(exampleBook())}>
           <span className="card-title">The Lighthouse</span>
           <span className="card-badge">Example</span>
@@ -39,6 +65,11 @@ export function Library({ onOpen }: { onOpen: (book: Book) => void }) {
           </div>
         ))}
       </div>
+      {notice && (
+        <div className="toast" onClick={() => setNotice(null)}>
+          {notice}
+        </div>
+      )}
     </div>
   );
 }