From 226cc38bf72db17bd6c46fc50200582e1b6f134f Mon Sep 17 00:00:00 2001
From: Penry <penry.tv@gmail.com>
Date: Wed, 27 May 2026 19:31:22 +0200
Subject: [PATCH] Started with Private List for 0.1.0-beta version

---
 .../Pages/GlobalList/GlobalList.razor         |   5 +-
 .../PrivateList/Components/EntityCard.razor   |  10 +
 .../Pages/PrivateList/PrivateList.razor       | 258 ++++--------------
 .../Pages/PrivateList/PrivateList.razor.css   |  61 -----
 4 files changed, 72 insertions(+), 262 deletions(-)
 create mode 100644 CouchLog/Components/Pages/PrivateList/Components/EntityCard.razor
 delete mode 100644 CouchLog/Components/Pages/PrivateList/PrivateList.razor.css

diff --git a/CouchLog/Components/Pages/GlobalList/GlobalList.razor b/CouchLog/Components/Pages/GlobalList/GlobalList.razor
index 4bcb4be..ded1ba3 100644
--- a/CouchLog/Components/Pages/GlobalList/GlobalList.razor
+++ b/CouchLog/Components/Pages/GlobalList/GlobalList.razor
@@ -1,7 +1,6 @@
 @page "/GlobalList"
 @rendermode InteractiveServer
 
-@using System.Security.Claims
 @using Microsoft.AspNetCore.Authorization
 @using CouchLog.Data
 @using Microsoft.AspNetCore.Identity
@@ -11,17 +10,17 @@
 @inject ApplicationDbContext CouchLogDb
 @inject UserManager<ApplicationUser> UserManager
 @inject AuthenticationStateProvider AuthenticationStateProvider
-@inject NavigationManager NavigationManager
 @inject IDialogService DialogService
 @inject ISnackbar Snackbar
 
 @attribute [Authorize]
 
 <PageTitle>GlobalList</PageTitle>
-
+@*
 TODO: Add Paging
 TODO: Add only reload for the pages
 TODO: Make Search work
+*@
 
 <MudContainer MaxWidth="MaxWidth.False">
     @*Top of the Page*@
diff --git a/CouchLog/Components/Pages/PrivateList/Components/EntityCard.razor b/CouchLog/Components/Pages/PrivateList/Components/EntityCard.razor
new file mode 100644
index 0000000..7cecc62
--- /dev/null
+++ b/CouchLog/Components/Pages/PrivateList/Components/EntityCard.razor
@@ -0,0 +1,10 @@
+@using CouchLog.Data
+
+<MudContainer>
+    <MudText Typo="Typo.h6">@PrivateEntity.GlobalEntity.Title</MudText>
+</MudContainer>
+
+@code
+{
+    [Parameter] public PrivateEntity PrivateEntity { get; set; } = null!;
+}
diff --git a/CouchLog/Components/Pages/PrivateList/PrivateList.razor b/CouchLog/Components/Pages/PrivateList/PrivateList.razor
index 293e060..4422a10 100644
--- a/CouchLog/Components/Pages/PrivateList/PrivateList.razor
+++ b/CouchLog/Components/Pages/PrivateList/PrivateList.razor
@@ -1,6 +1,7 @@
 @page "/PrivateList"
 @rendermode InteractiveServer
 
+@using CouchLog.Components.Pages.PrivateList.Components
 @using Microsoft.AspNetCore.Authorization
 @using CouchLog.Data
 @using Microsoft.AspNetCore.Identity
@@ -15,218 +16,79 @@
 
 <PageTitle>Private List</PageTitle>
 
-<div class="container-fluid mt-4 px-4">
-
-    <!-- Active Watching Section -->
-    @if (ActiveWatchingEntities.Any())
-    {
-        <div class="mb-5">
-            <h2 class="mb-4">Aktiv am Schauen</h2>
-            <div class="row g-4">
-                @foreach (var entity in ActiveWatchingEntities)
-                {
-                    @RenderEntityCard(entity)
-                }
-            </div>
-        </div>
-    }
-
-    <!-- Library / Completed Section -->
-    @if (LibraryEntities.Any())
-    {
-        <div class="mb-5">
-            <h2 class="mb-4">Bibliothek</h2>
-            <div class="row g-4">
-                @foreach (var entity in LibraryEntities)
-                {
-                    @RenderEntityCard(entity)
-                }
-            </div>
-        </div>
-    }
-
-    @if (!PrivateEntities.Any())
-    {
-        <div class="text-center text-muted py-5">
-            <p>Keine Einträge vorhanden.</p>
-        </div>
-    }
-</div>
+<MudContainer MaxWidth="MaxWidth.False">
+    @*Top of the Page*@
+    <MudContainer>
+        <MudStack Row="true" AlignItems="AlignItems.Center">
+            @*Page Title*@
+            <MudText Typo="Typo.h3" Style="font-weight: bold;">Private List</MudText>
+        </MudStack>
+    </MudContainer>
+    
+    <br/>
+    
+    <MudContainer>
+        <MudPaper Class="pa-2" Elevation="1">
+            <MudStack Row="true" AlignItems="AlignItems.Center" Spacing="2">
+                <MudTextField @bind-Value="_searchString"
+                              Placeholder="Search..."
+                              Adornment="Adornment.Start"
+                              AdornmentIcon="@Icons.Material.Filled.Search"
+                              Immediate="true"
+                              Variant="Variant.Outlined"
+                              Margin="Margin.Dense"
+                              Style="max-width: 300px;"/>
+            </MudStack>
+        </MudPaper>
+    </MudContainer>
+    
+    <br/>
+    
+    <MudContainer MaxWidth="MaxWidth.False">
+        <MudGrid Spacing="6" Justify="Justify.Center">
+            @foreach (var privateEntity in ActiveWatchingEntities)
+            {
+                <EntityCard PrivateEntity="privateEntity" />
+            }
+            @foreach (var privateEntity in LibraryEntities)
+            {
+                <EntityCard PrivateEntity="privateEntity" />
+            }
+        </MudGrid>
+    </MudContainer>
+</MudContainer>
 
 @code
 {
-    private List<PrivateEntity> PrivateEntities = new List<PrivateEntity>();
-    private List<UserWatchStatus> userWatchStatuses = new List<UserWatchStatus>();
-    ApplicationUser? AppUser = new();
+    //Search
+    private string _searchString;
+    
+    //User
+    private ApplicationUser? _appUser;
+    
+    //Entities
+    private List<PrivateEntity> _privateEntities = [];
+    private List<UserWatchStatus> _userWatchStatuses = [];
 
-    private List<PrivateEntity> ActiveWatchingEntities => PrivateEntities.Where(x => x.UserWatchStatus?.Name == "Watching").ToList();
-    private List<PrivateEntity> LibraryEntities => PrivateEntities.Where(x => x.UserWatchStatus?.Name != "Watching").ToList();
+    private List<PrivateEntity> ActiveWatchingEntities => _privateEntities.Where(x => x.UserWatchStatus?.Name == "Watching").ToList();
+    private List<PrivateEntity> LibraryEntities => _privateEntities.Where(x => x.UserWatchStatus?.Name != "Watching").ToList();
 
     protected override async Task OnInitializedAsync()
     {
-        var AuthState = await AuthenticationStateProvider.GetAuthenticationStateAsync();
-        AppUser = await UserManager.GetUserAsync(AuthState.User);
+        var authState = await AuthenticationStateProvider.GetAuthenticationStateAsync();
+        _appUser = await UserManager.GetUserAsync(authState.User);
 
-        if (AppUser != null)
+        if (_appUser != null)
         {
-            PrivateEntities = await CouchLogDB.PrivateEntities
-                .Where(x => x.UserId == AppUser.Id)
+            _privateEntities = await CouchLogDB.PrivateEntities
+                .Where(x => x.UserId == _appUser.Id)
                 .Include(x => x.GlobalEntity)
                 .Include(x => x.UserWatchStatus)
                 .Include(x => x.GlobalEntity.MediaType)
-                .OrderByDescending(Entity => Entity.LastChange ?? Entity.CreationTime)
+                .OrderByDescending(entity => entity.LastChange ?? entity.CreationTime)
                 .ToListAsync();
 
-            userWatchStatuses = await CouchLogDB.UserWatchStatuses.OrderByDescending(Entity => Entity.Id).ToListAsync();
-        }
-    }
-
-    private RenderFragment RenderEntityCard(PrivateEntity Entity) => __builder =>
-    {
-        <div class="col-12 col-lg-6 col-xxl-4">
-            <div class="card shadow-sm border-0 overflow-hidden private-entity-card">
-                <div class="row g-0 h-100">
-
-                    <div class="col-auto" style="flex: 0 0 auto; min-width: 120px; max-width: 150px;">
-                        @if (!string.IsNullOrEmpty(Entity.GlobalEntity?.PicturePath))
-                        {
-                            <img src="/@Entity.GlobalEntity.PicturePath"
-                                 class="entity-img w-100 h-100"
-                                 style="object-fit: cover;"
-                                 alt="@Entity.GlobalEntity.Title">
-                        }
-                        else
-                        {
-                            <div class="d-flex align-items-center justify-content-center h-100 bg-light text-muted small">
-                                Kein Bild
-                            </div>
-                        }
-                    </div>
-
-                    <!-- Content -->
-                    <div class="col" style="min-width: 0;">
-                        <div class="card-body d-flex flex-column h-100 py-2 px-3">
-
-                            <!-- Header -->
-                            <div class="d-flex justify-content-between align-items-start mb-2">
-                                <div style="min-width: 0; flex: 1;">
-                                    <h5 class="card-title fw-bold mb-0" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
-                                        @Entity.GlobalEntity?.Title
-                                    </h5>
-                                    <small class="text-muted meta-text">
-                                        @Entity.CreationTime.ToShortDateString()
-                                    </small>
-                                </div>
-
-                                <div class="dropdown ms-2" style="flex-shrink: 0;">
-                                    <button class="btn btn-link menu-btn" type="button" data-bs-toggle="modal" data-bs-target="#modal-@Entity.Id">
-                                        &#8942;
-                                    </button>
-                                </div>
-                            </div>
-
-                            <!-- Watch Status Dropdown -->
-                            <select class="form-select"
-                                    value="@Entity.UserWatchStatusId"
-                                    @onchange="@(e => UpdateWatchStatus(Entity, e.Value))">
-                                @foreach (var status in userWatchStatuses)
-                                {
-                                    <option value="@status.Id">@status.Name</option>
-                                }
-                            </select>
-
-                            @if (Entity.GlobalEntity?.MediaType.Name == "Series" || Entity.GlobalEntity?.MediaType.Name == "Anime")
-                            {
-                                <select class="form-select" value="@Entity.Season" @onchange="@(e => UpdateSeason(Entity, e.Value))">
-                                    @{
-                                        int currentSeason = Entity.Season ?? 1;
-                                        int startOffsetSeason = currentSeason > 1 ? -1 : 0;
-                                    }
-                                    @for (int i = startOffsetSeason; i <= 5; i++)
-                                    {
-                                        int season = currentSeason + i;
-                                        <option value="@season">Staffel @season</option>
-                                    }
-                                </select>
-
-                                <select class="form-select" value="@Entity.Episode" @onchange="@(e => UpdateEpisode(Entity, e.Value))">
-                                    @{
-                                        int currentEpisode = Entity.Episode ?? 1;
-                                        int startOffsetEpisode = currentEpisode > 1 ? -1 : 0;
-                                    }
-                                    @for (int i = startOffsetEpisode; i <= 5; i++)
-                                    {
-                                        int episode = currentEpisode + i;
-                                        <option value="@episode">Episode @episode</option>
-                                    }
-                                </select>
-                            }
-
-                            <!-- Footer Button -->
-                            <div class="mt-auto d-flex justify-content-end">
-                                <button class="btn btn-outline-secondary btn-sm btn-details" type="button">Details</button>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-
-            <!-- Modal -->
-            <div class="modal fade" id="modal-@Entity.Id" tabindex="-1" aria-hidden="true">
-                <div class="modal-dialog modal-dialog-centered">
-                    <div class="modal-content">
-                        <div class="modal-header">
-                            <h5 class="modal-title">Optionen</h5>
-                            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-                        </div>
-                        <div class="modal-body">
-                            <button type="button" class="btn btn-danger" @onclick="@(e => RemoveEntityFromPrivateList(Entity))" data-bs-dismiss="modal">Aus PrivateList entfernen</button>
-                        </div>
-                        <div class="modal-footer">
-                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Schließen</button>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    };
-
-    private async Task RemoveEntityFromPrivateList(PrivateEntity entity)
-    {
-        //Delete DB
-        CouchLogDB.PrivateEntities.Remove(entity);
-        await CouchLogDB.SaveChangesAsync();
-
-        //Delete Memory List
-        PrivateEntities.Remove(entity);
-    }
-
-    private async Task UpdateWatchStatus(PrivateEntity entity, object? newValue)
-    {
-        if (int.TryParse(newValue?.ToString(), out int newId))
-        {
-            entity.UserWatchStatusId = newId;
-            entity.UserWatchStatus = userWatchStatuses.FirstOrDefault(s => s.Id == newId);
-            await CouchLogDB.SaveChangesAsync();
-        }
-    }
-
-    private async Task UpdateSeason(PrivateEntity entity, object? newSeasonValue)
-    {
-        if (int.TryParse(newSeasonValue?.ToString(), out int newSeason))
-        {
-            entity.Season = newSeason;
-            entity.Episode = 1;
-            await CouchLogDB.SaveChangesAsync();
-        }
-    }
-
-    private async Task UpdateEpisode(PrivateEntity entity, object? newEpisodeValue)
-    {
-        if (int.TryParse(newEpisodeValue?.ToString(), out int newEpisode))
-        {
-            entity.Episode = newEpisode;
-            await CouchLogDB.SaveChangesAsync();
+            _userWatchStatuses = await CouchLogDB.UserWatchStatuses.OrderByDescending(entity => entity.Id).ToListAsync();
         }
     }
 }
\ No newline at end of file
diff --git a/CouchLog/Components/Pages/PrivateList/PrivateList.razor.css b/CouchLog/Components/Pages/PrivateList/PrivateList.razor.css
deleted file mode 100644
index 4fd9f29..0000000
--- a/CouchLog/Components/Pages/PrivateList/PrivateList.razor.css
+++ /dev/null
@@ -1,61 +0,0 @@
-/* PrivateList.razor.css */
-
-.private-entity-card {
-    height: 220px;
-    background-color: #fff;
-    transition: transform 0.2s ease, box-shadow 0.2s ease;
-}
-
-    .private-entity-card:hover {
-        transform: translateY(-3px);
-        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
-    }
-
-/* 
-   NEU: Feste Breite für das Bild! 
-   150px Breite bei 220px Höhe passt perfekt für Poster.
-*/
-.img-wrapper {
-    width: 150px;
-    background-color: #f0f2f5;
-    position: relative;
-}
-
-/* Bild füllt den Wrapper komplett aus */
-.entity-img {
-    object-fit: cover;
-    width: 100%;
-    height: 100%;
-    /* Positioniert das Bild oben, falls das Format doch leicht abweicht (Köpfe/Titel sind meist oben) */
-    object-position: top center;
-}
-
-.text-truncate-multiline {
-    display: -webkit-box;
-    -webkit-line-clamp: 3;
-    -webkit-box-orient: vertical;
-    overflow: hidden;
-    line-height: 1.2;
-}
-
-.meta-text {
-    font-size: 0.75rem;
-    white-space: nowrap;
-}
-
-.menu-btn {
-    color: #212529;
-    text-decoration: none;
-    font-size: 1.2rem;
-    line-height: 1;
-    padding: 0 0.25rem;
-}
-
-    .menu-btn:hover {
-        color: #000;
-    }
-
-.btn-details {
-    font-size: 0.7rem;
-    padding: 0.2rem 0.6rem;
-}