fix(web): admin des bibliothèques — UX, gestion d'erreur, styles

- web: AdminPage (admin bibliothèques), client API, styles
- web: nginx

Refs: #15

apps/web/src/pages/AdminPage.tsx

@@ -1,5 +1,5 @@
 import { FormEvent, useEffect, useState } from "react";
-import { Play, Plus } from "lucide-react";
+import { Play, Plus, Trash2 } from "lucide-react";
 import type { JobDto, LibraryDto, UserDto } from "@readabook/shared";
 import { api, getApiFallback } from "../api/client";
 import { EmptyState, ErrorRibbon, LoadingState, Panel } from "../components/ui";
@@ -12,6 +12,7 @@ export function AdminPage() {
   const [name, setName] = useState("Bibliotheque locale");
   const [path, setPath] = useState("/library");
   const [error, setError] = useState<string>();
+  const [success, setSuccess] = useState<string>();
 
   async function refresh() {
     setLoading(true);
@@ -51,9 +52,11 @@ export function AdminPage() {
   async function createLibrary(event: FormEvent) {
     event.preventDefault();
     setError(undefined);
+    setSuccess(undefined);
     try {
       await api.createLibrary({ name, path, enabled: true });
       await refresh();
+      setSuccess(`Bibliothèque "${name}" ajoutée.`);
     } catch (createError) {
       const fallback = getApiFallback<LibraryDto>(createError);
       if (fallback) setLibraries((current) => [fallback, ...current]);
@@ -63,9 +66,11 @@ export function AdminPage() {
 
   async function scan(id: number) {
     setError(undefined);
+    setSuccess(undefined);
     try {
       await api.scanLibrary(id);
       await refresh();
+      setSuccess("Scan demandé.");
     } catch (scanError) {
       const fallback = getApiFallback<JobDto>(scanError);
       if (fallback) setJobs((current) => [fallback, ...current]);
@@ -73,6 +78,23 @@ export function AdminPage() {
     }
   }
 
+  async function deleteLibrary(library: LibraryDto) {
+    const confirmed = window.confirm(
+      `Supprimer la bibliothèque "${library.name}" ?\n\nLes livres restent sur le disque. ReadaBook supprimera seulement cette bibliothèque du catalogue.`
+    );
+    if (!confirmed) return;
+
+    setError(undefined);
+    setSuccess(undefined);
+    try {
+      await api.deleteLibrary(library.id);
+      setLibraries((current) => current.filter((item) => item.id !== library.id));
+      setSuccess(`Bibliothèque "${library.name}" supprimée. Les fichiers disque n'ont pas été supprimés.`);
+    } catch (deleteError) {
+      setError(deleteError instanceof Error ? deleteError.message : "Suppression impossible");
+    }
+  }
+
   return (
     <div className="page-grid">
       <Panel className="span-2">
@@ -81,6 +103,7 @@ export function AdminPage() {
           <span>{loading ? "chargement" : `${users.length} comptes`}</span>
         </div>
         <ErrorRibbon message={error} />
+        {success && <div className="success-ribbon">{success}</div>}
         {error && (
           <div className="retry-row">
             <span>Les formulaires restent disponibles.</span>
@@ -91,12 +114,14 @@ export function AdminPage() {
         )}
         <form className="admin-form" onSubmit={createLibrary}>
           <label>
-            Nom du rayon
+            Nom de la bibliothèque
             <input value={name} onChange={(event) => setName(event.target.value)} required />
+            <small>Nom affiché dans l’application, par exemple : Romans, BD, Documentation.</small>
           </label>
           <label>
-            Chemin serveur
+            Chemin du dossier
             <input value={path} onChange={(event) => setPath(event.target.value)} required />
+            <small>Emplacement réel sur le serveur où ReadaBook lit les livres.</small>
           </label>
           <button className="primary-button" type="submit">
             <Plus size={17} />
@@ -135,13 +160,17 @@ export function AdminPage() {
               <div key={library.id}>
                 <div>
                   <strong>{library.name}</strong>
-                  <span>{library.path}</span>
+                  <span>Chemin : {library.path}</span>
                 </div>
                 <span>{library.enabled ? "actif" : "pause"}</span>
                 <button className="ghost-button" onClick={() => scan(library.id)}>
                   <Play size={16} />
                   Scanner
                 </button>
+                <button className="ghost-button danger-button" onClick={() => void deleteLibrary(library)}>
+                  <Trash2 size={16} />
+                  Supprimer
+                </button>
               </div>
             ))}
           </div>