feat: Add Book Ingestion Modal for local EPUB metadata extraction (fixes #33)

2026-05-10 20:00:14 +02:00
parent f433e3c74a
commit a6a5fc683c
8 changed files with 399 additions and 1 deletions
@@ -1,9 +1,11 @@
 using FluentResults;
 using NexusReader.Application.Queries.Reader;
+using System.IO;

 namespace NexusReader.Application.Abstractions.Services;

 public interface IEpubService
 {
    Task<Result<ReaderPageViewModel>> GetEpubContentAsync(int chapterIndex, string? userId = null);
+    Task<Result<LocalEpubMetadata>> ExtractMetadataAsync(Stream epubStream);
 }
@@ -0,0 +1,7 @@
+namespace NexusReader.Application.Queries.Reader;
+
+public record LocalEpubMetadata(
+    string Title, 
+    string Author, 
+    byte[]? CoverImage = null
+);
@@ -215,4 +215,19 @@ public class EpubService : IEpubService
        }
        return null;
    }
+    public async Task<Result<LocalEpubMetadata>> ExtractMetadataAsync(Stream epubStream)
+    {
+        try
+        {
+            using var bookRef = await EpubReader.OpenBookAsync(epubStream);
+            var title = bookRef.Title ?? "Unknown Title";
+            var author = bookRef.Author ?? "Unknown Author";
+            byte[]? cover = await bookRef.ReadCoverAsync();
+            return Result.Ok(new LocalEpubMetadata(title, author, cover));
+        }
+        catch (Exception ex)
+        {
+            return Result.Fail(new Error($"Failed to extract EPUB metadata locally: {ex.Message}").CausedBy(ex));
+        }
+    }
 }
@@ -0,0 +1,149 @@
+@using Microsoft.AspNetCore.Components.Forms
+@using NexusReader.Application.Abstractions.Services
+@using NexusReader.Application.Queries.Reader
+@inject IEpubService EpubService
+@inject ILogger<BookIngestionModal> Logger
+
+@if (IsOpen)
+{
+    <div class="modal-backdrop" @onclick="CloseModal">
+        <div class="modal-content glass-panel" @onclick:stopPropagation>
+            <div class="modal-header">
+                <h2>Add New Book</h2>
+                <button class="close-btn" @onclick="CloseModal">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
+                </button>
+            </div>
+
+            <div class="modal-body">
+                @if (IsParsing)
+                {
+                    <div class="parsing-state shimmer">
+                        <div class="shimmer-content">
+                            <div class="spinner"></div>
+                            <p>Scanning metadata...</p>
+                        </div>
+                    </div>
+                }
+                else if (Metadata != null)
+                {
+                    <div class="metadata-state">
+                        <div class="metadata-info">
+                            <h3>@Metadata.Title</h3>
+                            <p class="author">@Metadata.Author</p>
+                        </div>
+                        <div class="actions">
+                            <button class="btn btn-primary">Confirm & Upload</button>
+                            <button class="btn btn-secondary" @onclick="Reset">Cancel</button>
+                        </div>
+                    </div>
+                }
+                else
+                {
+                    <div class="upload-state @(_isDragging ? "drag-over" : "")" 
+                         @ondragenter="OnDragEnter" 
+                         @ondragleave="OnDragLeave">
+                        <label for="epub-upload" class="drop-zone">
+                            <div class="drop-zone-content">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="17 8 12 3 7 8"></polyline><line x1="12" y1="3" x2="12" y2="15"></line></svg>
+                                <p>Drag and drop your .epub file here</p>
+                                <span>or click to browse</span>
+                            </div>
+                            <InputFile id="epub-upload" OnChange="HandleFileSelected" accept=".epub" class="file-input" />
+                        </label>
+                    </div>
+                }
+                
+                @if (!string.IsNullOrEmpty(ErrorMessage))
+                {
+                    <div class="error-message">
+                        @ErrorMessage
+                    </div>
+                }
+            </div>
+        </div>
+    </div>
+}
+
+@code {
+    [Parameter]
+    public bool IsOpen { get; set; }
+
+    [Parameter]
+    public EventCallback<bool> IsOpenChanged { get; set; }
+
+    private bool _isDragging;
+    private bool IsParsing { get; set; }
+    private LocalEpubMetadata? Metadata { get; set; }
+    private string? ErrorMessage { get; set; }
+    
+    // Allow up to 50 MB
+    private const long MaxFileSize = 50 * 1024 * 1024;
+
+    private async Task CloseModal()
+    {
+        IsOpen = false;
+        Reset();
+        await IsOpenChanged.InvokeAsync(false);
+    }
+
+    private void Reset()
+    {
+        IsParsing = false;
+        Metadata = null;
+        ErrorMessage = null;
+        _isDragging = false;
+    }
+
+    private void OnDragEnter() => _isDragging = true;
+    private void OnDragLeave() => _isDragging = false;
+
+    private async Task HandleFileSelected(InputFileChangeEventArgs e)
+    {
+        _isDragging = false;
+        var file = e.File;
+        
+        if (file == null) return;
+        
+        if (!file.Name.EndsWith(".epub", StringComparison.OrdinalIgnoreCase))
+        {
+            ErrorMessage = "Only .epub files are supported.";
+            return;
+        }
+
+        ErrorMessage = null;
+        IsParsing = true;
+        StateHasChanged();
+
+        try
+        {
+            using var stream = file.OpenReadStream(MaxFileSize);
+            
+            // In Blazor WASM, we might need to copy to memory stream first for synchronous parsing if the parser doesn't stream well over interop
+            using var memoryStream = new MemoryStream();
+            await stream.CopyToAsync(memoryStream);
+            memoryStream.Position = 0;
+
+            var result = await EpubService.ExtractMetadataAsync(memoryStream);
+
+            if (result.IsSuccess)
+            {
+                Metadata = result.Value;
+            }
+            else
+            {
+                ErrorMessage = result.Errors.FirstOrDefault()?.Message ?? "Failed to parse EPUB.";
+            }
+        }
+        catch (Exception ex)
+        {
+            Logger.LogError(ex, "Error uploading EPUB");
+            ErrorMessage = "An unexpected error occurred.";
+        }
+        finally
+        {
+            IsParsing = false;
+            StateHasChanged();
+        }
+    }
+}
@@ -0,0 +1,202 @@
+.modal-backdrop {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100vw;
+    height: 100vh;
+    background-color: rgba(0, 0, 0, 0.6);
+    backdrop-filter: blur(8px);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 1000;
+    animation: fadeIn 0.3s ease-out;
+}
+
+.modal-content {
+    background-color: #121212;
+    border: 1px solid rgba(var(--nexus-accent-rgb, 0, 255, 170), 0.3);
+    box-shadow: 0 0 20px rgba(var(--nexus-accent-rgb, 0, 255, 170), 0.1);
+    border-radius: 12px;
+    width: 90%;
+    max-width: 600px;
+    padding: 2rem;
+    display: flex;
+    flex-direction: column;
+    gap: 1.5rem;
+    position: relative;
+    overflow: hidden;
+}
+
+.modal-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.modal-header h2 {
+    margin: 0;
+    font-family: var(--nexus-font-sans);
+    color: var(--nexus-text);
+    font-size: 1.5rem;
+}
+
+.close-btn {
+    background: none;
+    border: none;
+    color: var(--nexus-text-muted, #888);
+    cursor: pointer;
+    transition: color 0.2s;
+}
+
+.close-btn:hover {
+    color: var(--nexus-accent, #00ffaa);
+}
+
+.modal-body {
+    min-height: 250px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+/* Upload State */
+.upload-state {
+    flex: 1;
+    display: flex;
+}
+
+.drop-zone {
+    flex: 1;
+    border: 2px dashed rgba(255, 255, 255, 0.1);
+    border-radius: 8px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    cursor: pointer;
+    transition: all 0.3s ease;
+    background: rgba(255, 255, 255, 0.02);
+}
+
+.drop-zone:hover, .upload-state.drag-over .drop-zone {
+    border-color: var(--nexus-accent, #00ffaa);
+    background: rgba(var(--nexus-accent-rgb, 0, 255, 170), 0.05);
+}
+
+.drop-zone-content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 1rem;
+    color: var(--nexus-text-muted, #888);
+}
+
+.drop-zone-content svg {
+    color: var(--nexus-accent, #00ffaa);
+    opacity: 0.8;
+}
+
+.drop-zone-content p {
+    margin: 0;
+    font-size: 1.1rem;
+    color: var(--nexus-text);
+}
+
+.file-input {
+    display: none;
+}
+
+/* Parsing State */
+.parsing-state {
+    flex: 1;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    border-radius: 8px;
+    background: rgba(255, 255, 255, 0.03);
+    position: relative;
+    overflow: hidden;
+}
+
+.shimmer::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: -100%;
+    width: 50%;
+    height: 100%;
+    background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.05), transparent);
+    animation: shimmer 2s infinite;
+}
+
+.shimmer-content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 1rem;
+}
+
+.spinner {
+    width: 40px;
+    height: 40px;
+    border: 3px solid rgba(var(--nexus-accent-rgb, 0, 255, 170), 0.2);
+    border-top-color: var(--nexus-accent, #00ffaa);
+    border-radius: 50%;
+    animation: spin 1s linear infinite;
+}
+
+.parsing-state p {
+    color: var(--nexus-text);
+    font-family: var(--nexus-font-mono, monospace);
+    font-size: 0.9rem;
+    letter-spacing: 1px;
+}
+
+/* Metadata State */
+.metadata-state {
+    display: flex;
+    flex-direction: column;
+    gap: 2rem;
+}
+
+.metadata-info {
+    text-align: center;
+}
+
+.metadata-info h3 {
+    margin: 0 0 0.5rem 0;
+    color: var(--nexus-text);
+    font-size: 1.25rem;
+}
+
+.metadata-info .author {
+    margin: 0;
+    color: var(--nexus-text-muted, #888);
+}
+
+.actions {
+    display: flex;
+    gap: 1rem;
+    justify-content: center;
+}
+
+.error-message {
+    margin-top: 1rem;
+    color: #ff5555;
+    text-align: center;
+    font-size: 0.9rem;
+}
+
+@keyframes fadeIn {
+    from { opacity: 0; }
+    to { opacity: 1; }
+}
+
+@keyframes shimmer {
+    100% { left: 200%; }
+}
+
+@keyframes spin {
+    to { transform: rotate(360deg); }
+}
@@ -1,16 +1,19 @@
@page "/library"
@attribute [Authorize]
+@using NexusReader.UI.Shared.Components.Organisms

 <div class="library-page">
    <header class="library-header">
        <h1>Biblioteka</h1>
        <AuthorizeView Roles="Admin, ContentManager">
-            <NexusButton Class="add-book-trigger">
+            <NexusButton Class="add-book-trigger" OnClick="() => _isModalOpen = true">
                [+] Add New Book
            </NexusButton>
        </AuthorizeView>
    </header>
    
+    <BookIngestionModal @bind-IsOpen="_isModalOpen" />
+    
    <div class="library-content glass-panel">
        <div class="empty-state">
            <p>Twoja kolekcja książek i dokumentów pojawi się tutaj wkrótce.</p>
@@ -51,3 +54,7 @@
        opacity: 0.6;
    }
 </style>
+
+@code {
+    private bool _isModalOpen;
+}
@@ -13,6 +13,7 @@
    <PackageReference Include="MediatR" Version="12.1.1" />
    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.7" />
    <PackageReference Include="Microsoft.Extensions.Http" Version="10.0.7" />
+    <PackageReference Include="VersOne.Epub" Version="3.3.6" />
  </ItemGroup>

  <ItemGroup>
@@ -35,4 +35,19 @@ public class WasmEpubService : IEpubService
            return Result.Fail(new Error($"Network or parsing error: {ex.Message}").CausedBy(ex));
        }
    }
+    public async Task<Result<LocalEpubMetadata>> ExtractMetadataAsync(Stream epubStream)
+    {
+        try
+        {
+            using var bookRef = await VersOne.Epub.EpubReader.OpenBookAsync(epubStream);
+            var title = bookRef.Title ?? "Unknown Title";
+            var author = bookRef.Author ?? "Unknown Author";
+            byte[]? cover = await bookRef.ReadCoverAsync();
+            return Result.Ok(new LocalEpubMetadata(title, author, cover));
+        }
+        catch (Exception ex)
+        {
+            return Result.Fail(new Error($"Failed to extract EPUB metadata locally: {ex.Message}").CausedBy(ex));
+        }
+    }
 }